/* ___________MAiN CSS____________________*/
img, body, html {
    border: 0 none;
}

body {
    background: url("../images/bg_no_grad.png") repeat-x left top #FAFAFA;
    color: black;
    font-family: Arial, sans-serif;
    font-size: small;
    margin: 0;
    padding: 0;
}

a {
    color: #0066CC;
}

.yellowLink {
    color: yellow;
}

.homePageHugeButton {
    background-color: #3784D6;
    border: 1px solid #337FED;
    border-radius: 6px 6px 6px 6px;
    box-shadow: 0 1px 0 0 #97C4FE inset;
    color: #FFFFFF;
    display: inline-block;
    font-family: arial;
    font-size: 22px;
    font-weight: bold;
    padding: 16px 24px;
    text-decoration: none;
    text-shadow: 1px 1px 0 #1570CD;
}

.wrapper {
    width: 1200px;
    margin: 0 auto;
}

/* ___________HEADER____________________*/
#header {
    padding: 12px 0;
    float: left;
    width: 100%;
    padding-bottom: 0;
}

.title-group {
    background: url(../images/header_bg.png) repeat #2e6c9d;
    border-top: 1px solid #6493b8;
    margin-bottom: 15px;
}

.title-group h1, .title-group h2 {
    color: #ffffff!important;
}

#header img {
    float: left;
    margin-right: 15px;
}

#top-menu {
    float: left;
    padding-top: 5px;
}

#top-menu ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

#top-menu ul li {
    float: left;
    height: 40px;
    line-height: 40px;
    width: 140px;
    border-left: 1px solid #A9A9A9 !important;
}

#top-menu ul li a {
    display: block;
    color: #FFFFFF;
    text-decoration: none;
    font-family: Tahoma, sans-serif;
    font-size: 13px;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
}

#top-menu ul li.last {
    border-right: 1px solid #A9A9A9 !important;
}

#top-menu ul li a:hover, #top-menu ul li.active a {
    color: #98d2ff;
}

.login {
    float: right;
    font-size: small;
    color: #ffffff;
    padding-top: 9px;
}

/* ___________MAIN CONTENT____________________*/
.content {
    float: left;
    width: 900px;
    text-align: center;
}

.content.no-sidebar {
    width: 100%;
}

.content h1.title {
    color: #333333;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 81px;
    font-weight: bold;
    letter-spacing: -1px;
    text-align: center;
    width: 100%;
    margin-top: 70px;
    margin-bottom: 10px;
    text-transform: capitalize;
}

.content h2.subtitle {
    color: #555555;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 40px;
    font-weight: 300;
    text-align: center;
    width: 100%;
    margin: 0;
    margin-bottom: 30px;
}

.boxes {
    float: left;
    margin-top: 100px;
    margin-bottom: 50px;
}

.info-box {
    float: left;
    width: 282px;
    margin-right: 20px;
    text-align: left;
}

.info-box.last {
    margin-right: 0;
}

.info-box img {
    float: left;
    margin-right: 10px;
}

.info-box h3 {
    color: #333333;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 22px;
    margin: 0;
}

.info-box p {
    color: #333333;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 13px;
    line-height: 18px;
}

/* ___________SIDEBAR____________________*/
.sidebar {
    float: right;
    width: 270px;
    margin-top: 45px;
}

.sidebar h3 {
    color: #999999;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 18px;
    font-weight: 300;
    width: 100%;
    margin: 0;
}

