/******************
Author: Aria
Version: 1.1
Last updated: 2020

1. #014d7e dark-blue
*******************/


/********************
Basic SETUP 
********************/

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

body {
    font-family: "franklin-gothic-urw", "Helvectica Neue", helvetica, clean, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    color: #535353;
    background-color: #fff;
    margin-top: 20px;
}

.row,
.header-row {
    max-width: 1140px;
    margin: 0 auto;
}


section {
    padding-top: 70px;
}

.section-heading {
    font-size: 180%;
    font-weight: 900;
    text-align: center;
    padding-bottom: 30px;
}
/********************
Headings 
********************/

h1,
h2,
h3,
h4,
h5 {
    font-family: "Raleway", "franklin-gothic-urw", "Lato", lato, clean, sans-serif;
    font-weight: 600;
    line-height: 1.4;
    color: #555;
}


h2 {
    font-weight: 100;
    font-size: 120%;
}
h4 {
    font-size: 90%;
    font-weight: 100;
}

h5 {
    font-size: 150%;
    font-weight: 100;
    margin-bottom: 10px;
}

a {
    text-decoration: none;
    color: #333;
    padding: 10px 20px;
}



/********************
Navigation 
********************/

.mobileNav {
    display: none;
}

.full-nav {
    position: relative;
}
.nav-top-right {
    list-style: none;
    position: absolute;
    right: 1%;
    float: right;
}

.nav-top-right li {
    display: inline-block;
    margin-right: 40px;
    font-size: 110%;
}
.nav-top-right li:last-child {
    margin-right: 0;
}


.nav-top-right li a:hover ,
.nav-main li a:not(.btn):hover {
    background-color: #F7F7F7;
    padding: 10px 20px;
}

.nav-main {
    list-style: none;
    position: absolute;
    top: 47px;
    right: 1%;
    
}

.nav-main li {
    display: inline-block;
    font-weight: 900;
    font-size: 120%;
}


.nav-main li:last-child {
    margin-left: 10px;
}

/********************
Header 
********************/

.logo {
    width: 18%;
    margin-top: 10px;
}

.discount-banner {
    background-color: #F7F7F7;
    color: #717171;
    font-size: 160%;
    text-align: center;
    padding: 10px 0;
    margin-top: 30px;
    font-weight: 900;
}

header {
    background-image: url(img/home-hero-blue.jpg);
    background-size: cover;
    width: auto;
    position: relative;
    padding-bottom: 40px;
    
}

.features-left,
.features-right {
    color: #fff;
    list-style: none;
    font-family: "Lato";
    font-size: 140%;
    font-weight: 100;
}

.hero-features-box {
    position: relative;
    
}

.features-left li,
.features-right li {
    margin-bottom: 10px;
}

.features-left {
    margin-top: 20px;
    
}
.features-right {
    position: absolute;
    top: 5%;
    left: 27%;
}

.icon-s {
    font-size: 140%;
    color: #6ace26;
    
}

.head-text-box {
    margin-top: 80px;
}

.offer-signup,
.offer-signup-other {
    float: right;
    background-color: rgba(0, 48, 79, 0.35);
    width: auto;
    border-radius: 10px;
    margin: 0rem auto;
    margin-top: -300px; 
}
.offer-signup {
    max-width: 300px;
    padding: 17px;
    z-index: 1;
    position: relative;
}
.offer-signup-other {
    padding: 20px 50px;
    max-width: 400px;
    margin-top: -160px;
}

.currency,
.currency-other {
    line-height: 1;
    vertical-align: middle;
    margin-top: -80px;
    display: inline-block;
}
.currency {
    font-size: 72px;
}
.currency-other {
    font-size: 56px;
}

.offer-price,
.offer-price-other {
    background: none;
    font-family: "franklin-gothic-urw", "Helvectica Neue", helvetica, clean, sans-serif;
    font-size: 155px;
    line-height: 0.95;
    font-weight: bold;
    position: relative;
    margin: -5px 0 0 0;
}
.offer-price-other {
    font-size: 116px;
}

.decimal,
.decimal-other {
    margin-left: -5px;
    font-size: 72px;
    letter-spacing: -2px;
    line-height: 1;
    vertical-align: super;
    display: inline;
}
.decimal-other {
    font-size: 56px;
}
.offer-price small,
.offer-price-other small {
    color: #fff;
    font-smoothing: antialiased;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 36px;
    margin-left: -80px;
    display: inline;
}
.offer-price-other small {
     font-size: 29px;
    margin-left: -60px;
    font-weight: 100;
}

.offer-price::after
.offer-price-other::after {
    display: none;
}

.btn-container,
.btn-container-other {
    color: #fff;
    margin: 20px;
}

