html body.modal-open { overflow: hidden !important; }
body { padding: 0 !important; }
/* Package Box */
.packagebox { width: 100%; max-width: 300px; min-height: 250px; background: #FCFCFC; border: 1px solid #D4D4D4; border-radius: 0px; display: inline-block; margin-bottom: 20px; overflow: hidden; }
.packagebox .boxtitle { padding: 20px; color: white; font-size: 30px; }
.packagebox .boxfee { padding: 20px; }
.packagebox .boxfee p { line-height: normal; text-align: center; }
.packagebox .boxfee .idr { vertical-align: super; font-size: 16px; }
.packagebox .boxfee .fee { vertical-align: middle; font-size: 70px; }
.packagebox .boxfee .per { vertical-align: bottom; font-size: 20px; }
.packagebox .button { border-radius: 0; }
.packagebox .button:hover { background: #283841 !important; }

/*Nav notif*/
#nav-notif { position: absolute;right: 0; top: 0;    height: 100%;    width: 50px;        padding-left: 0; }
@media only screen and (min-width: 768px){
#nav-notif {
   width: 200px;
}
}
@media only screen and (max-width: 767px){
#nav-notif {
   width: 125px;
}
}
#nav-notif .nav-notif-text{ display: inline-block; line-height: 63px; color:white; text-transform: uppercase; font-weight: bold; }

/*Nav Icon*/
.nav-icon { display: inline-block; position: absolute; right: 45px; top: 50%; transform: translateY(-50%); z-index: 100; }
.nav-icon ul { list-style-type: none; padding: 0; margin: 0; }
.nav-icon ul li { position: relative; float: left; margin-right: 7px; }
.nav-icon ul li a { display: inline-block; width: 25px; text-align: center; }
.nav-icon ul li a:hover { transform: scale(1.3); }
.nav-icon ul li img { height: 20px; }

#nav-notif-dropdown { width: 320px; max-height: 220px; overflow-y: scroll; margin-top: 5px; left: -220px; color: #000; height: initial; padding: 5px 5px 0 5px; }
#nav-notif-dropdown li { display:block; margin-right:0; margin-bottom: 5px; float: none; }
#nav-notif-dropdown li.notview { background-color:aliceblue; }
#nav-notif-dropdown li a { display:block; color:#333; width: auto; text-align: left; }
#nav-notif-dropdown li a .content { font-size:12px; }
#nav-notif-dropdown li a .content .message{ white-space: normal; line-height: normal; }
#nav-notif-dropdown li a .content .message-time{ color: #aaa; font-size:10px; margin-top:5px }

/*Select2 Mobile Friendly Click*/
/*.styled-select { position: relative; }
.styled-select:before { content: ""; background: rgba(0,0,0,0); position: absolute; width: 100%; height: 100%; z-index: 2; }*/
#resend_vrf { text-align: left; }
#resend_vrf .btn { float: right; margin-top: -5px; }

.bor_instagram { border:1px solid #c20046; }
.bor_instagram i { color:#c20046; }
.bor_instagram:hover { background-color:#c20046 !important; }
.bor_instagram:hover i { color:#fff !important; }

/*Preloader Youthmanual*/
#preload { position: fixed; top: 60px; width: 100%; height: 100%; z-index: 2000; background: #FFF; }
.load_warp { z-index:300; position:fixed; top:0; left:0; bottom:0; right:0; margin:auto; width:120px; height:120px; }
.load_mask { position: relative; z-index: 300; display: inline-block; overflow: visible; margin-right: -60px; width: 60px; height: 120px; -webkit-transform-origin: 60px 60px; -ms-transform-origin: 60px 60px; transform-origin: 60px 60px; -webkit-animation: rotateload 1s linear infinite; animation: spin 1s infinite linear; -webkit-mask-image: -webkit-linear-gradient(top,#000,transparent); }
.load_line { width: 120px; height: 120px; border-radius: 50%; border: 5px dashed #cd292e; }
.load_img { z-index: 1; display: inline-block; width: 60px; height: 60px; border: 0; background: url(../img/favicon/favicon_114.png) no-repeat; background-size: 60px; margin: 30px; }

@media(max-width: 767px){
	#login.modal { padding: 0 15px!important; }
	#login .modal-popup { padding: 15px 10px; }
}
@media(max-width: 450px){
	#resend_vrf { text-align: center; }
	#resend_vrf .btn { display: inline-block; margin-top: 10px; float: none; }
}

/* Youthmanual Protect */
.ymp {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}
.ymp img {
    -webkit-user-drag: none; /* Safari */
     -khtml-user-drag: none; /* Konqueror HTML */
       -moz-user-drag: none; /* Firefox */
        -ms-user-drag: none; /* Internet Explorer/Edge */
            user-drag: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}