body{
background: white;
padding: 0;
margin: 0;
font: 13px Arial;
font-family: 'Roboto', sans-serif;
font-weight: 300;
}

::selection{
background: #bbd022;
}

#page{

}


header{
position: relative;
position: fixed;
background: #333333;
width: 100%;
height: 90px;
background-image: url(//media.liveho.me/livehome.pl/images/bg.png);
z-index: 999;
}

header #logo{
background: transparent url(//media.liveho.me/eduventus.com/images/logo.png) no-repeat center;
position: absolute;
top: 11px;
left: -5px;
width: 240px;
height: 60px;
background-size: 280px;
}

header #user-box{
position: absolute;
top: 16px;
right: 25px;
color: #C9C9C9;
text-align: right;

top: 22px;
}

header #user-box .user-name{
font-weight: 400;
font-size: 21px;
letter-spacing: 1px;
}

header #user-box .user-name.not-login{
padding-top: 12px;
}

header #user-box a{
color: inherit;
text-decoration: none;
}

header #user-box .school-name{
font-size: 14px;
letter-spacing: 1px;
margin-top: 3px;

margin-top: -3px;
margin-bottom: 3px;
}

header #user-box .school-name a{
color: #F5F1EC;
text-decoration: none;
}

header #user-box .school-name a:hover{
border-bottom: 1px dashed #F5F1EC;
}

header #user-box .user-logout{
position: absolute;
top: -20px;
right: 2px;
}


header #user-box .user-logout a{
color: #A8A8A8;
}

header #loading-bar{
position: absolute;
position: fixed;
top: 50%;
left: 50%;
width: 125px;
box-shadow: 0 0 5px #B8B8B8;
height: 115px;
margin-left: -60px;
border-radius: 3px;
z-index: 999;

-o-transition: all 0.6s ease;
-moz-transition: all 0.6s ease;
-webkit-transition: all 0.6s ease;
}


/* **************   NAV    ************** */

nav{
position: absolute;
top: 20px;
left: 240px;
right: 280px;
font-size: 16px;
overflow: hidden;
}

nav ul{
list-style: none;
margin: 0;
padding: 0;
width: 100%;
}

nav ul a{
color: #A3A3A3;
text-decoration: none;
}

nav ul li{
position: relative;
display: block;
float: left;
margin: 0px;
overflow: hidden;
-o-transition: all 0.1s ease;
-moz-transition: all 0.1s ease;
-webkit-transition: all 0.1s ease;
padding: 2px 5px;
}

nav ul li.home{
padding: 10px 10px;
}

nav ul li a{
display: block;
-o-transition: all 0.2s ease;
-ms-transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
-webkit-transition: all 0.2s ease;
}

nav ul li.new a::after{
content: "!";
color: #FFCACA;
font-weight: bold;
margin-left: 2px;
}

nav ul li.active a, nav ul li:hover a{
color: #E9E9E9;
}

nav ul li .arrow{
position: absolute;
top: -8px;
left: 50%;
margin-left: -5px;
width: 0px;
height: 0px;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
border-top: 8px solid #333;
-o-transition: all 0.2s ease;
-ms-transition: all 0.2s ease;
-moz-transition: all 0.2s ease;
-webkit-transition: all 0.2s ease;
}

nav ul li:hover .arrow, nav ul li.active .arrow{
top: 0;
}

nav ul li.right{
float: right;
}


nav.sub-menu{
border: none;
min-height: 20px;
background: #616161;
}

nav.sub-menu ul li a{
padding-top: 7px !important;
padding-bottom: 8px !important;
}

nav.sub-menu ul li  .arrow{
border-top: 8px solid #464646;
}

nav #menu-login{
display: none;
}


/* ************** CONTENT  ************** */

#content{
min-height: 560px;
width: 100%;

background: #E6E6E6;
padding-top: 25px;
padding-bottom: 25px;
background-image: url(//media.liveho.me/livehome.pl/images/bg.png);
padding-bottom: 35px;
padding-top: 110px;
}

#content .width-fix{
background: white;
border-radius: 5px;
border: 1px solid #CACACA;
padding-bottom: 15px;
min-height: 500px;
width: 99% !important;
margin: 5px auto;
}

#content .location{
height: 25px;
}

#content .left-panel, #content .right-panel{
padding: 0 1.25%; /* 0px 15px */
}

#content .left-panel{
width: 63%; /* 760px */
float: left;
margin-left: 1%;
}

#content .left-panel.no-right{
width: 95.5%; /* 1170px */
margin-right: 1%;
}

#content .right-panel{
width: 29%; /* 350px */
float: right;
margin-right: 1%;
}



#content article{
padding: 10px 0px;
margin-bottom: 5px;
}

#content article .title{
font-size: 25px;
letter-spacing: 1px;
color: #042752;
margin-bottom: 15px;
}

h3{
font-size: 21px;
letter-spacing: 1px;
color: #3D3D3D;
margin-bottom: 10px;
font-weight: normal;
margin: 5px 0;
margin-top: 10px;
}

#content article .text{
line-height: 25px;
margin-bottom: 15px; 
padding-left: 15px;
text-align: justify;
font-size: 15px;
color: #222;
}

#content article .image{
float: left;
border: 1px solid #aaa;
border-radius: 5px;
padding: 8px;
margin-right: 15px;
}


#content section{
padding: 10px 0px;
margin-bottom: 5px;
}

#content section .title{
font-size: 25px;
letter-spacing: 1px;
color: #3d3d3d;
margin-bottom: 10px;
}

#content section .title.beta::after{
content: " BETA";
font-size: 12px;
font-weight: 400;
letter-spacing: 0;
vertical-align: super;
}

#content section .text{
line-height: 25px;
margin-bottom: 15px; 
padding-left: 15px;
text-align: justify;
font-size: 15px;
color: #222;
}



#content section .text.subtitle{
margin-top: -12px;
color: #8B8B8B;
padding-left: 5px;
}

#content section .image-text{
float: left;
width: 70%;
padding: 15px 0;
}

#content section .image{
float: left;
border: 1px solid #AAA;
border-radius: 5px;
padding: 8px;
margin-right: 2%;
width: 25%;
}

.clear{
clear: both;
}

/* **************  TABLE   ************** */


table *{
text-align: left;
}

table.list{
width: 100%;
border-collapse: collapse;
}

table.list thead td{
font-weight: bold;
background: #BDD224;
letter-spacing: 1px;
color: #363636;
}

table.list td{
padding: 5px 10px;
border: 1px solid #999;
}

table.list.no-table td{
padding: 8px 10px;
border: 1px solid #B6B6B6;
border-left: none;
border-right: none;
}

table.list td.presence{
width: 80px;
text-align: center;
}

table.list td.no{
width: 22px;
text-align: right;
font-weight: bold;
letter-spacing: 1px;
}

table.list.no-table thead td.no{
padding-right: 8px;
}

table.list.no-table td.no{
padding-right: 5px;
}

table.list.no-table td.name{
padding-left: 5px;
}

table.list td.hidden{
border: none;
background: white !important;
}

table.list tbody tr:hover td{
background: #F2F8C8;
}

table.list tbody tr:not(.empty):nth-child(even){
background: #FFFAF2;
}

table.list.no-table tbody tr:not(.empty):nth-child(even){
background: #FFFCF9;
}

/*
table.list.boxes thead{
display: none;
}
*/

table.list.boxes td.no{
border-right: none
}

table.list.boxes td{
padding: 8px 10px;
border: 10px solid white;
border-left: none;
border-right: none;
background: #EEE;
border-right: 1px solid white;
}

table.list.boxes tr:hover td{
background: #CCD7DF;
}

table.list.boxes select{
border: 1px solid white;
background: white;
}

/* **************  OPTIONS  ************** */


