/* ==========================================================================
CUSTOM CSS
========================================================================== */

#pre-loader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999999;
}

#status {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

body {
    color: #1b2a39;
    padding-top: 98px;
    font-family: 'Montserrat', sans-serif;
    overflow: hidden;
    padding-right: 0px !important;
}

.full-size-bg {
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    border-top: 30px solid #1B2A39;
    border-bottom: 30px solid #1B2A39;
    background-color: #1B2A39;
}

section {
    padding-top: 80px;
    padding-bottom: 80px;
}

.wow-sides {
    position: relative;
    overflow-x: hidden;
}

/* ==========================================================================
FONT STYLES
========================================================================== */

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
}

.section-header {
    font-weight: 600;
    margin-bottom: 1rem;
    font-size: 2rem;
}

h5 {
    font-size: 1.2rem;
}

.font-light {
    font-weight: 400;
}

small {
    font-weight: 600;
}

/* ==========================================================================
COLOURS
========================================================================== */


.bg-dark {
    background-color: #1B2A39 !important;
}

.bg-sanlam-blue {
    background-color: #0075C9 !important;
}

.bg-yellow {
    background: #FDB813;
}

.bg-light-blue {
    background: #40C8F4;
}

.bg-green {
    background: #67C183;
}

.bg-purple {
    background: #825474
}

.bg-light-grey {
    background-color: #f5f3ef;
}

.bg-orange {
    background: #F47933;
}

.text-sanlam-blue {
    color: #0075C9;
}

.text-white {
    color: #fff;
}


/* ==========================================================================
BUTTONS
========================================================================== */

.btn.focus, .btn:focus, a:focus, button:focus {
    outline: none !important;
    box-shadow: none;

}

.btn.disabled, .btn:disabled, .btn.disabled:hover, .btn:disabled:hover {
    opacity: 40%;
    background: #0075C9;

}

.btn {
    border-radius: 50px;
    font-weight: 600;
    background: #0075C9;
    color: #fff;
}

.btn:hover {
    background: #4098D7;
    color: #fff;
}

.btn-orange {
    background: #F47933;
    color: #fff;
}

.btn-orange:hover {
    background: #F79B66;
    color: #fff;
}

.btn-yellow {
    background: #FDB813;
    color: #fff;
}

.btn-yellow:hover {
    background: #FECA4E;
    color: #fff;
}

.btn-light-blue {
    background: #40C8F4;
    color: #fff;
}

.btn-light-blue:hover {
    background: #70D6F7;
    color: #fff;
}


.btn-green {
    background: #67C183;
    color: #fff;
}

.btn-green:hover {
    background: #8DD1A2;
    color: #fff;
}


.btn-purple {
    background: #825474;
    color: #fff;
}

.btn-purple:hover {
    background: #A17F97;
    color: #fff;
}



.btn-large, .btn-block {
    font-size: 1.2em;
    padding: .8rem;
}


.btn-small {
    font-size: 1em;
    padding: .4rem 1rem;
}


/* ==========================================================================
NAV
========================================================================== */

.navbar-toggler {
    border: 0;
}

.navbar-nav {
    padding-top: 1rem;
    padding-bottom: 1rem;

}

.show-nav {
    visibility: visible !important;
}

.navbar-light {
    background: #fff;
}


.navbar-light .navbar-nav .nav-link.active {
    color: #0075C9;
}

.navbar-light .navbar-nav .nav-link {
    color: #0075C9;
}

.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
    color: #0075C9;
}


.nav-item {
    padding: .3rem 1rem;
    font-weight: 600;
}

.dropdown-menu {
    border: 0;
    border-radius: 0;
}

.dropdown-item {
    color: #1b2a39;
    font-weight: 600;
}

.dropdown-item:focus, .dropdown-item:hover {
    color: #fff;
    background: #0075C9;
}

/* ==========================================================================
HEADER
========================================================================== */

#landing-header {
    height: 100%;
    background-image: url('../img/backgrounds/sanlam-series-bg-cropped.jpg');

}

.title-container {
    padding: 120px 0;
    display: inline-block;

}

.title-text {
    border-bottom: 2px solid;
}


/* ==========================================================================
WELCOME
========================================================================== */

