/**
 * @file
 * Visual styles for xxx's main-content component.
 */

.item-list li {
    margin: 0 0 0.25em 1.5em;
    padding: 0;
    text-decoration: none;
    list-style: none;
    float: left;
}

/* ----- Shadow top and bottom - xxx.xxx's ----- */

.slider-shadow-top {
    width: 100%;
    position: relative;
    top: 0px;
    height: 12px;
    background-image: url("https://assets.xxx.xxx/_images/slider-shadow-03.png");
    background-repeat: no-repeat;
    background-position: top center;
    z-index: 30;
}

.footer-shadow-bottom {
    background-image: url("https://assets.xxx.xxx/_images/slider-shadow-bottom-03.png");
    background-position: top center;
    background-repeat: no-repeat;
    width: 100%;
    height: 12px;
    border-bottom: 1px solid #d5d5d5;
}

#block-xxx-content .container-fluid .field-content img {
    width: 310px;
}

/**13-08-2018**/
#header .region-primary-menu .menu {
    width: 100%;
}
.view-id-taxonomy_term .box.col1.views-row .views-field.views-field-field-sitetags .field-content .taxonomy-term {
    float: left;
    padding: 0;
    height: auto;
    margin: -26px 0 0 0;
    width: auto;
}

.view-id-taxonomy_term .box.col1.views-row {
    padding: 0 0 20px 0;
}


/**14-08-2018*/

.main-content {
    width: 100%;
}
.menu-item.menu-item--expanded .menu {
    display: none;
}

#header .region-primary-menu .menu {
    width: 100%;
    position: relative;
}

#header .region.region-primary-menu .menu-item.menu-item--expanded:hover .menu {
    display: block;
    width: 100%;
    position: absolute;
    top: 48px;
    left: 0;
    z-index: 1;
    background: #fff !important;
    padding: 15px 15px;
    height: auto !important;
}

.menu-item.menu-item--expanded:hover .menu .menu-item {
    background: #f2f2f2;
    margin: 5px 5px;
}

.menu-item.menu-item--expanded .menu .menu-item {
    width: 23.9%;
    float: left;
}

.menu-item.menu-item--expanded .menu li a {
    color: #000;
    margin: 0;
    font-size: 15px;
    padding: 10px 0;
    width: 100%;
    text-align: center;
    text-transform: capitalize;
}

.menu-item.menu-item--expanded .menu li a:hover {
    background: #000;
    color: #fff;
}

.region-primary-menu .menu--main {
    clear: both;
    height: 48px;
    background: url("https://assets.xxx.xxx/_images/menu-bg.png") repeat 0 0;
    width: 100%;
}
#block-tagsmenu {
    display: none;
}
.region-primary-menu .menu--main .content .clearfix.menu .menu-item a:hover {
    border-bottom: none;
    color: #fff;
    cursor: pointer;
    background:#006699;
}

#header .menu-item.menu-item--expanded .menu li a {}
.menu--tags-menu #block-tagsmenu-menu {
    display:none;
}
.menu--tags-menu .content {
    display: none;
}
.menu--tags-menu .content .clearfix.menu {
    width: 100%;
    float: left;
    background: white;
}
.menu-item--active-trail a.is-active {
    background: #006699;
    color: #fff !important;
}
#block-tagsmenu .content .clearfix.menu .menu-item.menu-item--expanded {
    width: 100%;
    float: left;
}

/* ----- main-content components ----- */

.main-content .section {
    padding: 0 15px 0;
}
.main-content h2 {
    margin-bottom: 2px;
    font-size: 1.429em;
    line-height: 1.4;
}

.container-fluid {
    padding: 20px 0;
    margin: 0 auto;
    overflow: hidden;
    text-align: center;
}

.container-fluid .view-content {
    display: inline-block;
}

.box {
    line-height: 14px;
    float: left;
    margin: auto;
    border: 0;
    height: 228px;
    overflow: hidden;
    padding: 0;
    background: #fff;
    position: relative;
    border-radius: 6px;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.22);
}

.col1 {
    width: 100%;
    max-width: 310px;
    min-width: 196px;
    margin-left: 5px;
    margin-right: 5px;
    margin-bottom: 10px;
}

.views-field-field-product-uri-1 {
    height: 141px;
}

