/*

	10.03.2025 (07.12.2024)

	

	v1.2

*/







/*	General	*/

.cut-text{

	display: inline-block;

	width: 170px;

	max-width: 95%;

	overflow: hidden;

	white-space: nowrap;

	text-overflow: ellipsis;

}



.ajax-error-msg{

	color: red;

	margin-top: 4px;

}



.hide{

	display: none;	

}



.hide2{

	visibility: hidden;	

}



.center{

	text-align: center;

}



.right{

	text-align: right;

}



.nowrap{

	white-space: nowrap;

}







.chart-box{

	display: block;

	height: 400px;

	width: 800px;	

	box-sizing: border-box;

	margin-top: -25px;

}







/*	Tables	*/

/*

.table-wrap{

	max-width: 100%;

	overflow-x: auto;

}

*/



table .thin-column{

	width: 1%;

	min-width: 70px;

}



td > span{

	vertical-align: top;

}



.tabellen tr:last-child td{

	border-bottom: 1px solid var(--color-light-gray) !important;

}



.wait .table-wrap{

	background-image: url('../images/circle-spinner.svg');

	background-repeat: no-repeat;

	background-position: center top;

}



.wait .table-wrap table{

	opacity: 0.1 !important;

	cursor: wait !important;

}





/*	General	end*/







/*	Links	*/

.school-link,

.school-modal_body p > a{

	text-decoration: none;

	color: #878787;

	transition: 0.25s ease;

	cursor: pointer;

	user-select: none;

}

	.school-link:hover,

	.school-modal_body p > a:hover{

		color: #72ac51;

	}



.school-link__red{

	text-decoration: none;

	color: red;

	transition: 0.25s ease;

	cursor: pointer;

	user-select: none;

}

	.school-link__red:hover{

		opacity: 0.8;

		text-decoration: underline;

	}







.school-x-btn{

	display: inline-block;

	width: 25px;

	height: 25px;

	cursor: pointer;

	border-radius: 14px;

	text-align: center;

	font-weight: 600;

	font-size: 20px;

	line-height: 25px;

	outline: 2px solid #ccc;

	user-select: none;

}

	.school-x-btn:hover{

		color: #ccc;

	}



.school-copy-btn{

	width: 52px;

	height: 47px;
	background-color: #ccc;

	background-image: url('../images/copy_icon.svg');

	background-repeat: no-repeat;

	background-position: center;

	line-height: 0;

	margin: 0;

	padding: 0;

	transition: .3s;

	border-radius: 4px;

	cursor: pointer;

	user-select: none;

	margin-top: -2px;

	margin-bottom: -1px;

}



	.school-copy-btn.active{

		background-color: #72ac51;

	}





	

.button.button--wait,

.button.button--wait:hover{

	color: transparent !important;

	background-image: url('../images/fade-stagger-circles_white.svg');

	background-repeat: no-repeat;

	background-position: center;

	background-color: var(--color-gray) !important;

	cursor: wait !important;

}







/*	temp school menu	*/

.school-menu_left{

	display: inline-block;

	width: 200px;

/*	min-width: 200px;

	width: 100%;*/

}



.school-menu_left > a{

	display: block;

	border:  1px solid #ccc;

	padding: 0.5em;

	margin-bottom: 10px;

	margin-right: 20px;

}

/*	temp school menu end	*/





.school-menu_left li a{

	overflow: hidden;

	white-space: nowrap;

	text-overflow: ellipsis;

}





.school-page article > div:last-child{

	display: inline-block;

/*	width: calc(100% - 200px - 5px);*/

	vertical-align: top;

}





.user-classrooms-box td{

	text-align: right;

}



.user-classrooms-box td:first-child{

	width: 60%;

}







/* Forms	*/

.classroom-form-row{

	position: relative;

	margin: 17px;

}



.classroom-form-row > span:first-child{

	display: block;

	margin-bottom: 5px;

	margin-top: 10px;

}



.classroom-form-row  > .title-wrapper .info-title {

	display: inline-block;

	position: relative;

/*	top: -8px;*/

	top: -1px;

/*	right: 0px;*/

	right: -4px;

	width: 15px;

	height: 15px;

	font-size: 11px;

	line-height: 15px;

}



.classroom-form-row input[type="text"],

.classroom-form-row input[type="password"],

.classroom-form-row input[type="email"],

.classroom-form-row input[type="tel"],

.classroom-form-row input[type="number"],

.classroom-form-row textarea,

.classroom-form-row select{

	width: 100%;

	max-width: 100%;

	margin-bottom: 0;

}





.new-classroom-textarea{

	width: 100%;

/*	resize: none;*/

}



.error-field,

.error-field:hover{

	outline-color: #db4437 !important;

}



