
@font-face {
    font-family: 'Lato';
    src: url('../font/Lato-Regular.ttf') format('truetype');
    font-weight: 400;
}

@font-face {
    font-family: 'Lato';
    src: url('../font/Lato-Bold.ttf') format('truetype');
    font-weight: 700;
}

@font-face {
    font-family: 'Lato';
    src: url('../font/Lato-BoldItalic.ttf') format('truetype');
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: 'Lato';
    src: url('../font/Lato-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}


@font-face {
    font-family: 'Roboto';
    src: url('../font/Roboto-VariableFont_wdth,wght.ttf') format('truetype');
    font-style: normal;
}



@font-face {
    font-family: 'fontello';
    src: url('../font/fontello.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

  [class^="icon-"]:before, [class*=" icon-"]:before {
    font-family: "fontello";
    font-style: normal;
    font-weight: normal;
    speak: never;
  
    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center; 
    font-variant: normal;
    text-transform: none;
    line-height: 1em;
    margin-left: .2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  





  body { font-family:'Lato', 'Courier New', Courier, monospace; }
  .color-primary { color:#ff6600  ; }
  .color-white { color:#fff; }
  .color-gray {color:#797979;}

  a {color:#ff6600; text-decoration: none;}
  .tracking-tight {
  letter-spacing: -0.03em;
}

h2 { color:#ff6600; letter-spacing: -0.03em; font-size:3rem; font-weight:600; margin-bottom:.5em; line-height:3.2rem; }
ul li { margin-bottom:1em; }
.lead { font-size:1.15em; }

.bg-primary { background-color:#ff6000!important; }
.bg-dark { background-color: #333!important}


@media (max-width: 1200px) { 
  #hero p.display-4 { font-size:1.15em; }
  h2 { font-size:2rem; line-height:2.2rem; }

}

.btn {
    --bs-btn-padding-x: 1.25rem;
    --bs-btn-padding-y: 0.45rem;
    --bs-btn-font-family: Roboto ;
    --bs-btn-font-size: 1rem;
    --bs-btn-font-weight: 600;
    --bs-btn-line-height: 1.5;
    --bs-btn-color: var(--bs-body-color);
    --bs-btn-bg: transparent;
    --bs-btn-border-width: var(--bs-border-width);
    --bs-btn-border-color: transparent;
    --bs-btn-border-radius: var(--bs-border-radius);
    --bs-btn-hover-border-color: transparent;
    --bs-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15),0 1px 1px rgba(0, 0, 0, 0.075);
    --bs-btn-disabled-opacity: 0.65;
    --bs-btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);
    display: inline-block;
    padding: var(--bs-btn-padding-y) var(--bs-btn-padding-x);
    font-family: var(--bs-btn-font-family);
    font-size: var(--bs-btn-font-size);
    font-weight: var(--bs-btn-font-weight);
    line-height: var(--bs-btn-line-height);
    color: var(--bs-btn-color);
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    border: var(--bs-btn-border-width) solid var(--bs-btn-border-color);
    border-radius: 25px;
    background-color: var(--bs-btn-bg);
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out
}


.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #ff6000;
    --bs-btn-border-color: #ff6000;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #E14D03;
    --bs-btn-hover-border-color: #E14D03;
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #E14D03;
    --bs-btn-active-border-color: #E14D03;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #0d6efd;
    --bs-btn-disabled-border-color: #0d6efd
}

.btn-secondary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #6c757d;
    --bs-btn-border-color: #6c757d;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #5c636a;
    --bs-btn-hover-border-color: #565e64;
    --bs-btn-focus-shadow-rgb: 130,138,145;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #565e64;
    --bs-btn-active-border-color: #51585e;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #6c757d;
    --bs-btn-disabled-border-color: #6c757d
}



.btn-outline-primary {
    --bs-btn-color: #ff6000;
    --bs-btn-border-color: #ff6000;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #ff6000;
    --bs-btn-hover-border-color:#ff6000;
    --bs-btn-focus-shadow-rgb: 13,110,253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #ff6000;
    --bs-btn-active-border-color: #ff6000;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #0d6efd;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #0d6efd;
    --bs-gradient: none
}

.btn-outline-secondary {
    --bs-btn-color: #6c757d;
    --bs-btn-border-color: #6c757d;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #6c757d;
    --bs-btn-hover-border-color: #6c757d;
    --bs-btn-focus-shadow-rgb: 108,117,125;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #6c757d;
    --bs-btn-active-border-color: #6c757d;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #6c757d;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #6c757d;
    --bs-gradient: none
}


.form-control {
    display: block;
    width: 100%;
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-body-color);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: var(--bs-body-bg);
    background-clip: padding-box;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out
}


.form-control:focus {
    color: var(--bs-body-color);
    background-color: var(--bs-body-bg);
    border-color: #b8b8b8;
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(155,155,155,.10)
}

.btn-lg { font-size:1.15rem;
    padding:.5rem 2rem;
  }



/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/* Navmenu - Desktop */
header a { color:#fff; text-decoration:none; transition:all .5s; }
header a:hover { color:#ff6600; }


@media (min-width: 1200px) {
  .navmenu {
    padding: 0;
  }

  .navmenu ul {
    margin: 0;
    padding: 0;
    display: flex;
    list-style: none;
    align-items: center;
  }

  .navmenu li {
    position: relative;
  }

  .navmenu a,
  .navmenu a:focus {
    color: #fff;
    text-transform:uppercase;
    padding: 18px 15px;
    font-size: 14px;
    font-family: Roboto;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: space-between;
    white-space: nowrap;
    transition: 0.3s;
    text-decoration: none;
  }

  .navmenu a i,
  .navmenu a:focus i {
    line-height: 0;
    margin-left: 5px;
    transition: 0.3s;
    font-size:1.25rem;
  }

  .navmenu li:last-child a {
    padding-right: 0;
  }

  .navmenu li:hover>a,
  .navmenu .active,
  .navmenu .active:focus {
    color: #ff6000;
  }

  .navmenu .dropdown ul {
    margin: 0;
    padding: 10px 0;
    background:#dfdfdf;
    display: block;
    position: absolute;
    visibility: hidden;
    left: 14px;
    top: 130%;
    opacity: 0;
    transition: 0.3s;
    border-radius: 4px;
    z-index: 99;
    box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);
  }

  .navmenu .dropdown ul li {
    min-width: 200px;
  }

  .navmenu .dropdown ul a {
    padding: 10px 20px;
    font-size: 15px;
    text-transform: none;
    color:#252525;
  }

  .navmenu .dropdown ul a i {
    font-size: 12px;
  }

  .navmenu .dropdown ul a:hover,
  .navmenu .dropdown ul .active:hover,
  .navmenu .dropdown ul li:hover>a {
    color: #ff6000;
  }

  .navmenu .dropdown:hover>ul {
    opacity: 1;
    top: 100%;
    visibility: visible;
  }

  .navmenu .dropdown .dropdown ul {
    top: 0;
    left: -90%;
    visibility: hidden;
  }

  .navmenu .dropdown .dropdown:hover>ul {
    opacity: 1;
    top: 0;
    left: -100%;
    visibility: visible;
  }
}

/* Navmenu - Mobile */
@media (max-width: 1199px) {
  .mobile-nav-toggle {
    color:#fff;
    font-size: 28px;
    line-height: 0;
    margin-right: 10px;
    cursor: pointer;
    transition: color 0.3s;
  }

  .navmenu {
    padding: 0;
    z-index: 9997;
  }

  .navmenu ul {
    display: none;
    list-style: none;
    position: absolute;
    inset: 60px 20px 20px 20px;
    padding: 10px 0;
    margin: 0;
    border-radius: 12px;
    background-color: #f9f9f9;
    overflow-y: auto;
    transition: 0.3s;
    z-index: 9998;
    box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.1);
  }

  .navmenu a,
  .navmenu a:focus {
    color:#252525;
    padding: 10px 20px;
    font-family:Roboto;
    font-size: 17px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: space-between;
    white-space: nowrap;
    transition: 0.3s;
  }

  .navmenu a i,
  .navmenu a:focus i {

    line-height: 0;
    margin-left: 5px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: 0.3s;
    background-color: color-mix(in srgb, var(--accent-color), transparent 90%);
    font-size:1.4rem;
  }

  .navmenu a i:hover,
  .navmenu a:focus i:hover {
    background-color: #ff6000;
    color: #fff;
  }

  .navmenu a:hover,
  .navmenu .active,
  .navmenu .active:focus {
    color: #ff6000;
  }

  .navmenu .active i,
  .navmenu .active:focus i {
    background-color: #e3e3e3;
    color: #252525;
    transform: rotate(180deg);
  }

  .navmenu .dropdown ul {
    position: static;
    display: none;
    z-index: 99;
    padding: 10px 0;
    margin: 10px 20px;
    /*background-color: yellow;*/
    border: 1px solid #ededed;
    box-shadow: none;
    transition: all 0.5s ease-in-out;
  }

  .navmenu .dropdown ul ul {
    background-color: rgba(33, 37, 41, 0.1);
  }

  .navmenu .dropdown>.dropdown-active {
    display: block;
    background-color: #dedede;
  }

  .mobile-nav-active {
    overflow: hidden;
  }

  .mobile-nav-active .mobile-nav-toggle {
    color: #fff;
    position: absolute;
    font-size: 28px;
    top: 15px;
    right: 15px;
    margin-right: 0;
    z-index: 9999;
  }

  .mobile-nav-active .navmenu {
    position: fixed;
    overflow: hidden;
    inset: 0;
    background: rgba(33, 37, 41, 0.8);
    transition: 0.3s;
  }

  .mobile-nav-active .navmenu>ul {
    display: block;
  }
}

#header .container-fluid {
  transition: all 0.4s;
  background-color: rgba(30, 30, 30, 0);
}

#header.scrolled .container-fluid {
  background-color: rgba(10, 10, 10, 0.60);
  backdrop-filter: blur(10px);
}


.portal { font-size:.9em; padding-left:1em; border-left:1px solid #ccc; }




/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
.hero {
  padding-top: 80px;
  min-height: 100vh;
  position: relative;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden;
  padding-bottom: 80px;
}

.hero img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

.hero:before {
  content: "";
  background: color-mix(in srgb, var(--background-color), transparent 30%);
  position: absolute;
  inset: 0;
  z-index: 2;
  border-radius: 0;
}

.hero .container {
  position: relative;
  z-index: 3;
}

.hero h2 {
  margin: 0;
  font-size: 48px;
  font-weight: 700;
}

.hero p.display-4 {
  margin: 10px 0 0 0;
  font-size: 24px;
  color: color-mix(in srgb, var(--default-color), transparent 20%);
}

.hero p span {
  color: var(--accent-color);
  letter-spacing: 1px;
  border-bottom: 2px solid var(--accent-color);
}

.hero .social-links {
  margin-top: 30px;
  display: flex;
  justify-content: center;
  gap: 15px;
}

.hero .social-links a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--default-color), transparent 92%);
  color: var(--default-color);
  font-size: 20px;
  transition: 0.3s;
}

.hero .social-links a:hover {
  background: var(--accent-color);
  color: var(--contrast-color);
  transform: translateY(-3px);
}

.dark-background {
  --background-color: rgba( 6,6,6,.20);
  --default-color: #ffffff;
  --heading-color: #ffffff;
  --surface-color: #252525;
  --contrast-color: #ffffff;
}


/*@media (max-width: 768px) {
  .hero h2 {
    font-size: 32px;
  }

  .hero p {
    font-size: 20px;
  }
}
*/



#hero h1 {
/*  color:#fff;
  font-size: 4em;
  letter-spacing: -.03em;
  font-weight: 900;*/
  text-shadow: 2px 2px 2px rgba(35,35,35,0.40);
}

#hero .display-4 {
  font-size: 1.85em;
}


.login {
  background-color: #f9f9f9;
  border-radius: 10px;
}


.login label {
  font-weight: 700;
  font-size: 1.2em;
  color: #424242;
}

.login label i {
  font-size: 1.4em;
  color: #B4B4B4;
  margin-right: .3em;
}


#benefits .card {
  display: flex;
  flex-direction: column;
  text-align: center;
  padding: 3.5em!important;
}