.options{
float: right;
margin-top: -50px;
margin-bottom: 20px;
}



/* **************  FOOTER  ************** */

footer{
position: relative;
background: #FCFCFC;
min-height: 250px;
background-image: url(//media.liveho.me/livehome.pl/images/bg.png);
border-top: 1px solid white;
box-shadow: 0 -1px 0 #D6D6D6;
}

footer .logo{
position: absolute;
top: 25px;
right: 30px;
}

footer .logo img{
opacity: 0.8;
}

footer .slogan{
position: absolute;
top: 24px;
left: 150px;
color: #AAA;
font-size: 12px;
letter-spacing: 1px;
}

footer .copyright img{
width: 150px;
margin-top: 8px;
}

footer .copyright{
position: absolute;
top: 150px;
right: 30px;
color: #2C2C2C;
text-align: right;
line-height: 25px;
}

footer .copyright a{
color: #2C2C2C;
text-decoration: none;
}

footer .menu{
position: absolute;
top: 25px;
left: 50px;
color: #2C2C2C;
}

footer .menu .name{
font-weight: 400;
letter-spacing: 1px;
}

footer .menu .menu-list{
padding: 5px 10px;
}

footer .menu .menu-list a{
color: #2C2C2C;
text-decoration: none;
}

footer .menu .menu-list .menu-item{
padding: 3px 0;
}

#top{
position: fixed;
bottom: 10px;
right: 16px;
background: #D8E485;
width: 40px;
height: 18px;
border-radius: 20px;
text-align: center;
padding: 11px 0;
color: #414141;
box-shadow: 0px 0px 5px white;
z-index: 10;
border-top-right-radius: 30px 10px;
border-top-left-radius: 30px 10px;
border-bottom-left-radius: 30px 20px;
border-bottom-right-radius: 30px 20px;
font-weight: 400;
}

/* **************  INPUTS   ************** */

input, button, textarea, select{
background: white;
border: 1px solid #B9B9B9;
padding: 10px 12px;
margin: 3px 5px;
outline: none;
width: 200px;
letter-spacing: 1px;
box-sizing: content-box;

background: #EEE;
border-radius: 5px;

background: #FAFAFA;
border-radius: 0px;
border: 1px solid white;
border-bottom: 1px solid #CFCFCF;
border-radius: 2px;
}

input:focus, textarea:focus{
background: #DCEDFA;
border: 1px solid #DCEDFA;
border-bottom: 1px solid #CFCFCF;
}

/*
input:focus, textarea:focus, select:focus{
background: whiteSmoke;
border: 1px solid #DBDBDB;
}
*/

textarea{
height: 18px;
resize: none;
overflow: hidden;
font-family: Arial;
}

