/* CSS grid styles for Fundspec */

/* Grid styles */


/* Normalize WP Gutengrid grid */


/*
.wp-block-columns {
    margin-bottom: 0px;
}*/

#page.site #page-wrap .grid-wrap .wp-block-column {
    margin-bottom: 0px !important;
}

#page.site #page-wrap .grid-wrap .wp-block-column.grid-wrap-item.grid-item[style^="flex-basis"] {
    flex-basis: auto !important;
}

#page.site #page-wrap .grid-wrap .wp-block-column.grid-wrap-item.grid-item[style="flex-basis:20%"],
#page.site #page-wrap .grid-wrap .wp-block-column.grid-wrap-item.grid-item[style="flex-basis:25%"],
#page.site #page-wrap .grid-wrap .wp-block-column.grid-wrap-item.grid-item[style="flex-basis:50%"],
#page.site #page-wrap .grid-wrap .wp-block-column.grid-wrap-item.grid-item[style="flex-basis:75%"],
#page.site #page-wrap .grid-wrap .wp-block-column.grid-wrap-item.grid-item[style="flex-basis:80%"] {
    flex-basis: auto !important;
}

#page.site #page-wrap .grid-wrap .wp-block-column.grid-item[style^="flex-basis"] {
    flex-basis: auto !important;
}

#page.site #page-wrap .grid-wrap .wp-block-column.grid-item[style="flex-basis:20%"],
#page.site #page-wrap .grid-wrap .wp-block-column.grid-item[style="flex-basis:25%"],
#page.site #page-wrap .grid-wrap .wp-block-column.grid-item[style="flex-basis:50%"],
#page.site #page-wrap .grid-wrap .wp-block-column.grid-item[style="flex-basis:75%"],
#page.site #page-wrap .grid-wrap .wp-block-column.grid-item[style="flex-basis:80%"] {
    flex-basis: auto !important;
}

@media screen and (min-width: 782px) {
    #page.site #page-wrap .grid-wrap .wp-block-column:not(:first-child) {
        margin-left: 0px;
    }
    #page.site #page-wrap .grid-wrap .wp-block-column:first-child {
        margin-left: 0px;
    }
}


/* @media screen and (min-width: 600px) { } */


/** Reset gutenberg styles from WP */


/** > reset */

#page.site #page-wrap .grid-wrap .wp-block-columns {
    display: flex;
    margin-bottom: 0px;
    flex-wrap: wrap;
}

@media (min-width:782px) {
    #page.site #page-wrap .grid-wrap .wp-block-columns {
        flex-wrap: nowrap;
    }
}

#page.site #page-wrap .grid-wrap .wp-block-column {
    margin-bottom: 1em;
    flex-grow: 1;
    min-width: 0;
    word-break: break-word;
    overflow-wrap: break-word;
}

@media (max-width:599px) {
    #page.site #page-wrap .grid-wrap .wp-block-column {
        flex-basis: auto !important;
    }
}

@media (min-width:600px) {
    #page.site #page-wrap .grid-wrap .wp-block-column {
        flex-basis: auto !important;
        flex-grow: 1;
    }
    #page.site #page-wrap .grid-wrap .wp-block-column:nth-child(2n) {
        margin-left: 0px;
    }
}

@media (min-width:782px) {
    #page.site #page-wrap .grid-wrap .wp-block-column:not(: first-child) {
        margin-left: 0px;
        flex-wrap: wrap;
    }
    .wp-block-columns {
        flex-wrap: wrap;
    }
}


/* sqpp new Grid styles */


/** .epgrid-11 > div[id^="CEP"] > div .grid-item */

.grid-wrap {
    margin-bottom: 20px;
}

.grid-wrap {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-right: -10px;
    margin-left: -10px;
    /*background-color: cyan;*/
}

.grid-wrap .grid-wrap-item {
    padding-top: 0px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
    /*background-color: yellow;*/
    flex-basis: auto;
    box-sizing: border-box;
}