#benefits .card i { font-size:5em; color:#ff6000; margin-bottom:.3em; }
#benefits .card h3 { font-weight:700; }

.steps { 
  display:flex; 
  flex-direction:column; 
  justify-content:center; 
  align-items:center; 
  font-size:1.4em; 
  font-weight:bold;
  text-align: center;
  line-height: 1.1em;
} 

.steps span {
  display:flex; 
  justify-content: center; 
  align-items:center; 
  width:130px; 
  height:130px; 
  border-radius:70px; 
  border:3px solid #ff6600; 
  padding:.5em; 
  font-size:4em; 
  font-weight:bold; 
  margin-bottom:.5em; 
  font-family: Roboto; 
  color:#ff6000;
}


@media (max-width: 1200px) { 
  .steps { 
  flex-direction:row; 
  justify-content:start; 
  align-items:center; 
  text-align: start;
  margin-bottom: 0;
} 

.steps span {
  margin-right: .5em;
  margin-bottom:0; 






  width:90px; 
  height:90px; 
  border-radius:45px; 

  padding:.4em; 
  font-size:2.8em; 

}



}


#faq h2.accordion-header button {  }



#faq .accordion {
    --bs-accordion-color: var(--bs-body-color);
    --bs-accordion-bg: var(--bs-body-bg);
    --bs-accordion-transition: color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out,border-radius 0.15s ease;
    --bs-accordion-border-color: none;
    --bs-accordion-border-width: none;
    --bs-accordion-border-radius: none;
    --bs-accordion-inner-border-radius:none;
    --bs-accordion-btn-padding-x: 1.25rem;
    --bs-accordion-btn-padding-y: 1rem;
    --bs-accordion-btn-color: var(--bs-body-color);
    --bs-accordion-btn-bg: var(--bs-accordion-bg);
    --bs-accordion-btn-icon: none;
    --bs-accordion-btn-icon-width: 1.25rem;
    --bs-accordion-btn-icon-transform: rotate(-180deg);
    --bs-accordion-btn-icon-transition: transform 0.2s ease-in-out;
    --bs-accordion-btn-active-icon: none;
    --bs-accordion-btn-focus-border-color: #86b7fe;
    --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(200, 200, 200, 0.25);
    --bs-accordion-body-padding-x: 1.25rem;
    --bs-accordion-body-padding-y: 1rem;
    --bs-accordion-active-color: var(--bs-primary-text-emphasis);
    --bs-accordion-active-bg: var(--bs-primary-bg-subtle)
}

