:root {
  --brand: #1E519E;
  --grey: #919295;
  --nav-left-padding: 50px;
  --nav-right-padding: 25px;

}

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







html{
    scroll-behavior: smooth;
}
body{
    font-family: 'Lato', sans-serif;
    font-size: 16px; 
    color: #000;
    font-weight: 400;
}



a{-webkit-transition: all 0.32s ease-out; -moz-transition: all 0.32s ease-out; -o-transition: all 0.32s ease-out; -ms-transition:  all 0.32s ease-out; transition: all 0.32s ease-out; text-decoration:none;}
a:hover{color: var(--red); text-decoration: none;}

::placeholder { color: 000; opacity: 1; }
:-ms-input-placeholder { color: 000;}
::-ms-input-placeholder { color: 000;}

/*COMMOM STYLES*/
.ff-mo{font-family: 'Montserrat';}

.fw-bl,
.fw-bo{font-weight: 500;}
.fw-re{font-weight: 400;}

.fs-45{font-size: 45px;}
.fs-36{font-size: 36px;}
.fs-32{font-size: 32px;}
.fs-30{font-size: 30px;}
.fs-26{font-size: 26px;}
.fs-20{font-size: 20px;}
.fs-13{font-size: 13px;}


.ls-1{letter-spacing: 1px;}
.ls-2{letter-spacing: 2px;}

.lh-2{line-height: 2;}


@media screen and (min-width:768px){
    .mt-md-lg{margin-top: 60px!important;}
    .mb-md-lg{margin-bottom: 60px!important;}

    .mt-md-xl{margin-top: 100px!important;}
    .mb-md-xl{margin-bottom: 100px!important;}
 
}

@media screen and (max-width:767px){

    .fs-45{font-size: 32px;}
    .fs-36{font-size: 28px;}
    .fs-32{font-size: 24px;}
    .fs-30{font-size: 22px;}
    .fs-26{font-size: 20px;}
    .fs-13{font-size: 13px;}


  
}

.bg-brand{background-color: var(--brand);}
.bg-grey{background-color: var(--grey);}

.text-brand{color:var(--brand);}
.text-white{color:#FFF;}
.text-black{color:#000!important;}

.btn-brand{background-color: var(--brand); border:none; display: inline-block;  transition: all 0.32s ease-out; color: #FFF; font-weight: 500; font-size: 18px; padding: 15px 25px; letter-spacing: 1.5px; }
.btn-brand:hover{background-color: #484c4c; color: #FFF!important;}



.has-bg{background-position: center; background-size: cover; }


.img-linked{
    -webkit-transition: all 0.32s ease-out;
    -moz-transition: all 0.32s ease-out;
    -o-transition: all 0.32s ease-out;
    -ms-transition:  all 0.32s ease-out;
    transition: all 0.32s ease-out;
}
.img-linked:hover{
    transform: scale(.96);
    cursor: pointer;
}

.text-linked{color: inherit;}
.text-linked:hover{color: inherit; text-decoration: underline;}




/* Navigation */


#mainNav{list-style-type: none; padding-left: 0; margin-bottom: 100px;}
#mainNav .nav-link{color: #000; font-size: 24px; font-weight: 400; margin-bottom:5px; padding-top: 10px; padding-bottom: 8px; padding-left: var(--nav-left-padding);}
#mainNav .nav-link.active, 
#mainNav .nav-link:hover{color: #FFF; background-color: var(--brand);}

.navWrapper{padding: 25px 0; width: 425px; float: left; position: sticky; }
.contentWrapper{width: calc(100% - 425px);  float: left; border-left: 2px solid var(--brand);}

.nav-logo{width: 300px;}
#contentPageHeading img{width: 200px;}
.broker-text{padding-left: 50px;}



.disclaimer{padding-left: var(--nav-left-padding);padding-right: var(--nav-right-padding);font-size: 12px; }

#welcome .disclaimer{display: none;}
.bar{  border: 2px solid #919295; height: 2px;}

@media screen and (max-width: 767px){
   
    .navWrapper{width: 100%; padding-top: 80px;}
    #mainNav{margin-bottom: 0;}

    .contentWrapper{width: 100%; border-left: none;}
    #welcome  .contentWrapper{min-height:0!important ; height:auto;}
    .nav-logo{width: 150px;}

    #mainNav .nav-link{font-size: 18px;  text-align: center; background-color: var(--brand); color: #FFF; display: block; max-width: 300px; margin: 5px auto; padding-left: 0; border: 2px solid var(--brand);}
    #mainNav .nav-link.active{color: var(--brand); background-color: #FFF;}
    #contentPageHeading{position: fixed; top: 0; left: 0;}
    #contentPageHeading img{width: 150px;}
    .broker-text{padding-left: 0px;}

    .disclaimer{ padding: 5px!important;}
}


@media(min-width:768px) and (max-width: 991px){
}

@media screen and (min-width:992px){
   
}