/*! HTML5 Boilerplate v6.0.1 | MIT License | https://html5boilerplate.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #3c3c3c;
}

@import url("https://fast.fonts.net/lt/1.css?apiType=css&c=71859412-59da-4517-b830-e1a8964abd25&fontids=1475500");
@font-face{
	font-family:"Avenir LT";
	src:url("/fonts/bfb11081-e571-43ad-bed9-8953cfd4133e.woff2") format("woff2"),url("/font/e35493b4-782b-41f0-b3f0-b7e5d0ceab0b.woff") format("woff");
}
html {
    font-size: 1em;
    line-height: 1.4;
}
body, html {
	margin:0; padding:0; height:100%;
}
body {
	font-size:62.5%;font-family: 'Avenir LT', Helvetica, arial, sans-serif; background-color: #fff;
}
/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Vendor-prefixed and regular ::selection selectors cannot be combined:
 * https://stackoverflow.com/a/16982510/7133471
 *
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #323232;
	color:#ffffff;
    text-shadow: none;
}

::selection {
    background: #323232;
	color:#ffffff;
    text-shadow: none;
}
*:focus {outline:0;outline-style: none;}
/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
	font-family: 'Avenir LT', Helvetica, arial, sans-serif;
}

/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */

.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */


/* qui ci vanno tutte le calssi da customizzare con il colore sunset*/

/*FONT COLOR*/
.prodir_custom_color_ft, #navigation .links li a:hover, #secondary-menu a:hover, .home_blog ul li a:hover, .share_link a:hover, span.file a, #navigation .menu li a:hover { color: #ff6666 !important; transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition:all 0.3s;}