#faq .accordion-button {
    padding: 1.55rem;
    font-size: 1.15rem;
    color: color:#515151;
    text-align: left;
    background-color: var(--bs-accordion-btn-bg);
    border: 0;
    border-radius: 0;
    overflow-anchor: none;
    transition: var(--bs-accordion-transition);
    font-weight:600; 
    border-bottom: 1px solid #ff6600;
    line-height:1.3rem ;
}



#faq .accordion-button:not(.collapsed) {
    color: #fff;
    background-color: #ff6000;
    box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color)
}

#faq  .accordion-button:not(.collapsed)::after {
    background-image: var(--bs-accordion-btn-active-icon);
    transform: var(--bs-accordion-btn-icon-transform)
}

#faq .accordion-button::after {
    flex-shrink: 0;
    width: 30px;
    height:30px;
    margin-left: auto;
    font-family: Fontello;
    content: '\e848';
    background-image: var(--bs-accordion-btn-icon);
    background-repeat: no-repeat;
    background-size: var(--bs-accordion-btn-icon-width);
    transition: var(--bs-accordion-btn-icon-transition);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.6rem;

}

.accordion-button:focus {
    z-index: 3;
    border-color: var(--bs-accordion-btn-focus-border-color);
    outline: 0;
    box-shadow: var(--bs-accordion-btn-focus-box-shadow)
}

