/* notes
none: more than 900px
lg: 900px
md: 768px
sm: 650px
xs: 450px
*/
/* --------------------------------------------short cuts with ctrl f4 ---------------------------- */
/* 
s0: font
s1: general and variables
s2: text, links size, fonts, align
s3: flex display and columns
s4: grid display
s5: buttons style
s6: icons
s7: background colors
s8: text colors
s9: sections
s10: inputs style
s11: absolute, relative, sticky, fixed and positions
s12: margin section
s13: padding section
s14: list section
s15: max-width section
s16: displays
sbeforeLast: custom style
sLast: media queries
*/
/*--------------------------------------------------- font section s0: ----------------------------------------*/
/*@font-face {*/
/*  font-family: fontLight;*/
/*  src: url(../font-family/helvetica-light-587ebe5a59211.ttf);*/
/*}*/
@font-face {
  font-family: fontRegular;
  src: url(../font-family/helvetica-webfont.ttf);
}
/*@font-face {*/
/*  font-family: fontMedium;*/
/*  src: url(../font-family/Poppins-Medium.ttf);*/
/*}*/
@font-face {
  font-family: fontBold;
  src: url(../font-family/helvetica-bold-webfont.ttf);
}
/*@font-face {*/
/*  font-family: fontBlack;*/
/*  src: url(../font-family/Poppins-Black.ttf);*/
/*}*/
/*--------------------------------------------------- general section s1: ----------------------------------------*/
:root {
    --graysection0: #f7f7f7;
    /*--primaryColor: #FBB042; */
    /*--secondaryColor: #010101;*/
    /*--tertiaryColor: #fff;*/
    --warnMessageColor: red;
    /*--lightFont: fontLight;*/
    --regularFont: fontRegular;
    /*--mediumFont: fontMedium;*/
    --boldFont: fontBold;
    /*--blackFont: fontBlack;*/
    --bodyFontSize: 16px;
    --containerMaxWidth: 1600px;
    --containerMinWidth: 280px;
    --wrapperWidth: 95%;
    --smallTextSize: 0.8rem;
    --textSize: 1rem;
    --titleSize: 2.5rem;
    --titleTwoSize: 2.1rem;
    --titleThreeSize: 1.9rem;
    --titleFourSize: 1.75rem;
    --titleFiveSize: 1.5rem;
    --titleSixSize: 1.2rem;
    --sectionPadding: 60px 0;
    --columnsSpace: 2%;
    --rowSpace: 20px;
    --btnBorderRadius: 28px;
    --btnPadding: 15px 45px;
    --inputPadding: 10px 0px;
    --inputBorderRadius: 28px;
    --iconsWidth: 70px;
    --iconsWidthSecondary: 30px;
    --iconsWidthTertiary: 25px;
    --iconsWidthQuadro: 40px;
    
  }
  *{
    padding: 0;
    margin: 0;
  }
  html, body{
    width: 100%;
    max-width: 100%;
    min-width: 100%;
    margin: auto;
    padding: 0;
    overflow-x: hidden;
    font-family: var(--regularFont);
    font-size: var(--bodyFontSize);
    color: var(--secondaryColor);
    position: relative;
    

  }

  .main-container{
    width: 100%;
    max-width: var(--containerMaxWidth);
    min-width: var(--containerMinWidth);;
    margin: auto;
  }

  .wrapper{
    width: var(--wrapperWidth);
    /*max-width: 1350px;*/
    margin: auto;
  }


  /*--------------------------------------------------- text size and fonts section s2: ----------------------------------------*/
  h1{
    font-size: var(--titleSize);
    font-family: var(--boldFont);
  }
  h2{
    font-size: var(--titleTwoSize);
    font-family: var(--boldFont);
  }
  h3{
    font-size: var(--titleThreeSize);
    font-family: var(--boldFont);
  }
  h4{
    font-size: var(--titleFourSize);
    font-family: var(--boldFont);
  }
  h5{
    font-size: var(--titleFiveSize);
    font-family: var(--boldFont);
  }
  h6{
    font-size: var(--titleSixSize);
    font-family: var(--boldFont);
  }
  p{
    font-size: var(--textSize);
    font-family: var(--regularFont);
    line-height: 28px;
  }
  a{
    font-size: var(--textSize);
    font-family: var(--regularFont);
    text-decoration: none;
    color: var(--primaryColor);
  }
  a.secondary-link{
    font-size: var(--textSize);
    font-family: var(--regularFont);
    text-decoration: none;
    color: var(--secondaryColor);
  }
  a[href^="mailto:"], a[href^="tel:"] {
    color: var(--secondaryColor);
}
a:hover{
    text-decoration: underline;
}
  
  /*.light{*/
  /*  font-family: var(--lightFont) !important;*/
  /*}*/
  .regular{
    font-family: var(--regularFont) !important;
  }
  /*.medium{*/
  /*  font-family: var(--mediumFont) !important;*/
  /*}*/
  .bold{
    font-family: var(--boldFont) !important;
  }
  /*.black{*/
  /*  font-family: var(--blackFont) !important;*/
  /*}*/
  .text-small-size, .text-small-size p, .text-small-size a{
    font-size: var(--smallTextSize) !important;
  }

  .text-normal-size{
    font-size: var(--textSize) !important;
  }
  .text-title6-size{
    font-size: var(--titleSixSize) !important;
  }
  .text-title5-size{
    font-size: var(--titleFiveSize) !important;
  }
  .text-title4-size{
    font-size: var(--titleFourSize) !important;
  }
  .text-title3-size{
    font-size: var(--titleThreeSize) !important;
  }
  .text-title2-size{
    font-size: var(--titleTwoSize) !important;
  }
  .text-title-size{
    font-size: var(--titleSize) !important;
  }
  .text-center{
    text-align: center;
  }
  .text-left{
    text-align: left !important;
  }
  .text-right{
    text-align: right;
  }
  .underline{
      text-decoration: underline;
  }

  /*--------------------------------------------------- flex section s3: ----------------------------------------*/
  .flex-row{
      display: flex;
      flex-wrap: wrap;
  }
  .flex-row-no-wrap{
      display: flex;
      flex-wrap: nowrap;
  }
  .column-gap-20{
      column-gap: 20px;
  }
  .row-gap-20{
      row-gap: 20px;
  }
  .flex-column{
    display: flex;
    flex-direction: column;
  }
 .col-1{
  width: 8.33%;
 }
 .col-2{
  width: 16.66%;
 }
 .col-3{
  width: 25%;
 }
 .col-4{
  width: 33.33%;
 }
 .col-5{
  width: 41.66%;
 }
 .col-6{
  width: 50%;
 }
 .col-6-with-border{
     width: calc(50% - 1px);
     border: 1px solid #DEDEDE;
 }
 .col-7{
  width: 58.33%;
 }
 .col-8{
  width: 66.66%;
 }
 .col-9{
  width: 75%;
 }
 .col-10{
  width: 83.33%;
 }
 .col-11{
  width: 91.66%;
 }
 .col-12{
  width: 100%;
 }
 .max-width-80{
  max-width: 80%;
 }
  .justify-content-center{
    justify-content: center;
  }
  .align-items-center{
    align-items: center;
  }
  .justify-content-space-between{
    justify-content: space-between;
  }
  .justify-content-space-evenly{
    justify-content: space-evenly;
  }
  .justify-content-space-around{
    justify-content: space-around;
  }
  .justify-content-flex-end{
    justify-content: flex-end;
  }
  .justify-content-flex-start{
    justify-content: flex-start;
  }
  /*--------------------------------------------------- grid section s4: ----------------------------------------*/
  .display-grid-2{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    column-gap: var(--columnsSpace);
    grid-row-gap: var(--rowSpace);
  }
  .display-grid-2-with-no-space{
      display: grid;
      grid-template-columns: repeat(2,1fr);
      column-gap: 0;
      grid-row-gap: 0;
  }
  .display-grid-3{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    column-gap: var(--columnsSpace);
    grid-row-gap: var(--rowSpace);
  }
  .display-grid-4{
    display: grid;
    grid-template-columns: repeat(4,1fr);
    column-gap: var(--columnsSpace);
    grid-row-gap: var(--rowSpace);
  }
  .display-grid-5{
    display: grid;
    grid-template-columns: repeat(5,1fr);
    column-gap: var(--columnsSpace);
    grid-row-gap: var(--rowSpace);
  }
  .display-grid-6{
    display: grid;
    grid-template-columns: repeat(6,1fr);
    column-gap: var(--columnsSpace);
    grid-row-gap: var(--rowSpace);
  }
  .center-items-grid{
    place-items: center;
  }
  /*--------------------------------------------------- buttons section s5: ----------------------------------------*/
  .btn{
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    border-radius: var(--btnBorderRadius);
    padding: var(--btnPadding);
    outline: none;
    border: 1px solid var(--primaryColor);
    cursor: pointer;
    font-size: var(--textSize);
    text-transform: uppercase;
    background-color: var(--primaryColor);
    color: var(--secondaryColor);
    text-decoration: none !important;
    font-family: var(--boldFont);
    text-align: center;
  }
  .btn:hover{
      background-color: var(--tertiaryColor);
      color: var(--primaryColor);
  }
  .secondary-btn{
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    border-radius: var(--btnBorderRadius);
    padding: var(--btnPadding);
    outline: none;
    border: 1px solid var(--secondaryColor);
    cursor: pointer;
    font-size: var(--textSize);
    text-transform: uppercase;
    background-color: var(--secondaryColor);
    color: var(--tertiaryColor);
    text-decoration: none !important;
    font-family: var(--boldFont);
    text-align: center;
      
  }
  .secondary-btn:hover{
      color: var(--primaryColor);
  }
  .tertiary-btn{
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    border-radius: var(--btnBorderRadius);
    padding: var(--btnPadding);
    outline: none;
    border: 1px solid var(--tertiaryColor);
    cursor: pointer;
    font-size: var(--textSize);
    text-transform: uppercase;
    background-color: var(--tertiaryColor);
    color: var(--secondaryColor);
    text-decoration: none !important;
    font-family: var(--boldFont);
    text-align: center;
      
  }
  .tertiary-btn:hover{
      color: var(--tertiaryColor);
      background-color: var(--secondaryColor);
  }
  
  /*--------------------------------------------------- icons section s6: ----------------------------------------*/
  .icon{
    width: var(--iconsWidth);
    height: var(--iconsWidth);;
  }
  .icon-secondary{
    width: var(--iconsWidthSecondary);
  }
  .icon-tertiary{
    width: var(--iconsWidthTertiary);
  }
  .icon-quadro{
    width: var(--iconsWidthQuadro);
  }
  /*--------------------------------------------------- background section s7: ----------------------------------------*/
  .bg-primary{
    background-color: var(--primaryColor);
  }
  .bg-secondary{
    background-color: var(--secondaryColor);
  }
  .bg-tertiary{
    background-color: var(--tertiaryColor);
  }
  .bg-gray{
      background-color: var(--graysection0);
  }

  /*--------------------------------------------------- text colors section s8: ----------------------------------------*/
  .color-primary{
    color: var(--primaryColor);
  }
  .color-secondary{
    color: var(--secondaryColor);
  }
  .color-tertiary{
    color: var(--tertiaryColor);
  }
  .color-gray{
      color: gray;
  }
 /*--------------------------------------------------- sections section s9: ----------------------------------------*/
 .section{
  width: 100%;
  padding: var(--sectionPadding);
 }
 /*--------------------------------------------------- input section s10: ----------------------------------------*/
 input[type="text"],input[type="email"],input[type="password"],input[type="tel"],select,textarea{
  color: #9A9A9A;
  width: 100%;
  outline: none;
  padding: var(--inputPadding);
  font-size: var(--smallTextSize);
  font-family: var(--regularFont);
  border-radius: var(--inputBorderRadius);
  border: 1px solid #DEDEDE;
  text-align: center;
  position: relative;
  text-indent: 20px;
  resize: none;
 }