.offer-signup h3,
.offer-signup h4,
.offer-signup-other h3,
.offer-signup-other h4 {
    text-align: center;
    color: #fff;
}
.offer-signup h2,
.offer-signup-other h2,
.head-text-box h1,
.head-text-box-other h1 {
    color: #fff;
}

.offer-signup h4 span,
.offer-signup-other h4 span {
    text-decoration: line-through;
}

.offer-signup h2 small {
    font-weight: 300;
}

.plan-extra-text {
    font-size: 210%;
    font-weight: 600;
    color: #154D7E;
}

.par-green {
    display: block;
    border-left: 2px solid #C3BFBA;
    height: 110px;
    margin-top: -9%;
    margin-left: 24.8%;
    position: relative;
    z-index: -1;
}

.par-green::after {
    background-color: #fff;
    border-right: 2px solid #c3bfba;
    border-top: 2px solid #c3bfba;
    content: "";
    height: 20px;
    margin-top: -10px;
    position: absolute;
    left: -11px;
    bottom: 43px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    width: 20px;
}

.extra-text-box {
    margin-top: -20px;
    position: relative;
}
.extra-features {
    padding-bottom: 20px;
    box-shadow: 0 2px 2px 0 #C3BFBA;
    z-index: 1;
    position: relative;
    
}

 
.plan-extra-text {
    padding-bottom: 8px;
}


.features-logo-box {
    position: absolute;
    right: -8px;
    bottom: 10px;
  
}

.features-text {
    font-size: 120%;
    margin-left: 15px;
}

.features-logo {
    width: 175px;
    margin-right: 30px;
}

/********************
Buttons
********************/

.btn {
     border-radius: 20px;
    box-shadow: 0 0 2px 0 rgba(0,0,0,0.12), 0 2px 2px 0 rgba(0,0,0,0.24);
}

.btn-full {
    background-color: #2ecc71; /*#6ace26*/
    color: #fff;
}

.btn-full:hover {
    background-color: #75e32b;
    transition: background-color, .3s;
    
}

.btn-big,
.btn-big-other {
    font-size: 150%;
    border-radius: 30px;
    padding: 15px 35px;
    
}

.btn-big-other {
    font-size: 110%;
    
}

.btn-medium,
.btn-medium-1,
.btn-medium-2,
.btn-medium-3 {
    font-size: 120%;
    border-radius: 50px;
    padding: 15px 40px;
}

.btn-medium-1 {
    background-color: #0f92e6;
    margin-right: 30px;
}
.btn-medium-1:hover {
    background-color: #1aa2f8;
}

.btn-medium-2 {
    background-color: #0f92e6;
}
.btn-medium-2:hover {
    background-color: #1aa2f8;
}
.btn-sign-up {
    padding: 15px 50px;
    font-size: 130%;
    border-radius: 50px;
}

.btn-search {
    font-size: 140%;
    padding: 16px 80px;
    border-radius: 100px;
    border: 0;
}
/********************
iCONS
********************/
.openIcon,
.closeIcon {
    display: none;
}

.mob-icon {
    display: none;
}

.big-icon {
    font-size: 460%;
    margin-left: 148px;
    margin-bottom: -20px;
    color: #014d7e;
}

.social-icon {
    font-size: 300%;
    color: #fff;

    
}

.social-icon:hover {
    color: #b9b9b9;
}
/********************
Section Main Features
********************/

.main-features-text-box {
    text-align: center;
}

.main-features-pr {
    font-size: 114%;
}
.more-features-btn {
    margin-top: 40px;
    text-align: center;
}

.main-features {
    box-shadow: 0 2px 2px 0 #C3BFBA;
    padding-bottom: 80px;
    background: #f0fff0;
    
     
}


/********************
Section Main Features
********************/
.introducery-pr {margin-bottom: 50px;}

footer {
    background-color: #014d7e;
    padding-bottom: 50px;
}

.ft-menu-box  {
    margin: 70px 0;
}

.ft-menu-box ul li a {
    color: #fff; 
}
.ft-menu-box ul li a:hover {
    color: #b9b9b9; 
}
.ft-menu-box ul li {
    list-style: none;
    margin-bottom: 3px;
}

.ft-logo {
    float: right;
    margin-top: -170px;
}
.ft-logo-box p {
    float: right;
    margin-top: -100px;
    color: #fff;
    margin-right: -12px;
}

.social-icons {
    float: right;
    margin-top: -70px;
    margin-right: 60px;
}

.social-icons a {
    margin-right: -25px;
    display: inline-block !important;
}




/********************
PAGE:: hosting features
********************/
/********************
PAGE:: header
********************/
.head-hero {
    background-image: url(img/hosting-features-hero.jpg);
    background-size: cover;
    height: 35vh;
    margin-top: 20px;
}