#cta .container-fluid {
  background-image: url(../img/bg-cta.png);
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}





/****** Footer ****/


footer › .container .row {
    padding-top: 4em
}

footer {
    color: #8d8d8d;
    font-size: 14px
}

footer p {
    line-height: 1.4em
}


footer strong {
    font-weight: 500
}

footer h5 {
    color: #fff;
    font-style: normal
}

footer ul {
    list-style-type: none;
    padding-left: 0
}



#footer p {
    padding: 0!important
}

footer a {
    color: #fff
}

footer a:hover {
    color: #f60;
    text-decoration: none
}



footer>div:nth-child(2) {
    display: flex;
    justify-content: center
}


#contentSocial ul {
    padding-top: 1em
}

footer .container:nth-child(2) {
    flex-direction: column
}

.list-column {
    column-count: 2;
    column-gap: 40px
}

footer ul li { margin-bottom:0; } 

.footer-contact {
    border-top: 1px solid #525252;
    padding-top: 3rem;
}


@media(max-width: 990px) {
    footer h5 i {
        display:inline-block;
        width: 25px;
        height: 25px
    }

    #contentSocial ul {
        padding-left: 0;
        padding-top: 1em
    }

    #contentSocial .icon-facebook-squared,#contentSocial .icon-twitter-squared,#contentSocial .icon-youtube-play {
        margin-right: 0
    }
}

.field-validation-error {
    color: #f00;
}

.field-validation-valid {
    display: none;
}