input[type="submit"], button{
width: auto !important;
cursor: pointer;

font-weight: bold;
border-radius: 6px;
border: 1px solid #EB911F;
color: #303030;

background: #ECA015 no-repeat center;
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ECBB60), color-stop(1, #ECA015));
background-image: -moz-linear-gradient( center top, #ECBB60 0%, #ECA015 100%);
background-image: -o-linear-gradient(270deg,#ECBB60,#ECA015);

background: #C3D218;
border: 0;
padding: 8px 15px;
box-shadow: 0 5px 0 #95A017;
color: #3D4116;

}

input[type="submit"]:active, button:active{

box-shadow: 0 3px 0 #95A017;
margin-top: 5px;
margin-bottom: 0px;
}

input:disabled, textarea:disabled{
cursor: not-allowed;
}



input[type="submit"]:disabled{
background: #ccc;

}

input.disabled{
cursor: text;
border-color: #ccc;
color: black;
}



input[type=checkbox], input[type=radio] {
border: 1px solid #555;
padding: 0.5em;
font-size: 15px;
line-height: 1.2em;
width: 80%;
background: #fff;
background: -webkit-gradient(linear, left top, left bottom, from(white), to(#D8D8D8));
-webkit-appearance: none;
-webkit-box-shadow: 1px 1px 1px #fff;
vertical-align: middle;
}

input[type=radio] {
border-radius: 0px;
}
   
input[type=radio]:checked, input[type=checkbox]:checked {
background: url("data:image/png,%89PNG%0D%0A%1A%0A%00%00%00%0DIHDR%00%00%008%00%00%008%08%02%00%00%00'%E4%ACI%00%00%00%19tEXtSoftware%00Adobe%20ImageReadyq%C9e%3C%00%00%04DIDATx%DA%EC%98%B9J%2CA%14%86%EF%F4%AC%8E%5B%24%F8%00%93%BA%83%89%89%A1%22n%A1%81%89%B8%22%82%2B%06%A2%E2%82%B8%20%1A%A9(%B8%BC%87%8F%E0%12%09%3E%82K%AA%20%EAu%EEo%FFw%0EEuO%2F3%A3%5C%2F%FD%07E%F5Lu%F7%D7%FF9u%BA%BA%22%A9T%EA%D7O%90%F1%EB%87(%00%0D%40%03%D0%004%00%0D%40%03%D0%FF%1B4%F2%3D%B7I%A7%D3%B6%BF%87B%A1%7F%05T%105V%22%F2G%2F%B8%91oC%D4%40qH%3E%B4%D2w%CA%D1%D0%D7H%F3%89%94%86aloo%0F%0C%0C%D8%BA%EB%7C%C1H8%1C%FE%22%2F%D3%19%FD%B5%C40677%BB%BB%BB%D1%8F%C5b%7B%7B%7B%B6%8F%975%F4%BE%40%ADs%C2zu%8D%F2%E3%E3%03-%EE%B2%B1%B1AJhjj%0A'%EE%EF%EF%A3%C5%03xa%8D%409%F09g%95%20B%18%06%CA%F5%F5u%A1%A4%26''qk%F8%8A%7FU%DC%AC%A0%D1h%D4c%1C%1D%1C%95%1Bp%00%11y%08%8E%B5%B5%B5%AE%AE.%EB%95%9B%9A%9A%8E%8F%8F1Re%CD%11T%8B%23%95L%26%CB%CA%CA%EE%EE%EE%D4y%23%E5F%CCF%07%9E%AD%AC%ACtvvZ%AF%7Cyy944%04J%8C%01%A8%9A%00%F6%A0%C8kWJ%E6%19%DBD%22%B1%BB%BB%5BYY988x%7F%7FouB%BCD%BB%B4%B4%D4%D1%D1a%BD%F2%C5%C5%C5%F0%F0%F0%EB%EB%2Bl%22(Mu%02upT%9D%10%BC%7D%3C%1E%DF%D9%D9%A9%A9%A9A%FF%F0%F0%10%96%3C%3C%3C%A8%09%A0V%C7%E5%E5%E5%F6%F6v%5BJ%3C%E4%DB%DB%1B))W%D0P%5B%5B%9B%83%9DD%FCm%0A%DEommUWW%CB%18D%1F%C6%3C%3E%3E%8A%A98%0B%23%D1.%2C%2C%B4%B6%B6%3AP%C6LEM1%F4%CE%F3)%A4MF%DB%99%FB%FE%FE%8E_%40YUU%A5%0DSY%25%EE%F3%F3%F3---%0E%94%88%8C%80%D2Q%D7%1C5bn%E2%85%00%7D%7D%7Dm%3D%1F%C9zppPQQA%D7%F1%0B%BC%CCF%89T%C1%18d9%40%13%A6%E2%A6x%23%B5oU%B8%BE%BE%3E%9CEj8%00zuu%05%C3jkk5%82%92%92%92%E6%E6%E6%F3%F3%F3%A7%A7%A7%C5%C5E%5BJ%CC%F1%91%91%11P%0A%A2J%C9%04%90d%B5U%04C%B3%85%9Eqg%9A%F3%F0%EC%EC%0Cm__%9F%D5%D7%A3%A3%A3%DB%DB%5B%10%5B%2F%85'%1C%1D%1De%5DSm%23%9Cj%87S%1D%CDV%9E%98%A3%F0%80%C9%C7%FC%C3%E1%E9%E9)%3A%FD%FD%FDVV%C8%96rll%0C%97*..%8Eg%24%94%5E*%A8%0FP%89%3E%7D%3D99A%07%8B%20%D7w%2F%D2z%7C%7C%9C%94%92%9A%DAd%F7B%F9%09%EA%10zb%81U%EA%9C%FC%05_%D1qf%05%E5%C4%C4%04%93X%CDK%A1t%AD%9D%3E%0A%3EA%ADi%84%16%ACh%AD9%40%DD%DC%DC%90%12yYd%8A%94%B4%D3%2F%A5K%E8%A5%E0%AB%F3%D1%C8%88%AC%A8%FF%8D%8D%8D%DA%B9%CF%CF%CF%B3%B3%B3%18%03%3E%82%D2N%EB%04%F2%FE%D9%94%D5Qu9%C2%9A%2F%AC2%09%A0%E9%E9i%BCT%1B%1A%1AT%CA%9E%9E%9E%97%97%17D%5C%B33gJ%F7%D0%0B%2B%86%91U%2Bu8%9C%99%99%C1%07F%5D%5D%1D)%7B%7B%7B%B1%DA(--M%9AR%83.1%F1K%E9%BEpVYU8%E2%A2%C5%03%80%60nn%0EK%E3T*%85%E9%85%E7%C1%22%B0(%23%A1T%8B%91_JO%9F%22%C2%AA%BD%B1%84%18%10x%7D%AF%AE%AE%82%09%C3%CA%CB%CB%B5%D7%8FV%8Cr%A0%F4%FA%CD%24%AC%E4c%2B%8E%22%D0p%91%8B%26%D4K%B1Y%DE%40%EA%8A37%CAOP%2F%A7%C9BS-Ob*PdE%A2%FEH%E2%82P%FA%D8%80%10Vy%A3%0A%2Bhh'%07%A8%95A%94'%A5%BF%9D%12%8D%95%1D%88%B5V6g%C8*%E5%B6%20%94%BE%B7tlY%85R%C6%C8%87T%3E%B3'%DF%BD'%8D%953L%FD%92%B6%EE%EA%E4O%99%E3%26%99%F6%11%E7%BC%7DR%10%CA%DCw%F3%D4%95%94-J%A1%F8%0A%B6%EDXp%A0%60%0F%3F%00%0D%40%03%D0%00%F4k%F4G%80%01%00%E2%BB%B3%8D%BD%BE%0E%DE%00%00%00%00IEND%AEB%60%82") no-repeat center center;
-webkit-background-size: 28px 28px;
}


form.wide input, form.wide select, form.wide textarea{
width: 560px;
}

input[type="checkbox"], input[type="radio"]{
width: auto !important;
}

::-webkit-input-placeholder {
color: #aaa;
}
:-moz-placeholder {
color: #aaa;
}

/* NEW FORM */

.form{
text-align: left;
font-size: 14px;
}

.form .item{
padding: 5px 0;
}

.form .left{
width: 49%;
float: left;
}

.form .right{
width: 49%;
float: right;
}

.form .item .item-name{
line-height: 20px;
font-weight: 400;
letter-spacing: 1px;
font-size: 12px;
color: #43494E;
}

.form .item.required .item-name{
font-weight: 500;
color: #194E00;
}

.form .item .item-name span.name-info{
font-weight: normal;
color: #666464;
letter-spacing: 0;
}

.form .item .item-input{
position: relative;
}

.form .item .item-input span{
position: absolute;
bottom: 4px;
right: 4px;
font-size: 11px;
color: #AFAFAF;
}

.form .item .item-input input, .form .item .item-input textarea, .form .item .item-input select{
margin: 0;
width: 100%;
box-sizing: border-box;
}

.form .item .item-input textarea{
height: 40px;
}

.form .item .item-input input[type="date"]{
width: 53%;
margin-right: 2%;
height: 34px;
}

.form .item .item-input input[type="time"]{
width: 45%;
height: 34px;
float: right;
}

.form .item .item-submit{
text-align: center;
}


.button{
border: 1px solid #00489F;
padding: 5px 12px;
background: #1576EC;
background-image: -webkit-linear-gradient(top, #1576EC 0%, #00489F 100%);
color: white;
font-weight: bold;
letter-spacing: 1px;
text-shadow: 1px 1px 1px #494949;
width: 100px;
text-align: center;
border-radius: 5px;
margin: 15px 0;
cursor: pointer;
text-decoration: none;
}

/* **************    UL's   ************** */

ul.ticks{
list-style: none;
margin: 0px;
padding-left: 10px;
}

ul.ticks li{
padding: 3px 0;
}

ul.ticks li:before{
content: "✔";
padding-right: 10px;
color: #2A8F2A;
}

ul.list{
list-style: none;
margin: 0px;
padding-left: 10px;
}

ul.list li{
padding: 3px 0;
}

ul.list li:before{
content: "»";
padding-right: 10px;
font-size: 18px;
}


/* **************   LINKs   ************** */

a{
color: #0E6EE2;
}

/* ************* OFFER TABLE ************* */

table.offer{
width: 100%;
border-collapse: collapse;
}

table.offer thead td{
letter-spacing: 1px;
font-size: 14px;
font-weight: bold;
}

table.offer thead td.none{
border: none;
}

table.offer thead td span.pro{
font-size: 15px;
color: #1C5AA8;
}

table.offer thead td.best-head-hide{
color: #0A3053;
background: #F7CD8E;
font-size: 15px;
letter-spacing: 2px;
}

table.offer td{
border: 1px solid #aaa;
padding: 5px 10px;
text-align: center;
}

table.offer td.cat{
padding-left: 12px;
font-weight: bold;
text-align: left;
}

table.offer td.subcat{
padding-left: 22px;
text-align: left;
}

table.offer td.green{
color: green;
}

table.offer td.red{
color: #C04343;
}

table.offer td.best-hide{
background: #FFEDCD;
}


/* **************  WINDOWS  ************** */

#bg{
position: absolute;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
display: none;
z-index: 999;
}

#windows{
display: none;
z-index: 999;
}

#windows .window{
position: absolute;
top: 50%;
left: 50%;
width: 540px;
height: 120px;
margin-top: -100px;
margin-left: -300px;

background: white;
border-radius: 5px;
box-shadow: 0 0 8px black;
padding: 30px 40px;
z-index: 999;
}

#windows .window .title{
font-size: 25px;
letter-spacing: 1px;
color: #3D3D3D;
margin-bottom: 20px;
}

#windows .window .close{
font-size: 30px;
float: right;
margin-top: -80px;
margin-right: -20px;
cursor: pointer;
}

#windows .window .text{
line-height: 25px;
padding-left: 15px;
text-align: justify;
font-size: 16px;
color: #222;
letter-spacing: 1px;
}


/* Set wide page */

.width-fix{
position: relative;
max-width: 1200px;
width: 100%;
margin: 0 auto;
}

.centerText{
text-align: center !important;
}

.rightText{
text-align: right;
}

.bold{
font-weight: bold;
}


/* **************  MARKS  ************** */

.mark{
float: left;
margin: 3px 5px;
width: 25px;
text-align: center;
background: #F7CC9E;
font-size: 11px;
color: black;
letter-spacing: 1px;
padding: 1px 0;
border: 1px solid transparent;
line-height: normal;
}

.mark.new{
font-weight: bold;
border: 1px solid black;
}

