.container-fluid {
    max-width: 1280px;
}

.container-fluid-max {
    width: 100%
}

body {
    font-family: 'PT Sans', sans-serif, 'Muli', "Tahoma", 'Roboto';
    background-color: #ffffff;
}

.bordered {
    border: 1px dotted #000 !important;
}

section-content{
    display: block;
}

/* MENU SECTION */

#site-navigation {
    border: 1px solid #ccc;
    border-radius: 5px;
}

.sky-mega-menu li {
    line-height: 37px!important;
}

.sky-mega-menu li a{
    text-transform: uppercase!important;
}

/* HEAD SECTION */

#header-section {
    min-height: 108px;
    padding-top: 17px;
}

#header-section .logo{
    margin-left: 25px !important;
}

.support-section{
    width: 280px;
    float: right;
    margin-top: 16px;
}

.support-icon{
    height: 36px;
    width: 42px;
    float: left;
    background-image: url('../images/headset.png') !important;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: contain;
    margin-right: 13px;
    margin-top: 5px;
}
.support-info .tel{
    font-size: 23px;
    color: rgb(51, 51, 153);
    font-weight: bold;
    text-align: left;
}
.support-info .time-message{
    font-size: 14px;
    color: rgb(153, 153, 153);
    text-align: left; 
    line-height: 6px;
}

/* SEARCH SECTION */

#search-section {
    margin-top: 16px;
}

#search-domain-section{
    margin-top: 0;
}

#search-section input,
#search-domain-section input {
    border-radius: 20px 0 0 20px;
    padding-left: 28px;
    outline: none;
    background-color: #f2f1f1;
}

#search-section button,
#search-domain-section button {
    border-radius: 0 20px 20px 0;
    background-color: #f2f1f1;
    font-size: 20px;
    padding: 3px 15px 0 10px;
    border: 1px solid #ccc;
    /* border-left: 0; */
}

#search-domain-section input,
#search-domain-section button{
    background-color: #e6edfa;
}

/* BANNER SECTION */

#banner-section{
    padding-top: 15px;
}

#banner-section .carousel-section {
    min-height: 415px;
}
#banner-section .shadow-dropdown{
    background-image: url('../images/shadow-dropdown.png');
    background-repeat: no-repeat;
    background-position: top center;
    background-size: contain;
    height: 17px;
}

/* PACKAGES SECTION */

#packages-section{
    padding-top: 40px;
    padding-bottom: 20px;
}

#packages-section .nav-tabs {
    border-bottom: 0;
    /* max-width: 570px!important; */
}

#packages-section .card-header {
    background-color: #fff;
    border: 0;
}

#packages-section .card.card-nav-tabs {
    border: 1px;
}

#packages-section .nav {
    display: flex;
    flex-wrap: wrap;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    justify-content: center;
}

#packages-section .nav-tabs .nav-item {
    margin-bottom: -1px;
    border: 1px solid #ccc;
    text-transform: uppercase;
    border-right: 0!important;
    overflow: hidden;
}

#packages-section .nav-tabs .nav-item:first-child{
    border-radius: 20px 0 0 20px;
}
#packages-section .nav-tabs .nav-item:last-child{
    border-radius: 0 20px 20px 0;
    border-right: 1px solid #ccc;
}

#packages-section .nav-tabs .nav-item .nav-link.active {
    background-color: #e6edfa;
    transition: background-color .3s .2s;
    color: #000!important;
}

#packages-section .nav-tabs .nav-item .nav-link{
    background-color: #f2f1f1;
    border: 1px!important;
    color: #666!important;
    font-weight: 500;
    padding: 4px 31px;
}

#packages-section .package-card::before{
    content: '';
    display: block;
    background-color: #000;
    position: relative;
    height: 25px;
    border-radius: 9px 9px 0 0;
}

#packages-section .package-card.card-popular::before{
    content: 'MOST POPULAR'!important;
    color: #fff;
    font-size: 14px;
    letter-spacing: 1px;
}

#packages-section .package-card.card-standard::before{
    background-image: -moz-linear-gradient( 0deg, rgb(155,156,158) 0%, rgb(91,92,94) 100%);
    background-image: -webkit-linear-gradient( 0deg, rgb(155,156,158) 0%, rgb(91,92,94) 100%);
    background-image: -ms-linear-gradient( 0deg, rgb(155,156,158) 0%, rgb(91,92,94) 100%); 
}

#packages-section .package-card.card-premium::before{
    background-image: -moz-linear-gradient( 0deg, rgb(212,15,121) 0%, rgb(79,59,218) 100%);
    background-image: -webkit-linear-gradient( 0deg, rgb(212,15,121) 0%, rgb(79,59,218) 100%);
    background-image: -ms-linear-gradient( 0deg, rgb(212,15,121) 0%, rgb(79,59,218) 100%);
}

#packages-section .package-card.card-enterprise::before{
    background-image: -moz-linear-gradient( 0deg, rgb(222,172,73) 0%, rgb(175,107,6) 100%);
    background-image: -webkit-linear-gradient( 0deg, rgb(222,172,73) 0%, rgb(175,107,6) 100%);
    background-image: -ms-linear-gradient( 0deg, rgb(222,172,73) 0%, rgb(175,107,6) 100%);
}

#packages-section .package-card.card-green::before{
    background-image: -moz-linear-gradient( 0deg, rgb(115,222,73) 0%, rgb(2,126,11) 100%);
    background-image: -webkit-linear-gradient( 0deg, rgb(115,222,73) 0%, rgb(2,126,11) 100%);
    background-image: -ms-linear-gradient( 0deg, rgb(115,222,73) 0%, rgb(2,126,11) 100%);
}

#packages-section .package-card.card-darkblue::before{
    background-image: -moz-linear-gradient( 0deg, rgb(117,141,245) 0%, rgb(6,18,175) 100%);
    background-image: -webkit-linear-gradient( 0deg, rgb(117,141,245) 0%, rgb(6,18,175) 100%);
    background-image: -ms-linear-gradient( 0deg, rgb(117,141,245) 0%, rgb(6,18,175) 100%);
}

