body{color: #4d4d4d;}
.container{width: 100%; max-width: 1220px; margin: 0 auto; padding-right: 15px; padding-left: 15px; box-sizing: border-box;}
.jcv-face-login img{max-width: 100%; height: auto;}
.top_intro{background: url(img/top_intro_bg.png) no-repeat; background-size: cover; padding: 50px 0;}
.row{display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -15px;}
.row > div{padding: 0 15px; box-sizing: border-box;}
.col-7{-ms-flex: 0 0 58.333%; flex: 0 0 58.333%; max-width: 58.333%;}
.col-5{-ms-flex: 0 0 41.667%; flex: 0 0 41.667%; max-width: 41.667%;}
.col-3{-ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%;}
.banner-left-area{-ms-flex: 0 0 58.333%; flex: 0 0 58.333%; max-width: 58.333%; text-align: center;}
.banner-right-area{-ms-flex: 0 0 41.667%; flex: 0 0 41.667%; max-width: 41.667%;}
.text-box{padding: 40px 30px; background: #fff; border-radius: 30px; text-align: center; box-shadow: 10px 10px 0px 0px rgba(0, 0, 0, 0.3); margin: 0 0 50px; color: #3c95c1; }
.text-box h3{font-weight: 700; font-size: 2.6rem; line-height: 1.2; margin-bottom: 30px; position: relative; display: inline-block;}
.text-box h3:after {content: ""; position: absolute; background: #feff88; left: 0; right: 0; top: 25px; height: 70%; z-index: 0;}
.text-box h3 span{position: relative; z-index: 2;}
.text-box h4{font-weight: 500; font-size: 1.8rem; margin-bottom: 40px;}
.btn{background: #e85c4f; color: #fff!important; padding: 17px 80px; border-radius: 40px; font-size: 1.3rem; display: inline-block;   text-decoration: none; font-weight: 700; transition: all 0.5s ease; line-height: 1.4;}
.btn:hover{background: #fe6557;}
.align-center{align-items: center;}
.text-center{text-align: center;}
.mb-0{margin-bottom: 0;}
.pb-0{padding-bottom: 0;}
.border-bottom{border-bottom: 2px solid #e8e8e8;}
p{font-size: 16px; margin: 0 0 20px; line-height: 1.6; font-weight: 500;}
.small{font-size: 12px; font-weight: 400; text-align: left; width: 80%; margin: 0 auto;}

section{padding: 80px 0;}
.btn-heading{color: #4d4d4d; font-weight: 700; border: 2px solid #4d4d4d; border-radius: 40px; padding: 20px 40px; font-size: 28px; display: inline-block; margin: 0 0 30px;}
h3{font-size: 24px; margin: 0 0 30px; font-weight: 700;}
h2{font-size: 32px; margin: 0 0 40px; font-weight: 700;}
.text-brown{color: #7a2e2c;}
.text-red{color: #e75c4f;}
.list-style li{padding: 0 0 0px 60px; position: relative; font-size: 22px; font-weight: 700; line-height: 40px; margin-bottom: 25px;}
.list-style li:before{content: ""; position: absolute; left: 0; top: 0; width: 40px; height: 40px; background: url(img/list-icon.svg) 0px 0px no-repeat; background-size: contain;}
.list-style li span{color: #3c95c1; font-weight: 700; font-size: 28px;}
h2.facelogin-heading{display: flex; align-items: center; justify-content: center;}
.jcv-boxes .box{border: 2px solid #3c95c1; padding: 20px 20px; border-radius: 20px; height: 100%; box-sizing: border-box; transition: all 0.5s ease;}
.box ul li{color: #4d4d4d; font-weight: 500; font-size: 16px; position: relative; padding-left: 15px; margin: 0 0 12px; line-height: 1.2;}
.box ul li:before{position: absolute; left: 0; top: 50%; height: 8px; width: 8px; background: #4d4d4d; border-radius: 50%; content: ""; margin-top: -4px;}
.box h4{color: #3c95c1; line-height: 1.36956819em; text-align: center; font-size: 23px; text-align: center; font-weight: 700; position: relative; padding-bottom: 20px; margin-bottom: 20px;}
.box h4::after{content: ""; width: 100px; height: 4px; position: absolute; bottom: 0; left: 50%; margin-left: -50px; background: #3c95c1;}
.w-100{width: 100%; margin: 0 0 30px;}
.jcv-boxes .col-3{margin: 0 0 30px;}
/*Hover CSS Starts*/
/*.jcv-boxes .box:hover{background: #3c95c1; color: #fff; box-shadow: 0 10px 15px rgba(0,0,0,0.25);}*/
/*.jcv-boxes .box:hover h4:after{background: #fff;}*/
/*.jcv-boxes .box:hover ul li:before{background: #fff;}*/
/*.jcv-boxes .box:hover ul li{color: #fff;}*/
/*.jcv-boxes .box:hover h4{color: #fff;}*/
/*Hover CSS Ends*/


/*Responsive CSS Starts*/
@media only screen and (max-width: 1024px){
    h2 {font-size: 32px;}
    section {padding: 60px 0;}
    .list-style li:before {height: 34px; width: 34px;}
    .list-style li{font-size: 22px; line-height: 34px; padding-left: 50px;}
    .list-style li:last-child{margin-bottom: 0;}
    .list-style li span{font-size: 25px;}
    .btn {padding: 20px 40px; font-size: 1.6rem;}
}

@media only screen and (max-width: 800px){
    .col-3 {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
}
@media only screen and (max-width: 680px){
    .banner-left-area, .banner-right-area, .col-5, .col-7 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
    .banner-right-area {text-align: center;}
    .banner-right-area img{max-width: 70%; padding-top: 20px;}
    .gmo-img{text-align: center; margin-bottom: 20px;}
    .gmo-img img{max-width: 80%;}
}

@media only screen and (max-width: 500px){
    .col-3 {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
    .text-box h3 {font-size: 2rem;}
    .text-box h3:after {top:20px;}
    .btn-heading{font-size: 1.6rem;}
    h2{font-size: 34px;}
    h3{font-size: 28px;}
    .text-box h4{font-size: 1.4rem; margin-bottom: 20px;}
    .box h4{font-size: 24px;}
    .box ul li{font-size: 16px;}
}