@media (min-width: 768px) {


.fs-35{
    font-size:35px !important;
}
}

.fs-22{
        font-size:22px !important;

}

.f-white{
    color:white !important;
}
.f-bold{
    font-weight:700;
}

.pt-2{
  padding-top:2rem !important;  
}


.mb-3{
    margin-bottom:1rem !important;
}

.mt-5r{
    margin-top:5rem;
}

.t-center{
    text-align:center;
}
.f-black{
    color:#000;
}
.ft{
    display:flex;
    flex-direction:row;
    justify-content:center;
    align-items:center;
}

/*home page banner start*/


.flex-container {
    display: flex;
    flex-direction: column;

}

 @media (min-width: 768px) {
     .flex-container{
          flex-direction: row;
     }
       
    }
.content {
    width: 100%;
   
}

 @media (min-width: 768px) {
        .content {
            width: 50%;
    }
 }

.title {
    font-size: 2rem;
    font-weight: bold;
    color: #ffffff;
    line-height: 2rem;
    padding: 8px;
   
}


 @media (min-width: 1200px) {
     .title{
         font-size: 2.5rem;
        line-height: 3rem;

     }
        
    }

.subtitle {
    font-size: 1rem;
    color: #ffffff;
    font-weight: normal;
    padding-top: 2px;
   
}

 @media (min-width: 1200px) {
        .subtitle{
            font-size: 1.25rem;
    }
 }

.image-container {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
  
}


  @media (min-width: 768px) {
        .image-container{
            width: 50%;
            padding-right:0px;
    }
  }

.image {
    object-fit: cover;
    width: 100%;
}

@media only screen and (min-width: 1700px)  {
    .bannerdesign{
        width:1784px;
            margin-left:-22rem;
                margin-top:-32px;


    }
    
    .bannerdesign .content{
    padding-right:84px;
    padding-left:46px;
    padding-top:89px;
}
}

 @media (max-width: 1200px) {

.bannerdesign{
    margin-left:-15px;
    margin-right:-15px;
    margin-top:-32px;
    
}

.bannerdesign .content{
    padding-left:10px;
    padding-top:10px;
}

}

 @media (min-width: 1800px) {
     .bannerdesign{
           width:1908px;
    margin-left:-26rem;
    margin-top:-35px;
     }
     
     .bannerdesign .content{
    padding-right:10px;
    padding-left:10rem;
}


}

.bannerdesign{
    background-color:#1C2120;
  
}







/*hompage banner end*/

/*home page Browse our Product start*/
 @media (min-width: 1900px) {

.productbox{
    margin-left:7rem;
    margin-right:7rem;
}
}
 @media (min-width: 1200px) {

.mar{
    margin-left:7rem;
        margin-right:7rem;

    margin-bottom:7rem;
}
}



@media (max-width: 1200px) {
.mar {
    margin-left:0 !important;
    margin-right:0 !important;
}

.marr{
    margin-left:0 !important;
    margin-right:0 !important;
}


}
.box {
    padding: 2.5rem;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
    transition: all 0.5s;
    background-color: #1B1B1B;
    color: white;
    border-radius: 8px;
    margin-bottom: 8px;
    height:90%;
}

.samplebox{
    height:19rem;
}

.btn-primary{
    background-color:#ff5533;
    border-color:transparent !important;
}

.see{
    border:1px solid #ff5533;
}

.see:hover{
    background-color:black;
}

.box:hover {
    box-shadow: 0 3px 10px #1B1B1B;
    transform: scale(0.95);
}



.button {
    display: flex;
    border: 1px solid #FF5533;
    background-color:#ff5533;
    color: #ffffff;
    font-size: 1rem;
    font-weight: medium;
    padding: 5px 4px;
    border-radius: 4px;
    outline: none;
    cursor: pointer;
    justify-content: center;
    align-items: center;
    bottom: 45px;
}

.button:hover {
    background-color: #FF5533;
    color: white;
}

a:link {
  text-decoration: none;
}

 .hidden {
    display: none;
}



/*home page Browse our Product end*/


/*footer start*/

#foot {
    background-color: #111827; /* Set the background color for the footer */
}

.footer {
    max-width: 1300px;
    margin: 0 auto;
    padding: 2rem;
}

.grid {
   max-width: 1800px;
  margin: 0 auto;
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    padding-block:2rem;
  margin-inline:2rem;
    font-size:1rem;
}



