/*
Theme Name: vastcrm
Theme URI: 
Author: 
Author URI: 
Description: 
Version: 0.0.1


This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/
*{margin:0px; padding:0px;}


html{overflow-x: hidden;}
body{font-weight: 500; overflow-x: hidden; font-family: "Onest", sans-serif; font-family: "Poppins", sans-serif; color: #000; background: #fff; font-size: 14px;}
a, a:active, a:focus, a:hover {outline: none; text-decoration: none;}
button, button:active, button:focus, button:hover {outline: none; text-decoration: none;}

.container{max-width: 1300px;}

#return-to-top{display: flex; z-index: 11; justify-content: center;align-items: center; width: 40px; transition: all 0.3s ease; height: 40px; border-radius: 50%; position: fixed; right: 20px; bottom: 20px; background: #409edb; color: #fff;}
#return-to-top img{width: 13px; filter: brightness(0) invert(1);}

.overlay {position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 100000000;}
.overlay .overlayDoor:before, .overlay .overlayDoor:after {content: ""; position: absolute; width: 50%; height: 100%; background: #fff; transition: 0.5s; transition-delay: 0.8s; }
.overlay .overlayDoor:before {left: 0; }
.overlay .overlayDoor:after {right: 0;}
.overlay.loaded .overlayDoor:before {left: -50%;}
.overlay.loaded .overlayDoor:after {right: -50%;}
.overlay.loaded .overlayContent {opacity: 0; margin-top: -15px;}
.overlay .overlayContent {position: relative; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column;	transition: 0.5s}
.overlayContent img{width:220px;}

header{padding: 15px 0px; z-index: 11; position: fixed; left: 0; right:0; top:0}


header.menu_fixed{background: #fff; box-shadow: 0px 0px 7px 2px #ccc; }
.brand-logo{max-width: 170px; transition: all 0.4s; position: relative;}
.brand-logo img{width: 100%;}
header .navbar{padding: 0px;}

.banner-padding{padding-top: 80px;}

.pb-6 {padding-bottom: 4rem !important;}
.pt-6 {padding-top: 4rem !important;}
.pb-7 {padding-bottom: 5rem !important;}
.pt-7 {padding-top: 5rem !important;}
.pb-8 {padding-bottom: 6rem !important;}
.pt-8 {padding-top: 6rem !important;}

.max-200{max-width: 200px;}
.max-300{max-width: 300px;}
.max-400{max-width: 400px;}
.max-500{max-width: 500px;}
.max-600{max-width: 600px;}
.max-600{max-width: 600px;}
.max-700{max-width: 700px;}
.max-800{max-width: 800px;}
.max-900{max-width: 900px;}
.max-1000{max-width: 1000px;}
.max-1100{max-width: 1100;}

.fs-7{font-size: 1rem !important;}
.fs-8{font-size: .8rem !important;}

.pointer{cursor: pointer;}

.opacity-10{opacity: .10;}
.opacity-20{opacity: .20;}
.opacity-30{opacity: .30;}

.icon-200{width: 200px;}
.icon-150{width: 150px;}
.icon-140{width: 140px;}
.icon-130{width: 130px;}
.icon-110{width: 110px;}
.icon-120{width: 120px;}
.icon-100{width: 100px;}
.icon-90{width: 90px;}
.icon-80{width: 80px;}
.icon-70{width: 70px;}
.icon-60{width: 60px;}
.icon-50{width: 50px;}
.icon-40{width: 40px;}
.icon-30{width: 30px;}
.icon-25{width: 25px;}
.icon-20{width: 20px;}
.icon-15{width: 15px;}
.icon-10{width: 10px;}
.icon-light{filter: brightness(0) invert(1);}
.icon-dark{filter: brightness(0) invert(0);}

.fw-300{font-weight: 300}
.fw-400{font-weight: 400}
.fw-500{font-weight: 500}
.fw-600{font-weight: 600}
.fw-700{font-weight: 700}
.fw-800{font-weight: 800}

.g-6 {--bs-gutter-y: 7rem;  --bs-gutter-x: 7rem;}

.font-heading{font-family: "Onest", sans-serif;}


.theme-color{color: #FE6429;}
.dark-theme-text-color{color: #CDCDCD;}

.bg-101010{background: #101010; color: #fff;}

.btn_style{border: none; color: #fff; font-weight: 400; font-size: 18px; display: inline-block; padding: 10px 20px; text-align: center; border-radius: 40px;  background: #FE6429;}
.btn_style:hover{background: #000; color: #fff;}
.btn_style img{filter: brightness(0) invert(1);}
.btn_style:hover img{filter: brightness(0) invert(1);}

.btn_style.btn-white{background: #fff; color: #000; box-shadow: 0px 0px 20px -1px rgba(0, 0, 0, 0.1);}
.btn_style.btn-white:hover{background: #000; color: #fff;}
.btn_style.btn-white img{filter: brightness(0) invert(0);}
.btn_style.btn-white:hover img{filter: brightness(0) invert(1);}

.btn_style.btn-dark{background: #000; color: #fff;}
.btn_style.btn-dark img{filter: brightness(0) invert(1);}
.btn_style.btn-dark:hover{background: #fff; color: #000;}
.btn_style.btn-dark:hover img{filter: brightness(0) invert(0);}

.btn_style_two{border: 2px solid #FE6429; color: #000; font-weight: 400; font-size: 18px; display: inline-block; padding: 9px 20px; text-align: center; border-radius: 40px;}
.btn_style_two:hover{background: #000; color: #fff; border: 2px solid #000;}

.site-header.menu_fixed .btn_style.btn-white{background: #000; color: #fff;}
.site-header.menu_fixed .btn_style.btn-white img{filter: brightness(0) invert(1);}
.site-header.menu_fixed .btn_style.btn-white:hover{background: #fff; color: #000;}
.site-header.menu_fixed .btn_style.btn-white:hover img{filter: brightness(0) invert(0);}
/* .menu_fixed .site-menu-main{box-shadow: 0px 0px 7px 2px #cccccc63;} */



