/*
CTC Separate Stylesheet
Updated: 2019-02-11 23:15:57
Theme Name: Benko Child
Theme URI: http://benko.nanoagency.co
Template: benko/benko
Author: Nano Agency
Author URI: http://www.nanoagency.co/
Description: Benko – Creative Magazine is a template with luxury design for Politics, Culture, Fashion, LifeStyle… Not only the built-in modern design choices are aesthetically pleasing, it’s packed with multi possible layout combinations suitable for blog and elegant magazines. We believe that our template will appreciate and become very functional site.
Tags: two-columns,left-sidebar,accessibility-ready,custom-background,custom-colors,custom-header,custom-menu,editor-style,featured-images,microformats,post-formats,rtl-language-support,sticky-post,threaded-comments,translation-ready
Version: 1.0.1.1549926957
*/

@media (max-width: 1199px) {
    .slicknav_btn {
        margin: 0;
        top: 100px;
    }
}

@media (max-width: 767px) {
    div#footerBlockContainer > div:first-child {
        width: auto !important;
        text-align: center;
    }
    div#footerBlockContainer > div:first-child > div:nth-child(2) {
        display: none;
    }
    div#footerBlockContainer > div:first-child > div {
        float: none !important;
    }
    #benko-header {
        padding-top: 97px;
    }
    .slicknav_btn {
        top: 125px;
    }
    .slicknav_btn {
        margin: 0 !important;
        top: 100px;
    }
}

div#footerBlockContainer {
    width: 100% !important;
}

.header-banner {
    background-color: #ececec;
    color: gray;
    padding: 7px;
    font-size: 18px;
    text-align: center;
    border-bottom: 1px solid gray;
    position: fixed;
    width: 100%;
    z-index: 100000;
}
#benko-header {
    padding-top: 73px;
}

.header-banner__link {
    display: inline-block;
    background-color: #e4232e;
    color: #ffffff;
    padding: 15px;
    border-radius: 4px;
    text-decoration: none;
    margin: 5px 0 5px 5px;
}

.header-banner__link:hover,
.header-banner__link:focus {
    color: #ffffff;
}

#archive-sidebar {
    top: 93px;
}

.c-disclaimer {
    font-size: 11px;
    display: inline-block;
    color: #000;
    margin: 0px auto;
    text-decoration: none;
    cursor: pointer;
}

.c-disclaimer::before {
    background-image: url('/wp-content/themes/benkobenko-child/images/who-answers-question-mark.svg');
    background-repeat: no-repeat;
    display: inline-block;
    content: '';
    margin: 0 5px;
    width: 12px;
    height: 12px;
}

.c-disclaimer:active,
.c-disclaimer:focus,
.c-disclaimer:hover {
    color: #000;
}

a {
    color: #e4232e;
}

.modal {
    display: none;
    z-index: 1000000;
}

.modal.is-open {
    display: block;
}

.modal__overlay {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.75);
}

.modal__container {
    position: relative;
    background: #fff;
    overflow-y: auto;
    border-radius: 5px;
    max-width: 500px;
    max-height: 100vh;
    padding: 40px 20px 20px;
    font-size: 16px;
}

.modal__container h2 {
    margin-top: 0;
}

.modal__close {
    position: absolute;
    top: 5px;
    right: 5px;
    color: #000 !important;
    background: none !important;
    border: none;
    font-size: 28px;
}

.modal__close:hover {
    color: #000;
    background: #fff;
    border: none;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        visibility: hidden;
    }
    to {
        opacity: 1;
        visibility: visible;
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
        visibility: visible;
    }
    to {
        opacity: 0;
        visibility: hidden;
    }
}

@keyframes slideIn {
    from {
        transform: translateY(15%);
    }
    to {
        transform: translateY(0);
    }
}

@keyframes slideOut {
    from {
        transform: translateY(0);
    }
    to {
        transform: translateY(-10%);
    }
}

.micromodal-slide {
    display: none;
}

.micromodal-slide.is-open {
    display: block;
}

.micromodal-slide[aria-hidden='false'] .modal__overlay {
    animation: fadeIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden='false'] .modal__container {
    animation: slideIn 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden='true'] .modal__overlay {
    animation: fadeOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide[aria-hidden='true'] .modal__container {
    animation: slideOut 0.3s cubic-bezier(0, 0, 0.2, 1);
}

.micromodal-slide .modal__container,
.micromodal-slide .modal__overlay {
    will-change: transform;
}
