body {
    color: #323232;
    font-family: Roboto, sans-serif;
    font-size: 16px;
    font-weight: 400;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: Barlow, sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    color: #246e8e;
}

h1, .h1 { font-size: 20px; }
h2, .h2 { font-size: 18px; }
h3, .h3 { font-size: 18px; }
h4, .h4 { font-size: 18px; }
h5, .h5 { font-size: 18px; }
h6, .h6 { font-size: 18px; }

@media screen and (min-width: 576px) {
    h1, .h1 { font-size: 22px; }
    h2, .h2 { font-size: 36px; }
    h3, .h3 { font-size: 30px; }
    h4, .h4 { font-size: 24px; }
    h5, .h5 { font-size: 20px; }
    h6, .h6 { font-size: 18px; }    
}

@media screen and (min-width: 768px) {
    h1, .h1 { font-size: 40px; } 
    h2, .h2 { font-size: 36px; }
    h3, .h3 { font-size: 30px; }
    h4, .h4 { font-size: 24px; }
    h5, .h5 { font-size: 20px; }
    h6, .h6 { font-size: 18px; }    
}

@media screen and (min-width: 992px) {
    h1, .h1 { font-size: 40px; }  
    h2, .h2 { font-size: 36px; }
    h3, .h3 { font-size: 30px; }
    h4, .h4 { font-size: 24px; }
    h5, .h5 { font-size: 20px; }
    h6, .h6 { font-size: 18px; }    
}

@media screen and (min-width: 1200px) {
    h1, .h1 { font-size: 40px; }
    h2, .h2 { font-size: 36px; }
    h3, .h3 { font-size: 30px; }
    h4, .h4 { font-size: 24px; }
    h5, .h5 { font-size: 20px; }
    h6, .h6 { font-size: 18px; }
}



.f8 { font-size: 8px; }
.f9 { font-size: 9px; }
.f10 { font-size: 10px; }
.f11 { font-size: 11px; }
.f12 { font-size: 12px; }
.f13 { font-size: 13px; }
.f14 { font-size: 14px; }
.f15 { font-size: 15px; }
.f16 { font-size: 16px; }
.f17 { font-size: 17px; }
.f18 { font-size: 18px; }
.f19 { font-size: 19px; }
.f20 { font-size: 20px; }
.f21 { font-size: 21px; }
.f22 { font-size: 22px; }
.f23 { font-size: 23px; }
.f24 { font-size: 24px; }
.f25 { font-size: 25px; }
.f26 { font-size: 26px; }
.f27 { font-size: 27px; }
.f28 { font-size: 28px; }
.f29 { font-size: 29px; }
.f30 { font-size: 30px; }
.f31 { font-size: 31px; }
.f32 { font-size: 32px; }
.f33 { font-size: 33px; }
.f34 { font-size: 34px; }
.f35 { font-size: 35px; }
.f36 { font-size: 36px; }
.f37 { font-size: 37px; }
.f38 { font-size: 38px; }
.f39 { font-size: 39px; }
.f40 { font-size: 40px; }
.f45 { font-size: 45px; }
.f50 { font-size: 50px; }
.f55 { font-size: 55px; }
.f60 { font-size: 60px; }

@media screen and (min-width: 576px) {
    .f8-sm { font-size: 8px; }
    .f9-sm { font-size: 9px; }
    .f10-sm { font-size: 10px; }
    .f11-sm { font-size: 11px; }
    .f12-sm { font-size: 12px; }
    .f13-sm { font-size: 13px; }
    .f14-sm { font-size: 14px; }
    .f15-sm { font-size: 15px; }
    .f16-sm { font-size: 16px; }
    .f17-sm { font-size: 17px; }
    .f18-sm { font-size: 18px; }
    .f19-sm { font-size: 19px; }
    .f20-sm { font-size: 20px; }
    .f21-sm { font-size: 21px; }
    .f22-sm { font-size: 22px; }
    .f23-sm { font-size: 23px; }
    .f24-sm { font-size: 24px; }
    .f25-sm { font-size: 25px; }
    .f26-sm { font-size: 26px; }
    .f27-sm { font-size: 27px; }
    .f28-sm { font-size: 28px; }
    .f29-sm { font-size: 29px; }
    .f30-sm { font-size: 30px; }
    .f31-sm { font-size: 31px; }
    .f32-sm { font-size: 32px; }
    .f33-sm { font-size: 33px; }
    .f34-sm { font-size: 34px; }
    .f35-sm { font-size: 35px; }
    .f36-sm { font-size: 36px; }
    .f37-sm { font-size: 37px; }
    .f38-sm { font-size: 38px; }
    .f39-sm { font-size: 39px; }
    .f40-sm { font-size: 40px; }
    .f45-sm { font-size: 45px; }
    .f50-sm { font-size: 50px; }
    .f55-sm { font-size: 55px; }
    .f60-sm { font-size: 60px; }
}

