@charset "utf-8";
* {
	font-family: "Montserrat-Medium";
}
.gram-tren .container{
	text-align: center;
}
.Rule-gt{
	padding: 6px;
    text-align: left;
    border: 2px dashed gray;
    border-radius: 12px;
}
.Rule-gt::before {
	content: "Правило: ";
	font-size: 16px;
	font-weight: 600;
	color: #F5785D;
}
.Example-gt{
/*	padding-bottom: 10px;
	margin-top: 10px;*/
}
.gram-tren textarea, .intro-test textarea {
	margin-top: 0;
	margin-bottom: -6px;
	height: 38px;
	outline: none;
	resize: none;
	font-size: 24px;
}
.ExtraText-gt, .Text-gt, .Word-gt{
	font-size: 20px;
}
.ExtraTextTransl-gt, .Translate-gt {
	font-size: 20px;
	font-style: italic;
}
.Translate-gt {
	margin-top: 5px;
	min-height: 30px;
	line-height: 1.2;
}
.gram-tren .word-input[placeholder], .intro-test .word-input[placeholder] {
    text-align: center;
    color: #4e657c;
    font-style: normal;
    padding: 0px 0px;
    font-size: 22px;
    /*margin-bottom: -12px;*/
    margin: 0 -7px -12px -7px;
    font-weight: 600;
}
.gram-tren .like {
	margin: 20px auto;
}
.gram-tren .Answer-gt {
	padding: 13px;
	background: #d7e4f5;
	margin: 30px 12% 20px;
	border: 4px solid #d6d5d5;
	border-radius: 10px;
	border-top: 1px solid #d6d5d5;
	font-size: 20px;
	color: black;
}
.gram-tren .Answer-gt span {
	font-size: 24px;
    color: #029720;
    font-weight: 600;
}
.block-rule {
	margin: 10px auto;
	width: 90%;
	max-height: 30vh;
	font-size: 14px;
	text-align: left;
	overflow: auto;
}
.gram-tren .like img {
	height: 40px;
}
.FalseSelect-gt, .RightSelect-gt:not(.intro-test) {
	/*display:inline;*/
	font-size: 18px;
}
.intro-test ul.selection li {
    width: auto;
	font-size: 18px;
}
.gram-tren .emptyBtn::after{
	content:"-";
	padding: 10px 5px;		
}
.Example-gt, .ExtraTextTransl-gt, .Translate-gt {
	font-style: italic; 	
}
.ShotRule-gt{
    margin: 10px 12% 20px;
    border: 2px solid #d6d5d5;
    border-radius: 10px;
	padding: 10px;
}
	
.btn.btn-success, .btn.btn-danger {
	margin: 10px 0;
    font-size: 20px;
}
/*.gram-tren ul.selection li, .intro-test ul.selection li {
    line-height: 45px;
}*/
.no-nav{
	width: 100%;
    background-color: #EEEEEE;
	height: 60px;
	/*position: fixed;*/
	z-index: 999;
}
.no-nav .container{
    line-height: 56px;
}
.listing-gt h3 {
	color: #2F80ED;
}

h3, h4, h5, .button-nav, .button-nav-left, .button-text, .button-nav-right {
	font-family: "Montserrat-SemiBold";
	line-height: 20px;
	text-align: center;
}

.button-nav, .button-nav-left, .button-text, .button-nav-right {
	font-family: "Montserrat-SemiBold";
	color: #333;
}
.listing-gt h3, .listing-gt h4, .listing-gt h5{
	font-family: "Montserrat-SemiBold";
	line-height: 20px;
}
.listing-gt .acd-des{
     padding: 0;
}
.button-nav-container{
    margin: 10px 0 10px;
}
.button-nav, .button-text{
    cursor: pointer;
    margin: 5px;
    border-radius: 6px;
    letter-spacing: 1px;
    font-weight: 600;
    display: inline;
	font-size: 16px;
    padding: 4px;
	line-height: 36px;
}
.button-text{
	background: white;
}
.button-nav{
    border: 1px #808080 solid;
    font-size: 20px;
}
.button-nav-blue	{
    background-color: #56CCF2;
}
.button-nav-corall	{
    background-color: #F5785D;
}
.button-nav-green 	{
    background-color: #50C581;
}
.button-nav-blue:hover	{
    background-color: #41a4c4;
}
.button-nav-corall:hover	{
    background-color: #c95d46;
}
.button-nav-green:hover 	{
    background-color: #3c9a64;
}
.button-text a, .button-nav a {
    white-space: nowrap;
}
.button-text-blue a	{
    color: #56CCF2;
}
.button-text-corall a	{
    color: #F5785D;
}
.button-text-green a 	{
    color: #50C581;
}
.button-text-blue{
	border: 2px solid #56CCF2;
}
.button-text-corall{
	border: 2px solid #F5785D;
}
.button-text-green{
	border: 2px solid #50C581;
}
.button-nav-blue a, .button-nav-green a, .button-nav-corall a{
    color: #FFF;
}
/*.button-nav-blue .active, .button-nav-green .active, .button-nav-corall .active{
    border: 2px #333333 solid;
	cursor: none;
}*/

