/*
 * These styles are outputted both of the frontend and backend of the site
 * Please note any changes you do make may also make changes to the WP backend default styles.
 * Edit with caution
 */

/**BAB Options**/
.bab-options{display: block;font-family: "myriad-pro";font-weight: 400;}
.bab-options a{display:block;color:inherit;}
.bab-options .grid{grid-gap:30px;grid-template-columns:1fr 1fr 1fr 1fr !important;}
.bab-options h4{margin-top:2rem;margin-bottom:0;line-height:1;}

@media(max-width:768px){

    .bab-options .grid{grid-template-columns:1fr 1fr !important;grid-gap:15px;}

}

/**BAB Steps**/
.bab-steps-title h1{margin:0;line-height:1;}
.bab-steps{text-align:center;}
.bab-steps .container{position: relative;}
.bab-steps h4{margin-bottom:0;}
.bab-steps img{height:130px;margin:0 auto 20px;width:auto;}
.bab-steps .col{position: relative;padding-bottom:3rem;}
.bab-steps .col h4:before{content:'';width:20px;height:20px;background:#ffffff;display:block;border-radius:100px;border:2px solid #7fcec9;margin:0 auto 2rem;}
.bab-steps .container:after{content:'';width:100%;border-top:2px dashed #7fcec9;position: absolute;top:159px;left:0;z-index:-1;transform:translateY(50%);}

@media(max-width:550px){
    .bab-steps .container:after{display:none;}
}

/* Margin and Padding Styles */
.padding-bottom{padding-bottom:10rem;}
.padding-top{padding-top:10rem;}
.padding-both{padding-bottom:10rem;padding-top:10rem;}
.large-padding-bottom{padding-bottom:15rem;}
.large-padding-top{padding-top:15rem;}
.large-padding-both{padding-bottom:15rem;padding-top:15rem;}

.margin-bottom{margin-bottom:10rem;}
.margin-top{margin-top:10rem;}
.margin-both{margin-bottom:10rem;margin-top:10rem;}
.large-margin-bottom{margin-bottom:15rem;}
.large-margin-top{margin-top:15rem;}
.large-margin-both{margin-bottom:15rem;margin-top:15rem;}

.small-padding-top{padding-top:5rem;}
.small-padding-bottom{padding-bottom:5rem;}
.small-padding-both{padding-bottom:5rem;padding-top:5rem;}

.small-margin-both{margin-bottom:5rem;margin-top:5rem;}

section{overflow:hidden;}

/*Post listings*/
.post-listings{grid-template-columns:1fr 1fr 1fr;}
.post-listings .post-listing{background:#ffffff;position: relative;box-shadow:0 0 12px rgba(0,0,0,0.1);}
.post-listings .post-listing .post-listing-image{position: relative;}
.post-listings .post-listing .post-listing-image:after{content:'';width:50%;padding-top:50%;background-image:url('/wp-content/themes/toast/assets/images/graphic.svg');position:absolute;bottom:0;right:0;background-size:cover;background-position:center;transform:translate(30%, 30%);}
.post-listings .post-listing img{width:100%;}
.post-listings .post-listing .post-listing-content{padding:5rem 2rem;}
.post-listings .post-listing .post-listing-content h3{margin:0;}
.post-listings .post-listing .post-listing-content .date{margin-bottom:2rem;color:#7fcec9;margin-top:1rem;}
.post-listings .post-listing .overlay-link{position:absolute;top:0;left:0;width:100%;height:100%;font-size:0;}

/**Panel Slider**/
.panel-slider .slick-track{display:flex !important;}
.panel-slider .slick-list{margin-left:-1.5rem;margin-right:-1.5rem;overflow:visible;}
.panel-slider .slick-slide{margin:0 1.5rem;height:inherit !important}

.panel-slider .slick-arrow{background:#062542;font-size:0;width:29px;height:29px;padding:0;border-radius:100px;position:absolute;bottom:-2rem;transform:translateY(100%) rotate(90deg);right:0;background-image:url('/wp-content/themes/toast/assets/images/slick-arrow.svg');background-size:70%;background-position:center;background-repeat:no-repeat;transition:all .25s;}
.panel-slider .slick-arrow.slick-prev{right:35px;transform:translateY(100%) rotate(-90deg);}
.panel-slider .slick-arrow:hover{background-color:#7fcec9;}

.panel-slider .slick-arrow.slick-disabled{opacity:0.2;pointer-events:none;}


/*------------- Do not remove the styles below this line -------------*/
.wp-block{max-width:none;}
.admin-toast-support a, .admin-toast-support:hover a{background:#e88b39 !important;color:#ffffff !important;font-weight:bold !important;}
.admin-css-file a, .admin-css-file:hover a{background:#0c4e56 !important;color:#ffffff !important;font-weight:bold !important;}