/* responsive */


/* Mobile */

@media only screen and (max-width: 767px) {

    .mobile.hidden,
    .tablet.only,
    .computer.only,
    .large.monitor.only,
    .widescreen.monitor.only {
        display: none !important;
    }
}





/* Tablet / iPad Portrait */

@media only screen and (min-width: 768px) and (max-width: 991px) {

    .mobile.only,
    .tablet.hidden,
    .computer.only,
    .large.monitor.only,
    .widescreen.monitor.only {
        display: none !important;
    }
}





/* Computer / Desktop / iPad Landscape */

@media only screen and (min-width: 992px) and (max-width: 1199px) {

    .mobile.only,
    .tablet.only,
    .computer.hidden,
    .large.monitor.only,
    .widescreen.monitor.only {
        display: none !important;
    }
}





/* Large Monitor */

@media only screen and (min-width: 1200px) and (max-width: 1919px) {

    .mobile.only,
    .tablet.only,
    .computer.only,
    .large.monitor.hidden,
    .widescreen.monitor.only {
        display: none !important;
    }
}





/* Widescreen Monitor */

@media only screen and (min-width: 1920px) {

    .mobile.only,
    .tablet.only,
    .computer.only,
    .large.monitor.only,
    .widescreen.monitor.hidden {
        display: none !important;
    }
}





/* root */

.head {
    margin-bottom: 2em !important;
    margin-top: 0px !important;
}

.head-message {
    margin: 0px !important;
    margin-bottom: 1em !important;
    margin-top: -2em !important;
    flex-shrink: 0;
    font-size: 17px;
    line-height: 1.4;
    /* font-weight: bold; */
}

.head-message a {
    color: #ffffff !important;
    text-decoration: underline !important;
}

.head .ui.icon.header {
    margin-bottom: 0px !important;
}

.nowrap {
    white-space: nowrap !important;
}

.h100 {
    height: 100% !important;
}

.main-menu {
    display: flex;
}

.main-menu .right.menu {
    justify-content: flex-end;
}

.main-menu .menu {
    margin: 0px;
    flex: 1;
    align-items: center;
}