.hero-text h1 {
    color: #fff;
    font-size: 250%;
    font-weight: 400;
    letter-spacing: 2%;
    margin-bottom: 10px;
    margin-top: -10px;
}

.hero-text p {
    color: #fff;
    font-size: 140%;
    letter-spacing: 3%;
    font-weight: 100;
}

/********************
PAGE:: all features
********************/
.all-features {
    background: #f0fff0;
    padding-bottom: 100px;
}

.all-features h2 {
    font-size: 190%;
    text-align: center;
    padding-bottom: 30px;
}

.hosting-features-box {
    background: #fff;
    padding: 15px;
    border-radius: 10px;
    box-shadow: 0 0 2px 0 #C3BFBA, 0 2px 2px 0 #C3BFBA;
    margin: 7px 7px;
}
.hosting-features-box ul li {
    list-style: none;
    font-size: 110%;
    padding: 10px 0;
    border-top: 1px solid #dfe6df;
}

.hosting-features-box ul li:first-child {
    border-top: 0;
}

.hosting-features-box ul,
.hosting-features-box h3 {
    padding: 0 0 0 130px;
}

.hosting-features-box h3 {
    font-size: 160%;
    font-weight: 200;
    padding-bottom: 15px;
}

.feature-icon {
    float: left;
    padding-top: 50px;
}

.buy-now-box {
    padding-top: 50px;
}

.price-hosting {
   text-align: center;
}

.price-now {
    font-size: 300%;
    color: #2ecc71;
}

.price-regular {
    font-size: 110%;
}
.price-regular {
    text-decoration: line-through;
}

.regularly {
    margin-bottom: 30px;
} 




/********************
PAGE:: web design
********************/
.align-head-text p,
.align-head-text h1
{
    text-align: center;
}

.web-design-head {
    box-shadow: 0 2px 2px 0 #C3BFBA;
    z-index: 1;
    position: relative;
    padding: 10px 0;
}

.icon-and-text-box {
    padding: 10px 0;
    padding: 20px 0;
}

.icon-and-text-box img {
    float: left;
}

.icon-and-text-box h3,
.icon-and-text-box p {
    margin-left: 80px; 
}

.icon-and-text-box h3 {
    padding-top: 2px;
}

.plan-top-head-text-box p {
    text-align: center;
    margin-top: -20px;
    font-size: 120%;
}


.plan-box {
    background: #fff;
    width: 50%;
    padding: 20px 0 35px 0;
    text-align: center;
    box-shadow: 0 0 2px 0 rgba(0,0,0,0.12), 0 2px 2px 0 rgba(0,0,0,0.24);
    margin-top: 80px;
}

.plan-title {
    font-size: 200%;
}

.plan-price {
    font-size: 120%;
}

.line-break {
    border-bottom: 1px solid #d1d1d1;
    padding: 5px;
}

.plan-box ul {
    padding: 15px 0;
    list-style: none;
}

.plan-box ul li {
    padding-bottom: 10px;
}

.pro {
    box-shadow: inset 0px 0px 0px 1px #0f92e6, 0 0 2px 0 rgba(0,0,0,0.12), 0 2px 2px 0 rgba(0,0,0,0.24);
    
    
}

.pro::before {
   content: 'WE RECOMMEND';
    font-size: 18px;
    font-weight: bold;
    color: #fff;
    background-color: #0f92e6;
    padding: 12px 0;
    display: block;
    margin-top: -71px;
    
}

.plan-head-pro {
    margin-top: 20px;
}

.starter {
    margin-left: 50%;
    
}

.overline {
    text-decoration: line-through;
}


.send-request {
    background-image: url(img/on-phone-1440x717.jpg);
    width: 100%;
    height: 85vh;
}

.send-request-box,
.send-request-form {
    margin-top: -25px;
}

.send-request form label {
    color: #fff;
    float: left;
    font-size: 120%;
    font-weight: 100;
    margin-top: 50px;
}

.send-request form input {
    background: transparent;
    box-shadow: none;
    border: none;
    border-bottom: 1px #e6e6e6 solid;
    border-radius: 0;
    color: #fff;
    height: 5rem;
    padding: 1.5rem 0 1rem;
    width: 99%;
}

::placeholder {
    color: #dbdbdb;
    font-weight: 100;
    font-size: 90%;
    
}

.send-request form input {
    -webkit-writing-mode: horizontal-tb !important;
    text-rendering: auto;
    
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: start;
    appearance: textfield;
    font-weight: 100;
    letter-spacing: 1px;
    line-height: 145%;
    -webkit-rtl-ordering: logical;
    cursor: text;
    font: 110% Arial;
    padding: 1px 2px
}

.send-request input:focus{
    outline: none;
}

.send-request h2,
.send-request p {
  color: #fff;  
}