.error-field-notice{

	color: #db4437;

/*	font-size: 70%;*/

	margin-bottom: 10px;

}





.school-classroom-page .chosen-container{

/*	display: block;*/

	max-width: var(--field-width-article);

	margin-bottom: 5px;

	margin-right: 18px;

	margin-left: var(--field-border-width);	

	vertical-align: top;

}



.school-modal_body.edit-user-form .chosen-container .chosen-results{

	max-height: 11.6em;

	overflow-y: auto;

}



input[type="text"].locked{

	cursor: not-allowed;

	background-repeat: no-repeat;

	background-position: calc(100% - 6px) center;

	background-image: url('../images/lock.svg');

	background-size: 35px;

}











/* позже сравнить с основным файлом и, возможно, убрать. (start)	*/



/*	Inputs	*/





textarea{

	min-height: 150px;

	padding: 12px 35px 12px 15px !important;

	resize: none;

}













.article__column{

	cursor: pointer;

}



.article__content h2 {

	font-weight: 600;

	color: #1b1b1b;

	font-size: 1.3em;

	line-height: 1.250em;

	margin-bottom: 0.633em;

}











.school-select_inline{

	display: inline-block;

	width: initial;

	-webkit-appearance: auto;

}





/* Index page	*/

/*.school-index-page article{

	display: flex;

}*/

.school-index-page article > div{

	width: 100%;

}

		

		

/*	Classroom page	*/

.classroom-infobar{

	margin-top: 20px;

	margin-bottom: 20px;

}

	

.classroom-infobar > div{

	display: inline-block;

	outline: 0px solid red;

	margin-right: 20px;

}



.classroom-infobar .infobar-icon_counter,

.classroom-infobar .infobar-icon_date,

.classroom-infobar .infobar-icon_settings{

	display: inline-block;

	width: 20px;

	height: 20px;

	background-position: center;

	background-size: contain;

	background-repeat: no-repeat;

	vertical-align: bottom;

	margin-right: 6px;

}



.classroom-infobar .infobar-icon_counter{

	background-image: url('../../../files/images/schools/students.svg');

}

.classroom-infobar .infobar-icon_date{

	background-image: url('../../../files/images/schools/date-created.svg');

}

.classroom-infobar .infobar-icon_settings{

	background-image: url('../../../files/images/schools/settings.svg');

}



.classroom-part{

	margin-bottom: 20px;

}

	.classroom-part:last-child{

		margin-bottom: 0px;

	}





.classroom-part th,

.classroom-part td{

	white-space: nowrap;

}







.students-stat-table tr td:first-child .cut-text{

	width: 105px;

}



/* Sorting icon fix for Students table	*/

.students-stat-table th:nth-child(2){

	min-width: 70px;

}

.students-stat-table th:nth-child(3),

.students-stat-table th:nth-child(6){

	min-width: 115px;

}

.students-stat-table th:nth-child(4){

	min-width: 105px;

}

.students-stat-table th:nth-child(5){

	min-width: 90px;

}



html[lang="id"] .students-stat-table th:nth-child(3){

	min-width: 100px;

}

html[lang="id"] .students-stat-table th:nth-child(4){

	min-width: 110px;

}





html[lang="de"] .students-stat-table th:nth-child(2){

	min-width: 80px;

}

html[lang="de"] .students-stat-table th:nth-child(3){

	min-width: 95px;

}

html[lang="de"] .students-stat-table th:nth-child(4){

    min-width: 125px;

}

html[lang="de"] .students-stat-table th:nth-child(5){

    min-width: 105px;

}



html[lang="es"] .students-stat-table th:nth-child(3){

	min-width: 90px;

}

html[lang="es"] .students-stat-table th:nth-child(4),

html[lang="es"] .students-stat-table th:nth-child(6){

    min-width: 135px;

}



html[lang="fr"] .students-stat-table th:nth-child(3){

    min-width: 90px;

}

html[lang="fr"] .students-stat-table th:nth-child(4){

    min-width: 155px;

}

html[lang="fr"] .students-stat-table th:nth-child(6){

    min-width: 135px;

}



html[lang="ko"] .students-stat-table th:nth-child(3){

    min-width: 85px;

}

html[lang="ko"] .students-stat-table th:nth-child(4){

    min-width: 130px;

}

html[lang="ko"] .students-stat-table th:nth-child(5){

    min-width: 75px;

}

html[lang="ko"] .students-stat-table th:nth-child(6){

    min-width: 90px;

}



html[lang="it"] .students-stat-table th:nth-child(2){

	min-width: 95px;

}

html[lang="it"] .students-stat-table th:nth-child(3){

	min-width: 78px;

}

html[lang="it"] .students-stat-table th:nth-child(4){

	min-width: 117px;

}

