body{
    /*font-size: 1em;*/
    /*font-size: 0.85em;*/
}
#proj{
    width: 100%;
    margin: 0 auto;
    margin-top: 2.2em;
    padding-bottom: 12vh;
    transition: 0.3s;
    position: absolute;
    top: 0;
    left: 0;
    overflow-x: hidden;
}
#proj .proj_wrap{
    width: 45%;
    margin: 0 auto;
}

#proj .icon_close{
    width: 1.1em;
    margin: 0 auto;
    margin-bottom: 3em;
}
#proj .icon_close img{
    width: calc(1.1em  * (5/4) * (2/3));
    position: fixed;
    z-index: 2;
    /*transform: translateY(-2em);*/
    cursor: pointer;
    /*transform: translateY(-10em);*/
    transition: 0.3s;

    /**/
    transform: translateX(3px);
}
#proj .proj-title{
    text-align: center;
    font-size: 1.3125em;
    line-height: 1.5em;
    margin-bottom: 0.4em;
}
#proj .proj-desc{
    width: 35ch;
    margin: 0 auto;
    margin-bottom: 0.4em;
}
#proj .desc-row{
    line-height: 1.5em;
}
#proj .desc-title{
    width: 50%;
    text-align: right;
    padding-right: 0.5em;
}
#proj .desc-value{
    width: 50%;
    padding-left: 0.5em;
}
#proj .proj-content-start{
    text-align: center;
    /*font-size: 1.3125em;*/
}
#proj .proj-content p{
    opacity: 0.3;
    line-height: 1.5em;
    margin-top: 0.5em;

    overflow-wrap: break-word;
}
/* sliders */
#proj .sliders{
    width: 100%;
    height: 75vh;
    margin-bottom: 1em;
    opacity: 0;
}
#proj .sliders img{
    max-width: none;
    /*max-height: 100%;*/
    height: 75vh;
}


#proj .proj-content-start{
    display: none;
}

.hidden{
    display: none;
}

#loading{
    width: 20px;
    position: absolute;
    left: calc(50vw - 14px);
    top: 35vh;
}
#loading_grbg{
    width: 100%;
    height: 75vh;
    background-color: #f7f7f7;
}

.carousel.flickity-enabled.is-draggable{
    background-color: #f7f7f7;
}

/* sliders */
/* modal */
.ayrtbh-modal{
    padding: 0 !important;
    text-align: center;
    background-color: rgba(255,255,255,0) !important;
    /*max-height: 100%;*/
    overflow: hidden !important;
    border-radius: 0 !important;
}
.ayrtbh-modal img{
    max-height: 90vh;
}
.ayrtbh-modal-overlay{
    opacity: 0.9 !important;
}
/* modal */





.carousel {
  /*background: cyan;*/
  height: 100%;
}

.carousel-cell {
  margin-right: 5px !important;
}
.carousel-cell.is-selected {
}
.flickity-page-dots {
    bottom: 15px;
    display: none;
}
.flickity-page-dots .dot{
    border-radius: 0;
    background: #fff;
    height: 7px;
    width: 7px;
}
.flickity-prev-next-button{
    display: none;
}


#nav_btn{
    transform: translateX(3px);
}





/* ipad landscape */
@media screen and (max-width: 1024px){
    #proj .proj_wrap{
        width: 70%;
    }
}
/* ipad portrait */
@media screen and (max-width: 768px){
    #proj .proj_wrap{
        width: 75%;
    }
}
/* ip6p landscape */
@media screen and (max-width: 736px){
    #proj .proj_wrap{
        width: 70%;
    }

    .flickity-page-dots .dot{
        height: 4px;
        width: 4px;
    }

    #nav_btn{
        transform: translateX(-1px);
    }
}
/* ip6p portrait */
@media screen and (max-width: 414px){
    #proj .proj_wrap{
        width: 85%;
    }
    #proj .sliders{
        height: 60vh;
    }

    #proj .sliders img{
        max-width: none;
        /*max-height: 100%;*/
        height: 60vh;
    }

    #proj{
        margin-top: 1.5em;
    }
    #proj .icon_close{
        margin-bottom: 2em;
    }

    #proj .icon_close img{
        width: calc(0.7em  * (5/4) );
    }


    #nav_btn{
        transform: translateX(-1px);
    }
    #loading{
        left: calc(50vw - 10px);
    }
    body{
        font-size: 0.8em;
    }
}
