/** Common **/
@import url(//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,300,400,700);
ul,li{
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Custom container */
.container-fixed {
   margin: 0 auto;
  /*max-width: 1200px;*/
}
.container-fixed > hr {
  margin: 30px 0;
}

.message {
	background-color: #F0E2AD;
	color: #472200;
	padding: 8px;

}

.form_table td {
	padding: 4px
}

/** Fix For Bootstrap **/

.table {
    margin-bottom: 0;
}

.alert {
	font-weight: bold;
	margin: 0px;
	padding: 10px;
}

fieldset{
    color: white;
    font-weight: bold;
    border-radius: 7px;
    padding: 10px;
    border: 1px solid #bfe0e8;
}

legend{
    font-size: 15px;
    text-align: center;
    color: #0083a0;
    font-weight: normal;
    width: 92%;
    border: none;
    margin: 0;
}

.table>tbody>tr>td{
    /*vertical-align: middle; TODO: fix #1013, @Roza: please check if was needed somewhere... */
}

.header{
    border-bottom: 1px solid #eee;
    padding: 9px 4px
}


/** Assignment**/

.chapter {
	font-size: 20px !important;
	font-weight: bold;
	padding-top: 10px;
}

.theory {
	padding: 5px;
}

.assignment_header {
	padding: 1px 0 1px 240px;
	background-color: #eee;
	border-bottom: 2px solid #aaa;
	box-shadow: 1px 2px 4px 0px #aaa;
}

.top_buttons {
	float: right;

}

.top_buttons .print {
	width: 28px;
	height: 28px;
	display: inline-block;
	float: left;
	margin: 3px 10px;
    background: url("../img/print.png") no-repeat;
	background-size: 28px 28px;

}

.assignment_menu {
    width: 216px;
	margin-left: 12px;
    font-family: "Open Sans", sans-serif ;
}

.assignment_menu_pad {
    z-index: 10;
    width       : 230px ;
    height      : 100% ;
    padding-top : 5px ;
    margin-top  : 4px ;
    /*box-shadow  : 2px 0px 10px 0px #aaa ;*/
    background-color: white ;
}


.assignment_menu a {
	color: black;
}

.title{
    color: #0083a0;
    font-size: 11px;
    margin: 12px 0 10px;
    font-weight: 400;
}

.achievements-desk,
.questions-wrapper{
    text-align: center;
}

.questions-wrapper{
    border-top: 1px solid #bfe0e8;
    margin: 0 -10px;
    padding: 0 10px;
}

/* progress bar */
.progress-wrapp{
    text-align: center;
}

.progress-wrapp .score-title{
    color: #0083a0;
    font-size: 10px;
    margin-bottom: 8px;
}

.progress-bar-score{
    color: white;
    font-size: 55px;
    font-weight: bold;
    display: block;
    line-height: 60px;
    position: absolute;
    width: 194px;/*should be fixed in px's to guarantee two scores exact overlapping */
    top: 0;
    right: 0;
    z-index: 5;
}

.progress-bar-score.blue{
    color: #0083a0;
    z-index: 10;
    /*text-shadow: 0 0 25px #fff, 0 0 25px #fff;*/
}

.blue-score-wrap {
    position: relative;
    height: 100%;
    overflow: hidden;
}

.progress-wrapp .progress{
    margin-bottom: 2px;
    height: 60px;
    position: relative;/*to make this as positioning parent for progress score elements*/
    /*-webkit-box-shadow: inset 0px 0px 0px 1px #90c7de;*/
    /*-moz-box-shadow: inset 0px 0px 0px 1px #90c7de;*/
    /*box-shadow: inset 0px 0px 0px 1px #90c7de;*/
}

.progress-wrapp .progress .progress-bar{
    background: -webkit-linear-gradient(#74C6DF, #0084a6); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#74C6DF, #0084a6); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#74C6DF, #0084a6); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#74C6DF, #0084a6);
    min-width: 0;
}

.progress-wrapp .start-point{
    font-size: 16px;
    color: #0083a0;
    float: left;
    position: relative;
    left: -6px;
}

.progress-wrapp .end-point{
    font-size: 16px;
    color: #0083a0;
    float: right;
    position: relative;
    right: -6px;
}
/* end of progress bar */

.achievements-desk{
    margin: 0 -10px;
    padding: 0 10px;
    overflow: hidden;
    clear: both;
    position: relative;
    border-top: 1px solid #bfe0e8;
}

.achievements-list{
    margin-bottom: 8px;
    height:63px;
}

.achievements-desk .no-badge-text,
#classmates_badges .no-badge-text{
    color: #dcdcdc;
    font-weight: normal;
    margin-top: 22px;
    width: 83%;
    position: absolute;
    left: 20px;
    font-size: 13px;
    top: 20px;
}

#classmates_badges .no-badge-text{
    width: 80%;
    text-align: center;
    top: 32%;
    left: 12px;
}

.special-medal-wrapper{
    padding-bottom: 8px;
    display: block;
}

.special-medal-wrapper span{
    color: #859858;
    font-size: 14px;
    font-weight: normal;
    padding-bottom: 8px;
    display: inline-block;
}

.badges li{
    display: inline-block;
}

.badge{  /* .badges li span.badge */
    height: 28px;
    width: 25px;
    background: url('../img/small-badges.png') -3px center no-repeat;
    position: relative;

}

.badges li span.badge{
    display: inline-block;
}

.multiple{
    height: 14px;
    width: 14px;
    border-radius: 50%;
    color: #fff;
    background: #0083a0;
    position: absolute;
    font: 11px/15px "Oriya Sangam MN", sans-serif;
    top: 14px;
    left: 16px;
}

.badge{ /* .badges li .badge */
    float: left;
    margin-right: 3px;
}

#classmates_badges fieldset{
    min-height: 275px;
}

#classmates_badges .badge{ /* #classmates_badges li .badge */
    margin-right: 11px;
}

.assignment-badge-501 .badge{ /*corresponds to skill pro*/
    background-position: -280px -4px;
}

.assignment-badge-401 .badge{ /* corresponds to Brainy Kid */
    background-position: -125px -4px;
}

.assignment-badge-402 .badge{ /* corresponds to Brainy Kid */
    background-position: -94px -4px;
}

#classmates_badges .assignment-badge-301 .badge,
#classmates_badges .assignment-badge-302 .badge{ /* corresponds to Brainy Kid */
    margin-left: -6px;
    margin-right: 5px;
}

.assignment-badge-301 .badge{ /* corresponds to Brainy Kid */
    background-position: -50px -4px;
    width: 38px;
}

.assignment-badge-302 .badge{ /* corresponds to  Whizz Kid */
    background-position: -4px -4px;
    width: 38px;
}

.assignment-badge-201 .badge{ /* corresponds to  sapphire */
    background-position: -187px -4px;
}

.assignment-badge-202 .badge{ /* corresponds to  ruby */
    background-position: -218px -4px;
}

.assignment-badge-203 .badge{ /* corresponds to  diamond */
    background-position: -156px -4px;
}

.assignment-badge-101 .badge{ /*corresponds to triple play*/
    background-position: -115px -38px;
}

.assignment-badge-102 .badge{ /*corresponds to high five*/
    background-position: -143px -38px;
}

.assignment-badge-103 .badge{ /*corresponds to persistent problem solver*/
    background-position: -171px -38px;
}

.assignment-badge-1 .badge{ /*corresponds to silver medal*/
    background-position: -87px -38px;
}

.assignment-badge-2 .badge{ /*corresponds to gold medal*/
    background-position: -59px -38px;
}

.assignment-badge-3 .badge{ /*corresponds to silver star*/
    background-position: -31px -38px;
}

.assignment-badge-4 .badge{ /*corresponds to gold star*/
    background-position: -3px -38px;
}

.assignment-badge-5 .badge{ /*corresponds to superstar*/
    background-position: -249px -4px;
}