html[lang="it"] .students-stat-table th:nth-child(5){

	min-width: 97px;

}

html[lang="it"] .students-stat-table th:nth-child(6){

	min-width: 120px;

}



html[lang="jp"] .students-stat-table th:nth-child(2){

    min-width: 85px;

}

html[lang="jp"] .students-stat-table th:nth-child(4){

    min-width: 140px;

}



html[lang="pl"] .students-stat-table th:nth-child(2){

    min-width: 75px;

}

html[lang="pl"] .students-stat-table th:nth-child(3){

    min-width: 95px;

}

html[lang="pl"] .students-stat-table th:nth-child(4){

    min-width: 135px;

}

html[lang="pl"] .students-stat-table th:nth-child(5){

    min-width: 105px;

}

html[lang="pl"] .students-stat-table th:nth-child(6){

    min-width: 155px;

}



html[lang="pt"] .students-stat-table th:nth-child(3){

    min-width: 95px;

}

html[lang="pt"] .students-stat-table th:nth-child(4){

    min-width: 135px;

}



html[lang="tr"] .students-stat-table th:nth-child(2){

    min-width: 80px;

}

html[lang="tr"] .students-stat-table th:nth-child(3){

    min-width: 105px;

}

html[lang="tr"] .students-stat-table th:nth-child(4){

    min-width: 135px;

}



html[lang="vi"] .students-stat-table th:nth-child(3){

    min-width: 95px;

}

html[lang="vi"] .students-stat-table th:nth-child(4){

    min-width: 125px;

}

html[lang="vi"] .students-stat-table th:nth-child(5){

    min-width: 140px;

}



html[lang="zh-Hans"] .students-stat-table th:nth-child(3){

    min-width: 60px;

}

html[lang="zh-Hans"] .students-stat-table th:nth-child(4),

html[lang="zh-Hans"] .students-stat-table th:nth-child(5){

    min-width: 70px;

}

html[lang="zh-Hans"] .students-stat-table th:nth-child(6){

    min-width: 100px;

}



html[lang="zh-Hant"] .students-stat-table th:nth-child(3){

    min-width: 60px;

}

html[lang="zh-Hant"] .students-stat-table th:nth-child(4),

html[lang="zh-Hant"] .students-stat-table th:nth-child(5){

    min-width: 70px;

}

html[lang="zh-Hant"] .students-stat-table th:nth-child(6){

    min-width: 100px;

}



html[lang="uk"] .students-stat-table th:nth-child(3){

    min-width: 85px;

}

html[lang="uk"] .students-stat-table th:nth-child(4){

    min-width: 115px;

}



html[lang="sv"] .students-stat-table th:nth-child(4){

    min-width: 115px;

}

html[lang="sv"] .students-stat-table th:nth-child(3){

    min-width: 100px;

}



/*	Leaderboard table	*/

.leaderboard-table td .cut-text{

	width: 400px;

	vertical-align: middle;

}



table.tabellen.leaderboard-table.dataTable th.dt-type-numeric.center,

table.tabellen.leaderboard-table.dataTable td.dt-type-numeric.center{

	text-align: center;

}



.leaderboard-table .circle__gold,

.leaderboard-table .circle__silver,

.leaderboard-table .circle__bronze,

.leaderboard-table .circle__avatar{

	display: inline-block;

	width: 24px;

	height: 24px;

	font-weight: bold;

	font-size: 11px;

	border-radius: 50%;

	text-align: center;

	padding-top: 0px;

	margin-top: -2px;

	margin-bottom: -3px;

}



.leaderboard-table .circle__gold{

	color: #b8860b;

	background-color: #ffd700;

	border: 2px solid #b8860b;

}



.leaderboard-table .circle__silver{

	color: #8e8e8e;

	background-color: #dbdad9;

	border: 2px solid #b5b5b5;

}



.leaderboard-table .circle__bronze{

	color: #b8860b;

	background-color: #e3c108;

	border: 2px solid #b58308;

}



.leaderboard-table .circle__avatar{

	width: 38px;

    height: 38px;

	background-color: rgb(229, 229, 229);

	margin-right: 10px;

	overflow: hidden;

	vertical-align: middle;

}



.leaderboard-table .circle__avatar svg{

	width: 120%;

    height: 120%;

    margin-left: -4px;

    margin-top: 3%;

}



.leaderboard-table .circle__avatar img{

	height: 118%;

	margin-left: -2px;

	max-width: initial;	

}



/*

@-moz-document url-prefix() {

	.leaderboard-table .circle__avatar img{

		margin-left: -1px;	

	}

}

*/



.leaderboard-table .circle__avatar .avatar-background{

	display: inline-block;

	height: 100%;

	width: 100%;

}



html[lang="pt"] .profile-page .leaderboard-table td .cut-text,