.send-request h2 {
    font-size: 250%;
    font-weight: 100;
    margin-bottom: 7px;
    letter-spacing: 1px;
}

.send-request p {
    font-size: 110%;
    margin-bottom: 40px;
    line-height: 145%;
    font-weight: 100;
}

.send-now {
    padding: 40px 0;
    text-align: center;
}


/********************
PAGE:: domains
********************/
 
.domains-header {
    background-image: url(img/domains-hero-blue.jpg);
    width: 100%;
    height: 50vh;
    margin: 20px 0;
}

.search-input-box {
    width: 55%;
    height: 55px;
    margin-left: 150px;
    margin-right: 10px;
    padding: 1%;
    color: #2ecc71;
    font-size: 130%;
    border: 0; 
}

.domain-search-box {
    margin-top: 40px;
}
 
.domain-search-box input:focus{
    outline-color: #2ecc71;
}

.domain-icon-box img {
    float: left;
    margin-right: 20px;
    margin-bottom: 160px;
    width: 20%;
}

.domain-icon-box h2 {
    font-size: 160%;
}


.domain-icon-box {
    margin-bottom: 50px;
}


/********************
PAGE:: About Us
********************/
.head-hero-about {
    background-image: url(img/hero-about.jpg);
    width: 100%;
    height: 29vh;
    margin: 20px 0;
}

.head-hero-about h1 {
    margin-top: 20px;
}

.about p {
    font-size: 140%;
    font-weight: 100;
}

.left,
.right {
    width: 90%;
    text-align: justify;
    font-size: 110%;
}

.right {
    margin-left: 30px;
}

.grey {
    background-color: #fafafa;
    padding-bottom: 50px;
}

.about-btn {
    margin-top: 40px;
}

.price {
    color: #2ecc71;
    font-size: 280%;
    font-weight: 600;
}

.h3 {
    font-size: 150%;
    margin-top: 20px;
}



/********************
PAGE:: Affiliate
********************/
.affiliate-text-box {
    text-align: center;
}

.affiliate-text-box h2 {
    font-size: 190%;
}

.top-affiliate {
     box-shadow: 0 2px 2px 0 #C3BFBA;
    padding-bottom: 60px;
    z-index: 1;
    position: relative;
    
}

.affiliate-login {
    background-image: url(img/af-login.jpg);
    height: 40vh;
    width: 100%;
    text-align: center;
    
}

.affiliate-login h3 {
    font-size: 180%;
}

.affiliate-login p {
    margin-bottom: 40px;
}

.register-or-login {
    margin-top: 30px;
}

.af-pad,
.af-pad-1 {
    font-size: 120%;
}

.af-pad {
    padding: 10px 110px;
}

.af-pad-1 {
    padding: 10px 30px;
   
}
.wrapper {
    width: 46%;
    margin: 40px auto 10px auto;
    border-bottom: 1px solid #cecece;
    
}
.affiliate-terms {
    font-size: 110%;
}

.affiliate-terms:hover {
    color: #fd8f31;
}


/********************
PAGE:: Contact
********************/

.contact-form input,
.contact-form textarea {
    border-radius: 4px;
    border: 1px solid #ccc;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    font-size: 140%;
    font-family: "franklin-gothic-urw", "Helvectica Neue", helvetica, clean, sans-serif;
    color: #808080;
}

.contact-form input {
    width: 100%;
    padding: 20px 1%;
    margin-bottom: 2%;
    
}

.contact-form textarea {
    width: 100%;
    padding: 7px 1% 20px 1%;
    
}

.contact-form input:focus,
.contact-form textarea:focus{
    outline: none;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
}

.contact-form p {
    width: 100%;
}

.contact-form a {
    width: 100%;
    margin-left: 163px;
    padding: 15px 60px;
    border-radius: 50px;
}

.wrap {
    margin-top: 10px;
}

.wrap-big {
    margin-top: 50px;
}


.contact-sidebar {
    background-color: #F7F7F7;
    padding: 50px 40px;
    float: right;
    width: 100%;
    border-radius: 4px;
    text-align: center;
}

.contact-sidebar h3 {
    font-size: 140%;
}
.contact-sidebar p {
    color: grey;
}
.contact-sidebar p span {
    font-size: 130%;
    font-weight: 400;
    color: #2ecc71;
}




/********************
PAGE:: Terms
********************/
.terms-box {
    background-color: #f4f4f4;
    padding: 15px;
    margin-bottom: 30px;
}

.terms-title {
    font-size: 120%;
    padding: 1.5% 0;
    color: #1c1c1c;
    margin-top: 2%;
}

.terms-paragraph {
    text-align: justify;
}

.terms-space-between-paragraphs {
    padding: 2% 0;
}


