/* CSS Document */

img, div { behavior: url(iepngfix.htc) }

body {margin: 0; background: #f7f7f7; font: 11px/15px Tahoma, Verdana, Arial, sans-serif; color: #464646;}

.orange {color: #e64d00 !important;}
.normal {font-weight: normal !important;}

#main {width: 770px; margin: 0 auto; background: #fff; padding-bottom: 10px;}


#top {clear: both; height: 135px;}
#top a.logo {display: block; float: left; background: url(../img/img_logo.gif) no-repeat #008ec8; width: 286px; height: 135px; text-decoration: none;}

#top .right {float: right; width: 484px;}
#top .right .header {position: relative; background: url(../img/bck_slogan.gif) repeat-y; height: 99px;}
#top .right .header .slogan {position: absolute; right: 68px; top: 35px; background: url(../img/img_slogan.gif) no-repeat; width: 402px; height: 32px;}

#top .right #countrysites {float: right; background: url(../img/bck_country_site.gif) no-repeat; width: 126px; height: 48px; margin: 30px 10px 0 0;}
#top .right #countrysites select {border: 1px solid #ccc; padding: 2px; width: 108px; margin-top: 22px; margin-left: 10px; font: 11px Tahoma, Verdana, Arial, sans-serif; color: #464646;}

#top .right #menuTop {background: url(../img/bck_menu_top.gif) repeat-y #909090; height: 35px; border-top: 1px solid #fff;}
#top .right ul {list-style: none; margin: 0; padding: 0; padding-left: 50px;}

#menuTop {padding-left: 12px !important;}
#menuTop .flags {font-size: 9px; color: #fff !important; padding-left: 15px;}

#menuTop .flags a {color: #fff; text-decoration: none; padding: 0; cursor: pointer; display: inline !important; padding: 0 !important; border: 0 !important; float: none !important;}
#menuTop .flags a:hover {text-decoration: underline; filter: alpha(opacity=60); opacity: 0.6; -moz-opacity:0.6;}
#menuTop .flags a:hover img, .flags a.active img {filter: alpha(opacity=100); opacity: 1; -moz-opacity: 1;}
#menuTop .flags img {vertical-align: middle; border: 0; margin: 0 1px 0 0; _margin-top: 10px;}




#top .right ul li {display: inline;}
#top .right li {line-height: 34px; color: #acacac;}
#top .right li a {padding: 0 16px 0 15px; color: #fff; text-decoration: none; display: block; float: left; border-right: 1px solid #7a7a7a; border-left: 1px solid #a6a6a6; height: 35px;}
#top .right li a:hover, #top .right li a.active {color: #464646; background: #9c9c9c;}


#menuTop2 {background: #ff671b; border-top: 1px solid #fff; list-style: none; margin: 0; padding: 0; padding-left: 40px; color: #ccc; height: 35px;  line-height: 33px; border-right: 1px solid #ff4d14; border-left: 1px solid #ff8122;}
#menuTop2 li {display: inline;}
#menuTop2 li a {padding: 0 18px; color: #fff; text-decoration: none; font-weight: bold; font-size: 14px; display: block; float: left; border-right: 1px solid #ff4d14; border-left: 1px solid #ff8122; height: 35px;}
#menuTop2 li a:hover, #menuTop2 li a.active  {color: #fff; background: #ff7d3c;}


#content {clear: both; padding: 14px 15px; overflow: hidden; _height:100%;}


#leftMenu {background: #787878; width: 150px; color: #fff;float: left; width: 150px;}
#leftMenu h2 {font: bold 19px/19px Tahoma, Verdana, Arial, sans-serif; color: #fff; margin: 0; padding: 5px 0 0 15px;}
#leftMenu ul {margin: 0; padding: 0; background: #b4b4b4; list-style: none; margin: 15px 0; border-bottom: 1px solid #b4b4b4;}
#leftMenu li {margin: 0; padding: 0;}
#leftMenu a {color: #464646; text-decoration: none; display: block; border-top: 1px solid #c7c7c7; border-bottom: 1px solid #a1a1a1; padding: 4px 7px; _height: 17px;}
#leftMenu a:hover, #leftMenu a.active  {color: #fff; text-decoration: none; background: #ff671b; border-top: 1px solid #ff8122; border-bottom: 1px solid #ff4d14;}
#leftMenu p {margin: 0; padding: 0 15px 15px; line-height: 14px;}
#leftMenu p a {display: inline !important; color: #fff !important; text-decoration: underline !important; border: 0 !important; padding:0  !important;}
#leftMenu .top {clear: both; background:url(../img/bck_left_top.gif) no-repeat; height: 10px; _font-size: 1px;}
#leftMenu .bottom {clear: both; background:url(../img/bck_left_bot.gif) no-repeat; height: 10px; _font-size: 1px;}


#leftMenu ul ul {margin: 0; padding: 0; border: 0 !important; background: #787878; }
#leftMenu ul ul li {color: #fff; text-decoration: none; border: 0 !important;}
#leftMenu ul ul li a {color: #fff; font-size: 10px; margin: 0; padding: 4px 0 4px 10px; border-bottom: 1px solid #6c6c6c !important;  border-top: 1px solid #848484 !important;}
#leftMenu ul ul li a.active, #leftMenu ul ul li a:hover {color: #fff; text-decoration: none; background: #606060 !important; border-top: 1px solid #6a6a6a !important; border-bottom: 1px solid #565656 !important;}
#leftMenu ul ul li a.active {font-weight: bold;} 


.leftBanner {float: left; width: 150px;}

#rightInfo {float: right; width: 577px; _margin-right: -15px; position:relative;}
#rightInfo .banFreeTrialCourses {position:absolute; left: 445px; top: -16px; width:148px; height:148px; background:url(../img/banner_free_trialcourses.png) no-repeat; _background:url(../img/banner_free.gif) no-repeat;}
#rightInfo .banFreeTrialCourses a {}

#intro {background: url(../img/bck_home_intro_top.gif) no-repeat #FF6600;}
#intro img {float: left;}
#intro .slogan  {background: url(../img/img_tit_home.gif) no-repeat; width: 272px; height: 101px; float: right; margin-right: 30px; margin-top: 25px; margin-bottom: 10px;}
#intro p {margin: 0; font: 17px/20px Tahoma, Verdana, Arial, Helvetica, sans-serif; color: #fff; margin-left: 280px;}

#features {clear: both; background: url(../img/bck_home_intro_bot.gif) no-repeat bottom; height: 153px; position: relative;}
#features .feature img {float: right;  position: absolute; top: 10px; right: 9px; _right: 8px;}
#features .feature h1 {margin: 0; font: bold 21px/20px Tahoma, Verdana, Arial, Helvetica, sans-serif; color: #e64d00; padding-top: 35px; padding-left: 30px; width: 310px;}
#features .feature p {margin: 0; font: 14px/19px Tahoma, Verdana, Arial, Helvetica, sans-serif; color: #353535; padding-left: 30px; padding-top: 15px; width: 310px;}


#banners {clear: both; padding-top: 6px;}
#banners div.left {float: left; width: 366px;}
#banners div.right {float: right; width: 203px;}

.btn {color: #fff; margin: 6px 0;}
.btn a {color: #fff; text-decoration: none;}
.btn a:hover {text-decoration: underline;}

.blueLg {background: #007eb9; height: 87px;}
.blueLg span.right {background: url(../img/bck_btn_blue_lg_right.gif) no-repeat; width: 12px; height: 87px; display: block; float: right; margin-top: -62px;}
.blueLg img {float: left; margin-right: 15px;}
.blueLg p {margin: 0; padding-top: 18px;}
.blueLg a {font: bold 19px/22px Tahoma, Verdana, Arial, Helvetica, sans-serif;}


.blueSm, .orangeSm, .graySm  {height: 40px; font: 14px/38px Tahoma, Verdana, Arial, Helvetica, sans-serif; text-align: center;}
.blueSm {background: url(../img/bck_btn_blue_sm.gif) repeat-x #007eb9;}
.orangeSm {background: url(../img/bck_btn_org_sm.gif) repeat-x #ff6a1c;}
.graySm {background: url(../img/bck_btn_gray_sm.gif) repeat-x #8c8c8c;}


.blueSm span.left, .orangeSm span.left, .blueSm span.right, .orangeSm span.right,  .btn.graySm span.left,  .btn.graySm span.right {width: 12px; height: 40px; display: block;}
.blueSm span.left, .orangeSm span.left, .btn.graySm span.left {float: left;}
.blueSm span.right, .orangeSm span.right,  .btn.graySm span.right {float: right; margin-top: 0px; .margin-top: -38px;}
.orangeSm span.right {margin-top: 0px; .margin-top: -38px;}
.infoBox .orangeSm span.right {margin-top: 0px; .margin-top: -38px;}


.blueSm span.left {background: url(../img/bck_btn_blue_sm_left.gif) no-repeat;}
.blueSm span.right {background: url(../img/bck_btn_blue_sm_right.gif) no-repeat;}
.blueSm span.right, x:-moz-any-link, x:default {margin-top: 0px; .margin-top: -38px;}
body:first-of-type .blueSm span.right {margin-top:0;}


.btn.orangeSm span.left {background: url(../img/bck_btn_org_sm_left.gif) no-repeat;}
.btn.orangeSm span.right {background: url(../img/bck_btn_org_sm_right.gif) no-repeat;}

.btn.graySm span.left {background: url(../img/bck_btn_gray_sm_left.gif) no-repeat;}
.btn.graySm span.right {background: url(../img/bck_btn_gray_sm_right.gif) no-repeat;}
.btn.graySm span.right, x:-moz-any-link, x:default {margin-top: 0px; .margin-top: -38px;}
body:first-of-type .btn.graySm span.right {margin-top:0;}

.blueSm  a, .orangeSm  a, .graySm  a {padding-right: 10px;}

.teachers {clear: both; margin: 0 25px 10px; _margin-top: 15px;}



/* /////////////////////// Landing pages //////////////////////// */


div.intro {clear: both; _margin-right: 30px; margin-left: 25px; _margin-left: 0; overflow: hidden;}
.intro img {float: right; margin-right: 10px; margin-top: 15px; _margin-right: 5px;}
.intro h1 {font: bold 21px/24px Tahoma, Verdana, Arial, Helvetica, sans-serif; color: #e64d00; margin: 20px 0 15px;}
.intro .intro {font: 14px/18px Tahoma, Verdana, Arial, Helvetica, sans-serif; margin: 0; width: 390px;}
.intro a {color: #e64d00;}
.intro a:hover {color: #464646;}

hr {clear: both; height: 1px; color: #e5e5e5 !important; background: #e5e5e5 !important; margin: 15px 10px; border: 0;}


.infoBox {clear: both; margin: 15px 0; background: url(../img/box_white_bck.gif) repeat-y; width: 577px; _position: relative; _left: -30px; _top: 10px;}
.infoBox .top {clear: both;background: url(../img/box_white_top.gif) no-repeat; height: 10px; _font-size: 1px;}
.infoBox .bottom {clear: both;background: url(../img/box_white_bot.gif) no-repeat; height: 10px; _font-size: 1px;}
.infoBox img {float: left; margin: 3px 11px 10px; border: 1px solid #c3c3c3;}
.infoBox h2 {margin: 10px 0 0 30px; font: bold 17px/20px Tahoma, Verdana, Arial, Helvetica, sans-serif; color: #e64d00;}

.infoBox ul {margin: 15px 35px; padding: 0; list-style: none;}

.infoBox p {margin: 10px 30px; font-size:12px;}
.infoBox p.intro {font-weight: bold; padding-right: 50px;}
.infoBox .clear {clear: both;}

.infoBox .orangeSm {width: 91%; clear: both; margin: 10px; margin-left: 25px;}
.infoBox .orangeSm a {color: #fff !important;}

.infoBox a {color: #e64d00;}
.infoBox a:hover {color: #464646;}

.infoBox input {border: 1px solid #ccc; width: 280px;}
.infoBox textarea {border: 1px solid #ccc; width: 210px; height: 80px;}
.infoBox select {border: 1px solid #ccc; width: 216px;}
.infoBox td {padding-bottom: 5px; vertical-align: top;}

.infoBox td.tit {color: #e64d00; border-bottom: 1px solid #e5e5e5; padding: 15px 0 0;}
.infoBox #pricing td  {padding-bottom: 2px; vertical-align: middle;}


.infoBox input.noBorder, .courses input {border: 0 !important; width: auto !important;}
.infoBox input.btnOk {background: #FF6600; color: #fff; font-weight: bold; padding: 2px 5px; width: auto !important;}
.infoBox input.btnCancel {background: #ccc; color: #666; padding: 2px 5px; width: auto !important;}

.infoBox ul li {padding-bottom: 8px;}

.courses {margin: 10px 0;}
.courses td {padding: 0 5px 0 15px;}
.courses p {margin: 5px !important;}



/* /////////////////////// Footer //////////////////////// */


#footer	{padding: 0 15px 15px; clear: both; margin: 10px;}
#footer p {margin: 10px 0; padding-left: 150px;}

.info	{font-size: 9px; line-height: 14px; color: #92a0b0; padding:14px; margin: 0px; text-align: left;}
.info	a		{color: #92a0b0;}
.info	a:hover	{color: #0084ba;}

.cards	 {color: #cdcdcd; margin-top: 10px; font-size: 11px;}
.cards	a		{font-weight: bold; color: #086fa8; text-decoration: none; padding: 0 5px;}
.cards	a:hover	{color: #0084ba; text-decoration: underline;}
.cards img {float: right; margin-top: -10px;}

.box {clear: both; height: 28px; line-height: 28px; background-color: #e7f1f8; text-align: center; color: #50667e;}
.box .left 	{width: 13px; height: 28px; background: url(../img/box_footer_left.gif) no-repeat; float: left;}
.box .right {width: 13px; height: 28px; background: url(../img/box_footer_right.gif) no-repeat top right; float: right; .margin-top: -28px;}
.box	a		{color: #50667e; padding-left: 5px;}
.box	a:hover	{color: #0084ba;}

.ontwitter {background: url(/img/follow_us_twitter.gif) no-repeat 0px 0px; height:35px; padding:2px 0 0 39px; display:block;}
a#ontwitter:hover {text-decoration:none; color:#0BBAF3; cursor:pointer;}
a#ontwitter {display:block; width:150px; height:100%; padding:0; cursor:pointer;}