.attempts{
    width: 23px;
    height: 23px;
    font-size: 16px;
    display: inline-block;
    border: 1px solid #c9c7c7;
    background: #fff;
    color: #80abb7!important;
    border-radius: 50%;
    text-align: center;
    line-height: 21px;
}


/*.answer table tr:nth-child(2) td{*/
    /*padding-top: 6px;*/
/*}*/

.attempts-warning {
    float: right;
    clear: right;
    margin-top: 6px;
    font-size: 14px;
}

span.remaining-attempts-message{
    color: rgb(139, 139, 139);
    vertical-align: middle;
}

.badges{
    display: inline-block;
    vertical-align: middle;
    margin: -8px 0 -8px 12px;
    line-height: 0;
}

#badges_showcase {
    height: 45px;
    vertical-align: middle;
    display: inline-block;
    text-align: left;
    border: 0; /*to prevent helper's border*/
    overflow: visible;
    position: relative;
    float: right;
    z-index: 1; /* to open over the top badge */
    padding-right: 12px;
    /*border-right: 1px solid rgb(235, 235, 235);*/
}

#badges_showcase ul {
    background: #fff;
    padding: 8px 3px 8px 11px;
    margin-top: -6px;
    max-width: 250px;
    height: 56px;
    overflow-y: hidden;
    border-radius: 4px;
}
#badges_showcase.open ul { /*moved to animation!*/
    -webkit-box-shadow: 0px 0px 8px #B2B1B1;
    -moz-box-shadow: 0px 0px 8px #B2B1B1;
    box-shadow: 0px 0px 8px #B2B1B1;
    border-collapse: separate;
    height: auto;
}

#badges_showcase li{
    display: inline-block;
}

.middle-badge{ /* #badges_showcase li .middle-badge */
    width: 38px;
    height: 43px;
    margin-right: 5px;
    position: relative;
    display: inline-block;
    background: url('../img/middle-badges.png') -5px -6px no-repeat;
}

.middle-badge.more-button, .middle-badge.hide-button{ /* #badges_showcase li .middle-badge.button */
    font-size: 12px;
    vertical-align: middle;
    text-align: center;
    line-height: 9px;
    padding-top: 14px;
    margin-top: -34px;
    color: #9c9c9c;
    cursor: pointer;
}

.middle-badge.hide-button{ /* #badges_showcase li .middle-badge.button.opened */
    background-position: -5px -56px;
    padding-top: 16px;
    color: #fff;
    display: none;
}

.open .middle-badge.hide-button{
    display: inline-block;
}
.open .middle-badge.more-button{
    display: none;
}

.middle-badge .quantity{ /* #badges_showcase li .middle-badge .quantity */
    height: 20px;
    text-align: center;
    width: 20px;
    border-radius: 50%;
    color: #fff;
    background: #0083a0;
    position: absolute;
    font: 11px/21px "Oriya Sangam MN", sans-serif;
    top: 23px;
    left: 24px;
}

.assignment-badge-501 .middle-badge,
.assignment-badge-501 .tooltip-badge,
.skill_practicing_tree .tooltip-badge {
    background-position: -747px -56px;
}

.assignment-badge-402 .middle-badge,
.assignment-badge-402 .tooltip-badge { /* #badges-showcase .assignment-badge-402 .middle-badge */
    background-position: -186px -56px;
}

.assignment-badge-401 .middle-badge,
.assignment-badge-401 .tooltip-badge {
    background-position: -229px -56px;
}

.assignment-badge-302 .middle-badge,
.assignment-badge-302 .tooltip-badge {
    background-position: -52px -56px;
    width: 57px;
    margin-right: 0;
}

.assignment-badge-302 .middle-badge .quantity,
.assignment-badge-301 .middle-badge .quantity{
    left: 35px;
}

#badges_showcase .assignment-badge-302,
#badges_showcase .assignment-badge-301{
    margin: 0 -4px 0 -10px;
}

.assignment-badge-301 .middle-badge,
.assignment-badge-301 .tooltip-badge {
    background-position: -120px -56px;
    width: 57px;
    margin-right: 0;
}

.assignment-badge-203 .middle-badge,
.assignment-badge-203 .tooltip-badge {
    background-position: -272px -56px;
}

.assignment-badge-202 .middle-badge,
.assignment-badge-202 .tooltip-badge {
    background-position: -358px -56px;
}

.assignment-badge-201 .middle-badge,
.assignment-badge-201 .tooltip-badge{
    background-position: -315px -56px;
}

.assignment-badge-5 .middle-badge,
.assignment-badge-5 .tooltip-badge {
    background-position: -402px -56px;
}

.assignment-badge-4 .middle-badge,
.assignment-badge-4 .tooltip-badge {
    background-position: -446px -56px;
}

.assignment-badge-3 .middle-badge,
.assignment-badge-3 .tooltip-badge {
    background-position: -490px -56px;
}

.assignment-badge-2 .middle-badge,
.assignment-badge-2 .tooltip-badge {
    background-position: -534px -56px;
}

.assignment-badge-1 .middle-badge,
.assignment-badge-1 .tooltip-badge {
    background-position: -578px -56px;
}

.assignment-badge-102 .middle-badge,
.assignment-badge-102 .tooltip-badge {
    background-position: -664px -56px;
}

.assignment-badge-101 .middle-badge,
.assignment-badge-101 .tooltip-badge {
    background-position: -622px -56px;
}

.assignment-badge-103 .middle-badge,
.assignment-badge-103 .tooltip-badge {
    background-position: -706px -56px;
}

#classmates_badges .badges{
    margin: 0;
}

.badges span{ /* #classmates_badges .badges li span */
    font-weight: normal;
}

/* start of badges page style */
.badges-page h4{
    margin: 30px 0;
}

.badges-page{
    margin-bottom: 35px
}

.row-wrap{
    border-top: 1px solid #9fe1c0;
    padding: 0 100px;
    text-align: center;
}

.badges-type{
    color: #46a879;
    font-size: 14px;
    background: #fff;
    padding: 0 13px;
    display: inline-block;
    margin-top: -9px;
}

.row-wrap .row{
    text-align: center;
    border-bottom: 1px solid #cbcbcb;
    margin-top: 10px;
}

.row-wrap .row:last-child{
    border-bottom: none;
}

.badge-descr{
    width: 220px;
    padding: 146px 12px 42px;
    display: inline-block;
    color: #5c5c5c;
    vertical-align: top;
    margin-right: 10px;
}

.number-of-badges{
    color: #3ca670;
    font-size: 14px;
}

.number-of-badges .quantity{
    width: 26px;
    height: 26px;
    display: inline-block;
    margin-left: 18px;
    line-height: 28px;
    font-size: 13px;
    text-align: center;
    vertical-align: middle;
    color: #fff;
    background: #13678b;
    border-radius: 50%;
}

.badge-descr.assignment-badge-302{
    background: url('../img/assignment-badge-302.png') center 12px no-repeat;
}

.badge-descr.assignment-badge-301{
    background: url('../img/assignment-badge-301.png') center 12px no-repeat;
}

.badge-descr.assignment-badge-401{
    background: url('../img/assignment-badge-401.png') center 12px no-repeat;
}

.badge-descr.assignment-badge-402{
    background: url('../img/assignment-badge-402.png') center 12px no-repeat;
}

.badge-descr.assignment-badge-201{
    background: url('../img/assignment-badge-201.png') center 12px no-repeat;
}

.badge-descr.assignment-badge-202{
    background: url('../img/assignment-badge-202.png') center 12px no-repeat;
}

.badge-descr.assignment-badge-203{
    background: url('../img/assignment-badge-203.png') center 12px no-repeat;
}

.badge-descr.assignment-badge-1{
    background: url('../img/assignment-badge-1.png') center 12px no-repeat;
}

.badge-descr.assignment-badge-2{
    background: url('../img/assignment-badge-2.png') center 12px no-repeat;
}

.badge-descr.assignment-badge-3{
    background: url('../img/assignment-badge-3.png') center 12px no-repeat;
}

