/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.12,
* Autoprefixer: v10.4.4
* Browsers: last 4 version
*/

/* 
 * ===================
 * GLOBAL
 * ===================
 */
body .wp-block {

    max-width: 1200px !important;
}

body.home .landing-page-form{

  display: none;
}
 
/* Width of "wide" blocks */
.wp-block[data-align='wide'] {

    max-width: 1200px !important;
}
 
/* Width of "full-wide" blocks */
.wp-block[data-align='full'] {
    max-width: none;
}

.wp-block-embed iframe{
  
  border-radius: 10px;
}

.desktop-only{
  
  display: block;
}

.preview{
  
  float: none;
}

.display-desktop{

  display: block;
}

.display-mobile{

  display: none;
}

@media screen and (max-width: 996px){
  
  .desktop-only{
    
    display: none !important;
  }
}

@media screen and (min-width: 678px){

  .content-wrapper iframe:nth-child(2n),
  .content-wrapper .preloader:nth-child(2n){

    margin-left: 20px;
  }
}

@media screen and (max-width: 678px){

  .display-desktop{

    display: none !important;
  }

  .display-mobile{

    display: block;
  }
  
  .offscreen-mobile-container{

    margin-bottom:  10px;
  }

  .content-wrapper .offscreen-mobile-wrapper{

      -ms-flex-wrap: nowrap !important;

          flex-wrap: nowrap !important;
   }

  .slide-for-more{

    /*opacity: 0.8;*/
    background-color: #f0f0f0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;

    font-size: 12px;

    border-radius: 30px;
    padding:  8px 12px;
  }

  .slide-for-more svg{

    width: 12px;
  }

  .offscreen-mobile-container,
  .tptn_posts{

    overflow-x: scroll;
  }

  .offscreen-mobile-container .offscreen-mobile-wrapper,
  .tptn_posts ul{

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  
  .offscreen-mobile-container .offscreen-mobile-wrapper > article{
    
    max-width: 100% !important;
    width: 100% !important;
  }
  
  .offscreen-mobile-container .offscreen-mobile-wrapper > iframe,
  .offscreen-mobile-container .offscreen-mobile-wrapper > .preloader,
  .tptn_posts ul > li{
    
    max-width: 300px !important;
    min-width: 300px !important;
  }

  .offscreen-mobile-container .offscreen-mobile-wrapper > article:not(:last-of-type),
  .offscreen-mobile-container .offscreen-mobile-wrapper > iframe:not(:last-of-type),
  .offscreen-mobile-container .offscreen-mobile-wrapper > .preloader:not(:last-of-type),
  .tptn_posts ul >li:not(:last-of-type){
  
    margin-right: 30px;
  }
}


/* 
 * ===================
 * Blocks / CTA
 * ===================
 */

.cta {

    padding: 30px;  
    border-radius: 5px;  
    background-size: cover;

    margin-bottom:  20px;
}

.cta a{

    min-width: 0px;
    height: auto;
    line-height: initial;

    padding: 10px 15px !important;
    border-radius:  3px;
    
    font-weight: 600;
}

.cta h3{
    
    font-weight: 600;
    margin-bottom: 10px;
}

.cta p{

    max-width: 650px;
}


.theme-black h3, .theme-black p{

    color: #FFFFFF !important;
}

.theme-black a{

    background-color: #FFFFFF;
    color: #070707;
}

/* Combine these!  */
.theme-blue h3, .theme-blue p{

    color: #FFFFFF !important;
}

.theme-blue a{

    background-color: #FFFFFF;
    color: #070707;
}


/* 
 * ===================
 * Blocks / DFP
 * ===================
 */

/* Preview styles */
.acf-block-preview .dfp-ad{


}

.dfp-ad:not(.preview){

    margin-bottom: 20px;
}

.dfp-ad.preview {

    background-color: #D7D7D7;
    border-radius: 5px;
    padding: 20px;

    float: none;
    max-width: calc(100% - 40px);
}

.dfp-ad .ad-container,
.dfp-ad .ad-container .adunit{

    max-width: 100%;
}

.dfp-ad p{

    margin-bottom:  0px;
}

.dfp-ad.size-square.preview{

    min-height: 250px;
}

.dfp-ad.size-vertical.preview{

    min-height: 600px;
}

.dfp-ad.size-horizontal.preview{

    max-width: 728px;
    width:  100%;
}


/* 
 * ===================
 * Blocks / External Content
 * ===================
 */

.external-content.youtube iframe,
.external-content .preloader{

    min-height: 190px;
}

.content-wrapper .offscreen-mobile-wrapper{

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;

    width: 100%;
}

.content-wrapper iframe:nth-child(2n),
.content-wrapper .preloader:nth-child(2n){

    margin-left: 20px;
}

.external-content .content-wrapper iframe,
.external-content .content-wrapper .spotify-preview,
.external-content .content-wrapper .preloader{

    max-width: calc(50% - 20px);
    width: 100%;
    border-radius: 10px;
    /*min-height: 230px;*/

    margin-bottom:  20px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}

.external-content .content-wrapper .preloader{

    background-color: #EFEFEF;
    color: #333333;

    padding:  20px;
    border-radius:  5px;
    margin-bottom:  20px;
}

.spotify-preview .preview .play-button svg{

    max-width: 10px;
    margin-left:  10px;
    fill:  #333333;
}

.spotify-preview .player{

    display: none;
}

@media screen and (min-width:  678px){

    .external-content.row-1 .offscreen-mobile-wrapper{

        display: block;
    }

     .external-content.row-1 .content-wrapper iframe:nth-child(2n),
     .external-content.row-1 .content-wrapper .preloader:nth-child(2n){

        margin-left: 0px;
    }

    .external-content.row-2 .offscreen-mobile-container,
    .external-content.row-3 .offscreen-mobile-container{

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }

    .external-content.row-1 iframe,
    .external-content.row-1 .preloader{

        width: 100%;
        max-width: 100%;
    }

    .external-content.row-2 iframe,
    .external-content.row-2 .preloader{

        width: 48%;
        max-width: 48%;
    }

    .external-content.row-3 iframe,
    .external-content.row-3 .preloader{

        width: 30%;
        max-width: 30%;
    }
}

@media screen and (max-width: 678px){

    .external-content{

        margin-bottom:  30px;
    }

    .external-content.preview .preloader{

        display: block;
        max-width: 100%;
    }

    .content-wrapper iframe:nth-child(2n),
    .content-wrapper .preloader:nth-child(2n){

        margin-left: 0px;
    }
}


/* 
 * ===================
 * Blocks / Infinite Posts
 * ===================
 */

.infinite-posts .post-wrapper{

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}

.infinite-posts .post-wrapper article{

    max-width: 31.2%;
    width:  100%;
}

.infinite-posts .button-wrapper{

    text-align: center;
}

.infinite-posts #bn-load-more .loading-indicator{

  margin-right: 5px;
  vertical-align: middle;
  display: none;
}