.grid-wrap .grid-wrap-item:first-of-type {
    padding-bottom: 0px;
}


/** Mobile first grid */

#page.site #page-wrap .grid-wrap-1-4 .grid-wrap-item:first-of-type {
    width: 100% !important;
    /*background-color: yellow;*/
}

#page.site #page-wrap .grid-wrap-1-4 .grid-wrap-item:last-of-type {
    width: 100% !important;
    /*background-color: orange;*/
}

@media screen and (min-width: 501px) {
    #page.site #page-wrap .grid-wrap-1-4 .grid-wrap-item:first-of-type {
        width: 100% !important;
    }
    #page.site #page-wrap .grid-wrap-1-4 .grid-wrap-item:last-of-type {
        width: 100% !important;
    }
}

@media screen and (min-width: 901px) {
    #page.site #page-wrap .grid-wrap-1-4 .grid-wrap-item:first-of-type {
        width: 100% !important;
    }
    #page.site #page-wrap .grid-wrap-1-4 .grid-wrap-item:last-of-type {
        width: 100% !important;
    }
}

@media screen and (min-width: 1201px) {
    .grid-wrap {
        flex-wrap: nowrap;
    }
    #page.site #page-wrap .grid-wrap-1-4 .grid-wrap-item:first-of-type {
        width: 20% !important;
    }
    #page.site #page-wrap .grid-wrap-1-4 .grid-wrap-item:last-of-type {
        width: 80% !important;
    }
}


/* > copy past 
@media screen and (min-width: 1201px) { #page.site #page-wrap {}}
@media screen and (min-width: 901px) { #page.site #page-wrap {}}
@media screen and (min-width: 501px) { #page.site #page-wrap {}}
*/


/** Embeded grid */

.ggrid>div,
.epgrid>div[id^="CEP"]>div,
.grid,
.grid-11,
.grid-211,
.grid-112,
.grid-1111 {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-right: -10px;
    margin-left: -10px;
    /*background-color: magenta;*/
    /* width: 100%; > if set does not fill full length */
    width: calc(100% + 20px);
}

.wp-block-group__inner-container {
    margin-right: 0px !important;
    margin-left: 0px !important;
}


/* sqpp */

.grid-wrap .grid-wrap-item:last-of-type {
    margin-bottom: -20px !important;
}

.ggrid>div,
.epgrid>div[id^="CEP"]>div,
.grid-wrap-item .grid:last-of-type {
    margin-bottom: -20px !important;
}


/** grid padding rules */

.ggrid>div .grid-item,
.epgrid>div[id^="CEP"]>div .grid-item,
.grid-11 .grid-item,
.grid-211 .grid-item,
.grid-112 .grid-item,
.grid-1111 .grid-item {
    padding-top: 0px;
    padding-right: 10px;
    padding-bottom: 20px;
    padding-left: 10px;
}

.ggrid>div .grid-item,
.epgrid>div[id^="CEP"]>div .grid-item,
.grid>.grid-item {
    flex-grow: unset !important;
}


/** grid padding rules exceptions */


/*** > nth-last-child(1) = last-child-of */


/*** > nth-last-child(2) = is the second last child */


/*
.grid-wrap-1-4 .grid-11 .grid-item:nth-last-child(1),
.grid-wrap-1-4 .grid-211 .grid-item:nth-last-child(1),
.grid-wrap-1-4 .grid-112 .grid-item:nth-last-child(1),
.grid-wrap-1-4 .grid-1111 .grid-item:nth-last-child(1) {
    padding-top: 0px;
    padding-right: 10px;
    padding-bottom: 0px;
    padding-left: 10px;

}
*/


/* @media screen and (min-width: 1201px) { .site {}} > not needed */


/*
@media screen and (min-width: 901px) { 

}
@media screen and (min-width: 782px) { 

}
@media screen and (min-width: 600px) { 

}
@media screen and (min-width: 501px) { 

}
*/


