/*Large*/
@media (min-width: 1240px) {
    /*flex*/
    .block-lg{display: block;}
}
/*xxsmall - medium*/
@media (max-width: 1239px) {

    /*
     * Bootstrap
     */

    /* end Bootstrap */

    /* mmenu */
    .mm-menu {
        max-width: 360px;
        background-color: #f2f2f2;
        border-color: #dadbdb;
        color: #2e383f;
        z-index: 10;
    }
    @media all and (min-width: 450px) {
        html.mm-opening .mm-slideout {
            -webkit-transform: translate(360px, 0);
            -moz-transform: translate(360px, 0);
            -ms-transform: translate(360px, 0);
            -o-transform: translate(360px, 0);
            transform: translate(360px, 0); }
        html.mm-right.mm-opening .mm-slideout {
            -webkit-transform: translate(-360px, 0);
            -moz-transform: translate(-360px, 0);
            -ms-transform: translate(-360px, 0);
            -o-transform: translate(-360px, 0);
            transform: translate(-360px, 0); } }
    .mm-menu a:hover,
    .mm-menu a:active {
        color: #d1088e;
    }
    .mm-menu .mm-navbar {
        height: 50px;
        background-color: #d1088e;
        color: white;
        border-bottom-color: #e7a4d1;
    }
    .mm-menu .mm-navbar .mm-btn {
        width: 50px;
        height: 50px;
    }
    .mm-menu .mm-navbar .mm-title {
        text-transform: uppercase;
        font-weight: bold;
        text-align: left;
        font-size: 17px;
    }
    .mm-menu .mm-navbar .mm-btn {
        font-weight: bold;
        font-size: 17px;
        line-height: 1em;
    }
    .mm-menu .mm-navbar .mm-hidden+.mm-title {
        margin-left: -20px;
    }
    .mm-menu .mm-navbar .mm-title .fa {
        margin-right: 10px;
    }
    .mm-menu .mm-navbar > *, .mm-menu .mm-navbar a {
        padding: 15px 0;
        color: white;
    }
    .mm-menu .mm-navbar .mm-btn:before, .mm-menu .mm-navbar .mm-btn:after {
        border-color: white;
    }
    .mm-menu > .mm-panel > [class^="col-"] > .mm-listview {
        margin: 20px -20px;
    }
    .mm-menu > .mm-panel > [class^="col-"] > .mm-listview:first-child {
        margin-top: -20px;
    }
    .mm-menu .mm-listview > li > a, .mm-menu .mm-listview > li > span {
        padding: 15px 10px 15px 20px;
    }
    .mm-menu .mm-listview > li.active,
    .mm-menu .mm-listview > li:hover {
        background-color: white;
    }
    .mm-menu .mm-listview > li > a.blue {
        color: #323694;
    }
    .mm-menu .mm-listview > li:not(.mm-divider):after {
        left: 0;
    }

    .mm-menu.mm-hasnavbar-top-1 .mm-panel {
        top: 50px;
    }
    .mm-opening .mm-menu {
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.75);
    }

    #mm-on-canvas-catalog.mm-menu .mm-panel:not(:nth-of-type(-n+2)) .mm-listview .mm-next + a,
    #mm-on-canvas-catalog.mm-menu .mm-panel:not(:nth-of-type(-n+2)) .mm-listview .mm-next + span {
        height: 40px;
    }
    #mm-on-canvas-catalog.mm-menu .mm-panel:not(:nth-of-type(-n+2)) .mm-listview > li > a,
    #mm-on-canvas-catalog.mm-menu .mm-panel:not(:nth-of-type(-n+2)) .mm-listview > li > span {
        padding: 10px 10px 10px 20px;
    }
    #mm-on-canvas-catalog.mm-menu .mm-panel:nth-of-type(-n+2) .mm-listview > li.active:not(:hover) {
        background-color: inherit;
    }
    #mm-on-canvas-catalog.mm-menu .tab-content {
        background-color: transparent;
    }
    #mm-on-canvas-catalog.mm-menu .tab-content > .tab-pane {
        display: block;
    }

    #mm-on-canvas-menu.mm-menu .mm-panel {
        text-transform: uppercase;
        font-weight: bold;
        font-size: 17px;
    }

    header .header-feedback {
        margin-right: 0;
    }
}

/*Medium*/
@media (min-width: 992px) and (max-width: 1239px) {
    /*flex*/
    .block-md{display: block;}

    .row-protruding {
        margin: 0 -16px;
    }
    header .navbar-blue .our-sities {
        width: 148px;
    }
    .work-area img {
        max-width: 100%;
        height: auto !important;
        width: auto !important;
    }
}

