/*
 Theme Name:     Givingtons
 Theme URI:      http://www.elegantthemes.com/gallery/foxy/
 Description:    Divi Child Theme
 Author:         Elegant Themes
 Author URI:     http://www.elegantthemes.com
 Template:       Divi
*/

/*@import url("../Divi/style.css");*/

/* =Theme customization starts here
------------------------------------------------------- */
:root {

    /* == Color Hexes == */
    --black: #000;
    --white: #fff;
    --grey: #707070;
    --lightGrey: #cccccc;
    --red: #cb4d53;
    --green: #8CC2B0;
    --contrast: rgb(0 0 0 / 20%);
    

    /* == Font Sizes == */
    --tinyText: 1.2rem; /* 12px */

    --notificationFont: 1.4rem; /* 14px */

    --copyFontLarge: 2.5rem; /* 25px */
    --copyFontSmall: 1.8rem; /* 18px */

    --navFontMax: 2rem; /* 20px */
    --navFontMin: 1.5rem; /* 15px */

    --superFontMax: 10rem; /* 100px */
    --superFontMin: 4rem; /* 40px */

    --biggestFontMax: 8rem; /* 80px */
    --biggestFontMin: 3.5rem; /* 35px */
    
    --bigFontMax: 4.8rem; /* 48px */
    --bigFontMin: 3.5rem; /* 35px */
    
    --mediumFontMax: 3.5rem; /* 35px */
    --mediumFontMin: 2rem; /* 20px */
    
    --smallFontMax: 2.5rem; /* 25px */
    --smallFontMin: 2rem; /* 20px */
    
    --smallestFontMax: 2rem; /* 20px */
    --smallestFontMin: 1.6rem; /* 16px */
}
html {
    font-size: 62.5%;
}
body {
    font-weight: 300;
}
.et-social-linkedin a.icon:before {
    content: "\e0cb";
}
#header-section {
	padding: 20px 0;
}
body.notification-bar #header-section {
	padding: 0;
}

body.et_pb_recaptcha_enabled .grecaptcha-badge,
body .grecaptcha-badge {
    visibility: hidden;
}
/*
* ----------[FONT SIZES]--------*
*/
.super-header h1,
.super-header h2,
.super-header h3,
.super-header h4,
.super-header h5,
.super-header-inline {
    font-size: clamp(var(--superFontMin), 6vw, var(--superFontMax));
    transition: 0.4s ease;
}
.biggest-header h1,
.biggest-header h2,
.biggest-header h3,
.biggest-header h4,
.biggest-header h5,
.biggest-header-inline,
h1 {
    font-size: clamp(var(--biggestFontMin), 6vw, var(--biggestFontMax));
    transition: 0.4s ease;
}

.big-header h1,
.big-header h2,
.big-header h3,
.big-header h4,
.big-header h5,
.big-header-inline,
h2 {
    font-size: clamp(var(--bigFontMin), 4vw, var(--bigFontMax));
    transition: 0.4s ease;
}

.medium-header h1,
.medium-header h2,
.medium-header h3,
.medium-header h4,
.medium-header h5,
.medium-header-inline,
h3 {
    font-size: clamp(var(--mediumFontMin), 3.5vw, var(--mediumFontMax));
    transition: 0.4s ease;
}

.small-header h1,
.small-header h2,
.small-header h3,
.small-header h4,
.small-header h5,
.small-header-inline,
h4 {
    font-size: clamp(var(--smallFontMin), 2.5vw, var(--smallFontMax));
    transition: 0.4s ease;
}

.smallest-header h1,
.smallest-header h2,
.smallest-header h3,
.smallest-header h4,
.smallest-header h5,
.smallest-header-inline,
h5 {
    font-size: clamp(var(--smallestFontMin), 2vw, var(--smallestFontMax));
    transition: 0.4s ease;
}

.standard {
    font-size: clamp(var(--copyFontSmall), 1.5vw, var(--copyFontLarge));
    transition: 0.4s ease;
}