#packages-section .package-card.card-lightblue::before{
    background-image: -moz-linear-gradient( 0deg, rgb(0,209,242) 0%, rgb(2,85,159) 100%);
    background-image: -webkit-linear-gradient( 0deg, rgb(0,209,242) 0%, rgb(2,85,159) 100%);
    background-image: -ms-linear-gradient( 0deg, rgb(0,209,242) 0%, rgb(2,85,159) 100%);
}

#packages-section .package-card.card-orange::before{
    background-image: -moz-linear-gradient( 0deg, rgb(253,160,0) 0%, rgb(178,66,6) 100%);
    background-image: -webkit-linear-gradient( 0deg, rgb(253,160,0) 0%, rgb(178,66,6) 100%);
    background-image: -ms-linear-gradient( 0deg, rgb(253,160,0) 0%, rgb(178,66,6) 100%);
}

#packages-section .package-card.card-purple::before{
    background-image: -moz-linear-gradient( 0deg, rgb(213,73,222) 0%, rgb(87,2,126) 100%);
    background-image: -webkit-linear-gradient( 0deg, rgb(213,73,222) 0%, rgb(87,2,126) 100%);
    background-image: -ms-linear-gradient( 0deg, rgb(213,73,222) 0%, rgb(87,2,126) 100%);
}


#packages-section .package-card.card-tz::before{
    background: linear-gradient(to right, #009900, #0000FF);
}
#packages-section .package-card.card-ke::before{
    background: linear-gradient(to right, #000000, #FF0000);
}
#packages-section .package-card.card-rw::before{
    background: linear-gradient(to right, #0000FF, #FFFF00);
}
#packages-section .package-card.card-ng::before{
    background: linear-gradient(to right, #008000, #FFFFFF);
}
#packages-section .package-card.card-ug::before{
    background: linear-gradient(to right, #000000, #FFD100);
}
#packages-section .package-card.card-za::before{
    background: linear-gradient(to right, #FFD100, #FF0000);
}
#packages-section .package-card.card-uk::before{
    background: linear-gradient(to right, #FF0000, #FFFFFF, #0000FF);
}
#packages-section .package-card.card-eu::before{
    background: linear-gradient(to right, #003399, #FFD100);
}

#packages-section .package-card:first-child > div.topex,
#packages-section .package-card mcborder:first-child > div.topex {
    background-color: white;
    position: relative;
    height: 20px;
    border-radius: 9px 9px 0 0;
    margin-top: -6px;
}

#packages-section .package-card:hover{
    background-color: #e4e2e254;
}
#packages-section .package-card:hover>{
    background-color: #e4e2e254;
}

#packages-section .package-card .current,
#packages-section .package-card:hover{
    /* border: none; */
    background-color: #fff;
    /* box-shadow: 0px 2px 7.28px 0.72px rgba(0, 0, 0, 0.1); */
    box-shadow: 0px 1px 13px 0px rgba(0, 0, 0, 0.09);
}

/* #packages-section .package-card mcborder {
    background: linear-gradient(90deg,rgb(52,168,83) 4%,rgb(66,133,244) 0) top/100% 34% no-repeat,
                linear-gradient(90deg,rgb(251,188,4) 50%,rgb(66,133,244) 0) top/100% 82% no-repeat,
                linear-gradient(90deg,rgb(251,188,4) 10%,rgb(234,67,53) 0) top/100% 100% !important;
} */

/* #packages-section .package-card > mcborder > div{
    margin: 4px;
} */

#packages-section .package-card.card-premium:hover .highlight,
#packages-section .package-card.card-premium:hover .extra/*,
#packages-section .package-card.card-premium.current .highlight*/{
    background-color: rgba(212, 15, 120, 0.083)!important;
}

#packages-section .package-card.card-standard:hover .highlight,
#packages-section .package-card.card-standard:hover .extra{
    background-color: #eeeeee!important;
}

#packages-section .package-card.card-enterprise:hover .highlight,
#packages-section .package-card.card-enterprise:hover .extra{
    background-color: #fbf9e8!important;
}

#packages-section .package-card.card-green:hover .highlight,
#packages-section .package-card.card-green:hover .extra{
    background-color: #f4ffef!important;
}

#packages-section .package-card.card-darkblue:hover .highlight,
#packages-section .package-card.card-darkblue:hover .extra{
    background-color: rgb(225, 230, 250)!important;
}

#packages-section .package-card.card-lightblue:hover .highlight,
#packages-section .package-card.card-lightblue:hover .extra{
    background-color: #00d0f126!important;
}

#packages-section .package-card.card-orange:hover .highlight,
#packages-section .package-card.card-orange:hover .extra{
    background-color: rgb(251, 239, 217)!important;
}

#packages-section .package-card.card-purple:hover .highlight,
#packages-section .package-card.card-purple:hover .extra{
    background-color: rgb(253, 230, 254)!important;
}

#packages-section .package-card.package-domain{
    min-height: 212px!important;
    margin-top: 10px;
    margin-bottom: 10px;
}

#packages-section .package-card.package-hosting{
    min-height: 212px!important;
}

#packages-section .package-card.package-servers{
    min-height: 212px!important;
}

#packages-section .package-card.package-servers .card-body{
    min-height: inherit!important;
}

#packages-section .package-card.package-development{
    min-height: 970px!important;
}

#packages-section .package-card.package-development .card-body{
    min-height: 685px!important;
}

#packages-section .package-card.package-ssl{
    min-height: inherit!important;
}

#packages-section .package-card.package-ssl .card-body{
    min-height: 540px!important;
}

#packages-section .package-card{
    border: 1px solid  rgb(230, 230, 230);
    border-radius: 9px;
    min-height: 550px; 
}