h2 {
    margin-bottom: 1rem;
    font-size: 1.25rem;
    font-weight: 600;
    color: #FF5533; 
    text-transform: uppercase;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Style the list items in the footer */
li {
    /* margin-bottom: 0.75rem; */
}

/* Style the links in the footer */


/* Change link color on hover */
.under a:hover {
      text-decoration-line: underline;
      color:white;

}

.under a{
    color:white;
}

/* Style the separator line */
hr {
    margin: 20px 0;
    border: 0;
    border-top: 1px solid #555; /* Set the color for the separator line */
}

/* Style the contact information section */
.contact {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}

/* Style the contact links */
.contact a {
    display: flex;
    align-items: center;
    color: #ccc; /* Set the color for the contact links */
    text-decoration: none;
    transition: color 0.3s ease;
}

/* Change contact link color on hover */
.contact a:hover {
    color: #fff; /* Set the hover color for the contact links */
}

/* Style the copyright text */
.copyright {
    text-align: center;
    color: #777; /* Set the color for the copyright text */
    margin-top: 20px;
}

.heads{
    color: #FF5533 !important;
      font-weight: bold !important;

}

.footerwidth{
      max-width: 1300px;

}

.bottomfooter{
    background-color:black;
    padding-top:20px;
    
}

.flexbottom{
    column-gap:20px

}

.language{
    color:white;
    margin-left:-10px;
    border:2px solid white;
}
.language:hover{
    color:white  !important;
}

/*footer end*/


/*home page how can we help today start*/


.colow{
    border-radius:10px;
    width:100%;
    background-color:white;
    padding-top:50px;
    padding-bottom:40px;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    border:2px solid #ff5533ab;
    height:9rem;

}

.colow1{
    border-radius:10px;
    width:100%;
    background-color:white;
    padding-top:50px;
    padding-bottom:40px;
    height:9rem;
    background-color:black;
    color:white;

}

.coloww{
      border-radius:10px;
    width:100%;
    background-color:white;
    padding-top:25px;
    padding-bottom:25px;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    height:8rem;
    margin-bottom:2rem;
}

 @media (min-width: 1200px) {

.coltwo{
    margin-top:7rem;
    margin-bottom:3rem;
}
}

.colow .ps{
    color:black;
    font-weight:600;
    padding-top:11px;
}
.colow1 .ps{
    color:white;
    font-weight:600;
    padding-top:11px;
}

.colow img{
    width:70px;
   
}




.coloww img{
    width:70px;
   
}




.bb{
    color:black;
}

 @media (min-width: 1200px) {

.mar{
    margin-top:3rem;
}
}

/*home page how can we help today end*/

/*home page YOUR ACCOUNT start*/
 @media (max-width: 1200px) {
     .padimg .imgg{
         width:100% ;
     }
}

.accountinfo{
    border-radius:20px;
    padding-top:20px;
    padding-bottom:20px;
}

.bgb{
        background-color:black;

}

.card-accent-midnight-blue1 {
  border-top: 3px solid #2c3e50;
}

.action-icon-btns1 a .ico-container1 {
  margin: 10px auto;
  line-height: 55px;
  font-size: 2.6em;
  text-align: center;
  transition: all 0.3s ease;
}
.action-icon-btns1 a .ico-container1 i {
  color: white;
}
.action-icon-btns1 a:hover {
  color: #ff5533;
}
.action-icon-btns1 a:hover .ico-container1 {
  font-size: 3.4em;
}
.action-icon-btns1 a:hover {
  color: #444;
}
.action-icon-btns1 a:hover .ico-container1 {
  font-size: 3.4em;
}

.colow1 a{
    color:white !important;
}

 @media (min-width: 1200px) {
     .padimg{
    padding-left:6rem;
}

}



.br-20{
    border-radius:20px;
}

/*home page  YOUR ACCOUNT end*/


/*contact us page start*/
.contain{
    display:flex;
    justify-content:center;
    margin-top:5rem;
}
.flex-container {
    display: flex;
}

 @media (min-width: 1200px) {

.left-panel {
    width: 40%;
    background-color: #1B1B1B;
    padding: 2rem;
    padding-top:7rem;
}
}



.left-panel {
    background-color: #1B1B1B;
}




 @media (min-width: 1200px) {
     .right-panel{
    width: 60%;
        padding: 2rem;

}

 }

.right-panel {
    background-color: #374151;
    padding: 1rem;
}
.content {
    width: 90%;
    margin: auto;
                padding:1rem;

}
.heading {
    font-size: 2.5rem;
    color: #fff;
    font-weight: bold;
}
.text {
    color: #fff;
    font-size: 1rem;
    line-height: 1.5;
}
.contact-info {
    display: flex;
    align-items: center;
}
.icon img {
    width: 30px;
    height: 30px;
    margin-right: 10px;
}
.info {
    color: #fff;
    font-size: 1rem;
}
.address {
    font-size: 1rem;
    line-height: 1.5;
    margin-top: 2rem;
}
.right-panel form {
    width: 100%;
}
.form-heading {
    font-size: 2.5rem;
    color: #fff;
    font-weight: bold;
}
.form-row {
    display: flex;
    margin-bottom: 1rem;
}
.half-width {
    flex: 1;
    margin-right: 1rem;
}
.form-group {
    width: 100%;
}

/*.form-group .btn{*/
/*    background-color:#E8F0FE;*/
    
/*}*/
.label {
    color: #fff;
    font-size: 0.875rem;
    font-weight: bold;
    margin-bottom: 0.5rem;
}
.input,
.textarea {
    width: 100%;
    padding: 0.5rem;
    font-size: 1rem;
    border: 1px solid #707070;
    border-radius: 0.25rem;
    margin-bottom: 1rem;
}
.textarea {
    resize: vertical;
}
.recaptcha-container {
    margin-bottom: 1rem;
}
.submit-button {
    background-color: #FF5533;
    color: #fff;
    padding: 0.5rem 1rem;
    border: none;
    border-radius: 0.25rem;
    font-size: 1rem;
    cursor: pointer;
}
.submit-button:hover {
    background-color: #316DA5;
}

.captc{
    margin-left:14px;
}
/*contact us page end*/



/*login form start*/
.input-group-append{
    background-color:#E8F0FE;
}

.contai{
    display: flex;
    flex-direction: column;
    margin-top:5rem;
        margin-bottom:5rem;

}
.contai form {
background-color: #FFFFFF;
display: flex;
justify-content: center;
flex-direction: column;
padding: 50px 50px;
text-align: center;
}

.contai input {
background-color: #eee;
border: none;
padding: 12px 15px;
width: 100%;
}

.contai #wcheck{
    width:17px !important;
}
.contai {
background-color: #fff;
border-radius: 10px;
  box-shadow: 0 14px 28px rgba(0,0,0,0.25),
0 10px 10px rgba(0,0,0,0.22);
position: relative;
overflow: hidden;
max-width: 100%;
min-height: 700px;
}

.contai .form-container {
position: absolute;
top: 0;
height: 100%;
transition: all 0.6s ease-in-out;
}

@media (min-width: 1200px) {

.contai .sign-in-container {
left: 0;
width: 50%;
z-index: 2;
}
}



.contai .container.right-panel-active .sign-in-container {
transform: translateX(100%);
}

.contai .sign-up-container {
left: 0;
width: 50%;
opacity: 0;
z-index: 1;
}

.contai .container.right-panel-active .sign-up-container {
transform: translateX(100%);
opacity: 1;
z-index: 5;
animation: show 0.6s;
}

@keyframes show {
0%, 49.99% {
opacity: 0;
z-index: 1;
}

50%, 100% {
opacity: 1;
z-index: 5;
}
}

.contai .overlay-container {
position: absolute;
top: 0;
left: 50%;
width: 50%;
height: 100%;
overflow: hidden;
transition: transform 0.6s ease-in-out;
/*z-index: 100;*/
}

.contai .container.right-panel-active .overlay-container{
transform: translateX(-100%);
}

.contai .overlay {
background: #ff5533;
background-image :url(https://www.idatam.com/assets/images/idatam-hosting-banner.webp);
background-repeat: no-repeat;
background-size: cover;
background-position: 0 0;
color: #FFFFFF;
position: relative;
left: -100%;
height: 100%;
width: 200%;
  transform: translateX(0);
transition: transform 0.6s ease-in-out;
}

/* This creates the dark tint over the background image */
.contai .overlay-panel::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6); /* Adjust 0.5 to make it darker or lighter */
    z-index: -1; /* Places the overlay behind the text */
}

/* Ensure the text stays on top of the new overlay */
.contai .overlay-panel h1, 
.contai .overlay-panel p, 
.contai .overlay-panel button {
    position: relative;
    z-index: 1;
}


@media screen and (max-width:731px) {
    .contai .overlay {
        display: none;
    }
}
.contai .container.right-panel-active .overlay {
  transform: translateX(50%);
}