select{
    text-indent: 55px;
    -webkit-appearance: none;
    -moz-appearance: none;
    text-overflow: '';
    position: relative;
}

.dropdown{
    position: relative;
}
.dropdown::after{
 width: 0; 
  height: 0; 
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid var(--secondaryColor);
  position: absolute;
  left: 100%;
  top: 50%;
  transform: translate(-200%,-50%);
  content: "";

}
 
  input:focus, textarea:focus{
  border: 1px solid var(--primaryColor);
 }
 input:focus ~ .input-icon, textarea:focus ~ .input-icon{
  border: 1px solid var(--primaryColor) !important;
 }
 .input-icon.focused{
     border: 1px solid var(--primaryColor);
 }
 .upload-btn{
     position: absolute;
     left: 0;
     top: 0;
     background-color: var(--primaryColor);
     color: white;
     border-radius: 30px;
     padding: 12px 0;
     width: 25%;
     text-align: center;
     font-size: var(--smallTextSize);
     font-family: var(--regularFont);
     
 }
 @media(max-width: 450px)
 {
      .upload-btn{
     width: 35%;
     
 }
 }
.upload-text{
  color: #9A9A9A;
  width: 80%;
  margin-left: 20%;
  padding: 10px 0;
  font-size: var(--smallTextSize);
  font-family: var(--regularFont);
  /*border-radius: var(--inputBorderRadius);*/
  border-top-right-radius: var(--inputBorderRadius);;
  border-bottom-right-radius: var(--inputBorderRadius);;
  border: 1px solid #DEDEDE;
  text-align: center;
  margin-top: 1px;

}
 /**/
 /* Hide the browser's default checkbox */
