/*
 *  Zname.com - v2.0.0 - 2023-10
 *  Author: DH
 *  Content:index
	NOTE:
	------
	This style sheet only needs to be used on the index page.

 */
/*--------------------------------------------------
banner
-------------------------------------------------- */
.banner{background:url("../images/banner-bg.jpg") no-repeat center bottom #ecf0f3;margin-top: -5.5rem; padding-bottom: 4rem;padding-top:9.5rem;}
.banner-tab-button{display: inline-block;border-radius: 10rem;background: #d8e2fb;font-size: .875rem}
.banner-tab-button a{color:var(--subject-color);line-height: 2.18rem;padding:0 1.75rem;display: inline-block;}
.banner-tab-button a.active{color: #fff;background:var(--subject-color);border-radius: 10rem;}

.banner-search-from{padding:.7rem 0}
.banner-search-from .form-control,
.banner-search-from .btn{box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;height:4.3rem;border: none;font-size: 1.25rem;border-radius: .4rem!important}
.banner-search-from .form-control{padding-left: 1.5rem;}
.banner-search-from-sub{padding:.5rem .8rem;}

.banner-tip{display: inline-block;background:#d8e2fb;padding: .3rem .8rem;border-radius: .1rem;font-weight: bold;line-height: 1.4;margin-bottom: 1.5rem;}
/*banner-suffix*/
.banner-suffix{display:flex;justify-content: flex-start;align-items: center;gap:1.25rem;-ms-flex-wrap:nowrap;flex-wrap:nowrap;padding-bottom:1.2rem;margin-top:-1px;overflow-x:auto;text-align:center;white-space:nowrap;}
.banner-suffix>div{background: #fff;border-radius: .5rem;padding-top: .4rem;padding-bottom: .4rem;text-align: center;box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);}
.banner-suffix>div a{}
.banner-suffix>div a:hover{}
.banner-suffix p{margin-bottom:.5rem;}
.banner-suffix .col-auto img{height:4rem;}
.banner-suffix .text-muted{margin: 0}
@media (max-width:992px){
    .banner{padding-top: 6.5rem;}
    .banner-suffix .col-auto img {height: 3.3rem;}
}
@media (max-width: 576px){
    .banner {padding-top: 6.9rem;}
    .banner-suffix {gap: .878rem;}
    .banner-suffix .col-auto img {height: 3rem;}
    .banner-tip{margin-bottom: 1rem}
}
/*--------------------------------------------------
sub-services
-------------------------------------------------- */
.sub-services-box{background:url("../images/banner-sub-bg.jpg") center #4150e3;max-height: 7.8rem;padding: 1.5rem 0;color: #fff;display: flex;align-items: center;}

.sub-services-left{justify-content: space-between;}
.sub-services-left h4{font-size: 1.125rem;margin-bottom: 0;}
.sub-services-left h4 img{vertical-align: top}
.sub-services-left p{opacity: .7;font-size:.875rem;margin-top:.4rem;margin-bottom: 0;overflow: hidden;display: -webkit-box;line-height: 1.5;
-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.sub-services-left a{color: #fff;}
.sub-services-left a:hover{color: #fff;text-decoration: underline}

.sub-services-right{border-radius: .5rem;overflow: hidden;box-shadow: 0 .5rem 1rem rgba(0,0,0,.15)!important;}
.sub-services-right .carousel-caption{text-align: left;padding: 0;left: 13%;top:18%;}
.sub-services-right .carousel-caption a:hover{text-decoration: underline;color: #fff}
.sub-services-right .sub-services-dark{color: #000;}
.sub-services-right .carousel-caption.sub-services-dark a:hover{color: #000}

.sub-services-right .carousel-caption p,
.sub-services-right .carousel-caption h4{display: block; overflow: hidden;line-height: 1.2;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;}
.sub-services-right .carousel-caption p{margin-bottom: .5rem;opacity: .8}
.sub-services-right .carousel-caption h4{height: 3.2rem;font-weight: bold;font-size: 1.4rem}
@media (max-width:768px){
    .sub-services-left p{display: none;}
}
/*--------------------------------------------------
services-box
-------------------------------------------------- */
.services-box{ padding-top: 11rem;padding-bottom:5rem;}
.services-text{}
@media (max-width:992px){
    .services-box{ padding-top:5rem;padding-bottom:2rem;}
}

/*--------------------------------------------------
Customer Support
-------------------------------------------------- */
.customer-support-box{color: #fff;background:url(../images/customer-support-bg.png) -12rem 3rem no-repeat,linear-gradient(0deg,#393eae,#5756bd);}
.customer-support{ align-items: center;}
.customer-support-text{ padding-top: 11.25rem;padding-bottom: 11.25rem;}
.customer-support-btn{margin-top: 1.6rem;}
.customer-support-btn .btn{background: #393b91;color: #fff;padding: .5rem 1.2rem;margin-bottom: .6rem}
@media (max-width:992px){
    .customer-support{ justify-content: center!important;}
    .customer-support-text{ padding-top:3rem;padding-bottom:5.5rem;}
}

/*--------------------------------------------------
subscribe
-------------------------------------------------- */
.subscribe-box{background: #fff;padding: 11rem 0;}
.subscribe-search .form-control, .subscribe-box .btn{height:3.5rem;}
@media (max-width:992px){
    .subscribe-box{padding:5.5rem 0;}
}