#packages-section .package-card .card-top{
    min-height: 138px;
    border-bottom: 1px solid  rgb(230, 230, 230);
    text-align: center;
    background-color: white;
    margin: 4px;
}

#packages-section .package-card .card-top .package-title {
    font-size: 23px;
    font-weight: bold;
    line-height: 3.05;
    text-transform: uppercase;
}

#packages-section .package-card .card-top .package-price-duration {
    font-size: 23px;
    color: rgb(0, 0, 0);
}

#packages-section .package-card .card-top .package-price-duration-original{
    text-decoration: line-through;
    border: 1px solid #ccc;
    display: inline-block;
    padding: 0 20px;
    border-radius: 27px;
    background-color: #cccccc38;
    color: #c3bebe;
    margin: 4px 0;
}

#packages-section .package-card .card-top .package-price-duration > span {
    font-size: 16px;
    padding-left: 4px;
}

#packages-section .package-card .card-top .package-detail {
    font-size: 14px;
    color: rgb(153, 153, 153);
    margin-bottom: 20px;
}
  
#packages-section .package-card.card-standard .package-title {
    color: rgb(101, 102, 104);
}

#packages-section .package-card.card-premium .package-title {
    color: rgb(60, 66, 190);
}

#packages-section .package-card.card-premium .package-title2 {
    color: #c21586;
}

#packages-section .package-card.card-enterprise .package-title {
    color: rgb(181, 116, 15);
}

#packages-section .package-card.card-green .package-title {
    color: #138b14;
}

#packages-section .package-card.card-darkblue .package-title {
    color: #1724b9;
}

#packages-section .package-card.card-lightblue .package-title {
    color: #0266aa;
}

#packages-section .package-card.card-orange .package-title {
    color: #f09001;
}

#packages-section .package-card.card-orange .package-title2 {
    color: #bc4f05;
}

#packages-section .package-card.card-purple .package-title {
    color: #680c8b;
}
  

#packages-section .package-card .card-body{
    min-height: 645px;
    text-align: left;
}

#packages-section .package-card .card-body > ul{
    margin-bottom: 0;
}
#packages-section .package-card .card-body > ul li{
    list-style-type: none;
    font-size: 16px;
    color: rgb(102, 102, 102);
    line-height: 28px;
}

#packages-section .package-card .card-body > .highlight i, 
#packages-section .package-card .card-body > .extra i{
    color: #008000;
    margin-right: 10px;
}


#packages-section .package-card .card-body > .highlight {
    background-color: rgba(246, 246, 246, 0.58);
    min-height: 217px;
    margin-bottom: 15px;
    margin-top: 15px;
}

#packages-section .package-card .card-body > .highlight,
#packages-section .package-card .card-body > .extra{
    border-radius: 8px;
    padding-top: 20px;
    padding-bottom: 20px;
}

#packages-section .package-card .card-body > .highlight li.title,
#packages-section .package-card .card-body > .extra li.title {
    margin-top: 10px;
    margin-bottom: 13px;
    font-weight: bold;
    color: #000!important;
    font-size: 16px!important;
}

#packages-section .package-card .card-bottom{
    min-height: 75px;
    text-align: center;
    padding: 10px 16px 20px 16px;
}
  

#packages-section .package-card .card-bottom .btn-links:hover{
    text-decoration: none;
}

#packages-section .package-card .card-bottom .btn-links{
    height: 37px;
    border: 1px solid rgb(204, 204, 204);
    color: #fff;
    padding: 5px 25px;
    display: inline-block;
    margin-left: -3px;
    margin-right: -2px;
    text-transform: uppercase;
}

#packages-section .package-card .card-bottom .btn-detail {
    background-image: -moz-linear-gradient( 90deg, rgb(176,26,11) 0%, rgb(243,80,1) 100%);
    background-image: -webkit-linear-gradient( 90deg, rgb(176,26,11) 0%, rgb(243,80,1) 100%);
    background-image: -ms-linear-gradient( 90deg, rgb(176,26,11) 0%, rgb(243,80,1) 100%);
    border-radius: 5px 0 0 5px;
}

#packages-section .package-card .card-bottom .btn-buy {
    border-width: 1px solid  rgb(204, 204, 204);
    background-image: -moz-linear-gradient( 90deg, rgb(39,39,171) 0%, rgb(85,100,214) 100%);
    background-image: -webkit-linear-gradient( 90deg, rgb(39,39,171) 0%, rgb(85,100,214) 100%);
    background-image: -ms-linear-gradient( 90deg, rgb(39,39,171) 0%, rgb(85,100,214) 100%);
    border-radius: 0 5px 5px 0;
}

#packages-section .package-card .card-bottom .btn-icon{
    padding-right: 15px;
}

#packages-section .tags-section{
    margin-top: 25px;
    margin-bottom: 0;
}

#packages-section .tags-section.tag-addons{
    font-weight: bold;
}

#packages-section .tag{
    /* border: 1px solid rgb(204, 204, 204); */
    border-radius: 5px;
    /* background-color: rgb(242, 241, 241); */
    font-size: 16px;
    color: rgb(102, 102, 102);
    text-align: center;
    display: inline-block;
    padding: 10px 25px;
    margin: 6px;

    border-radius: 5px;
    background-image: -moz-linear-gradient( 95deg, rgb(248,247,247) 0%, rgba(255,255,255,0) 100%);
    background-image: -webkit-linear-gradient( 95deg, rgb(248,247,247) 0%, rgba(255,255,255,0) 100%);
    background-image: -ms-linear-gradient( 95deg, rgb(248,247,247) 0%, rgba(255,255,255,0) 100%);
    box-shadow: 0px 1px 5.46px 0.54px rgba(0, 0, 0, 0.07);
    /* min-height: 67px;  */
}

#packages-section .tag price{
    display: block;

    font-size: 14px;
    color: rgb(102, 102, 102);
    font-weight: normal;
    /* line-height: 1.643; */
}