html[lang="es"] .profile-page .leaderboard-table td .cut-text,

html[lang="it"] .profile-page .leaderboard-table td .cut-text{

	    width: 340px;

}



.subjects-classroom-table td .progress-bar,

.subjects-user-table td .progress-bar{

	margin-top: 4px;

}



.subjects-classroom-table td.left .progress-bar,

.subjects-user-table td.left .progress-bar{

	margin-right: 5px;/**/

}

.subjects-classroom-table td.left .progress-bar__ff-fix{

	margin-top: 5px;

}





/* Fix for Firefox	*/

/*

@-moz-document url-prefix() {

	.subjects-classroom-table tr:nth-child(2) td.left .progress-bar{

		margin-top: 5px;

		outline: 1px solid red;

	}

}

*/



.subjects-classroom-table th:nth-child(2),

.subjects-user-table th:nth-child(2){

	width: 115px;

}



.default__page__content .classroom-part .tabellen{

	display: table;

	width: 100%;

	margin-bottom: 0;

}



.classroom-part .tabellen th.left,

.classroom-part .tabellen td.left{

	text-align: left;

	vertical-align: middle;

}



.classroom-part .tabellen th.right,

.classroom-part .tabellen td.right{

	text-align: right;

}

 

.tabellen th.center,

.tabellen td.center{

	text-align: center;

	vertical-align: middle;

}



.classroom-part .tabellen .subtopic-row{

	background:  #ececec;

	font-weight: 600;

}





.classroom-part .custom-period-box{

    display: inline-block;

    vertical-align: top;

}

.classroom-part .custom-period-box.hide{

	display: none;

}

.classroom-part .custom-period-box input{

	width: 108px;

	margin-left: 5px;

	margin-right: 5px;

	padding: 10px 15px 10px;

	height: 45px;

}

.classroom-part .custom-period-box input:first-child{

	margin-left: 0px;

}





.school-classroom-page .default__page__content h2,

.school-setting-page .default__page__content h2{

	padding-top: 40px;

}





/*	Classrooms page	*/

.school-classrooms-page article > div{

	width: 100%;

}



.school-classrooms-page	.buttons .button{

	margin-right: 10px;

}		

.school-classrooms-page .buttons .button:last-child{

	margin-right: 0px;

}





.school-classrooms-page.guest-user .buttons{

	margin-bottom: 6px;

}	

	

		

/*	Settings page	*/



.school-settings-page article > div{

	width: 100%;

}



.school-settings-page .buttons .button{

	margin-right: 10px;

}		

.school-settings-page .buttons .button:last-child{

	margin-right: 0px;

}



.school-settings-page.guest-user .buttons{

	margin-bottom: 6px;

}	



.settings-column{

	display: flex;

/*	justify-content: space-around;*/

	justify-content: flex-start;

}



.settings-column > span{

/*	margin-left: 10px;*/

	margin-left: 20px;

}

.settings-column > span:first-child{

	margin-left: 0px;

}



.school-setting-page .edit-classroom-form textarea{

	min-height: 3em;

	font-size: var(--font-size-text);

}



.school-setting-page .edit-classroom-form .classroom-form-row:last-child{

	margin-top: 0px;

	margin-bottom: 25px; /* ! this is only for invisible scroll in Chrome */

}



.school-setting-page .settings_classrooms-table tr > td:first-child .cut-text{

/*	width: 250px;*/

	width: 95%;

}







/*	Join page	*/

@media (max-width: 766px) {

	.school-join-page .default__content,

	.school-join-page .content__right .finder,

	.school-join-page .contact__content {

		padding-left: 0px;

		padding-right: 0px;

	}

	

	

	.default__page__content .classroom-part .tabellen,

	.default__page__content .student-part .tabellen{

		display: table;

		width: 100% !important;

	/*	float: left;*/

	}

}



@media (max-width: 600px) {

	.school-join-page .button:nth-child(n+2) {

		margin-top: 0px;

	}

	

	.school-join-page .fld-columns-2 {

		display: flex;

		justify-content: center;

		flex-direction: column;

	}

	

	.school-join-page .fld-columns-2 > .button {

		max-width: 100%;

	}

	

	.school-join-page .fld-columns-2 > .button + .button {

		margin-left: 0;

		margin-top: 15px;

	}

}











/*	Articles	*/

.default__page__content .school-article-body h2{

	padding-top: 40px;

}







/**/

/* PDF boxes */



.pdf-box{

	display: block;

	padding: 30px;

	width: 100%;

	background: white;

/*	position: absolute;

	z-index: 999;

	top: 0;

	left: 0;

	visibility: visible;

*/

}



.pdf-box table{

	border-top: 1px solid #ccc;

	border-bottom: 1px solid #ccc;

	background: #fdfcfc;

	margin-bottom: 50px;

}



