@import '../bower_components/pure/pure-min.css';
@import '../bower_components/pure/grids-responsive-min.css';
@import '../css/pure-extend.css';
@import '../css/extra.css';
@import '../bower_components/font-awesome/css/font-awesome.min.css';
@import '../bower_components/TurnWheel/jReject/css/jquery.reject.css';

.wrapper {
    width: auto;
}

.label {
    max-width: none;
    height: auto;
}

.canvas {
    margin-bottom: 15px;
}

.canvas.big img.element {
    object-fit: cover;
}

section.boxes {
    margin: 0 0;
    width: auto;
}

section.boxes > div {
    padding: 0 15px;
    margin: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background: none;
}

section.boxes .box {
    position: relative;
}

section.boxes .box .box-content {
    background: #fff;
    position: relative;
}

.box-label {
    left: 8px;
}

div.page-content {
    margin-bottom: 15px;
}
#WPboxes {
  display: flex;
  justify-content: center
}

#WPboxes .box {
    width: 24%;
    height: auto !important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: flex;
}

#WPboxes .box.col-2 {
    width: 38%;
}

#WPboxes .box.col-3 {
    width: 33%;
}

.box .box-content {
    width: auto;
    /*height: 100%;*/

    /*min-height: 256px;*/
    /*min-height: 229px;*/
     flex: 1;
    align-items: stretch;
}

.box.box.col-2.one-cont .box-content {
    width: auto;
    display: block;
}

.box .box-content a {
    display: block;
}

.box .box-content a img {
    display: block;
    width: 100%;
    height: auto;
}

.sidebar .page-content {
    width: auto;
    float: none;
    margin: 0;
}

.sliding-content {
    padding: 0 20px 0 20px;
}

div.page-content iframe {
    max-width: 100%;
}

div.article-content a {
    display: inline-block;
    max-width: 100%;
    height: auto;
}

div.article-content img {
    max-width: 100%;
    height: auto;
}

div.article-content span[id] {
    display: block;
}

div.article-content span[id] iframe {
    width: 100%;
    min-height: 30vw;
}

.main-nav .level-2 .content li.item {
    overflow: visible;
}

.boxshadow .box:before {
    display: none;
}

aside {
    width: 20%;
}

header.header {
    height: 132px;
    background: #fff;
    padding: 0;
    width: auto;
    padding-bottom: 32px;
}

header.header.index-h {
    padding-bottom: 0;
    height: 100px;
}

.header #header-ft {
    position: absolute;
    left: 0;
    bottom: -32px;
}

header.header .wrapper {
    height: 100%;
}

div.header-content {
    position: relative;
    height: 100%;
}

div.topLogo {
    position: absolute;
    top: 10px;
    left: 10px;
    margin: 0 !important;
    z-index: 852;
}

div.topLogo a {
    display: block;
    margin: 0 !important;
}

.top-nav {
    position: absolute;
    bottom: auto;
    top: 23px;
}

nav.main-nav {
    margin: 0;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
}

.mainContainer .blob {
    top: 10px;
}

section.naguaga .slideshow-mask {
    height: auto;
    max-width: none;
}

section.naguaga img.element {
    left: auto;
    margin: 0;
    width: 100%;
    height: auto;
}

aside .menu > ul {
    min-height: auto;
}

/*LISTS*/

/*INPUTS*/

/*HEADERS*/

/*BUTTONS*/

/*SPECIAL*/

/*MISC*/