#packages-section .tag:hover{
    /* background-color: #e0f0fc54; */
    background-color: #fff;
    color: rgb(49 51 179);
}

.package-discount {
    color: #fff;
    width: 87px;
    height: 65px;
    padding: 5px;
    float: right;
    margin-left: -75px;
    margin-right: 15px;
    margin-top: -15px;
    font-size: 17px;
    font-weight: bold;
    line-height: normal;
    background-image: url('../../assets/images/discount-bg.webp');
    background-size: contain;
    background-repeat: no-repeat;
    z-index: 2000!important;
    position: relative;
}

.package-discount span{
    text-transform: uppercase;
    font-size: 15px;
    display: block;
    font-weight: normal;
}

/* SECTION TITLE */
/* title {
    display: block;
} */
.title{
    margin-top: 10px;
    margin-bottom: 35px;
}
.title .main-title{
    font-size: 20px;
    color: rgb(51, 51, 51);
    line-height: 1.4;
    text-align: center;
    text-transform: uppercase;
}
.title .sub-title{
    font-size: 28px;
    color: rgb(51, 51, 51);
    font-weight: bold;
    text-align: center;
}

/* WHY CHOOSE US SECTION  */

#why-choose-us-section section-content{
    min-height: 295px;
    margin-top: 25px;
    margin-bottom: 25px;
    display: block;
}

.card-why-choose-us{
    border: 1px solid  rgb(230, 230, 230);
    border-radius: 9px;
    background-image: -moz-linear-gradient( 90deg, rgb(237 237 251) 0%, rgba(195,195,195,0) 100%);
    background-image: -webkit-linear-gradient( 90deg, rgb(237 237 251) 0%, rgba(195,195,195,0) 100%);
    background-image: -ms-linear-gradient( 90deg, rgb(237 237 251) 0%, rgba(195,195,195,0) 100%);
    max-width: 290px;
    min-height: 285px;
    padding: 35px 20px;
    text-align: center; 
}

.card-why-choose-us:hover{
    background-color: #fff;
    box-shadow: 0px 2px 7.28px 0.72px rgba(0, 0, 0, 0.1);
    /* box-shadow: 0px 1px 13px 0px rgba(0, 0, 0, 0.09); */
}

.card-why-choose-us:hover .title{
    color: rgb(45 47 177);
}

.card-why-choose-us img{
    max-height: 76px;
    margin-bottom: 15px;
}

.card-why-choose-us .title{
    font-size: 20px;
    color: rgb(51, 51, 51);
    font-weight: bold;
    line-height: 1.2;
    margin-bottom: 15px;    
}
.card-why-choose-us .description{
    font-size: 15px;
    color: #6c6b6b;
    line-height: 1.2;
    height: 81px;
}

/* FOOTER SECTION  */

#footer-top-section .container-fluid {
    min-height: 195px;
    padding-top: 25px;
    padding-bottom: 25px;
    border-top: 1px solid  rgb(230, 237, 250);  
}

#footer-top-section .title {
        font-size: 16px;
        font-weight: bold;
        text-transform: uppercase;
        line-height: 1.5;
        height: 12px;
}

#footer-top-section .contacts {
    font-size: 15px;
    color: rgb(102, 102, 102);
    line-height: 1.6;
    height: 14px;
}

#footer-top-section .mobile-app a {
    border: 1px solid  rgb(153, 153, 153);
    border-radius: 5px;
    max-width: 210px;
    height: 3%;
    padding: 5px 10px;
    padding-left: 24px;
    margin-right: 20px;
    margin-bottom: 8px;
    font-size: 16px;
    color: rgb(102, 102, 102);
    font-weight: bold;
    text-transform: uppercase;
    display: block;
    text-decoration: none;
}

#footer-top-section .mobile-app a > img {
    height: 20px;
    margin-right: 8px;
    margin-top: -5px;
}

#footer-top-section .payment-methods > img{
    height: 34px;
    margin-right: 9px;
    margin-bottom: 6px;
    border-radius: 4px;
}

#footer-top-section .social-links a{
    display: inline-block;
    height: 48px;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    margin-left: 4px;
}

#footer-top-section .social-links a:hover,
#footer-top-section .mobile-app a:hover{
    background-color: #e4e2e254;
}

#footer-top-section .social-links a > img{
    height: 28px;
}

#footer-bottom-section .container-fluid{
        background-color: rgb(45, 47, 176);
        height: 45px;
        color: #fff;
        border-radius: 5px 5px 0 0;
        padding-top: 10px;
        padding-bottom: 15px;
}

#footer-bottom-section a {
    color: #fff;
    padding-left: 5px;
    padding-right: 5px;
}

#footer-bottom-section .container-fluid .first-disclaimer{
    padding-left: 30px;
}

#footer-bottom-section .container-fluid .second-disclaimer{
    padding-right: 30px;
    text-align: right;
}

/* FORM SECTION */

.form-title {
    font-size: 24px;
    color: rgb(0, 0, 0);
    font-weight: bold;
    line-height: 70px;
    text-align: left;
}

.reset-btn-bg {
    border-width: 1px;
    border-color: rgb(204, 204, 204);
    border-style: solid;
    border-radius: 3px;
    background-color: rgb(255, 255, 255);
    padding-left: 25px;
    padding-right: 25px;
    margin-left: 10px;
}

.primary-btn-bg {
    border-radius: 3px;
    background-color: rgb(84, 23, 15);
    padding-left: 25px;
    padding-right: 25px;
    margin-right: 10px;
    border: none;
    outline: none;
}

#top-footer hr {
    border: 0;
    border-bottom: 1px solid #737373;
    margin: 0;
}

#top-footer {
    background-color: #000;
    color: #fff;
    color: #fff;
    min-height: 430px;
}

#top-footer .section-1 .social {
    background-repeat: no-repeat;
    background-size: 63%;
    background-position: center;
    height: 40px;
    width: 40px;
    display: inline-block;
    border: 1px solid #fff;
    border-radius: 20px;
    margin-right: 3px;
}