.btn_style img{width: 20px; margin-left: 5px;}

.heading_text{display: block;}
.heading_text h2{font-size:35px;}

.banner-shape{position: absolute; right: 0; top:0; z-index: -1; max-width: 750px;}

.banner-text h1{font-size: 5.5vw; font-weight: 600; font-family: "Onest", sans-serif;}
.banner-img-box{position: absolute; right: -105px; top: 50px; max-width: 800px;}
.banner-img-box-two{position: absolute; right: -20px; top: 50px; max-width: 700px;}
.laptop-shape{width: 100%; z-index: 1; position: relative;}

.about_scroll p {font-size: 25px; }
.word { opacity: 0.4; display: inline-block; margin-right: 5px; animation: showWord 0.5s forwards;}
.word:nth-child(1) { animation-delay: 0.5s; }
.word:nth-child(2) { animation-delay: 1s; }
.word:nth-child(3) { animation-delay: 1.5s; }
.word:nth-child(4) { animation-delay: 2s; }
.word:nth-child(5) { animation-delay: 2.5s; }
.word:nth-child(6) { animation-delay: 3s; }
.word:nth-child(7) { animation-delay: 3.5s; }
.word:nth-child(8) { animation-delay: 4s; }
.word:nth-child(9) { animation-delay: 4.5s; }
.word:nth-child(10) { animation-delay: 5s; }
.word:nth-child(11) { animation-delay: 5.5s; }
.word:nth-child(12) { animation-delay: 6s; }
.word:nth-child(13) { animation-delay: 6.5s; }

@keyframes showWord {
    to { opacity: 1; }
}