.errorBox, .error-box{
border: 1px solid red;
padding: 5px 10px;
margin-bottom: 10px;
background: #FAEAEA;
letter-spacing: 1px;
}

.errorBox .e:before, .error-box .e::before{
content: "✖";
padding-right: 5px;
color: red;
}

.errorBox .e, .error-box .e{
margin: 5px 0;
padding-left: 5px;
}

.error-box .e.info::before{
content: "!";
padding-right: 5px;
color: red;
font-weight: bold;
}

.info-box{
border: 1px solid #CA9433;
padding: 5px 10px;
margin-bottom: 10px;
background: #FAF7EA;
letter-spacing: 1px;
}

.info-box .e::before{
content: "!";
padding-right: 5px;
color: #FF5C00;
font-weight: bold;
}

.info-box .e{
margin: 5px 0;
padding-left: 5px;
}


.ok-box{
border: 1px solid #338A27;
padding: 5px 10px;
margin-bottom: 10px;
background: #F6FAEA;
letter-spacing: 1px;
}

.ok-box .e::before{
content: "✔";
padding-right: 5px;
color: #33AA5E;
font-weight: bold;
}

.ok-box .e{
margin: 5px 0;
padding-left: 5px;
}

.gray-box{
border: 1px solid #7E786D;
padding: 5px 10px;
margin-bottom: 10px;
background: #FAFAFA;
letter-spacing: 1px;
}

.gray-box .e{
margin: 5px 0;
padding-left: 5px;
}

.error-box .e a.see-more, .info-box .e a.see-more, .ok-box .e a.see-more{
float: right;
}

.error-box .e a.see-more::after, .info-box .e a.see-more::after, .ok-box .e a.see-more::after{
content: " »";
}



/* User's profile */

.userInfo{
min-height: 140px;
margin-top: 20px;
}

.userInfo .avatar{
background: #FCCE79;
background-image: linear-gradient(right top, #FCCE79 10%, #DB9525 80%);
background-image: -o-linear-gradient(right top, #FCCE79 10%, #DB9525 80%);
background-image: -moz-linear-gradient(right top, #FCCE79 10%, #DB9525 80%);
background-image: -webkit-linear-gradient(right top, #FCCE79 10%, #DB9525 80%);
background-image: -ms-linear-gradient(right top, #FCCE79 10%, #DB9525 80%);
border: 1px solid #ECA015;
width: 100px;
height: 120px;
float: left;
margin-right: 15px;
border-radius: 5px;
}

.userInfo .fullName{
font-size: 22px;
color: #2E2E2E;
margin-bottom: 10px;
padding-top: 10px;
}

.userInfo .cityAndSchool{
font-size: 15px;
margin-bottom: 8px;
}

.online{
display: inline-block;
width: 10px;
height: 10px;
border-radius: 5px;
background: #6BC52E;
margin: 0 2px;
}

.offline{
display: inline-block;
width: 10px;
height: 10px;
border-radius: 5px;
background: #CCC;
margin: 0 2px;
}

/* TIMETABLE */

.timetable{
position: relative;
height: 750px;
margin: 50px 40px;
}

.timetable .lesson{
position: absolute;
width: 125px;
height: 100px;
background: #ADD2F0;
border-radius: 5px;
box-shadow: 0 0 3px black;
padding: 3px 10px;
overflow: hidden;
margin: 0 1px;
box-sizing: border-box;

transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
}

.timetable .lesson.double{
padding: 3px 5px;
}

.timetable .lesson.added{
opacity: 0.6;
}

.timetable.hide-added .lesson.added{
opacity: 0.1;
}

.timetable .lesson:hover{
min-height: 100px;
min-width: 140px;
z-index: 10;
opacity: 1 !important;
}

.timetable .lesson .name{
font-weight: bold;
letter-spacing: 1px;
}

.timetable .lesson a{
color: inherit;
}

.timetable .day_line{
position: absolute;
top: -35px;
bottom: -15px;
width: 1px;
background: #C7C7C7;
}

.timetable .day_name{
position: absolute;
top: -35px;
width: 150px;
text-align: center;
font-size: 16px;
}

.timetable .day_date{
position: absolute;
top: -17px;
width: 150px;
text-align: center;
font-size: 12px;
}

.timetable .hour_line{
position: absolute;
top: 0px;
left: 0;
right: 0;
height: 1px;
background: #E4E4E4;
}

.timetable .hour_name{
position: absolute;
left: -32px;
margin-top: -7px;
font-size: 11px;
}

.timetable .now_line{
position: absolute;
left: 0px;
height: 1px;
background: #FF7474;
width: 150px;
z-index: 6;
box-shadow: 0 0 2px #FDD;
}

.timetable .nav_prev{
position: absolute;
top: -40px;
left: 5px;
font-size: 30px;
}

.timetable .nav_next{
position: absolute;
top: -40px;
right: 5px;
}

.timetable .nav_prev a, .timetable .nav_next a{
color: #575757;
text-decoration: none;
font-size: 30px;
}



/**********  BOARD  *********/


#board-box{
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: white;
z-index: 99990;


}


#board-box, #board-box *{
user-select: none;
-o-user-select: none;
-moz-user-select: none;
-webkit-user-select: none;
}


#board-box .logo{
position: absolute;
top: 0;
left: 0;
background: #A2A2A2;
padding: 8px 12px 2px 8px;
border-radius: 0 0 5px 0;
z-index: 9999;
}

#board-box .save-form{
position: absolute;
top: 10px;
left: 140px;
right: 50px;
z-index: 9999;
}

#board-box .save-form input[type="text"]{
border: none;
background: rgba(255, 255, 255, 0.5);
font-size: 18px;
font-weight: bold;
width: 100%;
padding: 0;
margin: 0;
color: #1778AF;
}

#board-box .save-info{
position: absolute;
top: 15px;
right: 55px;
}

#board-box .close-btn{
position: absolute;
top: 8px;
right: 10px;
font-size: 25px;
color: #BEBEBE;
cursor: pointer;
width: 35px;
height: 32px;
text-align: center;
z-index: 9999;
}

#board-box .tools{
position: absolute;
background: #CCC;
width: 255px;
height: 50px;
bottom: 0;
right: -1px;
border-radius: 10px 0 0 0;
overflow: hidden;
z-index: 9999;
}

#board-box .tools .tool-btn{
float: left;
width: 50px;
height: 30px;
border-right: 1px solid #A0A0A0;
text-align: center;
font-size: 20px;
padding: 13px 0;
cursor: pointer;
}

#board-box .tools .tool-btn.first{
border-radius: 10px 0 0 0;
}

#board-box .tools .tool-btn:hover{
background: #BDBDBD;
}

#board-box .board-canvas{
position: absolute;
z-index: 9999;
}


#board{
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: rgba(255, 255, 255, 0.5);
display: block;
}

#board.on{

}

#board-gallery{

}

#board-gallery .note-item{
float: left;
margin: 20px 15px;
text-align: center;
width: 195px;
height: 345px;
}

#board-gallery .note-thumbnail{

}

#board-gallery .note-thumbnail img{
width: 156px;
height: 220px;
border: 1px solid #8F8F8F;
box-shadow: 0 0 10px #999;
margin-bottom: 5px;
}

#board-gallery .note-item .note-name{
font-size: 14px;
max-height: 58px;
overflow: hidden;
font-weight: 400;
}

#board-gallery .note-item .note-num{
font-size: 14px;
}

#board-gallery .note-item .note-edit-time{
font-size: 12px;
color: #999;
}

/**********  TESTS  *********/


.questions-list{

}

.questions-list .question{
margin: 5px 0;
clear: both;
}

.questions-list .question.not-used{
opacity: 0.5;
}

.questions-list .question .info{
font-size: 12px;
}