.main-menu .hc.logo {
    width: 3em;
    height: 3em;
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.hc.page.center {
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.clear-side-padding {
    padding-right: 0px !important;
    padding-left: 0px !important;
}

.zos.center {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.hc.background {
    background-image: url('img/background.jpg') !important;
    background-size: cover !important;
}

.ui.segment.basic.dialog {
    background-color: white !important;
}

.ui.middle.aligned.center.aligned.grid.dialog {
    height: 100%;
}

.ui.middle.aligned.center.aligned.grid.dialog .centered.row {
    text-align: left;
}

div.column.white {
    background-color: white;
}

.ui.header.dialog .content {
    font-size: 1.1em;
    font-weight: normal;
    font-family: 'Open Sans', serif;
    color: rgba(255, 255, 255, .8);
}

.ui.header.dialog .logo {
    display: inline-block;
    margin-top: .14285714em;
    width: 2.5em;
    height: auto;
    vertical-align: middle;
}

.ui.header.dialog .content .sub.header {
    font-size: 0.8em !important;
    font-weight: 600;
    font-family: 'Open Sans', serif !important;
    color: #ffffff;
    text-align: left;
}

@media only screen and (max-width: 411px) {
    .ui.header.dialog .content {
        font-size: 0.8em;
    }

    .ui.header.dialog .image {
        width: 2em;
    }
}

.masthead .ui.menu .ui.button {
    margin-left: 0.5em;
}

.masthead h1.ui.header {
    margin-top: 3em;
    margin-bottom: 0em;
    font-size: 4em !important;
    font-weight: normal !important;
    font-family: 'Open Sans', serif !important;
    color: yellow !important;
}

.masthead h2 {
    font-size: 1.7em !important;
    font-weight: 300 !important;
    margin: 0em !important;
    font-family: 'Open Sans Condensed', serif !important;
}

.masthead.segment {
    min-height: 700px;
    padding: 1em 0em;
}

@media only screen and (max-width: 700px) {
    .masthead.segment {
        min-height: 350px;
    }

    .masthead h1.ui.header {
        font-size: 2em !important;
        margin-top: 1.5em !important;
    }

    .masthead h2 {
        margin-top: 0.5em !important;
        font-size: 1.5em !important;
    }
}

h2.ui.landing.header {
    font-family: 'Open Sans', serif;
    font-weight: 300;
    text-transform: uppercase;
    margin-bottom: 2em;
    color: #3f3e3e;
}

.stripe {
    margin: 0em !important;
    padding: 5em 0px !important;
}

.ui.segment.feature h2 {
    font-family: 'Open Sans', serif;
    font-weight: 300;
    text-transform: uppercase;
}

.stripe p {
    font-family: 'Open Sans', serif !important;
    font-size: 16px !important;
    ;
    font-weight: 300 !important;
    color: #3f3e3e;
}

.feature.stripe .column {
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    flex-direction: column;
}

.feature.stripe p {
    -webkit-flex: 1 0 auto;
    -moz-flex: 1 0 auto;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    margin: 0.5em 0em 2em;
}

.alternate.stripe {
    background-color: #F2F3F5;
}

.hc.column.layout {
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.hc.column.layout>.footer {
    flex: 0 0 auto;
    /* overflow: hidden; */
    /* position: fixed; */
    /* bottom: 0; */
    /* width: 100%; */
}

.hc.column.layout>.content {
    flex: 1 0 auto;
}

.footer {
    margin: 0em !important;
    margin-top: 1em !important;
    border-radius: 0em !important;
}

#landing .footer {
    padding: 4em 0em 4em 0em !important;
    background-color: #1b1c1d !important;
    color: rgba(255, 255, 255, .5) !important;
    ;
}

#landing .footer .icon {
    color: rgba(255, 255, 255, .5);
}





/* CALENDAR */

.hc.month.calendar .week {
    display: flex;
    flex-wrap: wrap;
    min-height: 100px;
    position: relative;
    z-index: 10;
    width: 100%;
    border: none;
}

.hc.month.calendar .weekdays {
    display: flex;
    font-family: 'Roboto Condensed', sans-serif;
    justify-content: center;
}

.hc.month.calendar .weekday {
    font-weight: bold;
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 0;
    padding: 0.3em 1em;
    /* align-self: center; */
    /* text-align: center; */
}

.hc.month.calendar .day {
    width: 14.28%;
    /* font-size: 20; */
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 0;
    padding: 0.3em 1em;
    align-self: flex-start;
    font-family: 'Roboto Condensed', sans-serif;
    color: #212121;
}

.hc.month.calendar .day.holiday {
    font-weight: bold;
    color: #D50000;
}

.hc.month.calendar .day.weekend {
    color: #D50000;
}

.hc.month.calendar .day.today {
    border-top: 3px #4CAF50 solid
}

.hc.month.calendar .day.today.outside {
    border-top: 3px #C8E6C9 solid
}

.hc.month.calendar .day.outside {
    color: #9E9E9E;
}

.hc.month.calendar .day.holiday.outside {
    color: #EF9A9A;
}

.hc.month.calendar .day.weekend.outside {
    color: #EF9A9A;
}

.hc.month.calendar .day.weekend.workday {
    font-weight: bold;
    color: #212121;
}

.hc.month.calendar .day.weekend.workday.outside {
    font-weight: bold;
    color: #9E9E9E;
}

.hc.month.calendar .events {
    flex: 1 100%;
    display: flex;
    flex-direction: column;
}

.hc.month.calendar .event {
    display: block;
    color: white;
    background-clip: padding-box;
    padding: 0.3em;
    text-align: center;
    white-space: nowrap;
    margin-bottom: 0.3em;
    font-family: 'Roboto Condensed', sans-serif;
    opacity: .95;
    /* Чтобы событие не перекрывало сетки и между событиями был промежуток */
    border-left: 4px transparent solid !important;
    border-right: 3px transparent solid !important;
 }

/* Чтобы событие не перекрывало сетки и между событиями был промежуток */
.hc.month.calendar .event.to-7 {
    border-right: 5px transparent solid !important;
}

.hc.month.calendar .event:hover {
    color: white;
    /* text-decoration: underline; */
    /* background-color:#2196F3 !important; */
}

.hc.month.calendar .event.active {
    /* text-decoration: underline; */
    opacity: 1;
    /* background-color:#2196F3 !important; */
}
.zos .filter-period {
    font-family: 'Roboto Condensed', sans-serif !important;
    font-size: 1.2em !important;
}

h1.ui.status.header {
    font-size: 10em;
}

h1.ui.status.header .sub.header {
    font-size: 3rem;
}

a#recovery {
    display: block;
    margin-bottom: 1em;
}

div.g-recaptcha {
    margin-bottom: 1em;
}

#toast-container>div {
    opacity: 1 !important;
}