/** Mobile first grid */


/* > copy past 
@media screen and (min-width: 1201px) {  {}}
@media screen and (min-width: 901px) {  {}}
@media screen and (min-width: 501px) {  {}}
*/

.ggrid.grid-11>div .grid-item,
.epgrid-11>div[id^="CEP"]>div .grid-item,
.grid-11>.grid-item {
    width: 100%;
}

.grid-211>.grid-item:nth-of-type(3n+1) {
    width: 100%;
}

.grid-211>.grid-item:nth-of-type(3n+2) {
    width: 100%;
}

.grid-211>.grid-item:nth-of-type(3n+3) {
    width: 100%;
}

.grid-112>.grid-item:nth-of-type(3n+1) {
    width: 100%;
}

.grid-112>.grid-item:nth-of-type(3n+2) {
    width: 100%;
}

.grid-112>.grid-item:nth-of-type(3n+3) {
    width: 100%;
}

.ggrid.grid-1111>div .grid-item,
.epgrid-1111>div[id^="CEP"]>div .grid-item,
.grid-1111>.grid-item {
    width: 100%;
}

/** sqpp-home-row-views */
.video-single-featured-newest {
    padding-bottom: 20px;
}
.video-single-featured-newest.video-single-featured-newest-3 {
    padding-bottom: 0px;
}

@media screen and (min-width: 501px) {
    .ggrid.grid-11>div .grid-item,
    .epgrid-11>div[id^="CEP"]>div .grid-item,
    .grid-11>.grid-item {
        width: 100%;
    }
    .grid-211>.grid-item:nth-of-type(3n+1) {
        width: 100%;
    }
    .grid-211>.grid-item:nth-of-type(3n+2) {
        width: 50%;
    }
    .grid-211>.grid-item:nth-of-type(3n+3) {
        width: 50%;
    }
    .grid-112>.grid-item:nth-of-type(3n+1) {
        width: 50%;
    }
    .grid-112>.grid-item:nth-of-type(3n+2) {
        width: 50%;
    }
    .grid-112>.grid-item:nth-of-type(3n+3) {
        width: 100%;
    }
    .ggrid.grid-1111>div .grid-item,
    .epgrid-1111>div[id^="CEP"]>div .grid-item,
    .grid-1111>.grid-item {
        width: 50%;
    }
}

@media screen and (min-width: 901px) {
    .ggrid.grid-11>div .grid-item,
    .epgrid-11>div[id^="CEP"]>div .grid-item,
    .grid-11>.grid-item {
        width: 50%;
    }
    .grid-211>.grid-item:nth-of-type(3n+1) {
        width: 50%;
    }
    .grid-211>.grid-item:nth-of-type(3n+2) {
        width: 25%;
    }
    .grid-211>.grid-item:nth-of-type(3n+3) {
        width: 25%;
    }
    .grid-112>.grid-item:nth-of-type(3n+1) {
        width: 25%;
    }
    .grid-112>.grid-item:nth-of-type(3n+2) {
        width: 25%;
    }
    .grid-112>.grid-item:nth-of-type(3n+3) {
        width: 50%;
    }
    .ggrid.grid-1111>div .grid-item,
    .epgrid-1111>div[id^="CEP"]>div .grid-item,
    .grid-1111>.grid-item {
        width: 25%;
    }
    .video-single-featured-newest.video-single-featured-newest-1,
    .video-single-featured-newest.video-single-featured-newest-2 {
        padding-bottom: 0px;
    }
}

