/****************************************************/
/* OVERALL RESET STYLES */
/*****************************************************************************/

/* RESET */

@import url(https://fonts.googleapis.com/css?family=Lato:700italic);


a{
    text-decoration:none;
    color:inherit;
}


/* CONTENT */

#container{
    text-align:center;
    width:600px;
    margin:100px auto;
}

#container h3{
    font-family: 'Lato', sans-serif;
    font-size:30px;
    color:#555;
}

.envato{
    margin:0 10px;
    outline:none;
    border:none;
    background-color:#666;
    color:#fff;
    font-family: 'Lato', sans-serif;
    height:50px;
    width:135px;
    cursor:pointer;
}

.rate{
    font-size:15px;
}

/****************************************************/
/* OVERALL MENUS STYLES */
/*****************************************************************************/

/* BODY */



/* OVERALL MENUS */

.srl_menu {
  margin-top: 163px;
  height: 100%;
  z-index: 1;
}

.prl_menu{
    margin-top:450px;
    height:100%;
}

.list_menu{
    list-style: none;
    padding: 0;
    margin: 0;
    width: 197px;
    height: 395px;
}

.list_menub{
  list-style:none;
  padding:0;
	margin:0px;
  width:197px;
  height:175px;
}

.list_menu h2{
  color:#f5f5f5;
  padding:12px 0 0 20px;
  height:32px;
    font-size:19px;
}

.list_menu li{
    color: #f5f5f5;
    font-weight: 600;
}

/* BUTTONS */


/*.button img{
    margin-right:2px;
    margin-top:4px;
}*/

.sbutton{
   /*background-color:#e74c3c;
    border-bottom:solid 1px #c0392b;*/
	background:none
}

.pbutton{
    background-color:#3498db;
    border-bottom:solid 1px #2980b9;
}

/* TRANSITIONS */

.slide_left_open,.slide_left_close,.slide_right_open,.slide_right_close,.slide_top_open,.slide_top_close,.push_left_open,.push_left_close,.body_close,.body_open_left,.body_open_right,.push_right_open,.push_right_close{
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

/* MEDIA QUERIE EXAMPLES */

@media only screen and (max-width : 480px) {

    #slide_top > nav a{
        padding: 20px 0 25px 0;
    }

}




/* SLIDE LEFT MENU */

.slide_left_close{
    position:fixed;
    left:-197px;
}

.slide_left_open{
    left:-20px;
}



#slide_left > ul{
    float:left;
}

#slide_left > ul > h2{
    border-bottom:solid 1px #c0392b;
}


#slide_left ul li:hover{

}

/* SLIDE RIGHT MENU */

.slide_right_close{
    position: fixed;
    right: -198px;
}

.slide_right_closeb{
    position: fixed;
    right: -198px;
}

.slide_right_open{
    right:0px;
}

#slide_right > ul{
    float:right;
}

#slide_right > ul > h2{
    border-bottom:solid 1px #c0392b;
}
#slide_right ul {/* margin-right:20px;*/}
#slide_right ul li{
}

#slide_right ul li:hover{

}

.button_right_download , .button_left_download {
  width: 175px;
  height: 45px;
  margin-right: -66px;
  margin-top: 65px;
  background-color: red;
  -ms-transform: rotate(270deg); /* IE 9 */
  -webkit-transform: rotate(270deg); /* Safari 3-8 */
  transform: rotate(270deg);
  border: none;
}

.button_left_download{
  margin-left: -66px;
}