div.icon.input>i.ui.icon {
    z-index: 1;
}

#calendar-menu {
    display: flex;
    justify-content: center;
}

#head-menu {
    padding: 1em;
    background-color: #F3F4F5;
    margin-bottom: 1em;
}

#head-menu>.ui.container {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
}

#head-menu h1.icon.center.aligned.ui.header {
    /* margin-bottom: 0; */
}

#label-new {
    top: -0.5em;
    right: 2.5em;
}

.three-column {
    display: flex;
}

.three-column>.left {
    flex: 0.33;
    align-self: flex-start;
    /* margin-right: auto; */
}

.three-column>.right {
    flex: 0.33;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    /* position: absolute; */
    /* margin-left: auto; */
}

.three-column>.center {
    flex: 0.33;
    display: flex;
    justify-content: center;
    align-items: center;
    /* position: absolute; */
    /* position:relative; */
    /* left: 50%; */
    /* transform: translateX(-50%); */
}

#event-statistic {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

#event-statistic table {
    max-width: 500px;
}

#events .ui.container.content{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
}

#events div.ui.grid.centered.head-message {
    margin-top: 1px !important;
}

#events .ui.message {
    width: auto;
    /* max-width: 400px; */
}

#events table {
    max-width: 700px;
}
#landing .main-menu .mobile.hidden.menu .ui.item {
    color: rgba(255, 255, 255, 1)
}

body#holidays-page {
    background-color: #F3F4F5;
}

body#holidays-page #head-menu {
    margin-bottom: 0em;
}

body#holidays-page .menu.years {
    justify-content: center;
}

#holidays-page .year {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
}

#holidays-page .hc.month.calendar {
    background-color: white;
    padding: 1em 1em 1em 1em;
    box-shadow: 5px 5px 5px 0px #DBDBDB;
    margin-right: 1em;
    margin-top: 1em;
}

#holidays-page .week {
    min-height: fit-content;
}

#holidays-page .week:last-child {
    border-bottom: 1px solid #CACCCE;
}

#holidays-page .year.holidays .quarter .hc.month.calendar .weekday {
    text-align: center;
    text-transform: uppercase;
    color: #9E9E9E;
    font-family: Roboto, Helvetica, Arial, sans-serif;
}


#holidays-page .day:first-child {
    border-left: 1px solid #CACCCE;
}

#holidays-page .year.holidays .hc.month.calendar .day {
    border-right: 1px solid #CACCCE;
    width: 2.5em;
    height: 2.5em;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

#holidays-page .day.holiday {
    color: white;
    background-color: #ef5350;
}

#holidays-page .day.holiday:hover {
    background-color: #c62828;
}

#holidays-page .day:hover {
    background-color: #EFEFEF;
}

#holidays-page .day.holiday.outside {
    background-color: #FFF1F3;
    color: #9E9E9E;
    font-weight: normal;
}

#holidays-page .day.holiday.outside:hover {
    background-color: #FFCDD2;
}

@media only screen and (max-width: 600px) {
    #holidays-page .year.holidays .hc.month.calendar .day {
        border-right: 1px solid #CACCCE;
        width: 11vw;
        height: 11vw;
        font-size: 4vw;
    }

    #holidays-page .year.holidays .hc.month.calendar {
        margin-right: 0px;
    }
}

.ui.text.underline {
    text-decoration: underline;
}

.ui.text.bold {
    font-weight: bold;
}

.hc.month.calendar .event-group .event {
    margin-left: 0;
    margin-right: 0;
    border-left-width: 1px;
    border-left-color: white;
    border-left-style: solid;
    float: left;
}

.ui.menu.dividing {
  padding-bottom: .21428571rem;
  border-bottom: 1px solid rgba(34,36,38,.15);
}

.ui.menu.h3 .ui.item.header {
  font-size: 1.28571429rem;
}

.ui.menu .item.header > .label{
  background-color: #e8e8e8;
  color: rgba(0,0,0,.6);
}

input#duration{
    width: 50px;
}