.sub-inside-terms-text li {
    padding: 8px 0;
    margin-left: 40px;
}

.terms-box h2 {
    margin-top: 20px;
    border: 2px solid #ffffff;
    padding: 5px;
}

.terms-sidebar-menu li {
    list-style: none;
}

.terms-sidebar-menu {
    margin-top: 35px;
}

.terms-sidebar-menu li {
    margin-top: 20px;
    background-color: #2ecc71;
    width: 70%;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
}
.terms-sidebar-menu li a {
    color: #fff;
    width: 100px;
    
}

.terms-sidebar-menu li:hover {
   background-color: #75e32b;
}

.privacy-title {
    font-size: 100%;
    font-weight: 700;
}

.privacy-p {
    margin-bottom: 10px;
}

.openIcon {display: none;}
.close {display: none;}


/**********************************************************
**************************Media queries********************
***********************************************************/

@media (max-width: 1200px) and (min-width: 1100px)  {
    .row { width: 1024px;}
    .par-green { margin-left: 23.8%;}
    .plan-extra-text {font-size: 190%;}
    .extra-text-box h3 {font-size: 107%;}
    .features-logo {width: 160px; margin-right: 30px;}
    .features-text {font-size: 110%; margin-left: 13px;} 
    
}

@media (max-width: 1100px) and (min-width: 968px) {
    .row { width: 900px;}
    .par-green { margin-left: 25.5%;}
    .plan-extra-text {font-size: 170%; padding-bottom: 0;}
    .extra-text-box h3 {font-size: 95%;}
    .features-logo {width: 140px; margin-right: 20px;}
    .features-text {font-size: 100%; margin-left: 13px;}
    .features-right {left: 33%;}
    .big-icon {margin-left: 112px;}
    .ft-logo { margin-right: 20px;}  
}

@media (max-width: 968px) and (min-width: 768px) {
    .row { max-width: 710px;}
     body {overflow-x: hidden;}
    .par-green { margin-left: 25.5%;}
    .plan-extra-text {font-size: 170%;}
    .extra-text-box h3 {font-size: 95%;}
    .features-logo {
        width: 140px; 
        margin-right: 20px;
    }
    .features-text {
        font-size: 100%; 
        margin-left: 13px;
    }
    .features-right {
        position: absolute;
        left: 30%;
    }
    .logo {width: 170px;}
    .nav-top-right li {margin-right: 5px;}
    .nav-main li {font-size: 102%;}
     a {
        padding: 8px;
        font-size: 102%;
    }
    .nav-top-right li a:hover,
    .nav-main li a:not(.btn):hover {padding: 8px;}
    .opt {
        font-size: 95%;
        padding: 8px 12px;
    }
    .discount-banner {font-size: 140%;}
    h1 { font-size: 150%;}
    
    
/*********offer signup ********/
    .offer-signup {
    margin-top: -250px;
    margin-right: -8px;
    }

    .currency {font-size: 42px;}
    .offer-price {font-size: 120px;}
    .decimal {font-size: 62px;}
    .offer-price small {font-size: 29px;}
    .btn-big {font-size: 110%;}

    .features-left,
    .features-right {font-size: 115%;}
    .features-right {
        left: 32%;
        position: relative;
        margin-top: -140px;
        margin-left: -10px;
    }

    .par-green { 
        margin-left: 25.5%;
        margin-top: -50px;
    }
    .plan-extra-text {
        font-size: 149%;
        position: absolute;
        top: 50px;
    }
    .extra-text-box h3 {
        font-size: 85%; 
        font-weight: 100;
        position: absolute;
        top: 30px;
    }
    .features-logo {
        width: 120px; 
        margin-right: 5px; 
        margin-left: 0;
    }
    .features-text {
        font-size: 82%;
        margin-left: 4px;
    }
    .features-logo-box {right: -30px;}
    .extra-text-box {margin-top: -30px;}
    .features-logo-box {bottom: 26px;}
    .extra-features {
        padding-bottom: 10px;
        padding-top: 60px;
    }
    .ft-logo { margin-right: 20px;}
    .social-icon {font-size: 280%;}
    .social-icon:first-child  {margin-right: 15px;}
    .btn-medium-1,
    .btn-medium {
        font-size: 100%;
        border-radius: 50px;
        padding: 15px 40px;
    }

    .big-icon {margin-left: 83px;}
    .main-features-text-box h5 {font-size: 130%;}
}