.contai .overlay-panel {
position: absolute;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
padding: 0 40px;
text-align: center;
top: 0;
height: 100%;
width: 50%;
transform: translateX(0);
transition: transform 0.6s ease-in-out;
}

.contai .overlay-left {
transform: translateX(-20%);
}

.contai .container.right-panel-active .overlay-left {
transform: translateX(0);
}

.contai .overlay-right {
right: 0;
transform: translateX(0);
}

.contai .container.right-panel-active .overlay-right {
transform: translateX(20%);
}

.contai .social-container {
margin: 20px 0;
}

.contai .social-container a {
border: 1px solid #DDDDDD;
border-radius: 50%;
display: inline-flex;
justify-content: center;
align-items: center;
margin: 0 5px;
height: 40px;
width: 40px;
}




.contai button {
	border-radius: 10px;
	border: 1px solid #FF4B2B;
	background-color: #FF4B2B;
	color: #FFFFFF;
	font-size: 12px;
	font-weight: bold;
	padding: 12px 45px;
	letter-spacing: 1px;
	text-transform: uppercase;
	transition: transform 80ms ease-in;
}

.contai button:active {
	transform: scale(0.95);
}

.contai button:focus {
	outline: none;
}

.contai button.ghost {
	background-color: transparent;
	border-color: #FFFFFF;
}

.fbold{
    font-weight:700 !important;
}

.form-check-input{
    position: absolute;
    margin-top: 0.3rem;
    margin-left: -1.25rem;
}

.card-footer{
    background-color:white !important;
    border:none !important;
}
/*login form end*/

/*registration form start*/

@media (min-width: 1700px) {
    .widthset{
    width:55rem;
}

.paddingsix{
    padding-left:5rem !important;
    padding-right:5rem !important;
}


}


#borderwhite{
    border:none !important;
}

.form-control{
    border-radius:1px !important;
}
#registration .field, #registration .form-control{
    border:1px solid #0000005e !important;
    border-radius:10px !important;
}

.primary-content .card, .primary-content .mc-promo-login, .primary-content .mc-promo-manage{
    margin-bottom:0;
}

.mc-promo-login .panel-heading .primary-content h3, .mc-promo-manage .panel-heading .primary-content h3, .primary-content .card-title, .primary-content .mc-promo-login .panel-heading h3, .primary-content .mc-promo-manage .panel-heading h3, .primary-content .promo-container .headernew h3, .promo-container .headernew .primary-content h3{
 text-align:center !important;   
}
.uncolor{
text-decoration: underline;
 text-decoration-color: #ff5533;
 font-weight:800;
    
}

.mc-promo-login .panel-heading .primary-content h3, .mc-promo-manage .panel-heading .primary-content h3, .primary-content .card-title, .primary-content .mc-promo-login .panel-heading h3, .primary-content .mc-promo-manage .panel-heading h3, .primary-content .promo-container .headernew h3, .promo-container .headernew .primary-content h3{
    font-size:29px;
}


.bordercolo{
    border-color:#ff5533 !important;
}
/*registration form end*/


/*header start*/

/*=============== GOOGLE FONTS ===============*/
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600&display=swap");

/*=============== VARIABLES CSS ===============*/
:root {
  --header-height: 3.5rem;

  /*========== Colors ==========*/
  /*Color mode HSL(hue, saturation, lightness)*/
  --black-color: #ffff;
  --black-color-light: #ffff;
  --black-color-lighten: #ffff;
  --white-color: #0000;


  /*========== Font and typography ==========*/
  /*.5rem = 8px | 1rem = 16px ...*/
  --body-font: "Montserrat", sans-serif;
  --normal-font-size: .938rem;

  /*========== Font weight ==========*/
  --font-regular: 400;
  --font-semi-bold: 600;

  /*========== z index ==========*/
  --z-tooltip: 10;
  --z-fixed: 100;
}
  .dropdown__menu{
        font-family: var(--body-font) !important;

  }

@media (min-width: 1280px) {
  .container{
    max-width: 1140px;


  }
}

@media (min-width: 1900px){
  .container{
    max-width: 1760px !important;


  }
  
 
}

@media only screen and (min-width: 600px) and (max-width: 1890px) {
     .container{
    max-width: 1460px !important;


  }
    
}
@media (max-width: 600px){

 .navbar{
      padding:0 !important;
  }
}

/*========== Responsive typography ==========*/
@media screen and (min-width: 1024px) {
  :root {
    --normal-font-size: 1rem;
  }
}

/*=============== BASE ===============*/
* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

.headernew {
  font-family: var(--body-font);
  font-size: var(--normal-font-size);
}
.fontchange{
  font-family: var(--body-font);

}

ul {
  list-style: none;
  /* Color highlighting when pressed on mobile devices */
  /*-webkit-tap-highlight-color: transparent;*/
}

a {
  text-decoration: none;
}

/*=============== REUSABLE CSS CLASSES ===============*/


/*=============== HEADER ===============*/
@media (min-width: 1900px){
  .headernew {

  /*padding-inline: 32px;*/
  /*padding-inline: 192px;*/
    padding-inline: 186px;

  }


}

.header{
    margin-top:5rem;
}
.headernew {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background-color: var(--black-color);
  box-shadow: 0 2px 16px hsla(220, 32%, 8%, .3);
  z-index: var(--z-fixed);
}

/*=============== NAV ===============*/
.nav {
  height: var(--header-height);
}

.nav__logo, 
.nav__burger, 
.nav__close {
  color: #000000 !important;
}