@media screen and (min-width: 1201px) {
    .ggrid.grid-11>div .grid-item,
    .epgrid-11>div[class^="CEP"]>div .grid-item,
    .grid-11>.grid-item {
        width: 50%;
    }
    .grid-211>.grid-item:nth-of-type(3n+1) {
        width: 50%;
    }
    .grid-211>.grid-item:nth-of-type(3n+2) {
        width: 25%;
    }
    .grid-211>.grid-item:nth-of-type(3n+3) {
        width: 25%;
    }
    .grid-112>.grid-item:nth-of-type(3n+1) {
        width: 25%;
    }
    .grid-112>.grid-item:nth-of-type(3n+2) {
        width: 25%;
    }
    .grid-112>.grid-item:nth-of-type(3n+3) {
        width: 50%;
    }
    .ggrid.grid-1111>div .grid-item,
    .epgrid-1111>div[class^="CEP"]>div .grid-item,
    .grid-1111>.grid-item {
        width: 25%;
    }
}


/* Sub Grid aka subgrid styles */


/** Embeded grid */

.subgrid,
.subgrid-11,
.subgrid-12,
.subgrid-21,
.subgrid-13,
.subgrid-31,
.subgrid-14,
.subgrid-41 {
    display: flex;
    flex-direction: row;
    margin-right: -10px;
    margin-left: -10px;
    /*background-color: magenta;*/
    /* width: 100%; > if set does not fill full length */
    width: calc(100% + 20px);
}

.grid-wrap-item .subgrid:last-of-type {
    margin-bottom: -20px;
}

.grid-item .subgrid:last-of-type {
    margin-bottom: -20px;
}
.grid-item .subgrid.subgrid-13:last-of-type {
    margin-bottom: 0px !important;
}


/* grid padding rules */

.subgrid .subgrid-item,
.subgrid-11 .subgrid-item,
.subgrid-12 .subgrid-item,
.subgrid-21 .subgrid-item,
.subgrid-13 .subgrid-item,
.subgrid-31 .subgrid-item,
.subgrid-14 .subgrid-item,
.subgrid-41 .subgrid-item {
    padding-top: 0px;
    padding-right: 10px;
    padding-bottom: 0px;
    padding-left: 10px;
}

.subgrid-11>.subgrid-item {
    width: 50%;
}


/* > nth-calc seems to be worng */


/*
.subgrid-12 .subgrid-item:nth-of-type(2n+1) {
    width: 34%;
}
.subgrid-12 .subgrid-item:nth-of-type(2n+2) {
    width: 66%;
}*/

.subgrid-12>.subgrid-item:nth-of-type(2n+1) {
    width: 34%;
}

.subgrid-12>.subgrid-item:nth-of-type(2n+2) {
    width: 66%;
}

.subgrid-21>.subgrid-item:nth-of-type(2n+1) {
    width: 66%;
}

.subgrid-21>.subgrid-item:nth-of-type(2n+2) {
    width: 34%;
}

.subgrid-13>.subgrid-item:nth-of-type(2n+1) {
    width: 25%;
}

.subgrid-13>.subgrid-item:nth-of-type(2n+2) {
    width: 75%;
}

.subgrid-31>.subgrid-item:nth-of-type(2n+1) {
    width: 75%;
}

.subgrid-31>.subgrid-item:nth-of-type(2n+2) {
    width: 25%;
}

.subgrid-14>.subgrid-item:nth-of-type(2n+1) {
    width: 20%;
}

.subgrid-14>.subgrid-item:nth-of-type(2n+2) {
    width: 80%;
}

.subgrid-41>.subgrid-item:nth-of-type(2n+1) {
    width: 80%;
}

.subgrid-41>.subgrid-item:nth-of-type(2n+2) {
    width: 20%;
}


/** auto-grid > temp > switch to other style, then delete */

.auto-grid-item {
    padding-bottom: 20px;
}

div>div.auto-grid-item:last-of-type {
    padding-bottom: 0px;
}

.video-content-after-wrap {
    padding-right: 10px;
    padding-left: 10px;
}

/** Beyond grid styles - temp sqpp */

/*** Genaral and mobile first Beyond grid style */

.clear:before,
.clear:after {
    content: "";
    display: table;
    table-layout: fixed;
}

.clear:after {
    clear: both;
}