#top-footer .section-1 .social:hover {
    border: none;
}

.facebook {
    background-image: url('../images/social-icons/facebook.png');
}

.facebook:hover {
    background-color: #1877f2;
}

.twitter {
    background-image: url('../images/social-icons/twitter.png');
}

.twitter:hover {
    background-color: #1da1f2;
}

.whatsapp {
    background-image: url('../images/social-icons/whatsapp.png');
}

.whatsapp:hover {
    background-color: #25d366;
}

.linkedin {
    background-size: 55% !important;
    background-image: url('../images/social-icons/linkedin.png');
}

.linkedin:hover {
    background-color: #2867b2;
}

.instagram {
    background-image: url('../images/social-icons/instagram.png');
}

.instagram:hover {
    background-color: #f8ab5b;
}

.youtube {
    background-image: url('../images/social-icons/youtube.png');
}

.youtube:hover {
    background-color: #ed1f24;
}

input.form-control {
    height: 40px;
}

.main-menu-section {
    margin-top: 10px;
}

#menu-section{
    /* background-image: url("../images/menu-bottom-shadow.png"); */
    background-repeat: repeat-x;
    background-position: center;
}

.main-menu{
    background-color: #367dc8;
    border-radius: 5px;
    /*height: 63px;*/
    z-index: 98;
    /*padding-right: 0;*/
    /*overflow: hidden;*/
}

.main-menux .sky-mega-menu li a:hover{
    color: #1f8bd6!important;
}
.sky-mega-menu li li:last-child{
    border-bottom: none;
}
.main-menux .sky-mega-menu li a{
    color: #2a2a2f!important;
    text-transform: none;
}

.trans{
    opacity: 1;
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    transition: all 500ms ease;
}

/* Page Navigation */
.breadcrumb {
    background: none;
    margin-bottom: 0;
}

#page-navigation-section {
    border-bottom: 1px solid #ccc;
    /*background-color: #1e8bd60f;*/
}

.content-main .main-content{
    font-size: 17px;
    color: rgb(42, 42, 47);
    line-height: 1.2;
    text-align: left;
}
.content-main .main-title{
    font-size: 20px;
    color: rgb(54, 125, 200);
    font-weight: bold;
    text-transform: uppercase;
    line-height: 1.2;
    text-align: left;
    margin-bottom: 18px;
}

.main-title-sub{
    font-size: 27px;
    color: rgb(54, 125, 200);
    font-weight: bold;
    /*text-transform: uppercase;*/
    line-height: 1.2;
    text-align: left;
    margin-bottom: 18px;
}
.content-main{
    border-radius: 12px;
    background-color: rgb(240, 239, 244);
    height: 213px;
    padding: 35px;
    margin-top: 25px;
}

.content-main-row{
    margin-top: 10px;
}


#counter-section .statCounter .col:nth-child(2),
#counter-section .statCounter .col:nth-child(3),
#counter-section .statCounter .col:nth-child(4)
{
    border-left: 1px solid #a0c2e5;
}
#counter-section .statCounter{
    border-radius: 12px;
    background-color: rgb(54, 125, 200);
    height: 185px;
    padding: 40px;
    color: #fff;
}

#counter-section .statCounter .stat-title {
    font-size: 24px;
    color: rgb(255, 255, 255);
    font-weight: bold;
    line-height: 1.2;
    text-align: center;
}

#counter-section .statCounter .stat-number {
    font-size: 36px;
    color: rgb(255, 255, 255);
    font-weight: bold;
    line-height: 1.2;
    text-align: center;
}

#counter-section .statCounter .stat-unit {
    font-size: 24px;
    color: rgb(255, 255, 255);
    line-height: 16px;
    text-align: right;
    padding-right: 90px;
    margin-top: 15px;
}


#counter-section{
    background-image: url("../../images/counterBg.png");
    background-repeat: repeat-x;
    background-position: center;
    padding-top: 35px;
    padding-bottom: 35px;
}

#footer-section{
    background-color: #252525;
    background-image: url("../../images/footer-world-map.png");
    background-repeat: no-repeat;
    background-position: top center;
    background-size: contain;
}

#footer-section .footer-disclaimer{
    border-top: 1px solid #484848;
    color: #cccccc;
    font-size: 16px;
    height: 50px;
    padding-top: 10px;
    padding-bottom: 10px;
}

#footer-section .footer-disclaimer li{
    display: inline-block;
    padding-left: 5px;
    padding-right: 5px;
}
#footer-section .footer-disclaimer a{
    color: #cccccc;
    font-size: 16px;
    text-decoration: none;
}

#footer-section .footer-extra a{
    color: rgb(204, 204, 204);
    text-decoration: none;
}
#footer-section .footer-extra{
    min-height: 350px;
    color: rgb(204, 204, 204);
}

#footer-section .footer-extra .footer-title{
    font-size: 20px;
    color: rgb(255, 255, 255);
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 20px;
}

#footer-section .footer-extra ul{
    padding-left: 20px;
    list-style: disc;
}
#footer-section .footer-extra .location-branch{
    border-width: 1px;
    border-color: rgb(255, 255, 255);
    border-style: solid;
    border-radius: 6px;
    display: inline-block;
    padding: 4px 14px;
    font-size: 17px;;
    text-transform: uppercase;
    line-height: 1.5;
    margin-bottom: 15px;
}

#footer-section{
    padding-bottom: 5px;
}

.sky-mega-menu li a.webmail_btn {
    color: #fff !important;
    background-color: #4b1a0f !important;
    padding-left: 17px;
    padding-right: 17px;
}

.separator_footer_sm_md {
    display: none;
}


a.section_links_main {
    color: #333333 !important;
    text-decoration: none;
    outline: none;
    font-size: 16px;
}

#page-header-section {
    padding: 20px 143px;
    background-color: #fff;
    background-position: center top;
    background-repeat: no-repeat;
    position: relative;
}