/* XS */
@media (max-width: 767px) {

    #page {
        background: #fff;
        position: relative;
        z-index: 2;
    }

    #header {
        padding: 0;
        height: 70px !important;
    }

    a.smart_menu_caller {
        display: flex;
        color: #0087bf;
    }

    .container {
        width: auto;
    }

    div.mob_nav_container div.mob-nav-top-line {
        background: #0087bf;
        display: flex;
        justify-content: space-between;
        color: #fff;
    }


    div.mob-nav-top-line > div {
        width: 33.333%;
        border-left: 1px solid rgba(193, 217, 184, 0.3);
    }

    div.mob-nav-top-line a {
        display: block;
        text-align: center;
        color: #fff;
        padding: 15px;
    }

    div.mob_header_extention {
        display: block;
        position: absolute;
        left: 160px;
        top: 0;
        right: 70px;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }

    div.mob_header_extention > div {
        height: 70px;
    }

    div.mob-header-items {
        display: flex;
    }

    div.mob-header-items > div {
        border-right: 1px solid rgba(193, 217, 184, 0.3);
    }

    div.mob-search-container {
        display: block;
        height: 0;
        overflow: hidden;
        -webkit-transition: all ease 0.3s;
        -moz-transition: all ease 0.3s;
        -ms-transition: all ease 0.3s;
        -o-transition: all ease 0.3s;
        transition: all ease 0.3s;
    }

    div.mob-search-container.opened {
        height: 40px;
    }

    /* style sample */
    div.langs-select select {
        border: 0 !important;
        height: 70px !important;
        text-align: center !important;
        font-size: 16px !important;
        padding: 0 15px !important;
        position: static !important;
        opacity: 1 !important;
        background: none !important;
    }

    div.langs-select select option {

    }

    div.langs-select select + span {
        display: none !important;
    }

    /* style sample */
    div.mob_search a {
        display: flex;
        height: 70px;
        width: 60px;
        align-items: center;
        justify-content: center;
        font-size: 16px;
        text-decoration: none;
    }

    header.header {
        height: 70px;
        margin: 0 -15px;
    }

    div.header-content {
        display: none;
    }

    section.canvas.big {
        width: auto;
        margin: 0 -15px 15px;
    }

    .site-content {
        overflow: visible;
    }

    .big .slideshow-mask {
        height: 50vw;
    }

    .canvas.big img.element {
        height: 50vw;
        width: auto;
        margin: 0;
        left: auto;
    }

    div.topLogo {
        top: 15px;
    }

    section.boxes {
        margin-left: -15px;
        margin-right: -15px;
    }
    #WPboxes  {
      display: block;
    }
    #WPboxes .box {
        width: 100% !important;
        float: none !important;
        display: block;
    }

    #WPboxes .box  {
        margin-top: 15px;
        display: block;
    }

    .box .box-content {
        min-height: auto;
        width: 100%;
    }

    footer.footer {
        margin-left: -15px;
        margin-right: -15px;
        width: auto !important;
    }

    .footer .footer-black .wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .footer .footer-black .wrapper > div {
        margin: 0;
    }

    section.naguaga {
        margin-left: -15px;
        margin-right: -15px;
        width: auto;
    }

    .sliding-content {
        padding: 0;
        display: flex;
        flex-direction: column-reverse;
    }

    .page-content .box-tall {
        float: none;
        margin: 0 !important;
        display: block;
        width: auto;
    }

    .box.no-img.box-tall .box-content .form > * {
        display: block;
    }

    .box.no-img.box-tall .box-content .form > * input {
        margin-right: 0;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
    }

    .box.no-img.box-tall .box-content .form > * textarea {
        margin-right: 0;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
    }

    #Products .col-2 {
        width: auto;
        float: none;
    }

    aside {
        width: auto;
        float: none;
        overflow: hidden;
    }

    aside .menu > ul {
        float: none;
        width: auto;
    }

    .article-content {
        margin-bottom: 15px;
    }

    .product .half {
        width: auto;
        float: none;
    }

    div.product-slider {
        margin-top: 15px;
    }

    .main-nav {
        margin: 0;
    }

    .main-nav ul {
        display: block;
        list-style: none;
    }

    .main-nav ul > li {
        float: none !important;
        width: auto !important;
        display: block !important;
        text-align: center;
        position: relative;
    }

    .main-nav ul > li .fa {
        width: 40px;
        height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #fff;
        font-size: 18px;
        position: absolute;
        right: 0;
        top: 0;
        z-index: 3;
        cursor: pointer;
        -webkit-transition: all ease 0.3s;
        -moz-transition: all ease 0.3s;
        -ms-transition: all ease 0.3s;
        -o-transition: all ease 0.3s;
        transition: all ease 0.3s;
        text-shadow: 0 0 1px #000;
    }

    .main-nav ul > li > a {
        display: block !important;
        border-bottom: 1px solid #222;
        height: auto !important;
        line-height: 1.2 !important;
        padding: 15px !important;
        text-align: left !important;
    }

    .main-nav ul > li > a > span {
        margin: 0 !important;
        border: 0 !important;
    }

    .main-nav ul ul > li > a {
        border-color: #a8a8a8;
        padding: 11px 15px !important;
        font-size: 12px !important;
    }

    .main-nav .container {
        position: static;
        padding: 0;
    }

    .main-nav .container > ul{
        display: block !important;
        overflow: hidden;
        max-height: 0;
        position: static;
        -webkit-transition: all ease 0.3s;
        -moz-transition: all ease 0.3s;
        -ms-transition: all ease 0.3s;
        -o-transition: all ease 0.3s;
        transition: all ease 0.3s;
    }

    .main-nav ul > li.lighted > .container > ul {
        display: block !important;
        max-height: 300px;
    }

    .main-nav ul > li.lighted > .fa{
        transform: rotate(180deg);
    }

    .top-nav {
        position: static;
        float: none;
        background: #000;
    }

    .top-nav ul {
        list-style: none;
    }

    .top-nav li {
        float: none;
        padding: 0;
    }

    .top-nav li.lang-item {
        display: none;
    }

    .top-nav li a {
        text-align: left;
        display: block !important;
        border-bottom: 1px solid #222;
        height: auto !important;
        line-height: 1.2 !important;
        color: #fff;
        text-decoration: none !important;
        padding: 15px !important;
    }

    .top-nav li.selected a,
    .top-nav li:hover a {
        background: #fff;
        color: #000;
    }

    /*For mobile viewport*/
    .mobile-menu-toggler {
        display: flex !important;
        padding: 15px;
        border: 1px solid #000;
        position: relative;
        justify-content: space-between;
        align-items: center;
        z-index: 2;
        background: #fff;
        text-transform: uppercase;
    }

    .mobile-menu-toggler .fa {
        font-size: 18px;
        -webkit-transition: all ease 0.3s;
        -moz-transition: all ease 0.3s;
        -ms-transition: all ease 0.3s;
        -o-transition: all ease 0.3s;
        transition: all ease 0.3s;
    }

    .mobile-menu-toggler.opened .fa {
        transform: rotate(180deg);
    }

    aside nav.menu {
        max-height: 0;
        overflow: hidden;
        -webkit-transition: all ease 0.3s;
        -moz-transition: all ease 0.3s;
        -ms-transition: all ease 0.3s;
        -o-transition: all ease 0.3s;
        transition: all ease 0.3s;
    }

    aside nav.menu.opened {
        max-height: 500px;
    }

}

/* SM */
@media /*(min-width: 568px) and */
(max-width: 767px) {

}

/* */
@media (min-width: 768px) {

}

/* MD */
@media (min-width: 768px) and (max-width: 1023px) {

    .mainContainer .blob {
        display: none;
    }

}

/* LG */
@media (min-width: 1024px) and (max-width: 1279px) {

}

/* XL */
@media (min-width: 1280px) {

}

/* PORTRAIT ORIENTATION*/
@media all and (orientation: portrait) {
}

/* LANDSCAPE ORIENTATION*/
@media all and (orientation: landscape) {
}
