/*
Theme Name: STUDIO 70
Theme URI: 
Author: STUDIO 70
Author URI: https://www.studio70.it/
Description: 
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: 
Text Domain: https://www.studio70.it/
*/


@import url('font/stylesheet.css');


/* 1.0	RESET ============= */
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, 
blockquote, pre,abbr, address, cite, code,del, dfn, em, img, ins, 
kbd, q, samp,small, strong, sub, sup, var,b, i,dl, dt, dd, ol, ul, 
li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, 
tr, th, td,article, aside, canvas, details, figcaption, figure,footer, 
header, hgroup, menu, nav, section, summary,time, mark, audio, video 	{ margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}
body 																	{ line-height:1; font-family: "Poppins", sans-serif; }
article,aside,details, figcaption,figure,footer, 
header,hgroup,menu,nav,section 											{ display:block;}
nav ul 																	{ list-style:none;}
blockquote, q 															{ quotes:none;}
blockquote:before, blockquote:after,q:before, q:after					{ content:''; content:none;}
a 																		{ margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; text-decoration:none; color: inherit; text-rendering: geometricPrecision;}
ins 																	{ background-color:#ff9; color:#000; text-decoration:none;}
mark 																	{ background-color:#ff9; color:#000; font-style:italic; font-weight:bold;}
del 																	{ text-decoration: line-through;}
abbr[title], dfn[title] 												{ border-bottom:1px dotted; cursor:help;}
table 																	{ border-collapse:collapse; border-spacing:0; }
hr 																		{ display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0;}
input, select				 											{ vertical-align:middle;}	
html 																	{ background-image:url(img/bg.png); background-repeat:repeat; padding:0; margin:0; }

/* 1.1 VARIABILI */
:root {
	--word: #1f2732;
	--menu: #313131;
	--white: #fff;
	--bigZ: 999999999999999999999999;
	--testo: 16px;
	--visited: #365a93;
	--link: #2a2a2a;
	--hover: #0c4195;
	--bg: #ebebeb;;
	--line: #d5d2d2;
	--blue: #405d90;
}

/* 1.2 FORMATTAZIONE POST ======= */
.aligncenter,div.aligncenter 														        { display: block; margin-left: auto; margin-right: auto; }
.alignleft 																			        { float: left; margin-right:10px;}
.alignright 																		        { float: right; margin-left:10px;}
.wp-caption 																		        { border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; margin: 10px; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
.wp-caption img 																	        { margin: 0; padding: 0; border: 0 none; }
.wp-caption p.wp-caption-text 														        { font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0;}
.size-full																			        { margin-top:19px !important;}

/* 1.3 CONTACT FORM ============= */							        
div.wpcf7-validation-errors, div.wpcf7-mail-sent-ok 								        { border: none !important;}
.formset 																					{ margin: 25px 0; background-color: var(--bg); padding: 0 15px;}
.formset h2 																		        { margin: 20px auto 20px 10px !important; display: inline-block;}
.formset fieldset 																	        { border-bottom: 1px solid var(--line); margin-bottom: 30px; padding:10px; box-sizing:border-box;}
.formset fieldset legend 															        { border-bottom: 1px dashed var(--line); width: 100%; font-size: 15px; font-weight: 600; color: var(--word); margin: 0 0 15px 0; padding: 0 0 15px 0;}
.formset fieldset .riga p 															        { float: left; width: 120px;}
.formset fieldset .riga p label														        { font-size:14px;}							
.formset fieldset .riga .insert 													        { float: left; width: calc(100% - 120px);}
.formset fieldset .riga .insert p  													        { float:none; width:auto; }
.formset fieldset .riga .insert input   											        { border: none; padding: 10px; width: 100%; box-sizing: border-box;}
.formset fieldset .riga .insert textarea 											        { border: none; padding: 10px; width: 100%; box-sizing: border-box;}
.formset fieldset .riga .insert textarea + .wpcf7-not-valid-tip 					        { top: -155px; right: 10px !important; left: auto;}
.formset fieldset:nth-of-type(2) .riga p 											        { width:100%; margin:0; }
.formset fieldset:nth-of-type(2) .riga .insert 										        { float: left; width: 100%;}
.formset fieldset:nth-of-type(3) .riga p 											        { width: 100%; color: var(--word); font-size: 13px; line-height: 20px;}
.formset fieldset:nth-of-type(3) .riga .insert 										        { width:100%; position:relative; }
.formset fieldset:nth-of-type(3) h2 												        { font-size: 14px; margin: 0 !important; font-weight: 600;}
.formset fieldset .wpcf7-form-control-wrap label input 								        { width: 15px !important; float: left; margin: 3px 10px 0 -15px;}
.formset fieldset .wpcf7-form-control-wrap label span 								        { float: right; width: calc(100% - 10px); font-size: 14px; margin: 0px 0 0 0; color: var(--visited);}
.formset .wpcf7-not-valid-tip 														        { position: absolute; font-size: 12px; top: -5px; left: 7px;} 
.formset input[type=submit] 														        { background-image: url(img/tasto-blog.png.webp); border: none; padding: 15px 25px; color: var(--white); text-transform: uppercase; letter-spacing: 1px; font-weight: 600; margin: 25px auto 0; display: block; cursor: pointer;}
.formset .wpcf7 form.invalid .wpcf7-response-output  								        { border: none; position: relative; font-size: 14px; width: 100%; margin: -55px 0 0 0; color: #ff0000;}

/* 2.0 GENERAL  */							        
.wrap																				        { position:relative; width:1600px; margin-left:auto; margin-right:auto;}
.inwrap 																			        { display:inline-block; position:relative; width:100%; padding:0; margin:0; }
.clear																				        { clear:both;}
.clear-h																			        { clear:both; height:20px;}
.clear-h2																			        { clear:both; margin-top:-10px;}
.clear-h3																			        { clear:both; margin-top:-30px;}
.dot 																				        { width: 5px; margin: 0 auto;}
.dot div 																			        { width: 5px; height: 20px; border-radius: 5px; margin: 0 0 5px 0; background-color: var(--blue);}
.goto 																				        { border: 2px solid var(--blue); background-color: var(--white); color: var(--blue); transition: all 1s; width: 250px; margin: 15px auto; text-align: center; border-radius: 40px; padding: 25px; box-sizing: border-box; text-transform: uppercase; font-weight: 600; letter-spacing: 1px; box-shadow: 0px 2px 8px 0px #00000026; cursor: pointer; display: block;}
.goto:hover 																		        { background-color: var(--blue) !important; color: var(--white);}											

/* 2.1 TIPOGRAFIA */												        
h1 																					        { color: var(--word); line-height: 1.2; font-size: 26px; word-break: break-word; font-weight: 400;}
h2																					        { color: var(--word); font-size: 20px; font-weight: 500; line-height: 35px;}
h3																					        { color: var(--word); font-size: 18px; font-weight: 400; line-height: 35px;}
.overmenu a 																		        { font-size: var(--testo); }
article h1 																			        { margin:50px 0; }												
article p 																			        { line-height:30px; margin: 0 0 15px 0;}
article ul, article ol 																        { margin:0 0 15px 15px; line-height:30px; }


/* 3.0 HEADER */												        
header																				        { width:100%; margin:0; position:relative;}	
.logo																				        { width:250px; height:100px; float:left; margin-top:10px;}
.logo img  																			        { width:100%; height:auto; }
.overmenu																			        { position:relative; height:142px; float: right; z-index: 999999; margin: -15px 0 15px;}

/* 3.1  MENU' SUPERIORE */							        
.overmenu ul li 																	        { font-size:var(--testo); color:var(--white); float:left; display:block; background-size: contain; background-repeat: no-repeat;}
.overmenu ul li a 																	        { width:115px; height:110px; text-align: center; top: 40px; letter-spacing: 1px; background-repeat: no-repeat; font-weight: 500; position: relative; display: block;}
.overmenu ul li:nth-child(1) 														        { background-image:url(img/tasto-home.png.webp);}
.overmenu ul li:nth-child(2) 														        { background-image:url(img/tasto-team.png.webp);}
.overmenu ul li:nth-child(3) 														        { background-image:url(img/tasto-servizi.png.webp);}
.overmenu ul li:nth-child(4) 														        { background-image:url(img/tasto-blog.png.webp);}
.overmenu ul li:nth-child(5) 														        { background-image:url(img/tasto-contatti.png.webp);}
/*
.overmenu ul li:last-child  																{ background-image:url(img/tasto-team.png.webp);}
*/

/* 3.2 MENU' PRINCIPALE */							        
.mainmenu 																			        { width: 100%; clear: both; border: 1px solid #e1e1e1; background: rgb(252,252,252); background: linear-gradient(180deg, rgba(252,252,252,1) 0%, rgba(237,237,237,1) 100%); height: 50px; box-sizing: border-box; border-left: none; border-right: none;}
.mainmenu ul 																		        { width: 100%;}
.mainmenu ul li  																	        { position:relative; color: var(--menu); float: left;}
.mainmenu ul li a::before 															        { content: ""; border-top: 1px solid #c8c3c3; width: 8px; height: 8px; display: block; position: absolute; top: 30px; rotate: 135deg; right: calc(66% - 5px); border-right: 1px solid #c8c3c3; box-shadow: 2px -2px 5px 0px #00000012; margin: 0 -20px 0 0;}
.mainmenu ul li a::after 															        { content: ""; border-top: 1px solid #c8c3c3; width: 35px; height: 35px; display: block; position: absolute; top: 6px; rotate: 45deg; right: 35px; border-right: 1px solid #c8c3c3; box-shadow: 2px -2px 5px 0px #00000012; margin: 0 -20px 0 0;}
.mainmenu ul li:last-child a::after  												        { border: none; width:0; height:0 }
.mainmenu ul li a 																	        { padding: 17px 60px 17px 40px; display: block; font-size: 14px; letter-spacing: 1px; z-index: var(--bigZ); position: relative;}
.mainmenu ul ul 																	        { display: none; position: absolute; background-color: var(--white); z-index: 9999999999; top: 48px; width: 320px; border: 1px solid #e1e1e1; line-height: 0px; padding: 10px 0;}
.mainmenu ul ul li 																	        { overflow:visible; float: none;}
.mainmenu ul ul li a::after, .mainmenu ul ul li a::before							        { content: ""; border-top: none; width: 0px; height: 0px; display: none; position: absolute; top: auto; rotate: 0deg; right:auto; border-right: none; box-shadow: none; margin: 0;}
.mainmenu ul li:hover > ul 															        { display:block; }

/* 4.0 SLIDE */							        
.container_slide  																	        { width:100%; display:inline-block; position: relative;}
.slide 																				        { width:100%; position: relative; height: 440px; border-bottom: 1px solid #cbcbcb; box-shadow: 0px 2px 3px 0px #00000026; background: var(--white);}
.slide ul  																			        { width:100%; position:relative; z-index: 0}
.slide ul li 																		        { width:100%; position:absolute; height: 440px; display: none;}
.slide ul li img 																	        { width:960px; height: auto; position: absolute; bottom: 0px; right: 0; z-index: 9999;}
.slide ul li:nth-child(1) 															        { display:block; }
.slide ul li:nth-child(2) img 														        { width: 900px;}
.slide ul li nav 																	        { line-height: 45px; background-color: var(--white); width: 300px; padding: 85px 25px 25px 25px; border: 2px solid #e1e1e1; position: absolute; top: 30px; left: 35px; z-index: 9999999999;}
.slide ul li nav p 																	        { background-repeat: no-repeat; background-size: 30px; background-position: 0px 8px; padding: 0 0 0 50px;}
.slide ul li nav div h2 															        { font-size: 20px; color: #ff0000; font-weight: 600;}
.slide ul li nav div 																        { position: absolute; top: 0; left: 0; width: 100%; background-color: #f6f6f6; border-bottom: 1px solid #e1e1e1; box-sizing: border-box; padding: 10px 10px 10px 15px; line-height: 25px;}
.controller 																		        { background-color: var(--white); width: 80px; height: 80px; position: absolute; border-radius: 50%; border: 1px solid #e0e0e0; box-shadow: 0px 0px 3px 0px #00000057; bottom: calc(0px - 40px); left: calc(50% - 40px); z-index: 9999;}
.controller div 																	        { width:30%; margin-top: 28px;}
.controller div img  																        { width:100%; height:auto; cursor:pointer; }
.controller div:nth-child(1) 														        { rotate:90deg; float:left; margin-left:5% }
.controller div:nth-child(2) 														        { rotate:-90deg; float:right; margin-right:5% }
.slide img.bg 																		        { width: 100%; height: 440px; position: absolute; object-fit: cover; rotate: 180deg; object-position: top;}

/* 5.0 HOMEPAGE */      
.bodyHome .dot 																		        { margin:15px auto 0; }
.bodyHome .dot:first-of-type														        { margin:50px auto 0; }
.bodyHome 																			        { font-weight: 500; font-style: normal; }
.bodyHome h1  																		        { margin: 30px auto 15px auto; width: 50%; text-align: center;}
.bodyHome h2 																		        { width: 50%; margin: 0 auto; text-align: center;}
.bodyHome strong 																	        { color:var(--word); }
.bodyHome p                                                                                 { width: 70%; margin: 0 auto; text-align: center; color: #6b6868; font-weight: 500; font-size: 16px;}

/* 5.1 AREE */      
.aree  																				        { margin-top:50px; }
.aree article 																		        { width:calc(100% / 3); float:left; margin-bottom:50px; }
.aree article figure																        { width:150px; display:block; margin:0 auto 15px; }
.aree article figure img 															        { width:100%; height:auto; }
.aree article h1 																	        { width: 50%; margin: 0 auto 15px; text-align: center; font-size:24px; color: var(--word); }
.aree article h2 																	        { width: 70%; margin: 0 auto !important; text-align: center; color: #6b6868; font-weight: 500; font-size: 16px;}


/* 5.2 FRAMEWORK */     
.framework 																			        { background-color: var(--word); transform: skewY(3deg); width: 100%; overflow: hidden; background-image: url(img/texture.webp); position: relative;}
.framework .backangle  																        { transform: skewY(-3deg); }
.framework .dot div  																        { background-color:var(--white); }
.framework article  																        { width:100%; height:auto; display:inline-block; margin-bottom:0px; }
.framework article:nth-of-type(1) 													        { margin-top:50px; }
.framework article div 																        { width:40%; float:left; text-align: left; line-height: 240px; position: relative;}
.framework article div:nth-child(2)													        { width:16%; margin:0 2%; }
.framework article div figure  														        { width:100%; margin:0 auto; } 
.framework article div figure img 													        { width: calc(100% - 20px); height: auto; border-radius: 50%; border: 10px solid rgba(255, 255, 255, 0.1);}
.framework article:nth-of-type(even) > div 											        { float:right; }
.framework article div p 															        { font-size: var(--testo); font-weight: 300; letter-spacing: 1px; line-height: 1.5; display: inline-block; vertical-align: middle; color: rgba(255, 255, 255, 0.7); width: 75%;}
.framework article:nth-of-type(even) > div p 										        { text-align: right; float: right; margin: 85px 0 0 0;}
.framework article div h1 															        { text-align: right; color: var(--white); font-size: 48px; line-height: 1.5; display: inline-block; vertical-align: middle; width: 100%; z-index: 6; position: relative; font-weight: 400;}
.framework article:nth-of-type(even) > div h1  										        { text-align:left; }
.framework article div h1::before 													        { top: -110px; width: 100%; font-size: 200px; position: absolute; font-weight: 600; text-align: left; z-index: -1; }
.framework article:nth-of-type(1) > div h1::before 									        { content: "01"; left: 120px; color: #f88730; }
.framework article:nth-of-type(2) > div h1::before 									        { content: "02"; left: 130px; color: #3b5c91; letter-spacing: -15px;}
.framework article:nth-of-type(3) > div h1::before 									        { content: "03"; left: 120px; color: #b34cae; letter-spacing: -20px;}
.framework article:nth-of-type(4) > div h1::before 									        { content: "04"; left: 155px; color: #71a144; letter-spacing: -10px;}
.forFramework .goto 																        { position: absolute; background-color: var(--white); left: calc((100% / 2) - (250px / 2)); bottom: -50px;}

/* 6.0 TECNOLOGIE */        
.tecnologie 																		        { width: 100%; position: relative; margin: 50px 0; border: 1px solid #1f273263; padding: 15px; border-radius: 10px; background-color: #ffffff7d; box-sizing: border-box;}
.tecnologie h3 																		        { margin: 25px 0 50px; font-size: 22px; color: var(--word);}
.tecnologie ul li 																	        { list-style:none; float:left; width:calc(100% / 6); }
.tecnologie ul li figure  															        { width:100%; height:160px; }
.tecnologie ul li figure img 														        { width:90%; height:150px; object-fit:contain; display: block; margin: 0 auto;}
.tecnologie ul li:nth-child(11) figure img 											        { width:50%; }
.tecnologie .diritti 																        { margin:25px 0; color:var(--testo); font-size:14px; line-height:25px; }

/* 7.0 PAGINE */
.page .wrap  																				{ width:1200px; }
.page div.title																				{ width:100%; overflow:hidden; height: 180px; position: relative;}
.page div.title:before 																		{ content: ''; background-image: url(img/breadcrumbs.jpg); width: 50%; height: 250px; position: absolute; bottom: 30px; left: 0; transform: skewY(3deg); z-index: 4;}
.page div.title:after 																		{ content: ''; background-image: url(img/breadcrumbs.jpg); width: 50%; height: 250px; position: absolute; bottom: 30px; right: 0; transform: skewY(-3deg); z-index: 4;}
.page div.title h1  																		{ position: relative; z-index: 99; text-align: center; width: 100%; margin: 40px 0 0 0;}
.page div.title #breadcrumbs																{ position: relative; z-index: 99; text-align: center; width: 100%; font-size:14px; }
.page div.title span.date 																	{ z-index: 99; position: relative; font-size: 12px; text-align: center; width: 100%; display: block;}
.page span.tags 																			{ position: relative; font-size: 12px; text-align: left; line-height: 35px;}
.page article .left 																		{ width:65%; float:left; margin: 50px 0 0 0;}
.portal article .left 																		{ margin: 0px 0 0 0;}
.page article .left .content 																{ background-color: #f3f3f3; padding: 20px; margin: -30px 0 0 0;}
.portal article .left .content 																{ background-color: transparent; margin: 0;}
.portal article .left .content form 														{ background-color: #fff; border: 1px solid var(--stroke-soft-200,#e1e4ea); border-radius: 16px; box-shadow: none; padding: 15px;}
.portal article .left .content form input, .portal article .left .content form select		{ padding: 10px; box-sizing: border-box;}
.page article .left figure  																{ margin: 0 0 25px 0; } 																							
.page aside 																				{ width:30%; float:right; margin: 50px 0 0 0; }
.portal aside 																				{ margin: 20px 0 0 0;}
.page aside .widget 																		{ background-color: var(--bg); padding: 25px; box-sizing: border-box; margin: 0 0 25px; border-bottom: 5px solid #365a93;}
.portal aside .widget 																		{ background-color: #fff; border: 1px solid var(--stroke-soft-200,#e1e4ea); border-radius: 16px; box-shadow: none;}
.page aside ul 																				{ line-height: 35px; margin: 0; list-style: none;}
.page aside ul li 																			{ border-bottom: 1px solid #afafaf; margin-bottom: 10px; padding-bottom: 10px;}
.page aside ul li:last-child 																{ border-bottom: none; margin-bottom: 0; padding-bottom: 0;}
.page aside h1  																			{ margin: 0 0 25px 0; }
.page article h2, .page article h3															{ margin: 0 0 25px 0; }
.page .content a 																			{ color: var(--link); text-decoration: underline; cursor: pointer; transition: color 0.3s; font-weight: 600;}
.page .content a:hover 																		{ color: var(--hover); text-decoration: none;}
.page .content a:visited 																	{ color: var(--visited); }
.page .content a:focus 																		{ outline: 2px solid #000; outline-offset: 2px;}
.page .content a:active 																	{ color: #dd4b39;}
.page aside .partner 																		{ list-style: none; margin: 0 0 10px -15px;}
.page aside .partner img 																	{ width: 160px; margin: 10px auto; align-items: center; height: auto; display: block;}
.page aside .partner span  																	{ display: none;}
.wppb-user-forms, .wppb-user-forms * 														{ box-sizing: border-box !important; position: relative !important; left: auto !important; text-indent: 1px !important; font-size: 14px;}
.cp-logout 																					{ display: none;}

/* 7.1 SOCIAL */
div.heateor_sss_sharing_ul a 																{ margin: 0 0 20px 0 !important; width: 25%;}
.heateor_sss_facebook span  																{ background-color: #365a93 !important; width: 100% !important; height: 100px !important;}
.heateor_sss_button_x span, .heateor_sss_button_instagram span, 
.heateor_sss_button_linkedin span  															{ width: 100% !important; height: 100px !important; }
													
/* 7.2 CONTATTI */
.modi 																						{ width:calc(100% / 3); float:left; position: relative; margin: 50px 0 0 0;}
.modi figure 																				{ width:30%; margin:0 auto 25px; position:relative; display:block; }
.modi figure img 																			{ width:100%; height:auto; }
.modi h3  																					{ text-align:center; color: var(--word); margin-top: 1.2em; margin-bottom: 0.7em; font-weight: 500; line-height: 1; font-size: 24px;}
.modi p 																					{ color:var(--word); text-align: center; margin: 0;}
.livesupport 																				{ background-image: url(img/bg_3.jpg), url(img/bgsupport.jpg); background-size: contain; background-repeat: no-repeat, repeat; background-position: right, center; height: 460px; margin: 50px 0; position: relative;}
.livesupport .livemessage 																	{ width: 500px; position: absolute; top: calc(50% - (355px / 2)); left: 200px;}
.livesupport .livemessage h3  																{ font-weight:500; color:var(--word); font-size:48px; }
.livesupport .livemessage p 																{ color:var(--word); }
.livesupport .livemessage .goto  															{ float:left; }
.contatti .formset 																			{ background-color:transparent; margin: 0 auto;}
.contatti .formset fieldset div  															{ float:left; width:48%; }
.contatti .formset fieldset div.full														{ width:100%; }
.contatti .formset fieldset div:nth-of-type(even)											{ float:right; }
.contatti .formset fieldset div input 														{ width: 100%; padding: 15px; border: none; background-color: #f4f4f5; text-align: left; text-transform: uppercase; box-sizing: border-box;}
.contatti .formset fieldset div input:focus 												{ border: none; box-shadow: 0px 0px 5px 0px #00000050; outline: none; border-radius: 0;}
.contatti .formset fieldset legend 															{ border-bottom: none; padding: 0px 0 0 0;}
.contatti .formset fieldset 																{ border-bottom: none; padding: 0 10px;}
.contatti .formset fieldset select 															{ width: 100%; padding: 15px; border: none; background-color: #f4f4f5; text-align: left; text-transform: uppercase; box-sizing: border-box; }
.contatti .formset fieldset select:focus 													{ border: none; box-shadow: 0px 0px 5px 0px #00000050; outline: none; border-radius: 0;}
.contatti .formset fieldset textarea 														{ width: 100%; padding: 15px; border: none; background-color: #f4f4f5; text-align: left; text-transform: uppercase; box-sizing: border-box; }
.contatti .formset fieldset .wpcf7-form-control-wrap label span 							{ margin: -5px 0 0 0;}
.contatti .formset input[type=submit] 														{ background-image: none; border: 2px solid var(--blue); color: var(--blue); width: auto;}
.contatti .formset input[type=submit]:hover													{ color: var(--white);}
.contatti .formset .wpcf7-not-valid-tip 													{ right: 25px; left: auto;}
.contatti .formset fieldset div.full .wpcf7-not-valid-tip 									{ top: -160px;}

/* 8.0 FOOTER */
footer 																						{ height:300px; position:relative; width:100%; display:inline-block; margin: 50px 0 -5px 0; padding:0; overflow: hidden;}
footer:before 																				{ left: 0; transform: skewY(3deg); }
footer:after 																				{ right: 0; transform: skewY(-3deg); }
footer:before, footer:after 																{ content: ''; background: #1f2732 url(img/texture.webp); width: 50%; height: 300px; position: absolute; bottom: -25px; z-index: 4;}
footer .logo 																				{ position: relative; z-index: 99; width: 200px; height: auto; margin: 100px auto 25px; display: block; float: none;}
footer .round 																				{ background: #1f2732 url(img/texture.webp); width: 100px; height: 100px; border-radius: 50%; position: absolute; top: 15px; left: calc(50% - 50px);}
footer .social 																				{ z-index: 999; position: relative; width: fit-content; margin: -20px auto 0;}
footer .social a																			{ width:30px; display:block; float:left; margin:0 5px; }
footer .social a img	 																	{ width:100%; height:auto; }
footer .credit 																				{ z-index: 999; position: relative; display: inline-block; clear: both; margin: 20px 0; width: 100%; padding: 10px 25px; box-sizing: border-box; font-size: 12px; letter-spacing: 1px; color: var(--bg); line-height: 20px;}
footer .credit p																			{ float:left; width:45% }
footer .credit p:last-child																	{ float:right; text-align:right; }


@media only screen and (max-width: 1919px) and (min-width: 1366px){

	.wrap																					{ width:1200px; }
	.slide 																					{ height: 435px;}
	.slide ul li 																			{ height: 435px;}
	.slide ul li img 																		{ width: 800px; right: 0; bottom: 0px; z-index: 9999;}
	.slide ul li:nth-child(2) img 															{ width: 845px;}
	.slide img.bg 																			{ height: 435px;}
	.framework article:nth-of-type(1) > div h1::before,
	.framework article:nth-of-type(3) > div h1::before 										{ left: 90px;}

}


@media only screen and (max-width: 1365px) and (min-width: 1024px){

	.wrap																					{ width:1000px; }
	.page .wrap 																			{ width: 1000px;}
	.page article .left 																	{ width: 100%;}
	.page aside 																			{ width: 100%;}
	.page aside .widget 																	{ width: 45%; float: left;}
	.page aside .forminfo 																	{ width: 45%; float: right;}
	.formset 																				{ margin: 0;}
	.slide ul li   																			{ overflow:hidden; }
	.slide ul li img 																		{ width: 750px; right: 0; bottom: 0; z-index: 9999;}
	.mainmenu ul li a 																		{ padding: 17px 50px 17px 30px;}
	.aree article 																			{ width: calc(100% / 2);}
	.framework article div 																	{ margin: -46px 0 0 0;}
	.framework article:nth-of-type(1) > div h1::before,
	.framework article:nth-of-type(3) > div h1::before 										{ left: 40px;}
	.livesupport 																			{ height: 575px;}

}

@media only screen and (max-width: 1023px) and (min-width: 768px){
	
	.wrap																					{ width:700px; }
	.mainmenu ul li a::before 																{ display: none; }
	.mainmenu ul li a::after 																{ display: none; }
	.page .wrap 																			{ width: 700px;}
	.page article .left 																	{ width: 100%;}
	.page aside 																			{ width: 100%;}
	.page aside .widget 																	{ width: 45%; float: left;}
	.page aside .forminfo 																	{ width: 45%; float: right;}
	.formset 																				{ margin: 0;}
	.slide 																					{ height: 420px;}
	.slide ul li   																			{ overflow:hidden; height: 420px;}
	.slide ul li img 																		{ width: 700px; right: -70px;}
	.mainmenu ul li a 																		{ padding: 17px 20px 17px 15px;}
	.mainmenu ul li a::after																{ border-top: 0px solid #c8c3c3; rotate: 0deg; margin: 0 -30px 0 0;}
	.slide img.bg 																			{ height: 420px;}
	.overmenu ul li a 																		{ width: 90px; height: 90px; top: 32px;}
	.bodyHome h2 																			{ width: 80%;}
	.aree article 																			{ width: 100%;}
	.framework article:nth-of-type(even) > div 												{ float:left; }
	.framework article:nth-of-type(even) > div p 											{ display: block; width: 50%; text-align: center; margin: 35px auto 80px; float: none;}
	.framework article div 																	{ width: 100%;}
	.framework article div h1 																{ text-align: center;}
	.framework article:nth-of-type(even) > div h1 											{ text-align: center;}
	.framework article:nth-of-type(1) > div h1::before,
	.framework article:nth-of-type(2) > div h1::before,
	.framework article:nth-of-type(3) > div h1::before,
	.framework article:nth-of-type(4) > div h1::before 										{ text-align: center; font-size: 100px; width: 100%; left: 0; letter-spacing: -5px;}
	.framework article div:nth-child(2) 													{ width: 50%; margin: 0 auto; float: none; line-height: 0;}
	.framework article div figure img 														{ margin: -70px 0 0 0;}
	.framework article div p 																{ display: block; width: 50%; text-align: center; margin: 35px auto 80px;}
	.modi 																					{ width: 100%;}
	.livesupport 																			{ height: 455px;}
	.livesupport .livemessage 																{ width: 365px; top: 25px; left: 100px;}
	footer 																					{ height: 320px;}
	footer .credit p																		{ width:100%; text-align:center; }
	footer .credit p:last-child																{ text-align:center; }
}

@media only screen and (max-width: 767px){

	.wrap																					{ width:90%; }
	.page .wrap 																			{ width: 90%;}
	.page article .left 																	{ width: 100%;}
	.page aside 																			{ width: 100%;}
	.page aside .widget 																	{ width: 100%; float: left;}
	.page aside .forminfo 																	{ width: 100%; float: right;}
	.formset 																				{ margin: 0;}
	header 																					{ width: 100%; margin: 0; position: fixed; top: 0; z-index: 99999999999999;}
	.overmenu 																				{ position: absolute; height: auto; float: none; z-index: 999999; margin: 0; top: 1px; right: 0px; line-height: 25px; background-color: var(--white); padding: 15px; border-radius: 10px; box-shadow: 0px 0px 2px 2px #0000000d; display: none;}
	.overmenu ul li 																		{ background-image: none !important; color: #000; float: none;}
	.overmenu ul li a 																		{ width: auto; height: auto; top: 0; text-align: right;}
	.mainmenu 																				{ position: fixed; top: 0;}
	.mainmenu .menu-menu-container 															{ display:none; }
	.mainmenu ul 																			{ display: block;}
	.mainmenu ul li a 																		{ padding: 10px 0; display: block; font-size: 14px; letter-spacing: 1px; z-index: 99; position: relative;}
	.mainmenu ul li a::after 																{ display: none;}
	.slide 																					{ height: 420px;}
	.slide ul li   																			{ overflow:hidden; height: 420px;}
	.slide ul li img 																		{ display: none;}
	.slide img.bg 																			{ height: 420px;}
	.slide ul li nav 																		{ top: 18px; left: calc(50% - 307px / 2); z-index: 999; width: 80%;}
  	.logo 																					{ width: 100px; height: 0px; float: none; margin-top: 0px; position: relative; margin-left: calc(50% - 50px); z-index: 99;    }
  	.logo img 																				{ margin: 5px 0 0 0;}
  	.container_slide 																		{ margin: 0 0 0 0;}
	.bodyHome h2 																			{ width: 80%;}
	.aree article 																			{ width: 100%;}
	.framework article:nth-of-type(even) > div 												{ float:left; }
	.framework article:nth-of-type(even) > div p 											{ display: block; width: 50%; text-align: center; margin: 35px auto 80px; float: none;}
	.framework article div 																	{ width: 100%;}
	.framework article div h1 																{ text-align: center;}
	.framework article:nth-of-type(even) > div h1 											{ text-align: center;}
	.framework article:nth-of-type(1) > div h1::before,
	.framework article:nth-of-type(2) > div h1::before,
	.framework article:nth-of-type(3) > div h1::before,
	.framework article:nth-of-type(4) > div h1::before 										{ text-align: center; font-size: 100px; width: 100%; left: 0; letter-spacing: -5px;}
	.framework article div:nth-child(2) 													{ width: 80%; margin: 0 auto; float: none; line-height: 0;}
	.framework article div figure img 														{ margin: -70px 0 0 0;}
	.framework article div p 																{ display: block; width: 50%; text-align: center; margin: 35px auto 80px;}
	.tecnologie ul li 																		{ width: calc(100% / 2);}
	.modi 																					{ width: 100%;}
	.livesupport 																			{ height: auto; display: inline-block;}
	.livesupport .livemessage 																{ width: 90%; top: auto; left: auto; position: relative; margin: 25px auto;}
	.contatti .formset fieldset div 														{ width: 100%;}
	footer 																					{ height: 320px;}
	footer .credit p																		{ width:100%; text-align:center; }
	footer .credit p:last-child																{ text-align:center; }

	.livesupport {
    background-image: none, url(img/bgsupport.jpg);
    background-size: contain;
    background-repeat: no-repeat, repeat;
    background-position: right, center;
    height: 460px;
    margin: 50px 0;
    position: relative;
}

}
	
	

	
/* ========================================
   MOBILE MENU - Hamburger (breakpoint 1023px)
   Aggiungi questo codice alla fine del tuo style.css
   ======================================== */

/* Hamburger Button */
.hamburger 													                                { display: none; position: fixed; top: 15px; right: 20px; width: 35px; height: 30px; cursor: pointer; z-index: 9999999999;}
.hamburger span 											                                { display: block; position: absolute; height: 3px; width: 100%; background: var(--menu); border-radius: 3px; transition: all 0.3s ease;}
.hamburger span:nth-child(1) 								                                { top: 0; }
.hamburger span:nth-child(2) 								                                { top: 12px; }
.hamburger span:nth-child(3) 								                                { top: 24px; }

/* Hamburger animazione X */                                
.hamburger.active span:nth-child(1) 						                                { top: 12px; transform: rotate(45deg);}
.hamburger.active span:nth-child(2) 						                                { opacity: 0;}
.hamburger.active span:nth-child(3) 						                                { top: 12px; transform: rotate(-45deg);}

/* Overlay scuro */                             
.mobile-overlay 											                                { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 999999;}

/* Wrapper - su desktop non interferisce */                             
.mobile-menu-wrapper 										                                { display: contents;}

/* Toggle nascosto su desktop */                                
.submenu-toggle 											                                { display: none;}

/* ========================================                             
   MEDIA QUERY - Mobile Menu (max 1023px)                               
   ======================================== */                              
@media only screen and (max-width: 1023px) {                                

    /* Mostra hamburger */                              
    .hamburger 												                                { display: block;    }

    /* Header fisso */                              
    header 													                                { position: fixed; top: 0; left: 0; width: 100%; background: var(--white); z-index: 9999999; box-shadow: 0 2px 10px rgba(0,0,0,0.1); height: 70px; }

    /* Wrapper unico per entrambi i menu */                             
    .mobile-menu-wrapper 									                                { display: block; position: fixed; top: 0; right: -320px; width: 300px; height: 100vh; background: var(--white); z-index: 99999999; transition: right 0.3s ease; overflow-y: auto; box-shadow: -5px 0 15px rgba(0,0,0,0.1); padding: 70px 20px 20px; box-sizing: border-box; }

    /* Menu aperto */                               
    body.menu-open .mobile-menu-wrapper 					                                { right: 0; }
    body.menu-open .mobile-overlay 							                                { display: block;}

    /* Reset menu dentro il wrapper */                              
    .mobile-menu-wrapper .overmenu, .mobile-menu-wrapper .mainmenu 	                        { position: relative !important; width: 100% !important; height: auto !important; float: none !important; margin: 0 !important; padding: 0 !important; background: transparent !important; box-shadow: none !important; display: block !important;}
    .mobile-menu-wrapper .overmenu ul,                              
    .mobile-menu-wrapper .mainmenu ul,                              
    .mobile-menu-wrapper .mainmenu .menu-menu-container 	                                { display: block !important; position: relative !important; width: 100% !important; float: none !important; }
    
    /* Reset sottomenu - IMPORTANTE: sovrascrive stili desktop */
    .mobile-menu-wrapper .mainmenu ul ul, .mobile-menu-wrapper .mainmenu .sub-menu          { position: relative !important; top: auto !important; left: auto !important; right: auto !important; float: none !important; width: 100% !important; box-shadow: none !important; opacity: 1 !important; visibility: visible !important; transform: none !important; padding: 0; border-bottom: none; border-top: none;}
    .mobile-menu-wrapper .overmenu ul li, .mobile-menu-wrapper .mainmenu ul li 				{ float: none !important; display: block !important; background-image: none !important; position: relative !important; clear: both; }
    
    /* Menu item con figli - assicura che il sottomenu sia dentro */
    .mobile-menu-wrapper .menu-item-has-children 			                                { overflow: visible;}
    .mobile-menu-wrapper .overmenu > div > ul > li > a,                             
    .mobile-menu-wrapper .mainmenu > div > ul > li > a 		                                { display: block !important; width: 100% !important; height: auto !important; padding: 12px 50px 12px 0 !important; text-align: left !important; position: relative !important; top: 0 !important; border-bottom: 1px solid var(--line); font-size: 15px; background: none !important; box-sizing: border-box; color: var(--menu); }
    .mobile-menu-wrapper .mainmenu ul li a::before,                             
    .mobile-menu-wrapper .mainmenu ul li a::after 			                                { display: none !important;    }
    
    /* ========================================
       SOTTOMENU MOBILE
       ======================================== */
    
    /* NASCONDE TUTTI I SOTTOMENU */
    .mobile-menu-wrapper ul.sub-menu                                                        { display: none; padding-left: 15px; background: #f5f5f5; margin: 0; border-left: 3px solid var(--blue); position: relative; width: 100%; box-sizing: border-box; overflow: hidden; max-height: 0; transition: max-height 0.3s ease; }
    
    /* MOSTRA SOTTOMENU QUANDO APERTO */
    .mobile-menu-wrapper .menu-item-has-children.submenu-open > ul.sub-menu                 { display: block; max-height: 500px; }
    
    /* Stile voci sottomenu */
    .mobile-menu-wrapper ul.sub-menu li                                                     { border-bottom: 1px solid var(--line); position: relative; display: block; float: none;}
    .mobile-menu-wrapper ul.sub-menu li:last-child                                          { border-bottom: none; }
    .mobile-menu-wrapper ul.sub-menu li a                                                   { font-size: 14px !important; padding: 18px 10px !important; color: var(--visited) !important; width: 100% !important; border-bottom: none !important; display: block !important; position: relative !important;}
    
    /* ========================================
       FRECCIA TOGGLE SOTTOMENU
       ======================================== */
    
    .mobile-menu-wrapper .submenu-toggle                                                    { display: block; position: absolute; right: 0; top: 0; width: 39px; height: 39px; cursor: pointer; z-index: 100; background: #f9f9f9;}
    .mobile-menu-wrapper .submenu-toggle::before,
    .mobile-menu-wrapper .submenu-toggle::after                                             { content: ''; position: absolute; background: var(--menu); transition: all 0.3s ease; }
    
    /* Linea orizzontale */
    .mobile-menu-wrapper .submenu-toggle::before                                            { width: 14px; height: 2px; top: 50%; left: 50%; transform: translate(-50%, -50%); }
    
    /* Linea verticale */
    .mobile-menu-wrapper .submenu-toggle::after                                             { width: 2px; height: 14px; top: 50%; left: 50%; transform: translate(-50%, -50%); }
    
    /* Trasforma + in - quando aperto */
    .mobile-menu-wrapper .menu-item-has-children.submenu-open > .submenu-toggle::after      { height: 0; }
    .mobile-menu-wrapper .menu-item-has-children.submenu-open > .submenu-toggle             { background: var(--blue); }
    .mobile-menu-wrapper .menu-item-has-children.submenu-open > .submenu-toggle::before,
    .mobile-menu-wrapper .menu-item-has-children.submenu-open > .submenu-toggle::after      { background: var(--white);
    }
    
    /* ========================================
       LOGO E BODY
       ======================================== */
    
    /* Logo */
    .logo                                                                                   { width: 150px; height: auto; float: none; margin: 5px auto 0; position: relative; z-index: 99; }
    .logo img                                                                               { width: 100%; height: auto;}
    
    /* Spazio per header fisso */
    body                                                                                    { padding-top: 70px; }
    
    /* Blocca scroll quando menu aperto */
    body.menu-open                                                                          { overflow: hidden; }
}