.nav__data {
  height: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.nav__logo {
  display: inline-flex;
  align-items: center;
  column-gap: .25rem;
  font-weight: var(--font-semi-bold);
  /* Color highlighting when pressed on mobile devices */
  /*-webkit-tap-highlight-color: transparent;*/
}

.nav__logo i {
  font-weight: initial;
  font-size: 1.25rem;
}

.nav__toggle {
  position: relative;
  width: 32px;
  height: 32px;
  padding-right:63px;
}

.nav__burger, 
.nav__close {
  position: absolute;
  width: max-content;
  height: max-content;
  inset: 0;
  margin: auto;
  font-size: 1.25rem;
  cursor: pointer;
  transition: opacity .1s, transform .4s;
}

.nav__close {
  opacity: 0;
}

/* Navigation for mobile devices */
@media screen and (max-width: 1350px) {
    .nav__data{
        width:100%;
    }
  .nav__menu {
    position: absolute;
    left: 0;
    top: 2.5rem;
    width: 100%;
    height: calc(100vh - 3.5rem);
    overflow: auto;
    pointer-events: none;
    opacity: 0;
    transition: top .4s, opacity .3s;
  }
  
  .nav__menu::-webkit-scrollbar {
    width: 0;
  }
  .nav__list {
    background-color: var(--black-color);
    padding-top: 1rem;
  }
}

@media (max-width: 1536px){
  .nav__link {
    font-size:small;
  }
}
.nav__link {
  background-color: var(--black-color);
  font-weight: var(--font-semi-bold);
  padding: 1.25rem 1.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background-color .3s;
}

.nav__link:hover {
  background-color: var(--black-color-light);
}

/* Show menu */
.show-menu {
  opacity: 1;
  top: 3.5rem;
  pointer-events: initial;
}

/* Show icon */
.show-icon .nav__burger {
  opacity: 0;
  transform: rotate(90deg);
}
.show-icon .nav__close {
  opacity: 1;
  transform: rotate(90deg);
}

/*=============== DROPDOWN ===============*/
.dropdown__item {
  cursor: pointer;
}

.dropdown__arrow {
  font-size: 1.25rem;
  font-weight: initial;
  transition: transform .4s;
}

.dropdown__link, 
.dropdown__sublink {
    color:black ;
      font-family: var(--body-font) !important;

  padding: 1.25rem 1.25rem 0.3rem 2.5rem;
  background-color: var(--black-color-light);
  display: flex;
  align-items: center;
  column-gap: .5rem;
  font-weight: var(--font-semi-bold);
  transition: background-color .3s;
}

.dropdown__link i, 
.dropdown__sublink i {
  font-size: 1.25rem;
  font-weight: initial;
}

.dropdown__link:hover, 
.dropdown__sublink:hover {
  background-color: var(--black-color);
}
@media (max-width: 1536px){
  .dropdown__menu, 
  .dropdown__submenu {
    font-size: small;
  }
}

.dropdown__menu, 
.dropdown__submenu {
  max-height: 0;
  overflow: hidden;
  transition: max-height .4s ease-out;
}

/* Show dropdown menu & submenu */
.dropdown__item:hover .dropdown__menu, 
.dropdown__subitem:hover > .dropdown__submenu {
  max-height: 1000px;
  transition: max-height .4s ease-in;
}

/* Rotate dropdown icon */
.dropdown__item:hover .dropdown__arrow {
  transform: rotate(180deg);
}

/*=============== DROPDOWN SUBMENU ===============*/
.dropdown__add {
  margin-left: auto;
}

.dropdown__sublink {
  background-color: var(--black-color-lighten);
}

/*=============== BREAKPOINTS ===============*/
/* For small devices */

/*@media only screen and (min-width: 1536px) and (max-width: 1800px) {*/
/*  .container {*/
/*    padding-inline: 2rem !important;*/
/*  }*/
/*}*/
@media screen and (max-width: 340px) {


  .nav__link {
    padding-inline: 1rem;
  }
}


@media screen and (max-width: 1280px){
    .nav{
        max-width:100%;
    }
}
/* For large devices */
@media screen and (min-width: 1350px) {
  .container {
    margin-inline: auto;
  }

  .nav {
    height: calc(var(--header-height) + 2rem);
    display: flex;
    justify-content: space-between;
  }
  .nav__toggle {
    display: none;
  }
  .nav__list {
    height: 100%;
    display: flex;
    column-gap: 2.5rem;
  }
  .nav__link {
    height: 100%;
    padding: 0;
    justify-content: initial;
    column-gap: .25rem;
  }
  .nav__link:hover {
    background-color: transparent;
  }

  .dropdown__item, 
  .dropdown__subitem {
    position: relative;
  }
}

@media screen and (max-width: 1456px){
  .serviceBox .title{
    font-size: 16px;
    text-transform: uppercase;
    word-spacing: normal;
  }
}


  @media only screen and (min-width: 1536px) and (max-width: 1800px) {

    .dropdown__menu,   .dropdown__submenu
    {
      width:16rem !important;

    }

  }

  .dropdown__menu, 
  .dropdown__submenu {
      background-color:white;
    max-height: initial;
    width:20rem;
    overflow: initial;
    position: absolute;
    left: 0;
    top: 6rem;
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s, top .3s;
  }

  .dropdown__link, 
  .dropdown__sublink {
    padding-inline: 0.5rem 3.5rem;
  }

  .dropdown__subitem .dropdown__link {
    padding-inline: 1rem;
  }

  .dropdown__submenu {
    position: absolute;
    left: 100%;
    top: .5rem;
  }

  /* Show dropdown menu */
  .dropdown__item:hover .dropdown__menu {
    opacity: 1;
    top: 3.5rem;
    pointer-events: initial;
    transition: top .3s;
  }
  .dropdown__link:hover ,.dropdown__sublink:hover {
color: #034c91;
transition: .3s;

  }

  /* Show dropdown submenu */
  .dropdown__subitem:hover > .dropdown__submenu {
    opacity: 1;
    top: 0;
    pointer-events: initial;
    transition: top .3s;
  }


header.header .main-navbar-wrapper .navbar-collapse{
    font-weight:600;
}
header.header .search{
    border:1px solid #000 !important;
}


.navbar-expand-xl .navbar-nav li{
    margin-bottom:0 !important;
}

header.header .toolbar .nav-link{
    border:1.5px solid #ff5533 !important;
    color:black !important;
}

header.header .navbar a{
    color:black !important;
}

header.header .search .btn{
    color:#336699;
}
/*header end*/

.master-breadcrumb{
    background: #336699;  
    background: -webkit-linear-gradient(to left, #8f94fb, #4e54c8);  
            margin-top:3rem;
            padding-top:2rem;


}


@media (min-width: 1900px) {
    .master-breadcrumb{
        margin-top:3rem;
	height:100px !important; 

}
    .port{

    padding-top:0 !important;
    }


}

@media (min-width: 1900px) {
    #conta{
    display:flex !important;
    justify-content:space-between;
    max-width:1700px;
    height:45%;
    align-items: center; 
}
}

@media (min-width: 1200px) {
    #conta{
    display:flex !important;
    justify-content:space-between;
    max-width:1700px;
    margin: 10px !important;

}

}
@media (max-width: 1199px) {
    #conta{
    display:flex !important;
    justify-content:space-between;
    max-width:1000px !important;

}
}

#nav{
    /* display:block !important; */
}

@media (max-width: 1100px) {
    #conta{
    display:flex !important;
    flex-direction:column;

 
}
}


@media (min-width: 1290px) {
    .master-breadcrumb{
                margin-top:3rem !important;

}

.form-inline .custom-select, .form-inline .input-group{
    width:18rem;
}



}

.far{
    color:white;
}
@media (min-width: 770px) {
    .master-breadcrumb{
        margin-top:3rem;
    }
}
@media (max-width: 770px) {

.dropdown-menu{
    width:22rem !important;
}
.dropdown-item h6{
        font-size:0.9rem !important;

}
.dropdown-item{
    padding:.25rem 0.4rem !important;
}
}