@media (max-width: 767px) and (min-width: 480px), 
(max-width: 480px) and (min-width: 280px) {
    .logo {width: 25%;}
    .nav-top-right,
    .nav-main {display: none;}
    
    .openIcon {
        display: block;
        float: right;
        
        font-size: 250%;
        margin-right: 3%;
        cursor: pointer;
        color: #717171;
    }
    .close {
        font-size: 350%;
        position: fixed;
        top: -3px;
        right: 180px;
        cursor: pointer;
        color: #717171;
        display: none;
    }
    
    .mobileNav {
        background-color: #014d7e;
        color: #fff;
        float: right;
        
        position: fixed;
        right: 0;
        top: 0;
        bottom: 0;
        z-index: 2;   
    } 
   .mobileNav ul {
        width: 100%;
        border-bottom: 1px solid rgb(5, 89, 144);
        margin-top: 10px; 
    }
    .mobileNav ul:first-child {
        margin-top: 20px;
    }
    .mobileNav ul li {
        list-style: none;
        padding: 10px 70px 10px 10px;
    }

    .mobileNav ul li a {
        color: #fff;
    }
    .mobileNav ul li:hover {
        background-color: #015489;
        padding: 10px 70px 10px 10px;
    } 
    
}


/****************************/
@media (max-width: 767px) and (min-width: 480px) {
    .hero-features-box,
    .features-right {display: none;}
    .head-text-box h1 {
        font-size: 20px;
        text-align: center;
    }
    
    header {
    
    background-size: cover;
    width: auto;
    position: relative;
    height: 83vh;
    background-position: center;
    }
    
    .offer-signup {
        position: absolute;
        right: 50%;
        top: 300px;
        transform: translateX(50%);
        position: relative;

    }
    
    /************************/
    
    .plan-extra-text {
    font-size: 210%;
    font-weight: 600;
    color: #154D7E;
}

.par-green,
.par-green::after {display: none;}

.extra-text-box {
    margin-top: 20px;
    position: relative;
}
.extra-features {
    padding-bottom: 45px;
    box-shadow: 0 2px 2px 0 #C3BFBA;
    z-index: 1;
    
}

 
.plan-extra-text,
.extra-text-box h3 {
    position: absolute;
    top: -80px;
    left: 50%;
    transform: translateX(-50%);
    
}
    
    .extra-text-box h3 {
        font-size: 14px;
    }
    .plan-extra-text {
        margin-top: 13px;
        font-size: 25px;
    }




 .features-logo-box {
    position: absolute;
    right: -8px;
    top: -40px;
  
}


.features-text {
   display: none;
    
    
}

.features-logo {
   position: relative;
    width: 100%;
    margin: 10px 10px 0 10px;
}  
    
    .span-1-of-3 {
        width: 100% !important;
        position: relative !important;
    }
    
   .main-features-text-box {
        margin-bottom: 100px !important;
    }
    .last-child {
        margin-bottom: 0 !important;
    }
    
    .big-icon {display: none;}
    
   .mob-icon {
    font-size: 460%;
    display: block;
    color: #014d7e;
    position: absolute;
    left: 45%;
    transform: translateX(-50%);
    top: -70px;
    }

    .introducery-pr {
        text-align: center;
        margin-right: 10px;
        margin-left: 10px;
    }
    .ft-menu-box ul {
        display: none;
    }
    .ft-logo {
        float: right;
        margin-top: -80px;
        margin-right: 55px;
        
        
        }
    .logo {
        width: 170px;
    }
.ft-logo-box p {
    float: right;
    margin-top: -10px;
    color: #fff;
    margin-right: 32px;
}
    
    .social-icons {
    position: absolute;
    left: 20px;
    }
    
    footer {
        padding-top: 20px
    }

}

/***********************************/
/***********************************/
/***********************************/
/***********************************/
@media (max-width: 480px) and (min-width: 280px) {
    
    .logo {
        width: 50%;
    }
    
    header {
    height: 600px;
    background-position: center;
    }
    .head-text-box {}
    .hero-features-box,
    .features-right {display: none;}
    .offer-signup {
        position: absolute;
        right: 50%;
        top: 300px;
        transform: translateX(50%);
        position: relative;

    }
    
    section {padding-top: 40px;}
    .head-text-box h1 {
        text-align: center;
        font-size: 150%;
    }
    
    .extra-features {
        padding-bottom: 10px;
    }
.par-green,
.par-green::after {display: none;}
    
    .extra-text-box h3,
    .extra-text-box p {
        text-align: center;
    }
    
    .extra-text-box h3 {
        font-size: 90%;
    }
    
    .extra-text-box p {
        font-size: 160%;
    }

    .features-logo-box p,
    .features-logo-box {
        display: none;
    }
    
    .main-features-text-box {
        margin-bottom: 100px !important;
    }
    .last-child {
        margin-bottom: 30px !important;
    }
    .big-icon {display: none;}
    .span-1-of-3 {
        width: 100% !important;
        position: relative !important;
    }
   .mob-icon {
    font-size: 460%;
    display: block;
    color: #014d7e;
   position: absolute;
       top: -70px;
       left: 40%;
       transform: translateX(-50%);
       
    }
    
    .section-heading {margin-bottom: 80px;}
    .more-features-btn a {display: block;}
    
    .btn-medium-1,
    .btn-medium {
        font-size: 100%;
        border-radius: 50px;
        padding: 15px 30px;
        margin-right: 0;
        width: 80%;
        margin: 30px auto;
    }
    
    .introducery-pr {
        text-align: center;
        margin-right: 10px;
        margin-left: 10px;
    }
    
    
    .ft-menu-box ul {
        display: none;
    }
    
    .logo {
        width: 170px;
    }

     .ft-logo-box {
        position: relative;
    }
    
    .ft-logo-box img,
    .ft-logo-box p {
        float: none;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        
    }
    
    
    .ft-logo-box p {
        margin-top: -120px;
      
        font-size: 10px;
        
    }
    .social-icons {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -18px;
        
    }
    
    .social-icons a:not(:last-child) {
    margin-right: -35px;
}
    
    
    
    footer {
        padding-top: 20px;
        padding-bottom: 1px;
            
    }

}