/* GENERAL */
img { max-width: 100%; height: auto;}
.logo { position:relative; padding-top: 2em; padding-bottom: 2em}
.logo a {width: 10em; height: 4em; display: inline-block; background-image: url(/img/prodir-logo.png); background-size: contain; background-repeat: no-repeat; }
h1 { margin: 0; padding: 0; font-size: 2rem; font-family: 'Avenir LT',Helvetica,arial,sans-serif; /*font-weight: normal;*/ line-height: 1.2}
h2 { margin: 0; padding: 0; font-size: 3em; font-family: 'Avenir LT',Helvetica,arial,sans-serif; margin-top: 1rem; line-height: 1.2}
#menu_responsive, #menu_responsive_txt { display:none}
.width-fix, .header { margin:0; text-align:left; position:relative; height: 100%; box-sizing: border-box; padding-right: 32%; width: 100%;padding-left: 2%}
.image_top { background:url(../img/prodir-personalised-pens-with-logo.jpg) no-repeat; background-size: cover; background-position: bottom center}
.image_top_thanks { height: 100%}
.slogan { position: absolute; top: 14em}
.slogan h1 { margin:0; padding: 0; font-size: 4.5em}
.slogan h2 { margin:0; padding: 0; font-size: 4.5em}
.slogan p { font-size: 2.2em}
.slogan p a { color:#ff6666; -webkit-transition: all .3s ease; transition: all .3s ease;}
.slogan p a:hover { color:#000000}
.slogan_thanks { color: #1f1dfb; padding: 0 15vw; }
.slogan_thanks p a {  color: #1f1dfb; margin:1rem auto ; letter-spacing: 0; font-size: 16px;     text-decoration: none;border: 1px solid #1f1dfb;border-radius: 2rem;padding: 0rem;display: block;text-align: center; transition: all ease .3s; box-sizing: border-box; height: 45px; line-height: 45px; width: 40%}
.cta{ position:absolute; right: 0; bottom: 0; width: 30%; background-color: #ff6666; color: #FFFFFF; cursor: pointer; box-sizing: border-box; padding: 2em; -webkit-transition: all .3s ease; transition: all .3s ease;}
.slogan_thanks p a:hover { background-color:#1f1dfb; color:#ffffff;}
.cta h2 { margin:0;  font-size: 1.7em; font-weight: normal; background: url(../img/down.png) no-repeat; background-size:contain;  display: block; padding-left:2em; }
.cta:hover {color:#000000;}
.grey_content { background:#646464; padding: 5em 0; color: #FFFFFF }
.grey_content h2 { margin: 0; padding: 0; margin-bottom: 0.5em; font-size: 3.3em; font-family:'Avenir LT', Helvetica, arial, sans-serif }
.text_left, .text_right { float:left; width: 50%; box-sizing: border-box; font-size: 2.2em}
.text_left { padding-right: 2em}
.main_content { position:relative; }
.text_left2 { padding: 0 2em }
.text_left2 p { font-size: 1.6em; }
.content-left { width:70%;}
.content-about-wrapper { padding-top:3em; padding-bottom: 3em; }
.content-about-wrapper h2 {border-top:1px solid #000; padding-top: 3rem}
.gallery_img img { width: 100%; height: auto; }
h2.gallery_title { border:0}
/*.content-bg { width:100%; background-image: url("../img/750x1072.jpg"); background-size: cover; height: 100vh; position: relative; background-position: center;}*/
.content-bg { width:100%; background-color:#fff; /*height: 100vh;*/ position: relative; }
.form_right { position: fixed;  z-index: 100; height: 100vh;width: 30%; background-color: #fe704e; box-sizing: border-box; padding: 2em; color: #000000; right: 0; top: 0; line-height: 1}
.form_right_int {height: 100%;width: 100%; position: relative;}
.form_right h2 { font-size: 2rem; font-weight: normal; font-family:'Avenir LT', Helvetica, arial, sans-serif; line-height: 1.2; margin: 0; padding: 0; padding-bottom: 1rem;}
.form_right p { font-size: 2.2em; font-weight: normal;}
.form_right a { color: #FFFFFF; -webkit-transition: all .3s ease; transition: all .3s ease;}
.form_right a:hover { color: #000000;}
.form_right label { display:inline-block; font-size: 1.6em;/*white-space: nowrap;*/}
.form_field { padding:0.5em 1em; border: 1px solid #000; font-size: 16px; width: 100%; box-sizing: border-box; margin-top: 0.5em; margin-bottom: 1em; -webkit-transition: all .3s ease; transition: all .3s ease; border-radius: 20px; background-color: #fe704e; color: #000000}

.video_btn { text-align:center; margin-bottom: 3rem }
.video_btn a { text-decoration:none; font-size: 0.9rem; color:#323232; border:1px solid #323232; padding: 0.5rem 3rem; border-radius: 30px; margin-top: 1rem; text-transform: uppercase; transition:all ease 0.3s}
.video_btn a:hover { background-color:#323232; color:#ffffff}

/* Change Autocomplete styles in Chrome*/
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
 border: 1px solid #000;
  -webkit-text-fill-color: #000000;
  -webkit-box-shadow: 0 0 0px 1000px #fe704e inset;
  transition: background-color 5000s ease-in-out 0s;
}
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
 border: none;
}



.form_field_select {  font-size: 16px; width: 100%; box-sizing: border-box; -webkit-transition: all .3s ease; transition: all .3s ease; -moz-appearance: none; -webkit-appearance: none; appearance: none;background: transparent; border: none; color: #000000}
.form_field_textarea { height:100px}
.select_wrapper {border: 1px solid #000;border-radius: 20px;padding:0.5em 1em;margin-top: 0.5em; margin-bottom: 2em; }
.checkbox { margin-top:0.5em}
.checkbox a { color:#000000; -webkit-transition: all .3s ease; transition: all .3s ease;}
.checkbox a:hover { color:#FFFFFF}
.form_submit { margin: 2em 0; padding-bottom: 3rem;}
.form_submit_flex { display: flex;}
.form_submit input, .form_submit a { padding: 0; background-color: #FFFFFF; color: #3c3c3c; cursor: pointer; border:0; font-size: 1.5em; -webkit-transition: all .3s ease; transition: all .3s ease; border-radius: 20px; text-decoration: none; display: block; text-align: center; box-sizing: border-box; height: 2.5rem; line-height: 2.4; font-family: 'Avenir LT', Helvetica, arial, sans-serif;}
.form_btn_flex a { background-color:rgba(0,0,0,0.5)}
.form_btn_back { margin-right:0.5rem;}
.form_btn_back a { color:#ffffff}
.form_btn_submit { margin-left:0.5rem;}
.form_submit input { width:100%; flex: 1;}
.form_btn_flex { flex:1}
.form_submit input:disabled, .form_submit a.next_disabled { background-color: #ccc;color:#b4b4b4;}
.form_submit input:hover, .form_submit a:hover { background-color:#3c3c3c; color:#FFFFFF;}
.form_submit input:disabled:hover, .form_submit a.next_disabled:hover { background-color: #ccc;}
.field_errore { background-color:#3c3c3c !important}
.field_errore_txt { color:#cc0000; font-family:'Avenir LT', Helvetica, arial, sans-serif}
.image_logo_here { padding:2em 0}
.image_logo_here img { max-width: 100%}
.captcha_div { margin-top:2em; }
.captcha_div label { margin-bottom: 0.5em}
.captcha_sys { text-align: right;}
.captcha_sys a { font-size:1.2em;}
.grecaptcha-badge { visibility: hidden; }
.google_block { font-size:0.8em}
.google_block a { color:#000000}

/*LANG*/
.languages { position:absolute; right: 0; top:0; font-size: 1.2em; z-index: 10; padding: 2rem;; width: 6.5rem}
.lang_active { background-image: url("../img/chevron-down.svg"); background-size: 15px; background-repeat: no-repeat; background-position: right center; padding-right:15px; cursor: pointer; padding-top: 5px; width: 4rem;}
.lang_close { background-image: url("../img/chevron-up.svg");}
.lang_others { margin-top: 10px; display: none; /*padding-left: 30px;*/ background-color:#3c3c3c;  border-radius: 15px; margin-right:15px;}
.lang_det { padding: 0.5rem 1rem; border-bottom:1px solid #ffffff;}
.lang_det a { text-decoration:none; color: #ffffff}

/* STILE BOTTONE*/
.prodir-div1, .prodir-div1-white {  display:inline-block; position:relative; font-size:12px; margin-bottom:1em }
.prodir-div2, .prodir-div2-white {  display:block; position:relative; z-index:2; padding-right:1em }
.prodir-div1:before { content:" "; background:#ff6666;-webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; width:2em; height:2em; position:absolute; transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition:all 0.3s; display:inline-block; z-index:1}
.prodir-div1:hover:before, .prodir-div1-white:hover:before{ width:100%;-webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em;}
.cookie_newsletter .prodir-div1:first-child:before { content:none}
a.prodir-button, a.prodir-button-white, .paragraph_attach a { display:inline-block; color:#f66; text-decoration:none; font-size:1.3em; padding-left:3.5em;transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition:all 0.3s; background-image:url(../img/svg/linkinterno-01.svg); background-repeat:no-repeat; background-size:33px; background-position:10px 5px; line-height:1.7 }
.testo_chiaro a.prodir-button {background-image:url(../img/svg/linkinterno-01-bianco.svg);}
a.prodir-button-noicon { background-image:none;}
.prodir-div1:hover a.prodir-button { color:#fff; }
.paragraph_attach span.file .prodir-div1:hover a { color:#fff !important; }
.prodir-div1-white:hover a.prodir-button-white { color:#323232; }
a.prodir-button.prodir-icon-external {background-image:url(../img/svg/link-esterno.svg) !important;background-position: 10px 0px !important;}
a.prodir-button-external-white {background-image:url(../img/svg/link-esterno-bianco.svg) !important;background-position: 10px 0px !important;}
a.prodir-button.prodir-icon-download, .paragraph_attach a {background-image:url(../img/svg/download.svg) !important;}

a.prodir-button-white { color:#FFF;}
.prodir-div1-white:before { content:" "; background:#fff;-webkit-border-radius: 2em; -moz-border-radius: 2em; border-radius: 2em; width:2em; height:2em; position:absolute; transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition:all 0.3s; display:inline-block; z-index:1}

/* HEADER */
.header { position:relative;}
.header_fisso { position:fixed; top:0 !important}

/* NAVIGATION*/
.logo { position: relative; }
.logo img { width: 17em }

/* CONTENT */
.box_gen { font-size: 1.5em; display: flex; justify-content:space-between; margin-bottom: 3rem}
.box { background-color:#585a5d; color: #FFFFFF; width: 30%; position: relative; padding: 2rem; box-sizing: border-box;}
.box:after { background: #999999; width: 3em; height: 3em; content: ""; position: absolute; right: 0; bottom: 0;
background: -moz-linear-gradient(-45deg,  #999999 50%, #ffffff 50%);
background: -webkit-linear-gradient(-45deg,  #999999 50%,#ffffff 50%);
background: linear-gradient(135deg,  #999999 50%,#ffffff 50%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#999999', endColorstr='#ffffff',GradientType=1 );
}
.esempi { text-align:center; margin-bottom: 5em}
.esempi img { max-width: 100%;}
.file_desc { margin:0.5em 0;}
.file_desc strong { font-size:1.3em; display: block;}
/* FOOTER */
#footer { background-color:#323232; color:#eaeaea; padding-bottom:3em; position:relative}
#footer p { margin:0; padding:0}
#footer a { color:#eaeaea; text-decoration:none}
.grey { background:#646464; margin-bottom:0.3em; }
#page-front .grey { margin-top:0;}
.grey h2 { color:#FFF; float:left; width:50%; padding:1em 0; margin:0; font-weight:normal; font-size:1.2em; border-bottom:1px solid #919191; margin-bottom:1em; padding-bottom:0.5em }
#freccia_su { position:absolute; background:url(../img/freccia-su.svg) no-repeat; width:1.2em; height:2.6em; right:32%; cursor:pointer}

.footer_flex { display:flex; padding-top: 1rem; flex-wrap: nowrap; justify-content: space-between}
.footer_flex_1 { flex:50% 0 0 }
.footer_flex_2 { flex:30% 0 0; text-align: center;}
.footer_flex_2 a { display: inline-block; padding: 0 0.5rem}
.footer_flex_3 { flex:20% 0 0; text-align: right}
.footer_top {background-image:url(/img/prodir.png); background-size:100px auto; background-position:bottom left; background-repeat:no-repeat;padding-top: 4rem}
#footer .footer_flex_3 a { padding: 0.5em 3em; border: 1px solid #b4b4b4; border-radius:20px; color :#b4b4b4; text-decoration: none; transition: all ease 0.3s}
#footer .footer_flex_3 a:hover {border: 1px solid #ffffff; background-color: #ffffff; color:#323232  }
.footer_rigo { border-bottom:1px solid #ffffff;  }

/* SOCIAL */
.share_link a { display:inline-block; text-align:right; color:#323232; text-decoration:none; font-size:2.3em; padding:0.7em 0em 0 1.8em;}
.social_thankyou { padding-top: 2rem; font-size: 1.2rem; }
.social_thankyou a img { width: 40px; display: inline-block;}
.social_thankyou a { display: inline-block; margin-right: 15px}


/* FORM */
.form-contatti { position:relative;}
.form-item { margin: 1em 0}
.prodir-form-start, fieldset.captcha { border-top:1px solid #6d6d6d; margin-top:2em; padding-top:2em;}
.prodir-form-tit-big label { font-size:2.3em; width:25%; display:inline-block; margin:0; padding:0; margin-right:-4px; vertical-align:top; font-weight:normal; padding-right:5%}
.fieldset-legend { display:none}
.fieldset-wrapper {}
.fieldset-description { font-size:1.3em; padding-bottom:1em}
.prodir-form-tit-big span { display:inline-block; width:29%}
p.prodir-form-tit-big { font-size:2.3em; display:block; margin:0; padding:0; margin-right:-4px; vertical-align:top; font-weight:normal; margin-top:2em; padding-top:2em; }
.prodir-form-tit-big div.form-radios, .prodir-form-tit-big div.form-textarea-wrapper { display:inline-block; width:70%; margin:0; padding:0; margin-right:-4px; vertical-align:top;}
.textarea_remains { background:#eaeaea; text-align:right; margin:0; padding:0; padding-right:1em;}
.prodir-form-inline div, #edit-field-reg-promo-und div, #edit-field-partner-und div { display:inline-block; width:10em}
.prodir-form-column { padding-left:30%}
.prodir-form-column label, .prodir-form-column-50-2 label, .prodir-form-column-30-2 label, #user-login label, .prodir-form-ricevere-qty1 label, .prodir-form-ricevere-qty2 label, .prodir-fomr-lang-news label { font-size:1.4em; font-weight:normal}
.prodir-form-field, #user-login input.form-text, .prodir-form-style input, .prodir-form-style select, #block-views-image-bank-block select { width:100%; border:none; margin:0; padding:0; padding:0.4em; font-size:1.4em; background:#eaeaea; font-family: 'Avenir LT', Helvetica, arial, sans-serif;}
.prodir-form-column-50-1, .prodir-form-column-70-1 { display:inline-block; width:34%; margin-right:-4px;}
.prodir-form-column-70-1 { width:50%}
.prodir-form-column-100, #edit-field-type-of-company-und, #edit-field-type-of-promotional-articl-und { width:70%}
.prodir-form-column-50-2, .prodir-form-column-30-2 { display:inline-block; width:34%; margin-right:-4px; margin-left:2%}
.prodir-form-column-30-2 { width:18%}
.prodir-form-hide { display:none;}
.form-prodir .form-actions {padding-left:30%;  border-top:1px solid #6d6d6d; margin-top:2em; padding-top:2em;}
.form-item .description { font-size: 1.1em; padding:1em 0 }
.prodir-form-ricevere .description { font-size:0.8em; margin:0}
.field_privacy {-webkit-appearance: none; -moz-appearance:none; appearance:none; width: 25px; height: 25px; border:1px solid #000000; cursor: pointer; margin-right: 10px; position: relative}
.field_privacy:checked:after { width: 1px; height: 34px; transform: rotate(45deg); content:""; position: absolute; background-color: #000000; left: 11px; top: -5px;}
.field_privacy:checked:before {width: 1px; height: 34px; transform: rotate(-45deg); content:""; position: absolute; background-color: #000000; left: 11px; top: -5px;}
.field_privacy_div { display:flex;}
.select_wrapper { position: relative;}
.select_wrapper:before { width: 1px; height: 20px; content:""; position: absolute; background-color: #000000; right:  25px}
.select_wrapper:after { width: 1px; height: 20px; content:""; transform: rotate(90deg); position: absolute; background-color: #000000; right: 25px}

.form-submit { margin-left:30%; margin-top:5%; margin-bottom:3em; background:#ff6666; padding:1em 2em; font-size:1.4em; border:none; color:#FFF; cursor:pointer;}
#user-login-form .form-submit { margin-left:43%; margin-top:2%; margin-bottom:1em}
.form-managed-file .form-submit { margin:0; padding:0.5em;}
#edit-submit--3, .page-user-password .form-submit { margin-left:0}
#edit-submit--3 { margin-bottom:1em}
.page-user-password .login-password { display:none}
.login-password { font-size:1.3em; text-decoration:none; color:#ff6666; margin-top:1em; margin-bottom:8em; display:inline-block}
.form-prodir .webform-submit { margin:0; margin-bottom:3em; background:#ff6666; padding:1em 2em; font-size:1.4em; border:none; color:#FFF; cursor:pointer;}
.form-prodir .webform-submit.submit_clicked, .form-prodir:disabled { background-color: #ccc;}
.prodir-form-ricevere {margin-top: -2.5em; font-size: 1.5em; padding-left: 30%;}
.prodir-form-ricevere_long {margin-top: -4.5em; font-size: 1.5em; padding-left: 30%;}
.prodir-form-ricevere2 {margin-top: 0; font-size: 1.5em; padding-left: 30%; white-space:nowrap;}
.prodir-form-ricevere-promo1 {margin-top: -2.3em; font-size: 1.7em; padding-left: 30%;}
.prodir-form-ricevere-promo2 {margin-top: 2.3em; font-size: 1.7em; padding-left: 30%;}
.prodir-form-ricevere-qty1 {margin-top: -6.1em;  padding-left: 70%;}
.prodir-form-ricevere-qty2 {margin-top: -6.1em;  padding-left: 70%;}
.prodir-right { float:right; margin-top:-7.5em}
.prodir-form-conditions a { font-size:1.3em; color:#ff6666}
.prodir-fomr-lang-news { float:right; font-size:1em; margin-top:-6.5em; width:30%}
.form-required { color:#ff6666}
#prodir-different { display:none}
#ricevere_label p { margin:0; padding:0 }
.password-strength { margin-top:0}
#edit-account a { display:none}
/*#edit-account { font-size:1.4em;}*/
.form-type-password-confirm label, #edit-account label, #loginpage label { font-weight:normal}
#edit-submit { margin-left:0}
#loginpage .form-item { font-size:1.4em}
.section-user .easy-breadcrumb { display:none !important}
/*.form-type-password-confirm { font-size:1.5em}*/


/* cookie*/
.cookie, .cookie_newsletter { display:none}
.region-bottom { position:relative}
.cookie, .cookie_newsletter{ position:fixed; bottom:0; width:100%; background:#646464; margin:auto; right:0; left:0; z-index:55555565656565}
.cookie_newsletter { background:#1485C8;z-index:5555556565656}
.cookie h2, .cookie_newsletter h2 { font-size:1.5em; color:#FFF; margin:0; padding:1em; padding-bottom:0}
.cookie p, .cookie_newsletter p {  padding:0 1em; font-size:1.3em; color:#CCC; padding-top:0; margin-top:0}
.cookie_newsletter p { color:#fff}
.cookie .prodir-div1, .cookie_newsletter .prodir-div1 { float:right; margin-top:1em; margin-left:1em}

.gallery_img { padding:2rem 5rem;}


/* linea */
.linea { margin-top:1rem; border-top:1px solid #000000; display:flex; position: absolute; bottom: 1rem; width: 100%;}
.linea_com { border-top:5px solid #b4b4b4; flex: 1; padding-top: 0.5rem; color: rgba(0,0,0,0.3); -webkit-transition: all .3s ease; transition: all .3s ease; }
.linea_active { color:#3c3c3c; border-color: #3c3c3c}
.form_right h3 { margin:0; font-size: 1.6em; padding: 2rem 0}

/*wrapper*/
.form_wrapper { overflow: hidden; width: 100%; display: flex}
.section_gen { flex-shrink: 0; width: 100%; -webkit-transition: all .3s ease; transition: all .3s ease;}
.section_sparisci { margin-left:-100%;}
.form_flex { display:flex}
.form_flex_singolo {}
.form_flex_singolo_1 { flex:5; margin-right: 1rem;}
.form_flex_singolo_2 { flex: 2}

.field_email_div { position:relative;}
.errore { width:100%; background-color: #000000; border-radius: 15px; padding: 1rem; box-sizing: border-box; position: absolute; z-index: 10000;  font-size: 0.9rem; display: none; color:#FFFFFF; margin-top: 4.5rem}
.errore:before {width: 0;
height: 0;
border-style: solid;
border-width: 0 20px 20px 20px;
border-color: transparent transparent #000000 transparent;content:""; position: absolute; top: -7px; left: calc(50% - 20px)}
.errore h1 { margin:0; padding: 0; font-size: 0.9rem; font-weight: normal}
.errore p { margin:0; padding: 0;font-size: 0.9rem;}
.errore_close { background-image:url("../img/times-circle_white.svg"); background-size: contain; width: 2rem; height: 2rem; cursor: pointer; position: absolute; right: 1rem; top: 1rem}



.gallery_responsive { display:none}
.gallery_desktop { display:block}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers
 */

.hidden {
    display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 *
 * 1. For long content, line feeds are not interpreted as spaces and small width
 *    causes content to wrap 1 word per line:
 *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    white-space: nowrap; /* 1 */
}

/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    -webkit-clip-path: none;
    clip-path: none;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
    white-space: inherit;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}




@media only screen and (max-width: 767px) {
	/*.width-fix  { margin:0 10px}*/
	.generale_thanks { padding:0 1rem}
	.header { width:100%}
	.content-left { width:100%;}
	/*.content-bg { height:90vh}*/
	.logo { }
	.slogan { top:10em}
	.slogan h1, h2 { font-size: 1.2rem;}
	.image_top { background-color:#e4e4e4; background-size: 140%;  background-position: center;}
	.cta { width:100%;}
	.text_left, .text_right, .form_right, .text_left2 { float:none; width: 100%; position: relative; height: auto; box-sizing: border-box;}
	.text_left { padding:0}
	.text_left2 p {padding-right:0; font-size: 1.6em}
	.text_right { padding-top:1em}
	.form_field { font-size:16px}
	.grey h2 { display: none;}
	.share_link a {   padding: 0.8em 0em 0.5em 0.8em;}
	.width-fix, .header { padding-right: 2%}
	h1 { font-size: 1.2rem;}
	.canvas_360 { width:30em}
	.content-image-360 { height:15rem}
	.header_360_text { top:5em}
	.box_gen { flex-wrap:wrap}
	.box { margin:1em 0; width: 100%;}
	#freccia_su { right:0;}
	.gallery_img { padding:2rem 0;}
	.form_right h2 { padding-top: 0.5em; font-size:1.2rem }
	.footer_top {background-position: 10px 20px;}
	.footer_flex { display:flex; padding: 0 1rem; padding-top: 1rem; flex-flow: wrap; box-sizing: border-box; flex-direction: column; font-size: 0.8rem; }
	.footer_flex_1 {flex: 1 0 50%; margin: 0 -1.5rem; padding: 0 1.5rem}
	.footer_flex_1 { order:3; margin-top: 1rem; padding-top: 1rem; border-top:1px solid #eaeaea}
	.footer_flex_1 { background-size: 70px auto;}
	.footer_flex_2 { order:1; text-align: left;}
	.footer_flex_5 { order:3}
	#footer .footer_flex_3 p { width: 100%;}
	.footer_flex_4 { order:5}
	.footer_flex_2, .footer_flex_5 {flex: 1 0 25%; position: relative}
	.footer_flex_3,.footer_flex_4 {flex: 1 0 50%; margin-top: 2rem}
	.footer_flex_3 { order:1; text-align: left; margin-top: 1rem}
	.languages {  padding: 1rem;}
	.social_thankyou a img { width: 30px;}
	.social_thankyou a {margin-right: 5px}
	.footer_flex_2 a { padding:0.2rem 0; display: block}
	#footer .footer_flex_3 a { display: block; text-align: center; }
	.slogan_thanks p a { width:100%}
	.gallery_responsive { display:block}
	.gallery_desktop { display:none}
}

@media only screen and (max-height: 600px) {
	.text_left2 p {padding-right:0; font-size: 1.3em}
}
@media only screen and (max-width: 768px) and (min-width: 600px) {
	/*.content-bg { background-image: url("../img/622x768.jpg");}*/
}
@media only screen and (max-width: 1170px) and (min-width: 769px) {
	.content-image-360 { height: 20rem}
	.form_right h2 { font-size:2.5em;}
	/*.content-bg { background-image: url("../img/809x945.jpg");}*/
}
@media only screen and (min-width: 1200px) {
    /* Style adjustments for viewp0orts that meet the condition */
	/*.content-bg { background-image: url("../img/1445x1080.jpg");}*/
}	
@media only screen and (min-width: 1600px) {
    /* Style adjustments for viewp0orts that meet the condition */
	body { font-size:80%}
	.cta { padding-bottom:1em}
	.cta h2 { padding-bottom:0.6em}
}
@media only screen and (min-width: 2000px) {
    /* Style adjustments for viewports that meet the condition */
	/*.content-bg { background-image: url("../img/1927x1440.jpg");}*/
	body { font-size:100%}
	
	.prodir-div1, .prodir-div1-white { font-size:16px; }
	a.prodir-button, a.prodir-button-white {  background-size:46px; background-position:15px 5px; }
	a.prodir-button.prodir-icon-external {background-position: 15px 0px !important;}
	a.prodir-button.prodir-icon-download {background-position: 14px 11px !important;}
	#pen_selector_button:after { top: 3em; }

}




@media print,
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 1.25dppx),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   http://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
    *,
    *:before,
    *:after {
        background: transparent !important;
        color: #000 !important; /* Black prints faster:
                                   http://www.sanbeiji.com/archives/953 */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links that are fragment identifiers,
     * or use the `javascript:` pseudo protocol
     */

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    pre {
        white-space: pre-wrap !important;
    }
    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    /*
     * Printing Tables:
     * http://css-discuss.incutio.com/wiki/Printing_Tables
     */

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}

/* codrops */

.js .field_file {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.field_file + label {
    padding: 0.5em 2em; background-color: #000000; color: #ffffff; cursor: pointer; border:0; font-size: 1.5em; -webkit-transition: all .3s ease; transition: all .3s ease; border-radius: 5px}

.no-js .field_file + label {
    display: none;
}

.field_file:focus + label,
.field_file.has-focus + label {
    outline: 1px dotted #000;
    outline: -webkit-focus-ring-color auto 5px;
}

.field_file + label * {
    /* pointer-events: none; */
    /* in case of FastClick lib use */
}

.field_file + label svg {
    width: 1em;
    height: 1em;
    vertical-align: middle;
    fill: currentColor;
    margin-top: -0.25em;
    /* 4px */
    margin-right: 0.25em;
    /* 4px */
}

.field_file:focus + label,
.field_file.has-focus + label,
.field_file + label:hover {
    background-color:#ffffff;
	color:#ff6666;
}

.field_file + label figure {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background-color: #d3394c;
    display: block;
    padding: 20px;
    margin: 0 auto 10px;
}

.field_file:focus + label figure,
.field_file.has-focus + label figure,
.field_file + label:hover figure {
    background-color: #722040;
}

.field_file + label svg {
    width: 100%;
    height: 100%;
    fill: #f1e5e6;
}