.badge-info{
    color:#ff5533;
    background-color:white;
}
@media (min-width: 770px) {
    .master-breadcrumb{
        margin-top:3rem !important;
        	height:17vh;


}
}

@media (max-width: 549px) {
        .master-breadcrumb{
        margin-top:3rem !important;
        	height:25vh;


}
.port {
    padding-top:2rem !important;
}
}
@media only screen and (min-width: 550px) and (max-width: 450px) {
     .master-breadcrumb{
        	height:50vh;

}
}

.circles{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    	height:100%;

    overflow: hidden;
}

.circles li{
    position: absolute;
    display: block;
    list-style: none;
    width: 20px;
    height: 20px;
    background: rgba(255, 255, 255, 0.2);
    animation: animate 20s linear infinite;
    bottom: -150px;
    
}

.circles li:nth-child(1){
    left: 25%;
    width: 80px;
    height: 80px;
    animation-delay: 0s;
}


.circles li:nth-child(2){
    left: 10%;
    width: 20px;
    height: 20px;
    animation-delay: 2s;
    animation-duration: 12s;
}

.circles li:nth-child(3){
    left: 70%;
    width: 20px;
    height: 20px;
    animation-delay: 4s;
}

.circles li:nth-child(4){
    left: 40%;
    width: 60px;
    height: 60px;
    animation-delay: 0s;
    animation-duration: 18s;
}

.circles li:nth-child(5){
    left: 65%;
    width: 20px;
    height: 20px;
    animation-delay: 0s;
}

.circles li:nth-child(6){
    left: 75%;
    width: 110px;
    height: 110px;
    animation-delay: 3s;
}

.circles li:nth-child(7){
    left: 35%;
    width: 150px;
    height: 150px;
    animation-delay: 7s;
}

.circles li:nth-child(8){
    left: 50%;
    width: 25px;
    height: 25px;
    animation-delay: 15s;
    animation-duration: 45s;
}

.circles li:nth-child(9){
    left: 20%;
    width: 15px;
    height: 15px;
    animation-delay: 2s;
    animation-duration: 35s;
}

.circles li:nth-child(10){
    left: 85%;
    width: 150px;
    height: 150px;
    animation-delay: 0s;
    animation-duration: 11s;
}



@keyframes animate {

    0%{
        transform: translateY(0) rotate(0deg);
        opacity: 1;
        border-radius: 0;
    }

    100%{
        transform: translateY(-1000px) rotate(720deg);
        opacity: 0;
        border-radius: 50%;
    }

}
.breadcrumb{
    
    background-color:transparent;
    

}
.breadcrumb li{
    padding-top:5px !important;
}
.port .breadcrumb-item.active{
    color:white;
    font-weight:600;
    font-size: 40px;
    display:flex;
}
 .breadcrumb-item.active{
    color:white;
    font-weight:600;
    font-size: large;
}
 .breadcrumb-item a{
    color:white;
    font-weight:300;
    font-size: large;
}

.port .breadcrumb-item{
    display:none;
}

.port .breadcrumb-item+.breadcrumb-item::before{
    color:#336699 !important;
}
.port{
    display:flex;
    justify-content:center;
    align-items:center;
    color:white !important;
    font-size:30px;
    text-align:center;
    font-weight:600;
    padding-top:4rem;
    
}




/*features*/


.cont_principal {
 
  width:22%;
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e0e8f5',GradientType=0 );
}

.cont_menu {
  width: 320px;
  flex-direction: column;
}

.cont_titulo_menu {
  position: relative;
  float: left;
  display: flex;
  width: 60%;
  overflow: hidden;
  background-color: white;
  box-shadow: 0px 7px 30px -12px rgba(0, 0, 0, 0.5);
  border-radius: 3px;

  justify-content:center;
  align-items:center;
  border-radius:1px;
}

.cont_icon_menu {
  display: flex;
  position: relative;
  float: right;
  align-self: center;
  justify-content: center;
  align-items: center;
}
.cont_icon_menu > img {
  width: 32px;
  z-index: 2;
  position: relative;
}
.cont_titulo {
  position: relative;
  float: left;
 padding-top:9px;
 padding-bottom:3px;
  color: black;
  column-gap:9px;
  align-items:center;
}

.cont_titulo_menu:hover{
    cursor:pointer;
}
.cont_titulo h4 {
      font-weight:600;
font-size:1rem !important;
}

.cont_drobpdown_menu {
  position: relative;
  float: left;
  width: 60%;
  background-color: black;
  box-shadow: 0px 2px 20px -2px rgba(0, 0, 0, 0.3);
  margin-top: 10px;
  border-radius: 3px;
  opacity: 1;
  transition: opacity 500ms;
  color:white;

    font-weight:600;
    z-index:100;
}
.cont_drobpdown_menu ul > li {
  list-style: none;
  margin-left: -3px;
 
  border-left: 5px solid #eee;
  width: 100%;
  display: block;
  transition: all 500ms;
}
.cont_drobpdown_menu ul > li:hover {
  border-left: 5px solid #6992fe;
}
.cont_drobpdown_menu ul > li:hover > a {
  color: #ff5533;
}

.cont_drobpdown_menu ul > li:nth-child(2) {
  border: none;
}
.cont_drobpdown_menu ul > li > a {
  position: relative;
  display: block;
  width: 90%;
 
  text-decoration: none;
  color: #c4d0de;
}
.cont_drobpdown_menu ul > li > hr {
  width: 100%;
  height: 0px;
  color: #123455;
  background-color: #123455;
  border: 1px solid #eee;
}

.cont_drobpdown_menu.active ul > li {
}

.cont_icon_trg {
  position: relative;
  float: left;
  aling-self:start;
  margin-bottom: -30px;
  z-index: 1;
  left: 10px;
  transform: translate(0px, 10px);
  transition: all 0.5s;
}

.disable {
    display:none;
  transition: all 0.5s;
  opacity: 0;
  transform: translate(0px, 10px);
}

.disable > ul > li {
  transform: translate(0px, 10px);
  opacity: 0;
}

.active {
  opacity: 1;
  transform: translate(0px, 0px);
}

.active > ul > li {
  transform: translate(0px, 0px);
  opacity: 1;
}



/*header search knowledge*/

.input-group-append, .input-group-prepend{
    display:block;

}

.navbar .container, .navbar .container-fluid, .navbar .container-lg, .navbar .container-md, .navbar .container-sm, .navbar .container-xl{
    align-items:baseline !important;
    column-gap:23px;
}

