#mainbox {position: absolute; top: 80px; width: 99%; margin-bottom: 40px;}
#mask {position: fixed; left: 0; top: 0; bottom: 0;
right: 0; z-index: 9000; background-color: #000; display: none; width:100%; height:100%;}
#boxes .window {position:relative; left: 0; top: 0; width: 440px; display: none; z-index: 9999; text-align: center;}
#boxes #dialog {width: 450px; background-color: #ffffff; border-top: 4px solid #4565a6; margin: 0 auto; background: #fff url(../../images/MainPortal/subscribe/header_ground.png) repeat-x;}
#popupfoot{text-align: right; font-size: 16px; width: 350px; margin: 0 auto;}
#popupfoot a{color:#429100; font-family: calibri, helvetica, arial;}
#popupfoot a:hover{text-decoration:none;}
#boxes .subscribeform {margin: 0 auto; padding: 15px; background: #dadad2; border-radius: 5px; width: 320px;}
#boxes .subscribeform input[type="email"]{padding-left: 10px;
width: 308px; height: 36px; margin-bottom: 10px; font-size: 14px;
border: 1px solid #d4d4d4; border-radius: 5px;}
#boxes .subscribeform input[type="button"] {width: 318px; height:40px; color: #FFFFFF; font-size: 20px; padding-top: 8px; padding-bottom: 8px; border: 0px; background: #429100; transition: 0.5s; cursor: pointer; font-family: calibri, helvetica, arial; border-radius: 5px;}
#boxes .subscribeform input[type="button"]:hover {background: #7ec133; text-shadow: 1px 1px 1px #8C8C8C;}
#boxes .overlay_close {top: -15px; right: -10px; width: 24px; height: 24px; background: url(../../images/MainPortal/subscribe/btn_close_22x22.png) no-repeat 1px 1px; z-index: auto; position: absolute;}
#boxes .subscribehead {height: 116px; background: url(../../images/MainPortal/subscribe/header_sec_ground.png) center center no-repeat; background-position-y: -7px;}
#boxes .subscribecontent{padding: 0px 40px 40px;}
#boxes .subscribe_logo{width: 306px; height: 78px; background: url(../../images/MainPortal/subscribe/logo.png) 0px 0px no-repeat; background-size: 306px auto; margin-top: 20px;}
#boxes #dialog h2{font-size: 26px; color: #052758; font-weight: normal; font-family: "Times New Roman", Times, serif;}


/* The Following clearfix & hr CSS are already available on new.QE style.css */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }


/* Responsive */
@media only screen and (max-width: 767px) {
#mainbox {width: 95%;}
}

@media only screen and (max-width: 660px) {
#boxes .quransubscribe {float: inherit;}
#boxes .subscribeform {float: inherit;}
#boxes .subscribeform input[type="email"]{width: 96%;}
#boxes .subscribeform input[type="button"]{width: 99%;}
}

@media only screen and (max-width: 479px) {
#boxes #dialog {width: 95%;}	
#boxes .subscribeform{width: 240px;}
#popupfoot{width: 270px;}
}

@media only screen and (max-width: 410px) {
#boxes .subscribecontent {padding: 0px 20px 40px;}
}

@media only screen and (max-width: 400px) {
#boxes .subscribe_logo {width: 235px; height: 62px; background-size: 235px auto; margin-top: 35px;}
}
@media only screen and (max-width: 349px) {
#boxes .subscribeform {width: 170px;}
#boxes .subscribeform input[type="email"] {width: 93%;}
#popupfoot {width: 200px;}
}