
.bg-black { background: #000; }
.bg-black-5 { background: rgba(0,0,0, 0.05) !important;}
.bg-black-10 { background: rgba(0,0,0, 0.1) !important;}
.bg-black-20 { background: rgba(0,0,0, 0.2) !important;}
.bg-black-30 { background: rgba(0,0,0, 0.3) !important;}
.bg-yellow-light { background: #fff2cc !important; }

.bg-white { background: #fff; }
.bg-white-5 { background: rgba(255,255,255,0.05) !important; }
.bg-white-10 { background: rgba(255,255,255,0.1) !important; }
.bg-white-20 { background: rgba(255,255,255,0.2) !important; }
.bg-white-30 { background: rgba(255,255,255,0.3) !important; }
.bg-white-50 { background: rgba(255,255,255,0.5) !important; }

.text-black { color: #000; }
.text-white-50 { color: rgba(255,255,255,0.5);}
.text-white-60 { color: rgba(255,255,255,0.6);}
.text-white-70 { color: rgba(255,255,255,0.7);}
.text-white-80 { color: rgba(255,255,255,0.8);}
.text-black-50 { color: rgba(0,0,0,0.5);}
.text-black-60 { color: rgba(0,0,0,0.6);}
.text-black-70 { color: rgba(0,0,0,0.7);}
.text-black-80 { color: rgba(0,0,0,0.8);}

/* margin styling */
.mt-10 {margin-top: 10px !important;} .mt-15 {margin-top: 15px !important;}
.mt-20 {margin-top: 20px !important;} .mt-25 {margin-top: 25px !important;}
.mt-30 {margin-top: 30px !important;} .mt-35 {margin-top: 35px !important;}
.mt-40 {margin-top: 40px !important;} .mt-45 {margin-top: 45px !important;}
.mt-50 {margin-top: 50px !important;} .mt-55 {margin-top: 55px !important;}
.mb-10 {margin-bottom: 10px !important;} .mb-15 {margin-bottom: 15px !important;}
.mb-20 {margin-bottom: 20px !important;} .mb-25 {margin-bottom: 25px !important;}
.mb-30 {margin-bottom: 30px !important;} .mb-35 {margin-bottom: 35px !important;}
.mb-40 {margin-bottom: 40px !important;} .mb-45 {margin-bottom: 45px !important;}
.mb-50 {margin-bottom: 50px !important;} .mb-55 {margin-bottom: 55px !important;}

.mt-neg-100 {margin-top: -100px !important;}
.pb-100 {padding-bottom: 100px !important;}

.p-15 { padding: 15px !important; }
.py-15 { padding-top: 15px !important; padding-bottom: 15px !important; }
.pb-15 { padding-bottom: 15px !important; }
.pt-15 { padding-top: 15px !important; }
.p-20 { padding: 20px !important; }
.py-20 { padding-top: 20px !important; padding-bottom: 20px !important;}
.pb-20 { padding-bottom: 20px !important; }
.pt-20 { padding-top: 20px !important; }
.p-25 { padding: 25px !important; }
.py-25 { padding-top: 25px !important; padding-bottom: 25px !important;}
.pb-25 { padding-bottom: 25px !important; }
.pt-25 { padding-top: 25px !important; }
.p-30 { padding: 30px !important; padding-bottom: 30px !important;}
.py-30 { padding-top: 30px !important; }
.pb-30 { padding-bottom: 30px !important; }
.pt-30 { padding-top: 30px !important; }
.pb-35 { padding-bottom: 35px !important; }
.pt-35 { padding-top: 35px !important; }
.py-45 { padding-top: 45px !important; padding-bottom: 45px !important; }
.px-45 { padding-left: 45px !important; padding-right: 45px !important; }
.py-90 { padding-top: 90px !important; padding-bottom: 90px !important; }
.px-90 { padding-left: 90px !important; padding-right: 90px !important; }

/* Font related */
.fz-12 { font-size: 12px !important; }
.fz-14 { font-size: 14px !important; }
.fz-16 { font-size: 16px !important; }
.fz-18 { font-size: 18px !important; }
.fz-20 { font-size: 20px !important; }
.fz-22 { font-size: 22px !important; }
.fz-24 { font-size: 24px !important; }
.fz-28 { font-size: 28px !important; }
.fz-32 { font-size: 32px !important;}
.fz-34 { font-size: 34px !important; }
.fz-38 { font-size: 38px !important; }
.fz-42 { font-size: 42px !important; }
.fz-44 { font-size: 44px !important; }
.fz-52 { font-size: 52px !important; }
.fz-62 { font-size: 62px !important; }
	
.strong { font-weight: 700 !important; }
.stronger { font-weight: 800 !important; }
.font-italic, .italic { font-style:italic; }
.fw-light, .light { font-weight: 200 !important; }
.fw-regular, .regular { font-weight: 400 !important; }
.underline { text-decoration:underline; text-underline-offset: 4px; }
.strike { text-decoration: line-through !important;}
.nowrap { white-space:nowrap; }
.tt-up { text-transform:uppercase; }
.tt-low { text-transform:lowercase; }
.tt-cap { text-transform: capitalize; }
.tt-none { text-transform:none; }
.break-word { word-wrap: break-word; }

.lh-13 { line-height: 1.3 !important; }
.lh-14 { line-height: 1.4 !important; }
.lh-15 { line-height: 1.5 !important; }
.lh-16 { line-height: 1.6 !important; }
.lh-1 { line-height: 1 !important; }
.lh-0 { line-height: 0 !important; }

.lts-0 {letter-spacing: 0px;}
.lts-1 {letter-spacing: 1px;}
.lts-2 {letter-spacing: 2px;}
.lts-3 {letter-spacing: 3px;}

/* Borders */
.bd { border: 1px solid #ccc; }
.bdl { border-left: 1px solid rgba(0, 0, 0, 0.5);}
.bdr { border-right: 1px solid rgba(0, 0, 0, 0.5);}
.bdb { border-bottom: 1px solid rgba(0, 0, 0, 0.5); }
.bdt { border-top: 1px solid rgba(0, 0, 0, 0.5); }
.bd-2 { border-width: 2px !important; }
.bd-3 { border-width: 3px !important; }
.bd-4 { border-width: 4px !important; }
.bd-5 { border-width: 5px !important; }
.bd-6 { border-width: 6px !important; }
.bd-white { border-color: #fff !important; }
.bd-black { border-color: #000; }
.bd-light { border-color: #ddd; }
.bd-black-5 { border-color: rgba(0,0,0,0.05) !important; }
.bd-black-10 { border-color: rgba(0,0,0,0.1) !important; }
.bd-black-15 { border-color: rgba(0,0,0,0.15) !important; }
.bd-black-20 { border-color: rgba(0,0,0,0.2) !important; }
.bd-black-30 { border-color: rgba(0,0,0,0.3) !important; }
.bd-white-5 { border-color: rgba(255,255,255,0.05) !important; }
.bd-white-10 { border-color: rgba(255,255,255,0.1) !important; }
.bd-white-20 { border-color: rgba(255,255,255,0.2) !important; }
.bd-white-30 { border-color: rgba(255,255,255,0.3) !important; }
.bd-dashed { border-style: dashed; }
.bdb-dashed { border-bottom-style: dashed; }
.bdt-dashed { border-top-style: dashed; }
.bdb-dashed { border-bottom-style: dashed; }
.nobd { border: none !important; }
.nobdb { border-bottom:none !important; }
.nobdt { border-top:none !important; }

.img-center { display:block; max-width: 100%; margin: auto;}

.max-850 { width: 100%; max-width: 850px; }

/* Other General */
ul { margin-bottom: 0; }
li { list-style: none; }
.img-link { display:block; }
.img-link img { transition: all 0.3s ease-out; }
.img-link:hover img { opacity: 0.5; transition: all 0.5s ease-in; }

a.no-thanks { text-decoration:underline; }
a.no-thanks:hover { text-decoration: none; }
a.link { text-decoration: none; }
a.link:hover { text-decoration: underline; }

.w-60 { width: 60%; }
.w-65 { width: 65%; }
.w-70 { width: 70%; }
.w-80 { width: 80%; }
.w-90 { width: 90%; }
.max-1000 { max-width: 1000px; }
.hide { display:none; }
.same-col-height, .same-ch { height: 100%; }
.trans-all { transition: all 0.3s ease-in; }
.trans-all:hover { transition: all 0.5s ease-out; }
.posr { position:relative; }
.clear { overflow:hidden; }
.ovh { overflow:hidden;}

.posa-center { position: absolute; top: 0; bottom: 0; right: 0; left: 0; margin: auto; display:block; width: 100%; height: auto;}
.posa { position: absolute; }
.posa.top { top: 0px; }
.posa.bottom { bottom: 0px; }
.posa.left { left: 0px; }
.posa.right { right: 0px; }

.z--1 { z-index: -1;}
.z-0 { z-index: 0;}
.z-1 { z-index: 1;}
.z-2 { z-index: 2;}
.z-9 { z-index: 9;}
.z-99 { z-index: 99;}

/* CUSTOM FLEX */
.d-flex { display: flex;}
.d-inline-flex { display: inline-flex;}
.flex-row { flex-direction: row; }
.flex-col { flex-direction: column; }
.flex-center-start, .flex-cs, .flex-center { display: flex; justify-content: center; align-items: start; }
.flex-center-center, .flex-cc, .flex-middle { display: flex; justify-content: center; align-items: center; }
.flex-center-end, .flex-ce { display: flex; justify-content: center; align-items: end; }
.flex-start-start, .flex-ss, .flex-start { display: flex; justify-content: start; align-items: start; }
.flex-start-center, .flex-sc, .flex-icon { display: flex; justify-content: start; align-items: center; }
.flex-start-end, .flex-se { display: flex; justify-content: start; align-items: end; }
.flex-end-start, .flex-es { display: flex; justify-content: end; align-items: start; }
.flex-end-center, .flex-ec { display: flex; justify-content: end; align-items: center; }
.flex-end-end, .flex-ee { display: flex; justify-content: end; align-items: end; }
.flex-start em, .flex-start img { margin-top: 2px; }
.flex-inline-icon { display: inline-flex; justify-content: start; align-items: center; }
.flex-column-start { display: flex; justify-content: start; align-items: center; flex-direction: column; }
.flex-column-center { display: flex; justify-content: center; align-items: center; flex-direction: column; }
.jsc-start { justify-content: start; }
.jsc-center { justify-content: center; }
.jsc-end { justify-content: end; }
.jsc-between { justify-content: space-between; }
.ai-start { align-items: start;  }
.ai-center { align-items: center;  }
.ai-end { align-items: end; }
.ai-stretch { align-items: stretch; }
.flex-img-txt { display: flex; justify-content: center; align-items: start; flex-direction: row; }
.flex-img-txt em, .flex-img-txt img { margin-top: 2px; }
.gap-1, .gap-1 .inner { gap: 0.25rem !important; }
.gap-2, .gap-2 .inner { gap: 0.5rem !important; }
.gap-3, .gap-3 .inner { gap: 1rem !important; }
.gap-4, .gap-4 .inner { gap: 1.5rem !important; }
.gap-5, .gap-5 .inner { gap: 3rem !important; }
.gap--5, .gap--5 .inner { gap: 5px !important; }
.gap-10, .gap-10 .inner { gap: 10px !important; }
.gap-15, .gap-15 .inner { gap: 15px !important; }
.gap-20, .gap-20 .inner { gap: 20px !important; }
.gap-25, .gap-25 .inner { gap: 25px !important; }
.gap-30, .gap-30 .inner { gap: 30px !important; }
.gap-60, .gap-60 .inner { gap: 60px !important; }

.flex-1 { flex: 1 !important; }
.flex-2 { flex: 2 !important; }
.flex-3 { flex: 3 !important; }
.flex-4 { flex: 4 !important; }
.flex-5 { flex: 5 !important; }
/* end CUSTOM FLEX */

.rounded-6 { border-radius: 6px; }
.rounded-8 { border-radius: 8px; }
.rounded-10 { border-radius: 10px; }
.rounded-12 { border-radius: 12px; }
.rounded-14 { border-radius: 14px; }
.rounded-b-0 { border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; }
.rounded-t-0 { border-top-left-radius: 0 !important; border-top-right-radius: 0 !important; }
.rounded-8 { border-radius: 8px; }
.bdrs-s-0 { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.bdrs-e-0 { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.bdrs-b-0 { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.bdrs-t-0 { border-top-left-radius: 0; border-top-right-radius: 0; }

.show-mobile { display: none !important; }
.show-desktop { display: block !important; }

/* // Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {  
	.jsc-sm-start { justify-content: start !important; }
	.jsc-sm-center { justify-content: center !important; }
	.jsc-sm-end { justify-content: end !important; }
	.jsc-sm-between { justify-content: space-between !important; }
	.ai-sm-start { align-items: start !important; }
	.ai-sm-center { align-items: center !important; }
	.ai-sm-end { align-items: end !important; }
	.ai-sm-stretch { align-items: stretch !important;  }
	
	.flex-sm-row { flex-direction: row; }
	.flex-sm-col { flex-direction: column; }
}

/* // Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {  
	.flex-md-row { flex-direction: row; }
	.flex-md-col { flex-direction: column; }
}

/* // Large devices (desktops, 992px and up) */
@media (min-width: 992px) {  
	.fz-lg-12 { font-size: 12px !important; }
	.fz-lg-14 { font-size: 14px !important; }
	.fz-lg-16 { font-size: 16px !important; }
	.fz-lg-18 { font-size: 18px !important; }
	.fz-lg-20 { font-size: 20px !important; }
	.fz-lg-22 { font-size: 22px !important; }
	.fz-lg-24 { font-size: 24px !important; }
	.fz-lg-28 { font-size: 28px !important; }
	.fz-lg-32 { font-size: 32px !important;}
	.fz-lg-34 { font-size: 34px !important; }
	.fz-lg-38 { font-size: 38px !important; }
	.fz-lg-42 { font-size: 42px !important; }
	.fz-lg-44 { font-size: 44px !important; }
	.fz-lg-52 { font-size: 52px !important; }
	.fz-lg-62 { font-size: 62px !important; }
	.pos-lg-a { position:absolute;}
	
	.flex-lg-row { flex-direction: row; }
	.flex-lg-col { flex-direction: column; }
	
	.flex-lg-1 { flex: 1 !important; }
	.flex-lg-2 { flex: 2 !important; }
	.flex-lg-3 { flex: 3 !important; }
	.flex-lg-4 { flex: 4 !important; }
	.flex-lg-5 { flex: 5 !important; }
	
	.jsc-lg-start { justify-content: start !important; }
	.jsc-lg-center { justify-content: center !important; }
	.jsc-lg-end { justify-content: end !important; }
	.jsc-lg-between { justify-content: space-between !important; }
	.ai-lg-start { align-items: start !important; }
	.ai-lg-center { align-items: center !important; }
	.ai-lg-end { align-items: end !important; }
	.ai-lg-stretch { align-items: stretch !important; }

	.gap-lg--5, .gap-lg--5 .inner { gap: 5px !important; }
	.gap-lg-10, .gap-lg-10 .inner { gap: 10px !important; }
	.gap-lg-15, .gap-lg-15 .inner { gap: 15px !important; }
	.gap-lg-20, .gap-lg-20 .inner { gap: 20px !important; }
	.gap-lg-25, .gap-lg-25 .inner { gap: 25px !important; }
	.gap-lg-30, .gap-lg-30 .inner { gap: 30px !important; }
	
	.py-lg-45 { padding-top: 45px !important; padding-bottom: 45px !important; }
	.px-lg-45 { padding-left: 45px !important; padding-right: 45px !important; }
	.py-lg-90 { padding-top: 90px !important; padding-bottom: 90px !important; }
	.px-lg-90 { padding-left: 90px !important; padding-right: 90px !important; }
	
	.w-lg-60 { width: 60% !important; }
	.w-lg-65 { width: 65% !important; }
	.w-lg-70 { width: 70% !important; }
	.w-lg-80 { width: 80% !important; }
	.w-lg-90 { width: 90% !important; }
	.w-lg-100 { width: 100% !important; }
}

/* // X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {  
	.w-xl-60 { width: 60% !important; }
	.w-xl-65 { width: 65% !important; }
	.w-xl-70 { width: 70% !important; }
	.w-xl-80 { width: 80% !important; }
	.w-xl-90 { width: 90% !important; }
	.w-xl-100 { width: 100% !important; }
}

/* // XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) { 
	
}

@media (max-width: 1399px) {
	
}
@media (max-width: 1199px) {
	.flex-1 { flex: 1 !important; }
	.flex-2 { flex: 2 !important; }
	.flex-3 { flex: 3 !important; }
	.flex-4 { flex: 4 !important; }
	.flex-5 { flex: 5 !important; }
	
}
@media (max-width: 991px) {
	.show-mobile { display: block !important; }
	.show-desktop { display: none !important; }
	.flex-img-txt { justify-content: center; align-items: center; flex-direction: column; }
	.px-mobile, .px-mobile .c-column { padding-left: 10px !important; padding-right: 10px !important;}
	.flex-col .flex-1, .flex-col .flex-2, .flex-col .flex-3, .flex-col .flex-4, .flex-col .flex-5 { width: 100%; }
}
@media (max-width: 767px) {
    
}
@media (max-width: 575px) {  
	
}
@media (max-width: 380px) {  
	
}

@media (min-width: 576px) and (max-width: 767px) { }
@media (min-width: 768px) and (max-width: 991px) {  }
@media (min-width: 992px) and (max-width: 1199px) {  }

@media (max-width: 1199px) {  }

@media (max-width: 1399px) {  }

/* The CSS Debugger Component - shows what media element applies 
	<div class="debugger flex-sc gap-2"><button class="btn btn-close btn-sm text-white px-1" onclick="$(this).parent().hide()">X</button></div>
*/
.debugger { display: block; position:fixed; bottom: 0; right: 0; background: #000; z-index: 99999; padding: 3px 10px; color:#fff; }
.debugger::before { content: "min-width: 1400px"; }
@media (max-width: 1399px) {
.debugger::before { content: "max-width: 1399px"; }
}
@media (max-width: 1199px) {  
.debugger::before { content: "max-width: 1199px"; }
}
@media (max-width: 991px) {
.debugger::before { content: "max-width: 991px"; }
}
@media (max-width: 767px) {
.debugger::before { content: "max-width: 767px"; }
}
@media (max-width: 575px) {  
.debugger::before { content: "max-width: 575px"; }
}
@media (max-width: 380px) {  
.debugger::before { content: "max-width: 380px"; }
}
/**/