.pdf-box th{

	border-bottom: 1px solid #ccc;

	padding: 1em 1em;

	font-weight: bold;

	background-color: #eae9e9;

}



.pdf-box td{

	border-bottom: 1px solid #ccc;

	padding: 0.7em 1em;	

}



.pdf-box h1{

	text-align: center;

	font-size: 23px;

	margin: 20px;	

}  

  

.pdf-box p{

	font-size: 18px;

	margin: 20px;	

}



.pdf-box .pdf-logo{

	text-align: center;

	margin: 20px auto 50px;

}



.pdf-box .pdf-logo img{

	width: 310px;

}

  



/*	Modal blocks	*/

.school-modal_overlay{

	position: fixed;

	inset: 0px;

	background-color: rgba(0, 0, 0, 0.45);

	display: flex;

	justify-content: center;

/*	align-items: center;*/

	align-items: flex-start;

	padding-top: 10%;

	z-index: 100;

}



.school-modal_content{

	position: relative;

	inset: 0px;

	border: 1px solid rgb(204, 204, 204);

	background: rgb(255, 255, 255);

	overflow: visible;

	border-radius: 4px;

	outline: none;

	padding: 0px;

	width: 580px;

	font-size: var(--font-size-text);

/*	color: gray;*/

}



.school-modal_header{

	height: 50px;

	border-bottom: 1px solid #ccc;

	text-align: center;

}



.school-modal_header-text{

	display: inline-block;

	text-align: center;

	font-size: 1em;

	font-weight: 600;

	color: gray;

	border-bottom: 3px solid transparent;

/*	padding: 14px 8px 11px;

	margin-bottom: 0.4em;

*/

	padding: 18px 8px 6px;

}



.school-modal_header-tab{

	padding-top: 14px;

}

.school-modal_header-tab.active,

.school-modal_header-tab:hover{

	border-color: #72ac51;

	cursor: pointer;

}



.school-modal_close{

	display: block;

	width: 17px;

	height: 17px;

	background-repeat: no-repeat;

	background-position: center;

	background-size: cover;

	background-image: url('../../../templates/musicca/images/menu-toggle-close%402x.png');

	float: left;

	cursor: pointer;

	margin: 17px;

	margin-right: -57px;

}

	.school-modal_close:hover{

		opacity: 0.7;

	}



.school-modal_body{

	overflow: auto;

	max-height: 435px;

	overflow-x: hidden;

}

.school-modal_body.parsed-users{

/*	overflow-y: scroll;*/

	overflow-y: auto;

}

.school-modal_body.scroll{

	max-height: 310px;

	overflow-y: scroll;

}



.school-modal_body p{

/*	line-height: 1.3em;*/

	line-height: 24px;

	color: #1b1b1b;

}



.school-modal_body h3{

	font-weight: 600;

/*	margin-bottom: 0.7em;*/

	margin-bottom: 0.4em;

}



.school-modal_body h3 > span{

	font-weight: 400;

	display: inline-block;

	margin-left: 0.5em;

}



.school-modal_body textarea{

	width: calc(100% - var(--field-border-width)*2);

}





.school-modal_body .chosen-container{

	max-width: 100%;

	margin-bottom: 0px;

}



.school-modal_body .styled__input__label{

	font-size: var(--font-size-text);

}







.classroom-link-box{

	display: flex;

	justify-content: space-between;

	align-items: center;

/*	padding: 1em 0;*/

	padding: 5px 0 15px;

	border-radius: 4px;

}



.classroom-link-box > input[type=text]{

/*

	margin-right: 20px;

	background-color: #e8f0fe;*/

	margin-right: 10px;

	margin-left: 2px;

	font-size: var(--font-size-text);

}

.classroom-link-box > input[type=text].active{

	color: var(--color-green);

}







.modal-notifications{

	position: absolute;

	top: 100px;

	display: flex;

	width: 100%;

	opacity: 1;

	transition: 0.25s ease;

}



.modal-notifications.hide{

/*	display: none;*/

	opacity: 0;

	top: 60px;

}



.modal-notifications > div{

	background-color: #e8f5e9;

	border: 1px solid #0f9d58;

	border-radius: 4px;

	color: #0f9d58;

	font-size: 15px;

	padding: 10px;

	margin: 0 auto;

}





.school-modal_footer{

	border-top: 1px solid #ccc;

	text-align: right;

/*	padding: 1.1em; */

	padding: 17px;

	display: flex;

	justify-content: space-between;

}



.school-modal_footer.right{

	justify-content: flex-end;

}



.school-modal_footer .button{

	margin-left: 10px;

}

.school-modal_footer .button:first-child{

	margin-left: 0px;

}



