@font-face {
  font-family: 'Mulish';
  src: url('/fonts/mulish/Mulish-VariableFont_wght.woff2') format('woff2');
  font-weight: 100 1000;
  font-style: normal;
  font-display: swap;  
}

@font-face {
  font-family: 'Mulish';
  src: url('/fonts/mulish/Mulish-Italic-VariableFont_wght.woff2') format('woff2');
  font-weight: 100 1000;
  font-style: italic;
  font-display: swap;
}

:root {
  --primary-btn-main-bg-color: #24a3e3;
  --primary-btn-hover-bg-color: #1a74a1;
  --pills-hover-bg-color: #3a7d9e;
  --scrollbar-bg-color: #24a3e370;

    --custom-main-color: #24a3e3;
    --custom-main-hover-color: #1a74a1;
    --custom-background-color: #3D3E3F;
    --custom-inputs-background-color: #fff;
    --custom-regular-text-color: #fff;
    --custom-header-links-color: #fff;
    --custom-header-links-hover-color: #24a3e3;
    --custom-btn-text-color: #fff;
}

html
{   
    margin: 0;
    height: 100%;
}

body
{   
    margin: 0;   
    height: 100%;
    font-family: 'Mulish', sans-serif;   
}


th {
    font-weight: 600;
}


#content {
    height: 100%;
}

.navbar-light .navbar-nav .nav-link {
    color: #fff;
}

.navbar-light .navbar-nav .nav-link:focus {
    color: #fff;
}

.navbar-light .navbar-nav .nav-link:hover {   
    color: var(--primary-btn-main-bg-color);
}

.navbar-light .navbar-nav .nav-link.last-nav
{
   margin-right: 0px;
   padding-right: 0px;
}

.navbar-light .navbar-toggler {
   border-color: #3D3E3F;  
}

.navbar-light .navbar-toggler[aria-expanded="true"] {
   border: 1px solid #fff;  
}

.navbar-light .navbar-toggler:focus {       
    -webkit-box-shadow: none;       
        box-shadow: none;
    
}

.navbar-light .navbar-toggler-icon {   
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}


.answers_col {
  height: var(--mobile-answers_col-height);  
  /* height: 300px;    */
  overflow: auto;
  /* Works on Firefox */
  scrollbar-width: thin;
  scrollbar-color:var(--scrollbar-bg-color) #3D3E3F;
}

/* Works on Chrome, Edge, and Safari */
.answers_col::-webkit-scrollbar {
  width: 4px;               
}

.answers_col::-webkit-scrollbar-track {
  background: #3D3E3F;       
}

.answers_col::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-bg-color); 
  border-radius: 5px;   
}

select {
    height: 42px;
}

/**
.btn-danger {
    color: #fff;
    height: 42px;    
          
    border-color: #fff;
    border-style: none;
    margin-top: 1rem;
    margin-bottom: 1rem;
    padding-left: 2rem;
    padding-right: 2rem   
}
**/

.btn-primary {
    color: var(--custom-btn-text-color);
    height: 42px;    
    background-color: var(--primary-btn-main-bg-color);    
    border-color: #fff;
    border-style: none;
    border-radius: 30px;
    margin-top: 1rem;
    margin-bottom: 1rem;
    padding-left: 2rem;
    padding-right: 2rem
    }

.btn-outline-secondary {
    background-color: #fff;
    color: #333;
    border-color: #6c757d;}


.footer_style
{
    height: 50px;
    background-color: rgb(73, 73, 73);
}

.btn-check:focus+.btn-primary, .btn-primary:focus {
    background-color: var(--primary-btn-main-bg-color);
}


.btn-primary:hover
{
    background-color: var(--primary-btn-hover-bg-color);
    color: var(--custom-btn-text-color);
    -webkit-transition-duration: 0.1s;
            transition-duration: 0.1s
}

.form-control
{
    color: #000;
    border-width: 0px;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
    height: 42px;   
}

.input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
}


.form-control, .form-control:active, .form-control:hover, .form-control:focus  {
    background-color: #fff;
}

.form-select, .form-select:active, .form-select:hover, .form-select:focus  {
    background-color: #fff;
}

.btn-primary:focus
{

    outline: none !important;
    -webkit-box-shadow: none !important;
            box-shadow: none !important
}


.btn-primary:disabled, .btn-primary.disabled {
    color: var(--custom-btn-text-color);
    background-color: var(--primary-btn-hover-bg-color);
    border-color: var(--primary-btn-hover-bg-color);
}


