/* Base styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
font-family: 'Lato', Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	line-height: 1.5;
    color: #333;
}

/* Typography */
h1 { font-size: 60px; }
h2 { font-size: 42px; }
h3 { font-size: 30px; }
h4 { font-size: 24px; }
h5 { font-size: 20px; }
h6 { font-size: 16px; }

/* Text utilities */
.text-primary { color: #163f68; }
.text-secondary { color: #fef7ed; }
.text-center { text-align: center; }
.text-bold { font-weight: bold; }
.text-normal { font-weight: normal; }

/* Spacing utilities */
.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: 1rem !important; }
.mt-2 { margin-top: 2rem !important; }
.mb-0 { margin-bottom: 0 }
.mb-1 { margin-bottom: 1rem }
.mb-2 { margin-bottom: 2rem }
.p-0 { padding: 0 !important; }
.p-half { padding: 0.5rem !important; }
.p-1 { padding: 1rem !important; }
.p-2 { padding: 2rem !important; }

/* Flex utilities */
.d-flex { display: flex; }
.flex-column { flex-direction: column; }
.flex-row { flex-direction: row; }
.justify-content-center { justify-content: center; }
.align-items-center { align-items: center; }
.flex-wrap { flex-wrap: wrap; }

/* Background utilities */
.bg-lightgrey {
    background: #fef7ed !important;
    border: 1px solid #163f68;
    margin-top: -10px;
}

/* Buttons */
.btn {
    border-radius: 25px;
    padding: 10px 20px;
    transition: all 0.3s ease;
}

.btn-primary {
    color: #111111;
    background-color: #F9B738;
    border-color: #F9B738;
    border-radius: 0;
    border-style: none;
    font-size: 17px;
    font-family: 'Montserrat', Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
    font-weight: 800;
    margin-bottom: 25px;
    padding: 10px 25px;
    text-align: center;
    -webkit-box-shadow: 0px 2px 10px -4px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 2px 10px -4px rgba(0,0,0,0.75);
    box-shadow: 0px 2px 10px -4px rgba(0,0,0,0.75);
    width: 100%;
}

.btn-primary:hover,
.btn-primary:focus {
    color: #111111;
    background-color: #E29213 !important;
    border: none;
    text-decoration: none;
}

.btn-secondary {
    background: #fef7ed;
    color: #163f68;
    border: 2px solid #163f68;
}

.btn-secondary:hover {
    background: #163f68;
    color: white;
}

.btn-faq {
    font-size: 24px;
    text-align: center;
    padding: 10px;
    line-height: 1.4em;
    width: auto;
}

/* Circle components */
.circle-group {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    background: #163f68;
    color: white;
}

/* Circle Image */
.circle-img {
    border-radius: 50%;
    border: 6px solid;
    border-color: #0A3B6C;
    overflow: hidden;
    display: block;
    position: relative;
}

.circle-img-posi {
    border-radius: 50%;
    border: 6px solid;
    border-color: #28a745;
    overflow: hidden;
    display: block;
    position: relative;
}

/* Circle Cross Image */
.circle-img-cross {
    position: absolute;
    z-index: 2;
    background: white;
    padding: 0;
    font-size: 50px;
    top: 5%;
    left: 95%;
    transform: translate(-95%, -5%);
}

.circle-img-red {
    border-color: #AD231B !important;
}

.fa-circle-xmark {
    color: #AD231B;
    border-radius: 50px;
    font-size: 50px;
    margin: 3px 3px 0 0;
    text-align: center;
}

/* Speech Box */
p.card-text {
    font-family: 'Merriweather', serif !important;
    letter-spacing: 0;
}

/* Outlined Box Content */
.border-blue {
    border: 2px dashed #0A3B6C !important;
}

.grayscale-img {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

/* Danger List */
.danger-list li:before {
    content: "\0021";
    font-family: 'Font Awesome Free';
    font-size: 42px;
    color: #ad231b;
    font-weight: 500;
    margin: -17px 10px 0 -44px;
    position: absolute;
    padding: 3px 10px;
    text-shadow: -1px -1px 0 #ad231b, 1px -1px 0 #ad231b, -1px 1px 0 #ad231b, 1px 1px 0 #ad231b;
}

.danger-list li {
    list-style-type: none;
    font-weight: bold;
}

/* Graph List */
.chart-icon {
    font-size: 30px;
    -webkit-text-stroke-width: thin;
}

/* Superscript styles */
sup {
    vertical-align: super;
    color: #A9A9A9;
    font-weight: normal !important;
}

sup.tm {
    color: inherit;
    font-weight: bold !important;
    font-size: 50% !important;
    top: -4px !important;
}

h3 sup {
    top: -4px !important;
}

.btn-primary sup {
    top: -2px;
    color: black;
}

/* Images */
.w-75-new{
		max-width: 100%;
	}
	
.img-fluid {
    max-width: 100%;
    height: auto;
}

.img-rounded {
    border-radius: 8px;
}

/* Animations */
.fade-in {
    opacity: 0;
    transition: opacity 0.3s ease-in;
}

.fade-in.show {
    opacity: 1;
}

.slide-up {
    transform: translateY(20px);
    transition: transform 0.3s ease-out;
}

.slide-up.show {
    transform: translateY(0);
}

/* Testimonial Images */
#written p.card-text {
    font-family: 'Merriweather', serif;
    letter-spacing: 0;
}
img.border-testimonial {
box-sizing: border-box;
    border-style: solid;
    border-width: 6px;
    border-color: #ffffff;
    box-shadow: 0px 3px 4px 2px rgb(0 0 0 / 30%);
}

	img.test-left-pic {
    margin-right: 20px;
    float: left;
    display: inline-block;
	}

	

/* Scarcity Bar */
#progbar {
    position: relative;
    margin: 0;
    line-height: 1;
    font-weight: bold;
}