.school-modal_footer .button-wrap__center{

	width: 90%;

	text-align: left;

	padding-left: 16px;

}





 

.adduser-form_box{

	padding: 17px;

}



.adduser-form_row{

	display: flex;

	justify-content: space-between;

	align-items: center;

	margin-bottom: 10px;

}



.adduser-form_row > div{

	text-align: left;

	width: 50%;

}

.adduser-form_row > div:first-child{

	margin-right: -10px;

}

.adduser-form_row > div:last-child{

	text-align: left;

	width: 25px;

	margin-left: -13px;

}



.adduser-form_username input[type="text"],

.adduser-form_email input[type="text"]{



	width: 90%;

	vertical-align: middle;

	display: inline-block;

}







.locked .adduser-form_username input{

	cursor: not-allowed;

	color: #ccc;

}






.locked .adduser-form_username input + span{

	display: inline-block;

	width: 35px;

	height: 35px;

	background-repeat: no-repeat;

	background-position: right center;

	background-image: url('../images/lock.svg');

	background-size: contain;

	margin-left: -45px;

	vertical-align: middle;

	cursor: not-allowed;

}









/*	Fixes for JqueryTable	*/

table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order{

	display: none;

	right: 0px;

	

}

table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order,

table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order{

	display: block;

}



table.dataTable thead > tr > th.dt-orderable-asc,

table.dataTable thead > tr > th.dt-orderable-desc{

	padding-right: 10px;

	padding-left: 10px;

}



table.dataTable thead > tr > th.left.dt-ordering-asc span.dt-column-order::before,

table.dataTable thead > tr > th.left.dt-ordering-desc span.dt-column-order::after{

	opacity: 0.7;

	top: 15px;

}



table.dataTable thead > tr > th.right.dt-ordering-asc span.dt-column-order::before,

table.dataTable thead > tr > th.right.dt-ordering-desc span.dt-column-order::after{

	opacity: 0.7;

	top: 6px;

}



table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order::before,

table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order::after{

	opacity: 0;

}





table.dataTable thead > tr > th.dt-orderable-asc:hover,

table.dataTable thead > tr > th.dt-orderable-desc:hover,

table.dataTable thead > tr > td.dt-orderable-asc:hover,

table.dataTable thead > tr > td.dt-orderable-desc:hover {

	outline: 0;

	background: var(--color-gray);/*rgba(0, 0, 0, 0.05)*/

}





div.dt-container div.dt-layout-cell {

	padding: 0;

}





table.tabellen.dataTable > thead > tr > th,

table.tabellen.dataTable > thead > tr > td{

	border-bottom: 1px solid #E0DEDE;

}





/*----------------------*/





/* td-fix */



.classroom-part table.tabellen.dataTable thead > tr > th.left.dt-ordering-asc,

.classroom-part table.tabellen.dataTable thead > tr > th.left.dt-ordering-desc{

	padding-right: 5px;

	padding-left: 10px;

	min-width: 90px;

}

.classroom-part table.tabellen.dataTable thead > tr > th.dt-ordering-asc > span,

.classroom-part table.tabellen.dataTable thead > tr > th.dt-ordering-desc > span{

	display: block;

	position: relative;

}



.classroom-part table.tabellen.dataTable thead > tr > th.left.dt-ordering-asc > span.dt-column-order,

.classroom-part table.tabellen.dataTable thead > tr > th.left.dt-ordering-desc > span.dt-column-order{

	top: -9px;

}



.classroom-part table.tabellen.dataTable thead > tr > th.right.dt-ordering-desc > span.dt-column-order{

	top: -1px;

}



.classroom-part .tabellen th > span:first-child,

.classroom-part .tabellen th.left > span:first-child{

	float: left;

}



.classroom-part .tabellen th.center > span:first-child{

	float: none;

}



.classroom-part .tabellen th > span.dt-column-order,

.classroom-part .tabellen th.left > span.dt-column-order{

	float: right;

}



.classroom-part .tabellen th.right > span:first-child{

	float: right;

}



.classroom-part table.tabellen.settings_students-table th:nth-child(2),

.classroom-part table.tabellen.settings_students-table th:nth-child(3){

	width: 1%;

}



@media (min-width: 1006px) {

	.classroom-part .tabellen th.right > span:first-child{

		padding-left: 0px;

	}

	.classroom-part table.tabellen.dataTable thead > tr > th.right.dt-ordering-asc,

	.classroom-part table.tabellen.dataTable thead > tr > th.right.dt-ordering-desc{

		padding-left: 3px;

	}	

}



@media (max-width: 1005px) {

	.classroom-part table.tabellen.dataTable thead > tr > th.right.dt-ordering-asc,

	.classroom-part table.tabellen.dataTable thead > tr > th.right.dt-ordering-desc{

		padding-left: 3px;

	}

}



