/******************************************************* Site Name : Ugot45 Author : Muhammed Riyas Author's site : www.riyasonline.com ********************************************************/ /*-------------------- font family --------------------*/ @font-face { font-family: 'open_sansregular'; src: url('../fonts/opensans-regular-webfont.eot'); src: url('../fonts/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/opensans-regular-webfont.woff') format('woff'), url('../fonts/opensans-regular-webfont.ttf') format('truetype'), url('../fonts/opensans-regular-webfont.svg#open_sansregular') format('svg'); font-weight: normal; font-style: normal;} @font-face { font-family: 'open_sanssemibold'; src: url('../fonts/opensans-semibold-webfont.eot'); src: url('../fonts/opensans-semibold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/opensans-semibold-webfont.woff') format('woff'), url('../fonts/opensans-semibold-webfont.ttf') format('truetype'), url('../fonts/opensans-semibold-webfont.svg#open_sanssemibold') format('svg'); font-weight: normal; font-style: normal;} @font-face { font-family: 'open_sans_condensedbold'; src: url('../fonts/opensans-condbold-webfont.eot'); src: url('../fonts/opensans-condbold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/opensans-condbold-webfont.woff') format('woff'), url('../fonts/opensans-condbold-webfont.ttf') format('truetype'), url('../fonts/opensans-condbold-webfont.svg#open_sans_condensedbold') format('svg'); font-weight: normal; font-style: normal; } /*-------------------- body styles --------------------*/ body { margin:0px; padding:0px; background:#000; background:url(../images/bg-image.jpg) repeat left top; font-family: 'open_sansregular'; font-weight:normal;} input {font-family: 'open_sansregular'; font-weight:normal; font-size:13px; font-weight:normal; color:#000;} div, ul, li, a, p, h1, h2, h3, h4, span { margin:0px; padding:0px;} h1, h2, h3, h4 {font-family: 'open_sans_condensedbold';} img { border:0px;} /*-------------------- page styles --------------------*/ /* top container */ .top_container_wrapper { width:100%; float:left; height:166px; background:url(../images/top-bg.jpg) no-repeat center top;} .tc_inner { width:990px; margin:0px auto; height:166px;} .logo { width:159px; height:88px; float:left; margin:35px 0 0 0;} .login_wrapper { float:right; margin:43px 0 0 0;} .login_wrapper .section_left { float:left; width:396px; background:url(../images/line.png) no-repeat center 48px;} .login_wrapper .section_left .forms { float:left; width:396px; height:33px;} .login_wrapper .section_left .forms input { width:180px; height:21px; float:left; border:0px; background:url(../images/form_bg.png) no-repeat left top; padding:6px 0 6px 13px; font-size:13px;} .login_wrapper .section_left .forms input:first-child { margin-right:6px;} .login_wrapper .section_left .check_wrapper { float:left; padding:27px 0 0 78px;} .login_wrapper .section_left .check_wrapper div { float:left; display:block; color:#fff; font-size:12px;} .login_wrapper .section_left .check_wrapper div:first-child { padding-right:13px; border-right:1px solid #b76767;} .login_wrapper .section_left .check_wrapper div:last-child { padding-left:13px;} .login_wrapper .section_left .check_wrapper div span { float:left; padding-right:2px; margin-top:-2px;} .login_wrapper .section_left .check_wrapper div a { text-decoration:none; color:#fff;} .login_wrapper .section_left .check_wrapper div a:hover { text-decoration:underline; color:#e3bfbf;} .login_wrapper .login_btn { width:95px; height:76px; float:left; margin-left:10px;} .login_wrapper .login_btn input { background:url(../images/login.png) no-repeat left top; width:95px; height:76px; border:0px; cursor:pointer;} .login_wrapper .login_btn input:hover { background:url(../images/login-ovr.png) no-repeat left top;} /* middle container */ .middle_container_wrapper { width:100%; float:left; margin:2% 0 0 0;} .mc_inner { width:990px; margin:0px auto;} .mc_inner .top { width:990px; float:left;} .mc_inner .middle { float:left; width:890px; background:#fff; padding:0px 50px 0 50px; } .mc_inner .middle .inner_container { width:890px; float:left; background:url(../images/img2.png) no-repeat -50px bottom; font-size:13px;} .mc_inner .middle .inner_container_wrap { width:890px; float:left; font-size:13px; background:url(../images/arrow2.png) no-repeat 410px bottom;} .mc_inner .middle .inner_container_wrap .top_wrap { float:left; width:890px;font-size:27px; color:#5b5b5b; font-weight:normal; text-transform:capitalize; font-style:normal; letter-spacing:-1px; font-family: 'open_sans_condensedbold'; border-bottom:1px solid #ececec; padding-bottom:3px; margin-bottom:35px;} .mc_inner .middle .inner_container_wrap .inn_correct_wrap { float:left; width:400px; background:url(../images/incorrect.png) no-repeat left top; padding:0 0 80px 70px;} .mc_inner .middle .inner_container_wrap .inn_correct_wrap h3 {font-family: 'open_sanssemibold'; font-size:21px; font-weight:normal; padding-bottom:12px; color:#d80000; text-transform:capitalize;} .mc_inner .middle .inner_container_wrap .inn_correct_wrap p { font-size:13px; color:#565656; padding-bottom:10px; line-height:20px;} .mc_inner .middle .inner_container_wrap .new_right_login { float:left; width:356px; background:url(../images/line2.jpg) no-repeat 10px top; margin-left:20px; padding-left:40px; min-height:201px;} .mc_inner .middle .inner_container_wrap .new_right_login .form_outer { float:left; width:360px; padding-bottom:10px;} .mc_inner .middle .inner_container_wrap .new_right_login .form_outer .left { float:left; width:100px; padding-top:6px;} .mc_inner .middle .inner_container_wrap .new_right_login .form_outer .left1 { float: left; padding-top: 6px; width: 120px; } .mc_inner .middle .inner_container_wrap .new_right_login .form_outer .fn { float:left; width:210px; height:20px; background:url(../images/frm-bg1-new.jpg) no-repeat left top; border:0px; margin-right:10px; padding:5px 10px;} .mc_inner .middle .inner_container_wrap .new_right_login .check_wrapper { float:left; padding-left:98px; padding-top:6px;} .mc_inner .middle .inner_container_wrap .new_right_login .check_wrapper div { float:left; display:block; color:#000; font-size:12px;} .mc_inner .middle .inner_container_wrap .new_right_login .check_wrapper div:first-child { padding-right:9px; border-right:1px solid #e0e0e0;} .mc_inner .middle .inner_container_wrap .new_right_login .check_wrapper div:last-child { padding-left:9px;} .mc_inner .middle .inner_container_wrap .new_right_login .check_wrapper div { padding-left:9px;} .mc_inner .middle .inner_container_wrap .new_right_login .check_wrapper div span { float:left; padding-right:2px; margin-top:-1px;} .mc_inner .middle .inner_container_wrap .new_right_login .check_wrapper div a { text-decoration:none; color:#000;} .mc_inner .middle .inner_container_wrap .new_right_login .check_wrapper div a:hover { text-decoration:underline; color:#d80000;} .mc_inner .middle .inner_container_wrap .new_right_login .submit { width:81px; float:left; margin-top:20px; margin-left:98px;} .mc_inner .middle .inner_container_wrap .new_right_login .submit2 { float: left; margin-left: 118px; margin-top: 20px; width: 81px; } .mc_inner .middle .inner_container_wrap .new_right_login .submit2 input { background:url(../images/submit_inner.jpg) no-repeat left top; width:81px; height:30px; border:0px; cursor:pointer; color:#fff; text-transform:uppercase; font-size:13px; font-family: 'open_sanssemibold'; font-weight:normal; letter-spacing:0px;} .mc_inner .middle .inner_container_wrap .new_right_login .submit input { background:url(../images/submit_inner.jpg) no-repeat left top; width:81px; height:30px; border:0px; cursor:pointer; color:#fff; text-transform:uppercase; font-size:13px; font-family: 'open_sanssemibold'; font-weight:normal; letter-spacing:0px;} .mc_inner .middle .inner_container_wrap .new_right_login .submit3 { float: left; margin-left: 98px; margin-top: 5px; width: 81px; } .mc_inner .middle .inner_container_wrap .new_right_login .submit3 input { background:url(../images/submit_inner.jpg) no-repeat left top; width:81px; height:30px; border:0px; cursor:pointer; color:#fff; text-transform:uppercase; font-size:13px; font-family: 'open_sanssemibold'; font-weight:normal; letter-spacing:0px;} .mc_inner .middle .inner_container .content_left { float:left; width:467px; background:url(../images/line2.jpg) no-repeat right top; padding:0 0 100px 0;} .mc_inner .middle .inner_container .content_left ul { float:left; width:432px;} .mc_inner .middle .inner_container .content_left ul li { list-style:none; padding-bottom:15px; line-height:19px; font-size:12px; color:#4c4c4c; background:url(../images/blt.png) no-repeat left 5px; padding:0 0 15px 14px;} .mc_inner .middle .inner_container .form_right { float:left; width:388px; padding:0 0 0 35px;} .mc_inner .middle .inner_container .form_right h1 {font-size:30px; color:#d80000; font-weight:normal; text-transform:uppercase; font-style:normal; letter-spacing:-1px; margin:0 0 20px 0;} .mc_inner .middle .inner_container .form_right .form_outer { float:left; width:388px;} .mc_inner .middle .inner_container .form_right .form_outer .section { float:left; width:388px; margin:0 0 10px 0;} .mc_inner .middle .inner_container .form_right .form_outer .section .fn { float:left; width:159px; height:20px; background:url(../images/frm-bg1.jpg) no-repeat left top; border:0px; margin-right:10px; padding:5px 10px;} .mc_inner .middle .inner_container .form_right .form_outer .section .ln { float:left; width:159px; height:20px; background:url(../images/frm-bg1.jpg) no-repeat left top; border:0px; padding:5px 10px;} .mc_inner .middle .inner_container .form_right .form_outer .section .normal { float:left; width:348px; height:20px; background:url(../images/frm-bg2.jpg) no-repeat left top; border:0px; padding:5px 10px;} .mc_inner .middle .inner_container .form_right .form_outer .db_wrapper {float:left; width:368px; height:30px; background:url(../images/frm-bg2.jpg) no-repeat left top;} .mc_inner .middle .inner_container .form_right .form_outer .db_wrapper, .db_wrapper select {font-family: 'open_sansregular'; font-size:13px; font-weight:normal;} .mc_inner .middle .inner_container .form_right .form_outer .db_wrapper .db { float:left; padding:5px 44px 5px 10px;} .mc_inner .middle .inner_container .form_right .form_outer .db_wrapper .month { float:left; padding-top:1px; width:104px;} .mc_inner .middle .inner_container .form_right .form_outer .db_wrapper .date { float:left; padding-top:1px; width:60px;} .mc_inner .middle .inner_container .form_right .form_outer .db_wrapper .date select { width:60px;} .mc_inner .middle .inner_container .form_right .form_outer .db_wrapper .year { float:left; padding-top:1px; width:70px;} .mc_inner .middle .inner_container .form_right .form_outer .db_wrapper .year select { width:70px;} /* select and check box styles */ .checkbox, .radio { width: 19px; height: 25px; padding: 0 5px 0 0; background: url(../images/checkbox.png) no-repeat; display: block; clear: left; float: left; } .radio { background: url(../images/radio.png) no-repeat; } .select { position: absolute; padding:2px 0 0 3px; width: 95px; /* With the padding included, the width is 190 pixels: the actual width of the image. */ height: 23px; background: url(../images/month.jpg) no-repeat left top; overflow: hidden; } .select_m { position: absolute; padding:5px 0 0 10px; width: 27px; /* With the padding included, the width is 190 pixels: the actual width of the image. */ height: 23px; background: url(../images/month.jpg) no-repeat; overflow: hidden; } .select_y { position: absolute; padding:5px 0 0 10px; width: 32px; /* With the padding included, the width is 190 pixels: the actual width of the image. */ height: 23px; background: url(../images/month.jpg) no-repeat; overflow: hidden; } .date-select { position: absolute; padding:5px 0 0 10px; width: 51px; /* With the padding included, the width is 190 pixels: the actual width of the image. */ height: 23px; background: url(../images/date.jpg) no-repeat; overflow: hidden; } .year-select { position: absolute; padding:5px 0 0 10px; width: 60px; /* With the padding included, the width is 190 pixels: the actual width of the image. */ height: 23px; background: url(../images/year.jpg) no-repeat; overflow: hidden; } .mc_inner .middle .inner_container .form_right .form_outer .gender_wrapper {float:left; width:368px; height:30px; background:url(../images/frm-bg2.jpg) no-repeat left top; margin-top:10px;} .mc_inner .middle .inner_container .form_right .form_outer .gender_wrapper .gender { float:left; padding:5px 75px 5px 10px;} .mc_inner .middle .inner_container .form_right .form_outer .gender_wrapper .male { float:left; border-left:1px solid #e5e5e5; border-right:1px solid #e5e5e5; padding:5px 10px 0 5px;} .mc_inner .middle .inner_container .form_right .form_outer .gender_wrapper .female { float:left; padding:5px 10px 0 5px;} .mc_inner .middle .inner_container .form_right .submit { width:388px; float:left; margin-top:20px;} .mc_inner .middle .inner_container .form_right .submit input { background:url(../images/submit.jpg) no-repeat left top; width:368px; height:30px; border:0px; cursor:pointer; color:#fff; text-transform:uppercase; font-size:15px; font-family: 'open_sanssemibold'; font-weight:normal; letter-spacing:0px;} .mc_inner .bottom { float:left; margin-bottom:80px;} /* footer container */ .footer_wrapper { width:100%; float:left; padding:20px 0; background:url(../images/footer-bg.png) repeat-x left top; position:absolute; left:0; bottom:0; position:fixed;} .footer_wrapper .ft_inner { width:95%; margin:0px auto; color:#fff; font-size:12px;} .footer_wrapper .ft_inner .left { float:left; color:#707070;} .footer_wrapper .ft_inner .right { float:right; color:#535353;} .footer_wrapper .ft_inner .right a { text-decoration:none; color:#b60808; margin:0 3px 0 3px;} .footer_wrapper .ft_inner .right a:hover { color:#fff;} .footer_wrapper .ft_inner .right a:last-child { margin-right:0px;} .mc_inner .middle .inner_container_wrap .new_login_img { float:left; width:474px; background:url(../images/left_img.jpg) no-repeat left top; height:227px;} /*.submit button { width:388px; float:left; margin-top:20px;}*/ .submit button { background:url(../images/submithome.jpg) no-repeat left top; width:368px; height:30px; border:0px; cursor:pointer; color:#fff; text-transform:uppercase; font-size:15px; font-family: 'open_sanssemibold'; font-weight:normal; letter-spacing:0px;} .mc_inner .middle .inner_container .form_right .form_outer .section .fn.form-error { /* background:url(../images/new_error.jpg) no-repeat left top; border:0px; width:160px;*/ } .mc_inner .middle .inner_container .form_right .form_outer .section .ln.form-error { border: 1px solid #CA0000 } .mc_inner .middle .inner_container .form_right .form_outer .section .normal.form-error { /*background:url(../images/new_error2.jpg) no-repeat left top; border:0px;*/ } .message { width: 600px; text-align: center; padding: 20px; line-height: 20px; border: 1px solid #c9c9c9; color:#d40808; border-radius: 9px; float: left; margin: -15px 0 30px 124px;} .form_outer .newfn { width:210px; height:24px; float:left; border:0px; padding:3px 10px; background:url(../images/new_input_bg.jpg) no-repeat left top;} @media screen and (-webkit-min-device-pixel-ratio:0) { .form_outer .newfn { width:208px; height:22px; float:left; border:1px solid #d9d9d9; padding:3px 10px; border-radius:6px;} }