.form-control:focus
{
    color: #000;
    -webkit-box-shadow: none;
            box-shadow: none;
}

.form-select {
    color: #000;
    border-width: 0px;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
    -webkit-appearance: none;
}


.form-select:focus
{
        -webkit-box-shadow: none;
                box-shadow: none;
}

.input-group-text, .r6-block, .btn-r1 {
    margin-right: 10px;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;

}

.input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu), .input-group:not(.has-validation)>.dropdown-toggle:nth-last-child(n+3) {
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;

}

.btn-group>.btn:not(:last-child):not(.dropdown-toggle), .btn-group>.btn-group:not(:last-child)>.btn, .btn-group>.btn:nth-child(n+3), .btn-group>:not(.btn-check)+.btn, .btn-group>.btn-group:not(:first-child)>.btn {
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
}


.main-tab
{
    color: #fff;    
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.nav-tabs .nav-link.active {
    color: var(--primary-btn-main-bg-color);
}

.nav-link:hover, .nav-link:focus {
    color: #fff;
}

.tab-content {
    margin-top: 0.5rem;
    
}


.blue
{
    color: var(--primary-btn-main-bg-color);
   
}

.select-title-row
{
    margin-top: 1.5rem;
   
}

.btn-outline-secondary:hover
{
   
}

.toast-body {
    color:#000
}

.grid-column
{
    border: 0px solid #fff;
   
}



.form-r-disabled input , .form-r-disabled select , .form-r-disabled label.btn{
    background-color: rgb(207, 207, 207);
}

.form-control:disabled, .form-control[readonly] {
	background-color: rgb(207, 207, 207);
}

.navbar-nav-item
{
    font-size: 14px;
    margin-left: 0rem;
    margin-right: 1rem;
}


.input-addon
{
    background-color: var(--primary-btn-main-bg-color);
    width: 42px;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
            font-size: 20px;
            border-width: 0px;
}


.btn-r1
{
    color: #000;    
    width: 42px;
    padding-top: 8px;
    margin-right: 1rem;
   
}


.btn-check:focus+.btn, .btn:focus {
    outline: 0;
            -webkit-box-shadow: none;
                    box-shadow: none;
     /*
    -webkit-box-shadow: 0 0 0 .25rem rgba(61, 61, 61, 0.25);
            box-shadow: 0 0 0 .25rem rgba(61, 61, 61, 0.25); */
}


.round-warning
{
    font-size: 1rem;
    margin-bottom: 0px;
    text-align: center;
}


.fw-200 {
    width: 200px;
}

.fw-100 {
    width: 100px;
}



.r6-row
{
   margin-bottom: 1rem;
   
}


.r6-block
{
   background-color: var(--primary-btn-main-bg-color);
   height: 42px;
   text-align: center;
   font-size: 20px;
   width: 42px;
   padding-top: 5px;
}


.r6-col
{
   padding-left: 1px;
   padding-right: 12px;
   margin-right: 1px;
}


.r6-addon
{
   padding-right: 1px;
   
}

.form-select {
    padding-right: 1.5rem;
    padding-left: 0.75rem;
    background-position: right 0.5rem center;
}


@media (min-width: 768px)
{


.round-warning
{
      margin-top: 0.5rem;
      font-size: 1rem;
   }
}


.fa_edit
{
   margin-left: 0.5rem;
}


.fa_edit:hover
{
   color: var(--primary-btn-main-bg-color);
   cursor: pointer;
}


.game_message
{
   
}

.trim_title {
  width:auto;
  
  /**Major Properties**/
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.trim_title_na {  
  
  /**Major Properties**/
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

@media (min-width: 768px) {


}

@media (min-width: 992px)
{

.team_input_row
{
      margin-top: 0.5rem;
   }

.game_title_row
{
      margin-top: 1rem;
   }

.navbar-nav-item
{
      font-size: 16px;
      
   }

/* .show_form_icon {
    width: 2.5rem;
} */

}

.corp_logo {
    height: 44px;
}   

@media (min-width: 1200px)
{

.height-like-buttons
{
   height: 66px;
}

.answers_col
{
        height: 440px;
    }


.game_message
{
      font-size: 1.25rem;
   }

.game_title_row
{
      margin-top: 0px;
   }

.navbar-nav-item
{
      font-size: 16px;      
   }
}

@media (min-width: 1200px) and (max-width: 1300px) {

.container {
    max-width: 1200px 
    }

.answers_col
{
        height: 436px;
    }


}


@media (min-width: 1300px) {

.navbar-nav-item
{
      font-size: 16px;
   }

.answers_col
{
        height: 458px;
    }


}



@media (min-width: 1400px) {


.container {
    max-width: 1320px 
    }

.answers_col {
        height: 481px;
    }
}

@media (min-width: 1500px) {

.corp_logo {
    height: 50px;
}       

.container {
    max-width: 1440px 
    }

.answers_col
{
        height: 526px;
    }
}



@media (min-width: 1800px)  {

.navbar-nav-item {
      font-size: 20px;
   }

.corp_logo {
    height: 60px;
}    

.container {
    max-width: 1780px 
    }


main {
    margin-top: 0.0em 
    }

.answers_col {
        height: 715px;
    }

}



#navTabs1_content {
    margin-top: 0px;
}



.navbar-light .navbar-text.hidden-info
{
   color: #3D3E3F;
}

#dmxValidatorErrorteam_infoteam_title {
    display: none;
}

#session_info {
    color: #000;   
}