input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 10;
}
.checkboxContainer {
  display: block;
  position: relative;
  /*padding-left: 35px;*/
  /*margin-bottom: 12px;*/
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

}
/* Create a custom checkbox */
.checkmark {
  position: relative;
  /*top: 0;*/
  /*left: 0;*/
  height: 25px;
  width: 25px;
  background-color: white;
  border: 1px solid #DEDEDE;
  display: block;
}

/* On mouse-over, add a grey background color */
/*.checkboxContainercheckboxContainer:hover input ~ .checkmark {*/
/*  background-color: #ccc;*/
/*}*/

/* When the checkbox is checked, add a blue background */
/*.checkboxContainer input:checked ~ .checkmark {*/
/*  background-color: #2196F3;*/
/*}*/

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: block;
  opacity: 0;
  transition: opacity 0.2s;
}

/* Show the checkmark when checked */
.checkboxContainer input:checked ~ .checkmark:after {
 opacity: 1;

}

/* Style the checkmark/indicator */
.checkboxContainer .checkmark:after {
  left: 50%;
  top: 50%;
  width: 5px;
  height: 10px;
  border: solid var(--primaryColor);
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg) translate(-100%,-25%);
}
 /**/
 .validation-message{
    font-size: var(--smallTextSize);
    /*font-family: var(--lightFont);*/
    color: var(--warnMessageColor) !important;
    position: absolute;
    left: 10px;
    top: 100%;
    margin: 10px 0;
 }
 /*--------------------------------------------------- absolute section s11: ----------------------------------------*/
 .absolute{
      position: absolute;
      left: 0;
      top: 0;
 }
 .relative{
    position: relative;
 }
 .sticky{
  position: sticky;
  top: 0;
  left: 0;
 }
 .fixed{
  position: fixed;
  top: 0;
  left: 0;
 }
 .z-9999{
  z-index: 9999;
 }
 .z-9000{
  z-index: 9000;
 }
 .z-9001{
     z-index: 9001;
 }
 .z-10{
  z-index: 10;
 }
 .z-2{
  z-index: 2;
 }
 .z-1{
  z-index: 1;
 }
 .z-n1{
  z-index: -1;
 }
  /*--------------------------------------------------- margin section s12: ----------------------------------------*/
  
  .m-top-5{
      margin-top: 5px;
  }
  .m-top-10{
      margin-top: 10px;
  }
  
  .m-top-20{
    margin-top: 20px;
  }
  .m-top-30{
    margin-top: 30px;
  }
  .m-top-40{
    margin-top: 40px;
  }
  .m-top-50{
    margin-top: 50px;
  }
  .m-top-60{
    margin-top: 60px;
  }
  .m-bottom-60{
      margin-bottom: 60px;
  }
  .m-r-10{
      margin-right: 10px;
  }
  .m-r-20{
      margin-right: 20px;
  }
  .m-r-40{
      margin-right: 40px;
  }
  .m-l-0{
      margin-left: 0 !important;
  }
  .m-l-10{
      margin-left: 10px;
  }
  .m-l-30{
      margin-left: 30px;
  }
  .m-TB-15{
      margin: 15px 0;
  }
  .m-TB-40{
      margin: 40px 0;
  }
  .m-TB-60{
      margin: 60px 0;
  }
  .m-LR-auto{
      margin-left: auto;
      margin-right: auto;
  }
  .m-B-0i{
      margin-bottom: 0 !important;
  }
  .m-B-0{
      margin-bottom: 0;
  }
  .m-top-n5{
      margin-top: -5px;
  }
  .m-top-n-200{
      margin-top: -200px;
  }
    /*--------------------------------------------------- padding section s13: ----------------------------------------*/
     .pd-TB-5{
        padding-top: 5px;
        padding-bottom: 5px;
    }
    .pd-TB-10{
      padding: 10px 0;  
    }
    .pd-TB-17{
      padding: 17px 0;  
    }
    .pd-TB-20{
      padding: 20px 0;
    }
    .pd-TB-40{
      padding: 40px 0;
    }
    .pd-TB-80{
      padding: 80px 0;
    }
    .pd-TB-50{
        padding: 50px 0;
    }
    .pd-20{
        padding: 20px;
    }
    .pd-30{
        padding: 30px;
    }
    .pd-40{
        padding: 40px;
    }
    .pd-50{
        padding: 50px;
    }
    .pd-B-20{
        padding-bottom: 20px;
    }
    .pd-B-30{
        padding-bottom: 30px;
    }
    .pd-B-5{
        padding-bottom: 5px;
    }
    .pd-B-40{
        padding-bottom: 40px;
    }
    .pd-B-170{
        padding-bottom: 170px;
    }
    .pd-0-45-0-0{
        padding: 0 45px 0 0;
    }
    .pd-30-0-0-0{
        padding: 30px 0 0 0;
    }
    .pd-0-0-0-45{
        padding: 0 0 0 45px;
    }
    .pd-T-0{
        padding-top: 0;
    }
    .pd-T-100{
        padding-top: 100px;
    }
    .pd-B-0{
        padding-bottom: 0;
    }
    .pd-RL-35{
        padding: 0 35px;
    }
    .pd-LR-20{
        padding-left: 20px;
        padding-right: 20px;
    }
    .pd-TB-80i{
        padding: 80px 0 !important;
    }
    .pd-TB-100{
        padding: 100px 0;
    }
    .pd-70-50-40-50{
        padding: 70px 50px 40px 50px;
    }
    .pd-TB-LR-40-30{
        padding: 40px 30px;
    }
    /*--------------------------------------------------- list section s14: ----------------------------------------*/
    ul{
        margin-left: 20px;
    }
  ul li{
    list-style-type: none;
    line-height: 32px;
  }
  ul li:before {
    content: " ";
    position: absolute;
    width: 8px;
    height: 8px;
    background: var(--primaryColor);
    margin-left: -20px;
    margin-top: 11px;
    border-radius: 50%;
}
.bg-secondary ul li:before {
    background: var(--tertiaryColor);
}
/*--------------------------------------------------- max-width section s15: ----------------------------------------*/
.w-90To100{
    width: 90%;
}
.w-max-400{
    max-width: 400px;
}
.w-max-600{
    max-width: 600px;
}
.w-max-800{
    max-width: 800px;
}
.w-max-900{
    max-width: 900px;
}
.w-max-1000{
    max-width: 1000px;
}
.w-max-1100{
    max-width: 1100px;
}
.w-max-1200{
    max-width: 1200px;
}
/*--------------------------------------------------- list section s16: ----------------------------------------*/
.d-none{
    display: none;
}
.d-block{
    display: block;
}
.hide{
    display: none;
}
 /*--------------------------------------------------- custom style section sbeforeLast: ----------------------------------------*/
 .filteringHighlight{
     background-color: yellow !important;
 }
 .success-message{
     color: #2B3;
 }
 .flagsDropDown{
     position: absolute;
     left: 0;
     top:calc(100%);
     padding: 10px;
     transform: translatex(-10px);
     display: none;
 }
 .l-0{
     left: 0;
 }
 .sticky{
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  align-self: flex-start;
 }
 .answer-container{
    border: 1px solid #DEDEDE;
    border-radius: 15px;
    padding: 20px;
    position: relative;
 }
 .answer-container.with-icon::after{
     position: absolute;
     content: "";
     left: 95%;
     top: 20px;
     width: 2px;
     height: 15px;
     background-color: var(--secondaryColor);
     transition: transform 0.2s;
 }
 .answer-container.with-icon::before{
     position: absolute;
     content: "";
     left: 95%;
     top: 20px;
     transform: rotate(90deg);;
     width: 2px;
     height: 15px;
     background-color: var(--secondaryColor);
     transition: transform 0.2s;
 }
 .answer-container.with-icon.close::after{
     transform: rotate(-45deg);
 }
 .answer-container.with-icon.close::before{
     transform: rotate(45deg);
 }
 
     
 .pointer{
     cursor: pointer;
 }
 .read-more{
     position: relative;
     display: flex;
     align-items: center;
     height:50px;
     background: linear-gradient(0deg,white 0%,rgba(255,255,255,.3673844538) 100%);
     cursor:pointer;
     margin-top: -90px;
     padding-top:90px;
 }
 .read-more-txt{
     margin-left: 10px;
     margin-top:-5px;
     color:var(--primaryColor);
 }
 .breadcrumbs{
     display: flex;
     justify-content: center;
     align-items: center;
 }
 .breadcrumbs__current{
     margin-left: 2px;
 }
 ol{
     margin-left: 50px;
 }
 .link-under-cta{
     color: gray;
     font-size: 0.8rem;
     text-decoration: underline;
 }
 .w-14-28{
     width: 14.28%
 }
