/* ================================================================================ */
/* Global CSS  */
/* ================================================================================ */
*{
    margin: 0;
    padding: 0;
}
:root {
    --white: #FFFFFF;
    --black: #000000;
    --green: #2CC109 ;
    --gray: #959595 ;
    --lightgray :#C1C1C1 ;
    --red: #FF3B3B;

}

.custom_container {max-width: 1410px;}
/*.btn {background-color: var(--white);color: var(--green);font-size: 18px;border-radius: 50px;line-height: 28px;font-family: 'Inter', sans-serif;padding: 15px 35px;transition: all 0.3s ease;}*/
.btn_white {background-color: var(--white);color: var(--green);font-size: 18px;border-radius: 50px;line-height: 28px;padding: 15px 35px;font-family: 'Inter', sans-serif;transition: all 0.3s ease;}
.btn_green {background-color: var(--green);color: var(--white);font-size: 18px;border-radius: 50px;line-height: 28px;padding: 15px 35px;font-family: 'Inter', sans-serif;transition: all 0.3s ease;}
.btn_block {width: 100%;}
.btn_white:hover {background-color: var(--green); color:var(--white) ; box-shadow: 0 0 10px var(--green); }
.btn_green:hover {background-color: var(--white); color: var(--green); box-shadow: 0 0 10px var(--white);}