/*.ratio-16-9, .child-ratio-16-9>div, .ratio-16-9-box, .child-ratio-16-9-box>div {
    padding-bottom: 56.25%;
}*/
.ratio-16-9,
.beyond-ratio {
    padding-bottom: 56.25%;
}

.margin-bottom-0 {
    margin-bottom: 0px;
}
.margin-bottom-5 {
    margin-bottom: 5px;
}
.margin-bottom-10 {
    margin-bottom: 10px;
}
.margin-bottom-25 {
    margin-bottom: 25px;
}

div.spez-grid.beyond-grid {
    margin-right: -10px;
    margin-left: -10px;
    margin-bottom: 0px;
    padding-right: 0px;
    padding-left: 0px;
}

div.beyond-grid-imgs {
    margin-bottom: 20px;
}
div.beyond-grid-imgs,
div.beyond-grid-infos {
    padding-right: 10px;
    padding-left: 10px;
}

div.beyond-grid-imgs div.beyond-grid-img-wrap:nth-of-type(1) {
    padding-bottom: 10px;
}

div.beyond-grid-imgs div.beyond-grid-img-wrap:nth-of-type(2),
div.beyond-grid-imgs div.beyond-grid-img-wrap:nth-of-type(3) {
    width: 50%;
}
div.beyond-grid-imgs div.beyond-grid-img-wrap:nth-of-type(2) {
    float: left;
    padding-right: 5px;
}
div.beyond-grid-imgs div.beyond-grid-img-wrap:nth-of-type(3) {
    float: right;
    padding-left: 5px;
}
div.beyond-grid-img > div {
    outline-color: #cccccc;
    outline-style: solid;
  outline-width: thin;
}

div.beyond-grid-info {
    max-width: 564px;
}
div.beyond-grid-info h4 {
    color: #cccccc;
}
div.beyond-grid-info h4 a {
    color: #cccccc;
}
div.beyond-grid-info h4 a:link,
div.beyond-grid-info h4 a:visited,
div.beyond-grid-info h4 a:active {
    color: #cccccc;
}
div.beyond-grid-info h4 a:hover,
div.beyond-grid-info h4 a:focus {
    color: #ff6600;
}

/*** Laptop and desktop Beyond grid style */

@media screen and (min-width: 901px) {

    div.spez-grid.beyond-grid > div {
        display: flex;
    }

    div.beyond-grid-imgs {
        /*float: left;*/
        width: 75%;
        margin-bottom: 0px;
    }
    div.beyond-grid-imgs div.beyond-grid-img-wrap:nth-of-type(1) {
        float: left;
        width: 66.5%;
        padding-right: 5px;
        padding-bottom: 0px;
    }
    div.beyond-grid-imgs div.beyond-grid-img-wrap:nth-of-type(1) .beyond-ratio {
        padding-bottom: 56.65%;
    }

    div.beyond-grid-imgs div.beyond-grid-img-wrap:nth-of-type(2),
    div.beyond-grid-imgs div.beyond-grid-img-wrap:nth-of-type(3) {
        width: 33%;
    }
    div.beyond-grid-imgs div.beyond-grid-img-wrap:nth-of-type(2) {
        float: right;
        padding-right: 0px;
        padding-left: 5px;
        padding-bottom: 5px;
    }
    div.beyond-grid-imgs div.beyond-grid-img-wrap:nth-of-type(3) {
        float: right;
        padding-top: 5px;
        padding-right: 0px;
        padding-left: 5px;
    }

    div.beyond-grid-infos {
        /*float: right;*/
        width: 25%;
    }
    div.beyond-grid-info {
        max-width: 100%;
    }
    div.beyond-grid-infos div.beyond-grid-info:nth-of-type(1) {
        border-top: 1px solid;
        padding-top: 3px;
    }
}

/** /Beyond grid styles - temp sqpp */

/** Misc styles */
.site-footer h4.widget-title.widgettitle {
    padding-bottom: 0px;
    margin-bottom: 5px;
}