#page-header-section .breadcumb-inner ul {
    padding-left: 0;
}

#page-header-section .brpt h2 {
    font-size: 40px;
    margin-bottom: 0px;
    text-transform: capitalize;
    margin-top: 0;
    line-height: 1.2;
    font-weight: 800;
    letter-spacing: -1px;
    color: #000000 !important;
}

#page-header-section .breadcumb-inner li,
#page-header-section .breadcumb-inner li a,
#page-header-section .breadcumb-inner ul {
    color: #333;
}

#page-header-section .breadcumb-inner li a {
    color: #333;
    text-transform: uppercase;
}

#page-header-section .breadcumb-inner li {
    display: inline-block;
    margin: 0 6px;
    color: #333;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
}

.boxshadow2 {
    display: flex;
    box-shadow: 0 0 0.8125rem 0 rgb(8 9 10 / 15%);
    padding-bottom: 10px;
}

#page-nav-section {
    position: relative;
    padding: 15px 35px;
    background-color: #521713;
    line-height: 14px;
}

#page-nav-section .bread-crumbs ul {
    padding-left: 10px;
}

#page-nav-section .bread-crumbs li,
#page-nav-section .bread-crumbs li a,
#page-nav-section .bread-crumbs ul {
    color: #fff;
}

#page-nav-section .bread-crumbs li a {
    color: #fff;
    text-transform: uppercase;
}

#page-nav-section .bread-crumbs li {
    display: inline-block;
    margin: 0 6px;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
}

#page-nav-section .bread-crumbs-list {
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    font-size: 1rem;
    overflow: hidden;
}

.page-title span {
    color: #521713;
}

.page-title {
    font-weight: 700;
}

.page-subtitle {
    font-size: 1rem;
    color: #521713;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 6px;
    letter-spacing: 2px;
}

.page-body .btn-default {
    border: 1px solid #000;
    padding-left: 1.75em;
    padding-right: 1.75em;
    margin-left: 10px;
}

.page-body .btn-primary {
    background: #2876e2;
    background: linear-gradient(to right, #2876e2 0, #3f8efc 100%);
    text-decoration: none;
    padding-left: 1.75em;
    padding-right: 1.75em;
    border-radius: .375rem;
    outline: 0;
    cursor: pointer;
}

.page-body form .row .form-control {
    display: block;
    font-size: 1rem;
    font-weight: 400;
    width: 100%;
    padding: calc(.75em - 1px) 1rem;
    margin-bottom: 15px;
    min-height: 50px;
}

.page-body .map-auto {
    border-radius: .375rem;
    overflow: hidden;
}

/* pagination */
div.dataTables_wrapper div.dataTables_info, div.dataTables_wrapper div.dataTables_paginate {
    font-weight: 400;
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.pagination .page-item.active .page-link {
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12);
    transition: all .2s linear;
    border-radius: .125rem;
    background-color: #521713;
    color: #fff;
}    

.pagination .page-item .page-link {
    transition: all .3s linear;
    outline: 0;
    border: 0;
    background-color: transparent;
    font-size: .9rem;
    color: #212529;
}

.page-item.active .page-link {
    z-index: 1;
    color: #fff;
    background-color: #521713;
    border-color: #007bff;
}

.page-link {
    position: relative;
    display: block;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #521713;
    background-color: #fff;
    border: 1px solid #dee2e6;
}

.readmore{
    text-align: center;
    padding-top: 10px;
}

.readmore a:hover, .see_all a:hover{
    background-color: rgba(227, 227, 227, 0.44);
    text-decoration: none;
}

.readmore a, .see_all a{
    /* background-color: #e3e3e3; */
    color: #521713;
    padding: 5px 10px;
    border-radius: 5px;
    font-size: 16px;
    font-weight: bold;
    text-transform: capitalize;
    border: 1px solid #e3e3e3; 
}

 /* --------------FAQs Section ---------------- */

.panel {
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.05);
    box-shadow: 0 1px 1px rgba(0,0,0,0.05);
}

.panel-default>.panel-heading{
    background: none;
    border-radius: 0;
    position: relative;
    padding: 1px 20px;
 }
 
 .panel-group .panel{
    border-radius: 0;
    margin-bottom: 15px;
 }

.panel-group .panel-heading+.panel-collapse .panel-body {
    border-top: 1px solid #ddd;
}

.panel-default>.panel-heading+.panel-collapse .panel-body {
    border-top-color: #ddd;
}
 
 h4.panel-title{
    font-size: 16px;
    font-weight: bold;
    background: none;
    border: 0;
    padding: 8px 0 8px 0;
    line-height: normal;
    border-radius: 0;
 }
 
 h4.panel-title a{
    color: #1c4b5d;
 }
 
 h4.panel-title span{
    float: right;
 }
 
 h4.panel-title a.collapsed{
    color: #333;
 }
 
 h4.panel-title a:before{
     background: #1c4b5d;
     color: #fff;
     width: 30px;
     height: 30px;
     line-height: 30px;
 }
 
 h4.panel-title a.collapsed:before{
    background: #3F51B5;
    color: #fff;
 }
 
 h4.panel-title a:before,
 h4.panel-title a.collapsed:before{
    font-family: "FontAwesome";
    position: absolute;
    z-index: 0;
    font-size: 14px;
    right: 15px;
    padding: 0 5px;
    text-align: center;
    top: 50%;
    -webkit-transform: translateY(-50%);
     transform: translateY(-50%);
 }
 
 h4.panel-title a:before {
    content: "\f077";
 }
 
 h4.panel-title a.collapsed:before {
    content: "\f078";
 }
 
 .panel-body{
    padding: 20px;
 }

.panel-group .panel {
    border-radius: 9px;
}

h4.panel-title a:before, h4.panel-title a.collapsed:before {
    border-radius: 5px;
}

