
@font-face {
    font-family:'Tofino-Pro';
    src:url('../assetes/web/quiz/fonts/TofinoProPersonalNarrow-Regular.otf');
}

@font-face {
    font-family:'Tofino-Pro-medium';
    src:url('../assetes/web/quiz/fonts/TofinoProPersonalNarrow-Medium.otf');
}

@font-face {
    font-family:'Tofino-Pro-semibold';
    src:url('../assetes/web/quiz/fonts/TofinoProPersonalNarrow-Semibold.otf');
}

@font-face {
    font-family:'Tofino-Pro-bold';
    src:url('../assetes/web/quiz/fonts/TofinoProPersonalNarrow-Bold.otf');
}

@font-face {
    font-family:'Tofino-Pro-book';
    src:url('../assetes/web/quiz/fonts/TofinoProPersonalNarrow-Book.otf');
}

body {
    margin:0;
    padding:0;
    overflow-x:hidden;
    font-family:'Tofino-Pro';
    font-size:14px;
}

h1, h2, h3, h4, h5, h6 {
    font-family:'Tofino-Pro';
}

p {
    color: #fff;
    margin-bottom: 0px;
    margin-top: 0px;
    font-size: 18px;
    /* margin-left: 228px; */
}
.heddar{width: 100%;/* float: left; */background: #2a362c;padding: 10px;}
.images{width: 35%;float: left;}
.images img{
    max-width: 30%;
    cursor: pointer;
    margin-left: -22px;
    }
.heddar-bottum{width: 100%;float: left;background: #2a362c;padding: 0px 0px 0px 3px;}
.images-text{color: #fffdfd;font-size: 13px;/*! font-weight: 600; */margin-top: 9px;margin-left: 2px;text-align: left;}
.images-text p{color: #e1dfdf;font-size: 10px;/*! font-weight: 200; */width: 100%;margin-left: 0px;margin-top: 6px;}
.borde{width: 100%;float: left;}
.borde img{max-width: 80%;/* background: #fff; */margin-left: 17%;}
.multi{width: 100%;background: #2a362c;padding: 12px 10px 22px 10px;float: left;}
.multi-form{width: 100%;float: left;}
.multi-form img{max-width: 100%;}
.radius{width: 100%;float: left;border-radius: 10px;background: #fff;padding: 55px 10px;margin-top: 30px;min-height: 380px;text-align: center;}
.radius img{max-width: 50%;margin: 25px auto;}
.radi-text{color: #000;font-size: 12px;text-align: center;font-weight: 600;margin-bottom: 22px;}
.better{width: 100%;text-align: center;margin-bottom: 9px;font-size: 12px;}
.radius-2{width: 100%;/* float: left; */border-radius: 10px;background: #1f2721;padding: 145px 10px 40px;margin-top: 30px;margin-left: 3%;text-align: center;border: 1px solid #686868;min-height: 380px;}
.radius-2 img {width: 60px;margin: auto;}
.hear{width: 100%;float: left;color: #000;font-size: 20px;font-weight: 600;}
.better-1{width: 100%;text-align: center;margin-bottom: 10px;color: #c2c2c2;}
.radi-text-1{color: #fff;text-align: center;margin-bottom: 15px;font-size: 32px;font-weight: 600;font-family: 'Tofino-Pro-semibold';text-transform: uppercase;}
.footer{width: 100%;background: #1f2721;padding: 10px;float: left;}
.footer-contact{width: 100%;float: left;}
.footer-contact ul{list-style: none;margin: 0px;margin-left: 0;padding: 0;text-align: center;}
.footer-contact ul li{color: #dbd7d7;font-size: 12px;display: inline-block;padding: 4px 10px;}
.sprout{width: 100%;text-align: center;margin-bottom: 5px;margin-top: 6px;}
.Hear-text{color: #fff;font-size: 12px;font-weight: 500;width: 100%;float: left;}
.sileenc{width: 100%;float: left;font-size: 10px;color: #fff;font-weight: 300;margin-bottom: 0px;}
.normallya{width: 100%;float: left;}
.normallya ul{list-style: none;margin: 0px;float: left;}
.normallya ul li{float: left;/* background: #fff; *//* padding: 10px 37px; */}
.normallya ul li a{color: #000;font-size: 8px;text-decoration: none;background: #fff;padding: 1px 9px;float: left;margin: 0px 5px;margin-bottom: 13px;border-radius: 10px;}
.college{width: 50%;}
.complete{width: 49%;}
.images-logo{width: 32%;}
.sprout img{max-width: 35%;}

.radius-2 .btn2 {
}

.radius-2 .btn2 a {
    background: #fff;
    font-size: 11px;
    border: 1px solid #fff;
    padding: 8px;
    text-decoration: none;
    color: #333;
    border-radius: 3px;
}

.footer-contact ul li a {color: #dbd7d7;}

.sileenc h3, .better h3 {font-size:32px;font-weight: 600;font-family: 'Tofino-Pro-semibold';text-transform: uppercase;}

@media (min-width:768px) {

    .images-logo {
        width:180px;
    }

    .heddar {
        text-align:center;
        padding-bottom: 35px;
        padding-top: 35px;
    }

    .menuIcon {
    display: none;
    }

    .images-text {
        font-size:30px;
    }
    
    .images-text h2 {font-size: 32px;margin-bottom: 12px;font-family: 'Tofino-Pro-medium';}
    
    .images-text h4 {font-size: 22px;color: #e1dfdf;font-weight: normal;/*! font-family: 'Roboto', sans-serif; */margin-bottom: 15px;}

    .images-text p {
        font-size:15px;
        font-family: 'Tofino-Pro-book';
    }

    .heddar, .heddar-bottum, .multi, .footer {
    padding-left: 20%;
    padding-right: 20%;
    }

    .multi {
        padding-bottom:55px;
    }

    .Hear-text {
        font-size:18px;
        padding-bottom: 15px;
    }

    .sileenc, .better {
        font-size:15px;
    }

    .normallya {
        padding-bottom:15px;
    }

    .radius-2 {
        padding:200px 20px 25px;
        min-height: 525px;
    }

    .radi-text {
        font-size:16px;
    }

    .quizFtr span {
        width:25px;
        height: 2px;
    }

    .quizFtr ul li a {
        width:25px;
        height:25px;
        font-size:14px;
        line-height: 25px;
    }

    .radius {
        text-align:center;
        padding: 87px 15px 25px;
        min-height: 525px;
    }

    .radius img {
        width:165px;
        margin: 0 auto 35px;
    }

    .footer {
        padding-top:35px;
        padding-bottom:35px;
    }

    .sprout img {
        width:145px;
        max-width: initial;
    }

    .footer-contact ul li {
        text-align:left;
        font-size:14px;
        width: 32%;
    }

    .better {
    width: 75%;
    margin: auto;
    font-family: 'Tofino-Pro-book';
    }

    .radius-2 img {
    width: 150px;
    }
    
    .radius-2 .btn2  {padding-top: 15px}
    
    .radius-2 .btn2 a {font-size: 16px;padding:10px 25px}
    
    .radius-2 .btn2 a:hover {background: #84dc00;border-color: #84dc00;}
    
    
}

@media (max-width:767px) {
    
    .images-text h2 {font-size: 15px;font-weight: bold;}
    
    .images-text h4 {font-size: 12px;color: #e1dfdf;font-weight: normal;}
    
    .sileenc h3, .better h3 {font-size:22px;}
    
    .radi-text-1 {font-size:22px;}
    
}