.scroll-container { display: flex; align-items: center; gap: 20px;}
.line-wrapper {width: 6px;height: 60px; background-color: rgba(0, 0, 0, 0.13); position: relative; overflow: hidden; border-radius: 3px;}
.line-fill {width: 100%; height: 30px; background-color: #FE6429; position: absolute; top: 0; border-radius: 10px; animation: bounceDown 2s ease-in-out infinite;}
@keyframes bounceDown {0% {top: 0;} 50% {top: 40px;} 70% {top: 45px;} 100% {top: 0;} }

.about-no-text{font-size: 69px;}    
.counter{display: inline-block;}

.all-heading h2{font-size: 5vw; font-weight: 600; font-family: "Onest", sans-serif; margin :0px;}
.all-heading p{color: #7F7F7F; font-weight: 400; font-size: 22px; margin :0px;}

.features_bg_one{background: url(assets/img/home/feature-01.png) no-repeat; background-size: 100% 100%; padding: 20px; border-radius: 20px; height: 300px;}
.features_one_para{position: absolute; bottom: 15px;}
.features_bg_two{ border-radius: 20px; background: #fff;}
.features_bg_two_graph{background: url(assets/img/home/feature-graph.png) no-repeat; background-size: 100% 100%; padding: 20px; height: 300px;}
.features_bg_three{border-radius: 20px; background: #fff; padding: 20px; height: 300px;}
.features_bg_four{background: url(assets/img/home/feature-07.png) no-repeat; background-size: 100% 100%; padding: 20px; border-radius: 20px; height: 300px;}
.features_bg_five{background-image: linear-gradient(#FFFFFF, #FE652A); border-radius: 20px; padding: 20px; z-index: 1;}
.frature_five_graph{width: 100%; position: absolute; left: 0px; right: 0px; z-index: -1; opacity: 0.5;}

.benifits_bg{background:#fff; border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 22px; overflow: hidden;}
.benifits_image_one{background: url(assets/img/home/benifit-01.png) no-repeat; background-size: 100% 100%; padding: 20px; height: 280px;}
.benifits_image_two{background: url(assets/img/home/benifit-02.png) no-repeat; background-size: 100% 100%; padding: 20px; height: 280px;}
.benifits_image_three{background: url(assets/img/home/benifit-03.png) no-repeat; background-size: 100% 100%; padding: 20px; height: 280px;}
.benifits_image_four{background: url(assets/img/home/benifit-04.png) no-repeat; background-size: 100% 100%; padding: 20px; height: 280px;}
.benifits_image_five{background: url(assets/img/home/benifit-05.png) no-repeat; background-size: 100% 100%; padding: 20px; height: 280px;}
.benifits_image_six{background: url(assets/img/home/benifit-06.png) no-repeat; background-size: 100% 100%; padding: 20px; height: 280px;}

.owl-nav button { background-color: #FE6429; color: #fff; border: none; height: 40px; width: 40px; border-radius: 50%; margin: 0px 3px;}
.owl-dots{display:none}
.owl-nav{text-align: center; margin-top: 30px;}

.Transfers_tab .nav-link{width: 100%; padding: 30px; position: relative; border-bottom: 1px solid rgba(255, 255, 255, 0.24); border-radius: 0px;}
.Transfers_tab .nav-link:last-child{margin-bottom: 0;}
.Transfers_tab .nav-link.active{background: transparent;}
.Transfers_tab .nav-link h4{color: rgba(255, 255, 255, 0.25); font-weight: 400; margin: 0px; font-size: 55px; font-family: "Onest", sans-serif;}
.Transfers_tab .nav-link p{margin-bottom: 0; display: none;}
.Transfers_tab .nav-link.active p{display: block; color: #B7B7B7; }
.Transfers_tab .nav-link.active h4{color: #fff;}
.Transfers_tab .nav-link::before {content: ""; background: rgba(255, 255, 255, 0.24); height: 0.5px; width: 46%; position: absolute; right: -46%; bottom: 0px;}
.build_bg{height: 20px; width:20px; background-color: #FE6429; border-radius: 30px;}
.transfer_heading_text{font-family: "Onest", sans-serif; font-weight: 600; font-size: 20px; color: rgba(255, 255, 255, 0.36);}
.transfer_para_text{font-weight: 400; font-size: 22px; color: #fff;}
.transfer_no{color: rgba(255, 255, 255, 0.25); position: absolute; right: 20px; top: 20px; font-size: 24px; font-family: "Onest", sans-serif; font-weight: 400;}
.nav-link.active .transfer_no{color: #fff;}
.nav-link.active .transfer_no span{color: #FE6429;}
.accordion_body_two{display:none; padding: 0px 0px 20px 0px;}
.accordion_body_two p{margin-bottom: 0px; color: #7F7F7F; font-size: 18px; font-weight: 400; width: 100%;}
.Transfers_tab.active h4{color: #fff;}
.Transfers_tab.active .transfer_no{color: #fff;}
.Transfers_tab.active .transfer_no span{color: #FE6429;}


.journey_heading_font{font-size: 50px; line-height: 60px; font-family: "Onest", sans-serif; font-weight: 700;}
.journey_points_bg{background:#FE652A; position: relative; padding: 20px; border-radius: 0px 50px 50px 0px; padding-left: 0;}
.journey_points_bg::before{content: ""; background:#FE652A; border-radius: 0px 40px 40px 0px;  z-index: -1; position: absolute; top:0; bottom: 0; left: unset; width: 400vh; right: 0;}
.commitment_text::before { content: "";  background: #fff;  width: 1px;  height: 50px; position: absolute; right: -8px;}

.mt5_bg_one{background: url(assets/img/home/mt5.png) no-repeat; background-size: 100% 100%; padding: 20px; border-radius: 20px; height: 450px;}
.mt5_bg_two{background: url(assets/img/home/vertex.png) no-repeat; background-size: 100% 100%; padding: 20px; border-radius: 20px; height: 450px;}
.mt5_bg_three{background: url(assets/img/home/match-traders.png) no-repeat; background-size: 100% 100%; padding: 20px; border-radius: 20px; height: 450px;}

.advanced_bg{padding: 30px; position: relative;}
.advanced_border{border-top: 1px solid rgba(255, 255, 255, 0.25); border-bottom: 1px solid rgba(255, 255, 255, 0.25);}
.advanced_no_bg{background: #fff; height: 40px; width: 40px; border-radius: 40px; padding: 8px}
.advanced_para{color: #C3C3C3;}
.advanced_box{width: 20px; position: absolute; right: 23px; top: 10px;}

.accordion_border_main{margin: auto;}
.plusminus{position: absolute; color: #FE6429; z-index: 1; font-weight: 700; right: 0px; font-size: 30px; top: 5px;  height: 28px;  text-align: center;}
.accordion_head {cursor: pointer; font-size: 20px; font-family: "Onest", sans-serif; color: #000; position: relative; padding-right: 34px !important; font-weight: 600; padding: 10px 0px 20px 0px;}
.faq_point{position: absolute; left: 0; top:0}
.accordion_border{position: relative; overflow: hidden; border-bottom: 1px solid rgba(0, 0, 0, 0.25); margin-bottom: 15px;}
.accordion_body{display:none; padding: 0px 0px 20px 0px;}
.accordion_body p{margin-bottom: 0px; color: #7F7F7F; font-size: 18px; font-weight: 400; width: 100%;}
.faq_open{display: block;}
.faq_box{max-width: 100%; margin: auto;}

.contact_bg{background: url(assets/img/home/contact-bg.png) no-repeat; background-size: 100% 100%;  background-attachment: fixed;}
.contact_bg .form-group {margin-bottom: 20px; }
.contact_bg label { display: block; font-size: 20px; color: rgba(255, 255, 255, 0.6); }
.contact_bg input, textarea { width: 100%; background: transparent; border: none; border-bottom: 2px solid #666; padding: 10px 5px; font-size: 18px; color: #fff; outline: none; }
.contact_bg input::placeholder, textarea::placeholder {color: rgba(255, 255, 255, 0.6); }
.contact_bg textarea { resize: none; height: 100px; }

.contact_heading{font-weight: 500; font-size: 25px; color: #FE652A;}
.contact_form_bg{background: #FFFFFF; padding: 10px; border-radius: 20px; box-shadow: 0px 0px 5px -1px #00000063;}
.contact_form_bg_inner{background-image: linear-gradient(#FFFFFF, #F3F3F3); padding: 30px; border-radius: 7px; box-shadow: 0px 0px 5px -1px #00000063; overflow: hidden;}
.contact_form_bg .form-row { display: flex; gap: 20px; margin-bottom: 20px; }
.contact_form_bg .form-group { flex: 1; display: flex; flex-direction: column; }
.contact_form_bg .form-group input,
.contact_form_bg .form-group textarea { border: none; border-bottom: 1px solid #969696; padding: 8px; font-size: 14px; outline: none; resize: none; background: transparent; color: #000;  }
.contact_form_bg .form-group textarea::placeholder{color: #000;}
.contact_form_bg .form-group input::placeholder{color: #000;}
.contact_form_bg .submit-btn {width: 100%; background: #FE6429; color: #fff; padding: 12px; border: none; border-radius: 30px; font-size: 16px; cursor: pointer; margin-top: 20px; }
.contact_form_bg .submit-btn:hover {background: #e64a00;}

.floating_image{position: fixed; right: 25px; bottom: 40px; display: none;}
.floating_image_shadow{box-shadow: 3px 2px 10px 0px #00000063;}

.features_border{width: 100%; height: 0.9px; background: #000;}
.features_card_one{background:#F3F3F1; border-radius: 20px; padding: 15px;}
.filter_icon{width: 45px;}


.portal-padding{padding-top: 120px;}
.inner_heading h2{font-size: 65px; font-weight: 400; font-family: "Onest", sans-serif; margin :0px;}

.Mission-tab .nav-link{background: transparent; padding: 0; color: #000; text-align: left; border: none; display: block; width: 100%;}
.Mission-tab .nav-link.active{color: #FE652A;}
.Mission-tab{margin-left: 54.5%; position: absolute; top: 35%;}
.Mission-tab-img{border-radius: 10px;}
.Mission-tab-img img{border-radius: inherit; width: 100%;}
.who-text-position{margin-left: 54.5%; position: absolute; top: 20%;}
.about_result{font-weight: 400; font-size: 65px; font-family: "Onest", sans-serif;}

.MT_five_icon{width: 65px; margin-right: 20px;}
.crown_icon{width: 60px; margin-right: 10px;}

.all-heading h3 {font-size: 65px;}
.customizable_list{display: flex; flex-wrap: wrap; gap: 20px; list-style: none; padding: 0; margin: 0;}
.customizable_list li{background: #F3F3F1; padding: 13px 30px; border-radius: 50px;}
.sticky-content-list{position: relative; margin-bottom: 30px; padding-left: 120px; padding-bottom: 50px;}
.sticky-content-list:last-child{margin-bottom: 0;}
.sticky-content-list p{color: #7F7F7F; font-weight: 400; font-size: 20px}
.sticky-content-list img{position: absolute; width: 70px; left: 30px; top:0}
.sticky-content-list::before{content: ""; background: linear-gradient(to bottom, #FFA989, #FFE5DA, #fff); width: 6px; position: absolute; left: 0; top: 0; bottom: 0; border-radius: 35px;}
.sticky-content-list::after{content: ""; background: #FE6429; top: 0; height: 50px; position: absolute; left: 0; width: 6px;  border-radius: 35px;}
.process_sticky{position: sticky; top:100px}
 

.timeline ul { padding: 0; margin: 0;}
.timeline .default-line { content: ''; position: absolute; left: 50%; width: 10px; background: #E2E2E2; height: 960px;}
.timeline .draw-line { width: 10px; height: 0; position: absolute; left: 50%; background: #FE6429;}
.timeline ul li { list-style-type: none; position: relative; margin: 0 auto; margin-bottom: 40px; background: transparent;}
.timeline ul li:last-child{margin-bottom: 0;}
.timeline ul li.in-view { transition: 0.125s ease-in-out, background-color 0.2s ease-out, color 0.1s ease-out, border 0.1s ease-out;}
.timeline ul li.in-view::before { transform: translateX(-39%); width: 40px; height: 40px;background-color: #FE6429;}
.timeline ul li:nth-child(1)::before{top:-5px}
.timeline ul li::before { content: ''; position: absolute; left: 50%; top: 50%; transform: translateX(-35%); width: 35px; height: 35px; border-radius: 50%; background: inherit; background: #E2E2E2; transition: all 0.4s ease-in-out;}
.steps-img-box img{width: 100%; opacity: .5;}
.steps-left-m{margin-left: 60px;}
.steps-right-m{margin-right: 60px;}
.in-view .steps-img-box img{opacity: 1;}
.in-view .steps-content-box{box-shadow: 0px 0px 7px 1px #ccc; background: #fff;}
.steps-content-box{background: #F3F3F1; border-radius: 20px; padding: 20px; z-index: 1; position: relative;}
.in-view .steps-content-box span{color: #FE6429;}
.steps-content-box span{display: flex; align-items: center; justify-content: center; margin-bottom: 15px; font-size: 20px; height: 45px; width: 45px; background: #fff; box-shadow: 0px 0px 7px 1px #ccc; border-radius: 50%;}
.steps-content-box p{color: #7F7F7F; font-size: 18px; font-weight: 400;}

.steps_gif{max-width: 400px;}

.successs{text-align: center;}
.successs img{margin-top:80px;width: 150px;}
.successs p{font-size: 40px; color: #2b5504; margin-top: 30px;}

.features_graph{max-width: 700px; position: absolute; top: 0; bottom: 0; left: 0;}

.toast {visibility: hidden; min-width: 250px; margin-left: -125px; background-color: #28a745; color: #fff; text-align: center; border-radius: 5px; padding: 16px; position: fixed; z-index: 1; left: 50%; bottom: 30px; font-size: 15px; opacity: 0; transition: opacity 0.5s, bottom 0.5s;  }
.toast.show {visibility: visible; opacity: 1; bottom: 50px;}

footer .input-wrapper {display: flex; align-items: center; border-bottom: 1px solid rgba(0, 0, 0, 0.25); max-width: 100%; padding-bottom: 15px; }
footer .input-wrapper input { flex: 1; border: none; outline: none; font-size: 18px; background: transparent; font-weight: 500; color: #7F7F7F; }
footer .submit-btn { background: #FE652A; border: none; border-radius: 50%; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; cursor: pointer; }
footer .submit-btn img { width: 25px; }
.footer_menu{list-style: none;}
.footer_menu li{font-weight: 500; font-size: 18px; padding: 8px 0px;}
.footer_menu li a{color: #000; }
.footer_menu li a:hover{color: #FE652A; }

.policy-menu{padding: 0px; margin: 0px; list-style: inside;}
.policy-menu li{margin-bottom: 0; margin-bottom: 10px; position: relative; margin-right: 15px; display: inline-block;}
.policy-menu li a{color: #FE652A; text-decoration: none; font-size: 18px;}
.policy-menu li::before{content: ""; background: #FE652A; width: 2px; position: absolute; right: -11px; top: 4px; bottom: 4px;}
.policy-menu li:last-child::before{display: none;}


.apk-btn {display: flex; align-items: center; justify-content: center; gap: 8px; font-size: 15px; font-family: Arial, sans-serif; padding: 8px 20px; color: #fff; background: linear-gradient(#222, #000); border: 1px solid #555; border-radius: 6px; cursor: pointer; box-shadow: 0 1px 3px rgba(0,0,0,0.5); }
.apk-btn svg {width: 18px; height: 18px; fill: white;}
.apk-btn:hover {border-color: #888; }

.modal-content{background: #FFFFFF; padding: 20px; border-radius: 30px; box-shadow: 0px 0px 5px -1px #00000063;}
.modal-bg {background-image: linear-gradient(#FFFFFF, #F3F3F3); padding: 20px; border-radius: 10px; box-shadow: 0px 0px 5px -1px #00000063; overflow: hidden;}
.intrgration_logo{width:200px;}
.intrgration_card_one{background:#E7E7E7; border-radius: 10px; padding: 10px;}

.blog_title{border: none; color: #fff; font-weight: 400; font-size: 16px; display: inline-block; padding: 6px 15px; text-align: center; border-radius: 40px;  background: #FF966E;}
.text_limit{display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;}
.text_limit_two{display: -webkit-box; -webkit-line-clamp: 4; line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;}

.blog_hover:hover .blog_title{background: #FE6429;}
.blog_hover:hover .text_limit{color: #FE6429 !important;}

*blog_pagination*/
.blog_pagination{text-align: right;}
.page-numbers {
	display: inline-block;
	padding: 5px 10px;
	 color: #000;
	border: 1px solid #d0cccc;
	width: 36px;
  text-align: center;
	text-decoration: none;
	border-radius: 5px;
	font-weight: 600;
}
.page-numbers.current,
a.page-numbers:hover {
    background-color: #FE6429;
    border: 1px solid #FE6429;
  color: #fff;
}
 
/*blog details*/
 
.blog_box {
    width: 100%;
    margin-bottom: 20px;
}
 
.blog_img_box {
    border-radius: 20px 20px 20px 0;
    padding: 10px;
    background: #f6f6f6;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .25);
}
 
.blog_img_box a {
    display: block;
    overflow: hidden;
    border-radius: 20px 20px 20px 0;
}
 
.blog_img_box a img {
    width: 100%;
    height: 100%;
    transition: all 0.5s ease-in-out;
    filter: drop-shadow(2px 2px 4px rgba(0, 0, 0, .25));
}
 
.blog_img_box:hover {
    background: linear-gradient(45deg, #d12221, #f36713);
}
 
.blog_img_box:hover img {
    transform: scale(1.1);
}
 
.blog_contain {
    padding-top: 20px;
}
 
.blog_contain h5 {
    margin-bottom: 15px;
    font-size: 17px;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
}
 
.blog_contain h5 a {
    color: #000;
    display: block;
}
 
.blog_contain h5 a:hover {
    color: var(--red-color);
}
 
.blog_contain p {
    margin-bottom: 0px;
    font-size: 13.5px;
    line-height: 20px;
    color: #747474;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    width: 100%;
    min-height: 70px;
}
 
.blog_details_link {
    color: #747474;
    display: inline-block;
    font-size: 14px;
}
 
.blog_date {
    color: #747474;
    font-size: 13px;
}
 
.blog_details_link:hover {
    color: var(--red-color);
}
 
.blog_details_link img {
    width: 16px;
    margin-left: 4px;
}
 
 
.blog_left_border {
    border-left: 1px solid #ccc;
    padding-left: 20px;
}
 
.blog_cat_box_bg {
    background: #efefef;
    overflow: hidden;
    padding: 20px;
    border-radius: 20px;
}
 
.blog_cat_list {
    list-style: none;
    padding: 0px;
    margin-bottom: 0px;
}
 
.blog_cat_list li {
    display: block;
}
 
.blog_cat_list li a {
    display: block;
    position: relative;
    color: #000;
    font-size: 13px;
    padding: 8px 0 8px 3px;
}
 
.blog_cat_list li a::after {
    transition: all .25s;
    content: "";
    display: block;
    width: 100px;
    border-width: 0 0 1px;
    border-style: solid;
    border-color: rgba(11, 11, 11, .2);
    position: absolute;
    left: -30px;
    bottom: 0;
}
 
.blog_cat_list li a:hover::after {
    width: 100%;
    border-color: var(--red-color);
}
 
.blog_cat_list li a:hover {
    color: var(--red-color);
}
 
.latest_blog_box_post {
    position: relative;
    margin-bottom: 15px;
    min-height: 60px;
    padding-left: 70px
}
 
.latest_blog_box_post:hover img {
    transform: scale(1.1);
}
 
.latest_blog_box_post:last-child {
    border-bottom: none;
}
 
.latest_blog_box_post img {
    width: 60px;
    height: 60px;
    transition: all 0.5s ease-in-out;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 6px;
}
 
.latest_blog_box_post h4 a {
    overflow: hidden;
    margin-bottom: 0px;
    color: #000;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    width: 100%;
}
 
.latest_blog_box_post h4 {
    font-size: 13px;
    margin-bottom: 0px;
}
 
.latest_blog_box_post h4 a:hover {
    color: var(--red-color);
}
 
.latest_blog_box_post h6 {
    font-size: 12px;
    color: #747474;
    margin-bottom: 7px;
}
 
.blog_details_main_img {
    border-radius: 20px;
    overflow: hidden;
    padding: 20px;
    background: #f6f6f6;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .25);
}
 
.blog_details_main_img img {
    border-radius: 20px;
    width: 100%;
    height: 100%;
}
 
.blog_details_contain {
    margin-top: 20px;
}
 
.blog_details_contain h1 {
    font-size: 30px;
}
 
.blog_details_contain p {
    line-height: 23px;
    font-size: 14px;
}
.blogdetail{padding-top:50px; padding-bottom:50px;}