.questions-list .question .num{
float: left;
font-size: 40px;
width: 40px;
text-align: right;
height: 104px;
letter-spacing: -5px;
margin-right: 15px;
}

.questions-list .question .q{
font-size: 15px;
font-weight: bold;
letter-spacing: 1px;
padding-top: 12px;
padding-bottom: 2px;
}

.delete-btn{
color: #DB0808;
font-weight: bold;
text-decoration: none;
font-size: 12px;
}

.questions-list .question .answer{
padding: 2px 0;
font-size: 14px;
}

.questions-list .question .answer.correct{
color: #00A300;
font-weight: bold;
}

.questions-list .question .answer.user-answer{
color: #E20606;
}

.questions-list .question .correct-answer{
color: #1869B4;
font-weight: bold;
}


/**********  CALENDAR  *********/


table.calendar{
width: 100%;
border-collapse: collapse;
margin: 15px 0;
}

table.calendar thead td{
height: 30px;
font-size: 15px;
font-weight: bold;
letter-spacing: 1px;
color: #313131;
background: #BDD224;
}

table.calendar td{
height: 90px;
border: 1px solid #8D9E13;
text-align: center;
position: relative;
}

table.calendar td.week{
width: 2%;
}

table.calendar td.day{
width: 13.5%;
}

table.calendar td.pm{
font-size: 15px;
}

table.calendar td.tm{
font-size: 25px;
font-weight: bold;
color: #5A5A5A;
}

table.calendar td.nm{
font-size: 12px;
}

table.calendar td.today{
background: #C7DCFA;
}

table.calendar td .events{
position: absolute;
bottom: 0;
right: 0;
}

table.calendar td .events .event{
float: right;
background: #B30E0E;
text-align: center;
font-weight: bold;
color: white;
padding: 2px 5px;
border: 1px solid #720909;
margin: 1px;
font-size: 10px;
letter-spacing: 1px;
height: 14px;
}

table.calendar td.pm .events .event, table.calendar td.nm .events .event{
opacity: 0.5;
}

table.calendar td .events .event.homework{
background: #3C9B17;
border-color: #246809;

}

table.calendar td .events .event.platform-test{
background: #1C9FDD;
border-color: #075275;
}



/**********  HELP  *********/


.help-link{
position: absolute;
text-align: right;
color: #8F8F8F;
font-size: 12px;
top: 3px;
right: 8px;
}

.help-link:hover{
color: #5C5C5C;
}

.help-link span{
font-weight: bold;
font-size: 15px;
}





/**********  GAMES  *********/







/**********  MEDIA FIXED  *********/

/*
@media all and (min-width: 1220px) {

	#page #content .left-panel{
	width: 760px;
	}

	#page #content .left-panel.no-right{
	width: 1170px;
	}

	#page #content .right-panel{
	width: 350px;
	}

	#page nav ul li a{
	padding: 12px 15px;
	}

	#page .width-fix{
	width: 1200px;
	}

}
*/

#noscript-box{
width: 100%;
max-width: 1200px;
margin: 0px auto;
border: 1px solid #960101;
background: #F5DEDE;
color: #AC1C1C;
padding: 10px 18px;
font-size: 15px;
margin-bottom: 15px;
box-sizing: border-box;
border-radius: 5px;
box-shadow: 1px 1px 0px white;
}




#login-popup{
position: absolute;
top: 55px;
right: -15px;
width: 300px;
height: 250px;
z-index: 999;
background: white;
border-radius: 5px;
border: 1px solid #ACABAB;
box-shadow: 0px 0px 10px #7A7A7A;
text-align: left;
color: black;
padding: 10px 15px;
opacity: 0.98;
display: none;
}

#login-popup .arrow1{
position: absolute;
top: -13px;
right: 60px;
border-bottom: 13px solid #B6B6B6;
border-left: 11px solid transparent;
border-right: 11px solid transparent;
}

#login-popup .arrow2{
position: absolute;
top: -12px;
right: 61px;
border-bottom: 12px solid white;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
}

#login-popup .name{
font-size: 24px;
}

#login-popup .text{
margin: 2px 0;
font-size: 14px;
margin-bottom: 8px;
color: #8B8B8B;
}


@media screen and (max-width: 720px) {
	
	body{
	background: #fff;
	}
	
	
	header.top {
	margin-bottom: 0px;
	}
	
	header #logo{
	position: static;
	margin: auto;
	}

	
	header #user-box{
	display: none;
	}

	
	.width-fix{
	position: relative;
	width: 100% !important;
	margin: 0 auto;
	}
	
	.left-panel{
	padding: 10px 20px !important;
	width: auto !important;
	float: none !important;
	}
	
	.right-panel{
	padding: 10px 20px !important;
	width: auto !important;
	float: none !important;
	}
	
	footer{
	
	}
	
	footer .logo-and-name{
	text-align: center;
	margin: auto;
	padding: 10px 0;
	}
	
	footer .logo{
	position: static;
	display: inline-block;
	}
	
	footer .slogan{
	position: static;
	display: inline-block;
	vertical-align: top;
	margin-top: 5px;
	margin-left: 10px;
	}
	
	footer .bottom-menu{
	margin: 10px 15px;
	}
	
	footer .menu{
	position: static;
	float: left;
	margin: 0 10px;
	}
	
	footer .author{
	position: static;
	width: 100%;
	}
	
	footer .copyright{
	position: static;
	text-align: center;
	width: 100%;
	margin-top: 15px;
	}
	
	nav ul li.right {
	float: left;
	}

}


.computer{
position: relative;
background: url(//media.liveho.me/eduventus.com/images/home_promo_laptop.png) no-repeat left top;
max-width: 575px;
height: 0px;
padding-bottom: 58%;
background-size: contain;
opacity: 0;
margin-top: -20px;
margin-bottom: 20px;

-o-transition: all 1s ease;
-ms-transition: all 1s ease;
-moz-transition: all 1s ease;
-webkit-transition: all 1s ease;
}

.computer.loaded{
opacity: 1;
margin-top: 0px;
margin-bottom: 0px;
}

.computer iframe{
position: absolute;
top: 9%;
left: 12%;
right: 11%;
bottom: 30px;
width: 76.5%;
height: 74.8%;
}


#home-promo{
margin-bottom: 10px;
}

#home-promo img{
max-width: 100%;
}

#home-promo .row{
margin-top: 20px;
}

#home-promo .row1{

}

#home-promo .left-side{
float: left;
width: 42%;
padding-left: 6%;
}

#home-promo .right-side{
float: left;
width: 46%;
padding-right: 6%;
}


#home-promo .main-title{
font-size: 35px;
font-weight: 300;
line-height: 50px;
letter-spacing: 1px;
padding-top: 20px;
color: #414141;
}

#home-promo .right-side .main-title{
text-align: right;
}

#home-promo .main-title span, span.bg{
background: #BBD022;
}

#home-promo .text{
font-size: 16px;
line-height: 26px;
padding-top: 10px;
text-align: justify;
padding-right: 5%;
}

#home-promo .right-side .text{
padding-left: 5%;
padding-right: 0%;
}

#home-promo .fb_likebox{
padding-top: 30px;
}

#home-promo .board_screen{
text-align: center;
}

#home-promo .email-bar{
background: #EEE;
padding: 10px;
border: 1px solid white;
outline: 1px solid #AFADAD;
margin: 30px -15px;
position: relative;
}

#home-promo .email-bar .title{
text-align: center;
font-size: 18px;
}

#home-promo .email-bar .submit-form{
width: 550px;
margin: 0 auto;
padding-top: 5px;
}

#home-promo .email-bar .submit-form span{
font-size: 15px;
}

#home-promo .email-bar .submit-form span.send{
text-align: center;
display: block;
background: #bbd022;
font-weight: 400;
border-radius: 15px;
width: 300px;
margin: auto;
padding: 2px;
font-size: 14px;
}

