html, body{ margin:0; padding:0; width:100%; height:100%; font-size: 100%; background: #141718;  color:#fff;}
.header{ position: absolute; top:0; left: 0; padding:20px; width:100%; display:block; background:#141718; z-index: 9999;}
.logo{ text-align: left; display: flex; align-items: center; align-content: center; height:50px; width:100%;}
.logo > .penta{  display: inline-flex;  margin: 0 5px; text-decoration: none; color:#fff;}
.logo .logo-words{ padding: 0 0 0 10px; margin-left: 10px; border-left: 1px solid #777777; line-height: 1.2; font-weight:600; font-size: 1.4rem;}
.header .navy{ text-align: right; padding:5px; }
.btns{ position: relative; padding:9px 20px; margin: 0 5px 0 0; text-align: center;  color:#777777; overflow: hidden; text-decoration: none;  border-radius:2px; transition:all .5s ease;}
.btns-lg{padding:15px 30px; font-size: 1.3rem; overflow: hidden;}
.btns-ylw{ background: #FFCB29; color:#000000;}
.btns-border-ylw{ border:1px solid #FFCB29; color: #FFCB29;}
.btns:before {
    content: "\2794";
    position: absolute;
    top: 20%;
    right: 15%;
    width: 10px;
    height: 100%;
    transition: all 0.5s;
    border-radius: 2px;
    border-right: 10px solid transparent;
    opacity:0;
    /* z-index: -1; */
  }
  .btns:hover:before {
    opacity:1;
    right:8%;
    /* border-right: 10px solid #46433a; */
  }
  .btns:hover{ position: relative; padding-left:15px; padding-right:35px; transition:all .5s ease;}

.section{position:relative; min-height:100%; width:100%; padding: 5% 0;}
.section-dark{background:#1B1F20;}
.default-section{ position:relative; width:100%; min-height:100vh;}
.vertical-center{position: absolute; top: 50%;left:0;width: 100%;   transform: translateY(-50%);}
.left-intro{padding:20px; padding-top:15%; max-width:700px;}
.left-intro h1{padding:1% 0; color:#9a9c9c; font-size: 3.6rem; line-height:1.05; font-weight:700;}
.left-intro p{padding:7% 0 9%; color:#777777; font-size: 1.3rem;}
.right-banner{display: block;} 
.right-banner img{max-width:100%;}

.the-rotate{
    transform: rotate(0deg);
    transition: all 4.5s ease;
}
.logo:hover .the-rotate{
    transform: rotate(360deg);
    transition: all 4.5s ease;
}

.the-titles{ display:block; max-width:700px; padding:10px; margin: 20px auto; text-align:center;}
.the-titles h2{ font-size:2.6rem; color: #868B8C; line-height:1.1; padding:10px 0; font-weight:700; text-transform: uppercase;}
.the-titles .tag{ color:#868B8C; font-size:1.5rem; padding:10px 0 2px;}
.the-titles .caption{color:#7b7c7c; font-size: 1.1rem; line-height:1.1;}

.the-titles-2{ display:block; max-width:100%; padding: 3% 10px; border-top: 0.1px solid #383838; border-bottom: 0.1px solid #383838; margin: 20px auto; text-align:left;}
.the-titles-2 h2{ font-size:2.2rem; color: #868B8C; line-height:1.1; padding:10px 0; font-weight:700; text-transform: uppercase;}
.the-titles-2 .tag{ color:#868B8C; font-size:1.5rem; padding:10px 0 2px;}
.the-titles-2 .caption{color:#7b7c7c; font-size: 1.1rem; line-height:1.1;}
.vp-title{ font-size:2.2rem; color: #868B8C; line-height:1.1; padding:20px 0; font-weight:700;}
.vp-title-md{ font-size:2rem; color: #868B8C; line-height:1.1; padding:20px 0; font-weight:700;}
.vp-content{font-size:1.2rem; color:#838383; line-height:1.1; padding:10px 0; }
.vp-caption{font-size:1rem; color:#FFCB29; line-height:1.1; padding:10px 0; }
.centered{text-align:center; display:block; width:100%;}

.vp-box{ color:#6b6b6b; padding:4% 10px;}

.vp-check {
    display: block;position: relative;
    padding: 5px; margin-bottom: 12px; cursor: pointer; font-size: 22px;
    -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;
    user-select: none; width:95%;
  }

  .vp-check:hover{background-color:#23292B;}
  .vp-check .fa{color:#2c2c2c;}
  .vp-check input {
    position: relative; opacity: 0; cursor: pointer; height: 0; width: 0; left:10%;
  }
  .checkmark {
    position: absolute; top: 10px; left: 90%;  height: 25px; width: 25px; border:1px solid #FFCB29; border-radius: 3px;
  }
  .vp-check:hover input ~ .checkmark {
    background-color: transparent;
    border:1px solid #FFCB29;
    border-radius: 3px;
  }
  .vp-check input:checked ~ .checkmark {
    background-color: transparent;
    border:1px solid #FFCB29;
  }
  .vp-check .checkmark:after {
    content: "";  position: absolute; display: none;
    left: 5px; top: 5px; width: 13px; height: 13px; background: #FFCB29;
  }

  .vp-check input:checked ~ .checkmark:after {
    content: "";
    display: block;
  }
  


.steps{position: relative; display: inline-block; padding:5% 0;}
.steps .step{
    position:relative;
    display:inline-block;
    width:60px;
    height:60px;
    margin-right:100px;
    line-height:57px;
    text-align:center;
    font-size:1.3rem;
    font-weight: 700;
    background-color: #383838;
    border-radius: 50%;
    color:#6b6b6b;
    z-index:11;
}
.step:after{
    position:absolute;
    top:50%;
    left: 100%;
    content: "";
    width: 125px;
    height:2px;
    background-color: #383838;
    z-index:3;
}
.step:last-child::after{
    position:absolute;
    top:50%;
    left: 0px;
    content: "";
    width: 0;
    height:0;
    background-color: #383838;
}
.steps .active{ background-color:#FFCB29;}
.vertical-centered{ position:absolute; top: 50%; left:0; transform: translateY(-50%); width:100%;}

.video-panel{ position: relative; max-width:1040px; margin:3% auto 1%; padding:10px; border-radius:10px; overflow: hidden;}
.video-panel img{width:100%;}
.video-skin{ position:absolute; top:0; left:0; width:100%; height:100%; background-color:#0000005e; z-index:66;}
.video-btn{
    position:absolute;
    top:50%;
    left:50%;
    perspective: 1000px;
    transform: scale(1) translate(-50%,-50%);
    width:60px;
    height:60px;
    border-radius: 50%;
    font-size: 1.6rem;
    font-weight:600;
    text-align:center;
    background:#FFCB29;
    color:#1B1F20;
    line-height: 60px;
    padding-left: 6px;
    transition: all .5s cubic-bezier(.68,-0.55,.27,1.55);
    z-index: 99;
}
.video-btn:after{
    position:absolute;
    top:0; left:0;
    content: "";
    width:100%;
    height:100%;
    border:4px solid #FFCB29;
    border-radius: 50%;
    transform: scale(1);
    transition: all .5s cubic-bezier(.68,-0.55,.27,1.55);

}
.video-btn:hover::after{
    transform: scale(1.5);
    transition: all .8s cubic-bezier(.68,-0.55,.27,1.55);
    opacity: 0;
}
/* -------custom accordions -----*/
.accord-width{
    max-width:900px;
    margin: 20px auto;
}
.accordion-item:first-of-type .accordion-button {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.accordion-item:last-of-type .accordion-button.collapsed {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}
.accordion-button:not(.collapsed) {
    color: #141718;
    background-color: #FFCB29;
    box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 #1B1F20;
}
.accordion-button {
    font-size: 1.4rem;
    color: #f3f3f3;
    text-align: left;
    background-color: #777777;
    border: 0;
    border-radius: 0;
    overflow-anchor: none;
    transition: var(--bs-accordion-transition);
  }
.accordion-item {
    color: #9a9c9c;
    background-color: transparent;
    border: var(--bs-accordion-border-width) solid transparent;
}
.faq-cta-btns{text-align:center; width:100%; display:block;}
/* ----------------- */


/* ---------form controlls--------- */
.form-control {
    font-size: 1.4rem;
    color: #ccc;
    background-color: #23292B;
    border: var(--bs-border-width) solid #333;
}
.form-floating > label {color: #777; font-size: 1.1rem;}
.form-floating > label span{font-style: oblique; color:#4b4b4b; font-size:0.8rem;}
.form-floating > .form-control, .form-floating > .form-control-plaintext {
    padding: 1.8rem 1.75rem;
}
.form-floating > .form-control, .form-floating > .form-control-plaintext, .form-floating > .form-select {
    height: calc(4.2rem + calc(var(--bs-border-width) * 2));
    min-height: calc(4.2rem + calc(var(--bs-border-width) * 2));
    line-height: 1.25;
}
.form-floating>.form-control:focus {background-color: #23292B; color:#ddd;}

.form-floating>.form-control-plaintext~label::after,
.form-floating>.form-control:focus~label::after,
.form-floating>.form-control:not(:placeholder-shown)~label::after,
.form-floating>.form-select~label::after {
  background-color: #23292B;
}
.form-floating > .form-control-plaintext ~ label, 
.form-floating > .form-control:focus ~ label, 
.form-floating > .form-control:not(:placeholder-shown) ~ label, 
.form-floating > .form-select ~ label{
    color: #646464;
}
.send-btns{ position: relative; padding:19px 20px; margin: 10px 0; text-align: center; display: block; width:100%; background-color:#FFCB29; border:0; font-size:1.4rem; font-weight:700; color: #333; overflow: hidden; text-decoration: none;  border-radius:5px; transition:all .5s ease;}
.send-btns::after{ position: absolute; content: ""; border-radius:5px; top:0; left:0; width:100%; height:100%; border:2px solid #141718; transform: scale(1);}
.send-btnshover::after{ position: absolute; content: ""; width:100%; height:100%; border:2px solid #141718; transform: scale(0.7);}

.form-switch.form-check-reverse { text-align: justify;}
/* .form-switch .form-check-input {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='#FFCB29");
} */
/* ------- */
.form-floating > .form-select{
    padding-top:0; padding-bottom:0;
    background-color:#23292B;
    color:#f8f8f8;;
    font-size: 1.2rem;
    border: var(--bs-border-width) solid #333;
}
/* ---------===========-------- */
.custom-nav-link {
    flex-basis: 0;
    flex-grow: 1;
    text-align: center;
    background: #444;
    margin: 7px;
    padding: 15px 10px;
    color: #999898;
    font-size: 1.5rem;
  }
  .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    background-color: #FFCB29;
    color:#141718;
  }
/* -------===============------- */
.footer{
    padding:30px 0;
    border-top:0.5px solid #383838;
}
.footer span, .footer a{
    margin-right:15px;
    color:#838383;
    font-size: 1rem;
    text-decoration: none;
}

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

.error{color:#790404;}

.custom-upload{position: relative; overflow:hidden;}
.upload-field{ margin-left:-8.5rem; width:150%; font-size:1.2rem; position: relative; z-index: 9;}
.custom-upload span{position: absolute; right: 20px; top:26px; color: #ffcb29;}

input[type=file]::file-selector-button {
  margin-right: 20px;
  border: none;
  padding: 2px 10px;
  border-radius: 10px;
  background:#333;
  color: #fff;
  cursor: pointer;
  transition: background .2s ease-in-out;
  opacity:0;
}

input[type=file]::file-selector-button:hover {
  background: #0d45a5;
}

.sub-logo{height:60px; text-align:center; padding:20px;}
.sub-logo img{
  max-height: 40px;
}


@media(width:992px){

}

@media(width:768px){
  
}