.button_right_download, .button_left_download {
background: rgba(59,0,0,1);
background: -moz-linear-gradient(left, rgba(59,0,0,1) 0%, rgba(199,0,0,1) 80%, rgba(230,0,0,1) 97%, rgba(189,0,0,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(59,0,0,1)), color-stop(80%, rgba(199,0,0,1)), color-stop(97%, rgba(230,0,0,1)), color-stop(100%, rgba(189,0,0,1)));
background: -webkit-linear-gradient(left, rgba(59,0,0,1) 0%, rgba(199,0,0,1) 80%, rgba(230,0,0,1) 97%, rgba(189,0,0,1) 100%);
background: -o-linear-gradient(left, rgba(59,0,0,1) 0%, rgba(199,0,0,1) 80%, rgba(230,0,0,1) 97%, rgba(189,0,0,1) 100%);
background: -ms-linear-gradient(left, rgba(59,0,0,1) 0%, rgba(199,0,0,1) 80%, rgba(230,0,0,1) 97%, rgba(189,0,0,1) 100%);
background: linear-gradient(to right, rgba(59,0,0,1) 0%, rgba(199,0,0,1) 80%, rgba(230,0,0,1) 97%, rgba(189,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3b0000', endColorstr='#bd0000', GradientType=1 );
border:1px solid #e91010;	
}

.button_right_maya{
  right:-8px; position:fixed; height:175px; width:50px
}

.button_rightb_maya{
    right: -8px;
    position: fixed;
    height: 175px;
    width: 50px;
    margin-top: 65px;
  }

.button_rightb_download {
  width: 175px;
  height: 45px;
  margin-right: -66px;
  margin-top: 240px;
  background-color: red;
  -ms-transform: rotate(270deg); /* IE 9 */
  -webkit-transform: rotate(270deg); /* Safari 3-8 */
  transform: rotate(270deg);
  border: none;
}

.button_rightb_download{
background: rgba(0,59,2,1);
background: -moz-linear-gradient(left, rgba(0,59,2,1) 0%, rgba(27,199,0,1) 80%, rgba(174,232,0,1) 97%, rgba(47,189,0,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,59,2,1)), color-stop(80%, rgba(27,199,0,1)), color-stop(97%, rgba(174,232,0,1)), color-stop(100%, rgba(47,189,0,1)));
background: -webkit-linear-gradient(left, rgba(0,59,2,1) 0%, rgba(27,199,0,1) 80%, rgba(174,232,0,1) 97%, rgba(47,189,0,1) 100%);
background: -o-linear-gradient(left, rgba(0,59,2,1) 0%, rgba(27,199,0,1) 80%, rgba(174,232,0,1) 97%, rgba(47,189,0,1) 100%);
background: -ms-linear-gradient(left, rgba(0,59,2,1) 0%, rgba(27,199,0,1) 80%, rgba(174,232,0,1) 97%, rgba(47,189,0,1) 100%);
background: linear-gradient(to right, rgba(0,59,2,1) 0%, rgba(27,199,0,1) 80%, rgba(174,232,0,1) 97%, rgba(47,189,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#003b02', endColorstr='#2fbd00', GradientType=1 );
border:1px solid #6ce910;
}

/* SLIDE TOP MENU */

#slide_top{
    position: absolute;
    width: 100%;
    text-align: center;
}

.slide_top_close{
    top:-236px;
}

.slide_top_open{
    top:-100px;
}

#slide_top > nav{
    padding:0;
    margin:0;
    background-color:#f46354;
    height:100%;
    overflow:hidden;
}

#slide_top > h2{
    color:#f5f5f5;
    width:100%;
    padding:10px 0;
    background-color:#e74c3c;
}

#slide_top > nav a{
    float:left;
    color:#f5f5f5;
    font-weight: 600;
    width:20%;
    padding: 36px 0;
}

#slide_top > nav a:hover{
    background-color: #f35a4a;
}

/* PUSH RIGHT MENU */

.push_right_close{
    position:fixed;
    right:-220px;
}

.push_right_open{
    right:0px;
}

#push_right > ul{
    float:right;
    background-color:#3498db;
}

#push_right > ul > h2{
    border-bottom:solid 1px #2980b9;
}

#push_right ul li{
    background-color:#6badda;
}

#push_right ul li:hover{
    background-color:#4fa3dc;
}