#home-promo .email-bar .submit-form .email{
width: 300px;
}

#home-promo .email-bar .left-end{
border-top: 15px solid #AAA;
border-left: 15px solid transparent;
width: 0;
height: 0;
position: absolute;
bottom: -16px;
left: -2px;
}

#home-promo .email-bar .right-end{
border-top: 15px solid #AAA;
border-right: 15px solid transparent;
width: 0;
height: 0;
position: absolute;
bottom: -16px;
right: -2px;
}


#loading-bar, #top{
display: none !important;
}


#feedback-btn{
position: fixed;
bottom: 18px;
left: 20px;
background: #D8E485;
width: 60px;
height: 32px;
border-radius: 20px;
text-align: center;
padding: 14px 0;
color: #414141;
box-shadow: 0px 0px 8px #C7C7C7, inset 1px 1px 3px white;
z-index: 10;
border-top-right-radius: 40px 15px;
border-top-left-radius: 40px 15px;
border-bottom-left-radius: 40px 50px;
border-bottom-right-radius: 40px 50px;
font-weight: 400;
line-height: 15px;
border: 1px solid #ACB668;
}





.profile-box{
position: relative;
}

.profile-box .edit-link{
position: absolute;
top: 0;
right: 5px;

background: #E0E0E0;
padding: 5px 10px;
border-radius: 30px;

opacity: 0;

transition: all 0.2s ease-out;
-o-transition: all 0.2s ease-out;
-ms-transition: all 0.2s ease-out;
-moz-transition: all 0.2s ease-out;
-webkit-transition: all 0.2s ease-out;
}

.profile-box:hover .edit-link{
opacity: 1;
}

.profile-box .edit-link a{
text-decoration: none;
}

.profile-box .name{
font-size: 25px;
margin-bottom: 5px;

text-align: center;
}

