*{
  margin:0px;padding:0px;
}


html,body{
  font-family: 'DM Sans', helvetica, arial, sans-serif;
  font-size: 1.3vw;
  color: #000;
  background-color: #fff;
}

h1,h2,h3,h4{
  font-family: 'Sora'; text-transform: uppercase; font-weight: 300; letter-spacing: 0.5vw;
}
h1{ font-size: 3vw; }
h2{ font-size: 1.8vw; }

a{ color: #000; }



/* misc classes */
.formular{
  font-family: 'Formular', helvetica, arial, sans-serif;
}
.sora{
  font-family: 'Sora', helvetica, arial, sans-serif; text-transform: uppercase;
}
.dmsans{
  font-family: 'DM Sans', helvetica, arial, sans-serif;
}

.black{background-color: #000; color: #fff; }

.block{ width: 100%; clear:both; min-height: 10px; position: relative;  padding: 100px 0px; }
.blockHeader{ width: 100%; text-align:center; position:relative; }
.clear{width: 100%; height: 1px; display: block; clear:both; }

.black{background-color:#000; color: #fff; }
.blueberry{ background-color: #87c455; color: #333; }
.lightblue{background-color: #2ebead; color: #333; }
.honey{ background-color: #ff8d35; color: #333; }
.grapefruit{background-color: #ed425a; color: #333;}
.strawberryApple{background-color: #87c455; color: #333;}
.peach{ background-color: #ff8d35; color: #333; }
.paleGreen{background-color: #2ebead; color: #333;}

#saveBtn{
  position:fixed;
  bottom:0px; right: 0px;
  background-color: #ff0000;
  z-index: 99999999999999999; font-size: 18px; font-weight:bold; text-transform: uppercase; padding: 8px 15px; color: #fff;  cursor: pointer;
}


.wrapper{
  display:block;
  margin: auto;
  max-width: 1920px;
  width: 100%;
  margin-top: 10%;
}

/* page top */
.topLine{
  width: 100%; height: auto; clear:both;
  text-align:center; font-size: 1.4vw; padding: 10px 0px;
}
.topLine a{color: #fff; }



.header{ width:100%; clear:both; position: fixed; z-index: 10; background-color: #FFF; top: 0px; }
.headerInner{ position:relative; width: 80%; margin:auto; padding: 2% 0% 6% 0%; }

.logo{float:left; width: 10%; }
.logo img, .menuBtn img, .kv img, .whyContentImage img, .productIconImg img{width: 100%; }
.menuBtn{ float:right; width: 24px; margin-top: 2%; cursor: pointer; }

.menu a{ text-decoration: none; margin: 20px; }
.menu{ font-size: 1vw; position:absolute; top: 46%; right: 40px; display: none;  }
.menuItemSpecial{ background-color: #4d456e; color: #fff; padding: 5px 8px; }




/* content blocks */
.kv{ position:relative; }
.kv img{line-height: 1px; }
.kvTitle, .kvText{ position:absolute; color: #fff; text-align:center;  }
.kvTitle{ top: 40%; left: 15%; width: 20%; }
.kvText{ width: 20%; top: 40%; right: 15%; }



.brownBlock{
  background-color: #dbe8e5; text-align:center; height: auto; margin-top: -7px; padding: 20px 0px;
}
.brownItem{
  display: inline-block; width: 10%; margin: 0% 10%; vertical-align: middle;
}


.videoBlock{position:relative;}
.videoBlock video{ width: 100%; height: auto; }
.soundBtns{ width: 36px; height: 36px; position:absolute; z-index: 10; top: 20px; left: 20px; background: url(../img/sound-on.png) no-repeat; background-size: 100%; cursor :pointer; }
.soundBtns.off{background: url(../img/sound-off.png) no-repeat; background-size: 100%; }





.whySwitch{ padding-bottom: 40px; }
.whyContentLine{
  width: 80%; margin: 5% auto;
  clear:both; position:relative;
}
.whyContentImage{
  width: 50%;
}
.whyContentText{
  width: 40%;
}
.whyContentTextMain{margin-top: 20px;}

.whyContentLine:nth-child(2){
    margin-top: 10%;
}

.whyContentLine:nth-child(2) .whyContentImage,
.whyContentLine:nth-child(3) .whyContentText,
.whyContentLine:nth-child(4) .whyContentImage{
  float:right; }

.whyContentLine:nth-child(2) .whyContentText,
.whyContentLine:nth-child(3) .whyContentImage,
.whyContentLine:nth-child(4) .whyContentText{
  float:left; }


.colorLine{ position:absolute; z-index: 3; text-transform:uppercase; font-size: 1vw; font-weight: 100; letter-spacing: 0.3vw; padding: 10px 20px; width: 12%; }


#cl1{top: 119%; right : 5%; transform: rotate(-24deg); }
#cl2{top: 12%; left : 10%; transform: rotate(-24deg); z-index:4; }
#cl3{top: 13%; left : 21%; transform: rotate(5deg); }
#cl4{top: 70%; right : 30%; transform: rotate(30deg); width: 15%; }
#cl5{top: 5%; left : 35%; transform: rotate(15deg); width: 15%; }
#cl6{top: -8%; right : 5%; transform: rotate(39deg);  }
#cl7{bottom: 2%; left : 15%; transform: rotate(-60deg);  }

.webshopBtn{ background-color: #fd8e40; color: #333; position:fixed; padding: 10px 15px; bottom: 20%; right: 0px; z-index: 99999; display: inline-block; font-size: 0.9vw; letter-spacing: normal; width: auto; }
.webshopBtn a{color: #000; text-decoration: none; width: 100%; height: 100%; display: block;  }


.productInner{
  background-color: #dbe7e5;
  color: #4c446d;
  width: 80%; margin:auto;
  padding: 10%;
}
.productIntro{width: 60%; margin: 30px auto 0 auto; text-align:center;  }

.mainProductGroup{
  position:relative; width: 90%; margin: 50px auto 100px auto; text-align:center;
}
.mainProductGroup img{width: 80%; margin: auto; }
.productText{
  position:absolute; width: 30%;
}
.productTextMain{margin-top: 15px;}
#productText1{top: 18%; left: -5%;}
#productText2{top: 27%; right: -5%;}
#productText3{top: 64%; left: -7%;}
#productText4{top: 64%; right: -7%;}
#productText5{bottom: -24%; left: 31%; width: 40%;}

.productIconsGroup{margin: 200px auto 0  auto; text-align:center; width: 100%; }
.productIcon{display: inline-block; width: 15%; margin: 3%; vertical-align: top; }
.productIconImg{width: 50%; margin: auto;}
.productIconText{ margin: 20px auto 0 auto; }
.productTextMain{font-size: 1vw; }
.productTextTitle h2{ font-size: 1.5vw; }


/* taste  */
.sliderGroup{width: 80%; margin: auto; position:relative; margin-top: 50px;  }
.slider{ text-align:center; }
.sliderBlock{
  display: inline-block; vertical-align: top;
  width: calc(80% / 6);
}
.sliderImage img { width: 50%; }
.sliderTitle{ width: 80%; margin:auto;  }
.sliderArrow{
  position:absolute; top: 43%;
  width: 3%; height: 7%; background: url(../img/icon-slider-arrow.svg) no-repeat center;z-index:10; cursor: pointer;
}
.productGroup2 .sliderArrow{display: none;}
.arrowLeft{left: 1%; transform: rotate(180deg); }
.arrowRight{right: 1%; }
.tns-nav{display: none; }
.tasteSeperator{ width: 80%; height: 1px; background-color: #000; margin: 5% auto; }
#cl8{ bottom: -60%; right : 18%; transform: rotate(-10deg); width: 14%; font-size: 1.4vw;  }
.productGroup2{margin-top: 120px;}



/* why */
.ceo{position:relative; width: 100%; clear:both; visibility: hidden; }
.ceo img{width: 100%; line-height: 1px;}
.whyTitle, .quote, .quoteAuthor{ position:absolute; color: #8d192c; text-align:left;  }
.whyTitle{ top: 35%; left: 52%; }
.quote{ width: 40%; top: 45%; left: 52%; font-size: 1.8vw; }
.quoteAuthor{width: 20%; top: 60%; left: 52%; }



/* where temp  */
.mapBlockTemp{ background: url(../img/where-map.jpg) no-repeat top; min-height: 400px; }
.mapTitleArrow{width: 40px; display: inline-block; vertical-align: middle; margin-left: 10px; transition: all 0.3s; }
.mapTitleTemp{display: inline-block; vertical-align: middle; }
.mapTitleArrow img{width: 100%; transition: all 0.3s;}
.mapTitleArrow.open img{transform: rotate(180deg); }
.mapBlockHeaderTemp{cursor: pointer;}
.mapTempBlock{display: none; width: 80%; text-align:center; margin: 50px auto 0px auto; }
.mapTempLogo{ display: inline-block; width: 12%; margin: 1%; vertical-align: top; }
.mapTempLogo img{width: 100%; }


/* where */
.where{
  clear:both; width: 100%; color: #4c446d; position: relative; background-color: #dbe7e4;
}
.where img{width: 100%; }

.whereTitle{ position:absolute; top: 10%; left: 40%; font-size: 2.5vw; width: 30%; text-align: center;  }

.whereChecklist{ position:absolute; top: 30%; left: 10%; text-transform: uppercase; font-size: 1.3vw; letter-spacing: 0.3vw; width: 60%; outline:none;
-webkit-touch-callout: none;
  -webkit-user-select: none;
   -khtml-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }
.whereChecklistInner{position:relative; }
.checkGroup{ margin-top: 3%; padding-bottom: 2%; width: 100%; border-bottom: solid 1px #4c446d; cursor: pointer; clear: both; }
.checkbox{ width: 30px; height: 30px; display: inline-block; vertical-align: middle; cursor: pointer; background: url(../img/icon-map-check.svg) no-repeat center; transform: rotate(90deg); }
.checkbox.active{transform: rotate(0deg); }
.checkboxText{ display: inline-block; vertical-align: middle; }

.listContainer{ position: absolute; width:100% }
.countryBlock{ display: inline-grid; width: 40%; margin-top: 4%; font-size: 1vw; }
.countryName{ margin-bottom: 3%; cursor: pointer; }
.contactInfo{ font-size: 0.7vw; text-transform: none; }


/* map block  */
.mapBlockInner{
  width: 80%; text-align:center; margin: auto;
}
.mapBlockHeader{ text-align:center; width: 100%; }
.mapBlockSearchInput{
  width: 50%; margin: 30px auto;
}
#search{
  border: none; border-bottom: 1px #000 solid; width: 100%;
  padding:0px 0px 10px 20px; outline: none; font-size: 1.5vw;
}
.searchBtn{ background-color: #ed5b36; text-transform: uppercase; display: inline-block; vertical-align: middle; color: #fff; padding: 5px 10px; cursor: pointer; }
.searchBtnClosest{ background-color: #99173d; text-transform: uppercase; display: inline-block; vertical-align: middle; color: #fff; padding: 5px 10px; cursor: pointer; }
.map{width: 100%; height: 500px; margin-top: 30px;}




/* responsibility */
.responsibilityIntro{ width: 40%; margin: 5% auto; text-align:center; }

.responsibilityBlocks{ text-align:center; width: 80%; margin: auto; }

.responsibilityItem{ display: inline-block; vertical-align: middle; width: 40%; margin: 4%; }
.responsibilityItemImage{width: 30%; margin-right: 5%; display: inline-block; vertical-align: middle; }
.responsibilityItemImage img{width: 100%;}

.responsibilityItemText{width: 60%; display: inline-block; vertical-align: middle; text-align:left; }
.respTextMain{ margin-top: 20px; }




/* contacts  */
.contacts{ background-color: #dbe7e5; }
.contactsHeader{text-align:left; color: #4c446d; }
.contactsInner{width: 80%; margin:auto; }

.contactsGroup{
  position:relative; width: 100%; text-align:center; margin-top: 50px;
}
.contactsGroupSide{
  display: inline-block; vertical-align: top; text-align:left;
}
.contactsGroupSide:nth-child(1){ width: 30%; margin-right: 5%; }
.contactsGroupSide:nth-child(2){ width: 64%; }
.contactsInputGroup{
  margin-top: 3%; position:relative;
}
.contactsInputGroupTextarea{margin-top:1%;}
.text, select.text{
  width: 90%; height: 90%;
  padding: 3% 5%; border: none;
  text-transform: uppercase;
  font-size: 1vw; letter-spacing: 0.2vw;
  color: #4c446d;
}
select.text{width: 100%; background:none; background-color: #fff; -webkit-appearance: none; }
.dropdownGroup:after {
    content: '\0025BC';
    font: normal normal normal 12px/1 FontAwesome;
    color: #4c446d;
    right: 14px;
    top: 0px;
    height: 26px;
    padding: 15px 0px 0px 8px;
    position: absolute;
    pointer-events: none;
}
.contactsTextarea{
  width: 96%; height: 85%; border:none; font-size: 1vw; letter-spacing: 0.2vw; padding: 2%; resize: none; clear:both;
}
.contactsTextarea::placeholder{
  padding: 12% 20%;
  width: 60%;
  text-align:center;
}
.submitBtn{
  cursor: pointer;
  background-color: #4c446d;
  color: #b2cacc;
  display: inline-block;
  padding: 1% 3%;
  float:right;
  clear:both;
  text-transform: uppercase;
}
.submitGroup{margin-top: 1%; }
.ajaxResponse{float:right;}







/* footer */
.footer{ padding: 30px 0px; }
.footerInner{ width: 80%; margin:auto;  }
.footerLogo img{ width: 100%; }
.footerLogo{ width: 10%; float:left; margin-top: 50px;  }
.footerContacts, .privacyBlock{width: 20%; float:right; font-size: 1vw; }
.privacyBlock{margin-top: 10px; }


.error{border: solid 1px #ff0000; }


.pc{display:block;}
.mob{display:none;}

.uk-modal.uk-open {
    opacity: 1;
}

.uk-modal {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 999999;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background: rgba(0,0,0,.6);
        background-repeat: repeat;
        background-image: none;
        background-size: auto;
    opacity: 0;
    -webkit-transition: opacity .15s linear;
    transition: opacity .15s linear;
    touch-action: cross-slide-y pinch-zoom double-tap-zoom;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.uk-open .uk-modal-dialog {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

.uk-modal-dialog {
    position: relative;
    box-sizing: border-box;
    margin: 50px auto;
    padding: 20px;
    width: 600px;
    height: 200px;
    max-width: 100%;
    max-width: calc(100% - 20px);
    background: #dbe7e5;
    opacity: 0;
    -webkit-transform: translateY(-100px);
    transform: translateY(-100px);
    -webkit-transition: opacity .3s linear,-webkit-transform .3s ease-out;
    transition: opacity .3s linear,transform .3s ease-out;
}

.uk-modal-header {
    margin-bottom: 15px;
    border-bottom: none !important;
}

.uk-modal-header h2 {
    font-size: 1vw;
    letter-spacing: 0px;
    font-family: 'Formular';
    text-align: center;
}

.uk-button {
    -webkit-appearance: none;
    margin: 0;
        margin-top: 0px;
    border: none;
    overflow: visible;
    font: inherit;
        font-size: inherit;
        line-height: inherit;
    color: #444;
    text-transform: none;
    display: inline-block;
    box-sizing: border-box;
    padding: 0 12px;
    background: #eee;
    vertical-align: middle;
    line-height: 30px;
    min-height: 30px;
    font-size: 1rem;
    text-decoration: none;
    text-align: center;
}

.uk-button-large {
    min-height: 40px;
    padding: 0 15px;
        padding-top: 0px;
    line-height: 1.6em;
    font-size: 16px;
}

.uk-button:not(:disabled) {
    cursor: pointer;
}

.uk-button-primary {
    background-color: #4c446d !important;
    color: #fff !important;
}

.uk-button-default {
    border: solid !important;
    background-color: #dbe7e5 !important;
}

#surbma-yes-no-popup .uk-modal-footer.surbma-yes-no-popup-button-left {
    text-align: center;
}

#surbma-yes-no-popup .uk-modal-content, #surbma-yes-no-popup .uk-modal-footer, #surbma-yes-no-popup .uk-modal-header {
    overflow: hidden;
}

.uk-modal-footer {
    margin-top: 7%;
    border-top: none !important;
}

#gdprpopup { position: fixed; z-index: 99999; top: 0; right: 0; bottom: 0; left: 0; display: none;  }
.gdpr-dialog { position: absolute; top: 25%; left: 55%; background-color: #B2CACC; padding: 1%; text-align: center; }
.gdpr-close { color: #4C446D; left: 48%; position: relative; margin-top: -4%; font-family: 'Sora'; cursor: pointer; }
.gdpr-modal-header {  }
.gdpr-modal-header h2 { font-family: 'Formular'; font-size: 1vw; text-transform: none; font-weight: normal; letter-spacing: normal; color: #4C446D; }
.gdpr-modal-footer { margin-top: 5%; }
.gdpr-button { cursor: pointer; min-height: 40px; padding: 0 15px; padding-top: 0px; line-height: 1.6em; min-width: 100px; border: none; font-family: 'DM Sans'; text-transform: uppercase; letter-spacing: 0.1vw; font-size: 0.8vw; font-weight: bold; }
.gdpr-button-ok { background-color: #4C446D; color: #FFF; }
.gdpr-button-cancel { background-color: #B2CACC; color: #4C446D; }

.gdpr-text { position: relative; width: 80%; left: 10%; font-family: 'DM Sans'; font-size: 1vw; }

@media all and (max-width: 960px){

  .pc{display:none;}
  .mob{display:block;}

  body{font-size: 3vw;}
  h1{font-size: 6vw;}
  h2{font-size: 4vw;}

  .logo{width: 20%; }
  .menuBtn{margin-top: 5px;}
  .kvTitle{top:8%; left: 35%; width: 30%;}
  .kvText{width: 50%; top: 83%; right: 25%; }
  .block{ padding: 50px 0px; }
  .menu{font-size: 4vw; top: 90%; z-index:5; right: 0px; background-color: #fff; width: 100%; }
  .menu a{clear:both; display: block;width: calc(100% - 8px); padding-left:8px; }
  .menu a.menuItemSpecial{width: calc(91% - 16px);}
  .headerInner{padding: 8% 0% 14% 0%; }
  .header{padding:0px;}
  .topLine{font-size: 3vw;}

  .brownBlock{padding: 20px 0px;}
  .brownItem{ width: 80%;  font-size: 3.5vw; margin: 4% 10%; }
  .whyContentText, .whyContentImage{width: 100%; float:none; margin-top: 10%;  }
  .whyContentLine:nth-child(2) .whyContentImage, .whyContentLine:nth-child(4) .whyContentImage{ margin-right: -30%; }
  .whyContentLine:nth-child(3) .whyContentImage{ margin-left: -30%; }
  .whyContentLine:nth-child(2) .whyContentImage{margin-right: -40%; }

  .colorLine{font-size: 2.5vw; width: 20%; padding: 5px 10px;}
  .whySwitch{overflow:hidden;}
  #cl1{top:94%;}
  #cl2{ top:17%;left:3%; }
  #cl3{top: 19%;left:11%; }
  #cl4{top:47%;right:13%;width: 35%; }
  #cl5{top:14%;left: 45%;width:35%; }
  #cl6{top:30%;right:58%; }
  #cl7{top:1%;bottom:auto;}

  .sliderImage img { width: 80%; }

  .productInner{width: 100%; padding: 100px 0px 50px 0px; }
  .productIntro{width: 80%; }
  .mainProductGroup img.productMainImage{ width: 40%; margin-right:0px; }
  .productText{ width: 55%; text-align:left; }
  .productTextMain{font-size: 2.5vw; line-height: 4vw; margin-top:5px;}
  .productTextTitle h2{font-size: 3vw; }
  #productText1{ top: -5%; left: 2%; }
  #productText2{top: 22%; left: 2%;}
  #productText3{top: 45%; left: 2%; }
  #productText4{top: 70%; left: 2%; }
  #productText5{bottom: -9%; left: 2%; width: 55%;}
  .productIcon{width: 35%;}
  .productIconText{ text-align:left;  }
  .productIconImg{margin:0; margin-left: -10%;}
  .mainProductGroup{margin: 100px auto;}
  .productIconsGroup{margin-top: 130px;}
  .product-slider2 .sliderBlock{width: 40%;}
  #cl8{bottom: -114%; right: 5%; width: 30%; font-size: 3.5vw;}
  .productGroup2 .sliderArrow{display: block;}
  .arrowRight{right: -5%;}

  .whyTitle{left: 20%; top: 9%;}
  .quote{width: 48%; font-size: 4vw; left: 13%; top: 20%;}
  .quoteAuthor{left: 32%; top: 39%;width:50%;}
  .whereTitle{top: 5%; width: 60%; left: 20%; }

  .checkbox{ width: 15px; height: 15px; }
  .countryBlock { width: 100%; font-size: 3vw; }
  .contactInfo{ font-size: 2vw; }
  .whereChecklist{font-size: 2vw; top: 29%;}
  .checkboxText{margin-left: 3%; }
  .checkGroup{margin-top: 3%; }

  #responsibility{width: 80%; margin: auto; }
  .responsibilityIntro, .responsibilityBlocks, .responsibilityItem{width: 100%;}
  .responsibilityItemText{width: 80%; margin-left: 0px; display: block;}
  .responsibilityItemImage{width: 25%; }
  .responsibilityItem{margin-top: 10%;}
  .responsibilityItemImage{display: block;}
  .responsibilityItemText{margin-top:5%; }
  .respTextTitle{font-size: 4vw;}

  .contactsHeader{ text-align:center; }
  .contactsGroupSide:nth-child(1), .contactsGroupSide:nth-child(2){width: 100%; margin-right: 0%;}
  .contactsGroupSide:nth-child(2){margin-top: 10%; }

  input.text, .contactsTextarea, select.text{font-size: 3vw; }
  .submitBtn{padding: 3% 5%; font-size: 4vw; letter-spacing: 0.5vw;}
  .contactsTextarea::placeholder{  padding: 25% 10%; width: 80%; }
  /* .dropdownGroup:after {top: 4px;} */

  .footerLogo{margin-top: 0px; width: 25%; float:none; }
  .footerContacts{float:none;width: 60%; font-size: 3vw; margin-top: 5%; }

  .uk-modal-dialog { height: 200px; }
  .uk-modal-header h2 { font-size: 3vw; }
  .uk-modal-footer { margin-top: 15px; }
  .uk-button { width: 100%; margin-top: 1% !important; }
  .gdpr-dialog { top: 33%; left: 58%; width: 38%; min-height: 160px; }
  .gdpr-close { margin-top: 0; left: 47%; font-size: 4vw; }
  .gdpr-modal-header h2 { font-size: 5vw; }
  .gdpr-button { min-height:25px; font-size: inherit; }

  .gdpr-text { font-size: 3vw; }

  .mapTempLogo{ width: 20%; }

  #search{font-size: 2vw; }
  .mapBlockSearchInput{ width: 80%;  }
}



@media all and (max-width: 640px){

.mapTempLogo{ width: 30%; }
#search, .searchBtn, .searchBtnClosest{font-size: 4vw; }

}



@media all and (max-width: 480px){



}




@media all and (min-width: 1920px){
  body{ font-size: 24px; }
  h1{font-size: 60px;}
  h2{font-size: 35px;}
  .colorLine, .text, .contactsTextarea{font-size: 20px; }
  .quote{font-size: 38px;}
  .productTextMain{font-size: 17px; }
  .productTextTitle h2{ font-size: 22px; }
  #cl8{font-size: 25px;}
}



@font-face {
    font-family: 'DM Sans';
    src: url('../fonts/DMSans-Italic.eot');
    src: url('../fonts/DMSans-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans-Italic.woff2') format('woff2'),
        url('../fonts/DMSans-Italic.woff') format('woff'),
        url('../fonts/DMSans-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

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

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



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