/******************************
Media queries for web-hosting
*******************************/
@media (max-width: 1100px) and (min-width: 968px) {
    
    .hosting-features-box h3 {
        font-size: 130%;
    }
    .hosting-features-box ul li {
        font-size: 95%;
    }
}

@media (max-width: 968px) and (min-width: 768px) {
   
    .feature-icon img {
        width: 100%;
    }
    
    .box {
        width: 100% !important;
        margin: 0 !important;
    }
}

@media (max-width: 767px) and (min-width: 480px) {
    .box {
        width: 100% !important;
        margin: 0 !important;
    }
    
    .row {
        max-width: 650px;
    }
    
    
    
    
    /************/

.offer-signup-other {
    padding: 20px 30px;
    max-width: 400px;
    margin-top: -140px;
}

.currency-other {
    line-height: 1;
    vertical-align: middle;
    margin-top: -80px;
    display: inline-block;
     font-size: 36px;
}

.offer-price-other {
    font-size: 96px;
}

.decimal-other {
    margin-left: -1px;
    font-size: 52px;
}

.offer-price-other small {
     font-size: 29px;
    margin-left: -60px;
    font-weight: 100;
}

.btn-container-other {
    color: #fff;
    margin: 10px;
}
    .offer-signup-other h4 {
        padding-bottom: 10px;
    }

    .full {
       position: absolute;
        left: 50%;
        top: 450px;
        transform: translateX(-50%);
    }
    .head-hero-web-hosting {height: 60vh;}
  
    .hero-text h1,
    .hero-text p {
      text-align: center;
    }
    .hero-text h1 {font-size: 30px;}
    .hero-text p {
        font-size: 20px;
        font-weight: 100;
    }
   .btn-big-other {font-size: 95%;} 
}


@media (max-width: 480px) and (min-width: 280px) {
.head-hero-web-hosting {height: 520px; position: relative;}
    .offer-signup-other {
    padding: 20px 5px;
    max-width: 300px;
    margin-top: 40px;
        position: absolute;
        margin-left: 75px;
        
    
    
}
    
    /*.full {
       position: absolute;
        left: 50%;
        transform: translateX(-50%);
    }*/
    
    .hero-text h1,
    .hero-text p {
      text-align: center;
    }
    
    .btn-big-other {
    font-size: 100%;
    border-radius: 30px;
    padding: 10px 30px;
    
}
    
    .currency-other {
    font-weight: 100;
     font-size: 36px;
}
    
    .btn-container-other {
    margin: 15px 0;
}
    
    .full {
        position: relative;
    }
}

/******************************
Media queries for web-design
*******************************/
@media (max-width: 968px) and (min-width: 768px) {
.btn-medium,
.btn-medium-2 {
    font-size: 90%;
}
    
}

@media (max-width: 767px) and (min-width: 480px) {
    
    .web-design .row {
        width: 460px;
    }
    .plan-mob {
        width: 100% !important;
       
    }
    
    .plan-box {
        width: 100% !important;
       
    }
    .starter {
        margin-left: 0;
    }
    .web-design .col {
        margin: 0 !important;
    }  
}

@media (max-width: 480px) and (min-width: 280px) {
    
    .web-design-head {
        padding-left: 15px;
    }
    
    .plan-mob {
        width: 100% !important;
       
    }
    
    .plan-box {
        width: 100% !important;
        
       
    }
    .starter {
        margin-left: 0;
    }
    .web-design .col {
        margin: 0 !important;
    }  
    
    .send-request {
    
    height: 950px;
    background-position: left;
    }
    
    .send-request-box,
    .send-request-form {
        margin-left: 10px;
        margin-right: 5px;
    }
    
}
/******************************
Media queries for domains
*******************************/

