@charset "utf-8";

/* FONTS */
/* Prelo */
@font-face {
    font-family: Arial, Helvetica, sans-serif ; 
    src: url('prelosemi.woff2') format('woff2'),
        url('prelosemi.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: Arial, Helvetica, sans-serif ; 
    src: url('prelomed.woff2') format('woff2'),
        url('prelomed.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: Arial, Helvetica, sans-serif ; 
    src: url('prelolight.woff2') format('woff2'),
        url('prelolight.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* Stone Sans */
@font-face {
    font-family: Arial, Helvetica, sans-serif ; 
    src: url('StoneSansIIITCPro-Bk.eot') format('embedded-opentype'),
        url('StoneSansIIITCPro-Bk.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: Arial, Helvetica, sans-serif ; 
    src: url('StoneSansIIITCPro-Md.eot') format('embedded-opentype'),
        url('StoneSansIIITCPro-Md.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: Arial, Helvetica, sans-serif ; 
    src: url('StoneSansIIITCPro-SmBd.eot') format('embedded-opentype'),
        url('StoneSansIIITCPro-SmBd.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
body {
 font-family: Arial, Helvetica, sans-serif ; 
 color: #7a7a7a;
 font-size: 17px;
}
#topbar {
 padding: 20px 0px;
}
.btn.btn-danger.btn-red {
 color: #fff;
 background-color: #eb0017;
 border-radius: 5px;
 border: 1px solid #fff;
 line-height: 60px;
 padding: 0px 20px;
}
.btn.btn-danger.btn-red:hover {
 color: #eb0017;
 background-color: #fff;
 border: 1px solid #eb0017;
}
.btn.btn-secondary.btn-grey {
 color: #fff;
 background-color: #4D4F53;
 border-radius: 5px;
 border: 1px solid #fff;
 line-height: 60px;
 padding: 0px 20px;
}
.btn.btn-secondary.btn-grey:hover {
 color: #eb0017;
 background-color: #fff;
 border-radius: 5px;
 border: 1px solid #eb0017;
}
@media only screen and (max-width: 768px) {
  .btn.btn-secondary.btn-grey, .btn.btn-danger.btn-red {
    line-height: normal;
 padding: 10px;
  }
}

#introform{
 background-image: url("https://image.affinityinsurance.aon.co.za/lib/fe5c15707c6001787311/m/1/394dde59-a0e6-4b54-8643-85490094de6b.jpg");
 background-repeat: no-repeat;
  background-size: cover;
  background-blend-mode: multiply;
}
#introformbus {
 background-image: url("https://image.affinityinsurance.aon.co.za/lib/fe5c15707c6001787311/m/1/de028613-49df-4887-9761-c0d946a7456b.jpg");
 background-repeat: no-repeat;
  background-size: cover;
  background-blend-mode: multiply;
}
.overlay {
 background-color: rgba(225,27,34,0);
 padding-top: 30px;
 padding-bottom: 30px;
}
h1, h2, h3, h4, h5, h6 {
 font-family: Arial, Helvetica, sans-serif ; 
}
h1 {
 font-size: 2.8em;
 font-weight: bold;
}
.introtext {
 font-size: 1.5em;
}
.stonemd {
 font-family: Arial, Helvetica, sans-serif ; 
}
.stonebd {
 font-family: Arial, Helvetica, sans-serif ; 
}

.whttext {
 color: #fff;
}
.redtext {
 color: #eb0017;
}
.formwrapper {
 background-color: #fff;
 border-radius: 5px;
 padding: 10px 30px 20px 30px;
}
p.first_step.home {
    font-size: 32px;
    margin-bottom: 15px;
    font-weight: 700;
    color: #e11c22;
}
.form-control::placeholder {
 color: #6c757d;
 opacity: 0.9;
 font-family: Arial, Helvetica, sans-serif ; 
 font-size: 14px;
}
.form-control {
 background-color: #fafafa;
 height: calc(2em + .75rem + 2px)
}
.form-check-label {
 font-size: 12px;
 color: #4D4F53;
}
.btn.btn-danger.btn-apply {
 color: #fff;
 background-color: #eb0017;
 border-radius: 5px;
 border: 1px solid #fff;
 padding: 12px 18px;
 margin: 25px 0px 20px 20px;
}
.btn.btn-danger.btn-apply:hover {
 background-color: #4D4F53;
}
#detail {
 margin-top: 50px;
 margin-bottom: 50px;
}
#footer {
 background-color: #54595F;
 padding: 30px;
 
}
.fa {
 font-size: 25px;
 background-color: #FFFFFF;
 padding: 8px 16px;
 border-radius: 50%;
 color: #eb0017;
 margin-right: 25px;
}
.fa:hover {

 background-color: #54595F;
 color: #fafafa;
 cursor: pointer
}
#legal {
 background-color: #e11b22;
 padding: 20px 0px;
 font-size: 12px;

}
#legal a {
    color: #fff;
    font-size: 12px;
}
.fa.fa-info-circle {
 background: unset;
 padding: 6px 6px;
 text-align: center;
 display: inline;
 border-radius: 50%;
 color: #acacac;
 float: left;
 right: 25px;
 position: absolute;
}
.data-content {
    color: #333333;
    background-color: #909090
}
.popover {
 background-color: #cbcbcb;
 color: #333;
}
.socicn {
 float: right;
 margin-left: 1em;
 background-color: #fff;
 width: 45px;
 height: 45px;
 border-radius: 50%;
 text-align: center;
 padding-top: 8px;
}