/*
Theme Name: Not by Chance
Theme URI: https://notbychance.com/
Author: Rafael Pampoch
Author URI: https://rafaelpampoch.com/
Description: Theme built exclusively for Not by Chance
Requires at least: 6.5
Tested up to: 6.5
Requires PHP: 5.6
Version: 1.0
License: No licence
Text Domain: notbychance
*/

@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");

:root {
    --lightBlue: #EEF3F8;
    --mainBlue: #6295B4;
    --darkBlue: #203C4D;
    --mainRed: #C93740;
    --lightGrey: #FDFCFB;
    --lightText: #F9F7F2;
    --beige: #E7E6E2;
    --lightBeige: #EFEFEF;
    --salmon: #EE8788;
}

body {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
    color: var(--darkBlue);
    background: var(--lightText);
}

body,
.raleway-font {
  font-family: "Raleway", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

/* Colors */

.bg-light {
    background-color: var(--lightText) !important;
}

.bg-light-grey {
    background: var(--lightGrey);
}

.bg-blue {
    background: var(--mainBlue);
}

.bg-light-blue {
    background: var(--lightBlue);
}

.bg-beige {
    background: var(--beige);
}

.bg-light-beige {
    background: var(--lightBeige);
}

/* Text */

h2 {
    font-size: 32px;
    line-height: 42px;
    font-weight: bold;
    color: var(--darkBlue);
}

h2.line-bottom {
    border-bottom: 1px solid var(--mainBlue);
    padding-bottom: 8px;
}

h3 {
    font-size: 24px;
    line-height: 32px;
    font-weight: bold;
    color: var(--darkBlue);
}

.text-yellow {
    color: #C4994B !important;
}

/* Forms */

.form-control,
.form-select {
    border-radius: 0;
    border-color: var(--lightText);
    background: var(--lightText);
}

.form-outline .form-control,
.form-outline .form-select {
    border-color: rgba(39, 59, 130, 0.50);
}

/* Links */

a {
    color: var(--mainBlue);
}

a:hover {
    text-decoration: none;
}

/* Buttons */

.button {
    display: inline-block;
    height: 48px;
    line-height: 48px;
    background: var(--mainBlue);
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    padding: 0 20px;
    transition: all ease-in-out .3s;
    border: 1px solid var(--mainBlue);
}

.button:hover {
    background: #fff;
    color: var(--mainBlue);
    text-decoration: none;
}

.light-blue {
    background: rgba(39, 59, 130, .2);
    color: var(--mainBlue);
    border: none;
}

.light-blue:hover {
    background: rgba(39, 59, 130, .5);
    color: var(--mainBlue);
    border: none;
}

.yellow {
    background: #C4994B;
    border-color: #C4994B;
}

.yellow:hover {
    border-color: #C4994B;
    color: #C4994B;
}

.white {
    background: #fff;
    border-color: #fff;
    color: var(--darkBlue);
}

.white:hover {
    background: var(--mainBlue);
    border-color: var(--darkBlue);
    color: var(--darkBlue);
}

.salmon {
    background: var(--salmon);
    border-color: var(--salmon);
}

.salmon:hover {
    background: none;
    border-color: var(--salmon);
    color: var(--salmon);
}

.outline-white {
    background: none;
    border: 1px solid #fff;
}

.outline-white:hover {
    background: #fff;
    color: var(--mainBlue);
    border: 1px solid #fff;
}

.outline-blue {
    background: none;
    color: var(--mainBlue);
    border: 1px solid var(--mainBlue);
}

.outline-blue:hover {
    background: var(--mainBlue);
    color: #fff;
    border: 1px solid var(--mainBlue);
}

/* Borders */

.border-main-blue {
    border-color: var(--mainBlue) !important;
}

/* Video modal */

#videoModal .modal-dialog {
    max-width: 800px;
    margin: 30px auto;
}

#videoModal .modal-body {
    position:relative;
    padding:0px;
}

#videoModal .btn-close {
    position:absolute;
    right:-30px;
    top:0;
    filter: invert(96%) sepia(96%) saturate(0%) hue-rotate(83deg) brightness(104%) contrast(104%);
    opacity: 1;
}

/* Header */

.top-nav {
    width: 100%;
    height: 42px;
}

.top-nav a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 42px;
}

.top-nav a img {
    max-width: 100%;
    height: auto;
}

.top-nav li {
    margin: 0 7px;
}

.top-nav li:first-of-type {
    margin-left: 0;
}

.top-nav li:last-of-type {
    margin-right: 0;
}

.top-nav li.active {
    background: #fff;
}

.navbar-brand {
    width: 175px;
    height: auto;
    padding: 0;
}