.dropdown-menu.show{
    transform:matrix(1, 0, 0, 1, 0, 0) !important;
}
.dropdown-toggle{
    background-color:white;
    width:10rem;
    padding-top:5px;
    padding-bottom:5px;
    font-weight:600;
}
.button-1 {
  background-color: white;
  border-radius: 1px;
  border-style: none;
  box-sizing: border-box;
  color: #ff5533;
  cursor: pointer;
  display: inline-block;
  font-family: "Haas Grot Text R Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 17px;
  font-weight: 600;
  height: 40px;
  line-height: 20px;
  list-style: none;
  margin: 0;
  outline: none;
  padding: 10px 24px;
  position: relative;
  text-align: center;
  text-decoration: none;
  transition: color 100ms;
  vertical-align: baseline;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  column-gap:8px;
}

.button-1:hover,
.button-1:focus {
  background-color: black;
  color:white;
}

.dropdown-toggle::after{
    content:none !important;
}

.cont_titulo i{
    
    padding-bottom:4px;
}

.button-1 i{
padding-bottom:5px;    
}

.dropdown-menu{
    height:20rem;
overflow-y: scroll;
margin-top:3rem;
z-index:100;
top:auto !important;
left:auto !important;

}

.g-billing-accounts-heading-dropdown{
    display:flex;
    justify-content: center;
    margin-top: 30px;
}

@media (min-width: 1900px) {
    .master-breadcrumb{
    margin-top:75px !important;
}
}



/*.dropdown-menu.show{*/
/*    left:46% !important;*/
/*    top:46px !important;*/
/*}*/

@media (min-width: 768px) {

.cf{
column-gap:24px;
    
}
}

@media (max-width: 768px) {
    .button-1{
        margin-top:3px;
    }
    .cont_titulo_menu{
        margin-top:3px;
    } 

.cf{
    display:block !important;
}
.navbar .container, .navbar .container-fluid, .navbar .container-lg, .navbar .container-md, .navbar .container-sm, .navbar .container-xl{
    display:block !important;

}
.input-group{
    width:267px;
}

.cont_menu{
    width:266px !important;
}

.navbar-nav {
    width:59px !important;
}
    
}

.navbar-collapse{
    align-items:normal !important;
}

.form-inline{
        align-items:normal !important;

}