/*xxsmall - small*/
@media (max-width: 991px) {

    img {max-width: 100%; height: auto;}
    iframe{max-width: 100%; height: auto;}

    #element-description iframe {
        height: 315px;
    }
    .work-area img {
        max-width: 100%;
        height: auto !important;
        width: auto !important;
    }
    .work-area-default{margin-top: 0;}

    /*
     * Bootstrap
     */
    .breadcrumb{margin: 0; padding: 10px 18px;}
    .breadcrumb > li + li::before{display: none;}
    .breadcrumb li:not(.last-link-wrapper){display: none;}
    .breadcrumb li span{display: none;}
    .breadcrumb li a{font-size: 16px; padding-left: 20px; position: relative; color: #323694;}
    .breadcrumb li a:before{
        position: absolute;
        display: block;
        content: '\f104';
        font-family: 'FontAwesome';
        font-weight: normal;
        font-style: normal;
        top: 0;
        font-size: 18px;
        color: #323694;
    }

    /* Tabs */
    .nav-tabs.nav-justified > li > a {
        font-size: 17px;
        line-height: 1.1765em;
        border-radius: 0;
        text-transform: uppercase;
        margin-bottom: 0;
    }
    .nav-tabs.nav-justified > li > a:hover,
    .nav-tabs.nav-justified > .active > a,
    .nav-tabs.nav-justified > .active > a:hover,
    .nav-tabs.nav-justified > .active > a:focus {
        background: #d1088e;
        color: white;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }
    .nav-tabs.nav-justified > li:not(:last-of-type) > a {
        border-right: 1px solid #bebfc1;
    }

    .text.error:before {
        right: 6px !important;
        bottom: 19px !important;
        top: auto !important;
        left: auto !important;
    }
    .text.error:after {
        transform: rotate(90deg);
        top: auto !important;
        right: 18px !important;
        bottom: 10px !important;
        left: auto !important;
    }

    header .navbar-blue .header-feedback {
        float: left;
    }
    header .main-header .about-box {
        display: none;
    }
    header .main-header .contacts-wrapper {
        width: 100%;
    }
    header .top-menu.navbar-inverse {
        background-color: #ffffff;
        border-top: 1px solid #cfcfcf;
        border-bottom: 1px solid #cfcfcf;
    }
    header .top-menu.navbar-inverse .navbar-nav > li > a {
        color: #2e383f;
    }
    header .top-menu.navbar-inverse .catalog-nav {
        background-color: #ffffff;
    }
    header .top-menu.navbar-inverse .search-box .input-lg {
        border-width: 2px;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
    }
    header .top-menu.navbar-inverse .search-box .form-control {
        background-color: #ffffff;
        border: none;
    }
    header .top-menu.navbar-inverse .search-box .form-control::-moz-placeholder {
        color: #414141;
        opacity: 1;
    }
    header .top-menu.navbar-inverse .search-box .form-control:-ms-input-placeholder {
        color: #414141;
    }
    header .top-menu.navbar-inverse .search-box .form-control::-webkit-input-placeholder {
        color: #414141;
    }
    header .top-menu.navbar-inverse .search-box .btn {
        background-color: buttonface;
        color: #414141;
    }
    header .top-menu.navbar-inverse .row > .navbar-left > li {
        border-right: 1px solid #cfcfcf;
    }
    header .top-menu.navbar-inverse .row > .navbar-right > li {
        border-left: 1px solid #cfcfcf;
    }
    footer{padding-bottom: 60px;}
    #footbar{display: none;}

    header .navbar-blue .row.row-protruding{
      display: flex;
      flex-wrap: wrap;
    }

    header .navbar-blue .our-sities{
      order: 1;
      flex-grow: 1;
    }

    header .navbar-blue .navbar-nav{
      order: 4;
      width: 100%;
      display: flex;
      background-color: #000;
      position: relative;
    }

    header .navbar-blue .navbar-nav:before{
      content: "";
      width: 100vw;
      height: 40px;
      background-color: #000;
      position: absolute;
      left: calc((100vw - 768px) / -2);
      bottom: 0;
    }

    header .navbar-blue .header-feedback{
      order: 2;
      flex-grow: 1;
    }

    header .navbar-blue .small-header-city{
      order: 3;
      margin-right: 0;
    }

    header .navbar-blue>li{
      flex-grow: 1;
      text-align: center;
    }


}

/*Small*/
@media (min-width: 768px) and (max-width: 991px) {
    /* kkm framework */
    .h1{padding: 0 20px;}
    .work-area-default .h1{padding: 0;}
    .content-title .h1{padding: 0;}
    .content-title{display: block; margin: 10px 0px 25px; padding: 0 20px;}
    .work-area-default .content-title{padding: 0;}
    .block-sm{display: block;}

    header .navbar-blue .header-city-select {
        line-height: 40px;
        text-transform: none;
    }
    header .navbar-blue .header-city-select .fa-globe {
        color: white;
    }
    header .navbar-blue .header-city-select .header-city {
        color: white;
        border-color: white;
        line-height: 1.5em;
    }
    header .navbar-blue .header-city-select .dropdown-menu {
        line-height: 1.5em;
        margin-top: 0;
    }

    footer .container{padding: 0 16px;}
    footer .navbar-nav > li > a{padding: 4px 5px;}
    footer .row-protruding{margin: 0;}
    footer .copyright{padding: 0;}
}

