/* Copyright (c) 2018 Open2b Software Snc. */ *, *:before, *:after { box-sizing: border-box; } * { -webkit-tap-highlight-color: rgba(0,0,0,0); } @font-face { font-family: 'Open2bSans'; font-style: normal; font-weight: 400; font-display: swap; src: url('/fonts/open2b-opensans-regular-15.woff2') format('woff2'), url('/fonts/open2b-opensans-regular-15.woff') format('woff'); } @font-face { font-family: 'Open2bSans'; font-style: italic; font-weight: 400; font-display: swap; src: url('/fonts/open2b-opensans-italic-15.woff2') format('woff2'), url('/fonts/open2b-opensans-italic-15.woff') format('woff'); } @font-face { font-family: 'Open2bSans'; font-style: normal; font-weight: 700; font-display: swap; src: url('/fonts/open2b-opensans-bold-15.woff2') format('woff2'), url('/fonts/open2b-opensans-bold-15.woff') format('woff'); } html { height: 100%; margin: 0; overflow-x: hidden; padding: 0; width: 100%; } body { color: #555459; font-family: Open2bSans, sans-serif; font-size: 14px; margin: 0; min-height: 100%; padding: 0; position: relative; } a { text-decoration: none; } a, a:visited { color: #222; } p { line-height: 1.5em; margin: 1em 0; } h1 { font-size: 3.3em; } h2 { font-size: 2.5em; line-height: 1.5; } h3 { font-size: 1.6em; margin-bottom: 20px; margin-top: 30px; } h5 { font-size: 1.4em; line-height: 1.1em; margin: 1.8em 0 1em 0; } h6 { font-size: 1em; margin: 0; } img, svg { height: auto; max-width: 100%; } body, button, input[type=text], input[type=number], input[type=password], input[type=email], select, table, textarea { font-family: Open2bSans, sans-serif; font-size: 16px; line-height: 1.5; text-rendering: optimizeLegibility; } body, button, input[type=text], input[type=number], select, table, textarea { -moz-font-feature-settings: 'liga', 'kern'; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } input[type=text], input[type=number], input[type=password], input[type=email], select, textarea, span.input { appearance: none; -moz-appearance: none; -webkit-appearance: none; background-color: #FFF; border: 0; border-radius: 3px; box-shadow: 0 0 0 1px #D3D3D3; color: #222; display: inline-block; font-family: inherit; font-size: 1em; font-weight: 300; height: 40px; margin: 0 0 15px; outline: 0; padding: 0 1em; -webkit-transition: -webkit-box-shadow 0.1s ease-in-out; -webkit-transition: box-shadow 0.1s ease-in-out; transition: box-shadow 0.1s ease-in-out; } input[type=text], input[type=number], input[type=password], input[type=email], select, textarea { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; } input[disabled] { background-color: #F6F6F6 !important; } textarea { padding: .8em 1em; } input[type="text"]:focus, input[type="password"]:focus, input[type="number"]:focus, input[type="email"]:focus, select:focus, textarea:focus { box-shadow: 0 0 0 2px #7ABA07; } .overlay { display: none; } .link { color: #2B8DD6; text-decoration: underline; } a.link:visited { color: #551A8B; } a.link:hover, .link a:hover { color: #2B8DD6; } /* generics */ .big input[type=text], .big input[type=password], .big select { height: 54px; line-height: 54px; } button { border: 0; border-radius: 4px; cursor: pointer; display: inline-block; font-size: 12px; font-weight: 400; letter-spacing: .1em; margin: 0; padding: 0 20px; text-transform: uppercase; } button { user-select: none; -moz-user-select: none; -ms-user-select: none; -webkit-user-select: none; } .big button { height: 55px; line-height: 55px; } a.button { border: 1px solid transparent; border-radius: 4px; cursor: pointer; display: inline-block; font-size: 12px; font-weight: 400; letter-spacing: .1em; margin: 0; padding: 5px 20px; text-align: center; text-decoration: none!important; text-transform: uppercase; } a.button.submit, input[type=submit].submit { background-color: #7ABA07; box-shadow: 0 2px 3px rgba(0, 0, 0, .1); color: #FFF; display: block; font-size: 14px; text-align: center; text-shadow: 0 0 1px rgba(0, 0, 0, 0.5); } a.button.ghost, button.ghost { background-color: transparent; border: 1px solid #DCDCDC; } a.button.ghost:hover, button.ghost:hover { background-color: #F9F9F9; } .big a.button { line-height: 28px; } ul { margin-left: 20px; padding-left: 10px; } li { line-height: 1.5em; padding: 6px 6px 6px 0; } li > ul { margin-top: 12px; } .expanded { -webkit-backface-visibility: hidden; backface-visibility: hidden; height: auto; opacity: 1; overflow-y: hidden; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -webkit-transition: height 0.4s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: height 0.4s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: height 0.4s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: height 0.4s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); visibility: inherit; } .expandable { -webkit-backface-visibility: hidden; backface-visibility: hidden; height: 0; opacity: 0; overflow-y: hidden; -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); -webkit-transition: height 0.4s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.4s, -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: height 0.4s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.4s, -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: height 0.4s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.4s; transition: height 0.4s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.4s, -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); visibility: hidden; } .main { overflow-x: hidden; } .main > :last-child { margin-bottom: 60px; } .main > .signup-strip:last-child { margin-bottom: 0; } .light-blue { background: linear-gradient(to bottom, #35b148 0%, #0b7235 100%); color: #fff; } .blue { background: #3a6db8; color: #fff; text-shadow: 0 0 1px #000; } .grey { background: #e7f4cf; color: #221f1f; text-shadow: 0 0 1px #000; } .dark-blue { background: linear-gradient(to bottom, #4b79ec 0%, #254575 100%); color: #fff; text-shadow: 0 0 1px #000; } .light-blue .button { border-color: #2B8DD6; color: #2B8DD6; } .light-blue .button:hover { background: #2B8DD6; color: #fff; border-color: #d9e2f1; } .blue .button:hover { background: #fff; border-color: #fff; color: #3a6db8; text-shadow: 0 0 1px transparent; } .dark-blue .button:hover { background: #fff; border-color: #fff; color: #254575; text-shadow: 0 0 1px transparent; } .yellow, .dark-yellow { color: #743513; } .yellow { background: #ffedc2; } .dark-yellow { background: #fed262; } .yellow .button:hover { background: #ffe8b3; } .dark-yellow .button:hover { background: #fed671; } .yellow .button, .dark-yellow .button, .blue .button, .dark-blue .button, .light-blue .button { -webkit-transition: border-color 0.6s cubic-bezier(0.19, 1, 0.22, 1), color 0.6s cubic-bezier(0.19, 1, 0.22, 1), background-color 0.6s cubic-bezier(0.19, 1, 0.22, 1), text-shadow 0.6s cubic-bezier(0.19, 1, 0.22, 1); transition: border-color 0.6s cubic-bezier(0.19, 1, 0.22, 1), color 0.6s cubic-bezier(0.19, 1, 0.22, 1), background-color 0.6s cubic-bezier(0.19, 1, 0.22, 1), text-shadow 0.6s cubic-bezier(0.19, 1, 0.22, 1); } .renew { font-size: 14px; } .vat-note { font-size: 0.9em; margin-top: 10px; } .form-input { display: inline-block; margin: 0 0 15px; max-width: 100%; position: relative; } .form-input label { color: #bfbfbf; font-size: .85em; left: 0; padding: .2em .6em; position: absolute; top: 0; z-index: 2; } .form-input label[for] { cursor: text; } .form-input input, .form-input select, .form-input textarea { max-width: 100%; -webkit-appearance: none; } .form-input input { border-radius: 0; height: auto; margin: 0; padding: 1.4em .5em .25em; width: 100%; } .form-input input + input { display: block; } .form-input select { padding: 1.4em .5em .25em; height: auto; margin: 0; } .form-input select + label { pointer-events: none; } .form-input input:focus { position: relative; z-index: 1; } .form-input input:first-of-type { border-top-left-radius: 3px; border-top-right-radius: 3px; } .form-input input:last-of-type { border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; } .form-input input[size], .form-input input[maxlength] { width: auto; } .form-input[data-required] label:after { color: red; content: "*"; font-size: .9em; margin-left: .2em; line-height: 100%; } .form-input .errors { height: 0; margin-top: 5px; -webkit-transition: height 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: height 0.4s cubic-bezier(0.19, 1, 0.22, 1); overflow: hidden; } .form-input .error { background: #ee5d3a; border-radius: 3px; color: #fff; font-size: .85em; opacity: 0; padding: .3em .5em; text-shadow: 0 0 1px #000; -webkit-transform: scale(.95); -ms-transform: scale(.95); transform: scale(.95); -webkit-transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); } .form-input .error.visible { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } /* fieldset form */ fieldset { min-width: 0; } fieldset.form { display: table; border: 0; margin: 0; margin-bottom: 15px; padding: 0; } fieldset.form legend { color: #555; font-size: 15px; font-weight: bold; margin-bottom: 10px; text-transform: uppercase; } fieldset.form > div { display: table-row; position: relative; } fieldset.form > div > label { display: table-cell; font-size: 14px; padding: 6px 10px 6px 0; white-space: nowrap; } fieldset.form > div > div { display: table-cell; padding: 6px 0 6px .8em; position: relative; width: 100%; } fieldset.form > div > div > span:first-child { display: block; line-height: 45px; padding-left: 9px; } fieldset.form input { max-width: 432px; } fieldset.form .required { color: red; position: absolute; top: 13px; left: 0; } fieldset.form .street input:first-of-type { border-bottom: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } fieldset.form .street input:last-of-type { border-top: 1px solid #E9E9E9; border-top-left-radius: 0; border-top-right-radius: 0; display: block; margin-top: 0; } fieldset.form .street .error { position: relative; top: 36px; } fieldset.form .street .error ~ input:last-of-type { position: relative; top: -19px; } /* rows and columns */ .row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; list-style-type: none; margin: 0; padding: 0; } .row .column { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column nowrap; flex-flow: column nowrap; -webkit-box-flex: 1; -ms-flex: 1 1 1%; flex: 1 1 1%; padding: 0 1rem; } .row .column:first-child { padding-left: 0; } .row .column:last-child { padding-right: 0; } header { background-color: #FFF; left: 0; position: relative; right: 0; top: 0; z-index: 120; } .content { margin: 0 auto; max-width: 990px; overflow: hidden; } .content-wide { margin: 0 auto; max-width: 1350px; overflow: hidden; padding: 0 15px; } button.blue, .button.blue { background: #254575; color: #FFF; } button.ghost.blue, .button.ghost.blue { border-color: #254575; color: #254575; font-weight: bold; text-shadow: 0 0 0 transparent; } button.ghost.gold, .button.ghost.gold { border-color: #BF9B30; color: #BF9B30; font-weight: bold; text-shadow: 0 0 0 transparent; } button.green, .button.green { background: -webkit-gradient(linear, left top, left bottom, from(#7ABA07), to(#4fbb07)); background: -webkit-linear-gradient(top, #7ABA07 0%, #4fbb07 100%); background: linear-gradient(to bottom, #7ABA07 0%, #4fbb07 100%); color: #FFF; text-shadow: 0 0 1px rgba(0, 0, 0, 0.3); } button.ghost.green, .button.ghost.green { border-color: #7ABA07; color: #7ABA07; font-weight: bold; text-shadow: 0 0 0 transparent; } button.big, .button.big { font-size: 14px; padding: 1em 2em; } /* tabs */ .tabs { border-bottom: 2px solid #e5e8ed; } .tabs .content { overflow: visible; } .tabs ul { display: -webkit-box; display: -ms-flexbox; display: flex; list-style: none; margin: 0; padding: 0; position: relative; top: 2px; } .tabs li { border: 2px solid #e5e8ed; -ms-flex: 1 0 0px; -webkit-box-flex: 1; flex: 1 0 0; font-size: 18px; padding: 0; } .tabs li:first-child { border-top-left-radius: 6px; } .tabs li:last-child { border-top-right-radius: 6px; } .tabs li.active { background-color: #f3f3f3; border-bottom: none; } .tabs li + li { border-left: none; } .tabs li a { -ms-flex-align: center; -webkit-box-align: center; align-items: center; color: rgba(3,27,78,.5); cursor: pointer; display: -ms-flexbox; display: -webkit-box; display: flex; padding: 32px; } .tabs li.active a { color: #264574; } .tabs li svg { height: 44px; margin-right: 18px; width: 44px; } .tabs li svg * { fill: rgba(3,27,78,0.5); } .tabs li.active svg * { fill: #264574; } .tabs li span { color: rgba(3,27,78,0.5); display: block; font-size: 16px; line-height: 1.4em; margin-top: 3px; } @media screen and (min-width:1024px) { header { margin: 0 auto; padding: 20px 0; } header .content-wide { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; overflow: visible; } header .logo { display: block; height: 50px; margin-right: 50px; margin-top: -10px; width: 157px; } header .logo svg g { fill: #254575; } header .signup { margin-left: 10px; } header .trial-opener { padding-bottom: 8px; padding-top: 8px; } header .nav { text-align: center; } header .mobile-phone { display: none; } header nav { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; position: relative; z-index: 4; } header nav > ul { list-style-type: none; margin: 0; padding: 0; } header nav > ul li { display: inline-block; padding: 0; } header nav > ul li.contact { display: none; } header nav > ul li.support { float: right; } header nav > ul li a { color: #262626; cursor: default; display: inline-block; font-size: 12px; font-weight: 400; letter-spacing: 0.1em; line-height: 1.2rem; padding: 12px 12px 15px; position: relative; text-decoration: none; text-transform: uppercase; } header nav > ul li a:visited { color: #262626; } header nav > ul li a:hover, header nav > ul li.active a { color: #999; } header nav > ul li a[href] { cursor: pointer; } header .open-mobile-menu { display: none; } header .dropdown { font-size: 14px; left: 0; opacity: 0; position: absolute; top: 80%; visibility: hidden; width: 360px; z-index: 2; } header .dropdown { transform: translate(-50%, 5px); -webkit-transform: translate(-50%, 5px); -moz-transform: translate(-50%, 5px); -o-transform: translate(-50%, 5px); -ms-transform: translate(-50%, 5px);; -webkit-transition: opacity 0.2s ease-in, visibility 0s 0.2s, -webkit-transform 0.2s ease-in;; transition: opacity 0.2s ease-in, visibility 0s 0.2s, -webkit-transform 0.2s ease-in;; transition: opacity 0.2s ease-in, transform 0.2s ease-in, visibility 0s 0.2s;; transition: opacity 0.2s ease-in, transform 0.2s ease-in, visibility 0s 0.2s, -webkit-transform 0.2s ease-in; -webkit-transition: opacity 0.2s ease-in, transform 0.2s ease-in, visibility 0s 0.2s; -moz-transition: opacity 0.2s ease-in, transform 0.2s ease-in, visibility 0s 0.2s; -o-transition: opacity 0.2s ease-in, transform 0.2s ease-in, visibility 0s 0.2s; } header .dropdown.opened { opacity: 1; visibility: visible; } header .dropdown.opened { transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0);; -webkit-transition: left 0.2s ease-out, opacity 0.2s ease-out, -webkit-transform 0.2s ease-out;; transition: left 0.2s ease-out, opacity 0.2s ease-out, -webkit-transform 0.2s ease-out;; transition: left 0.2s ease-out, opacity 0.2s ease-out, transform 0.2s ease-out;; transition: left 0.2s ease-out, opacity 0.2s ease-out, transform 0.2s ease-out, -webkit-transform 0.2s ease-out; -webkit-transition: left 0.2s ease-out, opacity 0.2s ease-out, transform 0.2s ease-out; -moz-transition: left 0.2s ease-out, opacity 0.2s ease-out, transform 0.2s ease-out; -o-transition: left 0.2s ease-out, opacity 0.2s ease-out, transform 0.2s ease-out; } header .dropdown.opened .container { transition: height 0.2s ease-out; -webkit-transition: height 0.2s ease-out; -moz-transition: height 0.2s ease-out; -o-transition: height 0.2s ease-out; } header .dropdown .dropdown-close { display: none; } header .dropdown .pointer { background-color: #fff; border-left: 1px solid #dfdfdf; border-top: 1px solid #dfdfdf; box-shadow: inherit; height: 18px; margin: 0 auto; position: relative; top: 9px; width: 18px; z-index: 1; } header .dropdown .pointer { transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg);; } header .dropdown .container { background: #fff; border: 1px solid #e7e7e7; border-radius: 4px; box-shadow: 0 2px 4px 1px rgba(0, 0, 0, .1); overflow: hidden; position: relative; } header .dropdown .dropdown-section { left: 0; opacity: 0; position: absolute; top: 0; visibility: hidden; width: 100%; z-index: 1; } header .dropdown .dropdown-section .title, header .dropdown .support { display: none; } header .dropdown.opened .dropdown-section.active { -webkit-transition: opacity 0.15s 0.05s ease-out, -webkit-transform 0.2s ease-out; transition: opacity 0.15s 0.05s ease-out, -webkit-transform 0.2s ease-out; transition: opacity 0.15s 0.05s ease-out, transform 0.2s ease-out; transition: opacity 0.15s 0.05s ease-out, transform 0.2s ease-out, -webkit-transform 0.2s ease-out; -webkit-transition: opacity 0.15s 0.05s ease-out, transform 0.2s ease-out; -moz-transition: opacity 0.15s 0.05s ease-out, transform 0.2s ease-out; -o-transition: opacity 0.15s 0.05s ease-out, transform 0.2s ease-out; } header .dropdown .dropdown-section.active { opacity: 1; visibility: inherit; } header .dropdown .dropdown-section.active { transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); -ms-transform: translate(0, 0);; } header .dropdown.opened .dropdown-section.gone, header .dropdown.opened .dropdown-section.next { -webkit-transition: opacity 0.15s ease-out, visibility 0s 0.2s, -webkit-transform 0.2s ease-out; transition: opacity 0.15s ease-out, visibility 0s 0.2s, -webkit-transform 0.2s ease-out; transition: opacity 0.15s ease-out, transform 0.2s ease-out, visibility 0s 0.2s; transition: opacity 0.15s ease-out, transform 0.2s ease-out, visibility 0s 0.2s, -webkit-transform 0.2s ease-out; -webkit-transition: opacity 0.15s ease-out, transform 0.2s ease-out, visibility 0s 0.2s; -moz-transition: opacity 0.15s ease-out, transform 0.2s ease-out, visibility 0s 0.2s; -o-transition: opacity 0.15s ease-out, transform 0.2s ease-out, visibility 0s 0.2s; } header .dropdown .dropdown-section.gone, header .dropdown .dropdown-section.next { opacity: 0; visibility: hidden; } header .dropdown .dropdown-section.gone { transform: translate(-23%, 0); -webkit-transform: translate(-23%, 0); -moz-transform: translate(-23%, 0); -o-transform: translate(-23%, 0); -ms-transform: translate(-23%, 0);; } header .dropdown .dropdown-section.next { transform: translate(23%, 0); -webkit-transform: translate(23%, 0); -moz-transform: translate(23%, 0); -o-transform: translate(23%, 0); -ms-transform: translate(23%, 0);; } header .dropdown .dropdown-products > div { color: #333; margin-bottom: 20px; text-transform: uppercase; } header .dropdown .dropdown-products-sellonline > div { color: #333; margin-bottom: 20px; text-transform: uppercase; } header .dropdown ul { list-style-type: none; margin: 0; padding: 0; } header .dropdown li { letter-spacing: 0.1em; margin: 0; padding: 0; } header .dropdown .separated-first li:first-child { border-bottom: 1px solid #e9e9e9; } header .dropdown .separated-last li:last-child { border-top: 1px solid #e9e9e9; } header .dropdown h4 { font-weight: normal; text-transform: uppercase; } header .dropdown a { color: #444; cursor: pointer; display: block; font-size: 14px; letter-spacing: normal; padding: 1.2em 1.8em; position: relative; -webkit-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out; transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out; width: 100%; z-index: 1; } header .dropdown a:hover { background: #f3f6f9; color: #031b4e; } header .dropdown a .new { float: right; } header .dropdown a div { color: #333; font-size: 1.1em; font-weight: bold; } header .dropdown a:hover div { color: #031b4e; } header .dropdown a span { color: #777; } header .dropdown a:hover span { color: #031b4e; } header .dropdown .submenu .prices { display: none; } } @media screen and (min-width:1060px) { header nav > ul li.contact { display: inline-block; float: right; padding-right: 20px; } header nav > ul li.contact a, header nav > ul li.contact a:hover { color: green; cursor: default; font-size: 14px; } } .column ul { margin-left: 40px; } .column li { padding-top: 0.8em; } .paragraphs .column svg { height: 60px; width: 60px; } .paragraphs .column svg * { fill: #7ABA07; } .gdpr-compliant { width: 130px; } #gdpr-banner { bottom: 0; display: block; position: fixed; right: 20px; width: 130px; } /* divider */ .divider { height: 0; position: relative; } .divider a { background: #FFF; border-radius: 50%; bottom: -30px; display: block; height: 60px; left: 0; margin: 0 auto; position: absolute; right: 0; width: 60px; } .divider a:after { border: 1px solid #444; border-left: 0; border-top: 0; box-sizing: border-box; content: ''; display: table; height: 14px; right: 23px; position: absolute; top: 18px; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); width: 14px; } hr { border: 0; color: #E4E4E4; background-image: -webkit-linear-gradient(left, #F0F0F0, #E2E2E2, #F0F0F0); background-image: -o-linear-gradient(left, #F0F0F0, #E2E2E2, #F0F0F0); height: 1px; } /* breadcrumbs */ ol.breadcrumbs { font-size: 12px; list-style-type: none; padding: 0; text-shadow: 0 0 1px #000; } ol.breadcrumbs li { display: inline; } ol.breadcrumbs li:after { background: url(../images/breadcrumbs-pointer.png) no-repeat center center; background-size: 8px; content: ''; display: inline-block; height: 8px; width: 8px; } ol.breadcrumbs li:last-child { font-weight: bold; pointer-events: none; } ol.breadcrumbs li:last-child:after { content: none; } ol.breadcrumbs li a { color: #BDBCC1; margin-right: 5px; } ol.breadcrumbs li a:hover { color: #8A8890; margin-right: 5px; text-decoration: underline; } /* section cookie-policy */ section.cookie-policy.hidden { height: 0; overflow: hidden; -webkit-transition: height .6s cubic-bezier(0.19, 1, 0.22, 1); transition: height .6s cubic-bezier(0.19, 1, 0.22, 1); } section.cookie-policy > div { background: #e5d9c3; color: #745c34; padding: 1em; position: relative; text-align: center; } section.cookie-policy .text { margin: 0 40px; } section.cookie-policy .close { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; font-size: 2em; height: 100%; padding-right: 15px; position: absolute; right: 0; top: 0; } section.cookie-policy .close span { background: transparent; border-radius: 3px; cursor: pointer; height: 1em; line-height: 100%; width: 1em; text-align: center; } section.cookie-policy .close span:hover { background: #cdcdcd; } /* section hero */ section.hero { background-position: center top; background-size: cover; } section.hero .content { font-size: 20px; padding: 0 20px; } section.hero h1 { color: #3D3D3D; font-size: 3.3em; font-weight: 300; line-height: 1.1em; } section.hero h1 strong { font-weight: 900; } section.hero h2 { font-size: 1.4em; line-height: 1.5em; font-weight: 300; color: #3D3D3D; margin: 1em 0 1.3em; } @media screen and (min-width:768px) { section.hero h1 { font-size: 2.5em; padding-top: 20px; } } /* section signup strip */ section.signup-strip { background: #eaeef1; margin-top: 50px; } section.signup-strip .content { -webkit-box-align: center; -ms-flex-align: center; align-items: flex-start; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 100px 20px; } section.signup-strip .content .text, section.signup-strip .content .signup { -webkit-box-flex: 1; -ms-flex: 1 1 50%; flex: 1 1 50%; -ms-flex-wrap: wrap; flex-wrap: wrap; } section.signup-strip .content .gdpr-compliant { display: inline-block; margin-top: 16px; } section.signup-strip .signup { padding-left: 16px; } section.signup-strip .text h1 { color: #3D3D3D; font-size: 3.3em; font-weight: 300; line-height: 1.1em; margin-bottom: .5em;} section.signup-strip .text h1 strong { font-weight: 900; } section.signup-strip .text h2 { color: #013a4b; font-size: 2.5em; font-weight: 900; line-height: 1.5em; margin: 0; margin-bottom: .5em;} section.signup-strip .text h3 { color: #3D3D3D; font-size: 1.3em; font-weight: 300; line-height: 1.1em; margin: 0; margin-bottom: .5em;} section.signup-strip .signup { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } section.signup-strip .signup input { box-shadow: inset 0 0 0 1px #D3D3D3; border-radius: 3px 0 0 3px; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; height: auto; margin-bottom: 0; } section.signup-strip .signup .button { border-radius: 0 3px 3px 0; padding: .7em 1.5em; white-space: nowrap; } section.signup-strip .signup .note { color: #7791A5; -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; font-size: 18px; margin: 5px; } section.signup-strip .fallback { display: none; } /* points */ .points { text-align: left; } .points.centered { text-align: center; } .points ul { list-style: none; } .points li { padding: 10px; } .points h6 { font-size: 1.2em; margin: 10px 0; } .points p { font-size: 1em; font-weight: 300; } section.points.horizontal li { width: 100%; } section.points.horizontal svg { float: left; width: 40px; } section.points.horizontal h5 { font-weight: 700; margin: 0 0 1rem 0; padding-left: 60px; } section.points.horizontal p { margin-bottom: 0; padding-left: 60px; } /* section sub-menu */ nav.sub-menu { background-color: #FAFAFA; border-top: 1px solid #E0E0E0; border-bottom: 1px solid #E0E0E0; min-height: 68px; } nav.sub-menu ul { line-height: 68px; list-style-type: none; margin: 0; padding: 0; padding-top: 2px; float: left; } nav.sub-menu ul li { display: inline-block; } nav.sub-menu ul li a { color: #262626; cursor: pointer; display: inline-block; font-size: 15px; letter-spacing: 0.03em; line-height: 1em; margin-left: 9px; padding: 8px 10px 9px; position: relative; text-decoration: none; } /* section intro */ section.intro { padding-top: 60px; text-align: center; } section.intro.left { text-align: left; } section.intro .content { font-size: 1.3em; } section.intro h1 { font-size: 2.5em; line-height: 1.05em; margin-bottom: 0.5em; margin-top: 0; } section.intro h1 + p { color: #777; line-height: 30px; } section.intro h1 + h2 { font-size: 1.3em; font-weight: 300; line-height: 1.1em; } section.intro h2 { color: #3D3D3D; font-size: 1.8em; font-weight: 300; line-height: 1.1em; } section.intro h3 { font-size: 1.6em; font-weight: 300; line-height: 1.1em; margin-bottom: 1em; } section.intro h4 { font-size: 1.4em; font-weight: 300; line-height: 1.6em; } section.intro strong { font-weight: 900; } section.intro p { font-weight: 300; margin-bottom: 1em; } section.intro .checkpoints { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } section.intro .checkpoints img { height: auto; width: 160px; } section.intro .checkpoints .text { color: #666; font-size: 18px; font-weight: 300; line-height: 1.8em; text-align: left; } section.intro .checkpoints .image { text-align: center; } section.intro .checkpoints .image, section.intro .checkpoints .text { -webkit-box-flex: 0; -ms-flex: 0 1 40%; flex: 0 1 40%; } /* section brands */ section.brands { background: url('/images/brands-bg.png'); margin-bottom: 60px; padding-bottom: 30px; padding-top: 40px; } section.brands h2 { color: #525252; font-size: 3rem; margin-bottom: 40px; text-align: center; } section.brands .logos { text-align: center; } section.brands img { margin: 0 20px 30px; max-width: 100%; height: auto; } /* section vertical menu */ section.vertical-menu ul { list-style: none; margin: 0; overflow: hidden; padding: 0; } section.vertical-menu li { line-height: 14px; padding-bottom: 7px; } .design-touch .vertical-menu li { line-height: 1.6em; } section.vertical-menu h3 { color: #6E6E6E; font-size: 13px; font-weight: bold; margin-bottom: 7px; } section.vertical-menu a { color: #6E6E6E; } /* section testimonials */ section.testimonials { background-color: #30373b; color: #FFF; margin-top: -5px; padding: 60px; text-shadow: 0 0 2px hsl(181, 23%, 49%); } section.testimonials li { border-bottom: 1px solid #686780; margin-bottom: 35px; padding-bottom: 40px; } section.testimonials li:nth-child(odd) { text-align: right; } section.testimonials li:last-child { border-bottom: 0; padding-bottom: 0; margin-bottom: 0; } section.testimonials blockquote { border-left: none; font-size: 22px; font-style: italic; line-height: 150%; margin: 0 0 22px; padding: 0; } section.testimonials cite { color: #accae0; font-size: 18px; font-style: normal; padding-top: 5px; } section.testimonials cite span { display: block; font-size: 14px; } section.testimonials ul { list-style-type: none; margin: 0; margin-bottom: 60px; padding: 0; } /* section faq */ section.faq { background: #FFF; font-size: 16px; padding: 80px 0; } section.faq h2 { font-size: 2.2em; font-weight: 300; margin-bottom: 2em; margin-top: 10px; text-align: center; } section.faq .row { margin-bottom: 1em; } section.faq .row p { margin-top: 0; } section.faq h6 { color: #333; font-size: 1em; } /* section pricing-plans */ .pricing-container { background: #f3f3f3; } .pricing-container .content { padding-top: 30px; } body .managed { display: block; } body .faq .managed { display: -webkit-box; display: -ms-flexbox; display: flex; } body.installed .managed { display: none; } body .installed { display: none; } body.installed .installed { display: block; } body.installed .faq .installed { display: -webkit-box; display: -ms-flexbox; display: flex; } body .pricing-plans .buy { display: none; } body.installed .pricing-plans .buy { display: block; } .pricing { margin-bottom: 40px; } .pricing .column { padding: 0; } .pricing .pricing-plans { padding-right: 40px; } .pricing-plans .large { padding: 26px 20px; } .pricing-plans .medium { padding: 22px 20px; } .pricing-plans .small { padding: 18px 20px; } .pricing-plans .name { font-size: 28px; margin-top: -10px; padding-bottom: 16px; } .pricing-plans .name span { display: block; font-size: 13px; margin-top: -10px; padding-left: 2px; position: relative; text-transform: uppercase; top: 6px; } .pricing-plans .description { font-size: 18px; line-height: 1.5em;} .pricing-plans .comparison { font-size: .7em; padding: 1em; text-align: center; } @media screen and (min-width:1024px) { .pricing-plans .select { display: none; } section.signup-strip .fallback { display: none; } } section.pricing-plans .plan { background: #FFF; border-radius: 3px; margin-right: 4px; -webkit-box-flex: 1; -ms-flex: 1 1 0px; flex: 1 1 0; overflow: hidden; padding: 0; position: relative; text-align: center; } section.pricing-plans .plan { box-shadow: 0 2px 2px rgba(0,0,0,.1); } section.pricing-plans .plan .main-info { background: linear-gradient(to bottom, #35b148 0%, #0b7235 100%); color: #fff; -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -ms-flex: 0 0 29%; flex: 0 0 29%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column nowrap; flex-flow: column nowrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 3em 1.5em 1.5em; text-shadow: 0 0 1px hsla(216, 52%, 28%, 1); } section.pricing-plans .plan .main-info-lite { background: linear-gradient(to bottom, #4b8bec 0%, #4b79ec 100%); color: #fff; -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -ms-flex: 0 0 29%; flex: 0 0 29%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column nowrap; flex-flow: column nowrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 3em 1.5em 1.5em; text-shadow: 0 0 1px hsla(216, 52%, 28%, 1); } section.pricing-plans .plan .main-info-b2b { background: linear-gradient(to bottom, #4b79ec 0%, #254575 100%); color: #fff; -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -ms-flex: 0 0 29%; flex: 0 0 29%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column nowrap; flex-flow: column nowrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 3em 1.5em 1.5em; text-shadow: 0 0 1px hsla(216, 52%, 28%, 1); } /* body.installed section.pricing-plans .plan .main-info { padding-bottom: 42px; } */ section.pricing-plans .plan .plan-features { padding: 2em 1.5em 3em; } section.pricing-plans .plan:last-child { margin-left: 2px; margin-right: 0; } section.pricing-plans .plan:last-child { margin-right: 2px; } section.pricing-plans .plan:first-child .plan-name div { letter-spacing: .1em; } section.pricing-plans .plan-name { display: inline-block; font-size: 1.7em; line-height: 1.2em; padding-bottom: 20px; } section.pricing-plans .plan-name-lite { display: inline-block; font-size: 1.8em; line-height: 1.2em; padding-bottom: 20px; } section.pricing-plans .plan-name span { color: #ffffff; display: block; font-size: 13px; line-height: 100%; text-align: left; text-shadow: 0 0 1px hsla(216, 52%, 35%, 1); text-transform: uppercase; } section.pricing-plans .plan-name-lite span { color: #ace0f1; display: block; font-size: 13px; line-height: 100%; text-align: left; text-shadow: 0 0 1px hsla(216, 52%, 35%, 1); text-transform: uppercase; } section.pricing-plans .plan-price { font-size: 3em; padding: 20px 0 14px 0; } section.pricing-plans .plan-price .currency { font-size: 0.4em; } section.pricing-plans .plan-price .frequency { font-size: 0.3em; } section.pricing-plans .plan-price-note { padding: 5px 0 20px; } section.pricing-plans .buy { background: -webkit-gradient(linear, left top, left bottom, from(#4b8bec), to(#4b79ec)); background: -webkit-linear-gradient(top, #4b8bec 0%, #4b79ec 100%); background: linear-gradient(to bottom, #18b532 0%, #4fbb07 100%); border-radius: 3px; box-shadow: 0 2px 2px 0px rgba(0, 0, 0, .15); color: #fff; cursor: pointer; display: none; height: 38px; line-height: 38px; margin: 0px 11%; margin-top: -18px; position:relative; text-shadow: 0 0 1px #000; } section.pricing-plans .buy:hover { background: -webkit-gradient(linear, left top, left bottom, from(#5a95ed), to(#5a77ed)); background: -webkit-linear-gradient(top, #5a95ed 0%, #5a77ed 100%); background: linear-gradient(to bottom, #5a95ed 0%, #5a77ed 100%); bottom: 1px; box-shadow: 0 2px 5px 1px rgba(0, 0, 0, .15); } section.pricing-plans ul.plan-features { list-style: none; margin: 0; padding: 0; text-align: left; } section.pricing-plans ul.plan-features li { font-size: 16px; margin-bottom: 0; padding: 8px 0px; } section.pricing-plans ul.plan-features li:last-child { border-bottom: 0; } section.pricing-plans ul .button { border: 1px solid; color: inherit; margin: 0 25px 25px; } section.pricing-plans .compares { font-size: 1.1em; margin: 50px auto; text-align: center; } section.pricing-plans .compares a { color: #3187D8; } section.pricing-plans .note { font-size: 16px; margin-top: 10px; } /* section price-plans */ section.pricing-plans-details { padding: 60px 0; } section.pricing-plans-details .intro { padding-top: 0; } section.pricing-plans-details .logo { margin-bottom: 20px; text-align: left; } section.pricing-plans-details .details { margin: 0 auto; } section.pricing-plans-details ul { color: #666; line-height: 2em; list-style: none; margin-bottom: 20px; } /* section plans-comparison */ section.plans-comparison { padding: 20px 0; } section.plans-comparison .expander a { cursor: pointer; display: block; font-size: .9em; letter-spacing: .1em; margin-bottom: 20px; margin-top: 30px; text-align: center; text-transform: uppercase; } section.plans-comparison .expander a:after { background: url(../images/breadcrumbs-pointer.png) no-repeat center center; margin-left: 1em; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } section.plans-comparison .expander a:before { background: url(../images/breadcrumbs-pointer.png) no-repeat center center; margin-right: 1em; -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } section.plans-comparison .expander a:after, section.plans-comparison .expander a:before { background-size: 8px; content: ''; display: inline-block; height: 8px; -webkit-transition: -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); width: 8px; } section.plans-comparison .expander:hover a { color: #666; } section.plans-comparison .expander.active a:after { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } section.plans-comparison .expander.active a:before { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } section.plans-comparison .expandable { height: 0; overflow: hidden; } section.plans-comparison h3 { font-size: 2.2em; font-weight: 300; line-height: 1.1em; padding: 10px 0 50px 0; text-align: center; } section.plans-comparison table { border-spacing: 0.5rem; } section.plans-comparison thead th { background-color: #FFF; color: #333; font-weight: 300; padding: 10px; vertical-align: top; width: 140px; } section.plans-comparison thead th:first-child { background-color: transparent; color: #666; width: 291px; } section.plans-comparison thead th .plan-name { font-weight: 600; padding: 1em 0; } section.plans-comparison thead th .plan-price-note { font-size: 1em; } section.plans-comparison tbody th { border-bottom: 1px solid #DFDFDF; font-size: 1em; font-weight: 300; padding: 15px 5px; text-align: left; } section.plans-comparison tbody th.section { font-weight: 600; text-transform: uppercase; } section.plans-comparison tbody td { background-color: #FFF; border-bottom: 1px solid #DFDFDF; color: #333; font-size: 1em; padding: 15px 5px; text-align: center; } section.plans-comparison tbody td.yes { background: #FFF url('/images/yes.png') no-repeat 50% 50%; color: transparent; } section.plans-comparison tbody td del { color: #666; display: block; font-size: 0.9em; padding-top: 6px; } /* section customers */ section.customers .shops { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; margin: 0; padding: 0; } section.customers .shops li { -webkit-box-flex: 0; -ms-flex: 0 1 50%; flex: 0 1 50%; list-style-type: none; min-height: 350px; margin-bottom: 60px; padding: 0; } section.customers .shops .image { margin-bottom: 5px; text-align: center; } section.customers .shops .image img { border: 1px solid #E6E6E6; height: 500px; width: 400px; } section.customers .shops .name, section.customers .shops .description { margin: 0 auto; padding-top: 5px; width: 400px; } section.customers .shops .description { color: #666; font-size: 1em; letter-spacing: 0.1em; } /* section signup */ section.signup form.signup { display: block; width: 350px; } section.signup form.signup input { display: block; font-size: 16px; margin-bottom: 10px; width: 100%; } section.signup form.signup button { width: 100%; } section.signup form.signup span { font-size: 14px; font-weight: 300; margin-top: 10px; } .features h4 { margin: 10px 0; } ul.menu { list-style: none; margin: 0; margin-bottom: 20px; padding: 0; } ul.menu a { color: #727272; display: block; font-size: 15px; font-weight: 400; padding: 10px; } ul.menu a:hover { color: #111; } input::-webkit-input-placeholder { color: #999; } input::-moz-placeholder { color: #999; } input:-ms-input-placeholder { color: #999; } input:focus::-webkit-input-placeholder { color: #CCC; } input:focus::-moz-placeholder { color: #CCC; } input:focus:-ms-input-placeholder { color: #CCC; } /* footer */ footer { background: #254575; color: #DDD; padding: 50px 0 20px; } footer .footer-content { margin: 0 auto; max-width: 1004px; overflow: hidden; } footer a { color: #FFF; } footer .menus { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } footer .vertical-menu h3 { color: #FFF; margin-bottom: 20px; text-transform: uppercase; } footer .vertical-menu a { color: #DDD; } footer .social-links { margin: 60px 0 35px; text-align: center; } footer .social-links a { display: block; padding: 5px; } .design-touch footer .social-links a { padding: 8px; } footer .social-links ul { clear: both; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; list-style-type: none; margin: 0; padding: 0; } footer .social-links path { fill: #fff; -webkit-transition: fill 0.2s ease-in-out; transition: fill 0.2s ease-in-out; } footer .social-links a:hover path { fill: #b0babf; } footer .copyright { clear: left; margin: 30px 0 40px 0; text-align: center; } footer .company { margin: 0 auto; text-align: center; } footer .gdpr-compliant { margin: 0 auto; margin-top: 40px; } /* trial popup */ @-webkit-keyframes spin {to {border-top-color: #ec407a; -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes spin {to {border-top-color: #ec407a; -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .trial-opener-container { text-align: center; } .trial-opener-container a.button.trial-opener { display: inline-block; padding: 1em 2em; } .trial-overlay { -webkit-box-align: center; -ms-flex-align: center; align-items: center; bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; left: 0; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; opacity: 0; position: fixed; right: 0; top: 0; -webkit-transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.5s; transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.5s; visibility: hidden; z-index: 10000; } .trial-overlay { background: #141E30; background: -webkit-radial-gradient(#243B55, #141E30); background: -webkit-radial-gradient(rgba(36, 59, 85, 1) 0%, rgba(20, 30, 48, .97) 75%); background: radial-gradient(rgba(36, 59, 85, 1) 0%, rgba(20, 30, 48, .97) 75%); } .trial-overlay.visible { opacity: 1; -webkit-transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1); visibility: inherit; } .trial-overlay .popup .loader { -webkit-animation: spin 1s linear infinite; animation: spin 1s linear infinite; border-radius: 50%; border: 3px solid #ddd; border-top: 3px solid #42a5f5; } .trial-overlay .popup { max-width: 500px; position: relative; -webkit-transform: translateY(5px); -ms-transform: translateY(5px); transform: translateY(5px); -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1); transition: -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1); transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1); transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1); } .trial-overlay.visible .popup { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } .trial-overlay .popup > .close { -ms-transform: translate(30%, -20%); -webkit-box-shadow: -2px 2px 2px 0 rgba(0, 0, 0, .2); -webkit-transform: translate(30%, -20%); border-radius: 30px; border: 1px solid hsla(206, 42%, 29%, 1); box-shadow: -2px 2px 2px 0 rgba(0, 0, 0, .2); color: #fff; cursor: pointer; font-size: 1.5em; height: 35px; line-height: 32px; opacity: 1; position: absolute; right: 0; text-align: center; text-shadow: 0 0 1px #000; top: 0; transform: translate(30%, -20%); visibility: inherit; width: 35px; z-index: 2; } .trial-overlay .popup form { display: inline-block; opacity: 1; padding: 30px 40px 40px; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); visibility: inherit; } .trial-overlay .popup form h2 { color: #FFF; font-size: 30px; font-weight: normal; line-height: 100%; margin: 0 0 1em; } .trial-overlay .popup form .input, .trial-overlay .popup form .editions { margin-bottom: 15px; position: relative; } .trial-overlay .popup form .editions { display: -webkit-box; display: -ms-flexbox; display: flex; font-size: 13px; margin-bottom: 25px; } .trial-overlay .popup form .edition { border-radius: 5px; color: #9e9e9e; cursor: pointer; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex: 1 1 50%; flex: 1 1 50%; padding: 10px; position: relative; text-shadow: 0 0 1px transparent; z-index: 1; } .trial-overlay .popup form .edition.selected { background: hsla(213, 36%, 50%, 0.07); } .trial-overlay .popup form .edition.b2b { -ms-flex-preferred-size: 45%; flex-basis: 45%; } .trial-overlay .popup form .edition.b2c { -ms-flex-preferred-size: 55%; flex-basis: 55%; } .trial-overlay .popup form .edition .description { color: #e6e6e6db; } .trial-overlay.transitions-enabled .popup form .editions .b2b, .trial-overlay.transitions-enabled .popup form .editions .b2c { -webkit-transition: text-shadow 0.6s cubic-bezier(0.19, 1, 0.22, 1), color 0.6s cubic-bezier(0.19, 1, 0.22, 1); transition: text-shadow 0.6s cubic-bezier(0.19, 1, 0.22, 1), color 0.6s cubic-bezier(0.19, 1, 0.22, 1); } .trial-overlay .popup form .editions .edition input[type="radio"] { height: 15px; margin-right: 6px; margin-top: 8px; width: 15px; } .trial-overlay .popup form .editions h3 { color: #fff; font-weight: normal; margin: 0; padding-right: 10px; white-space: nowrap; } .trial-overlay .popup form h5 { color: #e6e6e6db; font-size: 1em; font-weight: normal; line-height: 1.5em; margin-bottom: .7em; } .trial-overlay .popup form .input { font-size: 16px; } .trial-overlay .popup form .input input { -webkit-appearance: none; border: 1px solid #ccc; border-radius: 5px; box-shadow: inset 0 0 0 0 transparent; display: block; height: auto; margin-bottom: 0; outline: none; padding: 0.8em; width: 100%; } .trial-overlay.transitions-enabled .popup form .input input { -webkit-transition: padding 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-box-shadow 0.4s cubic-bezier(0.19, 1, 0.22, 1), border-radius 0.4s cubic-bezier(0.19, 1, 0.22, 1); -webkit-transition: padding 0.4s cubic-bezier(0.19, 1, 0.22, 1), border-radius 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-box-shadow 0.4s cubic-bezier(0.19, 1, 0.22, 1); -webkit-transition: box-shadow 0.4s cubic-bezier(0.19, 1, 0.22, 1), padding 0.4s cubic-bezier(0.19, 1, 0.22, 1), border-radius 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: box-shadow 0.4s cubic-bezier(0.19, 1, 0.22, 1), padding 0.4s cubic-bezier(0.19, 1, 0.22, 1), border-radius 0.4s cubic-bezier(0.19, 1, 0.22, 1); } .trial-overlay .popup form .input.typed input { padding: 1.25em .8em .35em; } .trial-overlay .popup form .input label { color: #b2b2b2; font-size: .7em; left: 0; padding: .5em 1.2em 0; opacity: 0; position: absolute; top: 0; -webkit-transform: translateY(-0.2em); -ms-transform: translateY(-0.2em); transform: translateY(-0.2em); visibility: hidden; } .trial-overlay.transitions-enabled .popup form .input label { -webkit-transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.4s, -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.4s, -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.4s; transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.4s, -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); } .trial-overlay .popup form .input.typed label { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); visibility: visible; } .trial-overlay.visible .popup form .input.typed label { -webkit-transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); } .trial-overlay .popup form .input .messages { height: 0; left: -1px; position: relative; width: calc(100% + 3px); will-change: contents; } .trial-overlay.transitions-enabled .popup form .input .messages { -webkit-transition: height 0.5s cubic-bezier(0.19, 1, 0.22, 1); transition: height 0.5s cubic-bezier(0.19, 1, 0.22, 1); overflow: hidden; } .trial-overlay .popup form .input .messages .message { left: 0; opacity: 0; position: absolute; top: 0; -webkit-transform: scale(.95); -ms-transform: scale(.95); transform: scale(.95); width: 100%; } .trial-overlay.transitions-enabled .popup form .input .messages .message { -webkit-transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), transform 0.5s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), transform 0.5s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.5s cubic-bezier(0.19, 1, 0.22, 1); } .trial-overlay .popup form .input .messages .message.visible { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); z-index: 1; } .trial-overlay .popup form .input .messages .message > div { border-radius: 0 0 5px 5px; color: #fff; font-size: 12px; padding: .5em 1em; text-shadow: 0 0 1px rgba(0, 0, 0, .9); } .trial-overlay .popup form .input .messages .message a { color: inherit; cursor: pointer; text-decoration: underline; } .trial-overlay .popup form .input .messages .message a.close { float: right; font-size: 1.3em; line-height: 100%; text-decoration: none; } .trial-overlay .popup form .input .messages .error > div { background: #e75932; } .trial-overlay .popup form .input .messages .suggestion { padding-top: 4px; } .trial-overlay .popup form .input .messages .suggestion > div { background: orange; border-radius: 5px; } .trial-overlay .popup form .input input:focus { box-shadow: 0 0 0 2px #689bdf; } .trial-overlay .popup form .input.invalid input { border-radius: 5px 5px 0 0; box-shadow: 0 0 0 2px #e75932; } .trial-overlay .popup form .input.valid input { box-shadow: 0 0 0 2px #79ba08; } .trial-overlay .popup form .input .checker { opacity: 0; -webkit-transform: scale(.5); -ms-transform: scale(.5); transform: scale(.5); visibility: hidden; } .trial-overlay.transitions-enabled .popup form .input .checker { -webkit-transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.4s, -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.4s, -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.4s; transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.4s, -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); } .trial-overlay .popup form .input .checker { margin: .7em; position: absolute; right: 0; top: 0; width: 1.8em; } .trial-overlay .popup form .input .checker svg path { fill: #79ba08; } .trial-overlay .popup form .loader { display: none; height: 1.8em; margin: .7em; position: absolute; right: 0; top: 0; width: 1.8em; } .trial-overlay .popup form .input.loading .loader { display: block; } .trial-overlay .popup form .input.valid .checker { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); visibility: visible; } .trial-overlay.transitions-enabled .popup form .input.valid .checker { -webkit-transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); } .trial-overlay .popup form button { font-family: Open2bSans, sans-serif; } .trial-overlay .popup form a.submit { border: none; border-radius: 4px; cursor: pointer; letter-spacing: 1px; line-height: 3.2em; margin: 0; text-shadow: 0 0 1px rgba(0, 0, 0, 0.5); } .trial-overlay .popup form a.submit.disabled { background: #dfdfdf; color: #bcbcbc; cursor: default; pointer-events: none; text-shadow: 1px 1px 0px white; } .trial-overlay .popup form input::-webkit-input-placeholder { color: #aaa; -webkit-transition: color 0.1s ease-in-out; transition: color 0.1s ease-in-out; } .trial-overlay .popup form input::-moz-placeholder { color: #d3d3d3; -webkit-transition: color 0.1s ease-in-out; transition: color 0.1s ease-in-out; } .trial-overlay .popup form input:-ms-input-placeholder { color: #d3d3d3; -webkit-transition: color 0.1s ease-in-out; transition: color 0.1s ease-in-out; } .trial-overlay .popup form input:-moz-placeholder { color: #d3d3d3; -webkit-transition: color 0.1s ease-in-out; transition: color 0.1s ease-in-out; } .trial-overlay .popup form input:focus::-webkit-input-placeholder { color: #e6e6e6; } .trial-overlay .popup form input:focus::-moz-placeholder { color: #e6e6e6; } .trial-overlay .popup form input:focus:-ms-input-placeholder { color: #e6e6e6; } .trial-overlay .popup form input:focus:-moz-placeholder { color: #e6e6e6; } .trial-overlay .popup .privacy { color: #e6e6e6db; } .trial-overlay .popup .privacy a { color: #fff; } .trial-overlay .popup .loading-panel, .trial-overlay .popup .error-panel { -webkit-box-align: center; -ms-flex-align: center; align-items: center; bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; left: 0; opacity: 0; position: absolute; right: 0; top: 0; visibility: hidden; } .trial-overlay .popup .loading-panel .loader { height: 2em; margin-right: 1em; width: 2em; } .trial-overlay .popup.loading form { opacity: 0; -webkit-transform: scale(.9); -ms-transform: scale(.9); transform: scale(.9); -webkit-transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.6s, -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.6s, -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1), transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.6s; transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1), transform 0.6s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.6s, -webkit-transform 0.6s cubic-bezier(0.19, 1, 0.22, 1); visibility: hidden; } .trial-overlay .popup.loading .loading-panel { color: #fff; opacity: 1; -webkit-transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1); visibility: visible; } .trial-overlay .popup.loading > .close { opacity: 0; -webkit-transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.6s; transition: opacity 0.6s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.6s; visibility: hidden; } .trial-overlay .popup.error .error-panel { background: #fff; border-radius: 3px; color: #fff; opacity: 1; padding: 40px; visibility: visible; z-index: 1; } .trial-overlay .popup.error .error-panel .error { display: none; text-align: center; } .trial-overlay .popup.error[data-error="too-many-requests"] .error-panel .error[data-name="too-many-requests"] { display: block; } .trial-overlay .popup.error[data-error="already-exists"] .error-panel .error[data-name="already-exists"] { display: block; } .trial-overlay .popup.error[data-error="not-available"] .error-panel .error[data-name="not-available"] { display: block; } .trial-overlay .error-panel .error[data-name="already-exists"] a { color: #0057cd; text-decoration: underline; } .trial-image .form { padding: 25px 20px 20px; display: block; margin: 25px 0 30px; overflow: hidden; position: relative; } .trial-image .form:after { bottom: 0; top: 0; content: ''; display: block; left: 0; position: absolute; right: 0; z-index: -1; } .trial-image .form .signup > input { box-shadow: 0 2px 3px rgba(0, 0, 0, 0.05); display: block; font-size: 16px; margin-bottom: 10px; width: 100%; } .trial-image .form .signup > button { width: 100%; } .trial-image .form .signup > span { display: block; font-size: 14px; font-weight: 300; margin-top: 15px; } @media screen and (min-width:1024px) { .trial-image { position: relative; } .trial-image .content.trial { -webkit-box-align: center; -ms-flex-align: center; align-items: center; bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; left: 50%; padding: 0 5% 0 0; position: absolute; right: 0; top: 0; } .trial-image .form { background: rgba(37, 69, 117); border-radius: 10px; box-sizing: content-box; width: 450px; margin: 0; } .trial-image .form .signup > span { color: #fff; text-shadow: 0 0 1px #000; } } /* index */ html.index section.hero h1 { padding-top: 0; } html.index .hero h1 { text-align: center; } html.index .hero h2 { color: #555; font-size: 1.4em; line-height: 1.3em; text-align: center; } html.index .intro:first-of-child { background: #F9F9F9; } html.index .points svg { margin: 20px auto 30px; } html.index .features .row li { -webkit-box-flex: 1; -ms-flex: 1 1 33.333333%; flex: 1 1 33.333333%; } html.index .hero .cover-image { background-image: url(/images/vendere-online-desktop.jpg); background-repeat: no-repeat; background-size: cover; height: 38.89vw; } html.index .all-features a.button { display: block; margin: 50px auto; max-width: 100%; width: 360px; } html.index .all-features svg { height: auto; left: 50%; min-width: 1000px; position: relative; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); width: 100%; } html.index .home-logo { margin-left: 60px; } html.index .banner-new-release { background: #f3f6f9; padding: 40px; margin-bottom: 20px; } html.index .banner-new-release .content { text-align: center; } html.index .banner-new-release .content .new { margin-left: 0; } html.index .banner-new-release .content a { color: #254575; font-size: 110%; font-weight: bold; } html.index .banner-new-release .content a:hover { color: #75B206; } html.index .banner-new-release .content a span:last-child { padding-left: 10px; } html.index .last-blog-posts { margin-bottom: 30px; } html.index .last-blog-posts .title { font-size: 31px; margin: 25px 0; } html.index .last-blog-posts .posts { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; margin-bottom: 20px; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } html.index .last-blog-posts .posts article { margin-bottom: 20px; width: 31.9%; } html.index .last-blog-posts .posts article .image { border-bottom: 0; } html.index .last-blog-posts .posts article .image { background: #FFF; display: block; overflow: hidden; } html.index .last-blog-posts .posts article .image a { display: block; } html.index .last-blog-posts .posts article .image a img { border: 1px solid #ebf0f4; border-top-left-radius: 6px; border-top-right-radius: 8px; display: block; } html.index .last-blog-posts .posts article .text { background: #f2f5f8; min-height: 265px; position: relative; } html.index .last-blog-posts .posts article h2 { font-size: 1.8em; font-weight: normal; line-height: 1.3em; margin: 0; } html.index .last-blog-posts .posts article h2 a { color: #333; display: block; padding: 20px; } html.index .last-blog-posts .posts article .summary { position: absolute; bottom: 0; left: 0; } html.index .last-blog-posts .posts article .summary a { color: #30383C; display: block; padding: 20px; padding-top: 0; } @media screen and (min-width:1500px) { html.index .all-features { margin-top: 60px; } html.index .all-features svg { margin-top: -150px; z-index: -1; } } @media screen and (min-width:1024px) { html.index .hero { padding-top: 0; } html.index .hero h1 { font-size: 3.5em; margin-bottom: 20px; margin-top: 36px; } html.index .hero .content.text { margin-top: 20px; } } /* standard-advanced */ html.standard-advanced .hero { padding-top: 40px; } html.standard-advanced .hero .content { position: relative; } html.standard-advanced .hero h1 { color: #254575; font-size: 2.4em; font-weight: 900; line-height: 1.2em; margin-bottom: 20px; margin-top: 0; padding-top: 0; text-align: left; } html.standard-advanced .hero h2 { font-size: 1em; margin-bottom: 36px; } html.standard-advanced .hero h3 { color: #888; font-size: 18px; font-weight: normal; line-height: 1.8em; margin-bottom: 8px; margin-top: 0; text-align: left; text-transform: uppercase; } html.standard-advanced .hero ul { color: #666; font-size: 22px; font-weight: 300; line-height: 34px; margin: 0; } html.standard-advanced .hero li { font-size: 18px; line-height: 1.5em; } html.standard-advanced .hero li:first-child { padding-top: 0; } html.standard-advanced .pricing { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } html.standard-advanced .hero .pricing-plans { background: #FFF; } html.standard-advanced .hero .pricing-plans > div { border-radius: 2px; margin-bottom: 4px; overflow: hidden; } html.standard-advanced .hero .pricing-plans > div:last-child { margin-bottom: 0; } html.standard-advanced .pricing-plans.wide { margin-top: 40px; } html.standard-advanced .pricing-plans .plan .main-info { padding-top: 3em; } html.standard-advanced .plans-comparison { background: #f3f3f3; } html.standard-advanced .hero .logos { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-top: 50px; } html.standard-advanced .hero .logos a { display: block; -webkit-box-flex: 1; -ms-flex: 1 1 50%; flex: 1 1 50%; margin-left: 40px; } html.standard-advanced .hero .logos a:first-child { margin-left: 0; } html.standard-advanced .hero .logos svg { height: 50px; width: auto; } html.standard-advanced .cover-image { background-image: url('/images/channel-b2c-desktop.jpg'); background-repeat: no-repeat; background-size: cover; height: 45.14vw; } html.standard-advanced .intro { background: #F3F3F3; margin-bottom: 30px; padding-bottom: 60px; } html.standard-advanced .intro h2 { line-height: normal; margin-bottom: 20px; margin-top: 10px; } /* standard-advanced-b2b */ html.standard-advanced-b2b .hero { padding-top: 40px; } html.standard-advanced-b2b .hero h1 { color: #3a6db8; font-size: 2.4em; font-weight: 900; line-height: 1.2em; margin-bottom: 24px; margin-top: 0; padding-top: 0; text-align: left; } html.standard-advanced-b2b .hero h2 { font-size: 1em; margin-bottom: 36px; } html.standard-advanced-b2b .hero h3 { color: #888; font-size: 18px; font-weight: normal; line-height: 1.8em; margin-bottom: 8px; margin-top: 0; text-align: left; text-transform: uppercase; } html.standard-advanced-b2b .hero ul { color: #666; font-size: 22px; font-weight: 300; line-height: 34px; margin-left: 50px; } html.standard-advanced-b2b .hero li { font-size: 18px; line-height: 1.5em; } html.standard-advanced-b2b .cover-image { background-image: url('/images/channel-b2b-desktop.jpg'); background-repeat: no-repeat; background-size: cover; height: 52.08vw; } html.standard-advanced-b2b .intro h2 { line-height: normal; margin-bottom: 20px; } html.standard-advanced-b2b .signup-bottom .content { background: url('/images/b2b.png') no-repeat left top; background-size: 375px; min-height: 460px; padding-bottom: 20px; padding-left: 400px; } html.standard-advanced-b2b .signup-bottom h2 { color: #013a4b; font-size: 3em; font-weight: 900; margin-bottom: 30px; margin-top: 0; } html.standard-advanced-b2b .signup-bottom h3 { font-size: 1.5em; margin: 30px 0; } html.standard-advanced-b2b .hero .pricing-plans { background: #FFF; } html.standard-advanced-b2b .hero .pricing-plans > div { border-radius: 2px; margin-bottom: 4px; overflow: hidden; } html.standard-advanced-b2b .hero .pricing-plans > div:last-child { margin-bottom: 0; } html.standard-advanced-b2b .pricing .name { padding-bottom: 38px; } html.standard-advanced-b2b .paragraphs .column svg * { fill: #013a4b; } html.standard-advanced-b2b .pricing-plans .plan .main-info { -ms-flex-preferred-size: auto; flex-basis: auto; padding-top: 3em; } html.standard-advanced-b2b .plans-comparison { background: #f3f3f3; } /* novita-2018 */ html.novita-2018 .hero { margin-top: 40px; } html.novita-2018 .hero svg { float: left; width: 45%; } html.novita-2018 .hero .content > div { margin-left: 50%; } html.novita-2018 .hero h1 { font-weight: 900; margin-bottom: 20px; margin-top: 0; } html.novita-2018 .hero ul { color: #666; font-size: 18px; font-weight: 300; line-height: 40px; margin-left: 40px; } html.novita-2018 .points { padding-top: 60px; } html.novita-2018 h2 { font-size: 2em; } html.novita-2018 .checkpoints { margin: 60px 0; } html.novita-2018 .checkpoints .image { margin-right: 50px; } html.novita-2018 .checkpoints .image svg { max-height: 280px; } html.novita-2018 .screenshot { background: #ebebeb; border-top-left-radius: 8px; border-top-right-radius: 8px; margin-top: 40px; padding-top: 32px; } html.novita-2018 .screenshot img { display: block; } /* lavoro */ html.lavoro .hero h1 { font-weight: 900; margin-top: 10px; text-align: center; } html.lavoro .hero ul { color: #666; font-size: 24px; font-weight: 300; line-height: 40px; margin-left: 50px; } html.lavoro .intro { background: #254575; padding-bottom: 60px; } html.lavoro .intro h2 { color: #FFF; font-size: 42px; font-weight: 300; text-align: center; } html.lavoro .intro p { color: #FFF; } html.lavoro .points { padding-top: 60px; } html.lavoro h2 { font-size: 2.8em; } @media screen and (min-width:768px) { html.lavoro .hero .content { background: url('/images/azienda.jpg') no-repeat left top; background-size: 375px; min-height: 460px; padding-left: 460px; } } /* caratteristiche */ html.caratteristiche .hero h1 { color: #254575; font-weight: bold; margin-bottom: 20px; margin-top: 0; } html.caratteristiche .hero h2 { margin-top: 0; } html.caratteristiche .features .row li { -webkit-box-flex: 1; -ms-flex: 1 1 33.333333%; flex: 1 1 33.333333%; } @media screen and (min-width:1024px) { html.caratteristiche .hero h1 { font-size: 2.5em; } } /* prezzi */ html.prezzi section.intro { padding-top: 30px; } html.prezzi .main > :last-child, html.prezzi section.signup-strip, /* requisiti */ html.requisiti .os-icon { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } html.requisiti .os-icon svg { margin: 0 8%; } html.requisiti .os-icon svg:first-child { -webkit-box-flex: 1; -ms-flex: 1 1 40%; flex: 1 1 40%; } html.requisiti .os-icon svg:last-child { -webkit-box-flex: 1; -ms-flex: 1 1 60%; flex: 1 1 60%; } /* gestione-spedizioni */ html.gestione-spedizioni h1 { color: #254575; line-height: 1.2em; } html.gestione-spedizioni h1 + p { color: #777; font-size: 2em; } html.gestione-spedizioni .column ul { font-size: 1.4em; margin-left: 30px; } html.gestione-spedizioni .shipping-methods { overflow: visible; } html.gestione-spedizioni .shipping-methods { margin-top: 30px; text-align: center; } html.gestione-spedizioni .shipping-methods > div { -webkit-backface-visibility: hidden; backface-visibility: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } html.gestione-spedizioni .shipping-methods > div > div { border: 1px solid #ddd; margin: 5px; padding: 30px 20px; width: 242px; height: 190px; } html.gestione-spedizioni .shipping-methods > div > div { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } html.gestione-spedizioni a.contact { margin: 50px auto; width: 200px; } /* pos-virtuali */ html.pos-virtuali h1 { color: #254575; line-height: 1.2em; } html.pos-virtuali h1 + p { color: #777; font-size: 2em; } html.pos-virtuali .column ul { font-size: 1.4em; margin-left: 30px; } html.pos-virtuali .payment-methods { overflow: visible; } html.pos-virtuali .payment-methods { margin-top: 30px; text-align: center; } html.pos-virtuali .payment-methods > div { -webkit-backface-visibility: hidden; backface-visibility: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } html.pos-virtuali .payment-methods > div > div { border: 1px solid #ddd; margin: 5px; padding: 30px 20px; } html.pos-virtuali .payment-methods img { width: 150px; height: auto; } html.pos-virtuali a.contact { margin: 50px auto; width: 200px; } /* vendere-estero */ html.vendere-estero .localization { clear: both; margin-top: 30px; padding: 12px; background: #FDFAE9; border: 2px solid #f3ede0; } html.vendere-estero .localization > div { color: #333; font-size: 120%; border-bottom: 1px solid #f3ede0; padding-bottom: 3px; margin-bottom: 10px; } html.vendere-estero .localization table { border-spacing: 0; border-collapse: separate; width: 100%; } html.vendere-estero .localization thead th { text-align: left; border-bottom: 1px solid #e6e0d3; padding: 2px;} html.vendere-estero .localization th { font-weight: bold; } html.vendere-estero .localization th, html.vendere-estero .localization tbody td { padding: 12px; } html.vendere-estero .localization tbody td { border-left: 1px solid #e6e0d3; border-bottom: 1px solid #e6e0d3; } html.vendere-estero .localization tbody td.last { border-right: 1px solid #e6e0d3; } /* prezzi */ html.prezzi .intro .content { padding: 36px 0; } html.prezzi .intro h1 { color: #254575; margin-bottom: 10px; } html.prezzi .intro h2 { color: #666; font-size: 24px; font-weight: 400; line-height: 1.8em; margin-top: 30px; } html.prezzi .trial-opener-container { margin: 50px auto 25px auto; } html.prezzi .main .signup { margin: 60px auto; text-align: center; } html.prezzi .signup .button { color: #FFF; font-size: 14px; } @media screen and (min-width:1024px) { html.prezzi .pricing-plans .plan:nth-child(2) { margin-right: 30px; } html.prezzi .pricing-plans .plan .plan-name strong { display: block;} } html.prezzi .compare { background: #F3F3F3; } html.prezzi .logos { overflow: hidden; } html.prezzi .logos .ebay { margin-bottom: 18px; } html.prezzi .logos a { display: block; } html.prezzi .logos svg { height: 80px; width: auto; } /* index-html */ html.index .main > .testimonials { margin-bottom: 0; } /* store */ html.store.index section.intro { padding: 60px 0 60px 0; } html.store.index section.intro h1 { color: #385b87; font-size: 2.5em; } html.store.index section.intro h2 { color: #385b87; font-size: 1.2em; font-weight: normal; line-height: 1.6em; margin-top: 30px; } html.store.index section.intro .image .app-icon { border: 0; border-radius: 34px; } html.store.index section.intro .image div { font-size: 1.4em; } html.store.index section.intro ul { text-align: left; } html.store.index .apps-tabs img { border-radius: 18px; height: 70px; margin-right: 14px; width: 70px; } html.store.index .apps-tabs svg { height: 64px; width: 64px; } html.store.index .apps-tabs svg * { fill: #016ba2; } html.store.index .apps-tabs a { padding: 24px; } html.store.index section.apps .content { padding-top: 80px; } html.store.index section.apps { background: #f3f3f3; } html.store.index section.apps h2 { color: #385b87; font-weight: normal; text-align: center; } html.store.index div.store-apps { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; } html.store.index div.store-apps .app { -webkit-box-flex: 0; -ms-flex: 0 1 33.333333%; flex: 0 1 33.333333%; margin-bottom: 76px; text-align: center; } html.store.index div.store-apps .app .icon img { border-radius: 34px; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); height: 170px; width: 170px; } html.store.index div.store-apps .app .icon img { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); transition: box-shadow 0.15s ease-in, -webkit-transform 0.15s ease-in; -webkit-transition: -webkit-box-shadow 0.15s ease-in, -webkit-transform 0.15s ease-in; -webkit-transition: box-shadow 0.15s ease-in, -webkit-transform 0.15s ease-in; transition: box-shadow 0.15s ease-in, transform 0.15s ease-in; transition: box-shadow 0.15s ease-in, transform 0.15s ease-in, -webkit-transform 0.15s ease-in; } html.store.index div.store-apps .app .icon img:hover { box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3); -webkit-transform: scale(1.02); -ms-transform: scale(1.02); transform: scale(1.02); -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } html.store.index div.store-apps .app .name { margin-top: 10px; text-align: center; } html.store.index div.store-apps .app .name a { color: #385B87; font-size: 18px; text-decoration: none; } html.store.index div.store-apps .app .short-description { color: #868686; font-size: 14px; margin-top: 5px; } html.store.index div.custom-apps .categories { margin: -30px 0 30px 10px; } html.store.index div.custom-apps .categories label { color: #666; font-size: .9em; padding: 0 5px 5px 3px; } html.store.index div.custom-apps .categories select { color: #666; min-width: 300px; } html.store.index div.custom-apps .app { background: #fff; border-radius: 3px; margin-bottom: 30px; padding: 30px; } html.store.index div.custom-apps .app h3 { color: #385b87; font-weight: normal; margin-top: 0; } html.store.index div.custom-apps .app .info { overflow: hidden; } html.store.index div.custom-apps .app dl { color: #666; float: left; font-size: .9em; line-height: 30px; margin: 0; overflow: hidden; padding: 0; } html.store.index div.custom-apps .app dl > * { float: left; } html.store.index div.custom-apps .app dt { font-weight: bold; } html.store.index div.custom-apps .app dd { margin: 0 20px 0 6px; } html.store.index div.custom-apps .app .button { float: right; } html.store.index div.custom-apps .app .short-description { white-space: pre-wrap; } html.store.index div.custom-apps .app-footer { margin-top: 30px; } html.store.index div.custom-apps .app-footer li { display: inline-block; } html.store.index section.easyfatt { margin: 60px 0; } html.store.index section.easyfatt img { float: left; margin-bottom: 20px; margin-right: 30px; } html.store.index section.easyfatt h2 { color: #385b87; font-size: 30px; font-weight: normal; } html.store.index section.easyfatt div.button { text-align: center; margin-top: 40px; } html.store.index section.apps-on-demand { background: #EEE; } html.store.index section.apps-on-demand:last-child { margin-bottom: 0; padding: 60px 0; } html.store.index section.apps-on-demand h3 { font-size: 2.2em; font-weight: normal; } html.store.index section.apps-on-demand p { color: #333; font-size: 1.2em; line-height: 1.8em; } html.store.index section.apps-on-demand a { display: block; margin: 40px auto; width: 200px; } /* servizi */ html.servizi section.intro { padding: 60px 0 60px 0; } html.servizi section.intro h1 { color: #385b87; font-size: 2.5em; } html.servizi section.intro h2 { color: #385b87; font-size: 1.2em; font-weight: normal; line-height: 1.6em; margin-top: 30px; } html.servizi section.intro .image .app-icon { border: 0; border-radius: 34px; } html.servizi section.intro .image div { font-size: 1.4em; } html.servizi section.intro ul { text-align: left; } html.servizi .apps-tabs img { border-radius: 18px; height: 70px; margin-right: 14px; width: 70px; } html.servizi .apps-tabs svg { height: 64px; width: 64px; } html.servizi .apps-tabs svg * { fill: #016ba2; } html.servizi .apps-tabs a { padding: 24px; } html.servizi section.apps .content { padding-top: 80px; } html.servizi section.apps { background: #f3f3f3; } html.servizi section.apps h2 { color: #385b87; font-weight: normal; text-align: center; } html.servizi div.servizi-apps { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; } html.servizi div.servizi-apps .app { -webkit-box-flex: 0; -ms-flex: 0 1 33.333333%; flex: 0 1 33.333333%; margin-bottom: 76px; text-align: center; } html.servizi div.servizi-apps .app .icon img { border-radius: 34px; box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3); height: 170px; width: 170px; } html.servizi div.servizi-apps .app .icon img { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); transition: box-shadow 0.15s ease-in, -webkit-transform 0.15s ease-in; -webkit-transition: -webkit-box-shadow 0.15s ease-in, -webkit-transform 0.15s ease-in; -webkit-transition: box-shadow 0.15s ease-in, -webkit-transform 0.15s ease-in; transition: box-shadow 0.15s ease-in, transform 0.15s ease-in; transition: box-shadow 0.15s ease-in, transform 0.15s ease-in, -webkit-transform 0.15s ease-in; } html.servizi div.servizi-apps .app .icon img:hover { box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3); -webkit-transform: scale(1.02); -ms-transform: scale(1.02); transform: scale(1.02); -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } html.servizi div.servizi-apps .app .name { margin-top: 10px; text-align: center; } html.servizi div.servizi-apps .app .name a { color: #385B87; font-size: 18px; text-decoration: none; } html.servizi div.servizi-apps .app .short-description { color: #868686; font-size: 14px; margin-top: 5px; } html.servizi div.custom-apps .categories { margin: -30px 0 30px 10px; } html.servizi div.custom-apps .categories label { color: #666; font-size: .9em; padding: 0 5px 5px 3px; } html.servizi div.custom-apps .categories select { color: #666; min-width: 300px; } html.servizi div.custom-apps .app { background: #fff; border-radius: 3px; margin-bottom: 30px; padding: 30px; } html.servizi div.custom-apps .app h3 { color: #385b87; font-weight: normal; margin-top: 0; } html.servizi div.custom-apps .app .info { overflow: hidden; } html.servizi div.custom-apps .app dl { color: #666; float: left; font-size: .9em; line-height: 30px; margin: 0; overflow: hidden; padding: 0; } html.servizi div.custom-apps .app dl > * { float: left; } html.servizi div.custom-apps .app dt { font-weight: bold; } html.servizi div.custom-apps .app dd { margin: 0 20px 0 6px; } html.servizi div.custom-apps .app .button { float: right; } html.servizi div.custom-apps .app .short-description { white-space: pre-wrap; } html.servizi div.custom-apps .app-footer { margin-top: 30px; } html.servizi div.custom-apps .app-footer li { display: inline-block; } html.servizi section.easyfatt { margin: 60px 0; } html.servizi section.easyfatt img { float: left; margin-bottom: 20px; margin-right: 30px; } html.servizi section.easyfatt h2 { color: #385b87; font-size: 30px; font-weight: normal; } html.servizi section.easyfatt div.button { text-align: center; margin-top: 40px; } html.servizi section.apps-on-demand { background: #EEE; } html.servizi section.apps-on-demand:last-child { margin-bottom: 0; padding: 60px 0; } html.servizi section.apps-on-demand h3 { font-size: 2.2em; font-weight: normal; } html.servizi section.apps-on-demand p { color: #333; font-size: 1.2em; line-height: 1.8em; } html.servizi section.apps-on-demand a { display: block; margin: 40px auto; width: 200px; } body .custom-apps { display: none; } body.custom-apps .custom-apps { display: block; } html.store body.custom-apps .store-apps { display: none; } html.app h1 { color: #385b87; font-size: 1.8em; font-weight: normal; } html.app h2 { color: #385b87; font-size: 1.2em; font-weight: normal; } html.app .app-container { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 30px; } html.app .app-left-column .icon { width: 244px; } html.app .app-left-column .icon img { background: #FFF; border-radius: 34px; box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.5); display: block; height: 170px; margin: 0 auto 20px; width: 170px; } html.app .app-left-column .button { background: #0FA5D8; border: 1px solid #0FA5D8; border-radius: 6px; color: #FFF; display: inline-block; font-size: 16px; height: 36px; line-height: 36px; margin: 20px 0; padding: 0; text-align: center; text-decoration: none; width: 240px; } html.app .app-left-column .info { background: #FAFAFA; border-radius: 5px; padding: 5px 15px; } html.app .app-left-column .info ul { color: #666; font-size: 14px; list-style-type: none; margin: 0; padding: 0; } html.app .app-left-column .info li { padding-top: 5px; } html.app .app-left-column .info li span { display: block; float: right; } html.app .app-left-column .price-disclaimer { color: #888; font-size: 12px; margin-top: 8px; margin-left: 14px; } html.app .app-center-column { overflow: hidden; } html.app .app-center-column .app-name { margin-top: 0; } html.app .screenshots { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; background: #FFF; border: 1px solid #DDD; border-radius: 8px; margin-top: 20px; overflow-x: auto; overflow-y: hidden; padding: 15px; } html.app .screenshot { margin-right: 15px; } html.app .screenshot img { border: 1px solid #FFF; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.3); margin: 0 3px; max-width: none; } html.app .app-permissions { padding-bottom: 30px; margin-top: 30px; } html.app .app-permissions h3 { margin-bottom: 10px; } html.app .app-permissions ul { margin-top: 10px; } html.app .app-permissions li { padding-top: 5px; } html.app .detail { margin-top: 40px; } html.app .detail .icon { overflow: hidden; float: left; margin-right: 16px; width: 172px; } html.app .detail .icon img { border: 1px solid #ccc; border-radius: 12px; width: 170px; height: 170px; float: left; margin-right: 20px; } html.app .detail h1 { color: #000; font-size: 36px; font-weight: bold; margin-top: 0; text-decoration: none; } html.app .detail .short-description { color: #868686; font-size: 18px; margin-top: 5px; font-weight: normal; } html.app .detail .screenshots { border: 1px solid #ccc; clear: left; margin-top: 20px; padding-top: 10px; overflow: hidden; width: 923px; } @media screen and (min-width:1024px) { html.app .app-center-column { margin-left: 20px; } html.app .app-left-column .app-name { display: none; } } /* grafica */ html.grafica .templates > div { background: #f6f6f6; border: 1px solid #f0f0f0; border-radius: 10px; font-size: 14px; margin: 30px 0; overflow: hidden; } html.grafica .templates .image { border: 1px solid #ddd; display: inline-block; } html.grafica .templates .image img { display: block; } html.grafica .templates h4 { margin-bottom: 20px; } html.grafica .templates div div:last-child { padding: 20px; } /* canali-di-vendita */ html.canali-di-vendita body { background: #ecf0f4; } html.canali-di-vendita section.intro { background: #fff; padding-bottom: 40px; } html.canali-di-vendita section.intro h1 { color: #254575; } @media screen and (min-width:1025px) { html.canali-di-vendita section.intro h1 { font-size: 2.9em; line-height: 66px; } } html.canali-di-vendita section.intro h2 { color: #666; } @media screen and (min-width:1025px) { html.canali-di-vendita section.intro h1 { font-size: 2.9em; } } html.canali-di-vendita section.channels { background: #edf0f4; position: relative; } html.canali-di-vendita section.channels h2 { color: #254575; font-size: 34px; font-weight: 300; margin-top: 60px; padding-left: 20px; } html.canali-di-vendita section.channels h3 { color: #444; font-size: 24px; margin-bottom: 10px; } html.canali-di-vendita section.channels p { color: #555; } html.canali-di-vendita section.channels .channel { background: #FFF; border-radius: 2px; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin: 20px; padding: 30px; position: relative; } html.canali-di-vendita section.channels .online-shop .channel { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column nowrap; flex-flow: column nowrap; min-height: 240px; position: relative; } html.canali-di-vendita section.channels .online-shop .channel .row { display: block; } html.canali-di-vendita section.channels .online-shop .channel .logo { margin-bottom: 40px; } html.canali-di-vendita section.channels .online-shop .channel .logo svg { max-width: 100%; width: 300px; } html.canali-di-vendita section.channels .channel .button { margin-top: 20px; } html.canali-di-vendita section.channels .logo { -webkit-box-flex: 1; -ms-flex: 1 1 50%; flex: 1 1 50%; height: auto; line-height: 140px; margin: 10px 0; text-align: center; } html.canali-di-vendita section.channels .logo svg { vertical-align: middle; } html.canali-di-vendita section.channels .ebay .logo svg { max-width: 200px; } html.canali-di-vendita section.channels .google-shopping .logo svg { max-width: 220px; } html.canali-di-vendita section.channels .facebook .logo svg { max-width: 300px; } html.canali-di-vendita section.channels .comparatori-prezzo .logos { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: space-evenly; -ms-flex-pack: space-evenly; justify-content: space-evenly; } html.canali-di-vendita section.channels .comparatori-prezzo .logo.trovaprezzi svg { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 340px; } html.canali-di-vendita section.channels .comparatori-prezzo .logo.kelkoo svg { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 200px; } html.canali-di-vendita section.channels .channel.b2b { background: #FFF url('/images/b2b.png') no-repeat 92% 60px; background-size: 200px auto; min-height: 350px; padding: 40px; position: relative; } html.canali-di-vendita section.channels .channel.b2b h2 { font-weight: 900; } html.canali-di-vendita section.channels .channel.b2b p { padding: 45px 280px 0 30px; } html.canali-di-vendita section.signup-strip { background: #fff; } /* negozio-online.html */ html.negozio-online .intro { display: block; padding-top: 60px; position: relative; } html.negozio-online .intro h1 { color: #888; font-size: 18px; font-weight: normal; line-height: 1.8em; text-transform: uppercase; } html.negozio-online .intro h2 { font-size: 2.5em; line-height: 70px; margin-top: 20px; text-align: center; } html.negozio-online .intro .bg1 { height: 100%; background: #F3F3F3; left: 0; position: absolute; right: 0; top: 0; -webkit-transform: skewY(-6deg); -ms-transform: skewY(-6deg); transform: skewY(-6deg); -webkit-transform-origin: 0; -ms-transform-origin: 0; transform-origin: 0; z-index: -1; } html.negozio-online .intro .bg2 { height: 200px; background: #EFEFEF; left: 0; position: absolute; right: 0; top: 0; -webkit-transform: skewY(-12deg); -ms-transform: skewY(-12deg); transform: skewY(-12deg); -webkit-transform-origin: 0; -ms-transform-origin: 0; transform-origin: 0; z-index: -1; } html.negozio-online .intro .image svg { width: 300px; } html.negozio-online .intro ul { margin-left: 50px; } html.negozio-online .intro .signup { display: block; float: left; } html.negozio-online .intro .signup button { background: #222; color: #FFF; } html.negozio-online .points .content { padding: 100px 0; } html.negozio-online .points h6 { color: #635C73; } html.negozio-online .points p { color: #848e97; } html.negozio-online .icon svg { height: 80px; width: 80px; } /* ebay.html & facebook.html */ html.ebay .logo svg { max-width: 400px; margin: auto; } html.facebook .intro .checkpoints, html.facebook .intro .checkpoints .text, html.facebook .intro .app-icon, /* ebay.html */ html.ebay .intro, html.ebay .intro .bg1, html.ebay .intro .bg2, html.ebay .intro .signup, html.ebay .intro .signup button, html.ebay .points .content, html.ebay .points h6, html.ebay .points p, html.ebay .icon svg, /* facebook.html */ html.facebook .intro { display: block; margin-bottom: 120px; padding-top: 60px; position: relative; } html.facebook .intro .logo svg { height: auto; max-width: 400px; } html.facebook .intro h1 { color: #333; font-size: 3em; font-weight: normal; line-height: 70px; margin-top: 0; text-align: center; } html.facebook .intro h2 { color: #777; font-size: 24px; line-height: 1.8em; } html.facebook .intro p { color: #777; font-size: 18px; } html.facebook .intro .bg1 { height: 100%; background: #F3F3F3; left: 0; position: absolute; right: 0; top: 0; -webkit-transform: skewY(-6deg); -ms-transform: skewY(-6deg); transform: skewY(-6deg); -webkit-transform-origin: 0; -ms-transform-origin: 0; transform-origin: 0; z-index: -1; } html.facebook .intro .bg2 { height: 200px; background: #EFEFEF; left: 0; position: absolute; right: 0; top: 0; -webkit-transform: skewY(-12deg); -ms-transform: skewY(-12deg); transform: skewY(-12deg); -webkit-transform-origin: 0; -ms-transform-origin: 0; transform-origin: 0; z-index: -1; } html.facebook .intro p { color: #888; line-height: 1.8em; } html.facebook .intro .checkpoints .image { -ms-flex-preferred-size: 30%; flex-basis: 30%; } html.facebook .intro .checkpoints .text { -ms-flex-preferred-size: 70%; flex-basis: 70%; } html.facebook .pricing-plans .plan { color: #254575; padding: 50px; } html.facebook .pricing-plans .plan:first-child { background: #d9e2f1; } html.facebook .pricing-plans .plan:last-child { background: #f0f4f9; } html.facebook .facebook-pages-terms { background: #fffeeb; border-radius: 5px; margin-top: 40px; padding: 50px; } html.facebook .facebook-pages-terms h5 { color: #585627; margin-top: 0; } html.facebook .facebook-pages-terms .contact { margin-top: 40px; text-align: right; } /* piani assistenza */ html.piani-assistenza h1 { margin-bottom: 0; margin-top: 0; } html.piani-assistenza section.hero { margin-bottom: 30px; } html.piani-assistenza section.hero h2 { font-size: 1.8em; margin-bottom: 30px; margin-top: 16px; } html.piani-assistenza section.hero p { color: #999; } html.piani-assistenza .cover-image { background-image: url('/images/assistenza-ecommerce-desktop.jpg'); background-repeat: no-repeat; background-size: cover; height: 26.39vw; } html.piani-assistenza section.support { background: #eaeff3; margin-bottom: 40px; padding: 80px 0 60px 0; } html.piani-assistenza section.support h2 { font-weight: normal; line-height: 1.5em; } html.piani-assistenza section.support ul { font-size: 1.4em; margin-left: 15px; } html.piani-assistenza section.support .column li { padding-top: 6px; } html.piani-assistenza section.support .why h5 { font-size: 1.8em; font-weight: normal; margin-top: 0; } html.piani-assistenza section.support .why ul { font-size: 16px; list-style-type: none; margin: 0 3px 0 0; padding: 0; } html.piani-assistenza section.plans h2 { color: #3D3D3D; font-size: 3.4em; font-weight: 300; line-height: 1.1em; text-align: center; } html.piani-assistenza section.plans h2 + p { color: #666; font-size: 1.2em; text-align: center; } html.piani-assistenza .note { font-style: italic; } html.piani-assistenza section.pricing-plans .plan { box-shadow: 0 2px 10px 1px rgba(0,0,0,.1); margin: 40px 5px 8px; border-radius: 3px; } @media screen and (min-width:1024px) { html.piani-assistenza section.support .why { padding: 50px; } } /* b2b */ html.b2b section.intro { display: block; padding-top: 60px; position: relative; } html.b2b section.intro h1 { color: #888; font-size: 18px; font-weight: normal; line-height: 1.8em; text-transform: uppercase; } html.b2b section.intro h2 { margin-top: 20px; text-align: center; } html.b2b section.intro .bg1 { height: 100%; background: #F3F3F3; left: 0; position: absolute; right: 0; top: 0; -webkit-transform: skewY(-6deg); -ms-transform: skewY(-6deg); transform: skewY(-6deg); -webkit-transform-origin: 0; -ms-transform-origin: 0; transform-origin: 0; z-index: -1; } html.b2b section.intro .bg2 { height: 200px; background: #EFEFEF; left: 0; position: absolute; right: 0; top: 0; -webkit-transform: skewY(-12deg); -ms-transform: skewY(-12deg); transform: skewY(-12deg); -webkit-transform-origin: 0; -ms-transform-origin: 0; transform-origin: 0; z-index: -1; } html.b2b section.intro .signup { display: block; float: left; } html.b2b section.intro .signup button { background: #222; color: #FFF; } html.b2b section.intro .checkpoints { color: #666; font-size: 18px; font-weight: 300; padding-bottom: 40px; text-align: left; } html.b2b section.intro .checkpoints ul { line-height: 1.8em; list-style-type: none; } html.b2b section.intro .image { color: #254575; font-size: 8em; font-weight: bold; text-align: center; } html.b2b section.points .content { padding: 100px 0; } html.b2b .points li, html.negozio-online .points li { border: 1px solid #e6e6e6; margin: 12px; padding-top: 40px; } html.b2b section.points h6 { color: #635C73; } html.b2b section.points p { color: #848e97; } html.b2b .icon svg { height: 80px; width: 80px; } html.b2b .checkpoints img { height: auto; width: 160px; } @media only screen and (min-width: 736px) { html.b2b section.intro h2 { font-size: 2.5em; line-height: 1.5em; } } /* google-shopping */ html.google-shopping section.intro { display: block; margin-bottom: 120px; padding-top: 100px; position: relative; } html.google-shopping section.intro .logo svg { height: 90px; width: auto; } html.google-shopping section.intro h1 { color: #333; font-size: 2.5em; font-weight: normal; line-height: 1.5em; margin-top: 40px; text-align: center; } html.google-shopping section.intro h2 { color: #777; font-size: 24px; line-height: 1.8em; } html.google-shopping section.intro .bg1 { height: 100%; background: #F3F3F3; left: 0; position: absolute; right: 0; top: 0; -webkit-transform: skewY(-6deg); -ms-transform: skewY(-6deg); transform: skewY(-6deg); -webkit-transform-origin: 0; -ms-transform-origin: 0; transform-origin: 0; z-index: -1; } html.google-shopping section.intro .bg2 { height: 200px; background: #EFEFEF; left: 0; position: absolute; right: 0; top: 0; -webkit-transform: skewY(-12deg); -ms-transform: skewY(-12deg); transform: skewY(-12deg); -webkit-transform-origin: 0; -ms-transform-origin: 0; transform-origin: 0; z-index: -1; } html.google-shopping section.intro .signup { display: block; float: left; } html.google-shopping section.intro .signup button { background: #222; color: #FFF; } html.google-shopping section.intro .checkpoints { color: #666; font-size: 18px; font-weight: 300; margin-top: 40px; text-align: left; } html.google-shopping section.intro .checkpoints ul { line-height: 1.8em; list-style-type: none; } html.google-shopping section.points .content { padding: 100px 0; } html.google-shopping section.points h6 { color: #635C73; } html.google-shopping section.points p { color: #848e97; } html.google-shopping .google-shopping-terms { background: #fffeeb; border-radius: 5px; margin-top: 40px; padding: 50px; } html.google-shopping .google-shopping-terms h5 { color: #585627; margin-top: 0; } html.google-shopping .google-shopping-terms .contact { margin-top: 40px; text-align: right; } /* partnership-index */ html.partnership.index section.intro .content { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; } html.partnership.index section.intro .image { -webkit-box-flex: 1; -ms-flex: 1 1 40%; flex: 1 1 40%; margin-right: 20px; } html.partnership.index section.intro .text { -webkit-box-flex: 1; -ms-flex: 1 1 60%; flex: 1 1 60%; } html.partnership.index section.intro h1 { color: #333; margin-top: 16px; } html.partnership.index section.intro h3 { color: #333; font-size: 1em; } html.partnership.index section.intro h3 + p { clear: left; color: #333; font-size: 1em; padding-top: 60px; } html.partnership.index .main h2 { color: #33658F; font-size: 2em; } html.partnership.index section.solutions, section.advantages { margin-bottom: 60px; margin-top: 20px; } html.partnership.index .solutions .row { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; -ms-flex-wrap: wrap; flex-wrap: wrap; } html.partnership.index .solutions .column { background-color: #EAEAEA; background-position: center 60px; background-repeat: no-repeat; border-radius: 5px; font-size: 15px; margin: 0 8px 8px 0; padding: 25px; position: relative; } html.partnership.index .solutions .column:last-child { margin-right: 0; } html.partnership.index .solutions .column h3 { color: #33658f; font-size: 20px; font-weight: normal; margin-top: 28px; text-align: center; } html.partnership.index .solutions ul { margin-left: 10px; padding-left: 10px; } html.partnership.index .solutions ul li { line-height: 1.2em; } html.partnership.index .resellers > div { background-image: url('/images/rivenditori-ecommerce.png'); } html.partnership.index .agencies > div { background-image: url('/images/web-agency-ecommerce.png'); } html.partnership.index .developers > div { background-image: url('/images/system-integrator-ecommerce.png'); } html.partnership.index .advantages h3 { font-size: 1.4em; } html.partnership.index .main .buttons { margin: 20px 0; text-align: center; } html.partnership.index a.partnership-join { color: #FFF; display: inline-block; font-size: 14px; text-align: center; } @media only screen and (min-width: 736px) { html.partnership.index section.intro h1 { line-height: 1.1em; font-size: 2.5em; } } /* partnership-adesione */ html.partnership.adesione h1 { color: #254575; font-size: 2.8em; } html.partnership.adesione h2 { color: #254575; font-size: 1.6em; margin-top: 60px; } html.partnership.adesione .buttons { text-align: center; margin: 20px 0; } html.partnership.adesione .main .content { overflow: visible; } html.partnership.adesione .privacy { margin: 15px 0 15px 0; } /* partnership-conferma */ html.partnership.conferma h1 { color: #254575; font-size: 2.8em; } html.partnership.conferma .main .content { min-height: 60vh } /* hosting e email */ html.hosting-email section.hero { background-color: #F9FDFE; margin-bottom: 80px; margin-top: 25px; padding-top: 0; position: relative; } html.hosting-email .cover-image { background: url('/images/ecommerce-hosting-desktop.jpg') no-repeat; background-size: cover; } html.hosting-email a.contact { margin: 50px auto; width: 200px; } html.hosting-email .points svg { margin: 20px auto 30px; } html.hosting-email .paragraphs .column div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column nowrap; flex-flow: column nowrap; } html.hosting-email .paragraphs .column svg * { fill: #254575; } html.hosting-email .paragraphs .column span { padding: 0 20px; } html.hosting-email h2 { color: #555; font-size: 2.5em; font-weight: normal; } html.hosting-email h3 { font-size: 1.2em; margin-bottom: 10px; } html.hosting-email .points p { color: #666; font-size: 1.2em; margin: 30px 0; } html.hosting-email .row { margin-top: 50px; } html.hosting-email .service-prices { margin-bottom: 40px; margin-top: 100px; } html.hosting-email .service-prices ul { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; margin-top: 0; text-align: center; } html.hosting-email .service-prices ul li.column { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column nowrap; flex-flow: column nowrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 20px 5px; } html.hosting-email .service-prices ul li:first-child { border-left: 1px solid #1B3255; padding-left: 20px; text-align: left; } html.hosting-email .service-prices .headers li { background: #1B3255; border-right: 1px solid #FFF; color: #FFF; font-size: 1.6em; font-weight: bold; } html.hosting-email .service-prices .headers li:first-child { border-top-left-radius: 8px; font-size: 1.2em; font-weight: normal; } html.hosting-email .service-prices .headers li:last-child { border-right: 1px solid #1B3255; border-top-right-radius: 8px; } html.hosting-email .service-prices .prices li { border-bottom: 1px solid #1B3255; border-right: 1px solid #1B3255; color: #666; font-size: 1.1em; } html.hosting-email .service-prices .note { color: #888; font-size: 0.9em; margin-top: 10px; padding-left: 6px; } html.hosting-email .service-prices.hosting .headers li { font-size: 1.4em; font-weight: normal; } html.hosting-email .service-prices.hosting .headers li:first-child { font-size: 1.2em; } @media only screen and (min-width: 736px) { html.hosting-email .cover-image { height: 100%; position: absolute; left: 50%; top: 0; width: 50%; } html.hosting-email section.hero .content { display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; } html.hosting-email section.hero .content .text { box-sizing: border-box; -webkit-box-flex: 0; -ms-flex: 0 1 50%; flex: 0 1 50%; padding-left: 20px; padding-right: 30px; } } /* creare sito web responsive */ html.creare-sito-web-responsive .divider { background: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(50%, #CCC), to(transparent)); background: -webkit-linear-gradient(left, transparent 0%, #CCC 50%, transparent 100%); background: linear-gradient(to right, transparent 0%, #CCC 50%, transparent 100%); height: 1px; } html.creare-sito-web-responsive section.hero h1 { color: #333; font-weight: normal; margin-bottom: 50px; margin-top: 0; text-align: center; } html.creare-sito-web-responsive section.hero p { color: #999; font-size: 0.9em; text-align: center; } html.creare-sito-web-responsive section.intro { padding-top: 40px; } html.creare-sito-web-responsive h2 { font-size: 2.2em; } html.creare-sito-web-responsive a.contact { margin-top: 20px; max-width: 100%; width: 300px; } /* comparatori prezzo */ html.comparatori-prezzo .intro { display: block; margin-bottom: 80px; padding-top: 80px; position: relative; } html.comparatori-prezzo .intro .logo { margin-top: 80px; } html.comparatori-prezzo .intro .logo .trovaprezzi svg { height: auto; max-width: 100%; width: 400px; } html.comparatori-prezzo .intro .logo .kelkoo svg { height: auto; max-width: 100%; width: 300px; } html.comparatori-prezzo .intro h1 { color: #333; font-weight: normal; text-align: center; } html.comparatori-prezzo .intro h2 { color: #777; font-size: 24px; line-height: 1.8em; } html.comparatori-prezzo h3.caption { color: #777; font-weight: normal; margin-bottom: 80px; margin-top: 0; } html.comparatori-prezzo .intro p { color: #777; font-size: 18px; margin-top: 40px; } html.comparatori-prezzo .intro .bg1 { height: 100%; background: #F3F3F3; left: 0; position: absolute; right: 0; top: 0; -webkit-transform: skewY(-6deg); -ms-transform: skewY(-6deg); transform: skewY(-6deg); -webkit-transform-origin: 0; -ms-transform-origin: 0; transform-origin: 0; z-index: -1; } html.comparatori-prezzo .intro .bg2 { height: 200px; background: #EFEFEF; left: 0; position: absolute; right: 0; top: 0; -webkit-transform: skewY(-12deg); -ms-transform: skewY(-12deg); transform: skewY(-12deg); -webkit-transform-origin: 0; -ms-transform-origin: 0; transform-origin: 0; z-index: -1; } html.comparatori-prezzo .intro p { color: #888; line-height: 1.8em; } html.comparatori-prezzo .dettagli-comparatori { color: #FFF; background: #f44a3e; font-size: 1.2em; margin-bottom: 30px; padding: 80px 0; text-shadow: 0 0 1px rgba(0, 0, 0, 0.7); } html.comparatori-prezzo .dettagli-comparatori h3 { color: #FFF; font-weight: normal; margin-bottom: 0; } html.comparatori-prezzo .dettagli-comparatori a.button { color: #FFF; margin-top: 20px; width: 260px; } html.comparatori-prezzo .dettagli-comparatori a.button:hover { color: #f44a3e; text-shadow: none; } @-webkit-keyframes trovaprezzi { 0% {opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 16.65% {opacity: 0; -webkit-transform: translateX(-75%); transform: translateX(-75%); } 16.66% {opacity: 0; -webkit-transform: translateX(75%); transform: translateX(75%); } 49.99% {opacity: 0; -webkit-transform: translateX(75%); transform: translateX(75%); } 66.65% {opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes trovaprezzi { 0% {opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 16.65% {opacity: 0; -webkit-transform: translateX(-75%); transform: translateX(-75%); } 16.66% {opacity: 0; -webkit-transform: translateX(75%); transform: translateX(75%); } 49.99% {opacity: 0; -webkit-transform: translateX(75%); transform: translateX(75%); } 66.65% {opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes kelkoo { 0% {opacity: 0; -webkit-transform: translateX(-25%); transform: translateX(-25%); } 16.65% {opacity: 1; -webkit-transform: translateX(-100%); transform: translateX(-100%); } 49.99% {opacity: 1; -webkit-transform: translateX(-100%); transform: translateX(-100%); } 66.65% {opacity: 0; -webkit-transform: translateX(-175%); transform: translateX(-175%); } 99.9% {opacity: 0; -webkit-transform: translateX(-175%); transform: translateX(-175%); } } @keyframes kelkoo { 0% {opacity: 0; -webkit-transform: translateX(-25%); transform: translateX(-25%); } 16.65% {opacity: 1; -webkit-transform: translateX(-100%); transform: translateX(-100%); } 49.99% {opacity: 1; -webkit-transform: translateX(-100%); transform: translateX(-100%); } 66.65% {opacity: 0; -webkit-transform: translateX(-175%); transform: translateX(-175%); } 99.9% {opacity: 0; -webkit-transform: translateX(-175%); transform: translateX(-175%); } } html.comparatori-prezzo .main > .intro > .content { overflow: visible; } html.comparatori-prezzo .intro .logo { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; } html.comparatori-prezzo .intro .logo > div { -webkit-box-flex: 0; -ms-flex: 0 0 100%; flex: 0 0 100%; } html.comparatori-prezzo .intro .logo .trovaprezzi { -webkit-animation: trovaprezzi 12s 2s cubic-bezier(0.86, 0, 0.07, 1) infinite; animation: trovaprezzi 12s 2s cubic-bezier(0.86, 0, 0.07, 1) infinite; } html.comparatori-prezzo .intro .logo .kelkoo { -webkit-animation: kelkoo 12s 2s cubic-bezier(0.86, 0, 0.07, 1) infinite; animation: kelkoo 12s 2s cubic-bezier(0.86, 0, 0.07, 1) infinite; opacity: 0; -webkit-transform: translateX(-25%); -ms-transform: translateX(-25%); transform: translateX(-25%); } @media only screen and (min-width: 736px) { html.comparatori-prezzo .intro h1 { font-size: 3em; line-height: 70px; } html.comparatori-prezzo h3.caption { font-size: 1.8em; } } /* servizi-consulenza-ecommerce */ html.servizi.consulenza-ecommerce .testimonials { margin-top: 50px; } /* checkout */ html.checkout .content { max-width: 650px; overflow: visible; } html.checkout h2 { font-size: 14px; margin: .8em 0; line-height: 1em; } html.checkout .note { font-size: 11px; margin-top: 10px; } html.checkout .order-choices-box { border: 1px solid #ddd; float: left; margin-top: 10px; overflow: auto; padding: 5px; width: 400px; } html.checkout fieldset.check-radio label, label.check-radio { display: block; line-height: 20px; margin: 0; margin-bottom: 5px; padding: 0; width: auto; } html.checkout fieldset.check-radio label:last-child, label.check-radio:last-child { margin-bottom: 0; } html.checkout .main .buttons { margin-top: 40px; text-align: center; } /* checkout index.html */ html.checkout.index title { color: #535353; font-weight: normal; font-size: 28px; margin: 10px 0 20px 0; } html.checkout.index .row { border-bottom: 1px solid #e6e6e6; font-size: 13px; padding: 10px 0 20px 0; overflow: hidden; } html.checkout.index .column { -webkit-box-flex: 1; -ms-flex: 1 1 50%; flex: 1 1 50%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding-right: 1em; padding-left: 0; } html.checkout.index .order-choices-box { display: block; max-height: 175px; overflow-y: auto; } html.checkout.index .check-radio input[type="checkbox"] { outline: none; position: relative; top: 2px; } html.checkout.index .check-radio input[type="checkbox"]:focus, html.checkout.index .check-radio input[type="radio"] { box-shadow: none; } html.checkout.index .check-radio span { float: right; } /* checkout cart.html */ html.checkout.cart .cart-items th, html.checkout.cart .cart-items td { padding: 7px; text-align: right; } html.checkout.cart .cart-items th { font-size: 11px; } html.checkout.cart .cart-items th.product { text-align: left; } html.checkout.cart .cart-items .details { text-align: left; width: 100%; } html.checkout.cart .cart-items .image, html.checkout.cart .cart-items .quantity { text-align: center; } html.checkout.cart .cart-items input[name="quantity"] { width: 75px; } html.checkout.cart .cart-items th.total-price { min-width: 100px; } html.checkout.cart .cart-items td.price, html.checkout.cart .cart-items td.total-price, html.checkout.cart .cart-items tr.discount td { text-align: right; white-space: nowrap; } html.checkout.cart .cart-items .remove-item { font-size: 11px; margin-top: 3px; text-align: right; } html.checkout.cart .cart-items .to-quote { color: green; } html.checkout.cart .cart-buttons { margin: 10px 0 30px 0; overflow: hidden; } html.checkout.cart .cart-continue-button, html.checkout.cart .cart-update-button { float: left; margin-right: 5px; } html.checkout.cart .cart-checkout-button { float: right; } html.checkout.cart .cart-coupon { margin-bottom: 10px; padding: 5px; } html.checkout.cart .cart-coupon input { float: right; margin: 3px 0 0 3px; } html.checkout.cart .cart-items th { background: #E7E7E7; color: #333333; } html.checkout.cart .cart-items .total th { background: none; } html.checkout.cart .cart-items th, html.checkout.cart .cart-items td { border: 1px solid #E9E9E9; } html.checkout.cart .cart-items .total th, html.checkout.cart .cart-items .total td { color: #21792F; font-size: 16px; vertical-align: middle; } html.checkout.cart .cart-items .total th { color: #666; } html.checkout.cart .coupon { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 40px; } html.checkout.cart .coupon h3 { margin: 0; } html.checkout.cart .coupon form { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; } html.checkout.cart .coupon form .input { display: inline-block; position: relative; } html.checkout.cart .coupon form .input label { color: #cdcdcd; font-size: .8em; left: 0; padding: 3px 9px; position: absolute; top: 0; } html.checkout.cart .coupon form input { background: transparent; border-radius: 3px 0 0 3px; height: auto; margin-bottom: 0; padding: 1.4em .6em .2em; position: relative; } html.checkout.cart .coupon form input:focus { box-shadow: inset 0 0 0 2px #7ABA07; } html.checkout.cart .coupon form button { border-radius: 0 3px 3px 0; box-shadow: 0 0 1px; } /* checkout order.html */ html.checkout.order .card-data { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } html.checkout.order .card-expiry { -webkit-box-flex: 1; -ms-flex: 1 1 66%; flex: 1 1 66%; } html.checkout.order .card-cvc { -webkit-box-flex: 1; -ms-flex: 1 1 33%; flex: 1 1 33%; text-align: right; } html.checkout.order .payment-methods .payment-paypal { display: none; } html.checkout.order .payment-methods .errors { height: 0; margin-top: 5px; -webkit-transition: height 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: height 0.4s cubic-bezier(0.19, 1, 0.22, 1); overflow: hidden; } html.checkout.order .payment-methods .error { background: #ee5d3a; border-radius: 3px; color: #fff; font-size: .85em; opacity: 0; padding: .3em .5em; text-shadow: 0 0 1px #000; -webkit-transform: scale(.95); -ms-transform: scale(.95); transform: scale(.95); -webkit-transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1); transition: transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.4s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform 0.4s cubic-bezier(0.19, 1, 0.22, 1); white-space: nowrap; } html.checkout.order .payment-methods .error.visible { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } html.checkout.order textarea { height: 130px; resize: none; width: 100%; } /* chi-siamo */ html.chi-siamo section.intro { background: #F9F9F9; padding-bottom: 50px; } html.chi-siamo section.intro h1 { color: #254575; font-size: 2.8em; } html.chi-siamo section.points { background: #7ABA07; color: #FFF; margin-top: 0; margin-bottom: 50px; padding: 40px 0; text-shadow: 0 0 1px rgba(0, 0, 0, .5); } html.chi-siamo section.points li:first-child { padding-left: 0; } html.chi-siamo section.points li:last-child { padding-right: 0; } html.chi-siamo section.points h3 { font-weight: normal; margin: 24px 0 14px 0; } html.chi-siamo section.points p { font-size: 1em; } html.chi-siamo .contacts { margin-top: 60px; } html.chi-siamo .main a, html.chi-siamo .main a:visited { color: #007AB8; } /* contattaci */ html.contattaci h1 { color: #254575; font-size: 2.8em; } html.contattaci h2 { color: #254575; font-size: 1.6em; margin-top: 60px; } html.contattaci .form-input, html.contattaci textarea { max-width: 100%; } html.contattaci textarea { height: 100px; resize: none; } html.contattaci .main .buttons { text-align: center; margin: 20px; } html.contattaci #application-form { padding: 0 2px; } html.contattaci textarea::-webkit-input-placeholder { color: #bfbfbf; } html.contattaci textarea::-moz-placeholder { color: #bfbfbf; } html.contattaci textarea:-ms-input-placeholder { color: #bfbfbf; } /* clienti */ html.clienti section.intro { background: #F9F9F9; margin-bottom: 50px; padding-bottom: 50px; } html.clienti section.intro h1 { color: #254575; font-size: 2.5em; line-height: 1.5em } html.clienti section.intro .segments { margin: 0 auto; width: 300px; } html.clienti section.intro .segments p { color: #666; margin-bottom: 8px; padding-left: 2px; text-align: center; } html.clienti section.intro .segments select { color: #666; width: 300px; } /* blog-index */ html.blog.index h1 { font-weight: normal; } .blog-hero { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; margin-bottom: 20px; } html.blog.index .blog-hero { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .blog-hero article { -webkit-box-flex: 1; -ms-flex: 1 1 0px; flex: 1 1 0; margin-right: 20px; } .blog-hero aside { width: 31.9%; } .blog-hero aside { background: #fafafa; border: 1px solid #f0f0f0; border-top-left-radius: 6px; border-top-right-radius: 6px; color: #333; } .blog-hero .blog-subscription { padding-bottom: 0px; } .blog-hero .blog-subscription form { border-radius: 6px; display: block; padding: 30px; } .blog-hero .blog-subscription h3 { font-size: 1.6em; font-weight: normal; margin-top: -10px; } .blog-hero .blog-subscription input[type=email] { width: 100%; } .blog-hero .blog-subscription .consent { border-radius: 5px; color: #666; font-size: 13px; margin-bottom: 12px; padding: 6px; } .blog-hero .blog-subscription .consent:hover { background: #ebeeee; cursor: pointer; } .blog-hero .blog-subscription button { background: -webkit-linear-gradient(#42a1ec, #0070c9); background: linear-gradient(#42a1ec, #0070c9); color: #fff; height: 40px; width: 100%; } .blog-hero .blog-subscription .note { color: #888; font-size: 0.9em; padding-top: 16px; text-align: center; } .blog-hero aside hr { width: 80%; } .blog-hero .recents { padding: 30px; } .blog-hero .recents h3 { font-weight: normal; margin-top: 0; padding-top: 0; } .blog-hero .recents div { padding-bottom: 1em; } .blog-hero .recents div a { display: block; } html.blog.index .blog-subscribe-error { color: #f00; display: none; } html.blog.index article .image { background: #FFF; display: block; overflow: hidden; } html.blog.index article .image a { display: block; } html.blog.index article .image a img { border: 1px solid #ebf0f4; border-top-left-radius: 6px; border-top-right-radius: 8px; display: block; } html.blog.index article .text { background: #f2f5f8; min-height: 265px; position: relative; } html.blog.index .blog-hero article .text { min-height: 200px; } html.blog.index article h2 { font-size: 1.8em; font-weight: normal; line-height: 1.3em; margin: 0; } html.blog.index .blog-hero article h2 { font-size: 2.2em; } html.blog.index article h2 a { color: #333; display: block; padding: 20px; } html.blog.index article .summary { position: absolute; bottom: 0; left: 0; } html.blog.index article .summary a { color: #30383C; display: block; padding: 20px; padding-top: 0; } html.blog.index h1 { font-size: 42px; } html.blog.index .not-published { background: -webkit-linear-gradient(#f0684a,#e65230); background: linear-gradient(#f0684a,#e65230); border: 1px solid #db5030; border-radius: 3px; color: #fff; padding: 2px 4px 3px; float: left; margin: 13px 5px 0; } html.blog.index .posts { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; margin-bottom: 20px; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } html.blog.index .posts article { margin-bottom: 20px; width: 31.9%; } html.blog.index .posts article .image { border-bottom: 0; } /* blog-post */ html.blog.post .blog-hero { margin-top: 50px; } html.blog.post .summary { overflow: hidden; } html.blog.post .social-share { float: right; } html.blog.post h1 { color: #333; font-size: 42px; font-weight: normal; line-height: 1.2em; margin: 16px 0 28px 0; } html.blog.post h2 { color: #333; font-size: 28px; font-weight: normal; line-height: 1.3em; margin: 40px 0 30px 0; } html.blog.post h3 { color: #DDDDDD; font-size: 20px; font-weight: normal; line-height: 1.3em; margin: 40px 0 30px 0; } html.blog.post .image { max-height: 500px; } html.blog.post .image img { height: auto; width: 100%; vertical-align: bottom; } html.blog.post article .post-content { color: #333; font-size: 1.3em; line-height: 1.6em; margin-top: 50px; } html.blog.post article .post-content img { display: block; height: auto; margin: 3em auto; max-width: 100%; } html.blog.post article .post-content a { text-decoration: underline; } html.blog.post article .post-content a:visited { color: #551A8B; } html.blog.post .not-published { background: -webkit-linear-gradient(#f0684a,#e65230); background: linear-gradient(#f0684a,#e65230); border: 1px solid #db5030; border-radius: 3px; color: #fff; padding: 2px 4px 3px; float: left; margin: 47px 5px 0; } /* checkout-order */ html.checkout.order fieldset { border: none; padding: 0; margin: 0; } html.checkout.order .payments.container { background: #F5F5F7; border: 1px solid #BFC4C7; border-radius: 5px; margin: 30px 0; } html.checkout.order .period label { display: block; margin-bottom: 10px; } html.checkout.order .period input[type="radio"] { float: left; height: auto; margin-top: 2px; } html.checkout.order .alternative-payments { background: #f5f5f7; border-radius: 5px; display: none; font-size: 11px; padding: 10px; } html.checkout.order .review, html.checkout.order .review .month, html.checkout.order .review .year { display: none; } html.checkout.order .subscription #wait-popup { background: #fff; border: 1px solid #ddd; border-radius: 10px; display: none; font-size: 16px; min-height: 150px; left: 50%; margin: auto; margin-left: -200px; position: absolute; padding: 40px; text-align: center; width: 400px; z-index: 5; } html.checkout.order .subscription #wait-popup div { margin-bottom: 30px; } html.checkout.order .subscription #overlay { background: #333; bottom: 0; display: none; left: 0; opacity: 0.4; position: fixed; right: 0; top: 0; z-index: 3; } html.checkout.order .subscription body.operation-running #wait-popup, html.checkout.order .subscription body.operation-running #overlay { display: block; } html.checkout.order .subscription .paypal-authorized { display: none; text-align: center; } html.checkout.order .subscription .paypal-authorized span { color: #7ABA07; font-size: 16px; font-weight: bold; text-align: center; } html.checkout.order .subscription .paypal-authorized div { margin: 5px 0 10px; } html.checkout.order .subscription label h2 { display: inline; font-size: 15px; padding-left: 5px; } html.checkout.order .subscription div.payment-paypal { padding: 10px; text-align: center; } html.checkout.order .subscription #template-stateprov-line select { display: none; } html.checkout.order .subscription #template-stateprov-line select[name="StateProv"] { display: inline; } html.checkout.order .payment-methods { margin: 0 auto; max-width: 500px; } html.checkout.order #credit-card { padding: 10px; } html.checkout.order #credit-card label { color: #6C7D86; display: block; font-size: .9em; line-height: 24px; margin-bottom: .3em; } html.checkout.order .card-security-note { color: #6C7D86; margin: 20px 0 10px; text-align: right; } html.checkout.order .card-security-note img { float: right; height: auto; margin-bottom: 20px; margin-left: 10px; width: 25px; } html.checkout.order .card-number { margin-bottom: 20px; } html.checkout.order .card-number input { margin-bottom: 0; width: 100%; } html.checkout.order .card-expiry select { width: 90px; } html.checkout.order .card-expiry span { color: #85A1B5; } html.checkout.order .card-cvc input { margin-bottom: 0; width: 60px; } html.checkout.order .card-cvc span { color: #85A1B5; display: block; font-size: 12px; line-height: 1.2em; margin-top: 4px; } html.checkout.order .card-name { margin-bottom: 30px; } html.checkout.order .card-name input { margin-bottom: 0; width: 100%; } html.checkout.order .card-postal-code { float: right; } html.checkout.order .note { font-size: 11px; margin-top: 10px; } html.checkout.order .order-choices-box { border: 1px solid #ddd; overflow: auto; padding: 5px; } html.checkout.order fieldset.check-radio label, label.check-radio { display: block; line-height: 20px; margin: 0; margin-bottom: 5px; padding: 0; width: auto; } html.checkout.order fieldset.check-radio label:last-child, label.check-radio:last-child { margin-bottom: 0; } html.checkout.order h2 { font-size: 14px; margin: .8em 0; line-height: 1em; } html.checkout.order .right { float: right; } nav.features .row { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; -ms-flex-pack: distribute; justify-content: space-around; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } nav.features .content { margin-top: 40px; } nav.features .row .column { margin: 20px 0; padding: 0; } nav.features svg { height: 82px; width: 82px; } html.caratteristiche nav.features svg { height: 72px; width: 72px; } nav.features .selected svg { height: 60px; width: 60px; } nav.features h6 { font-size: 1em; font-weight: normal; margin-bottom: 0; } html.caratteristiche nav.features h6 { font-weight: bold; text-decoration: underline; } nav.features a { background-color: transparent; border-radius: 8px; color: #666; display: block; margin: 2px; padding: 13px; -webkit-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out; transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out; } nav.features a svg * { fill: #7ABA07; -webkit-transition: fill 0.1s ease-in-out; transition: fill 0.1s ease-in-out; } @media screen and (min-width:851px) { nav.features a:hover { background: #F6F6F6; color: #000; } nav.features a:hover svg * { fill: #013a4b; } } html.catalogo img { display: block; margin: 0 auto; } html.catalogo nav.features .catalog a, html.marketing-seo nav.features .marketing a, html.ordini-spedizioni nav.features .orders a, html.vendere-estero nav.features .foreign-sales a, html.gestione-clienti-ecommerce nav.features .customers a, html.preventivi-sconti-quantita nav.features .quotes a, html.grafica nav.features .design a { background: #F6F6F6; color: #000; cursor: default; } html.catalogo nav.features .catalog svg *, html.marketing-seo nav.features .marketing svg *, html.ordini-spedizioni nav.features .orders svg *, html.vendere-estero nav.features .foreign-sales svg *, html.gestione-clienti-ecommerce nav.features .customers svg *, html.preventivi-sconti-quantita nav.features .quotes svg *, html.grafica nav.features .design svg * { fill: #013a4b; } nav.features + h1 { color: #254575; font-size: 2.4em; font-weight: 900; margin-bottom: 10px; } nav.features + h2 { margin-top: 0; margin-bottom: 30px } nav.features + ul { color: #666; font-size: 24px; font-weight: 300; line-height: 40px; margin-left: 50px; margin-top: 30px; } section.features a { border-radius: 10px; display: block; padding: 20px; } section.features a:hover { background: #F6F6F6; } section.features svg * { stroke: #7ABA07; } html.grafica .divider, html.marketing-seo .divider, html.ordini-spedizioni .divider, html.preventivi-sconti-quantita .divider, html.vendere-estero .divider { margin-top: 40px; } html.negozio-online .divider { margin-top: 120px; } .app-icon { border: 2px solid #F0F0F0; border-radius: 20px; } .bg-green { background-color: #00D379; color: #FFF; } .bg-green svg * { stroke: #FFF; } .versioni { margin-top: 30px; text-align: center; } .versioni a { border: 1px solid #FFF; border-radius: 5px; line-height: 28px; padding: 6px 20px; text-transform: uppercase; } .versioni a:hover { background: #FFF; color: #47a3da; } .new { background: rgb(122, 186, 7); border-radius: 5px; color: #FFF; display: inline-block; font-size: 13px; line-height: 1.5em; margin-left: 10px; padding: 1px 8px; text-transform: uppercase; vertical-align: middle; } .social-share a { border-radius: 3px; display: inline-block; font-size: 0; height: 28px; margin: 0 3px; padding: 4px; width: 28px; } .social-share a.pinterest { background-color: #BD081C; } .social-share a.facebook { background-color: #385A98; } .social-share a.twitter { background-color: #55ACEE; } .social-share a.linkedin { background-color: #0976B4; } .social-share svg * { fill: #FFF; } /* images 2x */ @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx), (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) { html.index .hero .cover-image { background-image: url(/images/vendere-online-desktop-2x.jpg); } html.standard-advanced-b2c .cover-image { background-image: url('/images/channel-b2c-desktop-2x.jpg'); } html.standard-advanced-b2b .cover-image { background-image: url('/images/channel-b2b-desktop-2x.jpg'); } html.piani-assistenza .cover-image { background-image: url('/images/assistenza-ecommerce-desktop-2x.jpg'); } html.ecommerce-hosting .cover-image { background-image: url('/images/ecommerce-hosting-desktop-2x.jpg'); } } html.sitemap .main ul { font-size: 1.1em; list-style-type: none; } html.sitemap .main a { color: #2B8DD6; } .hero.gdpr { color: #FFF; position: relative; padding-bottom: 50px; } .hero.gdpr .bg1 { height: 100%; background: #003399; left: 0; position: absolute; right: 0; top: 0; -webkit-transform: skewY(-6deg); -ms-transform: skewY(-6deg); transform: skewY(-6deg); -webkit-transform-origin: 0; -ms-transform-origin: 0; transform-origin: 0; z-index: -1; } .hero.gdpr .bg2 { height: 200px; background: #a4b9e3; left: 0; position: absolute; right: 0; top: 0; -webkit-transform: skewY(-12deg); -ms-transform: skewY(-12deg); transform: skewY(-12deg); -webkit-transform-origin: 0; -ms-transform-origin: 0; transform-origin: 0; z-index: -1; } .hero.gdpr h1 { color: #FFF; font-size: 56px; font-weight: 300; line-height: 70px; margin-top: 20px; text-align: center; } .hero.gdpr h2 { color: #FFF; font-size: 80px; font-weight: bold; margin-bottom: 30px; margin-top: 46px; padding-top: 0; text-align: left; } .hero.gdpr h3 { color: #FFF; clear: left; font-size: 24px; } .hero.gdpr a, .hero.gdpr a:visited { color: #FFF; } html.nuova-versione-maggio-2018 h2 { font-weight: 300; text-align: center; } html.nuova-versione-maggio-2018 a.button.ghost { border-color: #FFF; color: #FFF; margin: 12px; } html.nuova-versione-maggio-2018 a.button.ghost.blue { background: #003399; } html.nuova-versione-maggio-2018 a.button.ghost:hover { color: #FFF; } /* section intro-enterprise */ section.intro-enterprise { padding-top: 60px; padding-bottom: 60px; text-align: center; background: linear-gradient(to bottom, #291709 60%, #8b8577 100%); color: #e9c982;} section.intro-enterprise.left { text-align: left; } section.intro-enterprise .content { font-size: 1.3em; } section.intro-enterprise h1 { font-size: 3.5em; line-height: 1.05em; margin-bottom: 0.5em; margin-top: 0; } section.intro-enterprise h1 + p { color: #777; line-height: 30px; } section.intro-enterprise h1 + h2 { font-size: 1.3em; font-weight: 300; line-height: 1.1em; } section.intro-enterprise h2 { color: #3D3D3D; font-size: 3em; font-weight: 300; line-height: 1.1em; } section.intro-enterprise h3 { font-size: 1.6em; font-weight: 300; line-height: 1.1em; margin-bottom: 1em; } section.intro-enterprise h4 { font-size: 1.4em; font-weight: 300; line-height: 1.6em; } section.intro-enterprise strong { font-weight: 900; } section.intro-enterprise p { font-weight: 300; margin-bottom: 1em; } section.intro-enterprise .checkpoints { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } section.intro-enterprise .checkpoints img { height: auto; width: 160px; } section.intro-enterprise .checkpoints .text { color: #666; font-size: 18px; font-weight: 300; line-height: 1.8em; text-align: left; } section.intro-enterprise .checkpoints .image { text-align: center; } section.intro-enterprise .checkpoints .image, section.intro-enterprise .checkpoints .text { -webkit-box-flex: 0; -ms-flex: 0 1 40%; flex: 0 1 40%; } .mobile { display: none; } /* Copyright (c) 2018 Open2b Software Snc. */ @media screen and (max-width:990px) { .content { width: 100%; } .content, section.hero .content { padding: 0 15px; } html.store.index section.apps .content { padding-top: 80px; } section.signup-strip .content { padding-left: 30px; padding-right: 30px; } html.index .home-logo { margin-left: 0; } html.index .banner-new-2022 { margin-bottom: 10px; } html.index .banner-new-2022 .content a span:last-child { display: block; margin: 20px 0 0 0; } } @media only screen and (max-width: 1068px) { html.index .hero .cover-image { background-image: url('/images/vendere-online-tablet.jpg'); height: 52.34vw; } html.standard-advanced .cover-image { background-image: url('/images/channel-b2c-tablet.jpg'); height: 44.86vw; } html.standard-advanced-b2b .cover-image { background-image: url('/images/channel-b2b-tablet.jpg'); height: 70.1vw; } html.piani-assistenza .cover-image { background-image: url('/images/assistenza-ecommerce-tablet.jpg'); height: 31.78vw; } html.hosting-email .cover-image { background-image: url('/images/ecommerce-hosting-tablet.jpg'); background-position: 46% 0; } } @media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (max-width: 1068px), only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5), only screen and (max-width: 1068px) and (min-resolution: 1.5dppx), only screen and (max-width: 1068px) and (min-resolution: 144dpi) { html.index .hero .cover-image { background-image: url('/images/vendere-online-tablet-2x.jpg'); } html.standard-advanced .cover-image { background-image: url('/images/channel-b2c-tablet-2x.jpg'); } html.standard-advanced-b2b .cover-image { background-image: url('/images/channel-b2b-tablet-2x.jpg'); } html.piani-assistenza .cover-image { background-image: url('/images/assistenza-ecommerce-tablet-2x.jpg'); } html.hosting-email .cover-image { background-image: url('/images/ecommerce-hosting-tablet-2x.jpg'); } } @media only screen and (max-width: 735px) { html.index .hero .cover-image { background-image: url('/images/vendere-online-mobile.jpg'); height: 100.54vw; } html.standard-advanced .cover-image { background-image: url('/images/channel-b2c-mobile.jpg'); height: 76.09vw; } html.standard-advanced-b2b .cover-image { background-image: url('/images/channel-b2b-mobile.jpg'); height: 67.93vw; } html.piani-assistenza .cover-image { background-image: url('/images/assistenza-ecommerce-mobile.jpg'); height: 81.52vw; } html.hosting-email .cover-image { background-image: url('/images/ecommerce-hosting-mobile.jpg'); background-position: 50% 50%; height: 68vw; } html.hosting-email section.hero .content .text { text-align: center; } html.hosting-email a.contact { margin: 10px auto 50px; } } @media only screen and (-webkit-min-device-pixel-ratio: 1.5) and (max-width: 735px), only screen and (max-width: 735px) and (-webkit-min-device-pixel-ratio: 1.5), only screen and (max-width: 735px) and (min-resolution: 1.5dppx), only screen and (max-width: 735px) and (min-resolution: 144dpi) { html.index .hero .cover-image { background-image: url('/images/vendere-online-mobile-2x.jpg'); } html.standard-advanced .cover-image { background-image: url('/images/channel-b2c-mobile-2x.jpg'); } html.standard-advanced-b2b .cover-image { background-image: url('/images/channel-b2b-mobile-2x.jpg'); } html.piani-assistenza .cover-image { background-image: url('/images/assistenza-ecommerce-mobile-2x.jpg'); } } @media screen and (max-width:481px) and (orientation:portrait) { section.signup-strip .signup, header .signup, .trial-image .content.trial .desktop, .trial-opener, .trial-opener-container { display: none !important; } section.signup-strip .fallback { display: block; } .mobile { display: block; text-align: center; } .try-update-buttons { flex-wrap: wrap; } .big button { height: fit-content !important; line-height: 25px !important; padding: 1em !important; } } @media screen and (max-width:813px) and (orientation:landscape) { section.signup-strip .signup, header .signup, .trial-image .content.trial .desktop, .trial-opener, .trial-opener-container { display: none !important; } section.signup-strip .fallback { display: block; } .mobile { display: block; text-align: center; } .try-update-buttons { flex-wrap: wrap; } } @media screen and (max-width:1023px) { .tabs li svg, .tabs li img { display: none; } /* hamburgers */ /*! * Hamburgers * @description Tasty CSS-animated hamburgers * @author Jonathan Suh @jonsuh * @site https://jonsuh.com/hamburgers * @link https://github.com/jonsuh/hamburgers */ .hamburger { display: inline-block; cursor: pointer; -webkit-transition-property: opacity, -webkit-filter; transition-property: opacity, -webkit-filter; transition-property: opacity, filter; transition-property: opacity, filter, -webkit-filter; -webkit-transition-duration: 0.15s; transition-duration: 0.15s; -webkit-transition-timing-function: linear; transition-timing-function: linear; font: inherit; color: inherit; text-transform: none; background-color: transparent; border: 0; margin: 0; overflow: visible; } .hamburger-box { width: 32px; height: 24px; display: inline-block; position: relative; } .hamburger-inner { display: block; top: 50%; margin-top: -2px; } .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { width: 32px; height: 4px; background-color: #254575; border-radius: 4px; position: absolute; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transition-duration: 0.15s; transition-duration: 0.15s; -webkit-transition-timing-function: ease; transition-timing-function: ease; } .hamburger-inner::before, .hamburger-inner::after { content: ""; display: block; } .hamburger-inner::before { top: -10px; } .hamburger-inner::after { bottom: -10px; } .hamburger--spin .hamburger-inner { -webkit-transition-duration: 0.22s; transition-duration: 0.22s; -webkit-transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } .hamburger--spin .hamburger-inner::before { -webkit-transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in; transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in; } .hamburger--spin .hamburger-inner::after { -webkit-transition: bottom 0.1s 0.25s ease-in, -webkit-transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); transition: bottom 0.1s 0.25s ease-in, -webkit-transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); transition: bottom 0.1s 0.25s ease-in, transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19), -webkit-transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19); } .hamburger--spin.is-active .hamburger-inner { -webkit-transform: rotate(225deg); -ms-transform: rotate(225deg); transform: rotate(225deg); -webkit-transition-delay: 0.12s; transition-delay: 0.12s; -webkit-transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } .hamburger--spin.is-active .hamburger-inner::before { top: 0; opacity: 0; -webkit-transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out; transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out; } .hamburger--spin.is-active .hamburger-inner::after { bottom: 0; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transition: bottom 0.1s ease-out, -webkit-transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); transition: bottom 0.1s ease-out, -webkit-transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); transition: bottom 0.1s ease-out, transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); } /* plusminus */ .plusminus { display: inline-block; height: 14px; position: relative; width: 36px; } .plusminus > div { background: #fff; border-radius: 3px; height: 3px; left: 50%; opacity: 1; position: absolute; top: 50%; -webkit-transform-origin: center; -ms-transform-origin: center; transform-origin: center; -webkit-transition: opacity .6s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform .6s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity .6s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform .6s cubic-bezier(0.19, 1, 0.22, 1); transition: transform .6s cubic-bezier(0.19, 1, 0.22, 1), opacity .6s cubic-bezier(0.19, 1, 0.22, 1); transition: transform .6s cubic-bezier(0.19, 1, 0.22, 1), opacity .6s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform .6s cubic-bezier(0.19, 1, 0.22, 1); width: 50%; } .plusminus .horizontal { -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .plusminus .vertical { -webkit-transform: translate(-50%, -50%) rotateZ(90deg); -ms-transform: translate(-50%, -50%) rotate(90deg); transform: translate(-50%, -50%) rotateZ(90deg); } .expanded .plusminus .vertical { -webkit-transform: translate(-50%, -50%) rotateZ(180deg); -ms-transform: translate(-50%, -50%) rotate(180deg); transform: translate(-50%, -50%) rotateZ(180deg); } .expanded .plusminus .horizontal { opacity: 0; } /* dropdown */ html.dropdown-opened { overflow: hidden; position: fixed; top: 0; } header { height: 54px; } header .main { margin: 0 auto; margin: 10px 0; overflow: hidden; } header .mobile-phone { color: green; display: block; float: right; font-size: 16px; line-height: 56px; margin-right: 36px; } header nav > ul { display: none; } header .open-mobile-menu { display: block; float: right; height: 44px; line-height: 58px; outline: none; padding: 5px 0 0; text-align: center; width: 44px; } header .logo { display: block; float: left; height: auto; margin-top: 9px; width: 120px; } header .buttons { float: right; margin-right: 20px; margin-top: 12px; } header .buy { display: none; } header .dropdown { background: #1e3c72; background: -webkit-linear-gradient(to bottom, #2a5298, #1e3c72); background: -webkit-gradient(linear, left top, left bottom, from(#2a5298), to(#1e3c72)); background: -webkit-linear-gradient(top, #2a5298, #1e3c72); background: linear-gradient(to bottom, #2a5298, #1e3c72); bottom: 0; color: #fff; font-size: 18px; left: 0; margin-top: 12px; opacity: 0; overflow: scroll; padding-bottom: 12px; position: fixed; top: 43px; -webkit-transform: rotateY(90deg); transform: rotateY(90deg); -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; -webkit-transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.8s, -webkit-transform .8s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.8s, -webkit-transform .8s cubic-bezier(0.19, 1, 0.22, 1); transition: transform .8s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.8s; transition: transform .8s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1), visibility 0s 0.8s, -webkit-transform .8s cubic-bezier(0.19, 1, 0.22, 1); text-shadow: 0 0 4px #000; visibility: hidden; width: 100%; } header .dropdown.opened { opacity: 1; -webkit-transform: rotateY(0deg); transform: rotateY(0deg); -webkit-transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform .8s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform .8s cubic-bezier(0.19, 1, 0.22, 1); transition: transform .8s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1); transition: transform .8s cubic-bezier(0.19, 1, 0.22, 1), opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform .8s cubic-bezier(0.19, 1, 0.22, 1); visibility: visible; } header .dropdown .pointer { display: none; } header .dropdown .title { padding: 1.3em .8em; } header .dropdown .title.support { display: block; font-size: 1em; padding-left: 3em; } header .dropdown a { color: inherit; display: block; font-size: .9em; padding: 1em 3.4em; } header .dropdown ul { list-style-type: none; margin: 0; padding: 0; } header .dropdown .submenu { height: 0; opacity: 0; overflow: hidden; -webkit-transform: scale(.95); -ms-transform: scale(.95); transform: scale(.95); -webkit-transition: opacity .6s cubic-bezier(0.19, 1, 0.22, 1), height .6s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform .6s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity .6s cubic-bezier(0.19, 1, 0.22, 1), height .6s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform .6s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity .6s cubic-bezier(0.19, 1, 0.22, 1), height .6s cubic-bezier(0.19, 1, 0.22, 1), transform .6s cubic-bezier(0.19, 1, 0.22, 1); transition: opacity .6s cubic-bezier(0.19, 1, 0.22, 1), height .6s cubic-bezier(0.19, 1, 0.22, 1), transform .6s cubic-bezier(0.19, 1, 0.22, 1), -webkit-transform .6s cubic-bezier(0.19, 1, 0.22, 1); } header .dropdown .expanded .submenu { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } header .dropdown .submenu li span { color: #69cdff; font-size: .9em; } /* trials */ .trial-overlay .popup { border-radius: 0; height: 100%; max-width: none; -webkit-transform: scale(.75); -ms-transform: scale(.75); transform: scale(.75); width: 100%; } .trial-overlay.visible .popup { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .trial-overlay .popup > .close { -webkit-transform: translate(-30%, 20%); -ms-transform: translate(-30%, 20%); transform: translate(-30%, 20%); } section.signup-strip .content .text { text-align: center; } section.signup-strip .content .fallback { -webkit-box-flex: 1; -ms-flex: 1 1 50%; flex: 1 1 50%; text-align: center; } section.signup-strip .content .fallback a { display: inline-block; } /* footer */ footer .menus { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; } footer .menus .vertical-menu { -webkit-box-flex: 1; -ms-flex: 0 1 auto; flex: 0 1 auto; padding-left: 13%; width: 50%; } footer ol.breadcrumbs { border-bottom: 1px solid hsla(202, 10%, 29%, 1); margin: 0 10% 20px; padding-bottom: 35px; text-align: center; width: auto; } footer section.vertical-menu ul { margin-bottom: 30px; } /* pricing-plans */ section.pricing-plans .plans.row { display: block; } section.pricing-plans .plans .column { margin-top: 15px; margin-right: 2px; } section.pricing-plans .plans > li { display: none; margin: 0; } section.pricing-plans .plans > li.visible { display: block; } section.pricing-plans .select ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; list-style-type: none; margin: 0; padding: 0; } section.pricing-plans .select .option { background: #fff; border-radius: 3px; -webkit-box-flex: 1; -ms-flex: 1 1 0px; flex: 1 1 0; margin-bottom: 10px; margin-right: 5px; padding: 1em; position: relative; text-align: center; text-decoration: underline; text-shadow: 0 0 0 transparent; -webkit-transition: background-color .2s cubic-bezier(0.19, 1, 0.22, 1), color .2s cubic-bezier(0.19, 1, 0.22, 1); transition: background-color .2s cubic-bezier(0.19, 1, 0.22, 1), color .2s cubic-bezier(0.19, 1, 0.22, 1); white-space: nowrap; } section.pricing-plans .select .option:last-child { margin-right: 0; } section.pricing-plans .select .option.selected { background: #264573; color: #fff; text-shadow: 0 0 3px #000; } .plans-comparison { display: none; } .buy { height: 44px; line-height: 44px; margin: 0px 25%; margin-top: -22px; } section.pricing-plans .content > ul > li .plan-name div { display: inline; } section.pricing-plans ul.plan-features { text-align: center; } section.pricing-plans ul.plan-features li { font-size: 1.3em; } /* index */ .trial-image .content.trial { background: #eaeaea; } /* piani-assistenza */ html.servizi.piani-assistenza section.hero { text-align: center; } html.servizi.piani-assistenza .support .row { display: block; } html.servizi.piani-assistenza .support .why { margin-top: 50px; } /* b2b e negozio-online */ html.b2b .points .row, html.negozio-online .points .row { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column; flex-flow: column; } html.b2b .points .row .column, html.negozio-online .points .row .column { -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -ms-flex-pack: distribute; justify-content: space-around; padding: 10px; } html.b2b .points .row .column .icon, html.negozio-online .points .row .column .icon { -webkit-box-flex: 0; -ms-flex: 0 1 30%; flex: 0 1 30%; } html.b2b .points .row .column .text, html.negozio-online .points .row .column .text { -webkit-box-flex: 0; -ms-flex: 0 1 40%; flex: 0 1 40%; } /* partnership-index */ html.partnership.index section.intro .image { display: none; } /* app */ html.app h1 { margin-bottom: 30px; } html.app .app-container { display: block; } html.app .app-center-column .app-name { display: none; } html.app .app-left-column .icon { display: -webkit-box; display: -ms-flexbox; display: flex; margin-bottom: 40px; width: auto; } html.app .icon .info { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; margin: 0 20px; } html.app .app-left-column .icon img { margin: 0; } html.app .app-long-description { margin: 30px 0; } /* blog-index */ .blog-hero aside hr { display: none; } html.blog.index .posts .column { display: none; } html.blog.index .articles { -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; width: 100%; margin-right: 0; } html.blog.index .articles .blog-subscription { display: block; height: auto; } html.blog.index .blog-hero { display: block; } html.blog.index .blog-hero article { margin: 0 auto; } html.blog.index .blog-hero aside { margin-bottom: 20px; width: auto; } /* blog-post */ html.blog.post .blog-hero { display: block; } html.blog.post .blog-hero article { margin: 0 auto; } html.blog.post .blog-hero aside { margin-top: 50px; width: auto; } /* GDPR */ html.novita-GDPR .hero a.button.ghost { display: block; margin: 12px auto; max-width: 300px; } html.novita-GDPR .hamburger-inner, html.novita-GDPR .hamburger-inner::before, html.novita-GDPR .hamburger-inner::after { background-color: #FFF; } } @media screen and (min-width:851px) and (max-width:1023px) { /* blog */ html.blog.index .blog-hero article { display: -webkit-box; display: -ms-flexbox; display: flex; height: 200px; } html.blog.index .blog-hero article .image { -webkit-box-flex: 0; -ms-flex: 0 0 400px; flex: 0 0 400px; } html.blog.index .blog-hero article .image img { border-bottom-left-radius: 5px; border-top-right-radius: 0; height: 200px; width: 400px; } html.blog.index .blog-hero article h2 { font-size: 2em; } } @media screen and (min-width:768px) and (max-width:1023px) { /* blog */ .blog-hero .blog-subscription > form > div { display: -webkit-box; display: -ms-flexbox; display: flex; } .blog-hero .blog-subscription > form input { margin-bottom: 0; margin-right: 10px; } .blog-hero .blog-subscription > form button { width: 300px; } } @media screen and (max-width:850px) { /* index */ html.index nav.features .content { border: 0; box-shadow: none; } html.index .last-blog-posts .posts article { width: 49%; } /* signup strip */ section.signup-strip .signup { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column; flex-flow: column; padding-left: 0; } section.signup-strip .signup .button, section.signup-strip .signup input { border-radius: 3px; } section.signup-strip .signup input { margin-bottom: 5px; padding: .8em 1.5em; } /* features */ nav.features .content { border: 1px solid #eeeeee; border-width: 1px 0; box-shadow: inset 0 0 7px 0 rgba(0, 0, 0, 0.05); padding: 0; } nav.features .row { -ms-flex-wrap: nowrap; flex-wrap: nowrap; overflow-x: scroll; padding: 0 10px; -webkit-overflow-scrolling: touch; } nav.features .row::-webkit-scrollbar { height: 3px; } nav.features .row::-webkit-scrollbar-thumb { background-color: #bfbfbf; display: block; } nav.features .column > div { height: 100%; padding-right: 15px; } nav.features .row .column { min-width: 27%; } nav.features .column a { -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #aeaeae; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column nowrap; flex-flow: column nowrap; height: 100%; -ms-flex-pack: distribute; justify-content: space-around; padding: 13px; -webkit-transition: color 0.1s ease-in-out; transition: color 0.1s ease-in-out; } html.caratteristiche .features .content { border: 0; box-shadow: none; padding: 0 10px; } html.caratteristiche .features .row { -ms-flex-wrap: wrap; flex-wrap: wrap; overflow: hidden; padding: 0; } /* section customers */ section.customers .shops li { -webkit-box-flex: 0; -ms-flex: 0 1 50%; flex: 0 1 50%; } /* canali-di-vendita */ html.canali-di-vendita .row { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; } html.canali-di-vendita .column.channel { -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; } html.canali-di-vendita .comparatori-prezzo .logos { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; } html.canali-di-vendita .comparatori-prezzo .logos .logo { -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; } html.canali-di-vendita section.channels .channel.b2b, html.canali-di-vendita section.channels .online-shop .channel { background-position: center 65px; } html.canali-di-vendita section.channels .channel.b2b p { padding: 250px 0 0; } /* blog */ html.blog.index .posts article { width: 49%; } } @media screen and (max-width:767px) { .tabs li { font-size: 15px; } .tabs li a { padding: 24px; } .tabs li span { display: none; } .pricing { -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .pricing section.pricing-plans { padding: 0; margin-bottom: 40px; } .pricing ul { list-style-position: inside; } /* section hero */ section.hero { padding-top: 30px; } section.hero h1 { font-size: 2.5em; margin-top: 0.2em; } section.hero h2 { font-size: 1em; } html.index section.hero h1 { font-size: 2.3em; margin-bottom: 0.5em; } html.index section.hero h2 { font-size: 1.1em; } /* section intro */ section.intro { margin-bottom: 0; } section.intro h1 { font-size: 2.5em; line-height: 1.1em; margin-top: 0.2em; margin-bottom: 40px; } section.intro h2 { font-size: 2.3em; line-height: 1.3em; margin-top: 0; } /* section pricing-plans */ section.pricing-plans .content > ul > li > div { padding: 40px 16px 60px 16px; } section.pricing-plans .plan-name { font-size: 1.4em; } section.pricing-plans-details .row { -ms-flex-wrap: wrap; flex-wrap: wrap; } section.pricing-plans-details .column { -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; margin-bottom: 40px; padding: 0; } section.pricing-plans-details .logos { text-align: center; } section.pricing-plans-details .column ul { margin: 0; margin-bottom: 25px; padding: 0; padding-left: 28%; } html.prezzi-installato .banner-installed, html.prezzi .banner-installed { width: 100%; } /* section signup */ section.points.horizontal h5 { margin-bottom: .5rem; } section.brands img { height: auto; width: 50%; } /* index */ html.index .points .row { display: block; } html.index .points .row .column { margin-bottom: 30px; padding: 0; } html.index .points .row .column:last-child { margin-bottom: 0; } /* novita-2018 */ html.novita-2018 .hero ul { font-size: 18px; line-height: 30px; margin-left: 20px; } html.novita-2018 .checkpoints { margin: 0; } html.novita-2018 h2 { font-size: 2em; } html.novita-2018 img { max-width: 100%; } /* ebay */ html.ebay section.intro .app-icon { margin-top: 30px; text-align: center; } /* partnership-index */ html.partnership.index.solutions .column { -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; } /* store-index */ html.store.index div.store-apps .app { -webkit-box-flex : 0; -ms-flex : 0 1 50%; flex : 0 1 50%; } html.store.index div.custom-apps .app dl { margin-bottom: 20px; } html.store.index div.custom-apps .app dt { clear: left; } /* standard-advanced-b2b */ html.standard-advanced-b2b .hero .text ul { margin-left: 0; } /* b2b */ html.b2b section.intro h2 { font-size: 2em; line-height: 1.2em; } /* piani-assistenza */ html.piani-assistenza section.support h2 { margin-top: 0; } /* hosting-email */ html.hosting-email section.hero { margin-bottom: 0; } html.hosting-email h2 { line-height: 1.2em; } /* customers */ section.customers .shops li { min-height: 320px; } } @media screen and (max-width:700px) { section.pricing-plans .row { -ms-flex-wrap: wrap; flex-wrap: wrap; } section.pricing-plans .content > ul > li { -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; } section.pricing-plans .vat-note { margin: 10px 15px; } section.signup-strip .content { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column nowrap; flex-flow: column nowrap; padding: 80px 20px; } section.signup-strip .content .text { margin-bottom: 40px; text-align: center; } section.pricing-plans .content > ul > li .main-info { -ms-flex-preferred-size: auto; flex-basis: auto; } /* pricing-plans.html */ html.prezzi .pricing-plans .select ul, html.prezzi-installato .pricing-plans .select ul { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; } html.prezzi .pricing-plans .select .option, html.prezzi-installato .pricing-plans .select .option { -webkit-box-flex: 1; -ms-flex: 1 1 30%; flex: 1 1 30%; } html.prezzi .pricing-plans .select .option:nth-child(3), html.prezzi-installato .pricing-plans .select .option:nth-child(3) { margin-right: 0; } /* caratteristiche.html */ html.caratteristiche .features .row li { -webkit-box-flex: 1; -ms-flex: 1 1 50%; flex: 1 1 50%; } /* GDPR */ .novita-GDPR h1 { font-size: 40px; } } @media screen and (max-width:600px) { /* hosting-email */ html.hosting-email .service-prices .table { overflow-x: auto; } html.hosting-email .service-prices ul { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } html.hosting-email .service-prices ul li.column { min-width: 28%; } /* features */ nav.features .row .column { min-width: 40%; } nav.features .row .column a h6 { margin-top: 5px; } /* requisiti-html */ html.requisiti .os-icon { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; } html.requisiti .os-icon svg { -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; } html.requisiti .os-icon svg:last-child { margin: 0 8% 25%; } } @media screen and (max-width:580px) { /* index */ html.index .last-blog-posts .posts article { width: 100%; } .row { -ms-flex-wrap: wrap; flex-wrap: wrap; } .row .column-50 { -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; margin-bottom: 40px; padding: 0; } .row .column-100 { padding: 0; } .row .column-50 > h3 { text-align: center; } .row .column-50 > svg { margin: 0 auto; } section.intro .checkpoints { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column nowrap; flex-flow: column nowrap; } section.intro .checkpoints img { margin: 50px 0; } section.intro .checkpoints ul { text-align: center; } /* section customers */ section.customers .shops li { -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; } /* chi-siamo */ html.chi-siamo .points .row { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column nowrap; flex-flow: column nowrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } html.chi-siamo .points .column { margin-bottom: 40px; width: 75%; } /* comparatori-prezzo */ html.comparatori-prezzo .dettagli-comparatori { text-align: center; } html.comparatori-prezzo .dettagli-comparatori a { margin: 20px auto; } /* b2b */ html.b2b .points .row .column:nth-child(2n), html.negozio-online .points .row .column:nth-child(2n) { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-flow: row-reverse nowrap; flex-flow: row-reverse nowrap; } /* blog */ html.blog.index .posts article { width: 100%; } html.blog.index .blog-hero article .text { min-height: 265px; } html.blog.index .blog-hero article h2 { font-size: 1.8em; } html.blog.post article .post-content { margin-top: 32px; } } @media screen and (max-width:500px) { /* fieldset form */ fieldset.form { display: block; } fieldset.form > div { display: block; } fieldset.form > div > label { display: block; padding: 8px 0 2px 8px; } fieldset.form > div > div { display: block; padding: 0; position: static; } fieldset.form > div > div > span:first-child { padding-left: 9px; } fieldset.form input, fieldset.form select { max-width: none; width: 100%; } fieldset.form .required { display: block; top: 10px; width: 100%; } fieldset.form .required span { float: right; } fieldset.form .street .error { top: 42px; } footer .menus .vertical-menu { padding-left: 33%; width: 100%; } footer ol.breadcrumbs { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column nowrap; flex-flow: column nowrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } footer ol.breadcrumbs li { padding: 0 0 5px; } footer ol.breadcrumbs li a { margin-right: 0; } footer ol.breadcrumbs li:after { display: block; margin-top: 5px; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); width: auto; } /* caratteristiche */ html.caratteristiche .features .row li { -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; } /* hosting-email */ html.hosting-email .points .row { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; } html.hosting-email .points .row .column { -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; } html.hosting-email .points .row .column h3 { margin-bottom: 25px; } html.hosting-email .points .row .column div { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -ms-flex-pack: distribute; justify-content: space-around; } html.hosting-email .points .row .column svg { -webkit-box-flex: 1; -ms-flex: 1 1 30%; flex: 1 1 30%; } html.hosting-email .points .row .column span { -webkit-box-flex: 1; -ms-flex: 1 1 55%; flex: 1 1 55%; } /* store-index */ html.store.index div.store-apps .app { -webkit-box-flex : 1; -ms-flex : 1 1 100%; flex : 1 1 100%; } /* app */ html.app h1 { text-align: center; } html.app .icon .info { margin: 0; } html.app .app-left-column .icon { display: block; } html.app .app-left-column .icon img { margin: 0 auto 20px; } }