.serviceBox{
    color: #db7100;
    font-family: 'Zen Maru Gothic', sans-serif;
    text-align: center;
    padding: 25px 10px 0;
    position: relative;
    z-index: 1;
}
.serviceBox:before{
    content: "";
    height: 180px;
    width: 180px;
    border: 2px dashed #db7100;
    border-radius: 50%;
    transform: translateX(-50%);
    position: absolute;
    top: 0;
    left: 50%;
    z-index: -1;
}
.serviceBox .title{
    color: #fff;
    background-color: #db7100;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 4px 10px 6px;
    margin: 0 -10px 5px;
    display: inline-block;
}
.serviceBox .service-icon{
    font-size: 45px;
    margin: 0 0 70px;
}   
.serviceBox .description{
    color: #555;
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
}
.serviceBox.gray{ color: #5A696E; }
.serviceBox.gray:before{ border-color: #5A696E; }
.serviceBox.gray .title{ background-color: #5A696E; }
.serviceBox.orange{ color: #6c757d; }
.serviceBox.orange:before{ border-color: #6c757d; }
.serviceBox.orange .title{ background-color: #6c757d; }
.serviceBox.purple{ color: #8D4B7F; }
.serviceBox.purple:before{ border-color: #8D4B7F; }
.serviceBox.purple .title{ background-color: #8D4B7F; }
@media only screen and (max-width: 990px){
    .serviceBox{ margin: 0 0 30px; }
}


/*how can we help section start*/



.serviceBox{
    color: #db7100;
    font-family: 'Zen Maru Gothic', sans-serif;
    text-align: center;
    padding: 25px 10px 0;
    position: relative;
    z-index: 1;
}
.serviceBox:before{
    content: "";
    height: 180px;
    width: 180px;
    border: 2px dashed #db7100;
    border-radius: 50%;
    transform: translateX(-50%);
    position: absolute;
    top: 0;
    left: 50%;
    z-index: -1;
}
.serviceBox .title{
    color: #fff;
    background-color: #db7100;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 4px 10px 6px;
    margin: 0 -10px 5px;
    display: inline-block;
    width:-webkit-fill-available;
}
.serviceBox .service-icon{
    font-size: 45px;
    margin: 0 0 70px;
}   
.serviceBox .description{
    color: #555;
    font-size: 16px;
    font-weight: 500;
    line-height: 23px;
}
.serviceBox.gray{ color: #ff5533; }
.serviceBox.gray:before{ border-color: #ff5533; }
.serviceBox.gray .title{ background-color: #ff5533; }
.serviceBox.pink{ color: #ff5533;}
.serviceBox.pink:before{ border-color: #FF5533; }
.serviceBox.pink .title{ background-color: #FF5533; }
.serviceBox.purple{ color: #006C9C; }
.serviceBox.purple:before{ border-color: #006C9C; }
.serviceBox.purple .title{ background-color: #006C9C; }

.serviceBox.black{ color: #000000; }
.serviceBox.black:before{ border-color: #000000; }
.serviceBox.black .title{ background-color: #000000; }
@media only screen and (max-width: 990px){
    .serviceBox{ margin: 0 0 30px; }
}

.colfix{
    justify-content:center;
    margin-top:-1.1rem;
        background: white;
    border-bottom-left-radius: 45px;
        border-bottom-right-radius: 45px;

    padding-top: 3rem;
    padding-left: 2rem;
        padding-right: 2rem;

}


/*how can we help section end*/




/*pricing table*/
@media only screen and (min-width: 1900px){
    .marginfix {
    margin-left:12rem;
    margin-right:12rem;
}
}

@media only screen and (max-width: 1800px){
    .marginfix {
    margin-left:5rem;
    margin-right:5rem;
}
}

.pricing-table {
	background: #fff;
	box-shadow: 0px 1px 10px -6px rgba(0, 0, 0, .15);
	padding: 2rem;
	border-radius: 15px;
	transition: .3s;
	border:3px solid #3366998a;
}

.pricing-table:hover {
	box-shadow: 0px 1px 10px -4px rgba(0, 0, 0, .15);
}

.pricing-table .pricing-label {
	border-radius: 2px;
	padding: .25rem 1rem;
	margin-bottom: 1rem;
	display: inline-block;
	font-size: 21px;
	font-weight: 500;
}

.pricing-table h2 {
	color: #3b3b3b;
	font-size: 24px;
	font-weight: 500;
}

.pricing-table h5 {
	color: #B3B3B3;
	font-size: 14px;
	font-weight: 400;
}

.pricing-table .pricing-features {
	margin-top: 2rem;
}

.pricing-table .pricing-features .feature {
	font-size: 16px;
	margin: .5rem 0;
	color: #5b5b5b;
}

.pricing-table .pricing-features .feature span {
	display: inline-block;
	float: right;
	color: #3b3b3b;
	font-weight: 500;
}

.pricing-table 	.price-tag {
	margin-top: 2rem;
	text-align: center;
	font-weight: 500;
}

.pricing-table .price-tag .symbol {
	font-size: 24px;
}

.pricing-table .price-tag .amount {
	letter-spacing: -2px;
	font-size: 64px;
}

.pricing-table .price-tag .after {
	color: #3b3b3b;
	font-weight: 500;
}

.pricing-table .price-button {
	display: block;
	color: #fff;
	margin-top: 2rem;
	padding: .75rem;
	border-radius: 2px;
	text-align: center;
	font-weight: 500;
	transition: .3s;
}

.pricing-table .price-button:hover {
	text-decoration: none;
}

.purple .pricing-label {

	
    background: #3693;
    color: #369;
}

.purple .price-tag {
	color: #369;
}

.purple .price-button {
	background: #369;
}
.gray .price-button{
    	background: #ff5533;

}

.gray .price-button:hover{
    	background: black;

}
.gray .price-tag{
    color:#ff5533;
}
.gray .pricing-label{
    background:#ff553329;
        color:#ff5533;

}
.purple .price-button:hover {
	background: black;
}

.turquoise .pricing-label {
	background: #b9edee;
	color: #44cdd2;
}

.turquoise .price-tag {
	color: #44cdd2;
}

.turquoise .price-button {
	background: #44cdd2;
}

.turquoise .price-button:hover {
	background: #2dbcc4;
}

.red .pricing-label {
	background: #ffc4c4;
	color: #ff5e5e;
}

.red .price-tag {
	color: #ff5e5e;
}

.red .price-button {
	background: #ff5e5e;
}

.red .price-button:hover {
	background: #f23c3c;
}

.fa-check-circle{
    color:#369 ;
    padding-right:5px;
}

.gray .fa-check-circle{
    color:#ff5533 ;
    padding-right:5px;
}

#gray {
    border:3px solid #ff553382 !important;
} 



/*product page start*/

#order-standard_cart .products .product{
    background-color:#33669933 !important;
    border:2px solid #33669952 !important;
}

#order-standard_cart .products .product header{
    border-radius:0 !important;
    text-align:center;
}


#order-standard_cart .products .product header span{
    font-weight:600 !important;
}

#order-standard_cart .products .product div.product-desc{
    font-size:0.8rem !important;
}

.btn-success{
    background-color:black !important;
    border-color:black !important;
    font-weight:600 !important;
}


#order-standard_cart .products .product div.product-pricing{
    font-weight:600 !important;
}




.pricing-table .price-tag .cards{
    font-size:28px !important;
}


.pricing-table .pricing-features .fontchange{
    font-size:14px !important;
}

.billcard{
    position:relative;
    height:100% !important;
    display:flex;
    flex-direction:column;

}

.billcard .price-tag{
    margin-top:1rem !important;
}

.product-description{
    margin-top:2rem !important;
}

.card-header{
    background-color:#000000 !important;
    color:#ffffff !important;
}

.card-header:first-child{
    border-radius:20px 20px 0 0 !important;
}

.card, .mc-promo-login, .mc-promo-manage{
    background-color:transparent;
    border:0 !important;
}

.sidebar .list-group{
    font-size:0.9rem;
}

#order-standard_cart .font-size-36{
    font-size:32px !important;
    color:#ffffff !important;
    padding-bottom:20px;
    padding-top:20px;
    font-weight:700;
    text-align:center;
}

.header-lined{
    background-color:black;
    border-radius:20px 20px 0 0;
    
}
/*product page end*/

/*configureproduct.tpl start*/

.productcart{
    background-color:#ffffff;
   
margin-top:-8px;
border:1px solid #00000045;
border-radius:0 0 20px 20px;
}

@media only screen and (min-width: 1000px){
    .productcart{
         padding:50px;
    margin-left:1px;
    margin-right:1px;
    }
    
    
    
}


@media only screen and (min-width: 1900px){
    .productcart{
         padding:30px;
    margin-left:1px;
    margin-right:1px;
    }
    
    #order-standard_cart .secondary-cart-sidebar{
    width:33% !important;
}
    
}
@media only screen and (max-width: 1000px){
#order-standard_cart .order-summary{
    margin-top:2rem !important;
}
    
    
}
.checktitle{
    font-weight: 600;
    text-align: center;
    background-color: #ff5533;
    padding: 10px;
    color: #fff;
    font-size: 19px;
    text-transform: uppercase;
}

#order-standard_cart .secondary-cart-body{
    margin-top: 0px;
    background-color: #E9E9E9;
    border-radius: 5px;
    margin-left:13px;
    border:1px solid #ccc;
    width:63% !important;
    padding: 20px;
}



#order-standard_cart .field-container{
    margin:0 0 30px 12px !important;
}



#order-standard_cart .product-info .product-title{
    font-size: 1.6em;
    font-weight: 600;
}

.pdescription{
    font-size:13px;
}

.alert{
    padding:0 0 0 12px !important;
}

.alert-warning{
    background-color:none !important;
    border-color:none !important;
        display: flex;
    justify-content: center;
    align-items: center;

}

#order-standard_cart .info-text-sm{
    text-align:left !important;
}

#order-standard_cart .product-info{
    background-color:transparent !important;
    border:none !important;
}

#order-standard_cart label, #order-standard_cart p.domain-renewal-desc, .service-renewals .div-renewal-period-label{
    color:#000000 !important;
    font-weight:600 !important;
}

.alert-warning{
    color:#bf1212 !important;
        background-color:transparent !important;
        border:none !important;

}

.alert-warning .alert-link{
        color:#bf1212 !important;
text-decoration:underline !important;
}

#order-standard_cart .order-summary{
    background-color:#ff5533 !important;
}

#order-standard_cart .summary-container{
    background-color:#e9e9e9 !important;
    font-size:0.85rem !important;
}

.orderSummary.btn-primary{
    border-color:none !important;
}
#order-standard_cart .order-summary .product-group{
    font-style:normal !important;
}

#order-standard_cart .order-summary{
    border:none !important;
}

.float-right{
    font-weight:600;
}

#order-standard_cart .order-summary h2{
    font-weight:600 !important;
}
/*configureproduct.tpl end*/

/*view cart start*/
#order-standard_cart .view-cart-items-header{
    background-color:#ff5533 !important;
}

