@media (max-width: 700px),(max-height: 600px) {
    body.fullscreen .navbar-brand {
        left: 12px;
        bottom: 1em;
        top: auto;
        right: auto;
        position: fixed;
        display: block;
        height: 2em;
        width: 2em;
        background: rgba(255,255,255,0.5);
        border-radius: 2em;
        line-height: 2em;
        text-align: center;
        padding: 0;
    }
    body .navbar-brand span{
        display:none!important;
    }
    #headerBrand{
        display:inline-block;
        height:66px;
        line-height:66px;
    }
    .navbar {
        padding: 0;
    }
    .fullscreen #headerBrand{
        display:none;
    }
    #headerTextSpin{
        display:none;
    }
    #innerSurprise{
        min-height:0;
        line-height:normal;
    }
    .flexItem{
        width: auto;
        min-width: 60%;
        padding-right: 1em;
    }
    
    .flexItem .calendarLabel{
        white-space:initial;
    }
    .flexItem+.flexItem{
        /*margin-top:0em;*/
        margin-left:0;
    }
    #overlay #modal{
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        transform: none;
        padding: 4em 2em;
        overflow:hidden;
        border-radius:0;
    }
    #overlay #modal #closeCross{
        position: absolute;
        color: white;
        cursor: pointer;
        top: .5em;
        right: .5em;
        font-size: 2em;
        background: white;
        border-radius: 1.2em;
        width: 1.2em;
        height: 1.2em;
        line-height: 1.2em;
    }
    #overlay #modal #modalContent{
        height: calc(100% - 6em);
    }

    .calendarView .dayView{
        /*height:3em;*/
    }
    /*
    .calendarView .dayView.hasEvent.surprise::before{
        content:none;
    }
    .calendarView .dayView.hasEvent.nosurprise::before{
        content:none;
    }
    */
    /*
    .calendarView .dayView.hasEvent.surprise .dayLabel{
        height: 1.5em;
        width: 1.5em;
        line-height: 1.5em;
        border-radius: 0.75em;
        background: #55efc4;
        display: block;
        text-align: center;
    }
    .calendarView .dayView.hasEvent.nosurprise .dayLabel{
        height: 1.5em;
        width: 1.5em;
        line-height: 1.5em;
        border-radius: 0.75em;
        background:#b2bec3;
        display: block;
        text-align: center;
    }
    */
    /*
    .calendarView::before {
        font-size:10em;
    */
    .calendarView .header .headerItem{
        visibility: hidden;
    }
    .calendarView .header .headerItem::first-letter{
        visibility: visible;
    }
    .calendarView .dayView.hasEvent.surprise{
        background:transparent;
    }
    .calendarView .dayView.hasEvent.nosurprise{
        background:transparent;
    }
    .dayView.selected{
        height:100%;
        width:100%;
    }
    .dayView .animations-form .animations-list .content li{
        width: calc(100% / 2 - 1em);
    }
    .calendarView .dayView .buttons .input-data.big{
        display:none;
    }
    .calendarView .dayView .buttons .input-data.small{
        display:block;
    }
    /* CREATE */
    #createDiv .flexItem {
        width: 90%;
        margin-left: 5%;
        margin-right:5%
    }
    /*CALENDAR CHRISTMAS*/
    .advent-calendar .window .inner{
        border-radius:.5em;
    }
    .advent-calendar .window.window-big .inner{
        border-bottom-right-radius: 0;
        border-top-right-radius: 0;
    }
    .advent-calendar .window.window-big .inner:nth-child(2){
        border-bottom-left-radius: 0;
        border-top-left-radius: 0;
        border-bottom-right-radius: .5em;
        border-top-right-radius: .5em;
    }
    .advent-calendar .window .inner::before{
        top:0;
        left:0;
        background:none;
        width:100%;
        height:100%;
        text-shadow: 0px 0px 2px black;
        /* box-shadow: 0 0 0 1px white; */
        filter: drop-shadow(0px 0px 2px white);
        color: white;
    }
    .advent-calendar .window::before{
        border-radius: .5em;
    }
    .advent-calendar .window .inner::after{
        border-radius:.5em;
    }
    /*

    TEAR OFF

    */
    .rings-calendar .calendar-header {
        width: 100%;
        left: 0;
        top: 0;
        border-radius:0;
    }
    .rings-calendar .day-shadow {
        width: 100%;
        left: 0%;
        top: 50%;
    }
    .rings-calendar .calendar-content {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 50%;
        width: 100%;
        left: 0;
        bottom: 0;
    }
    .rings-calendar .rings {
        width:100%;
        left:0;
        top:calc(50% - 2em);
    }
    
}