/* PUSH LEFT MENU */

.push_left_close{
    position:fixed;
    left:-220px;
}

.push_left_open{
    left:0px;
}

#push_left > ul{
    float:left;
    background-color:#3498db;
}

#push_left > ul > h2{
    border-bottom:solid 1px #2980b9;
}

#push_left ul li{
    background-color:#6badda;
}

#push_left ul li:hover{
    background-color:#4fa3dc;
}
/*------------*/

.side-bg{
	/* background:url(../images/common/btn_side.png) no-repeat; */
	width:162px;
	height: 43px;
	display: block;
	margin-left: auto;
	margin-top: 8px;
	margin-right: auto;
	background: #800a01;
	border-radius: 7px;
	border: 1px solid #c41e1e;
	}
.side-bg-p{
	background:url(../images/common/btn_side-p.png)no-repeat;
	width:162px;
	height:73px;
	display: block;
  margin-left: auto;
  margin-right: auto;

 }
.side-bg-ios{
	background:url(../images/common/btn_side-a.png) no-repeat;
	width:162px;
	height:73px;
	display: block;
  margin-left: auto;
  margin-right: auto;
 }
.side-bg-html{
	background:url(../images/common/btn_side-html.png) no-repeat;
	width:162px;
	height:73px;
	display: block;
  margin-left: auto;
  margin-right: auto;
 }