#progbar p{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
    color: white;
    width: 100%;
}

.progbar {
    height: 40px;
    width: 100%;
    -webkit-appearance: none;
}

.progbar::-webkit-progress-bar {
    background-color: rgb(200, 204, 216);
    border-radius: 7px;
}

.progbar::-webkit-progress-value {
    background-color: rgb(245, 62, 26);
    border-radius: 7px 0 0 7px;
}

/* Bonuses */
.bonuses {
    background: #043769;
    padding: 20px;
    margin: 0 auto;
}

/* FAQ */
.bg-lightgrey {
    background: #fef7ed !important;
    border: 1px solid #163f68;
    margin-top: -10px;
}

.bg-white-new {
    background-color: #ffffff;
    border: #163f68 solid 1px;
}

.faq-bg-white {
    background: white !important;
    border: 1px solid #163f68;
    margin-top: -10px;
}

#accordion p {
    margin-left: 5px;
    text-indent: 0;
    max-width: 100%;
}

#accordion .btn-link {
    width: 100%;
    text-align: left;
    position: relative;
    padding: 16px 30px;
    font-size: 23px;
    color: #000;
    border-radius: 15px 15px 0px 0px !important;
    background-color: #e6e6e6;
    color: #163f68;
    border-color: #163f68;
    border-bottom: 0px !important;
    border: 1px solid;
    margin-bottom: 10px;
}

#accordion .btn-link.focus, #accordion .btn-link:focus {
    text-decoration: none !important;
    color: #0A3B6C;
}

#accordion .btn-link:hover {
    color: #163f68;
    text-decoration: none;
}

#accordion .btn-link:first-child {
    border-top: #163f68 solid 1px;
}

#accordion .btn-link span {
    max-width: 90%;
    display: inline-flex;
}