.badge-descr.assignment-badge-4{
    background: url('../img/assignment-badge-4.png') center 12px no-repeat;
}

.badge-descr.assignment-badge-5{
    background: url('../img/assignment-badge-5.png') center 12px no-repeat;
    margin: 0 auto;
}

.badge-descr.assignment-badge-101{
    background: url('../img/assignment-badge-101.png') center 12px no-repeat;
}

.badge-descr.assignment-badge-102{
    background: url('../img/assignment-badge-102.png') center 12px no-repeat;
}

.badge-descr.assignment-badge-103{
    background: url('../img/assignment-badge-103.png') center 12px no-repeat;
}

.badge-descr.assignment-badge-501{
    background: url('../img/assignment-badge-501.png') center 12px no-repeat;
}

.badge-descr h3{
    font-size: 18px;
    font-weight: bold;
    color: #13678b;
    margin: 10px 0;
    padding: 0;
}

.fix-h.badge-descr h3 {
    height: 35px;
}

.fix-p.badge-descr p {
    height: 70px;
}


/* end of badges page style */

.receiver{ /* #classmates_badges .badges li .receiver */
    font-size: 12px;
    display: inline-block;
    max-width: 168px;
    color: #656565;
    line-height: 15px;
    vertical-align: top;
}

.receiver b{
    vertical-align: top;
    color: #404040;
}

.receive-time{ /* #classmates_badges .badges li .receive-time */
    font-size: 10px;
    display: block;
    line-height: 18px;
    margin-left: 37px;
    color: #656565;
}

.problem-badge { /* .achievements-list .problem-badge */
    width: 53px;
    height: 63px;
    display: inline-block;
    margin: 0 3px;
    position: relative;
    vertical-align: top;
    background: url('../img/achievements.png') -1px -1px no-repeat;
}

/* start of helper design */

.popover{
    background: none;
    border: none;
    width: auto;
    max-width: 240px;
    box-shadow: none;
    text-align: center;
    -webkit-box-shadow:none;
    box-shadow:none
}

.popover > .arrow{
    width: 40px;
    height: 48px;
    display: block;
    top: -6px;
    background: url('../img/yellow-rarrow.png') center center no-repeat;
    border-style: none;
}

.popover .arrow::after{
    display: none;
}

.popover .popover-content{
    color: #ffe400;
    text-align: center;
    width: 240px;
    font: 16px "Segoe Print",sans-serif;
}

.popover.b-badges-showcase{
    margin-left: -150px;
    margin-top: 40px;
}

.popover.b-badges-showcase .arrow{
    top: -28px!important;
    left: 46%!important;
}

.tour-step-background.b-badges-showcase {
    background: url('../img/badges-showcase-helper.png') #fff center -3px no-repeat;
    height: 50px!important;
}

.popover.b-home-menu{
    margin-top: 62px;
}

.popover.b-home-menu .arrow{
    top: -40px;
}

.tour-step-background.b-home-menu{
    background: transparent;
}

#user_home.tour-step-backdrop,
#user_home.tour-step-backdrop:hover,
#user_home.tour-step-backdrop.open {
    z-index: 1101;
}

#user_home.tour-step-backdrop .home-menu{
    height: 56px!important;
}

#user_home.tour-step-backdrop .home-avatar-border{
    opacity: 0;
}

.popover.b-uploader-container{
    margin-top: -60px;
}

.popover.b-uploader-container .arrow{
    background: url('../img/yellow-bl-arrow.png') center center no-repeat;
    left: 5px;
    top: 110px;
}

.popover.b-classmates-list .arrow{
    top: -31px;
    left: 170px;
}

.popover.b-classmates-badges{
    margin-top: -100px;
}

#classmates_badges.tour-step-backdrop,
.badges.tour-step-backdrop{
    z-index: 999;
}

.popover.b-classmates-badges .arrow{
    background: url('../img/yellow-br-arrow.png') center center no-repeat;
    top: 110px;
    left: 76%;
}

.tour-step-background.b-classmates-badges{
    border-radius: 6px;
    height: 520px !important;
    background: url('../img/class-progress-helper.png') center center no-repeat;
}

.popover.b-assignment-badges{
    margin-top: 132px;
    margin-left: -60px;
}

.popover.b-assignment-badges .arrow{
    background: url('../img/yellow-larrow.png') center center no-repeat;
    top: -34px;
    left: 25%;
}

.tour-step-background.b-assignment-badges{
    width: 129px!important;
    height: 30px!important;
    margin-top: -2px;
    border-radius: 4px;
    background: url('../img/assignmment-list-badges-helper.png') center center no-repeat;
}

.tour-step-background.b-badge-button{
    border-radius: 4px;
    width: 127px!important;
    height: 34px!important;
}

.badge-btn.tour-step-backdrop {
    z-index: 2000!important;
}

.popover.b-badge-button{
    margin-top: 40px;
    margin-left: 40px;
}

.popover.b-badge-button .arrow{
    top: -35px;
    background: url('../img/yellow-larrow.png') center center no-repeat;
}

.popover.b-achievements-desk{
    margin-top: 110px;
    margin-left: -50px;
}

.popover.b-achievements-desk .arrow,
.popover.b-progress-bar .arrow{
    background: url('../img/yellow-larrow.png') center center no-repeat;
    left: 26%;
    top: -28px;
}

.tour-step-background.b-achievements-desk{
    border-radius: 4px;
    background: url('../img/achievments-helper.png') center center no-repeat;
}

.popover.b-progress-bar .arrow{
    top: -32px;
}

.tour-step-background.b-progress-bar{
    padding: 0 10px;
    width: 214px!important;
    height: 120px!important;
    margin: 0 -10px;
    border-radius: 6px;
    padding-top: 10px;
    margin-top: -10px;
    background: url('../img/progress-bar-helper.png') #fff center center no-repeat;
}

.popover.b-progress-bar{
    margin-top: 110px;
    margin-left: -36px;
}

.popover .popover-inner{
    padding-top: 36px;
}

.popover button.tour-next-step{
    background: none;
    color: #FFF;
    font: 16px "Open Sans",sans-serif!important;
    border: none;
    padding-top: 0;
    text-decoration: underline;
}

.popover button.tour-next-step:hover{
    background: none;
}

.popover button.tour-next-step:focus{
    outline: none;
    box-shadow: inset 0 0 0;
}
/* end of helper design */

.popover[role="tooltip"]{
    background: #f9f9f9;
    border: 1px solid #e0dddd;
    box-shadow: 0px 0px 8px rgb(216, 216, 216);
    text-shadow: none;
    width: auto;
    max-width: none;
    min-width: 160px;
    color: #565656;
    padding: 8px 15px;
    text-align: center;
}

.assignment-badge-302 .tooltip-badge,
.assignment-badge-301 .tooltip-badge{
    margin: 0 0 0 -10px;
}

/*common for all tooltip badges*/
.tooltip-badge {
    width: 38px;
    height: 43px;
    margin-right: 5px;
    position: relative;
    display: inline-block;
    background: url('../img/middle-badges.png') -5px -6px no-repeat;
    float: left;
}

.popover[role="tooltip"].fade.top .arrow,
.popover[role="tooltip"].fade.bottom .arrow{
    border-top-color: #e0dddd;
    width: 0;
    height: 0;
    bottom: -11px;
    top: auto;
    background: none;
    border-style: solid;

}

.popover[role="tooltip"] .arrow::after{
    display: block;
}

.popover[role="tooltip"] .popover-title {
    color: #27839f;
    font-size: 15px;
    font-weight: bold;
    padding: 4px 0;
    display: block;
    text-align: left;
    background: none;
    border-bottom: none;
    max-width: 130px;
    float: left;
}

.popover[role="tooltip"] .popover-content{
    width: auto;
    padding: 0 26px 2px;
}

.popover[role="tooltip"] .popover-content a{
    color: #71B4CD;
    font-size: 13px;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: normal;
    text-decoration: underline;
    display: block;
    margin-top:3px;
}