.bca-online{
	background:url(../images/Bank/BCA-online.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }
.bca-offline{
	background:url(../images/Bank/BCA-offline.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }
 .mandiri-online{
	background:url(../images/Bank/Mandiri-online.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }
 .mandiri-offline{
	background:url(../images/Bank/Mandiri-offline.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }
 .bni-online{
	background:url(../images/Bank/BNI-online.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }
 .bni-offline{
	background:url(../images/Bank/BNI-offline) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }

 .bri-online{
	background:url(../images/Bank/BRI-online.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }
 .bri-offline{
	background:url(../images/Bank/BRI-offline.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }

 .cimb-online {
   background:url(../images/Bank/CIMB-online.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

}

 .cimb-offline {
   background:url(../images/Bank/CIMB-offline.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

}
 .danamon-online {
   background:url(../images/Bank/Danamon-online.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

}

 .danamon-offline {
   background:url(../images/Bank/Danamon-offline.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

}

/****************/


.global-bca-online{
	background:url(../images/globalBank/BCA-online.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }
.global-bca-offline{
	background:url(../images/globalBank/BCA-offline.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }
 .global-mandiri-online{
	background:url(../images/globalBank/Mandiri-online.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }
 .global-mandiri-offline{
	background:url(../images/globalBank/Mandiri-offline.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }
 .global-bni-online{
	background:url(../images/globalBank/BNI-online.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }
 .global-bni-offline{
	background:url(../images/globalBank/BNI-offline) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }

 .global-bri-online{
	background:url(../images/globalBank/BRI-online.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }
 .global-bri-offline{
	background:url(../images/globalBank/BRI-offline.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

 }

 .global-cimb-online {
   background:url(../images/globalBank/CIMB-online.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

}

 .global-cimb-offline {
   background:url(../images/globalBank/CIMB-offline.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

}
 .global-danamon-online {
   background:url(../images/globalBank/Danamon-online.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

}

 .global-danamon-offline {
   background:url(../images/globalBank/Danamon-offline.png) no-repeat;
	width:148px;
	height:48px;
	margin-left: 7px;
    margin-top: 5px;

}

.side5-bg h3 {
    float: right;
    font-size: 15px;
    position: relative;
    top: 14px;
    right: 11px;
	color:#ffca2c;
}


.side-bg p {
  font-size: 12px;
  margin-top: 5px;
  font-family: 'Lato', sans-serif;
  text-align: center;
  color: #FFC92B;
}
.side-bg-html h3 {
  font-size: 17px;
  margin-left: 13px;
  padding-top: 13px;
  font-family: 'Lato', sans-serif;
  color:#ffca2c;
  font-weight:bold;
}
.side-bg-html p {
  font-size: 12px;
  margin-left: 13px;
  font-family: 'Lato', sans-serif;
  margin-top:5px;

}
.side-bg-ios h3 {
  font-size: 17px;
  margin-left: 13px;
  padding-top: 13px;
  font-family: 'Lato', sans-serif;
  color:#ffca2c;
  font-weight:bold;
}
.side-bg-ios p {
  font-size: 12px;
  margin-left: 13px;
  font-family: 'Lato', sans-serif;
  margin-top:5px;

}
.list_menu2 p {
  font-size: 12px;
  text-align:center;
  padding-top: 24px;
  font-family: 'Lato', sans-serif;
}
.side1-bg h3 {
    font-size: 16px;
    text-align:center;
    padding-top: 5px;
	font-family: 'Lato', sans-serif;
	font-style:italic;
}
.side2-bg h3 {
    font-size: 16px;
    text-align:center;
    padding-top: 5px;
	font-family: 'Lato', sans-serif;
	font-style:italic;
}
.side2-bg p {
    font-size: 12px;
  text-align:center;
  padding-top: 14px;
  font-family: 'Lato', sans-serif;
}
.side3-bg h3 {
    font-size: 16px;
    margin-left: 48px;
    padding-top: 5px;
	font-family: 'Lato', sans-serif;
	font-style:italic;
}
.side4-bg h3 {
    font-size: 16px;
    margin-left: 48px;
    padding-top: 5px;
	font-family: 'Lato', sans-serif;
	font-style:italic;
}

.side-bg-p h3 {
    font-size: 17px;
    margin-left: 13px;
    padding-top: 13px;
	font-family: 'Lato', sans-serif;
	color:#ffca2c;
	font-weight:bold
}
.side-bg h3 {
    font-size: 17px;
    /* margin-left: 13px; */
    padding-top: 10px;
    font-family: 'Lato', sans-serif;
    color:#ffca2c;
    font-weight:bold;
    text-align: center;
}
.side-bg-p p {
  font-size: 12px;
  margin-left: 13px;
  margin-top: 5px;
  font-family: 'Lato', sans-serif;

}


ul.list_menu2 h4 {
  margin-bottom: 10px;
  font-size: 22px;
  margin-top: 10px;
  font-family: 'Lato', sans-serif;
  margin-left:5px;
}
#slide_left > ul > li > a {
  cursor: pointer;
}








#holder {
        border: 1px solid #000;
        height: 200px;
        width: 200px;
        position:relative;
        margin:10px;
}
#mask {
        position: absolute;
        top:-1px;
        left:1px;
        width:50%;
        height: 1px;
        background-color:#fff;
}


.side-top {
    text-align: center;
}




a .btn-joinnow {
    background: url(../images/btn-joinnow.jpg) repeat-x;
    font-size: 15px;
    font-weight: bold;
    border: none;
    border-radius: 4px;
    color: #000000;
    text-shadow: 0px 2px 2px rgba(255, 255, 255, 1);
    padding: 11px 18px;
    width: 127px;
    margin-left: 17px;
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 18px;
}
a .btn-joinnow:hover {
	text-decoration:none;
	color:#F00;

}
.side-bg img {
    display: block;
    margin: 0px auto;

}
.side-bg:hover {
    background: #ae0102;
}



/* SLIDE RIGHT MENU */
#slide_rightb > ul{
    float:right;
}

#slide_rightb > ul > h2{
    border-bottom:solid 1px #c0392b;
}
#slide_rightb ul {/* margin-right:20px;*/}
#slide_rightb{
  font-size:18px;
  font-family:'Play', sans-serif;
}

#slide_rightb ul li:hover{

}


.srl_menub {
  margin-top: 163px;
  height: 100%;
  z-index: 1;
}