.infinite-posts #bn-load-more .loading-indicator svg{

  width: 18px;
}

.infinite-posts #bn-load-more.loading .loading-indicator{

  display: inline-block;
}

.infinite-posts #bn-load-more.loading .loading-indicator svg{

  animation-name: spin;
  animation-duration: 1s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

@keyframes spin{

  0%{

    transform: rotateZ(0deg);
  }

  100%{

    transform: rotateZ(360deg);
  }
}

@media screen and (max-width: 678px){

    .infinite-posts .post-wrapper{

        display: block;
    }

    .infinite-posts .post-wrapper article{

        max-width: 100%;
        width:  100%;
    }
}


/* 
 * ===================
 * Blocks / Single Post
 * ===================
 */

.post-feature{

    width: 100%;
}

.post-feature:after{

    /* Clearfix */
    content: " ";
    display: block; 
    height: 0; 
    clear: both;
}

.post-feature p,
.post-feature h3{

    /*max-width: 650px;*/
}

.post-feature h3{

    font-weight: 600 !important;
    margin-bottom: 10px;
}

.post-feature p{

    font-size:  14px;
}

.post-feature p.excerpt{

    margin-bottom:  5px;
}

.post-feature p.date{

    color: #808080;
}

.post-feature img{

    float: right;
    min-width: 130px;
    width: 35%;

    margin-left: 10px;
    margin-top: 10px;

    border-radius:  3px;
}

.post-feature.small img{

    max-width: 200px;
}

.post-feature.large img{

    max-width: 300px;
}


/* 
 * ===================
 * Blocks / Post List
 * ===================
 */

p.section-title{

    font-weight: 600;
    color: #909090;
}

.post-list {

    margin-bottom:  20px;
}

.post-list > br{

  display:  none;
}

.post-list .post-feature{

    margin-bottom: 10px;
}

@media screen and (min-width:  678px){

    .post-list.row-1 .post-wrapper{

        display: block;
    }

    .post-list.row-2 .post-wrapper,
    .post-list.row-3 .post-wrapper{

        display: -webkit-box;

        display: -ms-flexbox;

        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }

    .post-list.row-1 .post-feature{

        width: 100%;
    }

    .post-list.row-2 .post-feature{

        width: 48%;
    }

    .post-list.row-3 .post-feature{

        width: 30%;
    }
}

@media screen and (max-width:  678px){

    .post-list .offscreen-mobile-container .offscreen-mobile-wrapper{

        
    }

    .post-list.preview .offscreen-mobile-container .offscreen-mobile-wrapper{
        
        width: 100%;
        max-width: 100%;
    }
}