#top_nav_panel {
    height: 105px;
}

.top-badge-wrapper{
    height: 33px;
    width: 100%;
    padding: 0 12px;
    border-bottom: 16px solid #5aa285;
    position: relative;
    margin-top: 0;
}

.top-badge-wrapper .left-part{
    width: 20px;
    height: 14px;
    position: absolute;
    left: 0;
    bottom: -14px;
    background: url('../img/top-badge-dec.png') -15px -6px no-repeat;
}

.top-badge-wrapper .top-badge{
    width: 147px;
    height: 133px;
    margin: 0 auto;
    display: block;
    position: relative;
    top: -60px;
}

.top-badge-wrapper .top-badge.assignment-badge-302{
    background: url('../img/top-badge-302.png') 50% 50% no-repeat;
}

.top-badge-wrapper .top-badge.assignment-badge-301{
    background: url('../img/top-badge-301.png') 50% 50% no-repeat;
}

.top-badge-wrapper .right-part{
    right: 0;
    width: 20px;
    height: 14px;
    position: absolute;
    bottom: -14px;
    background: url('../img/top-badge-dec.png') -108px -6px no-repeat;
}

.special-medal{
    /*width: 65px;*/
    width: 79px;
    height: 81px;
    top: -85px;
    z-index: 5;
    position: absolute;
    left: 11px;
    /*background: url('../img/assignment-badges2.png') -24px 0px no-repeat;*/
    background: url('../img/assignment-badges.png') -24px -1px no-repeat;
}

.special-medal.assignment-badge-1{ /* Silver Medal */
    background-position: -24px center;
}

.special-medal.assignment-badge-2{ /* Gold Medal */
    background-position: -140px center;
}

.special-medal.assignment-badge-3{ /* Silver Star */
    background-position: -256px center;
}

.special-medal.assignment-badge-4{ /* Gold Star */
    background-position: -372px center;
}

.special-medal.assignment-badge-5{ /* Superstar */
    /*background-position: -489px center;*/
    background-position: -481px center;
}

.achievements-list .problem-badge-101 {/* 101 - Triple Play */
    background-position: -60px -1px;
    left:215px;
}

.problem-badge-101.earned{/* 101 - Triple Play */
    background-position: -60px -65px;
    z-index: 3;
}

.achievements-list .earned .quantity{
    display: block;
}

.problem-badge-102 { /* 102 - High Five */
    background-position: -1px -65px;
    left:215px;
}

.problem-badge-102.earned { /* 102 - High Five */
    background-position: -1px -65px;
    z-index: 4;
}

.problem-badge-103.earned{ /* 103 - Problem Solver */
    background-position: -120px -65px;
    width: 53px;
}

.problem-badge-103{
    background-position: -120px -1px;
    z-index:1;
    left:215px;
}

.problem-badge-501.earned{
    background: url('../img/achievements-501.png')  center -65px no-repeat;
}

.problem-badge-501{
    background: url('../img/achievements-501.png')  center -1px no-repeat;
    left: 215px;
    margin-top: -63px;
}

.achievements-list .quantity{
    height: 20px;
    width: 20px;
    border-radius: 50%;
    color: #fff;
    background: #0083a0;
    position: absolute;
    top: 42px;
    left: 29px;
    display: none;
    font: 14px/20px "Oriya Sangam MN", sans-serif;
}

.assignment_header h1 {
	text-shadow: 1px 1px white;
	margin: 7px 0px 5px 0px;
	font-size: 23px;
}

.assignment_menu .header_total {
    background-color: #0288A5;
    color: #FFF;
    font-size: 20px;
    padding: 7px 4px 5px;
    text-align: center;
    border-radius: 4px;
    margin-bottom: 10px;
}

.assignment_menu .score-title {
    font-size: 12px;
    font-weight: normal;
    text-align: center;
    display: block;
}

.assignment_menu .question_number {
	background-color: #C8C8C8;
	border: 1px solid #fff;
	float:left;
    font-weight: normal;
	width: 32px;
    height: 34px;
	line-height: 34px;
	text-align: center;
	cursor: pointer;
	font-size: 13px;
	color: #353534;
}

.assignment_menu .current {
    box-shadow: 0px 0px 0px 1px #2CA7BF;
    z-index: 184;
    position: relative;
    border: 1px solid #2CA7BF;
}

.assignment_menu .correct {
	background-color: #B3DB76;
}

.assignment_menu .incorrect {
	background-color: #BD3804;
}

.assignment_menu .half_credit {
	background-color: #D7ECB7;
}

/* start of notification popups */

.greeting-message {
    display: block;
    top: 30%;
    position: absolute;
    left: 50%;
    margin-left: -274px;
    padding: 25px 20px 20px;
    /*height: 270px;*/
    /*max-width:550px;*/
    max-width:640px;
    box-shadow: 0px 0px 6px #252525;
}

.greeting-ul {
    list-style: disc !important;
}

.greeting-li {
    list-style: disc !important;
}



.tour-backdrop{
    opacity: .5!important;
}

.tour-step-background.b-greeting-message, .popover.b-greeting-message{
    display: none!important;
}

.greeting-message,
.notification-popup{
     background: #fff;
     border-radius: 5px;
     font: 14px "Open Sans",sans-serif;
     position:fixed;
     z-index: 10000;
 }

.notification-popup{
    box-shadow:  0px 0px 10px #989898;
    height: 100px;
    max-width: 620px;
    top: 2%;
    padding: 10px 14px 10px 10px;
}

.greeting-message .message-right-part{
    z-index: 205;
    position: relative;
    margin-left: -5px;
    /*max-width: 280px;*/
    max-width: 370px;
    float: right;
    text-align: left;
}

.notification-popup .notif-right-part{
    max-width: 453px;
    float: right;
    text-align: left;
}

.greeting-message h3{
    color: #83c340;
    font: 23px "Open Sans",sans-serif;
    margin: 0 0 21px;
}

.notification-popup h3{
    font-size: 15px;
    margin: 0 0 6px;
    color: #83c340;
}

.greeting-message p,
.notification-popup p{
    color: #545454;
    margin-bottom: 12px;
}

.notification-popup p{
    font-size: 13px;
    margin-bottom: 4px;
}

.greeting-message a,
.notification-popup a{
    display: block;
    color: #799ac3;
    text-decoration: underline;
}

.notification-popup a{
    font-size: 13px;
    float: right;
}

.greeting-message button{
    background: #83c340;
    padding: 8px 30px;
    font-size: 18px;
    margin-top: 10px;
    color: #fff;
    float: right;
    border: none;
    border-radius: 5px;
}

.notification-popup button{
    color: #4B9FB2;
    background: none;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
    top: -3px;
    right: 11px;
    position: absolute;
    font-size: 27px;
    padding: 0;
    border: none;
}

.greeting-message button:focus,
.notification-popup button:focus{
    outline: none;
}

.greeting-message button:hover{
    background: #76BE2A;
}

#notification_icon{
    width: 53px;
    height: 63px;
    display: inline-block;
    margin: 0 3px;
    position: relative;
    vertical-align: top;
    margin-right: 15px;
}

#notification_icon.assignment-badge-1{
    background: url('../img/notif-assignment-badge-1.png')  center center no-repeat;
}

#notification_icon.assignment-badge-2{
    background: url('../img/notif-assignment-badge-2.png')  center center no-repeat;
}

#notification_icon.assignment-badge-3{
    background: url('../img/notif-assignment-badge-3.png')  center center no-repeat;
}

#notification_icon.assignment-badge-4{
    background: url('../img/notif-assignment-badge-4.png')  center center no-repeat;
}

#notification_icon.assignment-badge-5{
    background: url('../img/notif-assignment-badge-5.png')  center center no-repeat;
}

#notification_icon.assignment-badge-101{
    background: url('../img/achievements.png')  115px -65px;
}

