/* This stylesheet takes care of colors and design
    To edit layout, please edit layout.css
*/

/*Logo in header*/
.logo
{
    /*max logo height and width, don't increase too much!*/
    width:220px;
    height:80px;
    /*image url*/
    background-image:url(../img/logo.png);
}


/* HTML elements */
* 
{
    font-family:Verdana, Geneva, sans-serif;
    font-size:12px;
}

body 
{
    color:#1F5C99;
    background-color:#1F5C99;
    
    background-image: linear-gradient(left bottom, rgb(19,63,107) 14%, rgb(31,92,153) 52%);
    background-image: -o-linear-gradient(left bottom, rgb(19,63,107) 14%, rgb(31,92,153) 52%);
    background-image: -moz-linear-gradient(left bottom, rgb(19,63,107) 14%, rgb(31,92,153) 52%);
    background-image: -webkit-linear-gradient(left bottom, rgb(19,63,107) 14%, rgb(31,92,153) 52%);
    background-image: -ms-linear-gradient(left bottom, rgb(19,63,107) 14%, rgb(31,92,153) 52%);

    background-image: -webkit-gradient(
	    linear,
	    left bottom,
	    right top,
	    color-stop(0.14, rgb(19,63,107)),
	    color-stop(0.52, rgb(31,92,153))
    );
}

h1,h2,h3
{
    font-size:bold;
}

h1
{
    font-size:30px;
    text-transform:uppercase;
}

h2
{
    font-size:15px;
}

h3
{
    font-size:13px;
}

label
{
    font-weight:bold;
}

button, input[type=button]
{
    height:auto !important;
    background:white !important;
    padding:3px !important;
    border: 2px solid #50658F !important;
    color: #466199 !important;
    font-weight:bolder;
    border-radius:4px !important;
}

button:hover, input[type=button]:hover
{
    background:#C2D3E3 !important;
}

button:active, input[type=button]:active
{
    background:#2C7AC9 !important;
    color:White !important;
}

.formitem input[type=text], .formitem input[type=password]
{
    border:0px;
    color:White;
    box-shadow: inset 3px 3px 8px rgba(46, 46, 46, 0.19);
    background:#2C7AC9;
    border-radius:5px;
}

.formitem input[type=text]:hover, .formitem input[type=password]:hover
{
    background-color: #3F96EE;
}

.formitem input[type=text]:active, .formitem input[type=text]:focus, .formitem input[type=password]:active, .formitem input[type=password]:focus
{
    border:0px;
    background:#336699;
}

.formitem select
{
    background-color:#2C7AC9;
    box-shadow: inset 3px 3px 8px rgba(46, 46, 46, 0.19);
    border:0px;
    color:White;
    border-radius:5px;
}

.formitem select:hover
{
    background-color: #3F96EE;
}

.reason .styledselect select
{
    background-color:#2C7AC9;
    border:0px;
    color:White; 
}

.row_selected .reason .styledselect select
{
    background-color:#D5DBDB;
    color:#1F5C99;
}

.row.noedit
{
    background-image:url('../img/stripes.png');
}

/*page parts*/
.headercontent .headercontentright
{
    background:#356CA3;
    color:White;
    border-radius:5px;
}

.logo
{
    background-repeat:no-repeat;
}

.footer
{
    color:#5282B3;
}

