/*
 * 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
 */

.round-image img { border-radius: 100%; }

/**Main Header**/
.main-header{position: relative; background-position: center; background-size: cover; background-repeat: no-repeat; overflow: hidden;}

.main-header .header-overlay-stripe{position: absolute; height: 130%; width: 65%; top: 50%; left: 42%; transform: translate(-50%, -50%); display: flex;}

.main-header .header-overlay-stripe path{height: 100%;}

.main-header .bottom-curve{position: absolute; bottom: -1px; left: 0; width: 100%; display: flex; align-items: flex-end; justify-content: center;}
.main-header .main-header-content{padding: 20rem 0; text-wrap: balance;}
.main-header .main-header-title{max-width: 55%;}
.main-header .main-header-subtitle{max-width: 60%; font-size: 2.35rem; font-weight: 300; margin-top: 2rem; padding-left: 2rem; color: var(--brand-2);}

.main-header .main-header-buttons{position: absolute; display: flex; gap: 1rem; bottom: 5rem; left: 0; justify-content: end; align-items: center; width: 65%; z-index: 99;}

@media(max-width:1800px){
    .main-header .header-overlay-stripe{width: 100%;}
}

@media(max-width:1600px){
    .main-header .header-overlay-stripe{width: 100%;}
}

@media(max-width:1400px){
    .main-header .header-overlay-stripe{width: 150%;}
}

@media(max-width: 1024px){
    .main-header .header-overlay-stripe{width: 100%; height: 120%; left: 0; top: 0; background-color: rgba(255, 255, 255, 0.7); transform: none; display: block; z-index: 1;}
    .main-header .header-overlay-stripe svg{display: none;}
    .main-header .container{z-index: 2;}
    .main-header .main-header-content{max-width: 100% !important; text-align: center; width: 100% !important;}
	.main-header .main-header-title {max-width: 100% !important;}
	.main-header .main-header-subtitle {max-width: 100% !important; padding-left: 0rem !important;}
}

@media(max-width: 550px){
    .main-header::before{content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.75);}
    .main-header .header-overlay-stripe{display: none;}
    .main-header .main-header-content{max-width: 100%; padding: 7.5rem 0;}
}

/* Block Name: Logo Slider */
.block-logo-slider .slick-track, .logo-slider-wrapper .slick-track{display: flex; position: relative; align-items: center; justify-content: center;}
.block-logo-slider .slider .slide, .logo-slider-wrapper .slider .slide{display: flex !important; align-items: center; justify-content: center; padding: 0 4rem;}
.block-logo-slider .slider .slide img, .logo-slider-wrapper .slider .slide img{max-height: 75px; /*filter: grayscale(1);*/ transition: filter 0.3s ease-in-out;}
.block-logo-slider .slider .slide:hover img, .logo-slider-wrapper .slider .slide:hover img{filter: grayscale(0); transition: filter 0.3s ease-in-out;}

.block-logo-slider .slider:last-child, .logo-slider-wrapper .slider:last-child {margin-top: 10rem;}
.block-logo-slider .slider:first-child, .logo-slider-wrapper .slider:first-child {margin-top: 0;}

/* Block Name: Accreditations */
.block-accreditations .container {max-width: 140rem;}
.block-accreditations .accreditations{display: grid; justify-content: center; grid-gap: 2.5rem; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;}
.block-accreditations .accreditations .accreditation{display: flex; justify-content: center; align-items: center;}

.block-accreditations .accreditations .accreditation img{max-width: 145px; max-height: 90px;}

@media (max-width: 1024px) {
    .block-accreditations .accreditations{grid-template-columns: 1fr 1fr 1fr;}
}

@media (max-width: 768px) {
    .block-accreditations .accreditations{grid-template-columns: 1fr 1fr;}
}

@media (max-width: 480px) {
    .block-accreditations .accreditations{grid-template-columns: 1fr; grid-gap: 4rem;}
    .block-accreditations .accreditations .accreditation img{max-width: 250px; max-height: unset; height: auto;}
}