.classroom-part .tabellen th.right > span.dt-column-order{

	float: left;

}









.progress-bar{

	display: inline-block;
	width: 50px;

	height: 10px;

	background: #ccc;

	border-radius: 5px;



	overflow: hidden;

}



.progress-bar > span{

	display: block;

	position: relative;

	width: 10%;

	height: 100%;

	background: #72ac51;

}







/*	Fixes for Datepicker	*/

.ui-datepicker *{

	font-family: var(--font-family);

	font-size: var(--font-size-text);

}



.ui-widget.ui-widget-content{

	outline: var(--field-border-width) var(--field-border-style) var(--color-gray);

	border-radius: var(--border-radius);

	border: 0;

	background: var(--color-white);

	line-height: 1.375em;

	color: #333;

}

  

.ui-widget-header {

	background: var(--color-light-gray);

	border: 0;

}



.ui-datepicker-prev.ui-state-hover,

.ui-datepicker-next.ui-state-hover{



}



.ui-state-default,

.ui-widget-content .ui-state-default,

.ui-widget-header .ui-state-default,

.ui-button,

html .ui-button.ui-state-disabled:hover,

html .ui-button.ui-state-disabled:active {

  border: 1px solid #d4ccb0;

  background: #fafaf4 url("images/ui-bg_highlight-hard_100_fafaf4_1x100.png") 50% 50% repeat-x;

  font-weight: bold;

  color: #459e00;

}



.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active,

.ui-button.ui-state-active:hover {

  border: 1px solid #327E04;

  background: #459e00 url("images/ui-bg_highlight-hard_15_459e00_1x100.png") 50% 50% repeat-x;

  font-weight: bold;

  color: #fff;

}





/*	Fix for Chosen select	*/

.up .chosen-container .chosen-drop {

	top: calc( (100% + 177px)*-1 ) !important;

	margin-top: 1px;

}





.up .chosen-container.chosen-with-drop .chosen-drop {

	border-radius: var(--border-radius) var(--border-radius) 0 0;

}

.up .chosen-container-active.chosen-with-drop .chosen-single {

	outline-width: 2px;

	outline-style: solid;

	outline-color: var(--color-dark-gray-2);

	border: 0 !important;

	border-radius: 0 0 var(--border-radius) var(--border-radius);

/*	padding-top: 5px;*/

}







/*	Buttons group	*/

.ui-btn-group .ui-button{

	border-top-width: var(--field-border-width);

	border-bottom-width: var(--field-border-width);

	border-left-width: 1px;

	border-right-width: 1px;

	border-style: solid;

	border-color: var(--color-gray);

	background: white;

	color: gray;

	border-radius: 0;

	font-weight: 400;

	margin: 0 -2px;

	font-family: var(--font-size-text);

	font-size: 13px;

	padding: 0.4em 0.6em;

}



.ui-btn-group .ui-button:hover,

.ui-btn-group .ui-state-active,

.ui-btn-group .ui-widget-content .ui-state-active,

.ui-btn-group .ui-widget-header .ui-state-active,

.ui-btn-group a.ui-button:active,

.ui-btn-group .ui-button:active,

.ui-btn-group .ui-button.ui-state-active:hover {

	border-top-width: var(--field-border-width);

	border-bottom-width: var(--field-border-width);

	border-left-width: 1px;

	border-right-width: 1px;

	border-color: #47752d;

	color: white;

	background: #47752d;

	font-weight: 400;

}





.ui-btn-group label.ui-button:first-child{

	border-radius: var(--border-radius) 0 0  var(--border-radius);

	border-right-width: 0 !important;

	border-left-width: var(--field-border-width) !important;

}

.ui-btn-group label.ui-button:last-child{

	border-radius: 0 var(--border-radius) var(--border-radius) 0;

	border-left-width: 0 !important;

	border-right-width: var(--field-border-width) !important;

}







/*	Media query	*/





@media (max-width: 1005px) {

	.greybg .content__right.col-9-m.col-greybg{

		background: white;

	}

}



@media (max-width: 767px) OR (max-height: 600px) {
	.school-modal_overlay{
		padding-top: 25px;

	/*	z-index: 999;*/ /*tooltip*/

		z-index: 100;

	}
}

@media (max-width: 767px) {

/*	html{

		overflow: hidden;

	}

*/	
	.leaderboard-table td .cut-text{

		width: 380px;

	}

}



@media (max-width: 600px) {

	.table-wrap{

		max-width: 100%;

		overflow-x: auto;

	}



	.school-modal_content{

		width: 100%;

	/*	min-width: 450px;*/

		min-width: 360px;

	}

	

	.leaderboard-table td .cut-text{

		width: 280px;

	}

	

	/* Hide tooltips */

	.opentip-container{

		display: none !important;

	}

}	