#notification-bar strong {
    font-weight: 600;
}
#polybar {
    width: 100%;
    background: rgba(0,0,0,.1);
    color: #fff;
    font-size: var(--copyFontSmall);
    text-align: center;
    z-index: 99999;
    padding: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
}
#polybar .message-text {
    flex: 1 1 auto;
    font-size: var(--notificationFont);
    padding: 0 10px 0 50px;
}
#polybar .message-text a {
	color: #fff;
	font-weight: 400;
    position: relative;
    line-height: 1;
}
#polybar .close-btn {
    margin-right: 20px;
    margin-left: 20px;
    position: relative;
    width: 20px;
    height: 20px;
    cursor: pointer;
}
#polybar .close-btn:before {
    content: '';
    position: absolute;
    background-color: #fff;
    height: 2px;
    top: 50%;
    left: 50%;
    width: 10px;
    transform: translate(-50%,-50%) rotate(45deg);
    transition: all .3s ease-in-out;
}
#polybar .close-btn:after {
    content: '';
    position: absolute;
    background-color: #fff;
    width: 2px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%) rotate(45deg);
    height: 10px;
    transition: all .3s ease-in-out;
}
a.arrow-link {
  font-size:0;
}
a.arrow-link:after {
    content: url('img/right-arrow.svg');
    position: absolute;
    top: -9px;
    right: -26px;
    width: 16px;
    height: auto;
}

.flex {
    display: flex;
}

.align-center {
    align-items: center;
}

.justify-center {
    justify-content: center;
}
.mr-2 {
    margin-right: 8px;
}
.overlay:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .75);
    z-index: 3;
}

.overlay.dark:before {
    background: rgba(0, 0, 0, .9);
}

body {
    transition: .3s;
}
.gift-btn {
    cursor: pointer;
}
.gift-btn p {
    padding: 0 10px;
    display: inline-block;
    transition: .4s ease;
}
.gift-btn:hover p {
    text-decoration: underline;
}

.notes-row {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .3;
    margin: 0;
    padding: 0;
}
.notes-row svg,
.notes-row svg g {
    width: 100%;
    height: 100%;
    display: block;
}

.svg-container,
.svg-container .et_pb_code_inner {
    width: 100%;
    height: 110vh;
    /*display: flex;
    align-items: center;
    justify-content: center;*/
    overflow: hidden;
}

/* Animation for changing color to white */
@keyframes animateColor {
  0% {
    fill: #231f204d; /* Original color */
  }
  50% {
    fill: #ffffff; /* Animated to white */
  }
  100% {
    fill: #231f204d; /* Return to original */
  }
}

.animated {
  animation: animateColor 2s ease-in-out infinite;
}
/*
* ----------[AUDIO]--------*
*/
body .audio-container {
    cursor: pointer;
}
#audio-player {
    display: none;
}
.audio-controls-icon svg path {
    transition: .4s ease;
    fill: #fff;
}
.contrast .audio-controls-icon svg path {
    fill: var(--contrast);
}
body.inViewPort:not(.footerInViewPort) .audio-controls-icon svg path {
    stroke: #000;
}
.audio-controls-icon:before {
    content: '';
    display: none;
}
.audio-controls-icon {
    font-size: var(--copyFontSmall);
    color: var(--white);
    font-weight: 500;
    width: 40px;
}
.contrast .audio-controls-icon {
    color: var(--contrast);
}
.audio-controls-icon [id^="Line_"] {
  -webkit-animation: pulse 1.5s infinite;
  animation: pulse 1.5s infinite;
  transform-origin: 50% 50%;
  will-change: transform; /* Hint browser to optimize rendering */
}

/* Use nth-child selector to set staggered delays */
.audio-controls-icon #Line_1 { animation-delay: 0.15s; }
.audio-controls-icon #Line_2 { animation-delay: 0.3s; }
.audio-controls-icon #Line_3 { animation-delay: 0.45s; }
.audio-controls-icon #Line_4 { animation-delay: 0.6s; }
.audio-controls-icon #Line_5 { animation-delay: 0.75s; }
.audio-controls-icon #Line_6 { animation-delay: 0.9s; }
.audio-controls-icon #Line_7 { animation-delay: 1.05s; }
.audio-controls-icon #Line_8 { animation-delay: 1.2s; }
.audio-controls-icon #Line_9 { animation-delay: 1.35s; }