.btn-header {
    display: block;
    text-align: center;
    color: var(--mainBlue);
    background: rgba(98, 149, 180, 0.2);
    text-transform: uppercase;
    text-decoration: none;
    height: 48px;
    line-height: 48px;
    padding: 0 20px;
    transition: all ease-in-out .3s;
}

.btn-header:hover {
    color: var(--darkBlue);
    background: rgba(116, 175, 211, 0.2);
}

.navbar-nav {
    padding: 16px 0;
}

.navbar-nav li {}

.navbar-nav .nav-link {
    text-transform: uppercase;
    padding-left: 6px;
    color: var(--darkBlue);
    transition: all ease-in-out .3s;
}

.navbar-expand-lg .navbar-nav .nav-link:hover,
.navbar-expand-lg .navbar-nav .nav-link.active {
    color: var(--mainBlue);
}

@media (min-width: 576px) {
    .top-nav li {
        margin: 0 15px;
    }
    .top-nav a img {
    }
}

@media (min-width: 992px) {
    .navbar-expand-lg .navbar-nav {
        justify-content: space-evenly !important;
        padding: 16px;
    }
    .navbar-expand-lg .navbar-nav .nav-link {
        padding: 8px 0;
        margin: 0 6px;
        font-size: 13px;
    }
    .navbar-expand-lg .navbar-nav .nav-link.active {
        border-bottom: 2px solid var(--mainBlue);
    }
}

@media (min-width: 1200px) {
    .navbar-expand-lg .navbar-nav .nav-link {
        font-size: 16px;
    }
}

/* TOP SECTION */

.top-section {
    width: 100%;
    height: 354px;
}

.top-section h1 {
    font-size: 40px;
    font-weight: bold;
    line-height: 50px;
    color: var(--lightText);
    text-shadow: 0px 0px 8px rgba(0, 0, 0, .5);
}

@media (min-width: 576px) {
    .top-section {
        height: 576px;
    }
    .top-section h1 {
        font-size: 50px;
        line-height: 60px;
    }
}

/* General */

.ico-circle-holder {
    width: 140px;
    height: 140px;
    background: var(--lightGrey);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    box-shadow: 2px 2px 30px 0px rgba(39, 59, 130, 0.10);
    margin: 0 auto;
}

.lesson-list-holder {
    background: var(--lightText);
    padding: 0 16px;
}

.lesson-list-holder .lesson {
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--mainBlue);
    padding: 16px;
}

.lesson-list-holder .lesson .number {
    display: flex;
    align-items: center;
    color: var(--mainRed);
    font-size: 42px;
    line-height: 42px;
    font-weight: light;
    margin: 0 24px 0 0;
}

.lesson-list-holder .lesson .text {
    color: var(--darkBlue);
}

.lesson-list-holder .lesson .text h4 {
    font-size: 18px;
    line-height: 22px;
    text-transform: uppercase;
    font-weight: bold;
}

.lesson-list-holder .lesson .text p {
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 0;
}

.lesson-list-holder .show-lessons {
    font-size: 24px;
    line-height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px 0;
    border-bottom: 1px solid var(--mainBlue);
    cursor: pointer;
}

.lesson-list-holder .more-lessons {
    display: none;
}

@media (min-width: 576px) {
    .lesson-list-holder {
        padding: 0 24px;
    }
    .lesson-list-holder .lesson {
        padding: 24px;
    }
    .lesson-list-holder .lesson .number {
        font-size: 62px;
        line-height: 62px;
        margin: 0 24px 0 0;
    }
    .lesson-list-holder .lesson .text h4 {
        font-size: 24px;
        line-height: 24px;
    }
    .lesson-list-holder .lesson .text p {
        font-size: 16px;
        line-height: 24px;
    }
}

#testimonialCarousel .carousel-control-prev-icon,
#testimonialCarousel .carousel-control-next-icon {
    background-size: 50%;
}

#testimonialCarousel .testimonial-card {
    text-align: left;
    width: 100%;
    max-width: 724px;
}

#testimonialCarousel .testimonial-card img {
    display: none;
}

#testimonialCarousel .testimonial-card .quote {
    width: 100%;
    background: #F4F2EC;
    padding: 28px 32px;
    position: relative;
    margin: 0 0 0 20px;
}

#testimonialCarousel.yearbook .testimonial-card .quote,
#testimonialCarousel.yearbook .testimonial-card .quote::after {
    background: var(--lightText);
}

#testimonialCarousel .testimonial-card .quote::after {
    content: "";
    width: 28px;
    height: 24px;
    position: absolute;
    top: 0;
    left: -28px;
    background: var(--lightBlue);
    clip-path: polygon(100% 0, 5% 0, 100% 100%);
}