.btn:focus ,   input:focus ,   select:focus ,   textarea:focus  {box-shadow: unset; outline: none;}
body::-webkit-scrollbar-track { border-radius: 10px; background: linear-gradient(to  bottom, rgb(0 0 0 / 47%),rgb(0 0 0 / 56%),rgb(0 0 0 / 0%)); }
body::-webkit-scrollbar { width: 10px; background:  linear-gradient(to  bottom, rgb(0 0 0 / 47%),rgb(0 0 0 / 56%),rgb(0 0 0 / 0%)); }
body::-webkit-scrollbar-thumb { border-radius: 10px;  background-color: var(--green); }
body{ background-color: #1A2020;color: var(--white);}

.gradient_cards { padding: 30px; background: linear-gradient(to left top, #000000, #464646); border-radius: 3px; margin-bottom: 30px;    transition: all 0.5s ease;     }
.gradient_cards:hover {background: linear-gradient(to left top,  #464646, #000000);    box-shadow: 0 0 10px var(--white);}
.gradient_cards h4 { margin-bottom: 30px; }
.gradient_cards p { margin-bottom: 20px; }
.gradient_cards h3 { margin-bottom: 15px; font-family: 'Work Sans', sans-serif; color: #959595; font-weight: bold; }
.gradient_cards ul { padding-left: 15px; margin-bottom: 20px; height: 350px; overflow-y: scroll; }
.gradient_cards ul li::marker { content: " + "; position: relative; }
.gradient_cards ul li {font-size: 16px;line-height: 30px;font-family: 'Inter', sans-serif;color: #C1C1C1;}
.gradient_cards span{font-size: 16px;line-height: 30px;font-family: 'Inter', sans-serif;color: #C1C1C1;}
.gradient_cards ul::-webkit-scrollbar { width: 5px; background-color:  transparent; }
.gradient_cards ul::-webkit-scrollbar-thumb { border-radius: 10px;  background-color: var(--green); }
.top_shap_bg {background-image: url("../assets/images/top_shap_bg.png");background-size: contain;background-position: left top;background-repeat: no-repeat;}
.botton_shap_bg {background-image: url("../assets/images/botton_shap_bg.png");background-size: contain;background-position: right bottom;background-repeat: no-repeat;}
.sec_heading {margin-bottom: 30px}

/* ================================================================================ */
/* Font family  */
/* ================================================================================ */
@font-face {
    font-family: 'Rockwell Regular';
    src: url("../assets/fonts/Rockwell/Rockwell-Regular.ttf");
}
@font-face {
    font-family: "Rockwell Bold";
    src: url("../assets/fonts/Rockwell/Rockwell-Bold.ttf") ;
}
@font-face {
    font-family: "yu gothic";
    src: url("../assets/fonts/yu-gothic/yugothic.ttf") ;
}

/* ================================================================================ */
/* Global Size  */
/* ================================================================================ */
h1 { font-size: 90px; line-height: 100px; font-family: 'Rockwell Regular'; }
h2 { font-size: 65px; line-height: 75px;  font-family: 'Rockwell Regular';}
h3 { font-size: 50px; line-height: 60px;  font-family: 'Rockwell Regular';}
h4 { font-size: 35px; line-height: 45px;  font-family: 'Rockwell Regular';}
h5 { font-size: 30px; line-height: 35px;  font-family: 'Rockwell Regular';}
h6 { font-size: 25px; line-height: 30px;  font-family: 'Rockwell Regular';}
p { font-size: 17px;line-height: 28px;font-family: 'Inter', sans-serif;    color: #C1C1C1;}
a { color: var(--white); font-family: 'Inter', sans-serif; font-size: 17px;text-decoration: none; }
a:hover { color: var(--white); }
/*span{ font-size: 17px; line-height: 30px; font-family: 'Inter', sans-serif; }*/
label{ font-size: 17px; line-height: 30px; font-family: 'Inter', sans-serif; }


/* ================================================================================ */
/* Header Css */
/* ================================================================================ */
.main_header .navbar-collapse {  justify-content: end;column-gap: 50px; }
.main_header .navbar { padding:  0px; }
.main_header .navbar .container {padding: 15px 0px; }
.main_header .navbar-collapse .navbar-nav { align-items: center; }
.main_header .account_btns { display: flex;column-gap: 10px;}
.main_header .navbar .navbar-nav .nav-item .nav-link {font-family: 'Inter', sans-serif;font-size: 18px;line-height: 21px;margin: 0px 25px; color: var(--white);  position: relative;transition: all 0.3s ease ;    padding: 12px 0px;}
.main_header .navbar .navbar-nav .nav-item .nav-link.active::after , .main_header .navbar .navbar-nav .nav-item:hover .nav-link::after { content:""; width: 100%; height: 3px; background-color: var(--green); position: absolute; bottom: 0; left: 0; border-radius: 10px; }
.main_header .navbar .navbar-nav .nav-item:hover .nav-link{color: var(--white);}
.main_header .account_btns .btn {font-size: 20px;}
.main_header { position: absolute; top: 0; left: 0; width: 100%; }
.main_header .navbar .navbar-brand {width: 200px;height: 140px;padding: 0;}
.main_header .navbar .navbar-brand img { width: 100%; height: 100%; object-fit: contain; object-position: center; }
.main_header .navbar .navbar-nav .nav-item .nav-link:hover , .main_header .navbar .navbar-nav .nav-item a.active{color: var(--white);}
.main_header .navbar .navbar-nav .nav-item .dropdown .btn{ font-family: 'Inter', sans-serif; font-size: 18px; line-height: 21px; margin: 0px 25px; color: var(--white); position: relative; transition: all 0.3s ease; padding: 12px 0px; }
.main_header .navbar .navbar-nav .nav-item .dropdown  .dropdown-item:focus, .main_header .navbar .navbar-nav .nav-item .dropdown  .dropdown-item:hover { color: var(--black); background-color: white; }
.main_header .navbar .navbar-nav .nav-item .dropdown:hover .dropdown-menu { display: block ; transition: all 0.5s ease; }
.main_header .navbar .navbar-nav .nav-item .dropdown .dropdown-menu { transition: all 0.5s ease; }
.main_header .navbar .navbar-nav .nav-item .nav-link .badge-danger { display: inline-block; min-width: 10px; padding: 4px 7px; font-size: 11px; font-weight: 700; line-height: 1; color: #fff; text-align: center; white-space: nowrap; vertical-align: middle; background-color: #e74a25; border-radius: 10px; position: absolute; right: -15px; top: 10px; } .main_header .navbar .navbar-nav .nav-item .nav-link { position: relative; }

/* ================================================================================ */
/* Footer Css */
/* ================================================================================ */
.main_footer { padding: 80px 0px 30px 0px; background: linear-gradient(to left , #464646, #000000); }
.main_footer .footer_logo_box img { margin-bottom: 30px; }
.main_footer h6 { position: relative; padding-bottom: 10px; margin-bottom: 30px;     font-family: "Rockwell Bold";}
.main_footer h6:after { content: ''; width: 80px; height: 2px; background-color: var(--green); bottom: 0; position: absolute; bottom: 0px; left: 0; border-radius: 10px; }
.main_footer ul { padding: 0px; list-style: none; }
.main_footer li {margin-bottom: 25px;} .main_footer .footer_logo_box {/* max-width: 95%; */padding-right: 50px;}
.main_footer ul li a { display: flex; /* align-items: center; */ }
.main_footer ul li a>i {font-size: 20px;margin-right: 10px;margin: 5px 10px 0px 0px;}
.main_footer .newsletter_box { padding-left: 80px; }
.main_footer .newsletter_box .newsletter_form .form-control { height: 60px; text-align: center; font-family: 'Inter', sans-serif; color: #2F2F2F; border-radius: 3px; margin-bottom: 20px; }
.main_footer .newsletter_box .newsletter_form .btn { background-color: var(--green); width: 100%; height: 60px; color: var(--white); font-family: 'Inter', sans-serif; font-size: 17px; }
.main_footer .copyright_bar { border-top: 1px solid rgb(255 255 255 / 16%); border-bottom: 1px solid rgb(255 255 255 / 16%); padding: 20px 0px; text-align: center; margin-top: 60px; }
.main_footer .copyright_bar p { margin: 0;     color: var(--white);}

/* ================================================================================ */
/* Banner Section Css */
/* ================================================================================ */
.banner_sec { background:linear-gradient(rgba(0,0,0,80%),rgba(0,0,0,0%)), url("../assets/images/banner.jpg");text-align: center;display: flex;align-items: center;justify-content: center;padding-top: 260px;padding-bottom: 160px;background-size: cover;  min-height: 100vh;background-position: top;background-repeat: no-repeat;}
.banner_sec .banner_content { width: 70%; margin: auto; }
.banner_sec .banner_content h1, .banner_sec .banner_content P {margin-bottom: 25px;    color: var(--white);}
.banner_sec .banner_content h1 {font-family: 'Rockwell Bold';}
.banner_sec .banner_content .btn {    font-family: "yu gothic";font-weight: 500;}
.inner_banner_sec {background:linear-gradient(rgba(0,0,0,80%),rgba(0,0,0,0%)), url("../assets/images/inner_banner_bg.jpg");text-align: center;display: flex;align-items: center;justify-content: center;padding-top: 260px;padding-bottom: 160px;background-size: cover;background-position: top;background-repeat: no-repeat;align-items: end;}
.inner_banner_sec .banner_content h1 {margin: 0px;font-family: 'Rockwell Bold';}


/* ================================================================================ */
/* About Us Section Css */
/* ================================================================================ */
.about_us_sec { background-color: #1A2020; padding:80px 0px; }
.about_us_sec .row { align-items: center; }
.about_us_sec .about_us_content h2 { margin-bottom: 25px; }
.about_us_sec .about_us_content p { margin-bottom: 30px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 8; line-clamp: 8; -webkit-box-orient: vertical;}
.about_us_sec .about_us_img { height: 700px; }
.about_us_sec .about_us_img img { width: 100%; height: 100%;     object-fit: contain;object-position: center;}


/* ================================================================================ */
/* Features Section Css */
/* ================================================================================ */
.features_sec { background-image: linear-gradient(to  bottom, rgb(0 0 0 / 47%),rgb(0 0 0 / 56%),rgb(0 0 0 / 0%)); background-color: #1A2020; padding: 80px 0px; }
.features_sec  h2 { margin-bottom: 30px; }
/*.features_sec .features_cards { padding: 30px; background: linear-gradient(to left top, #000000, #464646); border-radius: 3px; margin-bottom: 30px;    transition: all 0.5s ease; }*/
/*.features_sec .features_cards:hover {background: linear-gradient(to left top,  #464646, #000000);}*/
/*.features_sec .features_cards h4 { margin-bottom: 30px; }*/
/*.features_sec .features_cards p { margin-bottom: 20px; }*/
/*.features_sec .features_cards h3 { margin-bottom: 15px; font-family: 'Work Sans', sans-serif; color: #959595; font-weight: bold; }*/


/* ================================================================================ */
/* Privacy Section Css */
/* ================================================================================ */
.privacy_sec { text-align: center;  padding: 160px 0px;  background:linear-gradient(rgba(0,0,0,99%),rgba(0,0,0,77%),rgba(0,0,0,0%)),  url("../assets/images/privacy_bg.jpg"); min-height: 600px; display: flex; align-items: center; background-position: center; background-size: cover; background-repeat: no-repeat; }
.privacy_sec .privacy_sec_content h1 { margin-bottom: 30px; }
.privacy_sec .privacy_sec_content { max-width: 65%; margin: 0 auto; }


/* ================================================================================ */
/* Server Swiper Section Css */
/* ================================================================================ */
.server_swiper_sec {padding: 120px 0px;min-height: 910px;background-color: #1A2020;overflow-x: hidden;position: relative;}
.server_swiper_sec .server_sec_content h2{ margin-bottom:25px }
.server_swiper_sec .server_sec_content p{ margin-bottom:20px }
.server_swiper_sec .row {align-items: center;}
.server_swiper_sec .server_swiper { overflow: visible; }
.server_swiper_sec .server_sec_content {  z-index: 2; position: relative;  padding-right: 30px; }
.server_swiper_sec .server_sec_silder { position: absolute; width: 56%; right: 0; top:120px;overflow: hidden; }
.server_swiper_sec .server_sec_content { min-height: 670px; display: flex; align-items: start; justify-content: center; flex-direction: column; }
.server_swiper_sec .server_swiper  .gradient_cards { margin-bottom: 0px; }
.server_swiper_sec .server_swiper .swiper-slide {padding: 10px 0px;}
.server_swiper_sec .server_swiper {padding: 10px;}


/* ================================================================================ */
/* Faqs Section Css */
/* ================================================================================ */
.faqs_sec { padding: 100px 0px; }
.faqs_sec .faqs_sec_heading { max-width: 60%; margin: 0 auto; text-align: center; margin-bottom: 50px; }

.accordions_box .accordion  .accordion-item { margin-bottom: 25px;border-radius: 3px; }
.accordions_box .accordion  .accordion-item { background: #000000; border: none; }
.accordions_box .accordion  .accordion-button { background: #000000; color: var(--white);    font-size: 17px; font-family: 'Inter', sans-serif; border: none; position: relative; padding:20px 40px ;border-radius: 3px;}
.accordions_box .accordion .accordion-button:focus {box-shadow: unset;}
.accordions_box .accordion .accordion-button:not(.collapsed){ background: #000000; color: var(--white); font-family: 'Inter', sans-serif; }
.accordions_box .accordion .accordion-collapse { background: #000000; }
.accordions_box .accordion .accordion-body { padding:30px 40px; text-align: left; font-family: 'Inter', sans-serif; font-size: 17px; line-height: 30px; }
.accordions_box .accordion .accordion-item:last-child {margin-bottom:0px;}
.accordions_box .accordion .accordion-button::after{content: '';background-image: url("../assets/images/arrow-dropdown.svg");background-size: contain;width: 12px;height: 10px;}



/* ================================================================================ */
/* Why Choose Us Section Css */
/* ================================================================================ */
.why_choose_us_sec {padding: 100px 0px 70px 0px;}
.why_choose_us_sec .gradient_cards h2 , .why_choose_us_sec .gradient_cards h5 {color: #C1C1C1;}


/* ================================================================================ */
/* Server Section Css */
/* ================================================================================ */
.srvices_sec {padding: 100px 0px 70px 0px;}


/* ================================================================================ */
/* Meet Hostinza Section Css */
/* ================================================================================ */
.meet_hostinza_sec { padding: 100px 0px; }
.meet_hostinza_sec  .row { align-items: center; }
.meet_hostinza_sec .meet_hostinza_modal_box {  position: relative; }
.meet_hostinza_sec .meet_hostinza_modal_box .meet_img_one { height: 600px; position: absolute; width: 75%; top: 0; right: 0; border-radius: 10px; overflow: hidden; z-index: 1; }
.meet_hostinza_sec .meet_hostinza_modal_box .meet_img_one img { width: 100%; height: 100%; object-fit: cover; }
.meet_hostinza_sec .meet_hostinza_modal_box .meet_modal_btn { padding: 0; height: 580px; width: 75%; bottom: 0; left: 0; border-radius: 10px; overflow: hidden; z-index: 2; position: relative; }
.meet_hostinza_sec .meet_hostinza_modal_box { padding-top: 65px; }
.meet_hostinza_sec .meet_hostinza_modal_box .meet_modal_btn  .play_icon { position: absolute; background-color: white; width: 90px; height: 90px; border-radius: 7px; top: 0; bottom: 0; left: 0; right: 0; margin: auto; }
.meet_hostinza_sec .meet_hostinza_modal_box .meet_modal_btn .play_icon i { font-size: 35px; color: var(--green); display: flex; align-items: center; justify-content: center; height: 100%; width: 100%; }
.meet_hostinza_sec .meet_hostinza_modal_box .meet_modal_btn:before { content: ''; display: block; background-color: rgb(7 , 35,  0 , 82%); position: absolute; width: 100%; height: 100%; left: 0; top: 0; border-radius: 10px; }

.meet_Modal .modal-body .meet_video { width: 100%; height: 400px; }
.meet_Modal .modal-body .meet_video iframe { width: 100%; height: 100%; }
.meet_Modal .modal-header {padding: 20px;border-bottom: 1px solid rgb(255 255 255 / 16%);border: none;padding: 20px  10px;}
.meet_Modal .modal-body .meet_video { width: 100%; height: 400px; }
.meet_Modal .modal-body .meet_video iframe { width: 100%; height: 100%; }
.meet_Modal .modal-content {background: transparent;/* background-color: #1A2020; */border: none;/* padding: 0px; *//* border-radius: 7px; */}
.meet_Modal .modal-header .btn-close {background-color: var(--green);border-radius: 50%;width: 25px;height: 25px;padding: 5px;opacity: 1;}
.modal-body { background: linear-gradient(to bottom, rgb(0 0 0 / 47%),rgb(0 0 0 / 56%),rgb(0 0 0 / 0%)); background-color: #1A2020; border: 1px solid rgb(255 255 255 / 16%); border-radius: 7px; }

/* ================================================================================ */
/* Srvices Categories Section Css */
/* ================================================================================ */
.services_categories_sec { padding: 100px 0px; background: linear-gradient(to bottom, rgb(0 0 0/ 28%), rgb(0 0 0/ 10%), rgb(0 0 0 / 0%)); }
.services_categories_sec .categorie_card { padding: 30px; background: #252B2B; border-radius: 3px; margin-bottom: 30px; transition: all 0.5s ease; }
.services_categories_sec .categorie_card:hover { background: linear-gradient(to left top, #464646, #000000); cursor: pointer;}
.services_categories_sec .categorie_card ul {padding-left: 20px;margin-bottom: 20px;height: 190px;overflow-y: scroll;}
.services_categories_sec .categorie_card ul::-webkit-scrollbar { width: 5px; background-color:  transparent; }
.services_categories_sec .categorie_card ul::-webkit-scrollbar-thumb { border-radius: 10px;  background-color: var(--green); }
.services_categories_sec .services_categorie_heading { background: #252B2B; padding: 50px; border-radius: 7px; margin-bottom: 78px; }
.services_categories_sec .categorie_card ul li { font-size: 16px; line-height: 30px; font-family: 'Inter', sans-serif; color: #C1C1C1; }
.services_categories_sec .categorie_card ul li::marker { color: white; }
.services_categories_sec .categorie_card p { margin-bottom: 20px; }
.services_categories_sec .categorie_card h5 { margin-bottom: 30px; }
.services_categories_sec .categorie_card h6 { margin-bottom: 20px; }


/* ================================================================================ */
/*  Srvices Detail Section Css */
/* ================================================================================ */
.services_detail_sec { padding: 100px 0px; }
.services_detail_sec .services_detail_box { padding: 25px; background-color: #252B2B; border-radius: 7px; margin-bottom: 30px ; }
.services_detail_sec .services_detail_box h5 { border-bottom: 1px solid rgb(255 255 255 / 16%); padding-bottom: 20px; margin-bottom: 20px; }
.services_detail_sec .services_accordions h5 {margin-bottom: 30px;}
.services_detail_sec .service_add_to_cart { padding: 25px; background-color: #252B2B; border-radius: 7px; }
.services_detail_sec .service_add_to_cart p { color: var(--white); margin-bottom: 12px; }
.services_detail_sec .service_add_to_cart h5 { border-bottom: 1px solid rgb(255 255 255 / 16%); padding-bottom: 20px; margin-bottom: 20px; }
.services_detail_sec .service_add_to_cart .form-group { margin-bottom: 25px; }
.services_detail_sec .service_add_to_cart .form-group label { margin-bottom: 12px; color: #989898; }
.services_detail_sec .service_add_to_cart .form-group .btn_block {border-radius: 4px;}
.services_detail_sec .service_add_to_cart h6 {font-size: 21px;margin-bottom: 25px;}
.services_detail_sec .service_add_to_cart .form-group select { background: #000000; color: #989898; font-size: 17px; font-family: 'Inter', sans-serif; border: none; position: relative; padding: 15px 20px; border-radius: 4px; position:relative; }
.services_detail_sec .service_add_to_cart .form-group select {background: #000 url("../assets/images/arrow-dropdown.svg") no-repeat right .75rem center/8px 10px ;}
.services_detail_sec .services_accordions_tags { background-color: #181818; color: white; border: 1px solid #1A2020; margin: 10px; padding: 10px;    display: inline-block; }
/* ================================================================================ */
/* Login / Register Section Css */
/* ================================================================================ */
.login-register {background:linear-gradient(rgba(0,0,0,43%),rgba(0,0,0,43%)), url("../assets/images/login-bg.jpg")!important;background-position: top;background-size: cover;
    padding: 100px 0px;min-height:100vh;    height: auto;position: relative;}
.login-register .login-box { width: 800px; margin: 150px  auto 0; text-align: center; background-color: transparent; border: none; padding: 0px; }
.login-register .login-box .white-box {background: #002739;border-radius: 7px;border: none;padding: 40px;background: linear-gradient(to  bottom, rgb(0 0 0 / 47%),rgb(0 0 0 / 56%),rgb(0 0 0 / 0%));background-color: #1A2020;}
.login-register .login-box .white-box form .form-group { margin-left: 0; margin-right: 0px;    margin-bottom: 30px; }
.login-register .login-box .white-box form  .form-group { margin-left: 0px; margin-right: 0px; }
.login-register .login-box .white-box form .form-group label { text-align: left; display: inherit;     color: #C3C8C2;font-weight: 400;}
.login-register .login-box .white-box form .form-group .form-control { height: 60px; border-radius: 50px; padding: 10px 30px; font-size: 17px; line-height: 30px; font-family: 'Inter', sans-serif;     background-color: var(--white);}
.login-register .login-box .white-box .login_box_heading H3  { color: var(--white); font-family: "Rockwell Bold"; }
.login-register .login-box .white-box .login_box_heading .logo_box { width: 150px; height: 100px; margin: 0 auto; }
.login-register .login-box .white-box .login_box_heading .logo_box img { width: 100%; height: 100%; object-fit: contain; }
.login-register .login-box .white-box .login_box_heading p { margin-bottom: 20px; }
.login-register .login-box .white-box form .form-group.form_bottm_bar { margin-bottom: 20px; }
.login-register .login-box .white-box form .form-group.form_bottm_bar p {margin: 0px;}
.login-register .login-box .white-box form .form-group.form_bottm_bar a { color: var(--green); font-weight: 500; text-decoration: underline; }
.login-register .login-box .white-box form .form-group .form-control:focus {background-image: unset;}
.login-register .login-box .white-box form .form-group .form-control::placeholder {color: #C3C8C2;}
.login-register .register_box {width: 1000px;}
.login-register .login-box { margin: 0 auto; display: flex; align-items: center; justify-content: center; height: 100%; }
.login-register .login-box .white-box { margin: 0px; }
.login-register .login-box .white-box form .form-group .invalid-feedback { text-align: left; display: block; margin: 5px 0px; position: absolute; bottom: 5px; margin: 0; line-height: 20px; }
.login-register .login-box .white-box form .form-group .invalid-feedback strong { color: red; font-weight: 500; }
.login-register .login-box .white-box form .form-group .btn_green:hover {box-shadow: unset;}
.login-register .login-box .white-box form .form-group .radio_login { display: flex; justify-content: center; gap: 15px; margin-bottom: 20px; }
.login-register .login-box .white-box form .form-group .radio_login input[type="radio"] { display: block; margin: 0 auto; height: 20px; }

/* ================================================================================ */
/* Add To Cart Section Css */
/* ================================================================================ */
.add_to_cart_sec {  padding: 100px 0px;  }
.add_to_cart_sec .stepform_div .form-group .form-control   { background: #000000; color: #989898; font-size: 16px; font-family: 'Inter', sans-serif; border: none; position: relative; padding: 15px; position: relative; }
.add_to_cart_sec .stepform_div .form-group .form-control:focus{}
.add_to_cart_sec .stepform_div .form-group label { margin-bottom: 12px; color: #989898; }
.add_to_cart_sec .stepform_div .form-group { margin-bottom: 25px; }
.add_to_cart_sec .stepform_div .form-group  .btn_block { border-radius: 4px; }
.add_to_cart_sec .stepform_div { padding: 20px; background-color: #252B2B; border-radius: 7px; margin-bottom:30px; } h3 {}
.add_to_cart_sec .cart { padding: 20px; background-color: #252B2B; border-radius: 7px; margin-bottom:30px; }
.add_to_cart_sec .cart .product_description_box ul { padding-left: 15px; }
.add_to_cart_sec .cart table td, .add_to_cart_sec .cart table th { padding: 20px; font-size: 16px; line-height: 28px; font-family: 'Inter', sans-serif; color: #C1C1C1; border: 1px solid rgb(255 255 255 / 16%); }
.add_to_cart_sec .cart table td i{    color: #C1C1C1;}
.add_to_cart_sec .code_form .form-group {display: flex;column-gap: 15px;margin: 0px;}
.add_to_cart_sec .code_form .form-group .btn_green {border-radius: 4px;}
.add_to_cart_sec .cart table   { border: 1px solid rgb(255 255 255 / 16%); }
.add_to_cart_sec .cart .table>:not(:last-child)>:last-child>* { border: 1px solid rgb(255 255 255 / 16%); }
body .add_to_cart_sec .cart table th { white-space: nowrap; }
/* Dashboard chat style starts from here */

.messages_mainCol_break .chats {padding: 20px 0;}
.chat{padding: 16px 8px;}
.chat:hover{background-color: #E5F5FF;}
.chat > a{text-decoration: none;}
.chat .chat_inner_wrapper {display: flex;align-items: center;column-gap: 8px;flex-wrap: wrap;position: relative;}
.chat .chat_inner_wrapper .user_img{width: 45px; height: 45px; overflow: hidden; border-radius: 50%; flex-shrink: 0; border: 1px solid black;}
.chat .chat_inner_wrapper .user_img img{width: 100%; height: 100%; object-fit: cover; object-position: center;}
.chat .chat_inner_wrapper .user_detail_wrapper .name_time_wrapper{display: flex;align-items: center;justify-content: space-between;padding-bottom: 5px;gap: 8px;padding: 0;}
.chat .chat_inner_wrapper .user_detail_wrapper .name_time_wrapper .user_name h6{margin-bottom: 0; font-size: 16px; line-height: 18px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; word-break: break-all}
.chat .chat_inner_wrapper .user_detail_wrapper .name_time_wrapper .time{flex-shrink: 0;}
.chat .chat_inner_wrapper .user_detail_wrapper .name_time_wrapper .time span{font-size: 10px;}
.chat .chat_inner_wrapper .user_detail_wrapper .message_preview p{font-size: 13px; line-height: 15px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; margin-bottom: 0;}

.chat .chat_inner_wrapper  .user_name_img  { width: 100%; }
.chat .chat_inner_wrapper .user_detail_wrapper { width: 75%; }
.chat .chat_inner_wrapper  .user_name_img  { width: 100%; display: flex; align-items: center; padding-left: 50px; column-gap: 10px; }
.chat .chat_inner_wrapper  .user_name_img .user_img { width: 15px; height: 15px; }
.chat .chat_inner_wrapper  .user_name_img  h6 { margin-bottom: 0; font-size: 16px; line-height: 18px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; line-clamp: 1; -webkit-box-orient: vertical; word-break: break-all;}
.chat .chat_inner_wrapper .badge { position: absolute; right: -5px; top: -5px; display: block; background-color: red; border-radius: 50%; width: 10px; height: 10px; }


.inner_section_messages .userChat_details {text-align: center; padding-bottom: 40px;}
.inner_section_messages .userChat_details .user_image {width: 80px; height: 80px; border: 1px solid lightgray; border-radius: 50%; overflow: hidden; margin: 0 auto;}
.inner_section_messages .userChat_details .user_image img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
.inner_section_messages .userChat_details .user_name h5{line-height: 55px; margin-bottom: 0;}
.inner_section_messages .userChat_details .user_description p{font-size: 15px; margin-bottom: 0;}
.inner_section_messages .userChat_details .new_convo_message{margin-top: 12px;}
.inner_section_messages .userChat_details .new_convo_message p{font-size: 12px;}

/* messages */

.messages .bubble {padding: 10px 20px; display: inline-block; background-color: white; position:relative;}
.messages .day {position:relative; text-align: center;}
.messages .day:before{content: ""; width: 100%; height: 2px; background-color: #DFDFDF; display: block; position: absolute; top: 0; left: 0; bottom: 0; margin: auto 0;}
.messages .bubble span{background-color: #F0F5F5; padding: 8px 20px; border-radius: 20px;}

.messages .message .user_name h6 {font-size: 13px;}
.messages .message .image_content_wrapper{display: flex; align-items: flex-start; gap: 15px;}
.messages .message .image_content_wrapper .user_image{width: 50px; height: 50px; overflow: hidden; border-radius: 50%; border: 1px solid gray; flex-shrink: 0;}
.messages .message .image_content_wrapper .user_image img{width: 100%; height: 100%; object-fit: cover; object-position: center;}
.messages .message .image_content_wrapper .text_wrapper .text{padding: 18px 25px; margin-bottom: 10px; background-color: white; display: inline-block;}
.messages .message .image_content_wrapper .text_wrapper .text p{margin-bottom: 0; font-size: 14px;}

.messages .message.received .text {border-radius: 0px 10px 10px 10px;}
.messages .message .image_content_wrapper .text_wrapper .message_time span {font-size: 12px;}

.messages .message.sent .image_content_wrapper{flex-direction: row-reverse;}
.messages .message.sent .user_name h6 {text-align: right;}
.messages .message.sent .text {border-radius: 10px 0 10px 10px; text-align: left;}
.messages .message.sent .image_content_wrapper .text_wrapper .message_time{text-align: right;}
.messages .message.sent .image_content_wrapper .text_wrapper{text-align: end;}

.inner_section_messages .message_input_wrapper {display: flex; align-items: center; box-shadow: 0 5px 12px rgba(0,0,0,0.05); border-radius: 10px; padding-right: 20px; margin-top: 30px;}
.inner_section_messages .message_input_wrapper .message_input{flex: 1;}
.inner_section_messages .message_input_wrapper .message_input input{height: 60px; outline: 0; border: 0;}
.inner_section_messages .message_input_wrapper .message_input input:focus{box-shadow: none;}
.inner_section_messages .message_input_wrapper .send_btn{background-color: #48BBED; width: 40px; height: 40px; border-radius: 50%;}
.inner_section_messages .message_input_wrapper .send_btn a{color: white; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; font-size: 18px; text-decoration: none;}
.inner_section_messages .message_input_wrapper .embeded_link {padding-right: 15px;}
.inner_section_messages .message_input_wrapper .embeded_link a {font-size: 20px;}

/* messages */

/* Dashboard chat style ends here */
.no_Data_found_sec {
    padding: 30px 0px;
    text-align: center;
}

.no_Data_found_sec img {
    width: 80%;
    height: 400px;
    margin:0 auto;
}
.add_more_servers{
    text-align: right;
}