@font-face {
    font-family: 'ClanOT';
    src: url('../assets/fonts/ClanOT-Book.ttf') format('opentype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'ClanOT';
    src: url('../assets/fonts/ClanOT-News.ttf') format('opentype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'ClanOT';
    src: url('../assets/fonts/ClanOT-Medium.ttf') format('opentype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'ClanOT';
    src: url('../assets/fonts/ClanOT-Bold.ttf') format('opentype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'ClanOT';
    src: url('../assets/fonts/ClanOT-Black.ttf') format('opentype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}


*{font-family: 'ClanOT', sans-serif;font-weight: 700;}
h1{line-height: 1!important;}




.light{font-weight: 300;}
.book{font-weight: 400;}
.medium{font-weight: 500;}
.bold{font-weight: 700;}
.black{font-weight: 900;}


/* Colors Utility Classes */
:root{
    --pri-color:#FFED00;
    --sec-color: #238C96;
    --black-color: #000000;
    --white-color: #ffffff;
}

/* Colors & BG colors utility classes */
.color-pri{color:var(--pri-color)}
.bg-pri{background-color:var(--pri-color)}

.color-sec{color:var(--sec-color)}
.bg-sec{background-color:var(--sec-color)}

.color-transparent{color: transparent;}


/* Font Sizes Utility Classes */
.fs10{font-size:10px;}
.fs12{font-size:12px;}
.fs14{font-size:14px;}
.fs16{font-size:16px;}
.fs18{font-size:18px;}
.fs20{font-size:20px;}
.fs22{font-size:22px;}
.fs24{font-size:24px;}
.fs26{font-size:26px;}
.fs28{font-size:28px;}
.fs32{font-size:32px;}
.fs36{font-size:36px;}
.fs48{font-size:48px;}
.fs60{font-size:60px;}
.fs75{font-size:75px;}
.fs85{font-size:85px;}
.fs90{font-size:90px;}
.fs100{font-size:100px;}
.fs120{font-size:120px;}
@media screen and (max-width:1400px){
  .fs100{font-size:70px;}
}
@media screen and (max-width:1024px){
    .fs18{font-size:16px;}
    .fs20{font-size:17px;}
    .fs22{font-size:18px;}
    .fs24{font-size:20px;}
    .fs26{font-size:20px;}
    .fs28{font-size:22px;}
    .fs32{font-size:24px;}
    .fs36{font-size:28px;}
    .fs48{font-size:32px;}
    .fs60{font-size:36px;}
    .fs75{font-size:42px;}
    .fs85{font-size:46px;}
    .fs90{font-size:52px;}
    .fs100{font-size:58px;}
    .fs120{font-size:64px;}
}
*{transition: all 0.3s ease;}
h2{font-weight: 400!important;}
/* Z-Index Utility Classes */
.zi0{z-index: 0;}
.zi1{z-index: 1;}
.zi2{z-index: 2;}
.zi3{z-index: 3;}

/* Text decoration Utility Classes */
.underline{text-decoration: underline;}
.lh1{line-height: 1em;}

/* Unsetting default html styles */
a {border: none;}
a:not(.underline){text-decoration: none!important;}
a:visited,a:hover,a:focus,a:active {
    color: inherit; 
    text-decoration: none; 
    outline: none; 
}
p{margin-bottom: 0!important;}
button{border: none; outline: none;}
#page{overflow-x:hidden;}
.page,.post{margin:0!important;}
@media screen and (max-width: 767px) {
  .container-fluid {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  .container-fluid {
    padding-left: 50px !important;
    padding-right: 50px !important;
  }
}
@media screen and (min-width: 1024px) {
  .container-fluid {
    padding-left: 100px !important;
    padding-right: 100px !important;
  }
}

/* Header */
.header-main{background: white;}
.navbar-toggler{border: none!important;}
.navbar-toggler-icon{
    width: 2em!important;
    height: 2em;
}
.header-main .nav-link{
    font-weight: 800;
    color: #000000;
    text-transform: uppercase;
}
.nav-link:hover{
    color: var(--sec-color)!important;
}
.nav-link.active{
    color: var(--sec-color)!important;
}
@media screen and (max-width:990px){
    .header-main .nav-link{font-size: 18px;}
    .header-main .navbar-nav{gap: 0px;}
}
@media screen and (max-width:1200px){.header-main .nav-link{font-size: 20px;}}
@media screen and (max-width:1600px){.header-main .nav-link{font-size: 22px;}}
@media screen and (min-width:1601px){.header-main .nav-link{font-size: 26px;}}
@media screen and (min-width:990px){.header-main .navbar-nav{gap: 2vw;}}
ul{
    margin: 0;
}
.footer-main .nav-link{
    font-size: 19px;
    padding: 4px 0px;
}
.footer-main .footer-menu{
    width: 450px;
    max-width: 100%;
}

.cover_image{
    object-fit: cover;
    object-position: center;
}

.theme-button{
  padding: 12px 50px;
  font-size: 36px;
  text-transform: uppercase;
  font-weight: 700;
}
.btn-filled-green{
  background-color: var(--sec-color);
  color: white;
}
.btn-filled-yellow{
  background-color: var(--pri-color);
  color: black;
}
.btn-filled-green:hover,.btn-filled-yellow:hover{
  background-color: black;
  color: var(--pri-color);
}
.btn-outline-black,.btn-outline-white{
  border: 3px solid;
  border-radius: 0px;
  background:transparent;
}
.btn-outline-black{
  border-color: black;
  color: black;
}
.btn-outline-white{
  border-color: white;
  color: white;
}
.btn-outline-black:hover,.btn-outline-white:hover{
  background-color: var(--sec-color);
  color: white;
  border-color: var(--sec-color);
}
@media screen and (max-width:990px) {
  .theme-button{
  padding: 6px 30px;
  font-size: 16px;
}
}

input, select, .wc-blocks-components-select__container{
  border-radius: 0px!important;
}
input:focus, select:focus, .wc-blocks-components-select__container:focus{
  border-color: var(--sec-color)!important;
}

/* Happy forms */