#notification_icon.assignment-badge-102{
    background: url('../img/achievements.png')  -1px -65px;
}

#notification_icon.assignment-badge-103{
    background: url('../img/achievements.png')  56px -65px;
}

#notification_icon.assignment-badge-301{
    background: url('../img/notif-assignment-badge-301.png')  center center no-repeat;
    width: 81px;
}

#notification_icon.assignment-badge-302{
    background: url('../img/notif-assignment-badge-302.png')  center center no-repeat;
    width: 81px;
}

#notification_icon.assignment-badge-401{
    background: url('../img/notif-assignment-badge-401.png')  center center no-repeat;
}

#notification_icon.assignment-badge-402{
    background: url('../img/notif-assignment-badge-402.png')  center center no-repeat;
}


#notification_icon.assignment-badge-201{
    background: url('../img/notif-assignment-badge-201.png')  center center no-repeat;
}

#notification_icon.assignment-badge-202{
    background: url('../img/notif-assignment-badge-202.png')  center center no-repeat;
}

#notification_icon.assignment-badge-203{
    background: url('../img/notif-assignment-badge-203.png')  center center no-repeat;
}

.badges-package{
    float: left;
    position: relative;
    width: 293px;
    height: 315px;
/*    top: -72px;*/
/*    left: -52px;*/
    top: -82px;
    left: -82px;
    margin-right: -60px;
    background: url('../img/greeting-message.png') no-repeat;
}
/* end of notifications popups */

/* start of home page avatar part styling */
#user_home {
    display: inline-block;
    overflow: visible;
    z-index: 1;
    position: relative;
    vertical-align: middle;
    float: right;
    height: 45px;
    margin-top: -9px;
}

.home-avatar-border{
    position: absolute;
    height: 45px;
    width: 0;
    top: 9px;
    border-right: 1px solid rgb(235, 235, 235);
}

.home-menu {
    padding: 7px 8px 5px;
    background: #fff;
    text-align: left;
    display: inline-block;
    vertical-align: middle;
    border-radius: 4px;
    overflow: hidden;
    height: 56px;
    margin: 3px 30px 0 15px;
}

.avatar-wrapper{
    width: 43px;
    height: 43px;
    border-radius: 50%;
    border: 1px solid #87c8da;
    margin-right: 6px;
    display: inline-block;
    vertical-align: middle;
    overflow: hidden;
    background: url("../img/male-avatar.png") no-repeat;
    background-size: 100%;
}

.student-avatars{
    display: inline-block;
    text-align: center;
    margin: 23px 23px 0 0;
    width: 200px;
    padding-top: 10px;
    border: 1px solid rgb(231, 230, 230);
    vertical-align: top;
}

.student-avatars .student-image-wrapper{
    margin-bottom: 10px;
}

.btn-default.primary.approve-avatar{
    margin: 8px 10px 10px 0;
    padding: 6px 25px 6px 25px;
}

#uploader_container .alert{
    font-weight: normal;
    padding: 6px;
    width: 175px;
    font-size: 12px;
    margin: 0 auto;
    margin-bottom: 10px;
}

.student-avatars .avatar-date{
    padding-left: 10px;
    float: left;
    color: rgb(127, 127, 127);
    font-size: 12px;
    font-style: italic;
    margin-bottom: 4px;
    letter-spacing: 1px;
}

.student-name{
    display: block;
}

.avatar-wrapper.female{
    background: url("../img/female-avatar.png") no-repeat;
    background-size: 100%;
}

.open .home-menu{
    -webkit-box-shadow: 0px 0px 8px #B2B1B1;
    -moz-box-shadow: 0px 0px 8px #B2B1B1;
    box-shadow: 0px 0px 8px #B2B1B1;
    border-collapse: separate;
    height: auto;
}

#user_home span{
    padding-right: 25px;
    background: url("../img/avatar-arrows.png") right -13px no-repeat;
    cursor: pointer;
}

#user_home.open span{
    background-position: right -46px;
    cursor: default;
}

#user_home ul{
    margin: 9px 12px 0 9px;
}

#user_home ul li{
    border-top: 1px solid #e5e5e5;
}

#user_home ul li:hover{
    background: #f9f9f9;
}

#user_home ul li a:hover{
    text-decoration: none;
}

#user_home ul li a{
    padding: 8px 6px;
    display: block;
    color: #3691cd;
}
/* end of home page avatar */


/* start of profile page classmates list styling */
#classmates_list{
    margin-top: 20px;
    font-size: 13px;
    width:230px;
}
#classmates_list fieldset {
    min-height: 260px; /*needed for helper*/
}

#classmates_list h4{
    font: 13px "Open Sans",sans-serif;
    color: #438b9f;
    margin: 0 -10px 14px -10px;
    padding: 10px 0 0 12px;
    border-top: 1px solid #bfe0e8;
}

#classmates_list h4:first-of-type{
    border-top: none;
    padding-top: 3px;
}

.avatar-wrapper.small{
    width: 37px;
    height: 37px;
    background: url("../img/male-avatar.png") no-repeat;
    background-size: 100%;
}

.female .avatar-wrapper.small{
    background: url("../img/female-avatar.png") no-repeat;
    background-size: 100%;
}

#classmates_list ul{
   /* padding-bottom: 15px;*/
}

#classmates_list ul li{
    color: #656666;
    margin-bottom: 5px;
    font: 13px "Open Sans",sans-serif;
    font-weight: normal;
}
#classmates_list .classmate{
    display: inline-block;
    vertical-align: middle;
    max-width: 150px;
}

.scroll-arrow{
    height: 13px;
    display: block;
    text-align: center;
}

.scroll-arrow.down{
    background: url("../img/scroll-arrow.png") center -86px no-repeat;
}

.scroll-arrow.up{
    background: url("../img/scroll-arrow.png") center -13px no-repeat;
}

.btn-default.primary{
    padding: 6px 25px 6px 46px;
    border: 1px solid #318fa1;
    background: linear-gradient(#30a7c2 , #21798a);
    background: -webkit-linear-gradient(#30a7c2, #21798a); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#30a7c2, #21798a); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#30a7c2, #21798a);
    color: #f3f6f6;
}

.button-icon{
    width: 12px;
    height: 12px;
    display: inline-block;
    position: relative;
    vertical-align: middle;
}

.button-icon.save{
    background: url('../img/buttons-icons.png') -10px -29px no-repeat;
    margin-right: -36px;
}

#upload-avatar{
    text-align: center;
}

#uploader_container{
    text-align: center;
    padding: 10px 0;
}

#uploader_container.tour-step-backdrop .upload-avatar-button,
#uploader_container.tour-step-backdrop #upload_web_cam a{
    pointer-events: none;
}

#upload_web_cam{
    display: block;
    text-align: center;
    margin-top: 10px;
}

.upload-avatar-button {
    width: 172px !important;
    display: inline-block !important;
    margin-top: 8px !important;
    position: relative !important;
    height: 34px !important;
    overflow: hidden !important;
    background: url("../img/upload-picture.png") center center no-repeat !important;
}

/* start of web cam picture upload dialog */
.ui-dialog.webcam-dialog, .ui-dialog.confirm-reject-avatar {
    padding: 0;
}