@media screen and (min-width: 768px) {
    .f8-md { font-size: 8px; }
    .f9-md { font-size: 9px; }
    .f10-md { font-size: 10px; }
    .f11-md { font-size: 11px; }
    .f12-md { font-size: 12px; }
    .f13-md { font-size: 13px; }
    .f14-md { font-size: 14px; }
    .f15-md { font-size: 15px; }
    .f16-md { font-size: 16px; }
    .f17-md { font-size: 17px; }
    .f18-md { font-size: 18px; }
    .f19-md { font-size: 19px; }
    .f20-md { font-size: 20px; }
    .f21-md { font-size: 21px; }
    .f22-md { font-size: 22px; }
    .f23-md { font-size: 23px; }
    .f24-md { font-size: 24px; }
    .f25-md { font-size: 25px; }
    .f26-md { font-size: 26px; }
    .f27-md { font-size: 27px; }
    .f28-md { font-size: 28px; }
    .f29-md { font-size: 29px; }
    .f30-md { font-size: 30px; }
    .f31-md { font-size: 31px; }
    .f32-md { font-size: 32px; }
    .f33-md { font-size: 33px; }
    .f34-md { font-size: 34px; }
    .f35-md { font-size: 35px; }
    .f36-md { font-size: 36px; }
    .f37-md { font-size: 37px; }
    .f38-md { font-size: 38px; }
    .f39-md { font-size: 39px; }
    .f40-md { font-size: 40px; }
    .f45-md { font-size: 45px; }
    .f50-md { font-size: 50px; }
    .f55-md { font-size: 55px; }
    .f60-md { font-size: 60px; }
}

@media screen and (min-width: 992px) {
    .f8-lg { font-size: 8px; }
    .f9-lg { font-size: 9px; }
    .f10-lg { font-size: 10px; }
    .f11-lg { font-size: 11px; }
    .f12-lg { font-size: 12px; }
    .f13-lg { font-size: 13px; }
    .f14-lg { font-size: 14px; }
    .f15-lg { font-size: 15px; }
    .f16-lg { font-size: 16px; }
    .f17-lg { font-size: 17px; }
    .f18-lg { font-size: 18px; }
    .f19-lg { font-size: 19px; }
    .f20-lg { font-size: 20px; }
    .f21-lg { font-size: 21px; }
    .f22-lg { font-size: 22px; }
    .f23-lg { font-size: 23px; }
    .f24-lg { font-size: 24px; }
    .f25-lg { font-size: 25px; }
    .f26-lg { font-size: 26px; }
    .f27-lg { font-size: 27px; }
    .f28-lg { font-size: 28px; }
    .f29-lg { font-size: 29px; }
    .f30-lg { font-size: 30px; }
    .f31-lg { font-size: 31px; }
    .f32-lg { font-size: 32px; }
    .f33-lg { font-size: 33px; }
    .f34-lg { font-size: 34px; }
    .f35-lg { font-size: 35px; }
    .f36-lg { font-size: 36px; }
    .f37-lg { font-size: 37px; }
    .f38-lg { font-size: 38px; }
    .f39-lg { font-size: 39px; }
    .f40-lg { font-size: 40px; }
    .f45-lg { font-size: 45px; }
    .f50-lg { font-size: 50px; }
    .f55-lg { font-size: 55px; }
    .f60-lg { font-size: 60px; }
}

@media screen and (min-width: 1200px) {
    .f8-xl { font-size: 8px; }
    .f9-xl { font-size: 9px; }
    .f10-xl { font-size: 10px; }
    .f11-xl { font-size: 11px; }
    .f12-xl { font-size: 12px; }
    .f13-xl { font-size: 13px; }
    .f14-xl { font-size: 14px; }
    .f15-xl { font-size: 15px; }
    .f16-xl { font-size: 16px; }
    .f17-xl { font-size: 17px; }
    .f18-xl { font-size: 18px; }
    .f19-xl { font-size: 19px; }
    .f20-xl { font-size: 20px; }
    .f21-xl { font-size: 21px; }
    .f22-xl { font-size: 22px; }
    .f23-xl { font-size: 23px; }
    .f24-xl { font-size: 24px; }
    .f25-xl { font-size: 25px; }
    .f26-xl { font-size: 26px; }
    .f27-xl { font-size: 27px; }
    .f28-xl { font-size: 28px; }
    .f29-xl { font-size: 29px; }
    .f30-xl { font-size: 30px; }
    .f31-xl { font-size: 31px; }
    .f32-xl { font-size: 32px; }
    .f33-xl { font-size: 33px; }
    .f34-xl { font-size: 34px; }
    .f35-xl { font-size: 35px; }
    .f36-xl { font-size: 36px; }
    .f37-xl { font-size: 37px; }
    .f38-xl { font-size: 38px; }
    .f39-xl { font-size: 39px; }
    .f40-xl { font-size: 40px; }
    .f45-xl { font-size: 45px; }
    .f50-xl { font-size: 50px; }
    .f55-xl { font-size: 55px; }
    .f60-xl { font-size: 60px; }
}

a.light-blue_btn, button.light-blue_btn {
    display: inline-block;
    padding: 0px 55px;
    line-height: 36px;
    background: #246e8e;
    border: solid 2px #246e8e;
    color: #9ffeca;       
    cursor: pointer;    
}

a.light-blue_btn:hover, button.light-blue_btn:hover  {
    background: #639EB8;
    border: solid 2px #246e8e;
    color: #05435E; 
}

a.yellow_hollow_btn, button.yellow_hollow_btn {
    display: inline-block;
    padding: 0px 55px;
    line-height: 36px;
    border: solid 2px #fff040;
    color: #fff040;
    cursor: pointer;
}

a.yellow_hollow_btn:hover, button.yellow_hollow_btn:hover {
    background: #fff040;
    color: #003b76;    
}

a.green_hollow_btn, button.green_hollow_btn {
    display: inline-block;
    padding: 0px 55px;
    line-height: 36px;
    border: solid 2px #9ffeca;
    color: #9ffeca;
    cursor: pointer;
}

a.green_hollow_btn:hover, button.green_hollow_btn:hover {
    background: #9ffeca;
    color: #246e8e;    
}

a.light-blue-text-btn {
    color: #96bddc;
}

a.light-blue-text-btn:hover {
    color: #005196;
}