/* ----------------- CHECKOUT & CART ------------------ */
cart-title,
order-title,
addons-title{
    font-size: 20px;
    color: rgb(102, 102, 102);
    font-weight: bold;
    line-height: 1.2;
    margin-bottom: 20px;
    margin-left: 10px;
    display: block;
}

order-title{
    color: #fff;
}

.checkout{
    margin-right: 20px;
}

.checkout fieldset{
    border: 1px solid rgb(226, 226, 226);
    border-radius: 9px;
    padding: 20px;
    margin-bottom: 27px;
}

.checkout fieldset:hover {
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.10);
}

.checkout fieldset:hover .form-control, 
.checkout fieldset:hover select{
    background-color: rgba(97, 111, 215, 0.131);
}

.checkout fieldset legend{
    width: auto;
    font-size: 16px;
    color: rgb(51, 51, 51);
    line-height: 1.2;
    padding-left: 7px;
    padding-right: 7px;
}

addons-section{
    display: block;
}

.addon-item{
    border: 1px solid rgb(226, 226, 226);
    border-radius: 9px;
    min-height: 110px;
    /* padding: 20px; */
    margin-bottom: 10px;
    margin-top: 10px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: stretch;
}

.addon-item .icon,
.addon-item .info,
.addon-item .extra{
    padding: 20px;
}

/* .addon-item:nth-child(odd){
    margin-left: 5px;
}
.addon-item:nth-child(even){
    margin-right: 5px;
} */

.addon-item:hover{
    border-color: rgb(97, 110, 215);
}

.addon-item .extra .btn-addons{
    border: 1px solid rgb(227, 227, 227);
}

.addon-item:hover .extra .btn-addons{
    color: rgb(97, 110, 215);
}

.addon-item:hover .extra .btn-addons:hover{
    text-decoration: none;
    background-color: rgb(239, 251, 254);
}

.addon-item.selected_addon {
    border-color: rgb(97, 110, 215);
    background-color: rgb(239, 251, 254);
}

.addon-item.selected_addon .extra .btn-addons{
    color: rgb(97, 110, 215);
    border: 1px solid rgb(227, 227, 227);
    background-color: rgb(239, 251, 254);
}

.addon-item.selected_addon .extra .btn-addons::after{
    content: 'ed'!important;
}

.addon-item .description{
    font-size: 14px;
    font-family: "Arial";
    color: rgb(153, 153, 153);
    text-align: left;
    max-height: 40px;
    line-height: normal;
}
.addon-item .title{
    font-size: 16px;
    color: rgb(102, 102, 102);
    font-weight: bold;
    /* line-height: 1.2; */
    text-align: left;
    margin: 0!important;
    margin-bottom: 5px!important;
}

.col-lg-6 .addon-item .icon{
    display: none !important;
}

.addon-item .icon{
    /* float: left; */
    width: 110px;
    /* height: 20vh; */
    border-right: 1px solid #ccc;
    /* margin-right: 23px; */
    text-align: center;

    display: flex;
    justify-content: center;
}

.addon-item .extra{
    /* float: right; */
    text-align: right;
}

.addon-item .extra .price-duration{
    font-size: 16px;
    font-family: "Arial";
    color: #616ed7;
    font-weight: bold;
    /* line-height: 1.2; */
    text-align: right;
}
.addon-item .extra .price-duration > span{
    font-size: 12px;
    color: #666666;
    display: block;
    font-weight: normal;
}

.addon-item .extra .btn-addons {
    border-radius: 9px;
    background-color: rgb(227, 227, 227);
    width: 61px;
    /* height: 25px; */

    font-size: 14px;
    font-family: "Arial";
    color: rgb(102, 102, 102);

    padding: 1px 14px;
    margin-top: 13px;
    width: auto;
    display: inline-block;
}

.addon-item .icon img {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    /* width: 100%; */
    width: 62px;
    /* border: 1px solid #ccc; */
}

.addon-item .google-workspace-pic{
    background-image: url('../../assets/images/addons/google-workspace.png');
}

.addon-item .seo-pic{
    background-image: url('../../assets/images/addons/seo.png');
}

.section-group fieldset legend{
    color: #333333;
}

/* ------------- STEP BY STEP ------------ */

step-navigation{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    margin-bottom: 20px;
    margin-left: 40px;
    margin-right: 40px;

    background-image: url('../../assets/images/step-border-bg.png');
    background-repeat: repeat-x;
    background-position: 0 20px;
}

step-navigation .step-item:hover,
step-navigation .step-item.active{
    color: #616ed7;
}

step-navigation .step-item:hover span:first-child,
step-navigation .step-item.active span:first-child{
    color: #616ed7;
    border-color: #616ed7;
}
step-navigation .step-item.filled span:first-child{
    color: #616ed7;
    /* border-color: #616ed7; */
}

step-navigation .step-item.active span:first-child n,
step-navigation .step-item.filled span:first-child n{
    display: none;
}

step-navigation .step-item.active span:first-child i,
step-navigation .step-item.filled span:first-child i{
    display: inline;
}

step-navigation .step-item span:first-child i{
    display: none;
}

step-navigation .step-item:hover span:last-child,
step-navigation .step-item.active span:last-child{
    color: #616ed7;
}

step-navigation .step-item{
    text-align: center;
}

step-navigation .step-item span:first-child{
    color: #b3b3b3;
    border-radius: 20px;
    width: 40px;
    height: 40px;
    text-align: center;
    justify-content: center;
    border: 2px solid #b3b3b3;
    padding: 7px;
    display: inline-block;
    margin-bottom: 10px;
    background-color: #fff;
}

step-navigation .step-item span:last-child{
    display: block;
    color: #b3b3b3;
}

pin-input{
    display: flex;
    max-width: 200px !important;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    margin-top: 13px;
}

pin-input > input{
    max-width: 40px;
    text-align: center;
}

/* ------------  Cart Section ------------ */
cart{
    width: 100%; 
    /* height: 560px;   */
    border-radius: 10px; 
    display: block;

    
    border: 1px solid rgb(226, 226, 226);
    border-radius: 9px;
    background-color: rgb(248, 247, 247);
    min-height: 400px;
    padding: 30px 14px 30px 14px;
}