.ui-dialog.webcam-dialog .ui-dialog-titlebar,
.ui-dialog.confirm-reject-avatar .ui-dialog-titlebar {
    background: linear-gradient(#30a7c2 , #21798a);
    background: -webkit-linear-gradient(#30a7c2, #21798a);
    background: -o-linear-gradient(#30a7c2, #21798a);
    background: -moz-linear-gradient(#30a7c2, #21798a);
    border: none;
}

.webcam-dialog .ui-dialog-titlebar .ui-dialog-title,
.confirm-reject-avatar .ui-dialog-titlebar .ui-dialog-title {
    color: #fff;
}

.webcam-dialog .button,
.confirm-reject-avatar .button{
    background: linear-gradient(#30a7c2 , #21798a);
    background: -webkit-linear-gradient(#30a7c2, #21798a);
    background: -o-linear-gradient(#30a7c2, #21798a);
    background: -moz-linear-gradient(#30a7c2, #21798a);
    padding: 6px 0px;
    display: inline-block;
    margin-bottom: 5px;
    width: 135px;
    border: 1px solid #318fa1;
    border-radius: 4px;
    -webkit-border-radius: 4px;
}

.webcam-dialog .button a{
    color: #fff;
}

.webcam-dialog #webcam_action_links{
    width: 82%;
}

.webcam-dialog #photo_webcam_container{
    margin-top: 4px;
}
.webcam-dialog #upload_image{
    float: right;
}

.webcam-dialog #fix_image{
    padding: 6px 30px;
    width: auto;
}
/* end of web cam dialog styling */

.form_table td:first-child{
    width: 200px;
}
/* end of classmates styling */

/* start of skill practis page styling */

.skill_practice_header span{
    color: #333;
    border-left: 1px solid #ddd;
    font-weight: bold;
    padding: 8px;
    display: inline-block;
}

.skill_practice_header span:first-child{
    border-left: none;
}

.skill_practice_header {
    border: 1px solid #ddd;
}
.skills-col-2,.skills-col-3{
    float: right;
    width: 124px;
}

.skill_practicing_tree{
    margin-bottom: 45px;
}

.skill_practicing_tree li{
    border: 1px solid #ddd;
    margin-bottom: -1px;
}

.skill_practicing_tree ul li:nth-child(odd) {
    background-color: #f9f9f9;
}

.skill_practicing_tree li .assignment-score,
.skill_practicing_tree li .assignment-status{
    width: 125px;
    border-radius: 0;
    height: auto;
    background: none;
    color: #333;
    padding: 8px;
    margin-right: 0;
    font-weight: normal;
    text-align: center;
    float: right;}

.skill_practicing_tree li .assignment{
    display: block;
    padding: 8px;
}

.skill_practicing_tree li .parent-item{
    padding: 8px;
    display: block;
    color: #428bca;
    font-weight: bold;
    cursor: pointer;
}

.skill_practicing_tree li a:hover{
    text-decoration: underline;
    color: #428bca;
}

.skill_practicing_tree .level-1 .parent-item {
    background: url("../img/skills-practice-arrows.png") 20px 7px no-repeat;
    padding-left: 41px;
}

.skill_practicing_tree .level-1.completed-topic .parent-item {
    background: url("../img/skills-practice-arrows.png") 13px 7px no-repeat;
    padding-left: 34px;
}

.skill_practicing_tree .level-1 .parent-item.expanded {
    background-position: 20px -20px;
}

.skill_practicing_tree .level-1.completed-topic .parent-item.expanded {
    background-position: 13px -20px;
}


.skill_practicing_tree .level-2 .parent-item {
    background: url("../img/skills-practice-arrows.png") 40px 7px no-repeat;
    padding-left: 61px;
}

.skill_practicing_tree .level-2.completed-topic .parent-item {
    background: url("../img/skills-practice-arrows.png") 33px 7px no-repeat;
    padding-left: 54px;
}

.skill_practicing_tree .level-2 .parent-item.expanded {
     background-position: 40px -19px;
 }

.skill_practicing_tree .level-2.completed-topic .parent-item.expanded {
    background-position: 33px -19px;
}

.skill_practicing_tree .level-3 .parent-item {
    background: url("../img/skills-practice-arrows.png") 60px 7px no-repeat;
    padding-left: 81px;
}

.skill_practicing_tree .level-3.completed-topic .parent-item {
    background: url("../img/skills-practice-arrows.png") 53px 7px no-repeat;
    padding-left: 74px;
}

.skill_practicing_tree .level-3 .parent-item.expanded  {
    background-position: 60px -19px;
}

.skill_practicing_tree .level-3.completed-topic .parent-item.expanded  {
    background-position: 53px -19px;
}

.skill_practicing_tree .level-4 .parent-item {
    background: url("../img/skills-practice-arrows.png") 80px 7px no-repeat;
    padding-left: 101px;
}

.skill_practicing_tree .level-4.completed-topic .parent-item {
    background: url("../img/skills-practice-arrows.png") 73px 7px no-repeat;
    padding-left: 94px;
}

.skill_practicing_tree .level-4 .parent-item.expanded  {
    background-position: 80px -19px;
}

.skill_practicing_tree .level-4.completed-topic .parent-item.expanded  {
    background-position: 73px -19px;
}

.skill_practicing_tree .level-5 .parent-item {
     background: url("../img/skills-practice-arrows.png") 100px 7px no-repeat;
     padding-left: 121px;
 }

.skill_practicing_tree .level-5.completed-topic .parent-item {
    background: url("../img/skills-practice-arrows.png") 93px 7px no-repeat;
    padding-left: 114px;
}

.skill_practicing_tree .level-5 .parent-item.expanded  {
    background-position: 100px -19px;
}

.skill_practicing_tree .level-5.completed-topic .parent-item.expanded  {
    background-position: 93px -19px;
}

.skill_practicing_tree .level-2.leaf-topic .assignment{
     padding-left: 76px;
 }

.skill_practicing_tree .level-2.leaf-topic.completed-topic .assignment{
    padding-left: 69px;
}

.skill_practicing_tree .level-3.leaf-topic .assignment{
    padding-left: 96px;
}

.skill_practicing_tree .level-3.leaf-topic.completed-topic .assignment{
    padding-left: 89px;
}


.skill_practicing_tree .level-4.leaf-topic .assignment{
    padding-left: 116px;
}

.skill_practicing_tree .level-4.leaf-topic.completed-topic .assignment{
    padding-left: 109px;
}

.skill_practicing_tree .level-5.leaf-topic .assignment{
    padding-left: 136px;
}

.skill_practicing_tree .level-5.leaf-topic.completed-topic .assignment{
    padding-left: 129px;
}

.count-completed-topics{
   font-size: 12px;
   color: #898888;
   margin-left: 12px;
   font-weight: normal;
}

.skill_practicing_tree .completed-topic .assignment,
.skill_practicing_tree .completed-topic .parent-item{
    border-left: 7px solid rgb(179, 219, 118);
    margin-left: -1px;
    margin-top: -1px;
    padding-top: 9px;
}

.skill_practicing_tree .leaf-topic{
    background: url("../img/skills-practice-borders.png") right center no-repeat;
}

.skill_practicing_tree li .leaf-indent{
    height: 28px;
    width: 25px;
    margin: -4px 0 -4px -34px;
    float: left;
}

.skill_practicing_tree .completed-topic .leaf-indent{
    background: url('../img/small-badges.png') -280px -4px no-repeat;
}
/* end of skill practice page styling */

.question_section {
	padding: 5px;
	max-width: 900px;
}

.question_section .sub_number {
    background-color: black;
    border-radius: 14px;
    color: white;
    display: inline-block;
    font-weight: bold;
    text-align: center;
    width: 20px;
}

.question_section .problem_header {
	background-color: #dedede;
}

.question_section .problem_plain {
	border: 0 !important;
	background-color: #f7f7f7;
}

td.indicator {
	width: 32px;
}

.question_section .correct {
	background-color: #B3DB76;
}

.question_section .incorrect {
	background-color: #BD3804;
}

.question_section .half_credit {
	background-color: #D7ECB7;
}

.question_section .current {
	background-color: #BD3804;
}

.question {
	border: 0 solid white;
	border-left-width: 4px;
	border-right-width: 4px;
}

.current_question {
	border: 6px solid #2CA7BF;
	box-shadow: 0px 7px 10px 8px #fff;
}

.answer {
	width: 100%;
	padding: 5px 0 0 0;
	text-align: right;
	line-height: 1.75;
}

td[id^="m_n_"] {
	width: 32px;
}

.question_section sup, sub {
	line-height: 95%;
}

.question_section sup {
	top: 0;
	vertical-align: 1.2em;
}

.question_section sup.nthroot {
	vertical-align: .75em !important;
}

.question_section, output {
	font-family: "Times New Roman", Times, serif;
	font-size: 16px;
	line-height: 1.8;
}

.question_section sup input {
	vertical-align: .5em;
}

td.fraction-top {
	padding-bottom: 0px !important;
}

td.fraction-bottom {
	padding-top: 0px !important;
}

/*
td.fraction-bottom sup {
	vertical-align: 0.45em !important;
}
*/

.comment_area, .comment_area a,  .question_section .btn{
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;

}

.answer_body>tbody>tr>td {
	padding: 4px;
}

.answer_label {
	 padding: 5px;
}

.answer_body {
	text-align: left;
	display: inline-block;
	padding: 0px 0px 0px 0px;
	vertical-align: text-top;
}

.answer_body input {
	margin-top: 1px;
}

.answer_body_answer {
	display: inline-block;
	font-size: 18px;
	font-weight: bold;
	padding-left: 50px;
	text-indent: -50px;
	vertical-align: text-top;
}

.answer_body_help, .answer_body_help output {
	display: block;
	font-size: small;
	font-style: italic;
	color: gray !important;
	padding: 0;
}

.plain {
	display: inline-block;
    height: 67px;
    width: 400px;
}

.grade_button {
	display: inline-block;
	padding: 0px 12px;
	border: 1px solid #a4a1aa;
	border-radius: 5px;
}

a.inactive{
	visibility: hidden;
}


.grade_icon {
    display: block;
    height: 28px;
    margin: 0px 4px;
    width: 26px;
}

.correct_icon {
    background: url("../img/icons_sprite2.png") no-repeat -52px 2px;
}

.incorrect_icon, .partly_incorrect_icon {
    background: url("../img/icons_sprite2.png") no-repeat -80px 2px;
}

.half_credit_icon{
    background: url("../img/icons_sprite2.png") no-repeat -191px 2px;
}

.pending_icon{
    background: url("../img/icons_sprite2.png") no-repeat -164px 2px;
}

.format_error_icon{
    background: url("../img/warning-24.png") no-repeat 2px 2px;
}

.current_question .partly_incorrect_icon::after, .current_question .format_error_icon::after, .current_question .pending_icon::after {
    background-color: #F7EEE1;
    content: "Teacher will review this answer later";
    font-size: 11px;
    margin: 30px 0 0 -70px;
    position: absolute;
    border: 1px solid #6E3A0D;
    font-family: Arial;
    padding: 3px;
    color: #6E3A0D;
    border-radius: 3px;
    box-shadow: 1px 2px 3px 0px #aaa;
}


.current_question .format_error_icon::after {
    content: "The system could not read the answer.";
}

.current_question .partly_incorrect_icon::after {
    content: "You probably have a mistake in the highlighted field(s).";
}

.example_popup {
	display: none;
	position: absolute;
	background-color: #f0f0e0;
	border: 1px solid #aaa;
	border-radius: 4px;
	padding: 2px 10px 2px 10px;
	cursor: move;
	box-shadow: 0px 1px 7px #999;
	z-index: 10020;
	text-align: left;
	max-width: 900px;
	min-width: 300px;
}

.example_popup td { /* to override bootstrap.min.css */
	width: 0;
	border: 1px solid;
}

.hint_popup {
	display: none;
	position: absolute;
	background-color: #e0f0f0;
	border: 1px solid #aaa;
	border-radius: 4px;
	padding: 2px 10px 2px 10px;
	cursor: move;
	box-shadow: 0px 1px 7px #999;
	z-index: 10020;
	text-align: left;
	max-width: 900px;
	min-width: 300px;
}

.hint_popup td { /* to override bootstrap.min.css */
	width: 0;
	border: 1px solid;
}

.close_button {
    cursor: pointer;
    position: absolute;
    right: -10px;
    top: -10px;
    width: 28px;
    height: 28px;
    background-image: url('../img/close-circle-gray.png');
    background-color: transparent;
    background-size: 28px 28px;
    background-repeat: no-repeat;
}

/**Comment**/

.comment_inline {
    width: 100%;
    /*border-top: 1px solid antiquewhite;*/
    overflow: hidden;
	/*background: floralwhite;*/
}

.comment_area {
	display:none;
	width: 100%;
	border-top: 4px solid #2ca7bf;
	overflow: hidden;
}

.comment_area .button {
	background-color: #ddd;
	border: 1px solid #aaa;
	margin: 8px 0 0 0;
	font-family: inherit;
}

.comment_view {
	display: inline-block ;
}


.comment_dialog {
	border-radius: 4px;
	padding: 0 6px;
	margin: 4px;
	float: left;
	display: none;
	background-color: #eee
}

.comment_warnings {
	float: right;
	padding: 0px 4px;
	margin: 4px 0px;
	background-color: rgb(255, 250, 200);
/*	background-color: #F7CC54;
	border: 1px solid #784008;
	display: none; */
}

.comment{
	float: left;
	padding: 4px;
	margin: 8px;
	color: #444;
	font-style: italic;
}

.comment_area .btn-xs {

}

.comment_text {
	height: 52px;
	width: 450px;
	margin: 8px 16px;
	float: left;
	background-color: white;
	border: 1px solid #ddd;
}

/**Select*/
.select_element {
	border: 1px solid #aaa;
	min-height: 22px;
	padding: 1px 24px 1px 8px;
    background: url("../img/icon-arrow-down.png") no-repeat white;
	background-position: right 1px center;
	background-position-x: right;	/* for Safari */
	background-position-y: center;	/* for Safari */
	background-size: 24px 24px;
	cursor: pointer;
}

.item {
	border: 1px solid #eee;
	border-bottom: 1px dotted #777;
	min-height: 24px;
	padding: 1px 24px 1px 8px;
	cursor: pointer;
}

.element_list {
	display: none;
	position: absolute;
	background: white;
	box-shadow: 1px 2px 3px 0px #aaa;
    z-index   : 2; /*to fix underlying mathuill elements*/
}

.select_wrapper {
	display: inline-block;
	padding: 0px 2px;
}

.switch_warning  {
	padding: 14px;
	background-color: #45963E;
	display: none;
	color: white;
	font-weight: bold;
	border-top: 1px solid #333;
	text-shadow: -1px 1px 2px #333;
	text-align: center;
}

.switch_warning a {
	text-shadow: none;
}

.inactive, .inactive td.fraction-top, .inactive td.sqrt-body, .inactive td.root-body, .inactive td.root-degree, .inactive div.overbar-body, .inactive div.modulus-body {
	cursor: default;
	color: #aaa;
	border-color: #aaa !important;
}

.inactive td.sqrt-sign {
	background-image: url(sqrt_gray.png);
}

.inactive td.root-sign {
	background-image: url(root_gray.png);
}

a.inactive:focus{
	outline-offset: 0 !important;
	outline: none  !important;
	box-shadow: none;
}

a.inactive:hover {
	cursor: default;
	color: #aaa;
	background-color: white;
}

#error_warning {
	display: none;
	background: #FFF;
	color: #E33812;
}

/*toolbar*/

.editor_toolbar {
	position: absolute;
	background-color: #f0f0f0;
	border: 1px solid #aaa;
	border-radius: 4px;
	padding: 12px 10px 2px 10px;
	cursor: move;
	box-shadow: 0px 1px 7px #999;
	z-index: 10018;
    width: 35.2em;
}

.field_type_help {
    vertical-align: top !important;
    padding-right : 5px !important;
}

.field_type_help_more {
    margin-top    : 15px ;
}

.editor_toolbar td.button {
	margin: 4px;
	padding: 2px;
	/*height: 30px;*/
    /*width: 42px;*/
    /*min-width: 42px;*/
	border: 1px solid #aaa;
	background-color: #eee;
	box-shadow: 1px 1px 1px #777;
	border-radius: 4px;
	text-align: center;
	cursor: pointer;
	border: 1px solid #999;
	white-space: nowrap !important;
}

.editor_toolbar table {
	  border-collapse: separate;
}

.editor_toolbar table span {
	cursor: pointer;
	padding-top: 1px !important;
}

.editor_toolbar sup {
	vertical-align: middle !important;
}

.toolbar_legend {
	font-size: 12px;
	padding: 8px 4px 4px 4px;
}

.toolbar_legend span {
	cursor: move;
}

.editor_preview {
	font-size: 14px;
	padding: 2px 2px 2px 8px;
}

.editor_hint {
    font-size: 14px;
    padding: 2px 2px 2px 8px;
    color  : gray;
}

.editor_close_button {
    cursor: pointer;

    /* position */
    position:absolute;
    right   :-0.7em;
    top     :-0.7em;
    width   :2em;
    height  :2em;

    /* image */
    background-image: url('../img/close-circle-gray.png');
    background-color: transparent;
    background-size: 2em 2em;
    background-repeat: no-repeat;
}

/* ------------------------------------------------------
   animation for preview
*/
.editor_preview, #mathquill-command-id  {
    color       : #11f ;
    font-weight : bold ;
    position    : relative ;

    /* Standard syntax */
    /*animation: mathquillPreview 5s;
    animation-iteration-count: infinite;*/

    /* Chrome, Safari, Opera */
    /*-webkit-animation: mathquillPreview 5s;
    -webkit-animation-iteration-count: infinite;*/
}

/* Chrome, Safari, Opera */
@-webkit-keyframes mathquillPreview {
    0%   {color: darkred; left: 0px; }
    50%  {color:     red; left: 5px; }
    100% {color: darkred; left: 0px; }
}

/* Standard syntax */
@keyframes mathquillPreview {
    0%   {color: darkred; left: 0px; }
    50%  {color:     red; left: 5px; }
    100% {color: darkred; left: 0px; }
}
/*  ------------------------------------------------------ */


.editor_preview, .editor_preview span {
	font-size: 15px;
	line-height: 15px;
	white-space: nowrap;
}

/*
.editor_preview sup {
	top: 0;
}
*/

.editor_preview sup span {
	font-size: 13px;
}

input::-ms-clear {
    display: none;
}

/* bootstrap fixes */

a:focus {
  outline: none;
}


/** student view fixes */

.question_section .container {
	width: auto;
}


/** Homework **/

.question_text table {
	border: auto;
	text-align: auto;
}


.fixed_width a{
	width: 128px;
}

/*
table.fraction {
    vertical-align: 0.38em !important;
}
*/

/*fix for jquery ui*/

.ui-dialog-titlebar-close {
  visibility: hidden;
}


output {
	color:#333;
}

.assignment.new {
    font-weight: bold;
}

.assignment.active {
}

.assignment.closed {
    font-style: italic;
}

.assignment.unknown {
}

/* min stuff */
#td_assignment_menu {
    width: 232px;
}

#div_assignment_menu_marging {
    width: 232px;
}

