@font-face {
    font-family: 'Manrope-Regular';
    src: url('./fonts/Manrope-Regular.eot');
    src: url('./fonts/Manrope-Regular.eot?#iefix') format('embedded-opentype'),
        url('./fonts/Manrope-Regular.woff2') format('woff2'),
        url('./fonts/Manrope-Regular.woff') format('woff'),
        url('./fonts/Manrope-Regular.ttf') format('truetype'),
        url('./fonts/Manrope-Regular.svg#Manrope-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: 'Manrope-Medium';
    src: url('./fonts/Manrope-Medium.eot');
    src: url('./fonts/Manrope-Medium.eot?#iefix') format('embedded-opentype'),
        url('./fonts/Manrope-Medium.woff2') format('woff2'),
        url('./fonts/Manrope-Medium.woff') format('woff'),
        url('./fonts/Manrope-Medium.ttf') format('truetype'),
        url('./fonts/Manrope-Medium.svg#Manrope-Medium') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
  }

  @font-face {
    font-family: 'Manrope-SemiBold';
    src: url('./fonts/Manrope-SemiBold.eot');
    src: url('./fonts/Manrope-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('./fonts/Manrope-SemiBold.woff2') format('woff2'),
        url('./fonts/Manrope-SemiBold.woff') format('woff'),
        url('./fonts/Manrope-SemiBold.ttf') format('truetype'),
        url('./fonts/Manrope-SemiBold.svg#Manrope-SemiBold') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: 'Manrope-Bold';
    src: url('./fonts/Manrope-Bold.eot');
    src: url('./fonts/Manrope-Bold.eot?#iefix') format('embedded-opentype'),
        url('./fonts/Manrope-Bold.woff2') format('woff2'),
        url('./fonts/Manrope-Bold.woff') format('woff'),
        url('./fonts/Manrope-Bold.ttf') format('truetype'),
        url('./fonts/Manrope-Bold.svg#Manrope-Bold') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
  }

  @font-face {
    font-family: 'Manrope';
    src: url('Manrope-ExtraBold.eot');
    src: url('Manrope-ExtraBold.eot?#iefix') format('embedded-opentype'),
        url('Manrope-ExtraBold.woff2') format('woff2'),
        url('Manrope-ExtraBold.woff') format('woff'),
        url('Manrope-ExtraBold.ttf') format('truetype'),
        url('Manrope-ExtraBold.svg#Manrope-ExtraBold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
 }
 @font-face {
    font-family: 'Poppins-Medium';
    src: url('./fonts/Poppins-Medium.eot');
    src: url('./fonts/Poppins-Medium.eot?#iefix') format('embedded-opentype'),
        url('./fonts/Poppins-Medium.woff2') format('woff2'),
        url('./fonts/Poppins-Medium.woff') format('woff'),
        url('./fonts/Poppins-Medium.ttf') format('truetype'),
        url('./fonts/Poppins-Medium.svg#Poppins-Medium') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
  }

  :root{
    --primary-font:'Manrope-Regular';
    --secondary-font:'Manrope-Medium';
    --manrope-semibold:'Manrope-SemiBold';
    --manrope-bold:'Manrope-Bold';
    --poppins-medium:'Poppins-Medium';
    --primary-color:#4c4c4c;
    --primary-color-white:#ffffff;
    --primary-color-black:#111111;
    --button-bg:#f89e1e;
    --secondary-color-grey:#1c1c1c;
    --light-grey:#f7f7f7;

    --fw-light:300;
    --fw-regular:400;
    --fw-medium:500;
    --fw-semibold:600;
    --fw-bold:700;
    --fw-extra-bold:800;
}
*{outline:none;box-sizing:border-box;margin:0;padding:0;}
input,button{-moz-appearance:none;-webkit-appearance:none;}
input,button,div,ul,li{outline:none !important;}
div{box-sizing:border-box;}
.manrope-regular{font-family: var(--primary-font);}
.manrope-medium{font-family: var(--secondary-font);}
.manrope-semibold{font-family: var(--manrope-semibold);}
.manrope-bold{font-family: var(--manrope-bold);}
.poppins-medium{font-family: var(--poppins-medium);}

.primary-black{color: var(--primary-color-black);}
.primary-white{color: var(--primary-color-white);}
.primary-color{color: var(--primary-color);}
.secondary-color{color: var( --secondary-color-grey);}

.light-grey{background-color: var( --light-grey);}
.btn-black-bg{background-color: var(--primary-color-black);}
.common-btn-bg{background-color: var(--button-bg);}
.common-grey-bg{background-color: var(--grey-bg);}

a:link,a:visited{text-decoration:none;}
img{border:none;outline:none;}
ul,ul li{list-style-type:none}
.desktop{display:block;}
.mobile{display:none;}
.helperSpan{display:inline-block;vertical-align:middle;width:1px;height:100%;}
.relative{position:relative;}
.absolute{position:absolute;}
.fixed{position: fixed;}
.leftAuto{left: 0;}
.topAuto{top: 0;}
.highIndex{z-index: 999;}
.clr{clear:both}
.floatLft{float:left}
.floatRgt{float:right}
.inlineBlk{display:inline-block;vertical-align:middle}
.table{display:table}
.transition{transition:all .35s ease 0s;-moz-transition:all .35s ease 0s;-webkit-transition:all .35s ease 0s;}
.col-100{width:100%}
.col-90{width:90%}
.col-80{width:80%}
.col-70{width:70%}
.col-60{width:60%}
.col-50{width:50%}
.col-40{width:40%}
.col-30{width:30%}
.col-20{width:20%}
.col-10{width:10%}
.flexDisplay{display:flex;}
.justifySpace{justify-content:space-between;}
.justifyStart{justify-content:flex-start;}
.justifyEnd{justify-content:flex-end;}
.justifyCenter{justify-content:center;}
.alignStart{align-items:flex-start;}
.alignEnd{align-items:flex-end;}
.alignCenter{align-items:center;}
.flexWrap{flex-flow:row wrap;}
.flexColumn{flex-direction:column;}
.textCenter{text-align:center;}
.textLeft{text-align:left;}
.textRight{text-align:right;}
.textUpper{text-transform: uppercase;}
.fwRegular{font-weight: var(--fw-regular);}
.fwLight{font-weight: var(--fw-light);}
.fwMedium{font-weight: var(--fw-medium);}
.fwSemibold{font-weight: var(--fw-semibold);}
.fwBold{font-weight: var(--fw-bold);}
.fwExtraBold{font-weight: var(--fw-extra-bold);}