﻿


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
  display: block;
}
body {
  line-height: 1;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
*, *:before, *:after {
  box-sizing: border-box;
}

@font-face {
  font-family: 'Conv_taile';
  src: url('../fonts/taile.eot');
  src: local('☺'), url('../new_fonts/taile.woff') format('woff'), url('../new_fonts/taile.ttf') format('truetype'), url('../fonts/taile.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Conv_taileb';
  src: url('../fonts/taileb.eot');
  src: local('☺'), url('../new_fonts/taileb.woff') format('woff'), url('../new_fonts/taileb.ttf') format('truetype'), url('../new_fonts/taileb.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Conv_AvenirLTStd Roman';
  src: url('../fonts/AvenirLTStd Roman.eot');
  src: local('☺'), url('../new_fonts/AvenirLTStd Roman.woff') format('woff'), url('../new_fonts/AvenirLTStd Roman.ttf') format('truetype'), url('../new_fonts/AvenirLTStd Roman.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}



body {
  
  color: #5a5a5a;
   background:#E2EBF2 url("../new_images/bodybg.png") no-repeat top center fixed; 
  -webkit-background-size: 100% 100%;
  -moz-background-size: 100% 100%;
  -o-background-size: 100% 100%;
  background-size: 100% 100%;
  padding-top:20px;
  color: #000;
  font-family:'Conv_taile',Sans-Serif;
  width: 100%;
  

}

.container {width:1000px; margin:0 auto;}
.logo { display: table; padding-top: 20px; width: 250px; float:left; height: auto; margin-top: 0}
.logo a {vertical-align: middle;display: table-cell;}


.header-bar {margin-bottom: 20px; width: 100%; }
.result-strucher {width: 800px}
.title-box { width: 650px; float: left; padding-left: 58px}
.eye-icon { border-radius:20px 0px 0px 0; background: #fff; padding: 8px 18px;width:110px; float: left; height: 90px}

.result-title-bg{ background: #0C5596; border-radius:00px 0px 20px 0; float: left; height: 90px; line-height:78px; width:450px; color: #fff; padding: 8px 15px; text-align: center}


.result-middle{ width: 600px; text-align: center; margin: 0 auto; clear: both; overflow: hidden; display: block;}
.result-outer-wraper{  height: 450px; vertical-align: middle;display: table-cell;}
.result-inner-wraper { width: 100%; overflow: hidden; margin: 0 auto;  }
.result-inner{width: 450px; float:left; background: #0C5596; border-radius:20px 0px 0px 0; padding:24px 50px  }
.result-inner h1 { color: #fff; font-size: 81px; text-align: left;font-family: 'Conv_taileb';}
.result-inner-right {background: #F26D21; border-radius:0px 0px 20px 0; padding:24px 50px; width: 150px; float:left}
.result-inner-right h1 { font-size: 81px; text-align: left;font-family: 'Conv_taileb';}

.right-arrow { position:fixed; right: 0; top:45%; }

/* middle-pannel*/
.middle-panel { width: 100%; text-align: center; margin: 0 auto; clear: both; overflow: hidden; padding-top: 100px; min-height: 400px }
.posre10 { position: relative; top:5px}

/*form*/
.clearboth { clear:both; content: ''; display: table}
.row { width: 100%; display: block;float:left;}
.divform { float: left; width: 56% }
.divleft {float:left; width:50%}

.divleft2 {float:left; padding-left: 4px}
.divleft3 {width: 15%; float:left}
.divleft4 {width: 22%; float:left}
.divleft5 { width: 200px; float: left;}
.form-group {  float: left;font-family: 'Conv_taileb';text-align: left; margin-bottom: 20px}
.form-group label { color:#0C5596; font-size: 14px; display: block;font-family: 'Conv_AvenirLTStd Roman';  }
.form-group sub { color: #FF6C13}
.form-group input[type='text'] { width: 100%; float:left; border: 1px solid #0C5596; height:38px; line-height: 22px; margin-top:5px; padding: 5px}
.divleft3 .form-group { text-align: center}
.divleft4 .form-group { text-align: center; width: 100%}
.divleft input[type='text'] { width: 222px }
.divleft2 input[type='text'] { width: 222px }
.btn {border-radius: 20px 0 20px 0; color: #fff;	font-family: 'Conv_AvenirLTStd Roman'; font-size: 15px; border:0;  padding: 20px 0px; margin-top:5px; margin-bottom: 10px}
.btn2 {width:100%;border-radius: 20px 0 20px 0; color: #fff;	font-family: 'Conv_AvenirLTStd Roman'; font-size: 15px; border:0;  padding: 20px 40px; margin-top:5px;margin-bottom: 10px}
.left-screen {width: 380px; float:left}
.left-screen img { border: 1px solid #0C5596}
.right-panel { width: 617px; float:left;text-align: left}
.right-panel .listbox {width: 100%}
.right-panel .listbox ul { padding:0; padding-left: 30px }
.right-panel .listbox li { text-align: left;list-style: none; line-height: 16px; background: #fff; border-radius: 10px 0 10px 0; padding:8px 10px;font-family: 'Conv_AvenirLTStd Roman'; font-size: 13px; margin-bottom: 18px}

.test-box { float: left; width: 100%; clear: both;}
.test-img { float: left; width: 630px; text-align: right; }
.test-img img { text-align: right; margin-top:-10px; }
.test-form {width:290px; float: right; text-align: center;margin-top: 40px}
.test-form input[type='text'] { width: 130px; height: 65px; border: 1px solid #0C5596; font-size: 65px; color: #0C5596; text-align: center;}
.round-keypad { width: 100%; float: left; text-align: center; margin-top: 50px }
.round-keypad li { padding:0 margin:0; float: left; margin-left: 20px}
.round-keypad li button { float: left; border-radius: 50%; background: #fff; border: 1px solid #F26D21; color:  #0C5596; font-size: 40px;font-family: 'Conv_taileb'; width:70px; height:70px; text-align: center; cursor: pointer; margin-bottom: 15px}
.round-keypad li button:focus { outline: none; }

.right-result-panel {width:778px; float: left;padding-left: 20px;}
.result-left { width: 220px; float: left; }
.result-left2 { width: 280px; float: left; }
.result-left-wrapper { width: 100%; float: left; margin-bottom:20px;}
.resule-titlebg {background: #0C5596; border-radius: 20px 0 0 0; padding: 8px 15px; color: #fff; font-size:13px; letter-spacing:1px;font-family: 'Conv_taileb'; text-align: left;}
.result-middle-top{ background: #fff;float: left; width: 100%; padding: 10px 15px; border-radius: 0 0 20px 0; text-align: left; min-height: 220px; font-size: 14px; line-height: 18px  }
.result-middle2{ font-size: 14px; line-height: 18px; background: #fff;float: left; width: 100%; padding: 10px 15px; border-radius: 0 0 20px 0; text-align: left; min-height: 98px;  }
.result-middle3{ background: #fff;float: left; width: 100%; padding:2px 5px; border-radius: 0 0 20px 0; text-align: left; font-size: 10px;font-family: 'Conv_AvenirLTStd Roman'; line-height: 12px}
.listingbox { background: #fff;float: left; width: 100%; padding: 10px 0px; border-radius: 0 0 20px 0; text-align: left; }
.listingbox li { background: #E2EBF2; border: 1px solid #231F20; padding:7px 11px; margin-bottom: 18px; font-size: 14px }
.listingbox li:last-child {margin-bottom: 5px;}

.waggnor-box { width: 470px; float: left; text-align: center; vertical-align: middle; margin-top:74px; }

.authorized-box {width: 72%; float: left; margin-top:16px;  text-align:left;}
.authorized-box h4 { border-bottom: 1px solid #000; font-size:12px; color: #000;  width:50% ; margin-bottom: 6px }
.authorized-box .result-left-wrapper { width:100%; float: left; }
.posrel2 { position: relative;top:-2px; }

.icon-box { width: 28%; float: left; padding-left:10px; padding-top:57px; }
.icon-box li { display: inline-block; font-size:12px; height: 30px }
.icon-box li a { color: #0C5596; float: left; display: block; text-align: center;  text-decoration: none; width: 58px}
.icon-box li a:hover { color: #F26D21; text-decoration: underline; }
.icon-box li span { display: block; width: 100%; float: left; }
.icon-box li .newtest { background: url(../new_images/icons.png) no-repeat 10px 3px; float: left; width:100%; height: 40px; text-align: center; margin-bottom: 5px; display: block; }
.icon-box li .save { background: url(../new_images/icons.png) no-repeat -66px 3px; float: left; width:100%; height: 40px; text-align: center; margin-bottom: 5px;display: block; }
.icon-box li .print { background: url(../new_images/icons.png) no-repeat -142px 3px; float: left; width:100%; height: 40px; text-align: center; margin-bottom: 5px;display: block; }
.footer { width: 100%;  padding-top:50px;	font-family: 'Conv_AvenirLTStd Roman'; clear: both; padding-bottom: 20px}


/*commen css*/
.top-small { font-size:10px; top:-7px; position: relative; }
.width90 { width: 90px}
.mto20 { margin-top:20px}
.mto206 { margin-top:26px}
.mto30 { margin-top:30px}
 .mto40 { margin-top:40px}
.font-bold {font-family: 'Conv_taileb';}
.font-size18 { font-size: 18px}
.font-size42 { font-size: 42px}
.font-size16 { font-size: 16px}
.mt10 {margin-top:10px}
.blue-color{ color: #0C5596 }
.text-center { text-align: center}
.text-right { text-align: right}
.text-left { text-align: left}
.blue-button { background: #0C5596!important; }
.orange-button { background: #F26D21!important;; }
.white-text { color: #fff!important }
.small { font-size: 12px;font-family:'Conv_taile',Sans-Serif;}
.padtop30 { padding-top:30px; }
.fontuppercase {text-transform: uppercase;}
button { cursor: pointer; }

/*date picker */

.ui-widget-header { background: #0C5596!important; border: 1px solid #0C5596!important; color: #fff!important}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {background:#F26D21!important; color:#fff!important; border: 1px solid #F26D21!important}

.switch-field { width: 110px; text-align: center; margin-left: 8px }

.switch-field input[type='radio'] {position: absolute !important; clip: rect(0, 0, 0, 0);height: 1px;width: 1px;border: 0;overflow: hidden;
}
.switch-field label {float: left;}
.switch-field label {
  border-radius: 20px 0 20px 0; color: #fff;  
  font-family: 'Conv_AvenirLTStd Roman'; font-size: 15px; border:0;  
  padding: 20px 0px; margin-top:5px; margin-bottom: 10px;
  width: 90px;
 background-color:#0C5596!important;}
.switch-field label:hover {cursor: pointer;}
.switch-field input:checked + label {background-color: #F26D21!important;-webkit-box-shadow: none;box-shadow: none;}


.switch-field2 { width: 100%; text-align: center; margin-left: 10px }

.switch-field2 input[type='radio'] {position: absolute !important; clip: rect(0, 0, 0, 0);height: 1px;width: 1px;border: 0;overflow: hidden;
}
.switch-field2 label {float: left;}
.switch-field2 label {
  border-radius: 20px 0 20px 0; color: #fff;  
  font-family: 'Conv_AvenirLTStd Roman'; font-size: 15px; border:0;  
  padding: 20px 0px; margin-top:5px; margin-bottom: 10px;
  width: 100%;
 background-color:#0C5596!important;}
.switch-field2 label:hover {cursor: pointer;}
.switch-field2 input:checked + label {background-color: #F26D21!important;-webkit-box-shadow: none;box-shadow: none;}

/*23 feb*/
.test-img-box { width: 150px; text-align: center; }
.test-img-box img { border-radius: 50%; border:10px solid #DBDCDC }
.test-img-box h4 {font-family: 'Conv_taileb'; margin-top: 8px;word-wrap: break-word;
    white-space: normal;}
.text-box-middle {width: 100%; text-align: center;}
.ui-tabs .ui-tabs-nav li.ui-tabs-active:after { content: "";
display: block;width: 0;height: 0;border-left: 24px solid transparent;border-right: 24px solid transparent; border-top:0;
  border-bottom: 30px solid #fff; border-style: solid; margin-left: -20px;position: absolute; bottom: -25px;left: 50%;}
.box {
    width: 100%;
    background-color: #fff;
    position: relative;
    border-radius: 4px;
    margin-top:20px; line-height: 22px; border-radius: 20px 0 20px 0; text-align: left; padding: 38px; min-height: 340px; margin-bottom:20px;font-size:15px;
}
.box.arrow-top-center:after, .box.arrow-top-left:after, .box.arrow-top-right:after {
    border-top-color: transparent;
    border-bottom-color: #fff;
    top: -20px;
    bottom: auto;
}
.box.arrow-top-center:after {
    border-top-width: 0;
    border-bottom-width: 20px;
}  
.box p { padding:0px 0 10px 0}
.box ul { margin-left:20px; margin-top: 20px; } 
.box li { padding: 3px 0 }
.box li p { padding: 14px 0 }
.faded_footerimg { width: 100%; text-align: center;}
.ui-widget.ui-widget-content { border: 0 }
.ui-widget-content { background: transparent; }
.ui-tabs .ui-tabs-panel {padding:0;}
.ui-widget-header { background: transparent!important; border: 0!important }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { background: transparent; border:0; }
#tab81 .left-arrow:after{  content: "";
display: block;width: 0;height: 0;border-left: 24px solid transparent;border-right: 24px solid transparent; border-top:0;
  border-bottom: 23px solid #fff; border-style: solid; margin-left: -20px;position: absolute; top: -22px;left: 12%;}
#tab82 .left-arrow:after{  content: "";
display: block;width: 0;height: 0;border-left: 24px solid transparent;border-right: 24px solid transparent; border-top:0;
  border-bottom: 23px solid #fff; border-style: solid; margin-left: -20px;position: absolute; top: -22px;left: 37%;}
#tab4 .left-arrow:after{  content: "";
display: block;width: 0;height: 0;border-left: 24px solid transparent;border-right: 24px solid transparent; border-top:0;
  border-bottom: 23px solid #fff; border-style: solid; margin-left: -20px;position: absolute; top: -22px;right: 36%;}
#tab8 .left-arrow:after{  content: "";
display: block;width: 0;height: 0;border-left: 24px solid transparent;border-right: 24px solid transparent; border-top:0;
  border-bottom: 23px solid #fff; border-style: solid; margin-left: -20px;position: absolute; top: -22px;right: 11%;}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {  background: transparent; border:0; }
.ui-state-active .test-img-box img { border:10px solid #0C5596; }
.ui-tabs .ui-tabs-nav li { margin:auto; padding:0 31px; height:220px }
.ui-tabs .ui-tabs-nav li:focus { border:0; outline: none; }
  button:focus,   a:focus {outline:0;}
  .finish-btn span {padding: 9px 10px 7px 5px;}

  @media print {
 body {  background:url("../new_images/bodybg.png") no-repeat top center; width: 1030px; padding:10px; margin:0 auto;}

}