.button-nav.active{
    border-bottom: 5px #5c5c5c solid;
}
.button-text:hover{
	background: #f9f9f9;
	border-bottom: 3px #666 solid;
}
.button-nav-left{
	cursor: pointer;
	position:absolute;
	top: 14px;
	font-weight:600;
}
.button-nav-right{
	cursor: pointer;
	display: inline;
	font-weight:600;
	margin-left: 20px;
	border: 1px #dddddd solid;
    border-radius: 20px;
    padding: 6px;
    background: white;
}
.list-block {
    margin-bottom: 10px;
	padding-top: 5px;
}
.listing-gt .list-block:nth-child(odd){
  	background: #f4f4f4;
	border-bottom: 2px dashed #CCC;
    border-top: 2px dashed #CCC;
}
.list-element{
    padding: 5px;
}
/*.font-level{
	font-size: 18px;
	color: #be0017;
    font-weight: 600;
	background: white;
	border: 1px dddddd solid;
    border-radius: 20px;
    padding: 6px;
}*/
.font-level, .font-level-add{
	font-weight: 600;
	font-size: 16px;
	color: #be0017;
	background: #fff;
	border: 2px #c2c2c2 solid;
	padding: 2px 6px;
	border-radius: 6px;
	cursor: pointer;
}
.font-level{
	opacity: .5;
}
.font-level-add{
	opacity: 1;
}
.font-level.position-absolute {
	bottom: 1px;
	right: 14px;
}
/*выпадающий список*/
.submenu{
	position: absolute;
	top: 25px;
	left: -12px;
	background: #eee;
	/*border:#999 thin solid;*/
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	width: 216px;
	line-height: 50px;
	border-top: none;
	padding: 5px 3px;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s ease-in-out;
	-o-transition: 0.3s ease-in-out;
	transition: 0.3s ease-in-out;
}
.submenu {transform: scaleY(0);}
.topmenu:hover .submenu {transform: scaleY(1);}
.submenu {transform-origin: 0 0;}

.modal .Rule-gt:before {
    content: "§";
	padding-right: 10px;
	color: #be0017;
}
.modal h4.Rule-gt{
	line-height: 26px;
}
.gram-tren .progressLabel{
	margin-top: -25px;
}
@media (min-width: 1220px) {
.no-nav{
	width: inherit;
}
}
@media (max-width: 1290px) {
.btn.btn-success, .btn.btn-danger  {
	margin: 10px 0;
	font-size: 22px;
}
.gram-tren .Answer-gt {
	padding: 5px;
	margin: 10px 12% 20px;
	font-size: 20px;
}
}
@media (max-width: 1199.98px) {
.btn.btn-success, .btn.btn-danger  {
	padding: 3px 10px;
	font-size: 22px;
}
}
@media (max-width: 991.98px){
}

@media(max-width:767.98px) {
.block-rule {
    width: 90%;
}	
.container {
	width: 100%;
	padding-right: 10px;
	padding-left: 10px;
}
.gram-tren .Answer-gt {
	margin: 0;
	font-size: 18px;
}
.gram-tren .Answer-gt span {
	font-size: 20px;
}
.btn.btn-success, .btn.btn-danger  {
	margin: 5px 0;
}
.gram-tren textarea{
	min-height: 30px;
}
.button-nav, .button-text {
    font-size: 14px;
    padding: 2px 3px;
    margin: 1px 0;
	letter-spacing: 0;
	line-height: 28px;
}
.button-nav, .button-text {
    font-size: 14px;
    padding: 2px 3px;
    margin: 1px 3px;
	letter-spacing: 0;
	line-height: 28px;
}
.button-nav-right{
	font-size:14px;
	margin-left: 10px;
}
.font-level{
	font-size: 14px;
}
.button-nav-container {
    margin: 0;
}
.submenu {
    width: 170px;
    line-height: 40px;
	left: -55px;
}

}
@media(max-width:435px) {
.ExtraText-gt, .Text-gt, .Word-gt {
	font-size: 20px;
	min-height: 32px;
}
.Text-gt{
	line-height: 27px;
}
.ExtraTextTransl-gt {
	margin: -5px;
}
.btn.btn-success, .btn.btn-danger  {
	font-size: 20px;
}
.gram-tren .like img {
	height: 30px;
}
.gram-tren .word-input[placeholder] {
    padding: 5px;
	font-size: 18px;
	margin: 6px -7px -12px -7px;
}
.gram-tren textarea{
	font-size: 18px;
	min-height: 32px;
}
.col-10 {
    padding-right: 5px;
    padding-left: 15px;
}
.list-block {
    margin-bottom: 0;
	padding-top: 0;
}
.listing-gt h5 {
	font-size: 16px;

}
.FalseSelect-gt, .RightSelect-gt {
	font-size: 16px;
}

}

@font-face {
font-family: "Montserrat-Bold";
src: url("../fonts/Montserrat/Montserrat-Bold.ade91f473255.ttf")  format("truetype");
font-style: normal;
font-weight: normal;
}
@font-face {
font-family: "Montserrat-Medium";
src: url("../fonts/Montserrat/Montserrat-Medium.c8b6e083af3f.ttf")  format("truetype");
font-style: normal;
font-weight: normal;
}
@font-face {
font-family: "Montserrat-SemiBold";
src: url("../fonts/Montserrat/Montserrat-SemiBold.c641dbee1d75.ttf")  format("truetype");
font-style: normal;
font-weight: normal;
}
