html, body { 
    background: linear-gradient(#3781b8, #204873);
    font-family: Arial, Helvetica, sans-serif;
    color: #111;
    font-size: 12px;
    margin: 0 auto;
    padding: 0;
    text-align: center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    position: absolute;
    padding: 0;
    margin: 0;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

@font-face {
    font-family: 'titilliumregular';
    src: url('font/titillium-regular-webfont.eot');
    src: url('font/titillium-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/titillium-regular-webfont.woff2') format('woff2'),
         url('font/titillium-regular-webfont.woff') format('woff'),
         url('font/titillium-regular-webfont.ttf') format('truetype'),
         url('font/titillium-regular-webfont.svg#titilliumregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

.main {
    width: 900px;
    height: 100% auto;
    margin: 0 auto !important;
    box-shadow: 0 0 8px #fff;
}

.bottom {
    display: none; 
    background-color: #313131;
    border: #969696 solid 1px;
    height: 0px;
}

.middle {
    background-color: #eee;
    height: auto;
    margin: 5px 0 0 0;
    padding: 10px 15px 10px 15px;
    text-align: left;
    line-height: 24px;
    font-size: 12px;
}

.middle_teacher {
    background-color: #eee;
    margin: 5px 0px 0px 0px;
    padding: 10px 0px 10px 0px;
    text-align: center;
    line-height: 24px;
    font-size: 12px;
}

.logoLine {
    background: rgba(33, 33, 33, 0.5) bottom center repeat-y;
    padding: 3px 0px 3px 0px;
    min-height: 40px;
}

.stats { 
    background: url(../img/side.jpg) repeat-x bottom;
    background-color: #313131;
    border-left: #767676 solid 1px;
    border-top: #767676 solid 1px;
    border-bottom: #767676 solid 1px;
    border-right: 0px;
    width: 250px;
    height: 710px;
    margin: 5px 0px 5px 0px;
}

.stats.rtl {
    background: url(../img/side.jpg) repeat-x bottom;
    background-color: #313131;
    border-right: #767676 solid 1px;
    border-top: #767676 solid 1px;
    border-bottom: #767676 solid 1px;
    border-left: 0px;
    width: 250px;
    height: 710px;
    margin: 5px 0px 5px 0px;
}

.stats_declaration {
    background: url(../img/side.jpg) repeat-x bottom;
    background-color: #313131;
    border-left: #767676 solid 1px;
    border-top: #767676 solid 1px;
    border-bottom: #767676 solid 1px;
    width: 250px;
    height: 880px;
    margin: 5px 0px 5px 0px;
}

.stats_declaration.rtl {
    background: url(../img/side.jpg) repeat-x bottom;
    background-color: #313131;
    border-right: #767676 solid 1px;
    border-top: #767676 solid 1px;
    border-bottom: #767676 solid 1px;
    border-left: none;
    width: 250px;
    height: 880px;
    margin: 5px 0px 5px 0px;
}

.stats_r {
    background: url(../img/side.jpg) repeat-x bottom;
    background-color: #313131;
    border-right: #767676 solid 1px;
    border-top: #767676 solid 1px;
    border-bottom: #767676 solid 1px;
    width: 252px;
    height: 710px;
    margin: 5px 0px 5px 0px;
}

.stats_r.rtl {
    background: url(../img/side.jpg) repeat-x bottom;
    background-color: #313131;
    border-left: #767676 solid 1px;
    border-top: #767676 solid 1px;
    border-bottom: #767676 solid 1px;
    border-right: none;
    width: 252px;
    height: 710px;
    margin: 5px 0px 5px 0px;
}

.stats_declaration_r {
    background: url(../img/side.jpg) repeat-x bottom;
    background-color: #313131;
    border-right: #767676 solid 1px;
    border-top: #767676 solid 1px;
    border-bottom: #767676 solid 1px;
    width: 252px;
    height: 880px;
    margin: 5px 0px 5px 0px;
}

.stats_declaration_r.rtl {
    background: url(../img/side.jpg) repeat-x bottom;
    background-color: #313131;
    border-left: #767676 solid 1px;
    border-top: #767676 solid 1px;
    border-bottom: #767676 solid 1px;
    border-left: none;
    width: 252px;
    height: 880px;
    margin: 5px 0px 5px 0px;
}

.stats_main {
    background: url(../img/side.jpg) repeat-x bottom;
    background-color: #313131;
    border-top: #767676 solid 1px;
    border-bottom: #767676 solid 1px;
    border-left: #565656 dotted 2px;
    border-right: #565656 dotted 2px;
    width: 380px;
    height: 448px;
    margin: 5px 0px 5px 0px;
    padding: 100px 0px;
}

.login {
    background: url(../img/side.jpg) repeat-x bottom;
    background-color: #313131;
    border-top: #767676 solid 1px;
    border-bottom: #767676 solid 1px;
    border-left: #565656 dotted 2px;
    border-right: #565656 dotted 2px;
    width: 380px;
    height: 698px;
    margin: 5px 0px 5px 0px;
    padding: 12px 0px 0px 0px;
}

.login_declaration {
    background: url(../img/side.jpg) repeat-x bottom;
    background-color: #313131;
    border-top: #767676 solid 1px;
    border-bottom: #767676 solid 1px;
    border-left: #565656 dotted 2px;
    border-right: #565656 dotted 2px;
    width: 380px;
    height: 850px;
    margin: 5px 0px 5px 0px;
    padding: 30px 0px 0px 0px;
}

.declarationHolder {
    margin: 20px 0 0 0;
    font-size: 11pt;
    border-radius: 4px;
    /* border: solid 1px #bbb; */
    background-color: white;
    overflow: hidden;
}

.declarationHeader {
    background-color: #2e5984;
    padding: 7px 6px;
    color: white;
    font-size: 12px;
    font-weight: bold;
    text-align: left;
}

.declarationText {
    color: black;
    padding: 20px 0;
    border: solid 1px #bbb;
}

.declarationActions {
    background-color: #cb3333;
    padding: 6px 0 8px 0;
}

.declarationChoice {
    color: white;
}

#declarationDecline {
    margin-left: 30px;
}

.stats_table {
    background-color: #eee; 
    border: #969696 solid 1px; 
    width: 900px; 
    margin: 10px 0px 10px 0px;
}

.stats_table_in { 
    border: #767676 solid 1px; 
    margin:10px; 
    padding: 10px;
}

.top {
    background-color: transparent; 
    height:  50px; 
    text-align:center;
}

.top_line {
    background-color: #dcdcdc;
    border: 1px dotted #888;
    border-radius: 3px;
    text-align: center;
    height: 25px; 
    font-size: 16px; 
    color: #222; 
    line-height: 34px;
    font-family: titilliumregular;
    padding: 0 0 10px 0;
}

.top_head {
    font-weight: bold; 
    color: #ffffff; 
    padding: 10px 0px 5px 0px;
}

.title {
    color:#fff; 
    font: 28px titilliumregular, Arial, Helvetica, sans-serif; 
    text-align: center;
}

.sub_title {color:#222; font-size:18px; font-weight:bold; text-align:center; padding:10px 0px 10px 0px;}
.stats_btn {background:url(../img/stats_btn.png) no-repeat center; width:384px; height:35px; padding-top:13px;}
.stats_thin {background:#313131; border: #767676 solid 1px; width:380px; height:20px; margin:10px 0px 7px 0px;}
.bag_analysis {background-color:#FFFFFF; color:#000000; font-size:12px; text-align:center; } 
.gray { background-color:#e8e8e8;}
a.stati {text-decoration:none; color:#000000; }
a.stati:hover { color:#ffffff; }
.wait {color:#E9E4B3; font-size:18px; }

.bag_image 
{ 
    background-color: #999999; 
    border: #b1b1b1 solid 1px; 
    width:345px; 
    height:307px; 
    color:#000000; 
    text-align:left; 
    padding:10px; 
}

.bag_image#infoBox, .bag_image#clicksInfoBox, .bag_image#itemInfoBox { background-image: url(../img/backbag.jpg); line-height: 20px; }
.marker {background-color:#f7f3b5;}
.bag_image_mid {background:url(../img/mid.jpg) center; border-top: #d8d8d8 solid 1px; color:#000000; text-align:center; border-bottom:#333333 solid 1px; padding:2px 5px;}
.no-threat {background-image:url(../img/backbag_small.jpg); border: #9fc073 solid 3px; text-align:center; width:158px; }
.threat {background-image:url(../img/backbag_small.jpg); border: #e24438 solid 3px; text-align:center; width:158px; }
.empty {background-image:url(../img/backbag_small.jpg); border: #b1b1b1 solid 3px; text-align:center; width:158px; }
.export {background-color:#313131; border:#969696 solid 1px; height:474px; margin:10px 0px 0px 0px; padding:10px 15px 10px 15px; text-align:left; line-height:24px; font-size:12px; }
.basic {background-color:#313131; border: #969696 solid 1px; width:auto; font-size:12px; margin:10px 0px 0px 10px; padding:10px; text-align:center; color:#FFFFFF;}
.basic-side {background-color:#1d1d1d; border: #4a4a4a solid 1px; width:auto; height:auto; font-size:12px; padding:10px; margin:0px 5px 0px 0px; line-height:23px;}
.item { border: #fffbbb solid 2px; margin:5px 5px 0px 0px;}
.select_tbl {background-color:#1d1d1d; border: #4a4a4a solid 1px; text-align:center; padding:10px; margin:0px 5px 0px 0px;}
.address {background:url(../img/new_back2.png); font-size: 12px; color: #FDF9BA; line-height: 20px; padding:10px;}
.address-small {display: none; background:url(../img/new_back2.png); font-size: 9px; color: #FDF9BA; line-height: 20px; padding:10px;}
/*a {color: #Ffffff}
a:hover {text-decoration:none; color: #FDF9BA;}*/
a.but {  border:#151515 solid 2px; }
a.but:hover { border: #fff9a1 solid 2px;}
.list { width:300px; }


.error_text {color:#fca1a1;}

.itemImage { padding: 10px 0 10px 0; }

.inputButtonVariable 
{ 
    background: #ab3333;
    border: #ad3a3a solid 1px;
    text-align: center;
    height: 32px;
    color: #fff;
    cursor: pointer;
    font-size: 10pt;
    -webkit-transition: -webkit-box-shadow 0.5s ease-out;;
    -moz-transition: -moz-box-shadow 0.5s ease-out;
    -o-transition: box-shadow 0.5s ease-out;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
}

.inputButtonVariable:hover 
{ 
    -moz-box-shadow: 0px 0px 5px #ab3333;
    -webkit-box-shadow: 0px 0px 5px #ab3333;
    box-shadow: 0px 0px 5px #ab3333;
    background: #d16363;
}

.inputButtonVariableBig 
{ 
    background: #ab3333;
    border: #ad3a3a solid 1px;
    text-align: center;
    width: 224px;
    height: 32px;
    color: #fff;
    cursor: pointer;
    font-size: 11pt;
    -webkit-transition: -webkit-box-shadow 0.5s ease-out;;
    -moz-transition: -moz-box-shadow 0.5s ease-out;
    -o-transition: box-shadow 0.5s ease-out;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
}

.inputButtonVariableBig:hover 
{ 
    -moz-box-shadow: 0px 0px 5px #ab3333;
    -webkit-box-shadow: 0px 0px 5px #ab3333;
    box-shadow: 0px 0px 5px #ab3333;
    background: #d16363; 
}

.font18 { font-size:18pt; }

.scroll_y {
    overflow-y: scroll;
}

.itemReviewSmallDiv {
    padding: 5px 5px;
}

.itemReviewSmallDiv img + img {
    padding-left: 0px;
}

.loginRightCentred {
    text-align: center;
    padding: 0 10px 0 10px;
}

.loginRightNormal {
    text-align: left;
    padding-left: 14px;
    line-height: 1.5em;
}

.loginRightNoPadding {
    text-align: left;
    padding: 0 0 0 0;
}

.loginRightTimeCanvas {
    width: 230px;
    height: 55px;
}

.loginRightScoreCanvasSmall {
    width: 230px;
    height: 55px;
}

.loginRightScoreCanvasLarge {
    width: 240px;
    height: 110px;
}

.fontBold {
    font-weight: bold;
}

.paddingTop {
    padding-top: 20px;
}

.paddingBottom {
    padding-bottom: 15px;
}

.bottomLine {
    border-bottom: #565656 dotted 2px;
}

.resultGood {
    font-weight: bold;
    color: #80FF80;
}

.resultNormal {
    font-weight: bold;
    color: #FFFF80;
}

.resultBad {
    font-weight: bold;
    color: #FF8080;
}

.resultProgressing {
    font-weight: bold;
    color: #1fc2f7; /*#86E1FF*/
}

.resultProgressing2 {
    font-weight: bold;
    color: #a49300; /*#FFFF80*/
}

.resultCompleted {
    font-weight: bold;
    color: #80FF80;
}

.tdTdSpacing td + td {
    padding-left: 10px;
}

.smallTitle {
    color: #E9E4B3;
    font-size: 13px;
    font-weight: bold;
}

.switchActionButton {
    background: #ab3333;
    border: #ad3a3a solid 1px;
    text-align: center;
    width: 224px;
    height: 32px;
    color: #fff;
    cursor: pointer;
    font-size: 11pt;
    -webkit-transition: -webkit-box-shadow 0.5s ease-out;;
    -moz-transition: -moz-box-shadow 0.5s ease-out;
    -o-transition: box-shadow 0.5s ease-out;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
}

.switchActionButton:hover {
    -moz-box-shadow: 0px 0px 5px #ab3333;
    -webkit-box-shadow: 0px 0px 5px #ab3333;
    box-shadow: 0px 0px 5px #ab3333;
    background: #d16363;
}

.switchActionButton.buttonActive {
    background: #FFA78D;
}

.switchActionButton.buttonActive:hover {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.submitActionButton {
    background: #ab3333;
    border: #ad3a3a solid 1px;
    text-align: center;
    width: 224px;
    height: 32px;
    color: #fff;
    cursor: pointer;
    font-size: 11pt;
    -webkit-transition: -webkit-box-shadow 0.5s ease-out;;
    -moz-transition: -moz-box-shadow 0.5s ease-out;
    -o-transition: box-shadow 0.5s ease-out;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
}

.submitActionButton.signoutButton {
    background: #ab3333;
    border: #ad3a3a solid 1px;
}

.submitActionButton:hover {
    -moz-box-shadow: 0px 0px 5px #ab3333;
    -webkit-box-shadow: 0px 0px 5px #ab3333;
    box-shadow: 0px 0px 5px #ab3333;
    background: #d16363;
}

.submitActionButton.buttonDisabled {
    background: #DDDCDB;
    border-color: #A5A5A4;
}

.submitActionButton.buttonDisabled:hover {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.finishButtonHolder {
    text-align: center;
    width: 100%;
    margin: 15px 0 5px 0;
}

.problemDescription {
    text-decoration: underline;
}