@media (max-width: 968px) and (min-width: 768px) {
.btn-search {
   position: absolute;
    top: 51%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 120%;
    padding: 12px 60px;
}
    
}

@media (max-width: 767px) and (min-width: 480px) { 
    
    .domain-icon-box {
        margin: 0 10px 20px 10px;
    }
    .btn-search {
   position: absolute;
    top: 51%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 120%;
     
    padding: 12px 60px;
}
    .search-input-box {
    margin: 0;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
    .domain-icon-box img {
    margin-bottom: 20px;
        width: 70px;
    }
    
}


@media (max-width: 480px) and (min-width: 280px) {
    
    .domain-icon-box {
        margin: 0 10px 20px 10px;
    }
    .btn-search {
    position: absolute;
    top: 380px;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 120%;
    padding: 12px 60px;
    }
    .search-input-box {
    margin: 0;
    position: absolute;
        top: 280px;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
}
    .domain-icon-box img {
    margin-bottom: 40px;
        width: 70px;
    }
    
    .domains-header {height: 325px;}
}



/******************************
Media queries for about-us
*******************************/
@media (max-width: 1200px) and (min-width: 1100px) {
    
    .right {margin-left: 90px;}
}

@media (max-width: 1100px) and (min-width: 968px) {
    
    .about-us-box img {
        width: 110%;
    }
    .right {margin-left: 90px;}
}

@media (max-width: 968px) and (min-width: 768px) {
    
    .about-us-box img {
        width: 110%;
    }
    .right {margin-left: 70px;}
    
}

@media (max-width: 767px) and (min-width: 480px) {
    .full-width {
        width: 100% !important;
    }
    .left,
    .right {width: 100%; margin: 0;}
    .about-us-box {
       margin-left: 20px;
       margin-right: 20px;
    }
    
    #right-img {
        width: 450px;
    }
    #left-img {
        width: 450px;
    }
    
    .about img {
        margin-left: 10px;
    }    
}

@media (max-width: 480px) and (min-width: 280px) {
    
    .head-hero-about {height: 200px;}
    .about-us-box img {
        width: 355px;
        margin-left: 10px;
    }
    .about-us-box p {
        margin-left: 15px;
    }
}

/******************************
Media queries for contact
*******************************/

@media (max-width: 1200px) and (min-width: 1100px) {
    
    .contact-form a {margin-left: 120px;}    
}

@media (max-width: 1100px) and (min-width: 968px) {
    
    .contact-form a {margin-left: 80px;}
}
    
@media (max-width: 968px) and (min-width: 768px) {
     
    .contact-form a {margin-left: 20px;}
}


@media (max-width: 767px) and (min-width: 480px) { 
    
   .contact-form a {
        margin-left: 80px;
        padding: 10px 30px;
    } 
    
    .form-box {width: 100% !important;}
    
    .contact-form {
        margin-left: 20px;
        margin-right: 20px;
    }
    
    
    .contact-sidebar {margin: 12px;}
}

@media (max-width: 480px) and (min-width: 280px) { 
    
  
    .contact-form a {
      width: 100%;
        padding: 15px 80px;
       font-size: 130%;
        display: block;
        margin: 0;
        
    } 
    
    .form-box {width: 100% !important;}
    
    .contact-form {
        margin-left: 20px;
        margin-right: 20px;
    }
    
    
    .contact-sidebar {margin-top: 70px;}
    
}

/******************************
Media queries for affiliates
*******************************/
@media (max-width: 968px) and (min-width: 768px) {
    .af-pad {padding: 10px 110px;}
}

@media (max-width: 767px) and (min-width: 480px) { 
    .af-pad {padding: 6px 60px;}
    .af-pad-1 {padding: 6px 30px;}
}

@media (max-width: 480px) and (min-width: 280px) {
    
    .align-head-text h1 {
        margin-top: -10px;
    }
    
    .af-pad,
    .af-pad-1 {
        display: block;
    }
    
    .af-pad {padding: 9px 20px;}
    .af-pad-1 {
        padding: 6px 20px;
        width: 80%;
        margin: 0 auto;
    }
}

/******************************
Media queries for terms
*******************************/

/******************************
Media queries for privacy
*******************************/

@media (max-width: 767px) and (min-width: 480px) { 
    
    .terms-sidebar-menu {
        margin-left: 20px;
    }
    
    .terms-box,
    .t-h-p {
        width: 140% !important;
        margin-left: 10px;
    }
     
}

@media (max-width: 480px) and (min-width: 280px) {
    .terms-sidebar-menu {
        display: none;
    }
    
    .terms-box,
    .t-h-p {
        width: 94.6% !important;
        margin-left: 10px;
    }
    
}