.teacher-panel {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.teacher-panel li {
    background-color: #FFFFFF;
    border: 1px solid #EAEAEA;
    margin: 0 4px 6px 0;
    padding: 7px;
    float: left;
}

.teacher-panel li p {
    color: #444444;
    font-size: 8pt;
    font-weight: normal;
    margin: 0;
    float: left;
    width: 190px;
}

.teacher-panel li img {
    width: 50px;
    height: 76px;
    float: left;
    margin-right: 10px;
}

.teacher-panel li h4, .teacher-panel li a {
    margin: 0;
    float: left;
    color: #444444;
    font-size: 10pt;
    font-weight: bold;
    padding: 0;
    margin-bottom: 3px;
}

/* ___________CATEGORY____________________*/
.category {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    text-align: left;
    margin-top: 10px;
}

.category .teacher-panel li a:hover h4 {
    text-decoration: underline;
}

.category .teacher-panel li {
    width: 270px;
}

.category .teacher-panel p {
    text-align: left;
}

.lessons-links {
    margin: 0;
    padding: 0;
    list-style-type: none;
    float: left;
    width: 100%;
    margin-bottom: 20px;
    margin-top: 10px;
}

.lessons-links li {
    float: left;
    margin-right: 10px;
}

/* ___________FOOTER____________________*/
footer {
    color: #999999;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 12px;
    font-weight: 300;
    text-align: center;
    width: 100%;
    margin-bottom: 30px;
    clear: both;
}

/* ___________REGISTER PAGE____________________*/
.register-form {
    float: left;
    width: 100%;
    text-align: center;
    margin-top: 50px;
}

.register-form .content {
    width: 480px;
    float: none;
    text-align: left;
    display: inline-block;
}

.register-form .content h2 {
    margin: 0;
    padding-bottom: 20px;
    font-size: 20px;
    color: black;
    font-family: Arial, sans-serif;
    font-weight: normal;
    background: url("../images/hr.png") repeat-x scroll left bottom transparent;
    width: 100%;
}

.register-form .content p {
    width: 360px;
    margin-bottom: 20px;
}

.register-form label {
    width: 100%;
    display: block;
    margin-bottom: 2px;
    font-weight: bold;
}

.text-box {
    background-color: white;
    border: 1px solid #1D6BBB;
    border-radius: 3px 3px 3px 3px;
    color: #1D6BBB;
    font-size: 14pt;
    font-weight: bolder;
    padding: 2px;
    width: 400px;
    margin-bottom: 10px;
}

.lightBlueButton {
    background-color: #CAE4F7;
    border: 1px solid #469DF5;
    border-radius: 6px 6px 6px 6px;
    color: #000000;
    display: inline-block;
    font-family: Arial, sans-serif;
    font-size: 15px;
    font-weight: normal;
    outline: 0 none;
    padding: 5px 19px;
    text-decoration: none;
    margin-top: 20px;
    margin-bottom: 20px;
    cursor: pointer;
}

.lightBlueButton:hover {
    background-color: #99C1ED;
    outline: 0 none;
}

.redText {
    color: #FA5200;
}

.error {
    color: red;
    margin-bottom: 10px;
    display: none;
}

.editor {
    float: left;
    position: relative;
    width: 900px;
    text-align: center;
    margin-top: 50px;
}
/* ___________CATEGORY TABLE____________________*/
table { border-collapse:collapse; }
.page-wrapper { float: left; width: 100%; text-align: left; padding-top: 30px; }
.sidebar.left { float: left; width: 200px; clear: both; margin-top: 20px; }
.title-blue { color: #99C1ED; font-size: 32px; font-weight: normal; display: inline-block; float: left; margin: 0; }
.change-link { margin-left: 15px; float: left; margin-top: 15px; }
.sidebar.left form { margin-bottom: 15px; }
.sidebar.left form input { margin-left: 0; }
.sidebar.left h3 { margin-bottom: 3px; }

.chess-results { margin-top: 5px; color: #555555; }
.category-with-tags .tags { margin-top: 5px; list-style-type: none; margin-top: 5px; padding: 0;} 
.category-with-tags h4 { margin-top: 5px; }
.category-with-tags img { margin-top: 5px; margin-bottom: 3px; }
.category-with-tags { margin-top: 20px; width: 100%; margin-bottom: 20px; }
.category-with-tags tr td { border-bottom: solid 1px #d9e5ed; padding-bottom: 5px; padding-top: 8px; }
.category-with-tags .chess-results img { margin-bottom: 0; margin-top: 0; }
.category-with-tags .tags li { float: left; margin-right: 5px; padding: 2px 5px; border: 1px solid #CAE4F7; border-radius: 6px; -webkit-border-radius: 6px; color: #000000; }
/* ___________ABOUT AUTHOR PAGE____________________*/
.author-profile { float: left; margin-top: 15px; }
.author-profile img { float: left; margin-right: 20px; margin-bottom: 9px; }
.author-profile p { width: auto!important; margin-top: 0!important; }
/* ___________LESSON PAGE____________________*/
.title-blue span { color: #555555; }
.topic-menu { list-style-type: none; margin: 0; padding: 0; float: left; width: 100%; margin-top: 10px; margin-bottom: 20px; }
.topic-menu li { float: left; margin-right: 5px; }
.topic-menu li a { background-color: #FFFFFF; border: 1px solid #469DF5; border-radius: 6px 6px 6px 6px; box-shadow: 0 1px 0 0 #FFFFFF; color: #333333; display: inline-block; font-family: Arial,sans-serif; font-size: 15px; font-weight: normal; outline: 0 none; padding: 5px 19px; text-decoration: none; }
.topic-menu li a:hover { background-color: #E9E9E9; outline: 0 none; }

.introPreviewText { color: #444444; font-size: 12pt; float: left; }
/* ___________FLASH CARD ORDER CHOICE____________________*/
.left-column { clear: both; }
.left-column, .right-column { width: 550px; float: left; padding-right: 50px; text-align: center; }
.left-column p, .right-column p { text-align: left; }
/* ___________FLASH CARDS____________________*/
.smart-review { background-color: transparent; background-position: 590px 127px; background-repeat: no-repeat; font-size: 12pt; vertical-align: top; }
.buttonRateAnswer { background-color: #CAE4F7; border: 1px solid #469DF5; border-radius: 6px 6px 6px 6px; color: #000000; display: inline-block; font-family: Arial,sans-serif; font-size: 15px; font-weight: normal; outline: 0 none; padding: 8px 24px; text-decoration: none;}
.buttonRateAnswer:hover { background-color: #99C1ED; outline: 0 none; }
.buttonRateAnswer:active { outline: 0 none; position: relative; top: 1px; }

.quiz-left { float: left; width: 440px; margin-right: 70px; }
.quiz-right { float: left; width: 690px; }
.quiz-right  p { color: #444444; line-height: 140%; margin-bottom: 20px; }
.quiz-left p { color: #444444; font-size: 16px; font-weight: bold; }
.quiz-left .top-info { margin-top: -10px; }
.quiz-left p span { font-weight: normal; }
.quiz-left p.result { font-size: 12pt; }
.quiz-left .buttonRateAnswer { margin-bottom: 10px; width: 392px; text-align: center; }

.silver-button { background-color: #EDEDED; border: 1px solid #DCDCDC; border-radius: 6px 6px 6px 6px; box-shadow: 0 1px 0 0 #FFFFFF inset; color: #777777; display: inline-block; font-family: Arial,sans-serif; font-size: 15px; outline: 0 none; padding: 8px 24px; text-decoration: none; text-shadow: 1px 1px 0 #FFFFFF; }
.silver-button:hover { background-color: #DFDFDF; outline: 0 none; }
.silver-button:active { outline: 0 none; position: relative; top: 1px; }

.select-answer { float: left; color: #666666; font-size: 12pt; margin-top: 10px; }
.select-answer ul { list-style-type: none; padding: 0; margin: 0; margin-top: 10px; display:block; float:left; }
.select-answer ul li { float: left; margin-right: 10px; }
.select-answer ul li button { text-align: center; width: 215px; margin-bottom: 10px; cursor: pointer; }
.select-answer ul li.last { margin: 0; }
/* ___________DIALOG____________________*/
.dialog { background-color: #FAFAFA; font-size: 12pt; padding: 20px; border: 6px solid #979696; box-shadow: 5px 5px 20px #888888; width: 800px; position: absolute; top: 35%; left: 20%; text-align: center; display: none; z-index: 1; }
.dialog p { text-align: left; }
.dialog .center-header { text-align: center; font-weight: bold; }
.page-wrapper { position: relative; }
.whiteButton { background-color: #FFFFFF; border: 1px solid #469DF5; border-radius: 6px 6px 6px 6px; box-shadow: 0 1px 0 0 #FFFFFF; color: #333333; display: inline-block; font-family: Arial,sans-serif; font-size: 15px; font-weight: normal; outline: 0 none; padding: 5px 19px; text-decoration: none; }
.whiteButton:hover { background-color: #E9E9E9; outline: 0 none; }
.whiteButton:active { outline: 0 none; position: relative; top: 1px; }
.popup-wrapper {  background-color: #000000; opacity: 0.3; width: 100%; height: 100%; position: absolute; top: 0; left: 0; display: none; }
/* ___________404 PAGE____________________*/
.not-found h1 { float: left; width: 100%; text-align: center; font-size: 120px; margin-bottom: 20px; }
.not-found p { float: left; width: 100%; text-align: center; font-size: 36px; text-transform: uppercase; margin-top: 0; }