/*Extra small*/
@media (max-width: 767px) {
    #element-tech {
        padding: 20px 0;
        overflow: auto;
    }
    /*
     * Bootstrap
     */
     header .navbar-blue .navbar-nav,
     header .navbar-blue .our-sities{
       display: none;
     }
     header .navbar-blue .row.row-protruding{
       display: block;
     }
    .navbar-nav {
        float: left;
        margin: 0;
    }
    .navbar-right {
        float: right !important;
        margin-right: 0px;
    }
    .navbar-nav > li {
        float: left;
    }
    .navbar-form {
        width: auto;
        border: 0;
        margin-left: 0;
        margin-right: 0;
        padding-top: 0;
        padding-bottom: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
    .navbar-nav > li > a {
        padding-top: 15px;
        padding-bottom: 15px;
    }
    .navbar-nav .open .dropdown-menu {
        position: absolute;
        float: left;
        background-color: #ffffff;
        border: 1px solid #c2c4c5;
        -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
        -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    }

    /* Tabs */
    .nav-tabs.nav-justified li .tab-pane {
        display: none;
        background-color: #ffffff;
        border-bottom: 1px solid #d1d2d3;
    }
    .nav-tabs.nav-justified .active .tab-pane {
        display: block;
    }
    .nav-tabs.nav-justified > li > a {
        min-height: initial;
    }
    .nav-tabs.nav-justified > li:not(:last-of-type) > a {
        border: none;
    }
    .nav-tabs.nav-justified > li > a .fa-chevron-down {
        float: right;
    }
    .nav-tabs.nav-justified + .tab-content {
        margin-top: 0;
        border: none;
    }

    /* kkm framework */

    h1, .h1, .composite-title{font-size: 30px;}
    .h1{padding: 0 20px;}
    .work-area-default .h1{padding: 0;}
    .content-title .h1{padding: 0;}
    .content-title{display: block; margin: 10px 0px 25px;}
    .block-xs{display: block;}

    .margin-indent-xs {
        margin: 20px;
    }
    .margin-indent-h-xs {
        margin-left: 20px;
        margin-right: 20px;
    }
    .margin-indent-v-xs {
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .margin-indent-left-xs {
        margin-left: 20px;
    }
    .margin-indent-right-xs {
        margin-right: 20px;
    }
    .margin-indent-top-xs {
        margin-top: 20px;
    }
    .margin-indent-bottom-xs {
        margin-bottom: 20px;
    }

    .padding-indent-xs {
        padding: 20px;
    }
    .padding-indent-h-xs {
        padding-left: 20px;
        padding-right: 20px;
    }
    .padding-indent-v-xs {
        padding-top: 20px;
        padding-bottom: 20px;
    }
    .padding-indent-left-xs {
        padding-left: 20px;
    }
    .padding-indent-right-xs {
        padding-right: 20px;
    }
    .padding-indent-top-xs {
        padding-top: 20px;
    }
    .padding-indent-bottom-xs {
        padding-bottom: 20px;
    }

    /* popup */
    .popup {width: 100% !important;}
    body #popup {
        padding: 30px 50px;
        box-sizing: border-box;
        width: 100%;
        font-size: 16px;
    }

    body .confirm {
        padding: 20px 10px;
        box-sizing: border-box;
        width: 100%;
        font-size: 16px;
    }

    header .navbar-blue .row {
        text-align: center;
    }
    header .navbar-blue .header-feedback {
        float: none;
    }
    header .main-header .row {
        display: table;
        width: 100%;
    }
    header .main-header .logo-box {
        max-width: 310px;
    }
    header .main-header .logo-box .logo {
        width: 202px;
        background-size: 190px;
        height: 69px;
        margin: 0 auto;
    }
    header .main-header .contacts-wrapper {
        display: none;
    }

    header .main-header .xsmall-basket-small {
        min-width: 110px;
    }
    header .main-header .basket-small {
        width: 110px;
        border-left: 1px solid #d8d8d8;
    }
    header .main-header .basket-small .dropdown-toggle {
        line-height: 39px;
        text-align: center;
        font-size: 25px;
        color: #2e383f;
    }
    header .main-header .basket-small .dropdown-toggle {
        position: relative;
    }
    header .main-header .basket-small .badge {
        position: absolute;
        left: 59px;
        top: auto;
    }
    header .main-header .basket-small .dropdown-menu {
        left: auto;
        right: 0;
    }
    header .top-menu .navbar-nav > li > a .fa {
        overflow: hidden;
        margin-bottom: -4px;
    }
    header .top-menu .basket-small {
        display: none;
    }
    header .top-menu .menu-nav {
        width: 110px;
    }

    header .xsmall-header-city {
        position: relative;
    }
    header .xsmall-header-city .header-city-select {
        font-weight: bold;
        text-align: center;
        height: 44px;
        line-height: 17px;
        background-color: #f2f2f2;
        display: flex;
        align-items: center;
        justify-content: space-around;
        padding: 0 0 0 8px;
    }
    header .xsmall-header-city .header-city-select .header-city strong {
        font-weight: normal;
    }
    header .xsmall-header-city .header-city-select .dropdown-menu {
        line-height: 1.5em;
        font-weight: normal;
        margin-top: 0;
    }

    footer .logo-wrapper{
        float: none;
        width: inherit;
    }
    footer .logo-box .logo{margin: 0 auto;}
    footer .social{
        float: none;
        width: 100%;
        text-align: center;
        padding: 10px 0;
    }
    footer .container{position: relative;}
    footer .container .row{position: relative;}
    footer .navbar-nav{padding: 20px 0; }
    footer .navbar-nav > li{float: none;}
    footer .navbar-nav > li > a{padding: 3px 10px; text-align: center;}
    footer .row-protruding{
        border-top: 1px solid #2e2e6f;
        border-bottom: 1px solid #2e2e6f;
    }
    footer .copyright{
        padding: 10px 0 5px 0;
        font-size: 14px;
        border-top: 1px solid #2e2e6f;
    }
    footer .copyright .text-left{text-align: center;}
    footer .copyright .text-right{display: none;}

    /*list-box*/
    .list-box .list-column{border-bottom: none;}
    .list-box .list-column:last-child{border-bottom: 1px solid #d7d7d8;}

    .print{display: none;}
}

/*xsmall*/
@media (min-width: 480px) and (max-width: 767px) {

}

/*xxsmall*/
@media (max-width: 479px) {
    #element-description iframe {
        height: 240px;
    }

    /* Ext Bootstrap
     * Responsive utils
     */
    .visible-xxs {
        display: block !important;
    }
    .visible-xxs-block {
        display: block !important;
    }
    .visible-xxs-inline {
        display: inline !important;
    }
    .hidden-xxs {
        display: none !important;
    }

    header .dropdown.open {
        position: static;
    }
    header .dropdown.open .dropdown-menu {
        width: 100%;
    }

    header .main-header {
        position: relative;
    }

    header .top-menu .navbar-form .visible-xxs .btn {
        width: 100%;
        padding-top: 13px;
        padding-bottom: 13px;
    }
    header .top-menu .navbar-form .visible-xxs .btn,
    header .top-menu.navbar-inverse .navbar-form .visible-xxs .btn:hover
    {
        color: #2e383f;
        background-color: white;
    }
    header .top-menu .search-box .visible-xxs .btn .title {
        margin-left: 10px;
    }
    header .top-menu .search-box .input-group-btn {
        border-left: 1px solid #cfcfcf;
    }

    .work-area-default .content-title{margin: 10px -18px 25px;}
    .content-title .city-list{width: 100%; left: auto; right: auto;}
}