/* Post Listings */
.post-listings{grid-template-columns:1fr 1fr 1fr;}
.post-listing {background: var(--brand-2); color: #fff !important; border-radius: 2rem; text-align: center; position: relative; box-shadow: 0 10px 10px var(--shadow);}

.post-listing h3 {font-size: 2rem;}
.post-listing h3, .post-listing p {color: #fff; } 
.post-listing a {color: #fff; }
.post-listing a:hover {color: #fff; text-decoration: underline;}

.post-listing a.button{position: absolute; bottom: -2rem; left: 4rem; right: 4rem; border-radius: 2rem; color: #fff; background: var(--brand-1);}
.post-listing-image {margin: -4rem 2rem 2rem 2rem; border-radius: 3rem; overflow: hidden;}

.post-listing .post-listing-content{padding:2rem 2rem 6rem 2rem;}

@media(max-width: 1200px){
    .post-listings{grid-template-columns:1fr 1fr !important;}
}

/** Contact Form **/
.contact-form-section{background-color: var(--brand-2); padding: 20rem 0;}
.contact-form-section .container{max-width: 70rem;}

.contact-form-section .top-accent{position: absolute; top: -1px; left: 0; width: 100%; display: flex; height: 100px; justify-content: center;}

.contact-form-section:before{content: ""; position: absolute; left: calc(50% - 6rem); width: 10rem; height: 10rem; border-radius: 2rem; background: #fff;transform: rotate(45deg); top: -1rem; }

.contact-form-section .top-accent svg{width: 100%;}
.contact-form-section .bottom-accent{position: absolute; bottom: -1px; left: 0; width: 100%; display: flex; height: 100px; justify-content: center;}
.contact-form-section .bottom-accent svg{width: 100%;} 

/* Inner Section Title */
.contact-form-section h3.section-title{color: var(--brand-1) !important;}
.contact-form-section .section-title-area .section-description{color: #fff !important;}

/* Form Styling */
.contact-form-section .contact-form input[type="text"], .contact-form-section .contact-form textarea, .contact-form-section .contact-form input[type="email"], .contact-form-section .contact-form input[type="tel"], .contact-form-section .contact-form select.gfield_select{background: #fff; color: var(--brand-2); border: 0; border-radius: 3rem; padding: 1rem 2rem !important;}
.contact-form-section .contact-form textarea{padding: 1.5rem 2rem !important;}
.contact-form-section .contact-form input[type="text"]::placeholder, .contact-form-section .contact-form input[type="email"]::placeholder, .contact-form-section .contact-form input[type="tel"]::placeholder, .contact-form-section .contact-form textarea::placeholder{color: var(--brand-2);}
.contact-form-section .contact-form input[type="submit"]{margin: 0 auto; padding: 1rem 5rem;}
.span-2 { grid-column: span 2; }

.contact-form-section .contact-form input[type="file"]{padding-left: 0;}

.contact-form-section .contact-form .gfield--type-fileupload{color: #fff;}
.contact-form-section .contact-form .gform_fileupload_rules{padding-top: 0 !important;}

@media (max-width: 768px) {
    .contact-form-section .container{max-width: 90%;}
}

.span-2 { grid-column: span 1; }


/**Section title**/
.section-title-area{margin-bottom:5rem; text-align: center;}
.section-title-area.has-bg {color: #fff !important; padding: 15rem 0 35rem; margin-bottom: -25rem; position: relative; z-index: 0;}
.section-title-area.has-bg h3.section-title, .section-title-area.has-bg .section-description{color: #fff !important;}

.section-title-area.has-bg .top-accent svg{max-height: 150px; display: inline-flex; align-items: center; position: absolute; width: 105%; bottom: 100%; left: 50%; transform: translate(-50%, 50%); z-index: -1;}

.section-title-area.has-bg .bottom-accents svg{display: inline-flex; align-items: center; position: absolute; z-index: 1; width: 105%; left: 50%; top: 100%; transform: translate(-50%, -50%); max-height: 150px; opacity: 1;}
.section-title-area.has-bg .bottom-accents svg#Layer_2{top: calc(100% - 2rem); z-index: 2; opacity: 0.7;}
.section-title-area.has-bg .bottom-accents svg#Layer_3{top: calc(100% - 4rem); z-index: 3; opacity: 0.5;}
.section-title-area.has-bg .bottom-accents svg#Layer_4{top: calc(100% - 6rem); z-index: 4; opacity: 0.3;}

.section-title-area .section-title{ font-size: 4rem; margin-bottom:2rem;}
.section-title-area .section-description{font-size: 2.35rem; color: var(--brand-1) !important; font-weight: 300;}


/**Pagination**/
.page-navigation { margin-top: 2rem;text-align:center;}

/* WYSIWYG Formats */
ul.boxed-list{ background: var(--shadow); padding: 4rem 4rem 3.5rem 4rem; list-style: inside; }
p.alert-paragraph { display: flex; align-items: center; background: var(--brand-1); color: #fff; padding: 2rem; border-radius: 2rem; margin: 4rem 0; position: relative; }
p.alert-paragraph:before { content:""; display: block; background: transparent url('/wp-content/themes/toast/assets/images/warning.svg') center center no-repeat; background-size: contain; height: 10rem; width: 16rem; margin-right: 2rem; }
section blockquote { padding: 0 0 0 6rem; border-left: 3rem solid var(--brand-1); margin: 0; }
section blockquote p { font-size: 4rem; line-height: 1.1; }
section blockquote p:last-of-type { margin-bottom: 0; }

ul.columns-list{display: grid; grid-template-columns: 1fr 1fr; grid-column-gap: 4rem; grid-row-gap: 0;}

/*Buttons */
.button { background: var(--brand-2);padding:1rem 2rem;color:#ffffff;display:inline-block; border-radius: 10rem; text-decoration: none; font-weight: bold; text-transform: capitalize;}
.button:hover{ background-color: var(--brand-1); color: #fff;}

.button1{ background: var(--brand-1);padding:1rem 2rem;color:#ffffff;display:inline-block; border-radius: 10rem; text-decoration: none; font-weight: bold; text-transform: capitalize;}
.button1:hover{ background-color: var(--brand-2); color: #fff;}

ul.slick-dots { display: flex; align-items: center; justify-content: center; gap: .5rem; list-style: none;}
ul.slick-dots li{margin-bottom: 0;}

ul.slick-dots li button{background: transparent !important; font-size: 0; border: 0; padding: 0;}
ul.slick-dots li button::before{content:''; display: block; background-color: var(--brand-2) !important; width: 1.5rem !important; height: 1.5rem !important; border-radius: 100%;}
ul.slick-dots li.slick-active button::before{background-color: var(--brand-1) !important;}

/* Captions */
p.wp-caption-text { background: var(--brand-2); padding: 1rem 2rem; box-sizing: border-box; display: inline-block; color: #fff; width: 100%; border-radius: 0 0 2rem 2rem; }
div[id^="attachment_"] { max-width: 100% !important; width: 100% !important; }
div[id^="attachment_"] img { width: 100%; }

/**NEVER REMOVE**/
.wp-block{font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;}

/* Accents */
section{position: relative;}
.accents{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.accents .accent{position: absolute; transform: translate(-50%, -50%);}

@media(max-width: 1024px){
    .accents .accent.stars{display: none;}
}