/* GENERIC */
body {font-family: Lato, Arial, serif;  font-weight: 400; font-size:20px; color: #424242; -moz-osx-font-smoothing:grayscale; -webkit-font-smoothing:antialiased; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; background-color: #fff;}
b, strong, h1, h2, h3, h4,h5, h6 {font-weight: 600;}
h1 {font-size:60px; line-height: 60px;}
h2 {font-size:40px; line-height: 40px;}
/*
h3 {font-size:60px;}
h4 {font-size:60px;}
h5 {font-size:60px;}
h6 {font-size:60px;}
*/
body.noscroll { overflow:hidden; }
header, footer{ width:100vw; max-width: 100%; background:#3dacb3; z-index:1000;transition:opacity 0.3s ease;}
header {position:fixed;top:0px; left:0px; height:72px; padding: 11px 0;}
main { margin:87px 0px 0px; transition:margin-top 0.3s ease;min-height:calc( 100vh - 187px ); }
a { color: #3dacb3; font-weight:600; }
a:hover { text-decoration:none; /*background-color: #a3d9dc;*/ color: #a3d9dc; }
a.read { font-weight: 400; }

img.responsive { max-width:100%; }

table.orders a { color: #555; }
table.orders a:hover { color: #999; }

.center { text-align: center; }
.justify { text-align: justify; }
.align-left { text-align: left; }
.align-right { text-align: right; }
.nopad { padding:0px; }
.hamburger { display:none !important; }


.due-colonne-disattivati p {
    /*Numero di colonne*/
    column-count: 2;
    /* Distanza tra le colonne*/
    column-gap: 30px;
    /*Stile per il bordo delle colonne
    column-rule: 1px solid #666;*/
    /*Amplifica il supporto alle vecchie versioni di Firefox e Chrome/Safari */
    -moz-column-count: 2;
    -moz-column-gap: 30px;
    -webkit-column-count: 2;
    -webkit-column-gap: 30px;
}

.product-desc p:last-child {margin-bottom: 0;}

nav ul { padding:0px; clear:both; }
nav ul li { list-style: none; float:left; padding-right: 12px; }
nav ul li span { padding-right: 12px; }

/* form label, form input { display: block; width:100%; } */
form .title { border-bottom: 2px solid #3dacb3; margin-bottom:12px; font-size: 1.1em; }

label.required::after { content:" *"; }
.round-check { border-radius: 50%; border: 1px solid #bababa; width: 30px; height: 30px; display: block; }
.round-check:hover { border: 2px solid #3dacb3;  }
/*.domain-form > div { border-radius: 4px; border: 1px solid grey; }
.domain-form div .domain-info { display:none; }
.domain-form div.checked .domain-info { display: block; }
.domain-form .checked .round-check { border: 2px solid #3dacb3; }
.domain-form .checked .round-check::before { content:"V"; width:24px; text-align:center; display:block; } */

/* BUTTONS */
.btn { border-radius: 0px; font-weight: 600; font-size: 1.2rem;}
.btn:hover {color: #3dacb3;}
.btn:focus { box-shadow: none; }
.btn-primary { color: #fff; background-color: #49a6c7; border: none;}
.btn-primary:hover { color: #fff; background-color: #3dacb3; }

.loading { animation: -webkit-animation:fa-spin 2s infinite linear; animation:fa-spin 2s infinite linear }
.loading::before{ content: 'A'; } /* content:"\f1ce"; */

/* COLORS */
.cyan { color: #3dacb3; }
.cyan-bg { background-color: #3dacb3; }
.lightcyan { color: #a3d9dc; }
.lightcyan-bg { background-color: #a3d9dc; }
.yellow { color: #eadf41; }
.yellow-bg { background-color: #eadf41 !important; }
.platinum { color: #f3f2e0; }
.grey {color: #424242;}
.grey-bg { background-color: #424242; }
.lightgrey { color: #d0d0c8; }
.white { color:#fff; }
.bold { font-weight: 600; }

.none { display:none; }

.icon-round {
    border-radius: 50%;
    background-color: #3dacb3;
    color: #fff;
    font-weight: 600;
    width: 1.1em;
    height: 1.1em;
    display: inline-block;
    text-align: center;
    font-size: 0.9em;
    line-height: 1.1em;
}

/* HEADER */

.logo {  }
.logo img { width: 100%; height: 100%; max-width: 260px; }
.menu-area { display:inline-block; float:left; }
.menu-area .logo { display: none; }
.menu-area ul {
    list-style: outside none none;
    padding: 0;
    margin-bottom:0px;
}
.menu-area ul li {
    display: inline-block;
    margin-right: 24px;
    position: relative;
    font-weight: 600;
}
.menu-area ul li a {
    font-weight:600;
    font-size:1em;
    color: #fff;
    display: block;
    letter-spacing: 0;
    padding: 8px;
    text-transform: capitalize;
}
/* -- */
.menu-area ul li:last-child {
    margin-right: 0;
}

.menu-area ul li:first-child a {
    padding-left: 0;
}

.menu-area ul li:last-child a {
    padding-right: 0;
}

.menu-area ul li:hover > a, .menu-area ul li.active a{
    color: #eadf41;
}

.menu-area ul li .menu-dropdown {
    box-shadow: 0 4px 12px -4px rgba(0, 0, 0, 0.75);
    min-width: 200px;
    opacity: 0;
    position: absolute;
    right: 0;
    text-align: left;
    top: 60px;
    transform: translateY(-20px);
    transition: all 0.3s ease 0s;
    visibility: hidden;
    display:none;
    z-index: 99;
}

.menu-area ul li:hover .menu-dropdown {
    opacity: 1;
    transform: translateY(0px);
    visibility: visible;
    display:block;
}

.menu-area ul li .menu-dropdown li {
    display: block;
    margin: 0;
    position: relative;
    text-align: left;
}

.menu-area ul li .menu-dropdown li a {
    display: block;
    padding: 13px 20px;
}

.menu-area ul li .menu-dropdown li a i {
    float: right;
    vertical-align: middle;
    padding-top: 3px;
}

.menu-area ul li .menu-dropdown li .thidlevel-menu {
    box-shadow: 0 4px 12px -4px rgba(0, 0, 0, 0.75);
    left: 100%;
    min-width: 200px;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: all 0.3s ease 0s;
    visibility: hidden;
}

.menu-user { opacity:0; position:fixed; top:0px; right: -320px; width: 320px; height: 100vh; z-index:100; background-color: #a3d9dc; transition: right ease 0.2s, opacity 0s ease 0.3s; }
.menu-user.active { opacity:1; right: 0px; transition: right ease 0.3s, opacity 0s; overflow: auto; }
.menu-user > .cyan-bg { padding: 11px 0px; height: 72px; }

/* .mobile-menu-user { display:none; } */
.mobile-menu-user li a { color:#555; }
.mobile-menu-user li a:hover { color:#999; }

#mobile-wrapper { display:none; }
.header-client-area { padding: 3px 8px; display: inline-block;}
#top-cart sup { position: absolute; right:8px; top:6px; font-size:65%; }
.header-client-area span { position:relative; }
.header-client-area span.yellow-bg:hover { color: #fff; }
.client-area-dropdown { display:none; position: absolute; right: 0px; background-color: #d9edee; box-shadow: 0 4px 12px -4px rgba(0, 0, 0, 0.75); }
.header-client-area {
    position: relative;
    text-align: right;
}

.header-client-area .client-area-button {
    cursor: pointer;
    display: inline-block;
    letter-spacing: 0;
    padding: 6px 15px;
}

.header-client-area a i {
    margin-right: 10px;
}

.client-dropdown-top-area {
    padding: 0 20px 16px;
}

.client-drop-title {
    display: inline-block;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 17px;
    margin: 0 0 12px;
    text-transform: uppercase;
}
.client-area-dropdown {
    display:none;
    background: #a3d9dc none repeat scroll 0 0;
    padding: 24px 0 0;
    position: absolute;
    right: 0;
    text-align: left;
    top: 40px;
    width: 270px;
    z-index: 99;
    box-shadow: 0 4px 12px -4px rgba(0, 0, 0, 0.75);
}

.client-drop-form {}

.client-drop-inputbox {
    margin: 0 0 8px;
    position: relative;
}

input[type="text"], input[type="password"], input[type="email"], optgroup, select, textarea {
    border: 1px solid #a3d9dc;
    border-radius: 3px;
    color: #495057;
    font-size: 1em;
    height: 44px;
    letter-spacing: 0;
    width: 100%;
    /*padding: 0 10px 0 38px;
     */
}

/*
.client-drop-inputbox input[type="text"],
.client-drop-inputbox input[type="password"] {
    background: #40546b none repeat scroll 0 0;
    border: 0 none;
    border-radius: 3px;
    color: #495057;
    font-size: 13px;
    height: 44px;
    letter-spacing: 0;
    padding: 0 10px 0 38px;
    width: 100%;
}*/

.client-drop-inputbox i {
    color: #8fadd0;
    left: 14px;
    position: absolute;
    top: 14px;
}

.client-drop-inputbox input[type="text"],
.client-drop-inputbox input[type="password"] {}

/*.client-drop-inputbox input[type="submit"] {
    background: #59ba41 none repeat scroll 0 0;
    border: 0 none;
    border-radius: 3px;
    color: #fff;
    font-size: 13px;
    letter-spacing: 0;
    line-height: 16px;
    padding: 11px 35px;
}*/

.client-forgot,
.client-forgot a {
    font-size: 13px;
    line-height: 18px;
}

.client-forgot {}

.client-forgot a {
    text-decoration: underline;
}

.client-signup {
    background: #3dacb3 none repeat scroll 0 0;
    padding: 13px 44px;
    text-align: center;
}

.client-signup p,
.client-signup p a {
    color: #ffffff;
    font-size: 13px;
    line-height: 20px;
}

.client-signup p {}

.client-signup p a {
    display: block;
    text-decoration: underline;
}

.pricebox { background-color: #d9edee; padding-bottom:16px; }
.pricebox h3 { padding: 8px 0px; }
.pricebox img { padding: 8px 0px; }
.pricebox ul {

    list-style: outside none none;
    margin: 13px 0 12px;
    padding: 0;
}

.pricebox ul li {
    border-bottom: 1px solid #999;
    color: #4a4a4a;
    display: block;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 18px;
    padding: 7px 0;
}

.pricebox ul li:last-child {
    border-bottom: medium none;
}

.pricebox a span {width: 90%;}

/* FOOTER */
footer {padding: 50px 0 25px; color: #ffffff; font-size: 1.125rem;}
footer h4 {color: #ffffff; text-transform: uppercase; font-size: 1.125rem; line-height: 2rem;}
footer h4::after {display: block; content: ""; background: #ffffff; height: 3px; width: 35px;}
footer a {color: #ffffff; text-decoration: none;}
footer a:hover {color: #ffffff; text-decoration: none;}

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

/* HOMEPAGE */
.hero-area {
    margin-top:-15px;
    background: #d9edee url("../images/hostingrelax-cover.svg");
    background-position: center;
    background-size: cover; /* rgba(0, 0, 0, 0) */
    height: 550px;
    display: flex;
    align-items: center;
}
.contact-area {background: #d9edee; display: flex;}
.contact-area > div > div {display: flex; align-items: center;}
.contact-area > div {padding: 15px;}

.plans > div { flex-grow: 1; margin-bottom: 30px;}
.plans > div > .pricebox { height: 100%;}
.plans .pricebox h2 {padding-bottom: 15px; color: #ffffff;}

.price-cell { text-align:right; padding-right:8px; white-space: nowrap;}
.product-remove { text-align: center; }
main.login input:not([type="checkbox"]) { display:block; width:80%; }

main.my-account ul.list { list-style: none;}
main.my-account ul.list li { border-bottom: 2px solid #3dacb3; padding: 4px 0px; }
main.my-account ul.list li img { padding:4px; }
main.my-account ul.list li.active img { background-color: #eadf41; }
main.my-account ul.list li a { color: #3dacb3; font-size: 21px; font-weight: 600; }

.orders { width:100%; }
.orders tbody { background-color: #edf4f9; }
.orders td, .orders th { border-bottom: 1px solid #3dacb3; padding:2px 8px; }
.orders td.order-view { text-align:right; }

.table tr.product-subrow td { border-top: 0px; padding-top:0px; }
.table-cart { width:100%; }
.table-cart tbody { background-color: #edf4f9; }
.table-cart .product-title .title span, .table-cart .product-title .subtitle span { font-weight: 600; }

h1.product-title { font-size: 40px; color: #3dacb3; }
.price-box { font-size:25px; }
.product-desc { border-top: 1px solid #3dacb3; border-bottom: 1px solid #3dacb3; padding: 15px 0px; }
.product-desc-details {padding: 15px 0px;}
.domain-form { background-color: #edf4f9; padding: 12px; }
.domain-success { font-weight: 600; }

.ticket .message {
    width:75%;
    border-radius: 6px;
    background-color: #d9edee;
    float:left;
    margin-bottom:12px;
}
.ticket .message.float-right:before {
    content: "";
    width: 0px;
    height: 0px;
    position: absolute;
    border-left: 10px solid #d9edee;
    border-right: 10px solid transparent;
    border-top: 10px solid #d9edee;
    border-bottom: 10px solid transparent;
    right: -16px;
    top: 0px;
}

.ticket .message.float-left:before {
    content: "";
    width: 0px;
    height: 0px;
    position: absolute;
    border-left: 10px solid transparent;
    border-right: 10px solid #d9edee;
    border-top: 10px solid #d9edee;
    border-bottom: 10px solid transparent;
    left: -16px;
    top: 0px;
}

.ticket .message .title { font-size: 0.8em; }

.tiny img { max-width:100%; height: 100%; }

.carhosthome img {vertical-align: text-top;}


/* PRODOTTI*/
h1.product-title img {vertical-align: bottom;}
.product-price {color: #fff; font-weight:600; font-size: 25px; line-height: 50px; vertical-align: baseline; background: #3dacb3;}
.domain-form input, .domain-form select {border-radius: 0}
.domain-form button {vertical-align: baseline;}