.table
{
   color: #000;
   background-color: #fff;
   --bs-table-hover-color: #000
}



.table-striped>tbody>tr:nth-of-type(odd) {
    color: #000;
}

.table-hover>tbody>tr:hover {
    color: #000;
}

.btn-table-green {
   background-color: #198754;
    
}

.btn-table-green:hover {
   background-color: #135f3b;
    
}

.btn-table-red {
   background-color: #a31a1a;
    
}

.btn-table-red:hover {
   background-color: #701616;
    
}

.btn-table-blue {
   background-color: #1552c5;
    
}

.btn-table-blue:hover {
   background-color: #133a83;
    
}

.t_cell_20 {
    width: 20px;
}

.t_cell_50 {
    width: 50px;
}

.t_cell_70 {
    width: 70px;
}

.t_cell_100 {
    width: 100px;
}

.t_cell_150 {
    width: 150px;
}

.t_cell_200 {
    width: 200px;
}

.t_cell_300 {
    width: 300px;
}

.t_cell_400 {
    width: 400px;
}


.btn-light {
   border: 1px solid #dee2e6;
}

.btn-light.active {
   background-color: #cfcfcf;
   border: 1px solid #dee2e6;
    outline: 0 !important;
    -webkit-box-shadow: none !important;
            box-shadow: none !important;
}

.btn-light:hover, .btn-light:focus, .btn-light:active
{
    background-color: #cfcfcf;
    border: 1px solid #dee2e6;
    outline: 0 !important;
    -webkit-box-shadow: none !important;
            box-shadow: none !important;
}

.btn-check:checked+.btn-light {
    background-color: #cfcfcf;
    border: 1px solid #dee2e6;
}

.btn-check:checked+.btn-light:hover {
background-color: #cfcfcf;
    border: 1px solid #dee2e6;
    outline: 0 !important;
    -webkit-box-shadow: none !important;
            box-shadow: none !important;

}

.green-back {
    background-color: #57e090;
}

.red-back {
    background-color: #c46666;

}

.grey-back {
    background-color: #38383a;

}

.answer-correct {
    color: #57e090;
}

.answer-incorrect {
    color: #c46666;

}

.answer-absent {
    color: #c46666;

}

.just-gray {
    background-color: #e0e0e0;

}

.btn-short {
    height: 26px;
    padding-top: 0px;
    padding-bottom: 0px
}

.td-button
{
   
}

.reserve_link
{
   text-decoration: none;
}

.answer_btn {
      margin-bottom: 2rem;
}

#sidebar
{
   max-width: 120px;   
   background-color: #2b2b2c;
   position: fixed;
   
}

#undersidebar {
    max-width: 120px;   
}

#admincontent {
   max-width: (100% - 120px);  
   height: 100%;
}

.grey-back2 {
 background-color: #3D3E3F
}

#sidebar .nav-link {
    color: #fff
}

#sidebar .nav-link.active {
    background-color: #0f81b9
}

#sidebar .nav-link.active:hover {
    background-color: #26617E
}

#sidebar .nav-link:hover {
    background-color: #4e4e4e
}

#containerback {
    background-color: #5e5e5e;   
}

.arrow-img
{
   position: absolute;
   margin-top: -12px;
   margin-left: 6px;
}

.my_iframes {
    border: none; 
    background-color: #313131
}

.iframe_div_back {
 background-color: #313131
}

.arrow-down {
  width: 0; 
  height: 0; 
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;  
  border-top: 7px solid #24a3e3;
   position: absolute;
   margin-top: -10px;
   margin-left: 11px;
}