.profile-box .avatar-box{
float: left;
width: 110px;
height: 110px;
background: #E6E6E6;
margin-right: 10px;
position: relative;
border-radius: 20px 0px;


background: white url(//media.liveho.me/eduventus.com/images/user_avatar.png) no-repeat center 8px;
background-size: contain;
background-color: #E9E9E9;
border-radius: 100px;
border: 5px solid #D8D8D8;

margin: 5px auto;
display: block;
float: none;
}

.profile-box .summary-box{
font-size: 14px;
text-align: center;
}

.profile-box .summary-box .school-name{

}


.profile-box .school-box{
margin-top: 50px;
}

.profile-box .school-box .school-avatar-box{
background: white url(//media.liveho.me/eduventus.com/images/school_avatar.png) no-repeat center 8px;
width: 80px;
height: 100px;
background-size: contain;
float: left;
}

.profile-box .school-box .school-name{
font-size: 25px;
padding-top: 5px;
}

.profile-box .school-box .school-name a{
text-decoration: none;
color: #444;
}

.profile-box .school-box .school-type{
font-size: 15px;
padding-top: 2px;
}

.profile-box .school-box .school-more{
padding-top: 2px;
}

.profile-box .school-box{

}




.count-box{
background: #EBEBEB;
border-radius: 5px;
padding: 5px 0;
}

.count-box .num{
font-size: 35px;
min-width: 40px;
text-align: right;
display: inline-block;
font-weight: bold;
color: #303030;
}

.count-box .name{
font-size: 15px;
padding-bottom: 5px;
margin-left: 8px;
}

.count-box .btn{
float: right;
background: #1E79C0;
padding: 8px 15px;
border-radius: 5px;
margin-top: 6px;
margin-right: 10px;
color: white;
font-size: 14px;
text-shadow: 0px 0px 2px #353535;
}

.btn{
margin: 5px 3px;
background: #1E79C0;
padding: 8px 15px;
border-radius: 5px;
color: white;
font-size: 14px;
display: inline-block;
text-shadow: 0px 0px 2px #353535;
}

.btn.small{
margin: 5px 0px;
padding: 4px 5px;
font-size: 13px;
min-width: 17px;
}

.btn.disabled{
background: #949494;
}



.user_avatar_small{
background: white url(//media.liveho.me/eduventus.com/images/user_avatar.png) no-repeat center 1px;
display: inline-block;
width: 25px;
height: 25px;
vertical-align: middle;
margin-right: 5px;
background-size: 27px;
border-radius: 30px;
/*
border: 2px solid #AEBCC7;
*/
}


.user_avatar_small.red{
background: white url(//media.liveho.me/eduventus.com/images/user_avatar_red.png) no-repeat center 1px;
background-size: 27px;
}



.classes{

}

.classes .class{
width: 240px;
background: #EEE;
padding: 10px 15px;
border-radius: 5px;
float: left;
margin: 6px 8px;
min-height: 65px;
}

.classes .class, .classes .class .class-avatar{
transition: all 0.3s ease-out;
-o-transition: all 0.1s ease-out;
-ms-transition: all 0.1s ease-out;
-moz-transition: all 0.1s ease-out;
-webkit-transition: all 0.3s ease-out;
}

.classes .class:hover{
background: #CCD7DF;
}

.classes .class:hover .class-avatar{
box-shadow: 0 0 10px white;
border-color: #6C9EC2;
}

.classes .class:hover .subject a{
color: #32455E;
}

.classes .class .class-avatar{
background: white url(//media.liveho.me/eduventus.com/images/class_avatar.png) no-repeat center 2px;
display: inline-block;
width: 35px;
height: 35px;
vertical-align: middle;
margin-right: 10px;
background-size: 40px;
border-radius: 50px;
border: 3px solid #D8D8D8;
float: left;
}

.classes .class .class-name{
font-size: 15px;
padding: 10px;
}

.classes .class .subjects{
clear: both;
margin-top: 5px;
font-size: 14px;
}

.classes .class .subject{
display: inline-block;
padding-right: 10px;
}

.classes .class .subject a{
text-decoration: none;
color: #5F7692;
}

.classes .class .subject.disabled a{
color: #AFAFAF;
}


.item-input.range{
text-align: center;

background-image: linear-gradient(left , rgb(250,160,160) 0%, rgb(183,214,98) 50%, rgb(250,160,160) 100%, rgb(244,247,148) 25%, rgb(244,247,148) 75%);
background-image: -o-linear-gradient(left , rgb(250,160,160) 0%, rgb(183,214,98) 50%, rgb(250,160,160) 100%, rgb(244,247,148) 25%, rgb(244,247,148) 75%);
background-image: -moz-linear-gradient(left , rgb(250,160,160) 0%, rgb(183,214,98) 50%, rgb(250,160,160) 100%, rgb(244,247,148) 25%, rgb(244,247,148) 75%);
background-image: -webkit-linear-gradient(left , rgb(250,160,160) 0%, rgb(183,214,98) 50%, rgb(250,160,160) 100%, rgb(244,247,148) 25%, rgb(244,247,148) 75%);
background-image: -ms-linear-gradient(left , rgb(250,160,160) 0%, rgb(183,214,98) 50%, rgb(250,160,160) 100%, rgb(244,247,148) 25%, rgb(244,247,148) 75%);

background-image: -webkit-gradient(
	linear,
	left top,
	right top,
	color-stop(0, rgb(250,160,160)),
	color-stop(0.5, rgb(183,214,98)),
	color-stop(1, rgb(250,160,160)),
	color-stop(0.25, rgb(244,247,148)),
	color-stop(0.75, rgb(244,247,148))
);
}

.item-input.range-one-side{
background-image: linear-gradient(left , rgb(183,214,98) 100%, rgb(250,160,160) 0%, rgb(244,247,148) 25%);
background-image: -o-linear-gradient(left , rgb(183,214,98) 100%, rgb(250,160,160) 0%, rgb(244,247,148) 25%);
background-image: -moz-linear-gradient(left , rgb(183,214,98) 100%, rgb(250,160,160) 0%, rgb(244,247,148) 25%);
background-image: -webkit-linear-gradient(left , rgb(183,214,98) 100%, rgb(250,160,160) 0%, rgb(244,247,148) 25%);
background-image: -ms-linear-gradient(left , rgb(183,214,98) 100%, rgb(250,160,160) 0%, rgb(244,247,148) 25%);

background-image: -webkit-gradient(
	linear,
	left top,
	right top,
	color-stop(1, rgb(183,214,98)),
	color-stop(0, rgb(250,160,160)),
	color-stop(0.25, rgb(244,247,148))
);
}


.item-input.range input{
width: 98% !important;
}


.item-input-range-legend{
margin-top: -15px;
margin-bottom: 15px;
}

.range-legend-name{
width: 33%;
display: inline-block;
}

.range-legend-left{
text-align: left;
}

.range-legend-center{
text-align: center;
}

.range-legend-right{
text-align: right;
}






.check-homework-btn{
position: relative;
}

.check-homework{
color: gray;
text-decoration: none;
}

.check-homework-btn:hover .check-homework{
color: #0EA30E;
}

.check-homework-btn .check-homework.checked, .check-homework.checked{
color: #0EA30E;
font-weight: bold;
}

.check-homework.late{
color: #A74949;
}


.check-homework-btn .label-box{
display: none;
position: absolute;
top: 26px;
left: -20px;
z-index: 999;
border: 1px solid gray;
background-color: white;
padding: 5px 8px;
opacity: 1;

transition: opacity 0.2s ease-out;
-o-transition: opacity 0.2s ease-out;
-moz-transition: opacity 0.2s ease-out;
-webkit-transition: opacity 0.2s ease-out;

background-color: #222;
border-color: white;
color: white;
box-shadow: black 0px 0px 3px;
}

.check-homework-btn:hover .label-box{
display: block;
opacity: 1;
}

.check-homework-btn .label-box .arrow1{
width: 0;
height: 0;
position: absolute;
top: -10px;
left: 25px;
border-bottom: 10px solid white;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
margin-left: -8px;
}

.check-homework-btn .label-box .arrow2{
width: 0;
height: 0;
position: absolute;
top: -9px;
left: 25px;
border-bottom: 9px solid #222;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
margin-left: -7px;
}

.check-homework-btn .label-box .label{
white-space: nowrap;
overflow: hidden;
text-align: center;
}


.homework-like, .homework-unlike{
background: url(//media.liveho.me/gra.re/images/homework_like.png) no-repeat 0px 0px;
width: 18px;
height: 18px;
opacity: 0.3;
}

.homework-like{
float: left;
}

.homework-like.on, .homework-like:hover{
background-position: 0px -18px;
opacity: 0.8;
}

.homework-unlike{
background-position: -18px 0px;
float: right;
}

.homework-unlike.on, .homework-unlike:hover{
background-position: -18px -18px;
opacity: 0.8;
}

.homework-like a, .homework-unlike a{
width: 100%;
height: 100%;
display: block;
}




.homework-like-num, .homework-unlike-num{
height: 18px;
}

.homework-like-num{
float: left;
}

.homework-unlike-num{
float: right;
}

.homework-like-num span.icon, .homework-unlike-num span.icon{
background: url(//media.liveho.me/gra.re/images/homework_like.png) no-repeat 0px 0px;
width: 18px;
height: 18px;
opacity: 0.3;
display: block;
float: left;
}

.homework-unlike-num span.icon{
float: right;
}

.homework-like-num span.icon{
background-position: 0px 0px;
}

.homework-like-num.on span.icon{
background-position: 0px -18px;
opacity: 0.8;
}

.homework-unlike-num span.icon{
background-position: -18px 0px;
}

.homework-unlike-num.on span.icon{
background-position: -18px -18px;
opacity: 0.8;
}

.homework-like-num span.num{
display: block;
float: left;
margin-left: 2px;
color: #B9B9B9;
}

.homework-like-num.on span.num{
color: #118808;
font-weight: bold;
}

.homework-unlike-num span.num{
display: block;
float: right;
margin-right: 2px;
color: #B9B9B9;
}

.homework-unlike-num.on span.num{
color: #ba0404;
font-weight: bold;
}




.feature-box{
position: relative;
border: 1px solid #BDBDBD;
min-height: 50px;
margin-bottom: 20px;
padding: 8px 12px;
padding-right: 50px;
}

.feature-box .name{
font-size: 18px;
font-weight: bold;
margin-bottom: 5px;
color: #464646;
}

.feature-box .name span{
font-size: 16px;
margin-right: 5px;
letter-spacing: -1px;
color: #B64B4B;
}

.feature-box .desc{
margin-bottom: 5px;
}

/* */

#help-box{
display: none;
position: absolute;
top: 26px;
left: -20px;
z-index: 999;
border: 1px solid gray;
background-color: white;
padding: 5px 8px;
opacity: 1;

transition: opacity 0.2s ease-out;
-o-transition: opacity 0.2s ease-out;
-moz-transition: opacity 0.2s ease-out;
-webkit-transition: opacity 0.2s ease-out;

background-color: #222;
border-color: white;
color: white;
box-shadow: black 0px 0px 3px;
}

#help-box #arrowL1{
width: 0;
height: 0;
position: absolute;
top: -10px;
left: 15px;
border-bottom: 10px solid white;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
margin-left: -8px;
}

#help-box #arrowL2{
width: 0;
height: 0;
position: absolute;
top: -9px;
left: 15px;
border-bottom: 9px solid #222;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
margin-left: -7px;
}

#help-box #arrowR1{
width: 0;
height: 0;
position: absolute;
top: -10px;
right: 15px;
border-bottom: 10px solid white;
border-left: 8px solid transparent;
border-right: 8px solid transparent;
margin-right: -8px;
}

#help-box #arrowR2{
width: 0;
height: 0;
position: absolute;
top: -9px;
right: 15px;
border-bottom: 9px solid #222;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
margin-right: -7px;
}





.presence-num{
width: 15px;
display: inline-block;
text-align: right;
}



#homework-editor{

}

#homework-editor .title{

}

#homework-editor .title input{
width: 100%;
border-color: #E7E7E7;
font-size: 20px;
box-sizing: border-box;
margin: 0;
}

#homework-editor .editor{
width: 100%;
border: 1px solid #999;
margin-bottom: 15px;
}

#homework-editor .editor textarea{
width: 100%;
min-height: 250px;
box-sizing: border-box;
border: none;
margin: 0;
}

#homework-editor .editor .info-bar{
padding: 5px 10px;
border-top: 1px solid #999;
}

#homework-editor .editor .info-bar .chars{
float: right;
}

#homework-editor .bottom-bar{
width: 100%;
}

#homework-editor .bottom-bar .save-btn, #homework-editor .bottom-bar .submit-btn{
width: 50%;
display: inline-block;
font-size: 12px;
color: #3F3F3F;
}

#homework-editor .bottom-bar .save-btn{

}

#homework-editor .bottom-bar .submit-btn{
text-align: right;
}

.clear{
clear: both;
}



/*****************************  MESSAGES  ********************************/

.overbody.title{
padding-bottom: 5px;
width: 99% !important;
margin: 5px auto;
max-width: 1200px;
font-size: 28px;
padding-left: 25px;
color: #3F3F3F;

margin-top: -3px;
}

#content .width-fix{
padding-bottom: 0;
}

#messages{
margin: 0;
margin-top: -25px;
}

#messages #messages-menu{
float: left;
width: 20%;

min-height: 500px;
border-right: 1px solid #BEBEBE;
box-shadow: 2px 1px 5px #DDD;
}

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