/* Optimized pulse keyframes */
@-webkit-keyframes pulse {
  0%, 100% {
    transform: scaleY(1);
  }
  50% {
    transform: scaleY(0.7);
  }
}

@keyframes pulse {
  0%, 100% {
    transform: scaleY(1);
  }
  50% {
    transform: scaleY(0.7);
  }
}

/*
* ----------[TICKER]--------*
*/
.ticker-slider {
  width: 100%;
  overflow: hidden;
}

.ticker-slider div {
  display: inline-block;
  white-space: nowrap;
  text-align: center;
  color: var(--green);
  line-height: 1;
  margin-right: 50px;
  font-weight: 200;
}

/*
* ----------[FOOTER]--------*
*/
#products-row .et_pb_column {
    width: auto;
    flex: 1 0 100%;
    margin: 0;
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--grey);
}
#products-row .et_pb_column:last-child {
    border-right: none;
}
#products-row .et_pb_column .et_pb_module:last-of-type {
    margin-top: auto;
}
#copyright-row {
    align-items: center;
    display: flex;
    flex-direction: column;
}
#copyright-row .et_pb_column {
    width: auto;
    margin: 0;
}

.cta .txt {
    text-transform: uppercase;
    font-weight: 600;
    color: #1E1C26;
    font-size: var(--navFontMax);
}

.cta {
    transition: .3s;
    cursor: pointer;
    display: flex;
    justify-content: center;
}

.cta-button {
    border-radius: 10px;
    border: 1px solid var(--green);
    background: var(--green);
    width: 200px;
    height: 72px;
}

.animated-logos-container-desktop {
    height: 120px;
}

img.polymath,
img.bookmark,
img.sidekick,
img.givingtons {
    position: absolute;
}

/*
* ----------[MEDIA QUERIES]--------*
*/
@media screen and (min-width: 768px) {
    #copyright-row {
        flex-direction: row;
    }
    #products-row .et_pb_column {
        flex: 1 0 50%;
    }
}

@media only screen and (min-width: 2200px) {}

@media screen and (min-width: 1280px) {}

@media only screen and (min-width: 1101px) {}

@media only screen and (min-width: 992px) {}

@media only screen and (min-width: 981px) {
    #products-row .et_pb_column {
        flex: 1;
        border-bottom: none;
    }
    body .section:not(#section-footer) .fp-tableCell .et_pb_row:first-of-type {
        padding-top: 80px !important;
        padding-bottom: 50px !important;
    }
    .audio-controls-icon:before {
        content: 'AUDIO ON';
        display: block;
        position: absolute;
        font-size: 14px;
        top: 50%;
        left: 50px;
    }
    .audio-controls-icon.playing:before {
        content: 'AUDIO OFF';
    }
    img.dynamic,
    video.dynamic,
    .animated-logos-container-desktop.active img.static {
        opacity: 0;
    }
    .animated-logos-container-desktop.active img.dynamic,
    .animated-logos-container-desktop.active video.dynamic {
        opacity: 1;
    }
    
}

@media only screen and (min-width: 981px) and (max-width: 1025px) {}

@media only screen and (max-width: 980px) {

    .contact-form-icon .et_pb_code_inner svg {
        margin-left: 0;
    }
    .scroll-sections .et_pb_row {
        display: block;
    }
}

@media only screen and (max-width: 812px) {
    .animated-g-container {
        display: none;
    }
    .hero-content {
        padding-top: 100px;
        padding-bottom: 100px;
    }
    img.static {
        opacity: 0;
    }
}

@media only screen and (min-width: 480px) and (max-width: 766px) {}

@media only screen and (max-width: 767px) {}

@media only screen and (max-width: 480px) {}

@media only screen and (max-width: 980px) and (orientation : portrait) {}

@media only screen and (max-width: 1180px) {}