.col-12-width-pd-10{
    width: calc(100% - 20px);
    padding: 10px;
}
 .btn-on-hover{
     text-align: center;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    border-radius: var(--btnBorderRadius);
    padding: 10px 0;
    outline: none;
    /*border: 0px solid var(--primaryColor);*/
    cursor: pointer;
    text-decoration: none !important;
 }
 .btn-on-hover:hover{
    background-color: var(--primaryColor);
    color: var(--tertiaryColor);
    
 }
 .btn-on-hover.clicked{
        background-color: var(--primaryColor);
        color: var(--tertiaryColor);
 }
 .show-container.clicked{
     border-radius: 20px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2), 0 -5px var(--primaryColor);
 }
 .b-radius-20{
     border-radius: 20px;
 }
 .b-radius-15{
     border-radius: 15px;
 }
 .b-radius-5{
     border-radius: 5px;
 }
     .calendar-grid{
    display: grid;
    grid-template-columns: 50% 50%;
    border-top: 1px solid #DEDEDE;
    border-left: 1px solid #DEDEDE;
    border-right: 1px solid #DEDEDE;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    }
    .session{
    text-align: center;
    border: 0;
    border-radius: 0;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    }
    .left-session{
    border-top-left-radius: 15px;
    border-top-left-radius: 15px;
    }
    .right-session{
    border-top-right-radius: 15px;
    }
    .session:not(.activee) {
    background: var(--graysection0);
    color: var(--secondaryColor);
    
    }
    .activee{
    background: var(--primaryColor);
    color: #fff;
    }
    .session-img{
    width: 100%;
    }
    .session-img:not(.activee){
    display:none;
    }
 .squarebox{
    border-radius: 15px;
    border: 1px solid #DEDEDE;
    height: 100%;
 }
 .timesquarebox{
    border-radius: 15px;
    border: 1px solid #DEDEDE;
    padding: 70px 50px 40px 50px;
 }
 .timecontainer{
     column-gap: 50px;
     justify-content: center;
 }
 .timeblock{
     background-color: var(--tertiaryColor);
     border-radius: 15px;
     box-shadow: 0 15px 40px 0 rgb(34 60 80 / 10%);
     padding: 45px 45px 35px 75px;
     border-top: 4px solid var(--primaryColor);
 }
 .timeblock .image {
    text-align: right;
}
 .border-radius-15{
     border-radius: 15px;
 }
 .circle{
    width: 70px;
    height: 70px;
    color: #fff;
    background: var(--primaryColor);
    font-size: 25px;
    line-height: 28px;
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    border-radius: 50%;
    margin: 0 auto 30px auto;
 }
 .center-vertically{
     flex-direction: column;
     display: flex;
     justify-content: center;
 }
 .colored-bg-section{
     background-color: var(--secondaryColor);
     border-radius: 20px;
     padding: 50px 0;
 }
 @media(min-width: 901px)
 {
     .backover-item-container{
         height: 70px;
     }
 }
 @media(max-width: 900px)
 {
     .backover-item-container{
         margin-top: 20px;
     }
 }
   .btn {
      font-weight: bold;
  }
  .line{
     height: 160px;
     background: #DEDEDE;
     width: 1px;
     position: absolute;
     top: 50%;
     left: 50%;
 }
 
 .breadcrumbs__separator{
    border: solid #A7A7A7;
    border-width: 0 2px 2px 0;
    margin: 0 5px;
    display: inline-block;
    padding: 3px; 
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
 }
 .breadcrumbs__link{
    color: #A7A7A7;
    text-decoration: none;
 }
 .breadcrumbs {
     text-align: center;
    color: #A7A7A7;
    margin-bottom: 25px;
}

 .horizontal-line{
     width: 100%;
     height: 1px;
     background-color: #DEDEDE;
     margin: 60px auto;
 }
.shadow-on-hover:hover{
  border-radius: 20px;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2), 0 -5px var(--primaryColor);
}
.shadow-box{
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
}
.bordered-box{
    border: 1px solid #DEDEDE;
    border-radius: 15px;
}
.border-radius-15{
    border-radius: 15px;
}
.b-radius-top{
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}
.wingman-img{
    position: absolute;
    left:0%;
    top:0;
    z-index:-1;
    width:105%;
    height:100%;
}
@media(max-width: 900px)
{
    .wingman-img-container{
        height: 25vh;
        width: 100%;
    }
    .wingman-img{
    position: absolute;
    left:0%;
    top:0;
    z-index:-1;
    width:100%;
    height:auto;
}
}
@media(max-width: 768px)
{
    .wingman-img-container{
        height: 17vh;
        width: 100%;
    }
}
@media(max-width: 500px)
{
    .wingman-img-container{
        height: 10vh;
        width: 100%;
    }
}
.bg-white{
    background-color: white;
}
.input-icon{
    position: absolute;
    left: 0;
    top: 0;
    height: calc(100% - 2px);
    padding: 0 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #DEDEDE;
    background-color: white;
    z-index: 0;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    
    
}
.input-icon-right{
    position: absolute;
    left: 100%;
    top: 0;
    height: 100%;
    padding: 0 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    border-left: 1px solid #DEDEDE;
    transform: translatex(-100%);
    background: transparent;
    outline: none;
}
.textarea-icon{
    height: 94%;
}
:placeholder-shown {
  text-overflow: ellipsis;
}
/*for tel input*/
.input-container.telContainer .input-icon{
    padding: 0 36px;
}
#phone-nb{
    padding-left: unset !important;
    text-indent: 72px !important;
}
.iti.iti--allow-dropdown.iti--separate-dial-code{
    width: 100%;
}
.iti--separate-dial-code .iti__selected-flag{
    color: #9A9A9A;
}
.iti--separate-dial-code .iti__selected-flag{
    background: unset !important;
}
.iti__country-list{
    color: var(--secondaryColor) !important;
}
/**/
.input-icon img,.input-icon-right img{
    width: 20px;
}
.input-container{
    position: relative;
    margin-top: 40px;
    width: 45%;
    margin-left: auto;
    margin-right: auto;
}
.input-container-full{
    position: relative;
    margin-top: 40px;
    width: 95%;
     margin-left: auto;
    margin-right: auto;
    /*margin-bottom: 40px;*/
}
.register-form-container{
    width:65%;
    background-color: var(--tertiaryColor);
    position: absolute;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
    border-radius: 15px;
    left: 100%;
    top: 50%;
    transform: translate(-50%,-50%);
    
}

