/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** SECTION 1 - START HERE   ***************/

/* =HERO VERTICAL CTA */
.hero-vertical-ctas,
.hero-vertical-ctas .section-title {
    color: #fff;
}

.hero-vertical-ctas .section .section-content {
    background: rgba(0,0,0, .4)!important;
    padding: 10px!important;
}


/* =QUOTES SLIDER */
.quotes-slider .dot {
    background: #000
}

.quotes-slider .dot.is-selected {
    background: #000!important;
}

h1, .h1, .banner h1{
		font-size: 3.9em;
		line-height: 1.1em;
		margin-bottom: .35em;
}
h2, .h2, .banner h2{
		font-size: 2.9em !important;
		line-height: 1.25em !important;
		margin-bottom: .35em;
}
h3, .h3, .banner h3{
		font-size: 1.7em;
		line-height: 1.1em;
		margin-bottom: .3em;
}
h4, .h4, .banner h4{
		font-family: 'Open Sans', sans-serif !important;
		font-size: 1.3em !important;
		line-height: 1.4em !important;
		margin-bottom: .35em;
}
.uppercase{
		letter-spacing: 0;
}
.nav-spacing-xlarge>li {
		margin: 0 16px;
}
.nav-dropdown>li>a{
		color: var(--primary-color);
}
.nav-dropdown>li>a:hover{
		color: #d2b48c;
}
.header-button .button.is-xlarge{
		font-size: 1.35em;
}
.header-button a:before{
		font-family: "fl-icons";
		content:"\e600";
		font-size: .8em;
		color: #d2b48c;
}
.nav>li>a>i.icon-menu{
		font-size: 2.4em;
		color: var(--primary-color);
}
.nav>li>a>i.icon-menu:hover{
		color: #d2b48c;
}
.off-canvas-right .mfp-content, .off-canvas-left .mfp-content{
		background-color: #fff;
}
.nav.nav-vertical li a{
		color: var(--primary-color);
		font-size: .9em;
		font-weight: 600;
}
.section-title b{
		height: 3px;
		margin-top: 5px;
		opacity: 1;
    background-color: #d2b48c;
}
.section-title-container{
		margin-bottom: .8em;
}
.button span{
		line-height: 1.4em;
		letter-spacing: 0;
}

.icon-angle-right:before{
		font-family: 'Font Awesome 5 Free Solid' !important;
		content: '\f061';
}
.icon-angle-left:before{
				font-family: 'Font Awesome 5 Free Solid' !important;
		content: '\f060';
}
.hero-gradient:before {
    background: -moz-linear-gradient(left, rgba(4,63,112,0.76) 0%, rgba(4,63,112,0) 70%, rgba(4,63,112,0) 100%);
    background: -webkit-linear-gradient(left, rgba(4,63,112,0.76) 0%,rgba(4,63,112,0) 70%,rgba(4,63,112,0) 100%);
    background: linear-gradient(to right, rgba(4,63,112,0.76) 0%,rgba(4,63,112,0) 70%,rgba(4,63,112,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c2043f70', endColorstr='#00043f70',GradientType=1 );
    content: '';
    display: block;
    z-index: 1;
    position: absolute;
    height: 100%;
    overflow: hidden;
    width: 100%;
}
.gfield_label{
		text-transform: none;
		border-bottom: none;
		color: var(--primary-color);
}
.gfield input{
		margin-bottom: .1em !important;
}
ul li.bullet-checkmark, ul li.bullet-arrow, ul li.bullet-star{
		border-bottom: none;
		padding: 5px 0 5px 23px;
		margin: 0 0 0 7px;
}
ul li.bullet-checkmark:before, ul li.bullet-arrow:before, ul li.bullet-star:before{
		color: var(--primary-color);
}



/*************** SECTION 2 - MOBILE QA FIXES ONLY  ***************/
@media only screen and (max-width: 48em) {
    h1, .h1, .banner h1{
		font-size: 2.9em !important;
    }
    h2, .h2, .banner h2{
            font-size: 2.1em !important;
    }
    h3, .h3, .banner h3{
            font-size: 1.2em;
    }
    h4, .h4, .banner h4{
            font-size: 1.1em;
    }
    .nav-small.nav>li.html{
            font-size: 1em;
    }
    .section-title b{
            visibility: hidden;
    }

}

/*************** SECTION 3 - MEDIUM GRID AND UP  ***************/
@media only screen and (max-width: 760px) {
    h1, .h1, .banner h1{
		font-size: 3.4em !important;
    }
    h2, .h2, .banner h2{
            font-size: 2.4em !important;
    }
    h3, .h3, .banner h3{
            font-size: 1.3em;
    }
    h4, .h4, .banner h4{
            font-size: 1.2em;
    }
    .nav-small.nav>li.html{
            font-size: 1.2em;
            font-weight: 600;
    }
    .nav-small.nav>li.html a{
            margin-top: -5px;
            font-weight: 900;
            font-size: 1em;
            padding-left: 5px;
            color: #fff;
    }
    .nav-small.nav>li.html a:before{
            font-family: "fl-icons";
            content:"\e600";
            font-size: .75em;
            padding-right: 5px;
            color: #d2b48c;
    }
}


@media only screen and (min-width: 760px) and (max-width: 1090px) {
    #logo {
        width: 150px !important;
    }
    
    #header .nav-size-large>li>a {
        font-size: .9em !important;
    }
    
    #header .nav-spacing-xlarge>li {
        margin: 0 11px;
    }
}

/*************** SECTION 4 - DESKTOP AND UP  ***************/
@media only screen and (min-width: 1000px) {
    /* =HERO VERTICAL CTA */
    .hero-vertical-ctas .section {
        min-height: 400px!important;
        transition: all 0.3s ease!important;
        -moz-transition: all 0.3s ease!important;
        -o-transition: all 0.3s ease!important;
        padding: 0!important;
        align-items: flex-start;
    }
    .hero-vertical-ctas.align-middle .section {
        align-items: center;
    }

    .hero-vertical-ctas.align-bottom .section {
        align-items: flex-end;
    }

    .hero-vertical-ctas.align-equal .section {
        align-items: baseline;
    }

    .hero-vertical-ctas .section .section-content p,
    .hero-vertical-ctas .section .section-content .button {
        max-height: 0;
        transition: all 0.3s ease!important;
    }

    .hero-vertical-ctas .section .section-content {
        transition: all 0.3s ease!important;
        -moz-transition: all 0.3s ease!important;
        -o-transition: all 0.3s ease!important;
        max-height: 90px;
        position: relative!important;
        overflow:hidden;
    }

    .hero-vertical-ctas .section:hover .section-content {
        max-height: 500px;
    }
    .hero-vertical-ctas .section .section-content p,
    .hero-vertical-ctas .section .section-content .button {
        opacity: 0;
        max-height: 0;
        transition: all 0.3s ease!important;
        -moz-transition: all 0.3s ease!important;
        -o-transition: all 0.3s ease!important;
    }

    .hero-vertical-ctas .section:hover .section-content p,
    .hero-vertical-ctas .section:hover .section-content .button {
        opacity: 1;
        max-height: 500px;
    }
}