@import url('https://fonts.googleapis.com/css2?family=Didact+Gothic&family=Jost:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Didact+Gothic&family=Jost:wght@400;500;600;700&family=Manrope:wght@300;400;500&display=swap');

:root {
    --font-main: 'Manrope';
    --font-head: 'Jost';

	--font-size-h1: 26px;
	--font-size-h2: 24px;
	--font-size-h3: 22px;
	--font-size-h4: 20px;
	--font-size-h5: 18px;
	--line-height-h1: 32px;
	--line-height-h2: 30px;
	--line-height-h3: 28px;
	--line-height-h4: 26px;
	--line-height-h5: 24px;

    /*colors*/
    --color-brown: #B14732;
   
}
.col-brown{color: #B14732;}
.f-16{font-size:16px;}
.col-grey{color:#000000;opacity: 0.5;}
.bg-grey{color:#F2F2F2;}
.bg-black{background-color: black;}
@media (min-width: 768px) {
    .f-16{font-size: 16px;}
	:root {
	    --font-size-h1: 48px;
		--font-size-h2: 36px;
        --font-size-h3: 24px;
        --font-size-h4: 20px;
		--font-size-h1: 36px;
        --line-height-h1: 42px;
        --line-height-h2: 42px;
        --font-size-h4: 22px;
        --line-height-h4: 28px;
    }
    .btn{padding: 10px 32px 10px 32px;font-size: 16px;}
.pt-6{padding-top: 4rem!important;}
.pt-7{padding-top: 5rem!important;}
.pt-8{padding-top: 6rem!important;}
.pt-9{padding-top: 7rem!important;}

.pb-6{padding-bottom: 4rem!important;}
.pb-7{padding-bottom: 5rem!important;}
.pb-8{padding-bottom: 6rem!important;}
}
@media (min-width: 992px) {
	:root {
		--font-size-h1: 48px;
		--font-size-h2: 36px;
        --font-size-h3: 24px;
        --font-size-h4: 20px;
		--line-height-h1: 69px;
		--line-height-h2: 52px;
        --line-height-h3: 34px;
        
	}
    .btn{padding: 10px 32px 10px 32px;font-size: 16px;}	
    .max-600{max-width: 600px; margin-left: auto; margin-right: auto;}
	.max-800{max-width: 800px; margin-left: auto; margin-right: auto;}
    .max-900{max-width: 940px; margin-left: auto; margin-right: auto;}
    .max-980{ max-width: 980px; margin-left: auto; margin-right: auto;}
    .max-1000{ max-width: 1000px; margin-left: auto; margin-right: auto;}
    .max-1100{ max-width: 1100px; margin-left: auto; margin-right: auto;}
    .max-1200{ max-width: 1200px; margin-left: auto; margin-right: auto;}
   
}

@media (min-width: 1336px) {
	:root {
		--font-size-h1: 48px;
		--font-size-h2: 36px;
        --font-size-h3: 24px;
        --font-size-h4: 20px;
        --font-size-h5: 18px;
		--line-height-h1: 69px;
		--line-height-h2: 52px;
        --line-height-h3: 34px;
        --line-height-h4: 34px;
        --line-height-h5: 26px;
	}
    .btn{padding: 10px 32px 10px 32px;font-size: 16px;}	
}

@media (max-width: 766px) {
    .btn{padding: 7px 16px 7px 20px;font-size: 12px;}
    .text-center-sm{text-align: center;}	  
}

/**** heading ***/
h1{ 
	font-family: var(--font-head); 
	font-size: var(--font-size-h1);
	line-height: var(--line-height-h1);
    font-weight: 500;
    text-transform: capitalize;
}

h2{ 
	font-family: var(--font-head);
	font-size: var(--font-size-h2);
	line-height: var(--line-height-h2);
    font-weight: 500;
    text-transform: capitalize;
}

h3{ 
	font-family: var(--font-head);
	font-size: var(--font-size-h3);
	line-height: var(--line-height-h3);
    font-weight: 500;
    
}

h4{ 
	font-family: var(--font-head);
	font-size: var(--font-size-h4);
	line-height: var(--line-height-h4);
    font-weight: 500;
}

h5{ 
	font-family: var(--font-head);
	font-size: var(--font-size-h5);
	line-height: var(--line-height-h5);
    font-weight: 500;
}

/**** paragraph****/
p, li{ 
	font-family: var(--font-main); 
	line-height: 24px;
    font-weight: normal;
}

/* a{ font-weight: 400;} */

@media (min-width: 1200px) {
    p, li{ 
        font-size: 18px;
        line-height: 27px;
        font-weight: 500;
    }
    a{ font-size: 18px;}
    .f-20-lg{font-size: 20px;}
    
}

@media (min-width: 1440px) {
    .pb-6{padding-bottom: 4rem!important;}
.pb-7{padding-bottom: 5rem!important;}
.pb-8{padding-bottom: 6rem!important;}
.mb-100-lg{margin-bottom: 100px;}
    p, li{ 
        font-size: 18px;
        line-height: 27px;
        font-weight: 500;
    }
    a{ font-size: 18px;}
    .f-20-lg{font-size: 20px;}
}

a{
	font-family: var(--font-main); 
	text-decoration: none;
    /* color: #845EF7; */
}
.font-main{ --font-main: 'Manrope';}
.font-head{--font-head: 'Jost';}

.ftr-addr:before{ content: url(../images/icons/gps.svg);}
.ftr-phone:before{ content: url(../images/footer/phone-icon.svg);}
.ftr-email:before{ content: url(../images/footer/email-icon.svg);}


.sp-80{padding-top: 80px;padding-bottom: 80px;}
.sp-100{padding-top: 100px;padding-bottom: 100px;}
.sp-50{ padding-top:50px; padding-bottom:50px;}
.sp-30{ padding-top:30px; padding-bottom:30px;}
.spt-80{ padding-top:60px;}
    .spt-50{ padding-top:30px;}
    .spb-50{ padding-bottom:30px;}
    .spb-60{ padding-bottom:50px;}
    .spb-80{ padding-bottom:80px;}
    .mb-30{ margin-bottom: 30px;}
    .mt-30{ margin-top: 30px;}
    .p-20{ padding: 20px;}
    .mtmb20{margin-top: 20px;margin-bottom: 20px;}
    .mtmb100{margin-top: 100px;margin-bottom: 100px;}
@media (max-width: 767px) {
    .row.col-reverse{ flex-direction: column-reverse;}
    .xs-mb-20{ margin-bottom: 20px;}
    .xs-mb-30{ margin-bottom: 30px;}
    .spb-80{ padding-bottom:50px;}
    .spb-60{ padding-bottom:30px;}
}  

@media (min-width: 992px) {
    .pt-50-lg{padding: 50px;}
	.container{ width: 90%; max-width: 1440px;}
	span.db{ display: block;}
    .p-30{ padding: 30px;}
	.sp-50{ padding-top:50px; padding-bottom:50px;}
	.spt-50{ padding-top:50px;}
    .spt-80{ padding-top:80px;}
	.spb-50{ padding-bottom:50px;}
    .spb-80{ padding-bottom:80px;}
    .spb-60{ padding-bottom:50px;}
    .btn{ font-size: 18px;}
    .bdr-rgt{border-right: 1.5px solid rgba(0, 0, 0, 0.2);}
    .bdr-btm{border-bottom: 1.5px solid rgba(252, 252, 252, 0.2);}
}
@media (max-width: 600px) {
    .pb-20-sm{padding-bottom: 20px!important;}

}
@media (max-width: 988px) {
    
    .fixed-top{background-color: white!important;}   
}

@media (min-width: 1600px) {
    .sp-50{ padding-top:70px; padding-bottom:70px;}
	.spt-50{ padding-top:70px;}
    .spt-80{ padding-top:100px;}
	.spb-50{ padding-bottom:70px;}
    .spb-80{ padding-bottom:100px;}
    .spb-60{ padding-bottom:80px;}
}
.bg-col-brown{background-color: #B14732;}
.bdr-8{border-radius: 8px;}
.bdr-10{border-radius: 10px;}
.bdr-13{border-radius: 13px;}
.navbar-light .navbar-nav .nav-link{color:black!important;font-weight:500;}
.white-space-normal{white-space: normal !important;}