a.assert_ref {
    cursor : default ;
    color  : inherit ;
    text-decoration: none ;
}

#min_logout_panel {
	font-size: 11px;
	padding: 0px 12px;
}

#min_logout_panel a {
	float: right;
}

/* ajaxuploade */
.ax-file-list {
    display:none;
}


.ax-preview {
    max-height: 175px !important;
    max-width: 175px !important;
}

.ax-prev-container {
    width: 175px !important;
    height: 175px !important;
}

/* blocking layer */
.dialog-blocker {
    position: absolute;
    /* position and size are evaluated by JS */
}

.dialog-blocker .blocking-layer {
    background-color: #333;
    -moz-opacity: 0.5;
    opacity: 0.5;
    filter: alpha(opacity = 50);
    height: 100%;
    width: 100%;
    z-index: 2002;
    position: absolute;
}

.dialog-blocker .loader-image {
    background: transparent url('../img/loader.gif') center center no-repeat;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2002;
}

.dialog-action-success, .dialog-action-fail {
    display: none;
}

.ui-widget-overlay {
    background-image: none;
    -moz-opacity: 0.7;
    opacity: .70;
    filter: Alpha(Opacity = 70);
    background-color: #000;
}

.ui-dialog.webcam-dialog .ui-dialog-titlebar-close,
.login-dialog .ui-dialog-titlebar-close,
.zipcode-dialog .ui-dialog-titlebar-close {
    visibility: visible;
}