.content
{  
    background:#FFFFFF;
    border-radius:10px;
    background: linear-gradient(bottom, #F6F6F6 18%, #FFFFFF 90%);
    background: -o-linear-gradient(bottom, #F6F6F6 18%, #FFFFFF 90%);
    background: -moz-linear-gradient(bottom, #F6F6F6 18%, #FFFFFF 90%);
    background: -webkit-linear-gradient(bottom, #F6F6F6 18%, #FFFFFF 90%);
    background: -ms-linear-gradient(bottom, #F6F6F6 18%, #FFFFFF 90%);

    background: -webkit-gradient(
	    linear,
	    left bottom,
	    left top,
	    color-stop(0.18, #F6F6F6),
	    color-stop(0.9, #FFFFFF)
    );
}    

.loginbox
{
    background:#E2E2E2;
    border-radius:10px;
}

.loginbox input
{
    background:#FEFEFE;
    color:#1F5C99;
}

.loginbox input:active, .loginbox input:focus
{
    background:#FFFFFF;    
}

.loginbox label
{
    width:80px;
    min-width:80px;
    max-width:80px;
}

.sidemessage
{
    background:#2C7AC9;
    color:#FFFFFF;
    border-radius:10px;
}


/*menu*/
.menu ul li
{
    border-top-left-radius:5px;
    border-top-right-radius:5px;
}

.menu ul li#active
{
    background:white;
}

.menu ul li a, .menu #logoutbutton a
{
    font-size:18px;
    font-weight:400;
    color:#1F5C99;
    
    border-radius:5px;
}

.menu ul li#active a
{
    color:#1F5C99;
}

.menu ul li a
{
    color:#FFFFFF;
}

.menu ul li a:hover,
.menu #logoutbutton a:hover,
.menu ul li a:active,
.menu #logoutbutton a:active
{
    background:white;
    color:#1F5C99;
    border-radius:5px;
}


.menu #logoutbutton a:hover,
.menu #logoutbutton a:active
{
    background:#1F5C99;
    border:1px solid white;
    color:White;
}

.menu #logoutbutton a
{
    background:white;
}

/*table with student rows*/
.rows
{
    background:#2C7AC9;
    


    background: linear-gradient(bottom, #2875BD 31%, #2C7BC9 75%);
    background: -o-linear-gradient(bottom, #2875BD 31%, #2C7BC9 75%);
    background: -moz-linear-gradient(bottom, #2875BD 31%, #2C7BC9 75%);
    background: -webkit-linear-gradient(bottom, #2875BD 31%, #2C7BC9 75%);
    background: -ms-linear-gradient(bottom, #2875BD 31%, #2C7BC9 75%);

    background: -webkit-gradient(
	    linear,
	    left bottom,
	    left top,
	    color-stop(0.31, #2875BD),
	    color-stop(0.75, #2C7BC9)
    );



    color:white;
    border-radius:10px;
}

.row
{
    border-top:2px solid #FFFFFF;
}


.studentinfo .row
{
    border-top:2px solid #E2E2E2;
}


.row:first-child
{
    border-top:0;
}

.row.rheader
{
    border-bottom:2px solid #FFFFFF;
    border-top:0;
    border-top-left-radius:10px;
    border-top-right-radius:10px;
}

.studentinfo .row.rheader
{
    border-bottom:2px solid #E2E2E2;
    border-top:0;
}

.spacer
{
    border-top:2px solid #FFFFFF;
}

.studentinfo .spacer
{
    border-top:3px solid #E2E2E2;
}

.row.overdefaultlessons
{
    color:#071A49;
    text-shadow:0 0 5px #ffffff;
    font-style:italic;
}

.row.overdiplomalessons
{
    color:#C6F50C;
    text-shadow:0 0 5px #ffffff;
    font-style:italic;
}

.row.row_selected
{
    background:#D5DBDB;
    color:#1F5C99;
}

.rheader
{
    border-top:none;
    font-weight:bold;
    background:#004A93;

}

.spacer
{
    border-bottom-left-radius:10px;
    border-bottom-right-radius:10px;  
}

.rheader, .spacer
{
    background-image: linear-gradient(bottom, #02468A 18%, #0356A3 51%);
    background-image: -o-linear-gradient(bottom, #02468A 18%, #0356A3 51%);
    background-image: -moz-linear-gradient(bottom, #02468A 18%, #0356A3 51%);
    background-image: -webkit-linear-gradient(bottom, #02468A 18%, #0356A3 51%);
    background-image: -ms-linear-gradient(bottom, #02468A 18%, #0356A3 51%);

    background-image: -webkit-gradient(
	    linear,
	    left bottom,
	    left top,
	    color-stop(0.18, #02468A),
	    color-stop(0.51, #0356A3)
    );
}

/*
.here
{
    background:#4A8A4A;
    background-image:url(../img/s_green.png);
}

.not_here
{
    background:#993636;
    background-image:url(../img/s_red.png);
}

.comment
{
    background-image:url(../img/s_comment.png);
    background-repeat:no-repeat;
}

.family_name, .name, .date_born, .group, .date_registered, .from, .to, .score, .present, .notpresent, .comment, .no_comment, .here, .not_here
{
    border-right:2px solid white;
}

.studentinfo .family_name, .studentinfo .name, .studentinfo .date_born, .studentinfo .group, .studentinfo .date_registered, .studentinfo .from, .studentinfo .to, .studentinfo .score, .studentinfo .present, .studentinfo .notpresent, .studentinfo .comment, .studentinfo .no_comment, .studentinfo .here, .studentinfo .not_here
{
    border-right:2px solid #E2E2E2; 
}*/


.row > div.to, .row > div.date_registered.dr2
{
    border-right:0;
}

.rheader .here, .rheader .not_here, .rheader .comment, .rheader .no_comment
{
    background:none;
}

.vcontainer
{

}

.vpart
{
    background-color:#004A93;
}

.vheader .vpart
{
    border-bottom:3px solid #E2E2E2;
    color:#E2E2E2;
    font-weight:bolder;
}

.vrowcontainer .vpart
{
    background-color: #2C7AC9;
}

.vheader .vpart:first-child
{
    border-top-left-radius:10px;
}

.vheader .vpart:last-child
{
    border-top-right-radius:10px;
}

.vrowcontainer .vpart:first-child
{
    border-bottom-left-radius:10px;
}

.vrowcontainer .vpart:last-child
{
    border-bottom-right-radius:10px;
}

.vpart:last-child
{
    border-right:0px;    
}

.vheader .vpart.score.shown.last
{
    border-top-right-radius:10px;
}

.vrowcontainer .vpart.score.shown.last
{
    border-bottom-right-radius:10px;
}

.ascsort
{
    background:transparent url('../img/sa_d.png') no-repeat top right;
}
.descsort
{
    background:transparent url('../img/sa_u.png') no-repeat top right;
}


/*lessongroup viewer*/

.iconcontainer
{
    border:1px dotted #004A93;
    border-radius:5px;
}

.middlebutton .movebutton
{
    background-color:#FFFFFF;
    border-radius:13px;
    border:2px solid #356CA3;
    background-image:url(../img/arrowright.png);
    cursor:pointer;
}


.middlebutton .movebutton:hover
{
    background-color:#C2D3E3;
}

.middlebutton .movebutton span
{
    display:none;
}

.icon img
{
    border:1px solid #DDDDDD;
    box-shadow:0px 0px 15px #CCCCCC;
    border-radius: 7px;
}

.icon.selected
{
    background:#EEEEEE;
}

.over
{
    border:1px solid black;
}

/*score*/

.previousgoodscore
{
    background-image:url("../img/transgood.png");
}

.previousbadscore
{
    background-image:url("../img/transbad.png");
}

.previousnormalscore
{
    background-image:url("../img/transavg.png");
}

.previousAsBg .previousgoodscore
{
    background-image:none;
    background-color:#FFA347;
}

.previousAsBg .previousbadscore
{
    background-color:#993636;
    background-image:none;
}

.previousAsBg .previousnormalscore
{
    background-color:#599CFF;
    background-image:none;
}

.goodscore
{
    background-image:url("../img/good.png") !important;
}

.badscore
{
    background-image:url("../img/bad.png") !important;
}

.normalscore
{
    background-image:url("../img/avg.png") !important;
}

.goodscore, .badscore, .normalscore, .previousgoodscore, .previousbadscore, .previousnormalscore
{
    background-position:3px -5px;
    background-repeat:no-repeat;
    cursor:pointer;
}

/*box*/
.box
{
}

/*datepicker*/

input.hasDatepicker
{
    background-image:url(../img/calendar.png);
    background-repeat:no-repeat;
    background-position: 165px 3px; 
}

.ui-datepicker
{
    background:#1F5C99;
    background:rgba(31, 92, 153, 0.6);
    width:100%;
    bottom:0px;
    display:none;
    top:0px !important;
    left:0px !important;
    overflow:hidden;
    position:fixed !important;
}

.ui-datepicker-header
{
    width:280px;
    margin-left:auto;
    margin-right:auto;
    margin-top:30px;
}

.ui-datepicker-prev
{
    float:left;
    background-image:url(../img/arrowleft.png);
    border-right:3px solid #1F5C99;
    border-top-left-radius:5px; 
    border-bottom-left-radius:5px;
}

.ui-datepicker-next
{
    float:right;
    background-image:url(../img/arrowright.png);
    border-left:3px solid #1F5C99;
    border-top-right-radius:5px; 
    border-bottom-right-radius:5px;
}

.ui-datepicker-prev, .ui-datepicker-next
{
    display:block;
    height:40px;
    width:40px;
    background-color:#FFFFFF;
    background-repeat:no-repeat;
    background-position:10px 10px;
    cursor:pointer;
      
}

.ui-datepicker-prev span, .ui-datepicker-next span
{
    display:none;
}

.ui-datepicker-title
{
    padding-top:6px;
    background-color:#FFFFFF;
    height:34px;
    text-align:center;
    font-weight:bold;
    
    border-radius:5px;
}

.ui-datepicker-calendar
{
    margin-top:4px;
    text-align:center;
    background:white;
    border-radius:5px;
    width:280px;
    margin-left:auto;
    margin-right:auto;
}

.ui-datepicker-calendar a
{
    color:#1F5C99;
    text-decoration:none;
}

.ui-datepicker-calendar tr
{
    height:40px;
}

.ui-datepicker-calendar th, .ui-datepicker-calendar td
{
    width:14%; 
    cursor:pointer;
    vertical-align:middle;
}

.ui-state-highlight
{
    color:White;
    width:30px;
    height:30px;
    display:block;
    margin:7px 0px 0px 7px;
    padding-top:10px;
    border-radius:5px;
    border:1px solid #1F5C99;
}

.ui-state-active
{
    background:#1F5C99;
    color:White !important;
    width:30px;
    height:30px;
    display:block;
    /*margin:7px 0px 0px 7px;*/
    padding-top:10px;
    border-radius:5px;
}

.ui-datepicker-unselectable
{
    opacity:0.5;
}

/*tooltip*/

.tooltip .tooltipbox
{
    background:#E2E2E2;
    z-index:5;
    border:2px solid #1F5C99;
    border-radius:10px;
}

/*custom checkbox*/
.customcheckbox
{
    background-color:#2C7AC9;
    box-shadow: inset 3px 3px 8px rgba(46, 46, 46, 0.19);
    border-radius:4px;
}

.customcheckbox:hover
{
    background: #3F96EE;
}

.customcheckbox.checked
{
    background-image:url(../img/v.png);
    background-repeat:no-repeat;
    background-position:3px 2px;
}

/*lessongroup info and comments*/
#coursegroupinfo, #fromcoursegroupinfo, #tocoursegroupinfo, #previouscoursegroupcomment, #coursegroupcomment
{
    display:block;
    border:none;
    border-radius:5px;
    box-shadow: inset 3px 3px 8px rgba(46, 46, 46, 0.19);
    padding:8px;
    color:White;
}


#coursegroupinfo, #fromcoursegroupinfo, #tocoursegroupinfo, #coursegroupcomment 
{
    background:#2C7AC9;
    background: linear-gradient(bottom, #2875BD 31%, #2C7BC9 75%);
    background: -o-linear-gradient(bottom, #2875BD 31%, #2C7BC9 75%);
    background: -moz-linear-gradient(bottom, #2875BD 31%, #2C7BC9 75%);
    background: -webkit-linear-gradient(bottom, #2875BD 31%, #2C7BC9 75%);
    background: -ms-linear-gradient(bottom, #2875BD 31%, #2C7BC9 75%);

    background: -webkit-gradient(
	    linear,
	    left bottom,
	    left top,
	    color-stop(0.31, #2875BD),
	    color-stop(0.75, #2C7BC9)
    );
}

#previouscoursegroupcomment {
    background: #B6BDCC; 
}

#coursegroupinfo:hover, #fromcoursegroupinfo:hover, #tocoursegroupinfo:hover, #coursegroupcomment:hover
{
    background: #3F96EE;
}

#previouscoursegroupcomment:hover
{
    background: #CFD1D4;
}

.warnmsg
{
    color:#DF1F1F;
    display:none;
}
/*
@media all and (max-width:580px)
{
    .studentinfocontainer
    {
        background:#E2E2E2;
        border-radius:15px;
    }
    
    .studentinfo
    {
        background:#1F5C99;
        border-radius:0px;
    }
}*/

@media all and (max-width:436px)
{
    .loginbox .formitem input[type=text], .loginbox .formitem input[type=password]
    {
        width:158px;
    }

    .loginbox .formitem select
    {
        width:165px;
    }

    .formitem input[type=text], .formitem input[type=password]
    {
        width:172px;
    }

    .formitem select
    {
        width:180px;
    }

    input.hasDatepicker
    {
        background-position: 160px 3px;
    }
}

@media all and (max-width:643px) 
{
    .menu ul li
    {
        border-radius:5px;
    }
}

.processing > .pcsmsg
{
    border:1px solid #FFFFFF;
    background:#5990c9;
    box-shadow:0px 0px 8px 1px rgba(0, 0, 0, 0.1);
    border-radius:5px;
    color:#FFFFFF;
}

.msgbox > .mb
{
    border:1px solid #FFFFFF;
    background-color:#5990c9;
    box-shadow:0px 0px 8px 1px rgba(0, 0, 0, 0.1);
    border-radius:5px;
}

.msgboxh
{
    color:#FFFFFF;
    border-bottom:1px solid #FFFFFF;
    background: #2367AD repeat-x top;
    border-radius:5px 5px 0 0;
}

.msgboxc
{
    padding:10px;
    color:#FFFFFF;
}

.msgboxclose
{
    background:url('../img/iconclose.png') no-repeat center center;
    cursor:pointer;
}

.msgboxbtn
{
    color:White;
    border: 1px solid #B3CFED;
    cursor: pointer;
}

.msgboxbtn:hover, .msgboxbtn:active
{
    background:rgba(255,255,255,0.05);
}

.loggedinas
{
    background: #356CA3;
    color: #FFF;
    border-radius: 5px;
}

.scoresgood
{
    background-color:rgba(143, 255, 0, 0.53);
}

.ui-multiselect
{
    background-color: #2C7AC9 !important;
    box-shadow: inset 3px 3px 8px rgba(46, 46, 46, 0.19);
    border: 0 !important;
    color: #FFF !important;
    border-radius: 5px;
    font-weight: normal;
}

.ui-multiselect:hover
{
    background-color: #3F96EE !important;
}

.errorlabels {
    color: red;
}

.successlabels {
    color: green;
}

input[disabled], button[disabled], select[disabled]
{
    background: #B6BDCC !important;
}

input[disabled]:hover, button[disabled]:hover, select[disabled]:hover
{
    background: #CFD1D4 !important;
}