

/****************************************************************** NEW LAYOUT *****************************************************/
/* ======================================== Generic elements =================================================================  */


body{ margin:0px; padding:0px;font-family:"Segoe UI",Arial,Verdana,Helvetica,sans-serif; font-size:13px; color:#4a4a4b; background:#fff }
	
h1, h2, h3, h4, h5, h6, h7, p, form, input, ul.no-bullet, ul.no-bullet li{padding:0px; margin:0px; font-weight:normal; font-size:13px; }
p{line-height:17px}
ul.no-bullet,ol.no-bullet { list-style: none; }
input, select, textarea{font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#726051}
a{color:#00a7e2; text-decoration:none; outline:none}
a:hover{color:#856150; text-decoration:none}
a img{border:0}

.clear{ clear:both;}


#wrapper:after,#header:after,#middle:after, #footer:after, .content:after, .data:after{ content: "."; display: block; height:0; font-size:0px; clear: both; visibility: hidden; }


/* \*/ * html #header{height:1px} /* */
/* \*/ * html #middle{height:1px} /* */
/* \*/ * html #footer{height:1px} /* */
/* \*/ * html .content{height:1px} /* */
/* \*/ * html .data{height:1px} /* */


.colleft{float:left; width:auto }
.colright{float:right;width:auto}

.right{text-align:right}
.center{text-align:center}

.content{ width:960px; padding:5px; margin:0px auto; }
.data{width:auto}	

h1{font-size:22px; color:#856150; font-weight:bold; padding:0px; margin:12px 0 12px; }
h1.heading{ font-size: 25px; color: #fff; font-weight:bold; padding:20px 0 15px -2px; margin: 20px 0 35px 0;}

h2{font-size:20px; padding:0 0 8px;}

h3{font-size:18px; }
h3.heading{ background:url(../images/heading-icon.html) no-repeat 6px 8px; padding:3px 0 0 22px}

h4{font-size:13px; font-weight:bold }

h5{font-size:12px; font-weight:bold;}
p{padding:0 0 8px}

a.more{ background:url(../images/list-bullet.gif) no-repeat 0 3px; padding:0 0 0 12px; font-weight:bold }

/* ======================================== Wrapper ========================================================  */

#wrapper{ width:100%; height:auto; margin:0 auto; padding-bottom: 25px;}
.home-back { background: url(../images/background.gif) repeat-x left top; }
.main-back { background: url(../images/background_main.gif) repeat-x left top; }
.ui-back { background: #DCD8CC; }  /** light coffee **/
/* ======================================== Header ==========================================================  */

#header-container{ width:100%;height:auto; }
#header{ width:960px; padding:0px; margin:0 auto; height:100px!important }

/* ---------------- Header Logo -------------- */

#logo{ float:left;width:290px;margin:22px 0 0 0px; }


/* ---------------- menubar -------------- */

#menubar{width:650px; float:right; margin-top:35px;}
.menutabs ul{float:right; width:auto}
.menutabs li{display:block;float:left;margin:0;padding:0; width:auto}
.menutabs li:after{font-size:0px; line-height:0px; height:0px; content:'.'; visibility:hidden; display:block; clear:both}
/* \*/ * html .menutabs li{height:1px} /* */

.menutabs a{float:left;background:url(../images/menu-left.gif) no-repeat 0 0;
margin:0;margin-right:2px; color:#856150; padding:0 0 0 19px;white-space:nowrap;text-decoration:none;width:auto}

.menutabs a span{float:left;display:block;background:url(../images/menu-right.gif) no-repeat 100% 0;
padding: 6px 22px 11px 3px;font-size:15px;color:#333;font-weight:bold;cursor:pointer;width:auto}


.menutabs a.current, .menutabs a:hover{ background-position:0 -37px!important; }
.menutabs a.current span, .menutabs a:hover span{background-position:100% -37px; color:#fff;}



/* =================================== Middle Container Structure ===============================================  */

#middle-container{ width:100%; height:auto; padding:0px; }
#middle{ width:960px; padding:0; margin:0px auto; }


/* ===================================  banner  ===========================================================  */

#main-banner{ height:290px!important;}
#main-banner .screen{ position:absolute; margin:15px 0 0 580px; width:295px; height:273px;}

#main-banner ul.points{padding:20px 0px 5px 60px; width:500px;}
#main-banner ul.points li{ list-style:none; background:url(../images/banner-bullet.gif) no-repeat 0 0; color:#fff; font-size:28px; margin-bottom:5px; padding:0 0 0 38px;line-height:40px;}


.feature-section{padding:10px 0px 10px 20px; width:570px;}
.feature-section h1{color:#fff; font-size:37px; letter-spacing:-1px; padding:0px; margin:0px}
.feature-section h2{color:#fff; font-size:26px; font-weight:bold;  padding:0px; line-height: 45px;}

.feature-section ul.feature-list{padding:10px 0 0; margin:0}
.feature-section ul.feature-list li{ list-style:none; color:#fff; font-weight:bold; font-size:15px; background:url(../images/tick.gif) no-repeat 0 0; margin-bottom:5px; padding:0 0 0 28px;
  line-height: 25px;}


#main-banner p{ padding:0 0 0 210px;}
#main-banner p .btn-usenow{ display:block;background:url(../images/demo.png) no-repeat 0 0; width:236px; height:50px; font-size:0px; text-indent:-9999px}
#main-banner p .btn-playstore{ display:block;background:url(../images/googleplay.png) no-repeat 0 0; width:236px; height:50px; font-size:0px; text-indent:-9999px}
#main-banner p .btn-getstarted{ display:block; margin-left:100px;background:url(../images/btn-getstarted.gif) no-repeat 0 0; width:247px; height:47px; font-size:0px; text-indent:-9999px}

/* ===================================  banner  ===========================================================  */

.widget{ width:285px; padding:0px 15px 15px; float:left; background:url(../images/widget-bg.gif) no-repeat left top;}
.widget .img-thumb{ float:left; width:122px; height:111px; background:url(../images/thumb-shadow.gif) no-repeat left bottom; margin:0 12px 10px 0}
.widget h1{color:#4a4a4b;}
.widget h1.icon1{ background:url(../images/icon1.gif) no-repeat 0 0; padding:0 0 10px 55px;}
.widget h1.icon2{ background:url(../images/icon2.gif) no-repeat 0 0; padding:0 0 10px 55px;}
.widget h1.icon3{ background:url(../images/icon3.gif) no-repeat 0 0; padding:0 0 10px 55px;}
.widget .enlarge{position:absolute!important; width:24px; margin:-5px 0 0 102px; display:block;z-index:2;}


.widget2{ width:285px; padding:0px 15px 15px; float:left; background:url(../images/widget-bg-white.gif) no-repeat left top;}
.widget2 .img-thumb{ float:left; width:122px; height:111px; background:url(../images/thumb-shadow.gif) no-repeat left bottom; margin:0 12px 10px 0}
.widget2 h1{color:#4a4a4b;}
.widget2 h1.icon1{ background:url(../images/icon1.gif) no-repeat 0 0; padding:0 0 10px 55px;}
.widget2 h1.icon2{ background:url(../images/icon2.gif) no-repeat 0 0; padding:0 0 10px 55px;}
.widget2 h1.icon3{ background:url(../images/icon3.gif) no-repeat 0 0; padding:0 0 10px 55px;}
.widget2 .enlarge{position:absolute!important; width:24px; margin:-5px 0 0 102px; display:block;z-index:2;}


/* ===================================  banner  ===========================================================  */

.page-widget{ width:910px; padding:0px 20px 15px; margin:0 auto; background:url(../images/page-widget-bg.gif) no-repeat left top;}
.page-widget h1.page-heading{color:#4a4a4b; font-size:28px; border-bottom:1px solid #82c4e4; padding:10px 0px 3px; margin-bottom:10px; }
.page-widget h1.page-heading span{color:#00a7e2;}

.page-widget2{ width:910px; padding:0px 20px 15px; margin:0 auto; }
.page-widget2 h1.page-heading{color:#4a4a4b; font-size:28px; border-bottom:1px solid #82c4e4; padding:10px 0px 3px; margin-bottom:10px; }
.page-widget2 h1.page-heading span{color:#00a7e2;}

.page-widget h1.page-heading2{color:#4a4a4b; font-size:28px; padding:10px 0px 3px; margin-bottom:10px; }
.page-widget h1.page-heading2 span{color:#ed7b1f;}

.page-widget2{ width:910px; padding:0px 20px 15px; margin:0 auto; }
.page-widget2 h1.page-heading2{color:#4a4a4b; font-size:28px; padding:10px 0px 3px; margin-bottom:10px; }
.page-widget2 h1.page-heading2 span{color:#ed7b1f;}

.table_item{border-bottom:1px solid #82c4e4; padding:10px 0px 3px; margin-bottom:10px;}

.grader-form{ padding-top:10px}
.grader-form label{font-weight:bold; margin-right:30px}
.grader-form .inbox{ border:1px solid #ccc; padding:3px; width:830px}
.grader-form .textareabox{ border:1px solid #ccc; padding:3px; width:900px}
.grader-form p span{ font-size:11px; color:#777}

.terms-of-service{width:900px!important; height:90px!important; padding:5px!important;}
.btn-getreport{ border:0; cursor:pointer; margin-top:20px; display:block; background:url(../images/btn-getreport.gif) no-repeat 0 0; width:184px; height:41px; font-size:0px; text-indent:-9999px}


.list{padding:0; margin:0}
.list li{ list-style:none;padding:0 0 0 10px; margin:0 0 5px; background:url(../images/list-bullet.gif) no-repeat 0 8px}




/* ==============================================  Footer   ===========================================================  */

#footer-container{width:100%;height:auto;padding:0px; margin:0;background:#555 url(../images/footer-bg.gif) repeat-x left top;}
#footer{ width:88%; padding:20px 0px; margin:0 auto; font-size:12px;color:#acacac; text-align:center}
#footer ul {margin-top:-25px; }
#footer ul li{display:inline; }
#footer ul li a{padding:0px 6px; }
#footer .copyright{padding:10px 0px 0px 0px;}
#footer table { width: 100%; margin: 20px auto; }
#footer table td { text-align:left; padding: 10px; line-height:20px; }
#footer a { color:#999; }
#footer a:hover { color:#ddd; text-decoration:underline; }
#.firefox-img { float:right;background:url(../images/firefox-dark.gif) no-repeat 0 0; }
.firefox-img { float:right;background:url(../images/110x32_get_orange.png) no-repeat 0 0; }
.firefox-img:hover { background:url(../images/110x32_get_orange.png) no-repeat 0 0; }


/* ==============================================  Javascript Disabled ============================================ */
#javascript-disabled-container{ position:absolute; width:100%; z-index: 50; top:0; left:0; }
#javascript-disabled{ margin:0 auto; background: url(../images/post_it_note.gif) no-repeat; width:600px; height:550px; }
#javascript-disabled div { padding: 175px 75px 0 70px;  width:350px;height:550px; font-size:16px;line-height:25px; margin: 0 0 0 25px}
