/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* ELEMENTOR ANIMATIONS */

@keyframes fadeDown {
    from {
        opacity: 0;
        transform: translate3d(0,-30px,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInDown {
    animation-name: fadeDown
}

@keyframes fadeLeft {
    from {
        opacity: 0;
        transform: translate3d(-30px,0,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInLeft {
    animation-name: fadeLeft
}

@keyframes fadeRight {
    from {
        opacity: 0;
        transform: translate3d(30px,0,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInRight {
    animation-name: fadeRight
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translate3d(0,30px,0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.elementor-element.fadeInUp {
    animation-name: fadeUp
}


/* HEADER */

.site-header.header-full-width {
    position:absolute;
    z-index: 999;
    width:100%;
}

#menu-main-menu li {
    padding:0;
    margin:0 20px;
}

#menu-main-menu li a {
    display:block;
    padding:0 0 5px 0;
}

#menu-main-menu li a:after{
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    left: 0;
    bottom: 3px;
    transform-origin: bottom right;
    transition: transform 0.25s ease-out;
    height: 1px;
    background-color: #db946b;
}

#menu-main-menu li a:hover:after{
  transform: scaleX(1);
  transform-origin: bottom left;
}


/* DIRECTORS */

.elementor-icon-list-item:first-child .cls-1 {
    fill:#db946b;
}

.our-directors::before,
.our-directors::after{
    content:"";
    background:url('https://oculusafrica.co.za/wp-content/uploads/2024/07/vertical-gradient-line-scaled.jpg') 0 0 no-repeat;
    background-size:contain;
    position:absolute;
}

.our-directors::before {
    top:0;
    left:0;
}

.our-directors::after {
    bottom:0;
    left:100%;
    width:20px;
    height:100%;
}

/* CONTACT */

#contact::before {
    content:"";
    background:url('https://oculusafrica.co.za/wp-content/uploads/2024/07/gradient-line.png') 0 0 no-repeat;
    background-size:contain;
    position:absolute;
    top:0;
    left:0;
}

.contact-form .frm-row {
    display:block;
    width:100%;
}

.frm-col-left,
.frm-col-center,
.frm-col-right {
    display:inline-block;
    width:32.4%;
}

.frm-col-center {
    margin:0 0.5rem;
}

input[type="date"], input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], select, textarea {
    border: 1px solid #db946b;
    background: rgba(3,46,58,0.2);
    color: #fff;
}



.wpcf7-not-valid-tip {
  color: #fff;
    font-size: 12px;
}
.wpcf7 form .wpcf7-response-output,
.wpcf7 form.invalid .wpcf7-response-output, 
.wpcf7 form.unaccepted .wpcf7-response-output, 
.wpcf7 form.payment-required .wpcf7-response-output {
  border-color: #c17d5c;
  background: #c17d5c;
  text-align: center;
  color: #fff;
  font-size: 16px;
}

.wpcf7 form.invalid .wpcf7-response-output {
    margin:3rem 0;
}

/* FOOTER */

.site-footer {
  padding-block-start: 0;
  padding-block-end: 0;
}

.footer-contacts .elementor-widget-container a,
.footer-contacts .elementor-widget-container a:visited {
    color:#b46944;
}

.footer-contacts .elementor-widget-container a:hover {
    color:#db946b;
}


.footer-contacts .second-contact a,
.footer-contacts .second-contact a:visited {
    color:#c17d5c;
}

.footer-contacts .second-contact a:hover {
    color:#b46944;
}

.footer-contacts .third-contact a,
.footer-contacts .third-contact a:visited {
    color:#db946b;
}

.footer-contacts .third-contact a:hover {
    color:#c17d5c;
}



.footer-copyright a,
.footer-copyright a:visited {
    color:#fff;
}

.footer-copyright a:hover {
    text-decoration:underline;
}


/* MOBILE MENU */

.site-navigation-dropdown ul.menu,
.site-navigation-dropdown ul.menu li a {
    background: #0c4147;
}

.site-navigation-dropdown ul.menu li a {
    box-shadow: inset 0 -1px 0 rgba(255,255,255,.2);
    font-family: "Poppins", Sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 18px;
    color:#fff;
}


/* BROCHURE */

body.page-id-955 #site-header {
    display:none !important;
}

/* MOBILE VIEW */

@media screen and (max-width: 768px) {
    
    .our-directors::before,
    .our-directors::after {
        width:5px;
        height:100%;
        background-repeat: repeat-y;
    }
    
    .frm-col-left,
    .frm-col-center,
    .frm-col-right {
        width:100%;
    }

    .frm-col-center {
        margin:0;
    }
}