#webcam_action_links {
    width: 200px;
    margin: 0 auto;
    text-align: center;
}

#photo_webcam_container {
    margin: 25px 38px 10px;
    text-align: center;
    min-height: 260px;
    min-width: 260px;
}

.cam-dialog-blocker .blocking-layer {
    background-color: #fff;
    -moz-opacity: 1;
    opacity: 1;
    filter: alpha(opacity = 100);
}

.cam-dialog-blocker .loader-image {
    background-color: white;
    background-position: center 125px;
}

.student-image-wrapper {
    width: 175px;
    height: 175px;
    overflow: hidden;
    background: url("../img/profile-male-avatar.png") no-repeat;
    margin: 0 auto;
}

.student-image-wrapper.female{
    background: url("../img/profile-female-avatar.png") no-repeat;
}

/* start of media queries */

@media (min-width: 1435px){

    .top-badge-wrapper{
        height: 70px;
    }

    .top-badge-wrapper .top-badge{
        top: -23px;
    }

}

@media (max-width: 1176px){
    .top-badge-wrapper{
        height: 77px;
    }

    .top-badge-wrapper .top-badge{
        top: -16px;
    }
}



@media (min-width: 1176px) and (max-width: 1440px){

    #top_nav_panel {
        height: 157px;
    }

    #badges_showcase ul{
        height: 52px;
        margin-top: 0px;
    }

    #badges_showcase{
        float: right;
        clear: both;
    }

    .popover.b-badges-showcase{
        margin-left: 0;
    }

    #user_home{
        margin-top: 0px;
        height: 52px;
    }

    #user_home.open,
    #user_home:hover{
        z-index: 4;
    }

    .home-menu{
        margin-top: 0px;
    }
}

@media (max-width: 1175px) {

    #top_nav_panel {
        height: 157px;
    }

    #badges_showcase ul {
        height: 52px;
        margin-top: 0px;
    }

    #badges_showcase {
        float: right;
    }

    .popover.b-badges-showcase {
        margin-left: 0;
    }

    #user_home {
        margin-top: 0px;
        height: 52px;
    }

    .home-menu {
        margin-top: 0px;
    }
}
/* end of media */

.earned-half-credit{
    opacity: 0;
}

.skill_practicing_tree .popover {
    cursor: default;
}

.skill_practicing_tree .popover-title {
    cursor: text;
}

/** For completed assignments */
.popover-title {
    font-style: normal;
}

/* ***************************************************
.new-yellow-star {
    background-image : url('../img/yellow-star.png') ;
    background-coor  : transparent ;
    background-repeat: no-repeat;
    background-origin: padding-box;
    background-position: 1px 1px;
}
*************************************************** */

.rsm-em-new {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    color     : #CB6804 ;
    font-size : 10px ;
    font-style: normal ;
    padding   : 0;
    position  : absolute ;
    right     : 2px ;
    top       : -1px ;
}


.rsm-latex-mark.correct-answer,
.select_element.correct-answer {
    border-color: #B3DB76 !important;
}

.rsm-latex-mark.incorrect-answer,
.select_element.incorrect-answer {
    /*border-color: #BD3804 !important;*/
    border-color: rgb(255, 177, 45) !important;
}

.rsm-latex-mark.half-credit-answer,
.select_element.half-credit-answer {
    border-color: #D7ECB7 !important;
}

.rsm-latex-mark.format-error-answer {
    border-color: yellow !important;
}

.rsm-logo-color {
    color: #007EA1;
}

.rsm-pre {
    white-space: pre       !important;
    font-family: monospace !important;
}

.rsm-dbg-html {
    display: none ;
}