body {
    color: #1b2f4d;    
    font-family: 'Open Sans', sans-serif;
}

p {margin: 0;}
a {color: unset;}


#top-flag-container {
    width: 365px;
    background-color: white;
    padding: 10px;
    padding-top: 5px;
    font-size: 12px;
    right: 10%;
    position: fixed;
    z-index: 1000;
}   
#top-flag-container img {float: left; width: auto; height: 35px; margin-right: 15px;}
#top-flag-container a {text-decoration: underline;}
#top-flag-container p {margin-bottom: 0;}

#synergy #top-flag-container {
    width: 385px;
}

.mob-buyNow-btn {border: none; background-color: #fff;}
.mob-buyNow-btn .mob-buyNow {width: auto; height: 30px; margin-right: 0.1rem;}



div#buyNow a:hover {text-decoration:none;background-color: #db6b1c;border: 0;}

header {padding: 30px 0px;}

.banner-img {
    background-image: url(/assets/images/agility-banner-v2.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center; 
    height: 66vh;   
}
#synergy .banner-img {
    background-image: url(/assets/images/synergy-banner.png);    
}
.banner-text p{
    color: #fff;
    font-size: 30px;
    padding: 70px 0;
}

main section:first-child {
    background: rgb(219,107,28);
    background: radial-gradient(circle, rgba(219,107,28,1) 35%, rgba(164,75,13,1) 100%);
}

section {
	margin: 30px 0;
}
section:first-child {margin: 0;}

section .card {margin-bottom: 30px;}


section#S3-Quotes {
    padding: 70px 0;
}






.list-group-item {padding-left: 0;}



#S5-Specification table td {
    background-color: #a4acb8;
    border-bottom: solid 1px #fff;
}
#S5-Specification table td:first-child {
    background-color: #1b2f4d;
    color: #fff;
    border-bottom: solid 1px #fff;
}

/* ------------------------------ 
    Header Section
------------------------------ */
    /* Navbar */
    .nav-link {color: #1b2f4d;}
    .nav-link:hover {color: #db6a1c;}

    /* Mega Menu */
    .megamenu-li {
        position: static;
    }
        /* Select Soft Starter dropdown */
            /* Agility page */
            #agility .megamenu-li #btn-agility {
                background-image: url(/assets/images/btn-agility.jpg);
                background-size: cover;
                background-repeat: no-repeat;
                background-position: center;  
                display: block;
                height: 315px;
                text-align: left;
                padding: 30px;  
                pointer-events: none;      
            }
            #agility .megamenu-li #btn-agility:hover {
                background-image: url(/assets/images/btn-agility-hover.jpg);
                color: #000;
                text-decoration: none;
                pointer-events: none;
            }
            #agility .megamenu-li #btn-synergy {
                background-image: url(/assets/images/btn-synergy-hover.jpg);
                background-size: cover;
                background-repeat: no-repeat;
                background-position: center;  
                display: block;
                height: 315px;
                text-align: left;
                padding: 30px;        
            }
            #agility .megamenu-li #btn-synergy:hover {
                background-image: url(/assets/images/btn-synergy.jpg);
                color: #000;
                text-decoration: none;
            }
            /* Synergy page */
            #synergy .megamenu-li #btn-agility {
                background-image: url(/assets/images/btn-agility-hover.jpg);
                background-size: cover;
                background-repeat: no-repeat;
                background-position: center;  
                display: block;
                height: 315px;
                text-align: left;
                padding: 30px;       
            }
            #synergy .megamenu-li #btn-agility:hover {
                background-image: url(/assets/images/btn-agility.jpg);
                color: #000;
                text-decoration: none;
            }
            #synergy .megamenu-li #btn-synergy {
                background-image: url(/assets/images/btn-synergy.jpg);
                background-size: cover;
                background-repeat: no-repeat;
                background-position: center;  
                display: block;
                height: 315px;
                text-align: left;
                padding: 30px;        
                pointer-events: none; 
            }
            #synergy .megamenu-li #btn-synergy:hover {
                background-image: url(/assets/images/btn-synergy.jpg);
                color: #000;
                text-decoration: none;
            }
        /* Select Soft Starter dropdown - CLOSE */

    .megamenu {
        position: absolute;
        width: 100%;
        left: 0;
        right: 0;
        padding: 15px;
    } 
    .dropdown-menu .list-group-item {
        border: 0;
        font-size: 14px;
        padding: 5px 0;
    }   
 
/* ------------------------------ 
    Main Section
------------------------------ */
    /* Section 1 - Banner height */
    #S1-Banner h1 {color: #ffffff;}

    /* Section 2 - Features */
    #S2-features .card:hover {background-color: #e8eaed;}

    /* Section 3 - Quotes */
    #S3-Quotes {
        background-image: url(/assets/images/s3-background-40.jpg);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;         
    }
    #synergy #S3-Quotes {
        background-image: url(/assets/images/s3-synergy-background.jpg);
    }

    /* Section 4 - Downloads */
    #S4-Downloads .btn {
        padding-left: 0;
    }
    #S4-Downloads .btn:hover {
        text-decoration: underline;
    }
    #S4-Downloads .inactive {color: lightgrey; pointer-events: none;}


/* ------------------------------ 
    Footer Section
------------------------------ */
    footer {background-color:#1b2f4d;color: #fff;font-size: 12px;}
    footer a {color: #db6a1c;}
    footer a:hover {color: #db6a1c;}

    ul.footer-social {list-style: none;}
    ul.footer-social li {
        display: inline;
        font-size: 30px;
        margin-left: 5px;        
    }
    ul.footer-social li a {color: unset;}
    ul.footer-social li a:hover {color: #db6a1c;}


/* ------------------------------ 
    Mobile / Responsive
------------------------------ */  

/* X-Small devices (portrait phones, less than 576px) */
@media (max-width: 576px) { 
    .navbar a img {
        width: 250px!important;
    }
}



@media (max-width: 992px) { 
    .nav-item .buyNow {
        display: block;
        background: #17304E;
        padding: 5px 10px;
        color: white;
        border: 0;
    }
}