/*for form popup*/
@media (max-width: 634px) {
    .fancybox-inner {width: 100% !important; height: 100%!important;}
    .fancybox-close {background-position: -106px -77px;}
    .popup-content .float-left, .popup-content .float-right {width: 100%;}
    .popup-content .select-288 {width: 100% !important;}
    .popup-content .text {padding: 0;}
    .popup-content .text input {box-sizing: border-box;}
    .popup-content .cusel {margin: 0;}
    .popup-content .cusel.cuselOpen {z-index: 3;}
    .popup-content .cusel .cusel-scroll-wrap {box-sizing: content-box;}
    .popup-button .btn {width: 100%;}
    .popup-button  .policy-text{
        float:none;
        margin-top:10px;
    }
    .complaints2boss .float-left, .complaints2boss .float-right {width: 100% !important;}
}
@media (max-width: 767px) {
	.fancybox-wrap.fancybox-desktop.fancybox-opened{width:auto !important;}
}

@media (max-width: 550px) {
  header .main-header .logo-box .logo{
    margin: 0 0 0 20px;
    background-position: left center;
  }
}

@media (max-width: 380px) {
  .fancybox-wrap.fancybox-desktop.fancybox-opened{
    width: 100% !important;
  }
}

@media (max-width: 359px) {
    header .top-menu .search-box .btn .title {
        display: none;
    }
}