#testimonialCarousel .testimonial-card p {
    position: relative;
    padding: 0 0 0 56px;
}

#testimonialCarousel .testimonial-card p.text::before {
    content: "";
    width: 40px;
    height: 30px;
    background: url(img/red-quote.svg) no-repeat center center;
    position: absolute;
    top: 0;
    left: 0;
}

#testimonialCarousel.yearbook .testimonial-card p.text::before {
    background: url(img/blue-quote.svg) no-repeat center center;
}

#testimonialCarousel .testimonial-card p,
#testimonialCarousel .testimonial-card .author,
#testimonialCarousel .testimonial-card .role {
    color: var(--darkBlue);
    font-size: 16px;
    line-height: 24px;
}

#testimonialCarousel.yearbook .testimonial-card p,
#testimonialCarousel.yearbook .testimonial-card .author,
#testimonialCarousel.yearbook .testimonial-card .role {
    color: #78797D;
}

#testimonialCarousel .testimonial-card .author {
    font-weight: 600;
    text-align: right;
    margin-bottom: 0;
}

#testimonialCarousel .testimonial-card .role {
    margin-top: 5px;
    color: #95a5a6;
    text-align: right;
    color: var(--mainBlue);
}

#testimonialCarousel .carousel-indicators {
    bottom: -56px;
}

#testimonialCarousel.yearbook .carousel-indicators {
    bottom: -15px; 
}

#testimonialCarousel .carousel-indicators button,
#videoCarousel .carousel-indicators button {
    background-color: var(--mainBlue);
    width: 12px;
    height: 12px;
    border-radius: 50%;
    opacity: 1;
}

#testimonialCarousel .carousel-indicators .active,
#videoCarousel .carousel-indicators .active {
    background-color: var(--mainRed) !important;
}

#testimonialCarousel .carousel-control-prev-icon,
#testimonialCarousel .carousel-control-next-icon {
    background-color: #34495e;
    border-radius: 50%;
}

@media (min-width: 576px) {
    #testimonialCarousel .testimonial-card img {
        display: block;
    }
}

.more-discussion {
    height: 584px;
    background: url(img/more-discussion-bg.png) no-repeat top center;
    background-size: cover;
    color: #fff;
}

.more-discussion h2 {
    font-size: 50px;
    line-height: 54px;
    color: #fff;
    font-weight: bold;
}

.programs {
    background: #fff;
}

.circle-list-item .circle {
    width: 62px;
    min-width: 62px;
    height: 62px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background: #FFF;
    box-shadow: 0.885px 0.885px 13.282px 0px rgba(39, 59, 130, 0.10);
}

.social-dr-tim li a.facebook {
    background: url(img/ico-facebook-2.svg) no-repeat center center;
}

.social-dr-tim li a.youtube {
    background: url(img/ico-youtube-2.svg) no-repeat center center;
}

.social-dr-tim li a.instagram {
    background: url(img/ico-instagram-2.svg) no-repeat center center;
}

.social-dr-tim li a.globe {
    background: url(img/ico-globe-2.svg) no-repeat center center;
}

.dr-tim-link {
    font-size: 13px;
    line-height: 19px;
    color: var(--darkBlue);
}

.dr-tim-link a {
    color: var(--darkBlue);
}

.dr-tim-link a:hover {
    text-decoration: none;
}

.top-yearbook {
    width: 100%; 
    height: 250px;
}

.top-yearbook-img {
    width: 100%;
    max-width: 1440px;
    height:250px;
    margin:0 auto;
    background: #E7E6E2 url(img/top-section-yearbook.png) no-repeat 88% center;
    background-size: 200%;
}

@media (min-width: 576px) {
    .top-yearbook {
        width: 100%; 
        height:440px;
    }
    .top-yearbook-img {
        height:440px;
        background: #E7E6E2 url(img/top-section-yearbook.png) no-repeat center center;
        background-size: contain;
    }
}

.top-yearbook-img a {
    width: 100%;
    height: 100%;
    display: block;
    text-indent: -9999px;
}

.yearbook-description,
.yearbook-description h2 {
    color: #78797D;
}

.gift-yearbook {
    width: 100%;
    height: 354px;
}

.gift-yearbook .col-12 {
    padding-top: 170px;
}

.gift-yearbook-img {
    width: 100%;
    max-width: 1440px;
    height: 354px;
    margin:0 auto;
    background: #E7E6E2 url(img/img-yearbook-gift.png) no-repeat top center;
    background-size: contain;
}