@media (min-width: 900px)
{
    .pd-L-40-desk{
        padding-left: 40px;
    }
    .pd-RL-40-desk{
        padding: 0 49px;
    }
}
@media(max-width: 900px)
{
.cookie-popup{
    bottom: 0;
}
.timecontainer{
    column-gap: 0;
    row-gap: 50px;
}
.timeblock{
    padding: 25px;
}
.pd-T-40-lg{
    padding-top: 40px;
}
.w-90To100{
    width: 100%;
}
    .register-form-container{
    width:95%;
    background-color: var(--tertiaryColor);
    position: relative;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
    border-radius: 15px;
    left: unset;
    top: unset;
    margin-left: 2.5%;
    transform: unset;
    
}
.input-container{
    width: 95%;
    margin-left: auto;
    margin-right: auto;
}
.accept-container{
    margin-left: 5%;
    width: 90%;
}
}
.accept-container{
    margin-left: 2.5%;
    color: #acacac;
    font-size: var(--smallTextSize);
    display: flex;
    align-items: center;
}
.accept-container label{
    margin-left: 10px;
    color: #acacac;
}
.accept-container a{
    font-size: var(--smallTextSize);
}
/*header and menu*/
header{
    padding: 20px 0;
    position: relative;
    z-index: 9999;
}
.right-menu-container > div{
    margin-right: 20px;
}
.menu-box{
    cursor: pointer;
}
.menu-container{
    width: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.first-line-menu{
    width: 50%;
    height: 1px;
    background-color: var(--secondaryColor);
    transition: transform 0.5s;
}
.second-line-menu{
    width: 100%;
    height: 1px;
    background-color: var(--secondaryColor);
    margin-top: 3px;
    transition: transform 0.5s;
}
.third-line-menu{
    width: 50%;
    height: 1px;
    background-color: var(--secondaryColor);
    margin-left: auto;
    margin-top: 3px;
    transition: transform 0.5s;
}
.open-menu .first-line-menu{
        margin-left: 1px;
     transform: rotate(45deg);
}
.open-menu .second-line-menu{
    margin-top: 3px;
     transform: rotate(-45deg);
     height: 1px;
}

.open-menu .third-line-menu{
    margin-left: 8.8px;
    transform: translatex(-50%);
    transform: rotate(45deg);
}
.backover-menu{
    width: 100%;
    /*height: 100vh;*/
    background-color: var(--tertiaryColor);
    overflow-y: auto;
    visibility: hidden;
    z-index: -1;
    position: absolute;
    left: 0;
    top: 0;
    transform: translatey(100%);
    transition: transform 0.5s;
    padding: 120px 0;
}
.backover-menu.rise{
    z-index: 9998;
    height: 100vh;
    visibility: visible;
    transform: translatey(0%);
    background-color: var(--graysection0);
}
.backover-menu-header{
    position: relative;
    width: fit-content;
    /*margin-top: 20px;*/
    cursor: pointer;
}
.backover-menu-header::after{
    position: absolute;
    content: "";
    width: 2px;
    height: 16px;
    background-color: var(--secondaryColor);
    left: calc(100% + 30px);
    top: 29%;
    transition: transform 0.2s;
}
.backover-menu-header::before{
    position: absolute;
    content: "";
    width: 2px;
    height: 16px;
    background-color: var(--secondaryColor);
    left: calc(100% + 30px);
    top: 29%;
    transform: rotate(90deg);
    transition: transform 0.2s;
}
/*.show-backover-items-container{*/
/*    padding: 10px 0;*/
/*}*/
.show-sub-items .backover-menu-header::before{
    transform: rotate(45deg);
}
.show-sub-items .backover-menu-header::after{
    transform: rotate(-45deg);
}
.child-items-container{
    /*margin-left: 40px;*/
    max-width: 1000px;
    column-gap: 30px;
    display: none;
    position: absolute;
    left: 0;
    top: 60%;
    /*justify-content: space-evenly;*/
}
@media(max-width: 900px)
{
    .child-items-container{
    flex-direction: column;
    position: unset;
    /*justify-content: space-evenly;*/
}
.child-items-container > div{
    margin: 5px 0;
}
    
}
a.top-over-menu-links{
    color: gray;
    font-size: var(--textSize);
    text-decoration: none;
}
a.top-over-menu-links:hover{
    color: var(--primaryColor);
}
.arrow-line{
    padding: 30px 0 80px 0;
    position: relative;
}
.owl-carousel{
    width: 80% !important;
}
.owl-carousel.carousel-list
{
    width: 90% !important;
    margin-left: auto;
    margin-right: auto;
}
.owl-carousel.carousel-list .owl-stage-outer{
    padding: 20px 0;
}
.carousel-list .owl-item.active.highlighted{
     box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2), 0 -5px var(--primaryColor);
    border-radius: 20px;
}