#gen_form_textarea {
   background-color: var(--bs-body-bg);
   color: var(--bs-body-color);
   border: 1px solid var(--bs-body-color);
}



#gen_form_textarea::-webkit-input-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: var(--bs-body-color);
  opacity: 1; /* Firefox */
}



#gen_form_textarea::-moz-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: var(--bs-body-color);
  opacity: 1; /* Firefox */
}



#gen_form_textarea:-ms-input-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: var(--bs-body-color);
  opacity: 1; /* Firefox */
}



#gen_form_textarea::-ms-input-placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: var(--bs-body-color);
  opacity: 1; /* Firefox */
}



#gen_form_textarea::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: var(--bs-body-color);
  opacity: 1; /* Firefox */
}


#gen_btn {
    height: 60px;
}



.custom_scrollbar {

  scrollbar-width: thin;
  scrollbar-color: var(--scrollbar-bg-color) #3D3E3F;
  
}

/* Works on Chrome, Edge, and Safari */

/* Works on Chrome, Edge, and Safari */
.custom_scrollbar::-webkit-scrollbar {
  width: 12px;               
}

.custom_scrollbar::-webkit-scrollbar-track {
  background: #d6d6d6;       
}

.custom_scrollbar::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-bg-color);    
}

.gen_text_col {
    word-wrap: break-word;
}

.white_link {
    color: #fff;    
}

.white_link:hover {
    color: #24a3e3;    
}

.w-300px {
width: 300px;
}

.tagify {    
    background-color: #fff;
    border-radius: 30px;
}

.tagify--select .tagify__input {
    color: #000;
}

.tagify--select::after {
    color: #000;
}


.client_link {
    display: none;
}

.min-width-300 {
    min-width: 300px;
}

.modal-content {
    background-color: #3D3E3F
}

.modal-header {
    border-bottom: none
}


.textarea_input {
    height: 100px
}

@media (max-width: 600px)
{
.message_toast {  
  position: fixed;
  top: 20px;
  left: 20px;  
  width: 250px;
  opacity: 95%;  
}
}

@media (min-width: 601px) and (max-width: 990px) 
{
.message_toast {  
  position: fixed;
  top: 20px;
  left: 20px;  
  width: 500px;
  opacity: 95%;  
}
}

@media (min-width: 991px) and (max-width: 1500px) 
{

.message_toast {  
  position: fixed;
  bottom: 20px;
  left: 20px;  
  width: 500px;
  opacity: 95%;  
}
}

@media (min-width: 1501px)
{

.message_toast {  
  position: fixed;
  bottom: 20px;
  left: 20px;  
  width: 800px;
  opacity: 95%;  
}
}


.message_toast p {
    color: #000;
}

#message_toast_animate {
    z-index: 10;
}

/* Убираем разделение в результатах */
.table>:not(caption)>*>* {       
    border-bottom: none;    
}

.table-striped>:not(:first-child) {
    border-top: none;
}

/* Цвет текста в строке с заголовками в результатах */
.table-striped th {
    color: var(--custom-btn-text-color);    
}

/* Размер иконки меню (гамбургер), потому что почему-то в fs получается дробный размер */
.menu_icon {
    font-size: 2rem;
}

.tiny_fs
{
    font-size: 0.75rem;
}

.fs_sm
{
    font-size: 0.75rem;
}


.sticky_logo {
    margin-top: -18px;
    height: 50px
}


#jaas-container {
        height: 100%;
    }

.rounded_corners {
    border-radius: 20px;
}

.rounded_corners_30 {
    border-radius: 30px;
}

#jitsiConferenceFrame0 {
    border-radius: 20px;
}

#jitsiConferenceFrame1 {
    border-radius: 20px;
}

#jitsiConferenceFrame2 {
    border-radius: 20px;
}

#jitsiConferenceFrame3 {
    border-radius: 20px;
}

.btn-sm {
    border-radius: 20px;
}

.toast {
    border-radius: 20px;
}

.toast-header {
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}

.t-input.t-input-phonemask__wrap.form-control {
    border-radius: 20px;
}

.table-responsive {
    border-radius: 20px;
}


.login_input {
    font-size: 14px;
}

.btn {
     border-radius: 30px;
}

#answer_select {
    font-size: 14px;
}

.line-height-small {
    line-height: 1.2
}

.row_under_iframe {
    height: 42px;
}

.top-30 {
    top: 30%
}

.top-40 {
    top: 40%
}

.answer_btn, .answer_btn:hover {
    color: var(--custom-btn-text-color)
}