.views-field-field-product-uri .field-content {
    height: 12px;
    bottom: 0;
    background-color: #fff;
    text-shadow: none;
    position: relative;
    border-top: 1px solid #e0e0e0;
    width: inherit;
    font-family: Helvetica, Arial,sans-serif;
    padding: 12px 10px 15px 10px;
}
.views-field-field-product-uri .field-content a {
    font-size: 16px;
    color: #333;
    font-weight: 600;
}
.views-field-field-product-uri .field-content a:hover, .view-id-taxonomy_term .views-field-field-sitetags .is-active-tag a{
    color:#0099cc;
}

.views-field-field-sitetags .field-content a:hover, .view-id-taxonomy_term .views-field-field-sitetags .is-active-tag a{
    background: #51b3f2 !important;
    color: #fff;
    border-color: #51b3f2;
    display: inline !important;
}
.views-field-field-sitetags .field-content {
    padding: 10px;
    text-align: center;
    overflow: hidden;
}
.views-field-field-sitetags .field-content a {
    padding: 3px 4px 5px;
    display: inline-block;
    background: #fff;
    color: #444;
    margin: 1px;
    border-radius: 3px;
    margin-bottom: 0;
    font-weight: 100;
    font-size: 12px;
    font-family: Helvetica, Arial,sans-serif;
    border: 1px solid #d5d5d5;
    cursor: pointer;
}

@media all and (min-width: 851px) {
    .main-content {
        float: left; /* LTR */
        position: relative;
    }
    [dir="rtl"] .main-content {
        float: right;
    }
    .layout-two-sidebars .main-content {
        margin-left: 25%;
        margin-right: 25%;
        width: 50%;
    }
    .layout-one-sidebar .main-content {
        width: 75%;
    }
    .layout-no-sidebars .main-content {
        width: 100%;
    }
    .layout-sidebar-first .main-content {
        margin-left: 25%; /* LTR */
        margin-right: 0; /* LTR */
    }
    [dir="rtl"] .layout-sidebar-first .main-content {
        margin-left: 0;
        margin-right: 25%;
    }
    .layout-sidebar-second .main-content {
        margin-right: 25%; /* LTR */
        margin-left: 0; /* LTR */
    }
    [dir="rtl"] .layout-sidebar-second .main-content {
        margin-right: 0;
        margin-left: 25%;
    }

    /*#header .region-site-branding {width: 100%;}*/
}


@media all and (max-width: 545px) {
    .container-fluid {
        width: 96%;
    }
    #header .region-site-branding {width: 100%;}
    #header .site-branding__text {width: 45%;}
}

@media all and (min-width: 546px) and (max-width: 932px) {
    .container-fluid {
        width: 96%;
    }
    #header .region-site-branding {width: 100%;}
}

@media all and (min-width: 933px) and (max-width: 1317px) {
    .container-fluid {
        width: 960px;
    }
}

@media all and (min-width: 1318px) and (max-width: 1710px) {
    .container-fluid {
        width: 1280px;
    }
}

@media all and (min-width: 1711px) and (max-width: 1920px) {
    .container-fluid {
        width: 1600px;
    }
}

@media all and (min-width: 1921px) {
    .container-fluid {
        width: 1920px;
    }
}

/*responsive*/

@media all and (max-width: 1023px)
{
    .main-content .section {padding: 0 10px;}
    .container-fluid {width: 960px;}
    .region-site-branding {width: 980px;}
    .menu-item.menu-item--expanded .menu .menu-item {width: 23.2%; float: left;}
}

@media all and (max-width: 979px)
{
    .container-fluid {width: 740px;}
    .region-content .content .view-content .col1 {max-width: 360px; padding: 0px 0 60px 0}
    .region-content .content .view-content .col1 .field-content a img {width:100%}
    .region-content .content .views-field-field-product-uri-1 {height: auto;}
}

@media all and (max-width: 886px)
{
    #header .region.region-primary-menu .menu-item.menu-item--expanded:hover .menu {width: 92%; left: 7px; top:95px}
    .menu-item.menu-item--expanded .menu li a {padding: 10px 0;}
    .region-primary-menu .menu-item.menu-item--expanded:hover .menu .menu-item {height: 36px}
    .menu-item.menu-item--expanded .menu .menu-item {width: 23.5%; float: left;}
}

@media all and (max-width: 767px)
{
    .container-fluid {width: 96%;}
    .region-content .content .view-content .col1 {width: 48%; padding: 0px 0 30px 0;}
    .region-content .content .views-field-field-product-uri-1 {height: 153px;}
    .menu-item.menu-item--expanded .menu .menu-item {width: 23.3%; float: left;}
}