#welcome {
    padding-bottom: 180px;
}




/* ==========================================================================
EVENTS
========================================================================== */

#events {
    padding-bottom: 130px;
}

#event-card-container {
    margin-top: -200px;
}

.event-card {
    padding-bottom: 50px;
    margin-bottom: 70px;
}

.event-card-image {
    width:100%;
    height: 300px;
    overflow: hidden;
}

.event-card-image div {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transition: all .5s;
}

.event-card-image:hover div {
    transform: scale(1.2);
}

.card-image-anchor {
    width: 100%;
    height: 100%;
    display: block;
}

.event-card-title {
    font-size: 1.3rem;
    font-weight: 600;
}

.event-card .divider {

    width: 40%;
    height: 4px;
    margin: auto;
}

.event-card .btn {
    min-width: 80%;
    max-width: 80%;
    position: absolute;
    bottom: 0;
    margin: auto;
    left:0;
    right: 0;
}



/* ==========================================================================
MODERATOR
========================================================================== */

.divider {

    width: 40%;
    height: 4px;
    
}


/* ==========================================================================
REGISTER
========================================================================== */


.form-control, .custom-select {
    height: calc(2.75rem + 2px);
    border: 2px solid #0075C9;
}

.form-control:focus, .custom-select:focus {
    border-color: #0075C9;
    box-shadow: none;
}

label {
    font-weight: 600;
    color: #0075C9;
}


.custom-radio {
    display: inline-block;
    margin-right: 20px;
}

.radio-header {
    font-weight: 600;
}

.custom-radio .custom-control-input:checked ~ .custom-control-label::before {
    background-color: #0075C9;
}

.custom-control-label::after, .custom-control-label::before {

    height: 1.4rem;
    width: 1.4rem;
}

.custom-control-label {
    padding-left: 10px;
    line-height: 30px;
    color: #52524f;
}


.custom-check-label {
    padding: 30px;
    background: #e2e2e2;
    border-radius: 4px;
    width: 100%;
}


#event1:checked ~ .custom-check-label {
    background: #FDB813 url('../img/icons/yellow-check-circle.png') no-repeat right center;
    color: #fff;
    background-size: 28%;
}

#event2:checked ~ .custom-check-label {
    background: #40C8F4 url('../img/icons/blue-check-circle.png') no-repeat right center;
    color: #fff;
    background-size: 28%;
}

#event3:checked ~ .custom-check-label {
    background: #67C183 url('../img/icons/green-check-circle.png') no-repeat right center;
    color: #fff;
    background-size: 28%;
}

#event4:checked ~ .custom-check-label {
    background: #825474 url('../img/icons/purple-check-circle.png') no-repeat right center;
    color: #fff;
    background-size: 28%;
}

#event5:checked ~ .custom-check-label {
    background: #F47933 url('../img/icons/orange-check-circle.png') no-repeat right center;
    color: #fff;
    background-size: 28%;
}


.custom-check:checked ~ .box-check {
    display: block;
}

.visually-hidden {
    position: absolute;
    left: -100vw;
}


.clear-selections {
    background: none;
    border: 0;
    padding:0;
    font-weight: 600;
    cursor: pointer;
}

.event-breakdown hr {
    margin-top: .4rem;
    margin-bottom: .4rem;
}

.invalid-message {
    display: none;
}



/* ==========================================================================
LIVE EVENT SECTION
========================================================================== */

#countdown-table table {
    margin: auto;
}


#countdown-table table td {
    padding:0;
    width: 50px;
}

.numbers-row {
    font-size: 1.8rem;
}

.text-row {
    font-size: 1rem;
}



/* ==========================================================================
FOOTER
========================================================================== */

footer {
    padding-top: 80px;
    padding-bottom: 80px;
}


.modal {
    padding-right: 0px !important;
}

.speakerModalLabel {
    margin-top: 20px;
}


#cookie-consent {
    border: 0;
    border-radius: 0;
    margin: 0;
}


#cookie-close {
    font-size: .8rem;
    font-weight: 600;
    color: #0075C9;
    opacity: 1;
    text-shadow: none;
    top: 7px;
    background-color: #ffffff !important;
    right: 20px;
    padding: 10px 20px;
    border-radius: 50px;

}