.btn-faq {
   color: #28a745;
    border-radius: 0;
    border-style: none;
    font-size: 22px;
    font-family: 'Montserrat', Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
  padding: 0px 5px;
    margin: 0 8px;
	  font-weight: 800;
	   width: 90%;
	    text-align: left;
}


.btn-faq h2 {
    font-size: 22px;
}

.btn-faq:hover,
.btn-faq:focus {
    background: #d48f36;
    border: none;
    text-decoration: none;
}

/* shop now floating button */
.shop-now {
    display: block;
    padding: 20px 10px;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
}
.shop-now-align {
    float: right;
    width: 220px;
}
.shop-now-align > p {
    text-align: center;
    text-indent: 0px;
    margin-bottom: 10px;
}
.shop-now a.action {
    color: #f9b738;
    background: #163f68;
    padding: 10px 15px 8px 15px;
    display: inline-block;
    font-weight:700 !important;
    font-family: 'Montserrat', sans-serif;
font-size: 18px;
    margin-left: auto;
    margin-right: auto;
    float: none;
    box-shadow:1px 2px 22px rgba(0,0,0,0.2);
    border-radius: 0px;
    text-decoration: none;
    
}
.shop-now a.action:hover {

    background: #d48f36;
    
}


/* Orphan Text */
.br-se, .br-12p, .br-xr, .br-14pm {

	display: none;
}

/* Media Queries */
@media (max-width: 768px) {
    h1 { font-size: 40px; }
    h2 { font-size: 32px; }
    h3 { font-size: 26px; }
    
    .container {
        padding: 0 15px;
    }
    
    .row {
        margin: 0 -15px;
    }
}

@media (max-width: 480px) {
    h1 { font-size: 32px; }
    h2 { font-size: 25px; }
    h3 { font-size: 21px; }
    h4 { font-size: 20px; }
	.d-flex {
    display: flex !important;
}
.w-75-new{
		max-width: 75%;
	}
    .shop-now {
        position: fixed;
        top: calc(100% - 50px);
        top: -o-calc(100% - 50px);
        top: -webkit-calc(100% - 50px);
        top: -moz-calc(100% - 50px);
        left: 0;
        bottom: 0 !important;
        background: rgba(255, 255, 255, .9);
        width: 100%;
        z-index: 999;
    }

    .shop-now a.action {
        color: #000;
        float: none;
        position: absolute;
        left: 50%;
        top: 25px;
        transform: translate(-50%, -50%);
        -webkit-transform: translate(-50%, -50%);
        padding: 12px;
        font-size: 15px;
        margin: 0 auto;
                background: #f9b738;
        font-weight: bold;
        text-align: center;
        line-height: 20px;    
    }
    
    .btn-faq {
        font-size: 21px;
        text-align: left;
        padding: 5px !important;
        line-height: 1;
    }

    .circle-mob {
        max-width: 60%;
        margin: auto;
    }

    .faq-circle-mob {
        max-width: 80%;
        margin: auto;
    }

    .circle-img-cross {
        transform: translate(-210%, -5%);
    }
    
    .circle-group {
        width: 70px;
        height: 70px;
        font-size: 16px;
    }
    
    .container {
        padding: 0 10px;
    }
    
    .row {
        margin: 0 -10px;
    }
} 
@media (max-width: 640px) {
    .center-align-testimonial {
        margin-left: auto !important;
        margin-right: auto !important;
        margin-top: 10px !important;
        margin-bottom: 20px !important;
        float: none !important;
        display: block !important;
        text-align: center !important;
    }
}

@media (min-width: 375px) and (max-width: 389px) {
	.br-se {
	display: block;
	}
}

@media (min-width: 390px) and (max-width: 413px) {
	.br-12p {
		display: block;
	}
}

@media (min-width: 414px) and (max-width: 429px) {
	.br-xr {
		display: block;
	}
}

@media (min-width: 430px) and (max-width: 767px) {
	.br-14pm {
		display: block;
	}
}