@media all and (max-width: 640px)
{
    .region-content .content .view-content .col1 {padding: 0px 0 0 0; width:47.7%;}
    #header .region.region-primary-menu .menu-item.menu-item--expanded:hover .menu {left: 7px; top: 96px;}
    #header .menu-item.menu-item--expanded .menu li a {font-size: 12px; padding: 10px 0;}
    #header .region-primary-menu .menu a {padding: 14px 18px;}
    .menu-item.menu-item--expanded .menu .menu-item {width: 22.9%;}
    .region-primary-menu .menu-item.menu-item--expanded:hover .menu .menu-item {height: 31px;}

}

@media all and (max-width: 540px)
{
    .region-contentt .content .view-content .col1 {width: 47.4%;}
    #header .region.region-primary-menu .menu-item.menu-item--expanded:hover .menu {width: 87%;}
    .menu-item.menu-item--expanded .menu .menu-item {width: 30.9%;}
}

@media all and (max-width: 480px)
{
    .region-content .content .view-content .col1 {padding: 0 0 60px 0; width: 100% !important; max-width:100%;margin: 0 0 10px 0;}
    .region-content .content .views-field-field-product-uri-1 {height: 205px;}
    .menu-item.menu-item--expanded .menu .menu-item {width: 46.4%;}
}

@media all and (max-width: 460px) {

    #header .site-branding__text {display: none;}
    .region-primary-menu .content {display: none;}
    .site-branding__logo {position: static;}
    .region-primary-menu {padding-top: 0;}
    #header .region-site-branding {width: 100%; text-align: center;}
    .site-branding__logo {position: static !important; }
    .region-primary-menu {position: relative; z-index: 999999; height: 0 !important;}
    .region-primary-menu .visually-hidden {position: absolute !important; height: 32px; width: 32px; margin: 0; color: #fff;
        font-size: 0; background: url(https://assets.xxx.xxx/images/if_Hamburger_Round_657905.png);
        background-repeat: no-repeat; cursor: pointer; top: -66px; left: 14px; z-index: 999999; overflow: visible; display: block; clip: initial;}
    .region-primary-menu .clearfix.menu {position: absolute !important; z-index: 1; background: #666;}
    .region-primary-menu .clearfix.menu .menu-item {background: #333; margin: 0 0 5px 0;}
    .region-primary-menu .menu--static-menu {background: #999 !important; height:auto !important}
    #header .slider-shadow-top {display: none;}
    .footer-shadow-bottom {display: none;}
    .region-primary-menu .menu--main {height: auto;}
    .menu-item.menu-item--expanded .menu .menu-item {width: 46.2%;}
    #block-tagsmenu .menu-item.menu-item--expanded .menu .menu-item {margin: 5px; background: #f2f2f2; width: 30.2%;}
    #da-cont {display: none;}
    .menu--tags-menu .content {display:block}
    .region-primary-menu .clearfix.menu .menu-item a {}
    .clearfix.region.region-header #block-tagsmenu {display: block; width:100%; border:none}
    #header .region-site-branding {background: #999;}
    #header .region-primary-menu .menu {height: auto; background: #333; }
    .menu--tags-menu #block-tagsmenu-menu {position: absolute !important; height: 40px; width: 32px; margin: 0; color: #fff; font-size: 0;
        background: url(https://assets.xxx.xxx/images/tags.png); background-repeat: repeat; background-repeat: no-repeat; cursor: pointer; top: 24px; right: 25px; z-index: 999999;  overflow: visible; display: block; clip: initial;}

    #block-tagsmenu .content .clearfix.menu {height: auto; padding: 0}
    .clearfix.region.region-header {height: 0;}
    #block-tagsmenu .content .clearfix.menu .menu-item.menu-item--expanded .menu {height: auto !important; background:none;}
    #block-tagsmenu .content .clearfix.menu .menu-item.menu-item--expanded a {display: none; padding:5px 0}
    #block-tagsmenu .content .clearfix.menu .menu-item.menu-item--expanded .menu .menu-item a {display: block}
    #block-tagsmenu .menu-item.menu-item--expanded .menu li a:hover {border-bottom: none; background: #006699; color:#fff;}
    #block-tagsmenu .content {margin: 22px 0 0 0;}
    .clearfix.region.region-header {width: 100%; padding: 0;}
}