/*
    FONTS USES  
    
    font-family: 'Oswald', sans-serif;
    font-family: 'Roboto', sans-serif;

*/

/**************************************
        GENERAL STYLES
**************************************/
*,*:after,*:before { box-sizing: border-box } 
html,body { background: #ffffff } 
h1,h2,h3,h4,h5 { margin-bottom: 20px } 
h1 { font-size: 55px } 
h4 { font-size: 28px; padding-bottom: 15px } 
h5 { font-size: 22px }
.text-underline{text-decoration: underline;}
.red{color: #ff0000;} 
.Aligner {
  display: flex;
  align-items: center;
  justify-content: center;
}
.big{font-size: 24px;}
.title { text-transform: uppercase; letter-spacing: 2px } 
form { border: 1px solid #ccc; background-color: #f9f9f9; box-sizing: border-box; padding: 20px 20px; margin: 0 auto 30px;  text-align: center; width: 100%; max-width: 620px; } 
.product-title { color: #252f5f!important; font-weight: bold!important } 
.logo_tp { height: auto!important; max-width: 250px!important; width: 100%!important }
.text-red { color: #fa0000!important } 
.text-normal { font-weight: normal } 
.small-text { font-size: 14px!important; line-height: 20px!important } 

.container { max-width: 900px!important; width: 100%!important } 
h4 sub{font-size: 28px;}
@media all and ( max-width: 1200px ) { 
    .empty { display: none } 
} 



@media all and ( max-width: 480px ) { 
    h1 { font-size: 26px } 
    h4 { font-size: 17px } 
    h1,h2,h3,h4,h5 { margin-bottom: 20px } 
    .logo_tp { max-width: 250px!important } 
} 
/**************************************
    HEADER STYLES
**************************************/
header { background: transparent; width: 100%; position: absolute; top: 0; left: 0; } 
figure.logo { margin: 0 auto; text-align: left; width: 90% } 
figure.logo > img { height: auto; max-width: 200px; padding: 15px 0; width: 100% } 

@media screen and (max-width: 980px) {
    header { background: transparent; width: 100%; position: relative; top: 0; left: 0; } 
figure.logo { margin: 0 auto; text-align: left; width: 90% } 
figure.logo > img { height: auto; max-width: 200px; padding: 15px 0; width: 100% } 

}

@media screen and (max-width: 768px){
    figure.logo { margin: 0 auto; text-align: center; width: 90% } 
}

/**************************************
    WRAPPER STYLES
**************************************/
.wrapper { background: #ffffff; margin: 0 auto; padding: 50px 0 30px; width: 100% } 
.wrapper h1{color:#0482b1; font-size: 42px; text-align: center; }
.wrapper h2 { text-align: center; color: #0482b1; padding-top: 0px } 
.wrapper h3 { margin-top: 0 } 

.webform{width: 100%; border: 1px solid #000; background-color: #fff;}
.webform p{padding: 20px 0; margin: 0;}

.yellow-btn {
    background-color: #ffa600;
    color: #fff;
    padding: 22px 12px 20px;
    border: 3px solid #ffa600;
    border-radius: 6px;
    font-weight: 700;
    font-size: 27px;
    letter-spacing: 2px;
    width: 100%;
    transition: 0.3s ease;
}
.yellow-btn:hover {
    background-color: #fff;
    color: #ffa600;
}

@media all and ( max-width: 991px ) {
    .wrapper {padding-top: 0;}
    .wrapper h2 { font-size: 30px; line-height: 36px }      
} 



@media screen and (max-width: 610px){
    .wrapper h1{color:#0482b1; font-size: 34px; text-align: center; }
}




ul{padding-bottom: 0; margin-bottom: 0;}
ul li.check-circle{list-style: none;}
.check-circle {
    position: relative;
}
 
/*replace the content value with the
corresponding value from the list below*/
 
.check-circle:before {
    content: "\f058";
    font-family: FontAwesome;
    list-style: none!important;
    font-weight: normal;
    text-decoration: inherit;
/*--adjust as necessary--*/
    color: #03709a;
    font-size: 22px;
    padding-right: 0.5em;
    position: absolute;
    top: 0px;
    left: -25px;
}