@media (max-width: 450px) {

	

	.school-modal_overlay{

		padding-top: 0px;

	}



	.school-modal_footer {

		display: block;

	}

	

	.school-modal_footer .button{

		display: block !important;

    	width: 100% !important;

		margin-left: auto;

		margin-right: auto;

		margin-bottom: 10px;

	}

	

	.school-modal_footer .button-wrap__center{

		padding: 0;

	}

	

	.school-x-btn{

		margin-left: 5px;

	}

}





@media (max-width: 400px) {

	.classroom-infobar > div {

		display: block;

		width: 100%;

		margin-bottom: 10px;

	}

	

	.leaderboard-table td .cut-text{

		width: 150px;

	}

}









.switcher{

	border: 1px solid #ebebeb;

	border-radius: 15px;

	width: 90px;

	height: 30px;

}



.switcher label{

	background: red;

	border-radius: 15px;

	width: 40px;

	height: 30px;

	display: inline-block;

}



.switcher input{

	visibility: hidden;

}



.switcher label:focus{

	background: green;

}









/*--------------------------------------------*/

/* ИЗМЕНЕНИЯ ДЛЯ screen.css	*/





/*	#1 убрать это правило из screen.css 

input[type="submit"]{

	padding: 15px;

}

и после этого убрать следующее правило (оно сейчас только для "компенсации"):

*/

input[type="submit"]{

	padding-left: 1.786em !important;

	padding-right: 1.786em !important;

}





/*	#2 возможно заменить эти правила из screen.css 

.login_buttons {

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

  }

  .login_buttons > .button {

    flex-basis: 45%;

    max-width: 270px;

  }

 .login_buttons > .button + .button {

    margin-left: 15px;

    margin-top: 0;

  }  

на следующее правило (более универсальное) и обновить соответствующие страницы:

*/

.fld-columns-2{

	display: flex;

	justify-content: center;

}

.fld-columns-2 > .button {

	flex-basis: 45%;

	max-width: 270px;

}

.fld-columns-2 > .button + .button {

	margin-left: 15px;

	margin-top: 0;

}



/*	#3 следующие правила */

.button{

	font-size: 0.875em;

} 

.button {

	padding: 1em 1.786em;

	height: 42px;

}

.button:hover{

	background-color: #47752d;

    text-decoration: none !important;

}



/*  попробовать заменить на (только без !important)*/

.button{

	height: 42px;

	font-size: 0.938em !important;

/*	padding-top: 0.875em !important;*/

/*	padding-top: 0.955em !important;*/

	padding-top: 0.9em !important;

	padding-bottom: 1em !important;

	padding-left: 1.786em !important;

	padding-right: 1.786em !important;

}

.button:hover{

	background-color: #47752d;

    text-decoration: none !important;

    color: #fff !important;

}

  



/*	#4	новые  правила, добавить в screen.css	*/

.button.button--gray{

	background-color: gray;

}

	.button.button--gray:hover{

		background-color: #484848;

	}



.button.button--inactive{

	cursor: not-allowed;

	background-color: #ccc;

	user-select: none;

}

	.button.button--inactive:hover{

		cursor: not-allowed;

		background-color: #ccc;

	}



.button.button--white{

	background-color: white;

	border: 1px solid #72ac51;

	color: #72ac51;

	padding-top: 0.875em;

	font-size: 14px;

}

	.button.button--white:hover{

		background-color: #72ac51;

		border: 1px solid #72ac51;

		color: white;

	}

	

	

	

/*	#5 след. три правила добавить к аналогичным для <OL>*/

.contentlist ul.menulist {

	color: #999999;

	margin-left: 34px;

	margin-top: 4px;

	padding-bottom: 0em;

	list-style-type: disc;

	list-style-position: outside;

}

.default__page__content ul.menulist a {

	color: #1b1b1b;

	font-weight: 400;

	padding: 4px 0;

	display: inline-block;

	transition: 0.25s ease;

	text-decoration: none;

}

	.default__page__content ul.menulist a:hover {

		color: #72ac51;

	}



/* позже сравнить с основным файлом и, возможно, убрать. (end)	*/















/* Возможно, заменить в основном файле*/	

@media (max-width: 450px) {

	.button {

		display: block !important;

		width: 100% !important;

	}

	.button:nth-child(n+2) {

		margin-top: 10px;

	}

}



/* Fix for Safari */

@media not all and (min-resolution: 0.001dpcm) {

{

	.school-x-btn{

		padding-left: 1px;	

	}



	.leaderboard-table .circle__gold,

	.leaderboard-table .circle__silver,

	.leaderboard-table .circle__bronze {

		padding-top: 1px;

		padding-left: 1px;

	}

}