.hc.month.calendar .event-group .event.from-1:first-child  {margin-left: 0%}
.hc.month.calendar .event-group .event.from-2:first-child  {margin-left: 14.28%}
.hc.month.calendar .event-group .event.from-3:first-child  {margin-left: 28.57%}
.hc.month.calendar .event-group .event.from-4:first-child  {margin-left: 42.85%}
.hc.month.calendar .event-group .event.from-5:first-child  {margin-left: 57.14%}
.hc.month.calendar .event-group .event.from-6:first-child  {margin-left: 71.42%}
.hc.month.calendar .event-group .event.from-7:first-child  {margin-left: 85.71%}
.hc.month.calendar .event-group .event.to-1 + .event.from-2 { margin-left: 0%; }
.hc.month.calendar .event-group .event.to-1 + .event.from-3 { margin-left: 14.28%; }
.hc.month.calendar .event-group .event.to-1 + .event.from-4 { margin-left: 28.57%; }
.hc.month.calendar .event-group .event.to-1 + .event.from-5 { margin-left: 42.85%; }
.hc.month.calendar .event-group .event.to-1 + .event.from-6 { margin-left: 57.14%; }
.hc.month.calendar .event-group .event.to-1 + .event.from-7 { margin-left: 71.42%; }
.hc.month.calendar .event-group .event.to-2 + .event.from-3 { margin-left: 0%; }
.hc.month.calendar .event-group .event.to-2 + .event.from-4 { margin-left: 14.28%; }
.hc.month.calendar .event-group .event.to-2 + .event.from-5 { margin-left: 28.57%; }
.hc.month.calendar .event-group .event.to-2 + .event.from-6 { margin-left: 42.85%; }
.hc.month.calendar .event-group .event.to-2 + .event.from-7 { margin-left: 57.14%; }
.hc.month.calendar .event-group .event.to-3 + .event.from-4 { margin-left: 0%; }
.hc.month.calendar .event-group .event.to-3 + .event.from-5 { margin-left: 14.28%; }
.hc.month.calendar .event-group .event.to-3 + .event.from-6 { margin-left: 28.57%; }
.hc.month.calendar .event-group .event.to-3 + .event.from-7 { margin-left: 42.85%; }
.hc.month.calendar .event-group .event.to-4 + .event.from-5 { margin-left: 0%; }
.hc.month.calendar .event-group .event.to-4 + .event.from-6 { margin-left: 14.28%; }
.hc.month.calendar .event-group .event.to-4 + .event.from-7 { margin-left: 28.57%; }
.hc.month.calendar .event-group .event.to-5 + .event.from-6 { margin-left: 0%; }
.hc.month.calendar .event-group .event.to-5 + .event.from-7 { margin-left: 14.28%; }
.hc.month.calendar .event-group .event.to-6 + .event.from-7 { margin-left: 0%; }

.hc.month.calendar .event-group .event.days-1 {width: 14.28%}
.hc.month.calendar .event-group .event.days-2 {width: 28.57%}
.hc.month.calendar .event-group .event.days-3 {width: 42.85%}
.hc.month.calendar .event-group .event.days-4 {width: 57.14%}
.hc.month.calendar .event-group .event.days-5 {width: 71.42%}
.hc.month.calendar .event-group .event.days-6 {width: 85.71%}
.hc.month.calendar .event-group .event.days-7 {width: 99.99%}

.hc.month.calendar .week .grid {
    z-index: -10;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.hc.month.calendar .week .grid .cell {
    height: 100%;
    width: 14.28%;
    float: left;
    
    border-left: 2px solid rgba(34,36,38,.1);
    border-top: 2px solid rgba(34,36,38,.1);
    box-sizing: border-box;
}

.hc.month.calendar .week .grid .cell:last-child {
    border-right: 2px solid rgba(34,36,38,.1);
}

.hc.month.calendar .week:nth-child(even) .grid .cell:nth-child(odd) {
    background-color: #f9fafb;
}

.hc.month.calendar .week:nth-child(odd) .grid .cell:nth-child(even) {
    background-color: #f9fafb;
}

.hc.month.calendar .week:last-child .grid .cell {
    border-bottom: 2px solid rgba(34,36,38,.1);
}

.hc.month.calendar .week .grid .cell.today {
    border: 3px #4CAF50 solid;
    background-color: #C8E6C9!important;
}

.hc.month.calendar .week .grid .cell.today.outside {
    border: 3px #C8E6C9 solid;
    background-color: #E8F5E9 !important;
}

.ui.list.features .item {
    display: flex;
    align-items: center;
}