#messages #messages-menu ul li{

}

#messages #messages-menu ul li a{
display: block;
padding: 12px 25px;
text-decoration: none;
color: #535353;
font-size: 17px;
border-bottom: 1px solid #D6D6D6;
}

#messages #messages-menu ul li.on a{
font-weight: 400;
color: #353535;
background: #BBD022;
}

#messages #messages-menu .new-btn{
text-align: center;
margin: 5px 0;
margin-top: 10px;
}

#messages #messages-body{
float: left;
width: 80%;
min-height: 500px;
margin-right: -1px;
}

#messages #messages-body .title{
font-size: 22px;
color: #474747;
margin: 15px 20px;
margin-top: 20px;
}

#messages #messages-nav{

}

#messages #messages-nav .btn{
padding: 6px 15px;
margin: 10px 10px;
display: block;
}

#messages #messages-nav .btn.back{
float: left;
}

#messages #messages-nav .btn.new{
float: right;
}


#messages #messages-body .messages-list-empty{
text-align: center;
font-size: 20px;
margin-top: 200px;
}

.messages-list{
height: 435px;
overflow: auto;
margin-right: 1px;
}

.messages-list .messages-list-item{
font-size: 14px;
padding: 10px 15px;
border: 1px solid #DADADA;
margin-bottom: -1px;
border-width: 1px 0px;
}

.messages-list .messages-list-item.new{
font-weight: 400;
}

.messages-list .messages-list-item.head{
border-top: none;
font-weight: 400;
letter-spacing: 1px;
text-transform: uppercase;
font-size: 11px;
}

.messages-list .messages-list-item:hover{
background: #F8FFC5;
}

.messages-list .messages-list-item .no{
float: left;
width: 20px;
text-align: right;
padding-right: 5px;
}

.messages-list .messages-list-item .from_user, .messages-list .messages-list-item .subject, .messages-list .messages-list-item .text{
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
padding-right: 10px;
}

.messages-list .messages-list-item .from_user{
float: left;
width: 180px;
}

.messages-list .messages-list-item .subject{
float: left;
}

.messages-list .messages-list-item .text{
float: left;
}

.messages-list .messages-list-item .star{
float: right;
margin-right: 5px;
}

.messages-list .messages-list-item .star a{
text-decoration: none;
color: #F38D0B;
}

.messages-list .messages-list-item .date{
float: right;
}


.message-view{
margin: 0 15px;
}

.message-view .message-view-head{

}

.message-view .message-view-head .subject{
font-size: 25px;
border-bottom: 1px dashed #B4B4B4;
padding: 0 5px;
}

.message-view .message-view-head .from_user{
float: left;
padding-left: 5px;
}

.message-view .message-view-head .date{
float: right;
padding-right: 5px;
}

.message-view .message-view-body{
font-size: 14px;
margin: 15px 0;
background: #F7F7F7;
padding: 10px 15px;
border-radius: 5px;
box-shadow: 0 0 2px #797979;
}


.message-new{
margin: 0 20px;
}







#class-fastmenu{
position: relative;
width: 100%;
max-width: 1200px;
margin: 0 auto;
}

.overbody-menu{
position: absolute;
top: 8px;
right: 25px;
}

.overbody-menu ul{
list-style: none;
padding: 0;
margin: 0;
}

.overbody-menu ul li{
display: inline-block;
}

.overbody-menu ul li a{
padding: 5px 15px;
color: black;
text-decoration: none;
font-size: 14px;
}




/* --------------------  SubMenu  ---------------------- */


.submenu{
padding: 10px 15px;
margin-bottom: 25px;
}

.submenu ul{
list-style: none;
margin: 0;
padding: 0;
}

.submenu ul li{
display: inline-block;
}

.submenu ul li a{
padding: 6px 15px;
background: rgb(235, 235, 235);
border: 1px solid rgb(177, 177, 177);
color: #313131;
text-decoration: none;
margin-right: -1px;
}

.submenu ul li a.active{
font-weight: 400;
color: black;
}

.submenu ul li:first-child a{
border-radius: 5px 0 0 5px;
}

.submenu ul li:last-child a{
border-radius: 0 5px 5px 0;
}



.summary-chart-info{

}

.summary-chart-info .item{
float: left;
width: 50%;
margin: 5px 0;
}

.summary-chart-info .item .color{
width: 10px;
height: 10px;
background: #F00;
display: inline-block;
margin-right: 5px;
}





/* --------------------  TEST AREA  ---------------------- */


#test-area{
position: relative;
width: 750px;
height: 450px;
background: #F5F5F5;
}

#test-area .start-btn{
position: absolute;
top: 50%;
left: 0;
right: 0;
margin-top: -20px;
text-align: center;
}

#test-area .start-btn .btn{
font-size: 18px;
font-weight: 400;
}

#test-area .error{
position: absolute;
top: 50%;
left: 0;
right: 0;
text-align: center;
margin-top: -50px;
}

#test-area .error .name{
font-size: 22px;
margin-bottom: 5px;
}

#test-area .error .desc{
font-size: 14px;
color: #4D4D4D;
}



#test-area .test-name{
position: absolute;
top: 70px;
left: 0;
right: 0;
text-align: center;
font-size: 24px;
}

#test-area .info{
position: absolute;
top: 120px;
left: 0;
right: 0;
text-align: center;
font-size: 15px;
line-height: 22px;
}

#test-area .time-left{
position: absolute;
top: 30px;
right: 12px;
font-size: 16px;
font-weight: 400;
width: 80px;
text-align: center;
}

#test-area .questions-num{
position: absolute;
top: 10px;
right: 12px;
width: 80px;
text-align: center;
}

#test-area .question-area{
position: absolute;
top: 80px;
left: 60px;
width: 600px;
}

#test-area .question-area .question{
font-size: 20px;
margin-bottom: 15px;
}

#test-area .question-area .question .num{
font-size: 14px;
font-weight: 400;
color: #3C3C3C;
}

#test-area .question-area .answers{

}

#test-area .question-area .answers .answer{
padding: 10px 0;
}

#test-area .question-area .answers a{
color: #000;
text-decoration: none;
}

#test-area .question-area .answers .answer .symbol{
float: left;
width: 25px;
height: 21px;
border: 10px solid #D1D1D1;
border-radius: 50px;
text-align: center;
font-size: 15px;
font-weight: 500;
color: #5A5A5A;
padding: 2px 0;
margin-right: 12px;
}

#test-area .question-area .answers a:hover .answer .symbol{
border-color: #80C8E4;
}

#test-area .question-area .answers .answer .ans-text{
padding: 13px 0;
font-size: 14px;
}



#test-area{

}

#test-area{

}



















/* --------------------  MEDIA  ---------------------- */



@media all and (max-width: 1240px) {

	#home-promo .email-bar{
	margin: 30px 0;
	}
	
	#home-promo .email-bar .left-end, #home-promo .email-bar .right-end{
	display: none;
	}

}

@media all and (max-width: 1100px) {

	nav{
	background: #333;
	top: 78px;
	left: 0;
	right: 0;
	background-image: url(//media.liveho.me/livehome.pl/images/bg.png);
	padding: 2px 10px;
	padding-bottom: 10px;
	border-top: 1px solid #4B4B4B;
	box-shadow: 0 -1px 0 black;
	}
	
	#body{
	margin-top: 35px !important;
	}

}

@media all and (max-width: 720px) {

	nav{
	top: 65px;
	}
	
	nav ul li{
	padding: 2px 5px !important;
	font-size: 14px;
	}
	
	#body{
	margin-top: 40px !important;
	}
	
	#home-promo .left-side, #home-promo .right-side{
	float: none;
	width: 90%;
	padding: 0 5%;
	}
	
	nav #menu-login{
	display: block;
	}

}