cart .cart-container{
    border: 1px solid rgb(247, 247, 247);
    border-radius: 9px;
    background-color: rgb(255, 255, 255);
    min-height: 200px;
    padding-bottom: 20px;
    margin-bottom: 20px;
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.15);
}

cart .cart-container .cart-item {
    border-bottom: 1px solid #cccccc;
    padding: 10px 20px;
}

cart .cart-container .cart-item.option{
    background-color: #effbfe;
}

cart .cart-container .cart-item:last-child{
    /* border: none; */
}

cart .cart-container .cart-item .item-category{
    font-size: 14px;
    /* font-family: "Arial"; */
    color: rgb(102, 102, 102);
    line-height: 1.2;
    text-align: left;
    padding-top: 5px;
    padding-bottom: 5px;
}

cart .cart-container .cart-item .item{
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: space-between;
    padding-top: 5px;
}

cart .cart-container .cart-item:hover .item .name,
cart .cart-container .cart-item:hover .item .price,
cart .cart-container .cart-item:hover .item .removeBtn{
    color: rgb(81, 92, 178);
}

cart .cart-container .cart-item .item .name {
    text-align: left;
    min-width: 200px;
}

cart .cart-container .cart-item .item .name,
cart .cart-container .cart-item .item .price {
    font-size: 16px;
    color: rgb(97, 110, 215);
    font-weight: bold;
    line-height: 1.2;
}

cart .cart-container .cart-item .item .removeBtn{
    color: #666699;
}

cart .cart-container .cart-item .item .removeBtn:hover{
    color: #bf260a;
}

cart .cart-container .cart-item .item .price{
    text-align: right;
}

sub-info .sub-total,
total-info{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}

sub-info .sub-total title,
sub-info .sub-total amount{
    font-size: 16px;
    font-weight: bold;
    line-height: 1.2;
    display: inline-block;
}

sub-info .sub-total title,
total-info title{
    color: rgb(102, 102, 102);
    text-align: left;
}

sub-info .sub-total amount,
total-info amount{
    color: rgb(97, 110, 215);
    text-align: right;
}

total-info title{
    font-size: 18px;
    font-weight: bold;
    line-height: 1.2;
    display: inline-block;
}

total-info amount{
    font-size: 24px;;
    font-weight: bold;
    line-height: 1.2;
}

total-info{
    margin-top: 15px;
    padding-top: 15px;
    padding-bottom: 15px;
    border-top: 1px solid #e3e3e3;
}

sub-info sub-total{
    padding-bottom: 4px;
}
sub-info{
    padding-left: 10px;
    padding-right: 10px;
    display: block;
}

total-info{
    margin-left: 10px;
    margin-right: 10px;
    /* display: flex; */
}

cart button.next{
    display: block;
    width: 100%;
    font-size: 18px;
    border-color: rgb(97, 110, 215);
    color: rgb(97, 110, 215);
    font-weight: bold;
    line-height: 1.2;
    text-align: center;
    /* border: 2px solid rgb(226, 226, 226); */
    border-radius: 9px;
    background-color: rgb(255, 255, 255);
    height: 49px;
    /* box-shadow: 0 3px 10px 0 rgba(0,0,0,.15); */
}
cart button.next:hover{
    background-color: rgb(97, 110, 215);
    border-color: rgb(97, 110, 215);
}

/* -------- QR CODE ON FOOTER --------- */

qr-code img {
    max-width: 90px;
}

.qr-code-section {
    display: flex;
    justify-content: flex-start;
}

qr-info .qr-title {
    font-size: 24px;
    font-weight: bold;
}

qr-info .qr-sub {
    font-weight: bold;
    line-height: normal;
}

qr-info .qr-url {
    font-size: 13px;
}

qr-info {
    padding-top: 12px;
    padding-left: 11px;
}

@keyframes blinkingText {
    0% {
        color: #000;
    }

    49% {
        color: #e6bc0a;
    }

    50% {
        color: #07ef10;
    }

    99% {
        color: transparent;
    }

    100% {
        color: #000;
    }
}

/* Extra small devices (portrait phones, less than 576px) */
@media all and (max-width: 575.98px) {
   
    .webmail {
        display: none;
    }

    .slogan {
        font-size: 17px;
        color: rgb(0, 0, 0);
    }

    #counter-section .statCounter{
        margin: 0;
    }

    .desktop-menu{
        display: none;
    }

    #menu{
        float: right!important;
    }
    #menu i{
        margin-top: 0!important;
    }
}

/* Small devices (landscape phones, 576px and up) */
@media all and (min-width: 576px) and (max-width: 767.98px) {

    .webmail {
        display: none;
    }

    .slogan {
        font-size: 17px;
        color: rgb(0, 0, 0);
    }

   .content-main{
        height: auto;
        min-height: 196px;
    }

    #counter-section .statCounter .stat-unit {
        text-align: right;
        padding-right: 0;
    }
    #counter-section .statCounter{
        margin: 0;
    }

    #menu{
        float: right!important;
    }
    #menu i{
        margin-top: 0!important;
    }
}

/* Medium devices (tablets, 768px and up) */
@media all and (min-width: 768px) and (max-width: 991.98px) {

    #counter-section .statCounter .stat-unit {
        text-align: right;
        padding-right: 0;
    }
    #counter-section .statCounter{
        margin: 0;
    }

}

/* Large devices (desktops, 992px and up) */
@media all and (min-width: 992px) and (max-width: 1199.98px) {
    .sky-mega-menu li a {
        padding: 3px 9px!important;
    }
   
    .side-menu, #navSidebar, #menu{
        display: none;
    }
}

/* Extra large devices (large desktops, 1200px and up) */
@media all and (min-width: 1200px) {
    .side-menu, #navSidebar, #menu{
        display: none;
    }
}