.gift-yearbook p {
    color: #78797D;
    font-size: 16px;
    line-height: 24px;
}

.form-yearbook input {
    border-color: rgba(39, 59, 130, 0.50);
    color: var(--mainBlue);
}

.form-yearbook p,
.form-yearbook label {
    color: var(--mainBlue);
}

#videoCarousel .carousel-control-next, 
#videoCarousel .carousel-control-prev {
    height: 32px;
    top: 50%;
    transform: translateY(-50%);
}

#videoCarousel .carousel-indicators {
    bottom: -64px;
}

#videoCarousel .carousel-indicators [data-bs-target] {
    background-color: var(--mainBlue);
}

ol.process {
    padding: 0 0 24px;
    margin: 0;
    list-style: none outside;
    overflow: hidden;
    color: #ccc;
    width: 100%;
    display: -webkit-inline-box;
    display: inline-flex;
}

ol.process li {
    width: 100%;
    float: left;
    padding: 0 0 .8em;
    margin: 0;
    text-align: center;
    position: relative;
    border-bottom: 4px solid #ccc;
    line-height: 1.4em;
}

.process li::before {
    content: '';
    border: 4.5px solid #ccc;
    border-radius: 50%;
    width: 6px;
    height: 6px;
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -6px;
    margin-bottom: -8.5px;
    background: #fff;
    box-sizing: unset;
}

.process li.active {
    border-color: #00396c;
    color: #00396c;
    font-weight: 700;
}

.process li.active::before {
    border-color: #00396c;
}

@media (min-width: 576px) {
    .gift-yearbook,
    .gift-yearbook-img {
        height: 554px;
    }
    .gift-yearbook .col-12 {
        margin-right: 90px;
        margin-left: auto; 
        padding-top: 380px;
    }
}

@media (min-width: 768px) {
    .gift-yearbook,
    .gift-yearbook-img {
        height: 644px;
    }
    .gift-yearbook .col-12 {
        margin-right: 90px;
        margin-left: auto; 
        padding-top: 400px;
    }
}

@media (min-width: 992px) {
    .gift-yearbook .col-12 {
        margin-right: 90px;
        margin-left: auto; 
        padding-top: 470px;
    }
}

@media (min-width: 1200px) {
    .gift-yearbook .col-12 {
        margin-right: 140px;
        margin-left: auto; 
        padding-top: 470px;
    }
}

@media (min-width: 1440px) {
    .gift-yearbook .col-12 {
        margin-right: 190px;
    }
}

/* CONTACT */

.form-outline.aubiobook-contact .form-control, 
.form-outline.aubiobook-contact .form-select {
    background-color: #fff;
    border-color: var(--mainBlue);
    color: var(--mainBlue);
}

.form-outline.aubiobook-contact .form-control::placeholder, 
.form-outline.aubiobook-contact .form-select::placeholder,
.form-outline.aubiobook-contact .form-control::-ms-input-placeholder, 
.form-outline.aubiobook-contact .form-select::-ms-input-placeholder {
    color: var(--mainBlue);
}

.action-items-list ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.action-items-list ul li {
    margin: 0 0 16px;
    padding: 0;
}

.download-link {
    text-decoration: none;
    font-weight: bold;
    font-size: 18px;
    color: #0a3622;
}

.bi {
    margin-right: 5px;
}

/* FOOTER */

#footer {
    background: var(--mainBlue);
    color: var(--lightText);
    font-size: 14px;
}

#footer a {
    color: #fff;
}

#footer .copyright {
    color: #fff;
}

#footer .logo-footer {
    width: 237px;
    height: 44px;
    display: block;
    text-indent: -9999px;
    background: url(img/footer-logo.png) no-repeat center center;
    background-size: contain;
}

#footer h5 {
    font-size: 16px;
    font-weight: bold;
    line-height: 24px;
}

#footer .social-footer,
.social-dr-tim {
    margin: 0;
    padding: 0;
    list-style-type: none;
    display: flex;
}

#footer .social-footer li,
.social-dr-tim li {
    margin: 0 14px 0 0;
    padding: 0;
}

#footer .social-footer li:last-child,
.social-dr-tim li:last-child {
    margin: 0;
}

#footer .social-footer li a,
.social-dr-tim li a {
    width: 32px;
    height: 32px;
    display: block;
    text-indent: -9999px;
}

#footer .social-footer li a.facebook {
    background: url(img/ico-facebook.svg) no-repeat center center;
}

#footer .social-footer li a.youtube {
    background: url(img/ico-youtube.svg) no-repeat center center;
}

#footer .social-footer li a.instagram {
    background: url(img/ico-instagram.svg) no-repeat center center;
}