@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@300;400;500;600;700&display=swap');
body{padding: 0px;margin: 0px;font-family: 'Raleway', sans-serif;}
img{max-width:100%;}
ul{margin-bottom: 0;}
select{appearance:button;}
.error{border: 1px solid red;}
.purple{color: #2bb964;font-weight: 600;}
.dark{color: #fff;font-weight: 600;}
.purple:hover{color: #5a70d9;font-weight: 600;}
.dark:hover{color: #000;font-weight: 600;}
/****************************************** Header Section **********************************************/
header{background: #2bb964;}
.header_user p{font-size: 16px;font-weight:800;}
#opform{max-width: 250px;margin-right: auto;}
.header_contact{display: flex;align-items: center;justify-content: flex-end;}
.header_user .fa-phone{transform: rotate(45deg);font-size: 20px;}
.navbar-brand{color: #fff!important;font-size: 2vmax;font-weight: bold;padding-left: 0;display: flex;align-items: center;}
.anno{font-size: 17px;font-weight:600;color: white;text-transform: uppercase;}
.cart{font-size: 21px;transition: .2s;color: #fff;}
.header_menu{background: #363636;}
.header_menu .navbar-nav a{color:#fff!important;font-size: 16px;font-weight:600;}
.offcanvas-body a{color:#000!important;font-size: 16px;font-weight:600;border-radius: 20px;}
.offcanvas-body a:hover{background: #183661; color:#fff!important;font-size: 16px;font-weight:600;}
.header_menu .navbar-toggler i{color: #fff!important;}
.header_menu .navbar-toggler{background-color: #000!important;border: 0;outline: 0;}
.header_menu .navbar-nav .nav-item:hover a,.header_menu .navbar-nav .nav-item.active a{color:#fff!important;border-bottom:2px solid #2bb964!important;}
.header_menu .navbar-toggler{z-index: 99;}
.header_logo img{width: 240px;}
/******************************************* Header Responsive *****************************************/
@media(max-width:1199px){
    .header_user p{font-size: 14px;}
    .header_contact a{font-size: 14px;}
}
@media(min-width:992px) and (max-width:1199px){
    .header_menu .navbar-nav a{font-size:1.4vmax;}
}
@media(max-width:991px){
    .visit i{font-size: 18px;}
    .navbar-toggler{position: absolute;right: 0;}
    .header_contact p{font-size: 14px;}
    .cart{margin-right: 14%;}
    .header_menu{padding: 0px 15px;}
    .header_menu .navbar-collapse{position: absolute;right: 0px;top: 75%;z-index: 31;width: 222px;}
    .header_menu .navbar-nav a {color:#fff!important;}
    .header_menu .nav-item{background-color: #000!important;border:1px solid #fff;border-top:0;}
    .header_menu .nav-item:hover{outline-color:#2bb964!important;}
    .header_menu .nav-link{text-align: center!important;}
}
@media(max-width:767px){
    .offcanvas-start{width: 100%;border: 0;}
    #opform{margin: auto;}
}
@media(max-width:575px){
    .header_menu .navbar-brand{width:60%!important;}
}
/******************************************* Banner Section *****************************************/
.banner .carousel-indicators{justify-content: flex-end;}
.banner .carousel-indicators button{width:15px!important;height:15px!important;border-radius: 100%!important;}
.banner .carousel-indicators button{border: none !important;}
.banner .carousel-indicators [data-bs-target] {opacity: 1 !important;height: 22px;border: 0;text-indent: inherit; color: #ffffff;font-weight: 600;text-align: center;border-left: 2px solid #fff;border-right: 2px solid #fff;background: transparent;}
.banner .carousel-indicators [data-bs-target].active{background: transparent;color: #000;}
.banner .nivo-caption{text-align: start!important;background: transparent;}
.banner .nivo-controlNav{margin-top: -4%;position: absolute;left: 0;right: 0;z-index: 8;}
.banner .nivo-caption h3{color:#fff;font-weight: 600;font-size: 60px;text-transform: uppercase;font-family: Raleway;}
.banner .nivo-caption p{color: #fff;font-weight: 600;font-size: 25px;font-family: Raleway;}
.banner .nivo-caption button{color: #fff;font-size: 20px;font-weight: 600;background-color: #5a70d9;border: none;padding: 10px 20px;border-radius: 0;text-transform: uppercase;border: 2px solid #5a70d9;}
.banner .nivo-caption button:hover{background-color: #fff;color: #5a70d9;}
.banner .nivo-caption{inset: 0;display: flex;align-items: center;}
.banner .carousel-indicators{bottom:10px!important;}
.carousel-control-next, .carousel-control-prev {width: 3%;opacity: 1;font-size: 30px;}
.banner_area h2{left: 0;right: 0;bottom: 0; color: #fff;background: #000000a1;width: fit-content;height: fit-content;}
@media(min-width:768px){
.banner .box{max-width: fit-content;background: #0000008c;padding: 20px;}
}
@media(max-width:991px){
    .banner .nivo-caption h3{font-size: 40px;}
    .banner .nivo-caption p{;font-size: 15px;}
    .banner .nivo-caption h3{max-width:100%;}.banner .carousel-indicators{display: none;}
    .banner .nivo-controlNav{display: none;}
    .banner .carousel-control-prev, .banner .carousel-control-next{top:-30%;}.header_main .shade_down{bottom: 0;}
}
@media(max-width:767px){.banner .nivo-caption{position: relative;inset:0;background: #000000;}.banner .carousel-control-next, .banner .carousel-control-prev{display: none;}.shade, .shade_down{display: none;}}
@media(max-width:575px){.banner .nivo-caption h3{font-size: 30px;}.banner .nivo-caption p{font-size: 19px;}.banner .nivo-caption button{font-size: 14px;}}
/******************************************* Banner Section *****************************************/

/******************************************* About Section *****************************************/
.about_left h1{color:#5a70d9;text-transform: uppercase;font-size: 42px;font-weight: 700;}
.about_left p{color: #000;font-weight:600;font-size: 18px;}
.about_view{background-color: #434343;border-radius: 0px;border: solid 3px #434343;padding: 5px 15px;font-size: 18px;font-weight: 600;}
.about_view:hover{background-color: #fff;color: #434343!important;}
@media(max-width:767px){.about{background: none;}.about_left{margin-bottom: 20px;}}
@media(max-width:575px){.about{padding: 30px 0px;}.about_left h3{font-size: 20px;}.about_left h1{font-size: 25px;}.about_left h2{font-size: 25px;}.about_left p{font-size: 15px;}.about_view{font-size: 15px;}}
/******************************************* About Section *****************************************/

/*******************************************Services Section*****************************************/
.services{background: url(../tpl_images/ser.png) no-repeat bottom right;background-size: 31%;}
.services h1 {color: #5a70d9;text-transform: uppercase;font-size: 42px;font-weight: 700;}
.services p{font-size: 16px;font-weight: 600;padding-bottom: 0;margin-bottom: 0;display: -webkit-box;-webkit-line-clamp:4;-webkit-box-orient: vertical;overflow: hidden;}
.services .card:hover{background: #dfdfdf;transition: .4s;cursor: pointer;}
.services .card-title{color: #183661;font-weight: 600;}
@media(min-width:768px) and (max-width:1199px){
    .services .card{max-width: 100%!important;}
}
@media(max-width:767px){
    .services{background: none;}
}
/*******************************************Services Section*****************************************/

/******************************************* Category Section *****************************************/
.category{background-color: #f5eed8;padding: 50px 20px;}
.category h1{line-height: 1;text-align: center;color: #5a70d9;text-transform: uppercase;font-size: 42px;font-weight: 700;}
.category p{line-height: 1; color: #000;font-weight: 600;font-size: 18px;text-align: center;margin-bottom: 20px;}
.category .card h1{position: absolute;left: 0;right: 0; color: #000;font-weight: 600;font-size: 16px;max-width: min-content;margin: auto;}
.category .card h2{color: #2bb964;font-weight: 600;font-size: 21px;text-align: center;}
.category .card{position: relative;padding: 20%;margin-bottom: 30px;border-radius: 50%;}
.category .card_back{border-radius: 50%; position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;background-color: rgba(0,0,0,0.5);}
.category .card_back button{padding: 5px 20px;border-radius: 10px;background-color: #5a70d9;color: #fff;font-size: 15px;font-weight: 600;border: 1px solid #5a70d9;text-align: center;}
.category .card_back button:hover{background-color: #fff!important;color:#5a70d9!important;}
.category .card_back{display: none;}
.category .card:hover .card_front{opacity: 0;}
.category .card:hover .card_back{display: grid;}
.category .card:hover img{transform: scale(1.3);transition: .4s;}
@media(max-width:991px){
    .category .card h1{width: min-content;margin: auto;bottom: 23px;}
}
@media(max-width:575px){
    .category .card{max-width: 250px;margin: auto;padding: 45px;margin-bottom: 10px!important;}
}
/******************************************* Category Section *****************************************/
/******************************************* Special Section *****************************************/
.special .bg{background:url(../tpl_images/speaker.jpg) no-repeat right;background-size:contain;}
.special h1{color: #5a70d9;text-transform: uppercase;font-size: 42px;font-weight: 700;word-wrap: break-word;}
.special h2{color: #000000;text-transform: uppercase;font-size: 20px;font-weight: 600;}
.special p{color: #7b7b7b;font-size: 15px;font-weight: 600;}
.special .flat{color: #5a70d9;font-size: 20px;font-weight: 600;}
.special4 {display: flex;flex-direction: column-reverse;}
@media(max-width:991px){
    .width{width: 200px;}
    .bg{background: none!important;}
}
@media(max-width:767px){
    .flex{display: flex;flex-wrap: wrap;justify-content: center;}
}
@media(max-width:575px){
    .flex{flex-wrap: wrap-reverse;}
}
/************************************************************SHOP***********************************************************/
.lSSlideOuter {position: relative;overflow: visible;}
.lSSlideWrapper {position: static;}
.client .lines{border: 2px solid #2bb964;overflow: hidden;}
.client .lines .card-btn{transform: translateY(100%);position: absolute;transition: 1s;text-align: center;inset: 0;}
.client .lines:hover{border: 2px solid #5a70d9;}
.client .lines:hover .image1{transform: scale(1.2);transition: 1s;}
.client .lines:hover .card-btn{display: block;position: absolute;inset: 0;display: grid;place-items: center;background: #2bb96438;transform: translateY(0);}
.shop .slider_header{color: #5a70d9;text-transform: uppercase;font-size: 42px;font-weight: 700;}
.shop .card-title{font-size:15px;font-weight: 600;margin-top: 32px;display: flex;align-items: center;justify-content: center;color: #000;text-transform: capitalize;}
.shop .card{box-shadow:0px 5px 6px #00000030;margin-bottom: 16px;}
.shop .card .label{background: #5a70d9;color: #fff;font-weight: 600;padding: 10px;border-bottom-right-radius: 15px;}
.shop .card:after{transform: skewY(20deg);content: '';position: absolute;width: 100px;height: 100px;background: #183661;bottom: -12px;right: -12px;z-index: -1;border-radius: 10px;}
.shop .card:hover:after{background: #5a70d9;}
.shop .card:hover .label{background: #183661;}
.shop .green{color: #02be4d; padding-left: 3%;font-size: 24px;}
.shop .red{color: #ff0000; padding-left: 3%;font-size: 24px;}
.shop .lSPager{margin-bottom: 20px!important;}
.shop .lSPager li a {background-color: #183661!important;border-radius: 0!important;height: 18px!important;width: 18px!important;transform: skew(-17deg);}
.shop .lSPager li.active a{background-color: #5a70d9!important;}
.shop .fa{font-size: 20px;}
.shop .slideControls3 {text-align: center;width: 100%;padding-bottom: 2%;}
.shop .slideControls3 .slidePrev,.shop .slideControls3 .slideNext{color: #5a70d9; cursor:pointer;background: #fff;box-shadow: 0 0 6px #000;padding: 8px 9px;border-radius: 50%;}
@media(max-width:767px){
    .shop .card::after {display: none;}
    #divCheckout br{display: none;}
    #divCheckout .form-control{margin-bottom: 15px;}
}
/******************************************* Special Section *****************************************/
a{outline:none;color: #fff; text-decoration: none;}
ul{list-style: none; padding-left: 0px;}
/*******************************************footer starts*****************************************/
.final{background-color: #5a70d9;color: #fff!important;font-size: 16px;font-weight: 600;}
.final a{color: #fff!important;text-decoration: none;}
.final a:hover{color: #000!important;}
/*******************************************footer area responsive*****************************************/
@media (max-width:1199px){.final{ font-size: 14px;}}
/*******************************************footer area ends*****************************************/
/******************************************* News Section *****************************************/
.search h1{font-weight: 600;font-size: 26px;text-transform: uppercase;color: #fff;}
.search h2{font-weight: 600;font-size: 24px;color: #fff;}
.search .iconnn i{background-color: #fff;border-radius: 50px;width: 40px;height: 40px;display: inline-flex;align-items: center;justify-content: center;font-size: 16px;color: #000;}
.search .iconnn i:hover{background-color: #5a70d9;color: #fff!important;}
.search .searchhhh{position: relative;}
.search .searchhhh i{position: absolute;right:3%;top: 30%;font-size: 20px;color: #5a70d9;cursor: pointer;}
@media (max-width:1199px){
    .search h1{font-size: 20px;}
}
/******************************************* News Section *****************************************/
/*******************************************contact starts*****************************************/
.contact{background: url(../tpl_images/contactbg.jpg) no-repeat;background-size: cover;padding: 45px 0px;}
.contact h1{font-weight: 600;font-size: 30px;text-transform: uppercase;}
.contact p{font-size: 16px;font-weight: 600;padding-bottom: 30px;}
.contact h5{font-weight: 600;font-size: 22px;text-transform: uppercase;color: #b9efce;padding-bottom: 12px;}
.contact ul li a{  font-size: 16px;font-weight: 600;}
.contact ul li a:hover{color: #5a70d9!important;}
.contact ul li{padding-bottom: 15px;  width: fit-content;}
.contact .home4 li{padding-bottom: 30px; }
.contact .home4 i{background-color: #5a70d9;border-radius: 50px;padding: 12px;font-size: 20px;color: #000!important;margin-right: 15px;}
@media(min-width:768px) and (max-width:991px){
    .search{display: flex;align-items: center;justify-content: space-between;}
}
@media (max-width:991px){
    .contact p{font-size: 14px;}
    .contact h5{font-size: 18px;}
    .contact ul li a{font-size: 15px;}
    .contact ul li{padding-bottom: 10px; width: fit-content;}
}
@media (max-width:767px){
    .contact .home4 li{padding-bottom: 10px; }
    .contact .home4 i{background-color: #5a70d9;border-radius: 50px;padding: 5px;font-size: 15px;margin-right: 5px;}
    .contact ul li{padding-bottom: 2%!important; width: fit-content;}
    .contact h1{font-size: 25px;}
    .contact h5{font-size: 16px;margin-bottom: 0;padding-bottom: 0;margin-top: 0;}
    .contact p{margin-bottom: 0;padding-bottom: 0;}
} 
.sales h1{color: #000;font-weight: 600;font-size: 20px;}
.sales h2{color: #5a70d9;font-weight: 600;font-size: 31px;}
.sales h3{color: #2bb964;font-weight: 600;font-size: 29px;}
.sales ul{column-count: 2;padding-left: 15px;list-style-type: disclosure-closed; }
.sales p, .sales li{font-weight: 600;font-size: 17px;}
.sales .welcome{width: 350px;}
.sales .sale_btn a{background-color: #434343;color: #fff;font-weight: 600;font-size: 18px;border:none;border-radius: 5px;padding: 5px 15px;text-decoration: none;}
.sales .sale_btn a:hover{background-color: #5a70d9;}
@media(max-width:1199px){
    .sales{background: none;}
}
@media(max-width: 767px){
	.sales h2,.sales h3{font-size: 20px;}
}
#divCheckout{background: #f5eed8;}
.card-btn button, .card-btn a, .delbtn, #continue, #checkout, .pdf{font-weight: 600;font-size: 18px;padding: 7px 7px;background-color: #363636;color: #ffffff;border-radius: 0;display: inline-block;border: 0;}
.card-btn button:hover, .card-btn a:hover, .delbtn:hover, #continue:hover, #checkout:hover, .pdf:hover{background:#5a70d9;color: #fff;}
/********************************************************popup**********************************************************/
.message { display: none;position: absolute;top: 0;left: 0;width: 100%;height: 100px;background: rgba(0, 0, 0, 0.8);opacity: 1;z-index: 99;}
.message h1{font-size: 3vmax;color: #2bb964;font-weight: 600; }
.message p{font-size: 18px;color: #000;font-weight: 600; }
.message .btn{color: #fff;font-size: 20px;font-weight: 600;background-color: #000;border: none;padding: 10px 20px;border-radius: 0;text-transform: uppercase;border: 1px solid #000;}
.message .btn:hover{background-color: #fff;color: #000;border: 1px solid #000;}
.message .message_leave {position: absolute;right: 13px;top: 6px;font-size: 26px;cursor: pointer;}
.message .message_pad {display: flex;background:#f5eed8 url(../tpl_images/pop.png) no-repeat bottom right;background-size: contain; position: fixed;left: 0!important;right: 0;margin: 10px auto;width: 900px;height: 550px!important;max-width: 90%;padding:0 40px;color: #000000;border:0;border-radius: 0;box-shadow: 0px 4px 15px #000000;top: 20%;}
@media (max-width:575px){
    .message .message_pad {background: #f5eed8;height: auto!important; max-width: 92%;padding: 10px;}
}

/********************************************************popup video**********************************************************/
.message1 { display: none;position: absolute;top: 0;left: 0;width: 100%;height: 100px;background: rgba(0, 0, 0, 0.3);opacity: 1;z-index: 99;}
.message1 .message_leave {background: #ffffff;border-radius: 32px;width: 35px;height: 35px;line-height: 35px;text-align: center;font-size: 19px;font-weight: 600;position: absolute;right: 13px;top: 6px;cursor: pointer;}
.message1 .message_pad {width: 60%;z-index: 99; display: flex;background:#f5eed8;position: fixed;left: 0!important;right: 0;margin: 10px auto;padding:0;border:none;box-shadow: 0px 4px 15px #000000;top: 20%;}
@media (max-width:767px){
    .message1 .message_pad {background: #f5eed8;height: auto!important; max-width: 100%;width: 95%;}
}
/************************************************Services Timeline******************************************************/
.timeline {}
.timeline:before {content: '';position: absolute;left: 0;top: 0;width: 2px;height: 100%;background: #27293d;}
.timeline .timeline-container {position: relative;margin-bottom: 2.5rem;}
.timeline .timeline-container .timeline-icon {position: absolute;left: -88px;top: 4px;width: 50px;height: 50px;border-radius: 50%;text-align: center;font-size: 2rem;background: #fff;}
.timeline .timeline-container .timeline-body {background: #f1f1f1;border-radius: 3px;padding: 20px 20px 15px; box-shadow: 1px 3px 9px rgba(0, 0, 0, 0.1);}
.timeline-body:before {content: '';background: inherit;width: 20px;height: 20px;display: block;position: absolute;left: -10px;transform: rotate(45deg);border-radius: 0 0 0 2px;}
.timeline .timeline-container .timeline-body .timeline-title .badge {color: #183661;padding: 0; font-size: 20px;font-weight: 700;}

.d1{animation-delay: 1s;}
.d2{animation-delay: 2s;}
.d3{animation-delay: 3s;}
.d4{animation-delay: 4s;}
.d5{animation-delay: 5s;}

.blobh img{border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;background: #5a70d9;}
.blob img{background: #5a70d9;}
.zigzag:nth-child(2n+1){flex-direction: row;}
.zigzag:nth-child(2n){flex-direction: row-reverse;}
.zigzag h6{font-size: 21px;font-weight: 700;}

#con_key{border: 0;border-radius: 50px;}
.trow{display: table-row!important;}
.tdt{display: table-cell!important;}

@media (max-width: 575px) {
    .timeline {padding: 0!important;margin: 0!important;}
    .timeline:before, .timeline-body:before {display: none!important;}
    .timeline-body p{margin-bottom: 0;}
    .timeline .timeline-container{margin-bottom: 10px;}
    table br{display: none;}
    table,thead,tbody,th,td,tr {display: block;}
    thead tr { position: absolute;top: -9999px;left: -9999px;}
    tr { border: 1px solid #ccc; }
    td { border: none;border-bottom: 1px solid #eee; position: relative;padding-left: 50%; }
    td:before { position: absolute;top: 6px;left: 6px;width: 45%; padding-right: 10px; white-space: nowrap;}
}