#order-standard_cart .view-cart-items{
    border-bottom:2px solid #ff5533 !important;
}
#order-standard_cart .empty-cart .btn{
        background-color:#ff5533 !important;

}

#order-standard_cart .view-cart-tabs .nav-tabs a[aria-expanded=true], #order-standard_cart .view-cart-tabs .nav-tabs a[aria-selected=true]{
    background-color:#000 !important;
    color:#fff !important;
}

#order-standard_cart .view-cart-tabs .tab-content{
    background-color:transparent !important;
}


.tab-content>.active{
    display: flex !important;
}
.colclasss{
    flex-direction:row !important;
}
.viewcartform{
        display: flex !important;
    width: 100% !important;
    column-gap: 20px !important;
}

#order-standard_cart .view-cart-tabs .promo .form-group{
    margin-bottom:1px !important;
}

.bb{
    width:44% !important;
}

.btn-default{
    color: #fff;
    background-color: #000;
    border-color: #000 !important;

}

.btn-default:hover{
        background-color: #000 !important;
    color: #fff !important;

}

.viewcheckoutbutton{
        display: flex;
    column-gap: 20px;
    justify-content: center;
}

#order-standard_cart .order-summary .btn-continue-shopping{
    color: #222;
    font-size: 1rem !important;
    background-color: #ffffff;
    font-weight:600;
}

#order-standard_cart .btn-checkout{
    padding:7px 34px !important;
}

.btn-group-lg>.btn, .btn-lg{
    font-size:1rem !important;
}

/*view cart end*/

/*view invoice*/

.payment-btn-container input{
    background-color: #ff5533 !important;
    border: none;
    padding: 4px 7px 4px 8px;
    border-radius: 5px;
    color: #fff;
    font-weight: 600;    
}

.master-breadcrumb .breadcrumb {
    margin: 0;
    padding: 0px 0;
    font-size: .9rem;
    height: max-content;
}

.breadcrumb li {
    padding-top: 0px !important;
}

.toggle-buttons {
        display: flex !important;
        justify-content: space-between !important;
        width: 100% !important;
padding-top:10px;       
    column-gap: 8px;
    
    
    }
    

 
    .toggle-buttons label:hover {
        background-color: #d0d0d0;
    }

  

    .toggle-buttons label {
        padding: 10px 10px !important;
                background-color: #e0e0e0 !important;

        border-radius: 20px !important;
        cursor: pointer !important;
        color:#000 !important;
                font-weight:600;
                
                

    }

    .toggle-buttons input[type="radio"]:checked + label {
        color:#fff !important;
                background-color: #ff5533 !important;

        font-weight:600;
    }


.form-inline{
    column-gap:22px;
    /*padding-top:10px;*/
}
 
.bred{
    background-color:red !important;
    color:#ffff !important;
    font-weight:600 !important;
    border:none !important;
}

.bgreen{
      background-color:green !important;
    color:#ffff !important;
    font-weight:600 !important;
    border:none !important;
}

.dflex{
    display:flex !important;
    column-gap:10px !important;
}


.bred{
    border-radius:10px !important;
        padding-inline: 16px !important;
    padding-block: 7px !important;
}


.bgreen{
    border-radius:10px !important;
        padding-inline: 16px !important;
    padding-block: 7px !important;
}



/*client area product details*/


.classcolu{
    flex-direction:column !important;
}

.colwidth{
    width: 50%;
    border-radius: 20px;
    margin-top: 21px !important;
}



   /* Modal Container */
   .custom-confirm-modal {
    display: none; /* Initially hidden */
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
   
    align-items: center;
    justify-content: center;
}

/* Modal Content */
.custom-confirm-content {
    background-color: #001f3c;
    padding: 20px;
    border-radius: 8px;
    width: 500px;
    position: relative; /* For positioning the close button */
    text-align: center;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    animation: fadeIn 0.5s ease-out;
}

/* Close Button */
.close-button {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 30px;
    font-weight: bold;
    color: #fff;
    border: none;
    background: none;
    cursor: pointer;
}

.close-button:hover {
    color: #ababab;
}

/* Modal Title */
.custom-confirm-title {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 15px;
    color: #fff;
}

/* Modal Message */
.custom-confirm-message {
    font-size: 16px;
    color: #fff;
    margin-bottom: 20px;
}

/* Buttons */
.custom-confirm-button {
    background-color: #4CAF50;
    color: white;
    padding: 10px 33px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.3s ease;
    margin: 0 10px;
}

.custom-confirm-button:hover {
    background-color: #45a049;
}

.custom-confirm-button.cancel {
    background-color: #f44336;
}

.custom-confirm-button.cancel:hover {
    background-color: #d32f2f;
}

.server-management-section h4{
  color:#fff;
}
.action-btn{
  border-radius: 2rem;
}

.management-title{
        border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
}
@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity: 1;}
}

@media screen and (max-width: 1280px){
    .master-breadcrumb{
        padding: 20px 10px 10px;
    }
    .serviceBox .title{
        font-size: 15px !important;
        line-height: 1.5;
    }
    .fs-35{
        width: 100% !important;
    }
    #order-standard_cart .btn-checkout{
        display: flex !important;
        flex-direction: column;
        align-items: center;
    }
    .breadcrumb-item.active {
        font-size: 14px !important;
    }
    .breadcrumb-item a {
        font-size: 14px !important;
    }
    .master-breadcrumb .breadcrumb {
        display: flex !important;
        gap: 2px !important;
        flex-wrap: wrap !important;
    }
}

.verification-banner .text{
    color: black !important;
}

.ticket-details-children .title{
    font-size: 20px !important;
    color: black !important;
}

.panel-sidebar .collapsable-card-body {
    max-height: 500px;
    overflow-y: auto;
}

/* Width of the scrollbar */
.panel-sidebar .collapsable-card-body::-webkit-scrollbar {
    width: 8px;
}

/* The background "track" of the scrollbar */
.panel-sidebar .collapsable-card-body::-webkit-scrollbar-track {
    background: #f1f1f1; 
    border-radius: 4px;
}

/* The moving "handle" of the scrollbar */
.panel-sidebar .collapsable-card-body::-webkit-scrollbar-thumb {
    background: #c1c1c1; 
    border-radius: 4px;
    border: 1px solid #f1f1f1; /* Creates a small padding effect */
}

/* The handle on hover */
.panel-sidebar .collapsable-card-body::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8; 
}

.panel-sidebar .collapsable-card-body {
    /* For Firefox */
    scrollbar-width: thin;
    scrollbar-color: #c1c1c1 #f1f1f1; /* Thumb Color | Track Color */
}

.cart-sidebar .mb-3{
    margin-bottom: 15px !important;
}

#recaptch-submit {
    display: flex !important;
    flex-direction: column;
    gap: 0;
}