/*.owl-item.highLighted{*/
/*    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2), 0 -5px var(--primaryColor);*/
/*    border-radius: 20px;*/
/*}*/
/*.owl-wrapper{*/
/*    display: flex !important;*/
/*    align-items: center !important;*/
/*}*/
/*.owl-item{*/
/*    display: flex;*/
/*    align-items: center;*/
/*    justify-content: center;*/
/*}*/
.owl-carousel .owl-item img
{
    width: 50px !important;
}
.owl-carousel .owl-stage{
    display: flex !important;
    align-items: center;
}
.cookie-popup{
    display: none;
}
 .cookie-popup, .static-bar-and-risk{
     width: 100%;
     position: fixed;
     background-color: var(--tertiaryColor);
     /*padding: 20px 0;*/
 }
 .cookie-popup{
     bottom: 49px;
 }
 @media(max-width: 650px)
 {
     .cookie-popup{
         bottom: 45px;
     }
 }
 .static-bar-and-risk{
     bottom: 0;
 }
  @media(max-width: 999px)
    {
        .static-bar-btn{
            padding: 10px !important;
        }
    }
    @media(max-width: 768px)
    {
        .section-session{
            display: none;
        }
        .static-bar-img{
            width: 25px;
        }
    }
    @media(max-width: 650px)
    {
        .static-bar-img{
            width: 50px;
        }
        .static-bar-btn-container{
            position: fixed;
            bottom: 0;
            width: 100vw;
        }
            
        .static-bar-btn{
            width: 100%;
            border-radius: 0;
            padding: 10px 0 !important;
            display: block;
        }
        .static-bar-and-risk{
            bottom: 20px;
        }
    }
    @media(max-width: 600px)
    {
        .w-250-sm{
    width: 250px;
}
    }
    
 /*--------------------------------------------------- media queries section sLast: ----------------------------------------*/
  @media(max-width: 991px)
{
    .line{
        display:none;
    }
    .arrow-line{
        padding: 30px 0;
    }
}
 @media(max-width: 900px)
{
    :root {
      --wrapperWidth: 95%;
      --smallTextSize: 0.8rem;
      --textSize: 1rem;
      --titleSize: 2.2rem;
      --titleTwoSize: 1.9rem;
      --titleThreeSize: 1.75rem;
      --titleFourSize: 1.6rem;
      --titleFiveSize: 1.5rem;
      --titleSixSize: 1.2rem;
      --sectionPadding: 60px 0;
      --columnsSpace: 5%;
      /*--rowSpace: 20px;*/
      --btnBorderRadius: 28px;
      --btnPadding: 15px 30px;
      --inputPadding: 10px 0px;
      --inputBorderRadius: 28px;
      --iconsWidth: 50px;
      --iconsWidthSecondary: 30px;
      --iconsWidthTertiary: 25px;
      }
      .display-grid-1-lg{
        display: grid;
        grid-template-columns: 100%;
        column-gap: 0;
        grid-row-gap: var(--rowSpace);
      }
      .display-grid-2-lg{
        display: grid;
        grid-template-columns: repeat(2,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .display-grid-2{
          grid-template-columns: 100%;
      }
      .display-grid-2-with-no-space{
      display: grid;
      grid-template-columns: 100%;
      column-gap: 0;
      grid-row-gap: 0;
  }
      .display-grid-3-lg{
        display: grid;
        grid-template-columns: repeat(3,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .display-grid-4-lg{
        display: grid;
        grid-template-columns: repeat(4,1fr);
        column-gap: var(--columnsSpace);
      }
      .display-grid-5-lg{
        display: grid;
        grid-template-columns: repeat(5,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .display-grid-6-lg{
        display: grid;
        grid-template-columns: repeat(6,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .col-1-lg{
        width: 8.33%;
       }
       .col-2-lg{
        width: 16.66%;
       }
       .col-3-lg{
        width: 25%;
       }
       .col-4-lg{
        width: 33.33%;
       }
       .col-5-lg{
        width: 41.66%;
       }
       .col-6-lg{
        width: 50%;
       }
       .col-7-lg{
        width: 58.33%;
       }
       .col-8-lg{
        width: 66.66%;
       }
       .col-9-lg{
        width: 75%;
       }
       .col-10-lg{
        width: 83.33%;
       }
       .col-11-lg{
        width: 91.66%;
       }
       .col-12-lg{
        width: 100%;
       }
       .pd-TB-20-lg{
      padding: 20px 0;
    }
    .pd-TB-40-lg{
      padding: 80px 0;
    }
    .pd-TB-50-lg{
        padding: 50px 0;
    }
    .pd-20-lg{
        padding: 20px;
    }
    .pd-50-lg{
        padding: 50px;
    }
    .pd-B-40-lg{
        padding-bottom: 40px;
    }
    .text-center-lg{
        text-align: center;
    }
    .d-none-lg{
    display: none;
}
.d-block-lg{
    display: block;
}
.pd-0-45-0-0, .pd-0-0-0-45{
    padding: 0;
}
.m-top-40-lg{
        margin-top: 40px;
      }
      .flex-row-lg{
    display: flex;
    flex-wrap: wrap;
}
.static-lg{
    position: static;
}
}
@media(max-width: 768px)
{
    :root {
      --wrapperWidth: 80%;
      --smallTextSize: 0.8rem;
      --textSize: 1rem;
      --titleSize: 2rem;
      --titleTwoSize: 1.75rem;
      --titleThreeSize: 1.5rem;
      --titleFourSize: 1.4rem;
      --titleFiveSize: 1.3rem;
      --titleSixSize: 1.2rem;
      --sectionPadding: 60px 0;
      --columnsSpace: 5%;
      /*--rowSpace: 20px;*/
      --btnBorderRadius: 28px;
      --btnPadding: 15px 30px;
      --inputPadding: 10px 0px;
      --inputBorderRadius: 28px;
      --iconsWidth: 50px;
      --iconsWidthSecondary: 30px;
      --iconsWidthTertiary: 25px;
      }
      .display-grid-1-md{
        display: grid;
        grid-template-columns: 100%;
        column-gap: 0;
      }
      .display-grid-2-md{
        display: grid;
        grid-template-columns: repeat(2,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
  /*    .display-grid-2-with-no-space-md{*/
  /*    display: grid;*/
  /*    grid-template-columns: repeat(2,1fr);*/
  /*    column-gap: 0;*/
  /*    grid-row-gap: var(--rowSpace);*/
      
  /*}*/
      .display-grid-3-md{
        display: grid;
        grid-template-columns: repeat(3,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .display-grid-4-md{
        display: grid;
        grid-template-columns: repeat(4,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .display-grid-5-md{
        display: grid;
        grid-template-columns: repeat(5,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .display-grid-6-md{
        display: grid;
        grid-template-columns: repeat(6,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .col-1-md{
        width: 8.33%;
       }
       .col-2-md{
        width: 16.66%;
       }
       .col-3-md{
        width: 25%;
       }
       .col-4-md{
        width: 33.33%;
       }
       .col-5-md{
        width: 41.66%;
       }
       .col-6-md{
        width: 50%;
       }
       .col-7-md{
        width: 58.33%;
       }
       .col-8-md{
        width: 66.66%;
       }
       .col-9-md{
        width: 75%;
       }
       .col-10-md{
        width: 83.33%;
       }
       .col-11-md{
        width: 91.66%;
       }
       .col-12-md{
        width: 100%;
       }
       .text-center-md{
        text-align: center;
       }
       .m-top-20-md{
        margin-top: 20px;
      }
      .m-top-30-md{
        margin-top: 30px;
      }
      .m-top-40-md{
        margin-top: 40px;
      }
      .m-top-50-md{
        margin-top: 50px;
      }
      .m-top-60-md{
        margin-top: 60px;
      }
       .pd-TB-20-md{
      padding: 20px 0;
    }
    .pd-TB-40-md{
      padding: 80px 0;
    }
    .pd-20-md{
        padding: 20px;
    }
    .pd-50-md{
        padding: 50px;
    }
    .pd-LR-20-md{
        padding-left: 20px;
        padding-right: 20px;
    }
    .d-none-md{
    display: none;
}
.d-block-md{
    display: block;
}
.flex-direction-column-md{
    flex-direction: column;
}
}
@media(max-width: 650px)
{
    :root {
      --wrapperWidth: 90%;
      --smallTextSize: 0.8rem;
      --textSize: 1rem;
      --titleSize: 2rem;
      --titleTwoSize: 1.75rem;
      --titleThreeSize: 1.5rem;
      --titleFourSize: 1.4rem;
      --titleFiveSize: 1.3rem;
      --titleSixSize: 1.2rem;
      --sectionPadding: 60px 0;
      --columnsSpace: 5%;
      --btnBorderRadius: 28px;
      --btnPadding: 15px 30px;
      --inputPadding: 10px 0px;
      --inputBorderRadius: 28px;
      --iconsWidth: 50px;
      --iconsWidthSecondary: 30px;
      --iconsWidthTertiary: 25px;
      }
      .display-grid-1-sm{
        display: grid;
        grid-template-columns: 100%;
        column-gap: 0;
        grid-row-gap: var(--rowSpace);
      }
      .display-grid-2-sm{
        display: grid;
        grid-template-columns: repeat(2,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
  /*    .display-grid-2-with-no-space-sm{*/
  /*    display: grid;*/
  /*    grid-template-columns: repeat(2,1fr);*/
  /*    column-gap: 0;*/
  /*    grid-row-gap: var(--rowSpace);*/
      
  /*}*/
      .display-grid-3-sm{
        display: grid;
        grid-template-columns: repeat(3,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .display-grid-4-sm{
        display: grid;
        grid-template-columns: repeat(4,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .display-grid-5-sm{
        display: grid;
        grid-template-columns: repeat(5,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .display-grid-6-sm{
        display: grid;
        grid-template-columns: repeat(6,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .col-1-sm{
        width: 8.33%;
       }
       .col-2-sm{
        width: 16.66%;
       }
       .col-3-sm{
        width: 25%;
       }
       .col-4-sm{
        width: 33.33%;
       }
       .col-5-sm{
        width: 41.66%;
       }
       .col-6-sm{
        width: 50%;
       }
       .col-7-sm{
        width: 58.33%;
       }
       .col-8-sm{
        width: 66.66%;
       }
       .col-9-sm{
        width: 75%;
       }
       .col-10-sm{
        width: 83.33%;
       }
       .col-11-sm{
        width: 91.66%;
       }
       .col-12-sm{
        width: 100%;
       }
       .text-center-sm{
        text-align: center;
    }
        .pd-TB-20-sm{
      padding: 20px 0;
    }
    .pd-TB-40-sm{
      padding: 80px 0;
    }
    .pd-20-sm{
        padding: 20px;
    }
    .pd-50-sm{
        padding: 50px;
    }
    .m-top-20-sm{
        margin-top: 20px;
    }
    .m-top-30-sm{
        margin-top: 30px;
    }
    .d-none-sm{
    display: none;
}
.d-block-sm{
    display: block;
}
.justify-content-center-sm{
    justify-content: center;
}
.m-r-0-sm{
      margin-right: 0;
  }
  .m-l-0-sm{
      margin-left: 0;
  }
  .m-LR-auto-sm{
      margin-left: auto;
      margin-right: auto;
  }
  .m-top-0-sm{
      margin-top: 0;
  }
  .pd-B-30-sm{
      padding-bottom: 30px;
  }
  .pd-B-60-sm{
      padding-bottom: 60px;
  }
  .pd-15-sm{
      padding: 15px;
  }
  h1{
      line-height: 40px;
  }
  h2{
      line-height: 35px;
  }
}
@media(max-width: 450px)
{
    :root {
      --wrapperWidth: 90%;
      --smallTextSize: 0.8rem;
      --textSize: 1rem;
      --titleSize: 2rem;
      --titleTwoSize: 1.75rem;
      --titleThreeSize: 1.5rem;
      --titleFourSize: 1.4rem;
      --titleFiveSize: 1.3rem;
      --titleSixSize: 1.2rem;
      --sectionPadding: 60px 0;
      --columnsSpace: 5%;
      --btnBorderRadius: 28px;
      --btnPadding: 15px 30px;
      --inputPadding: 10px 0px;
      --inputBorderRadius: 28px;
      --iconsWidth: 50px;
      --iconsWidthSecondary: 30px;
      --iconsWidthTertiary: 25px;
      }
      .display-grid-1-xs{
        display: grid;
        grid-template-columns: 100%;
        column-gap: 0;
        grid-row-gap: var(--rowSpace);
      }
      .display-grid-2-xs{
        display: grid;
        grid-template-columns: repeat(2,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
  /*    .display-grid-2-with-no-space-xs{*/
  /*    display: grid;*/
  /*    grid-template-columns: repeat(2,1fr);*/
  /*    column-gap: 0;*/
  /*    grid-row-gap: var(--rowSpace);*/
      
  /*}*/
      .display-grid-3-xs{
        display: grid;
        grid-template-columns: repeat(3,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .display-grid-4-xs{
        display: grid;
        grid-template-columns: repeat(4,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .display-grid-5-xs{
        display: grid;
        grid-template-columns: repeat(5,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .display-grid-6-xs{
        display: grid;
        grid-template-columns: repeat(6,1fr);
        column-gap: var(--columnsSpace);
        grid-row-gap: var(--rowSpace);
      }
      .col-1-xs{
        width: 8.33%;
       }
       .col-2-xs{
        width: 16.66%;
       }
       .col-3-xs{
        width: 25%;
       }
       .col-4-xs{
        width: 33.33%;
       }
       .col-5-xs{
        width: 41.66%;
       }
       .col-6-xs{
        width: 50%;
       }
       .col-7-xs{
        width: 58.33%;
       }
       .col-8-xs{
        width: 66.66%;
       }
       .col-9-xs{
        width: 75%;
       }
       .col-10-xs{
        width: 83.33%;
       }
       .col-11-xs{
        width: 91.66%;
       }
       .col-12-xs{
        width: 100%;
       }
        .pd-TB-20-xs{
      padding: 20px 0;
    }
    .pd-TB-40-xs{
      padding: 80px 0;
    }
    .pd-20-xs{
        padding: 20px;
    }
    .pd-50-xs{
        padding: 50px;
    }
    .pd-30-20-xs{
        padding: 30px 20px;
    }
    .d-none-xs{
    display: none;
}
.d-block-xs{
    display: block;
}
.flex-row-xs{
    display: flex;
}
.pd-10-xs{
    padding: 10px;
}
.text-small-size-xs, .text-small-size-xs p, .text-small-size-xs a{
    font-size: 12px !important;
  }
  .justify-content-center-xs{
      justify-content: center;
  }

}