@charset "UTF-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@500;600;700&display=swap');

html, 
html * {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	font-family: 'Quicksand', Arial, sans-serif;
	letter-spacing: 0.1px;
}
html {
	height: 100%;
	 min-height: 100% !important;
}
b, strong {
    font-weight: 600!important;
}
.clearfloat {
   visibility: hidden; 
   display: block; 
   height: 0; 
   clear: both;
}
span, footer, h2, h3, h4 {font-weight:600;}
main a {color: #2D2D35!important;}

a:hover, a:active, a:link, a:visited, a:active {text-decoration: none!important; color: #2D2D35;}
.menu-top a:hover, .menu-top a:active, .menu-top a:link,.menu-top a:visited,.menu-top a:active{
	text-decoration: none!important; color:#FFFFFF;}

header {
	padding: 10px;
}



img {
	height: auto;
	vertical-align: middle;
	max-width: 100%;
}


body {
	margin-left: auto;
	margin-right: auto;
}

.style-logo {
	margin-left: auto;
	margin-right: auto;
	display: block;
	width: 100px;
}

.style-nav ul {
	list-style-type: none;
}

.style-nav ul li a {
	text-decoration: none;
	color: #2F322A;
	text-align: center;
	display: block;
	text-transform: uppercase;
	padding: 8px;
}


h1 {
	font-size: 2.3em;
	text-transform: uppercase;
	font-weight: 200;
}

h2 {
	font-size: 2em;
	text-transform: uppercase;
	margin-bottom: 15px;
}

h3 {
	font-size: 2em;
	text-transform: uppercase;
	font-weight: 200;
	
}

h4 {
	font-size:1.5em;
	margin: 5px 0px;
	text-transform: uppercase;
}

p {
	font-size: 1.1em;
}

p strong { font-weight:600;}

.col.col-md-one-half.col-lg-one-fourth{
	padding: 30px 10px;
}

.button {
	border: 1px #2D2D35 solid;
    padding: 5px 30px;
	margin: 0 auto;
    color: #2D2D35;
    width: max-content!important;
	width: -moz-max-content;
    width: -webkit-max-content;
    width: -o-max-content;
    width: -ms-max-content;
	text-decoration: none;
	font-weight: 600;
}


.info-box-tan {
	background-color: #b9a88e;
	color: #FFFFFF;
	padding: 30px 20px 60px;
	text-align: center;
}

.info-box-dark {
	background-color: #2D2D35;
	color: #FFFFFF;
	padding: 30px 20px 60px;
	text-align: center;
}

.footer-text {
	font-size: 13px;
	margin-bottom: 20px;
	text-align: center;
}

.col {
	width: 100%;
}

.row:before, .row:after {
	content: "";
	display: table;
}

.row:after {
	clear: both;
}

.hero {
    background-image: url("../images/img_home.jpg");
}
.hero1 {
    background-image: url("../images/img_chi_siamo.jpg");
}
.hero2 {
    background-image: url("../images/img_servizi.jpg");
}
.hero3 {
    background-image: url("../images/img_preventivo.jpg");
}
.hero4 {
    background-image: url("../images/img_contatti.jpg");
}

.hero, .hero1, .hero2, .hero3, .hero4 {
    background-size: 100% auto;
	background-repeat: no-repeat;
    color: #FFFFFF;
    text-align: center;
	display: block;
}
header > div.menu-top {
	width: 100%;
	display: block!important;
	background: #334e9d!important;
	color: #FFFFFF!important;
    padding: 6px 20px;
    text-align: center;
}

.menu-top-left img, .menu-top-center img, .menu-top-right img{ 
	margin: 5px;
 }
.menu-top-left, .menu-top-center , .menu-top-right { 
	font-size: 0.9em;
    display: inline-block;
    line-height: 25px;
    box-sizing: border-box;
 }
.cell_fixed {
  position: fixed;
  bottom: 20px;
  right: 20px;
	z-index: 10000000000;	
}
.title_1, .title_2{
	width:100%!important;	
	margin: 0 auto;
	text-align: center;
	color: #FFFFFF!important;
	display: block;
}
.title_2{
	background: #334e9d!important;	
	font-size: 1.2em;
	padding:10px 5px!important;	
}
.title_1{
	background: #82c7b1!important;	
	margin-bottom: 5px!important;
	padding: 5px 20px!important;	
}
.d_table_box{
	width:100%;
	display: block;
}
.d_table_cell{
	width: max-content;
	width: -moz-max-content;
    width: -webkit-max-content;
    width: -o-max-content;
    width: -ms-max-content;
    margin: 0 auto;
}
.box_full_col{	
	padding:15px;	
}
.full_col_text{	
	margin-top: 150px;
	display: block;
	padding:15px;	
}
.green{background: #82c7b1; color: #2D2D35;	}
.grey{background:#eeeeee; color: #2D2D35;	}
.blue{background: #334e9d!important; color: white;}
.credit_sx{text-align:left; width: 80%; display: inline-block; float: left;}
.credit_dx{text-align:right; width: 15%; display: inline-block; float:right;}
.footer {
    display: block;
    padding: 10px;
	font-size: 14px!important;
	line-height: 18px;
}
footer {
    padding: 0px!important;   
    margin: 10px 5px 10px 5px;
	display: block;
    clear: both;

}
.footer a{
    color: #2D2D35;
	text-decoration: none;
}

.box_full_col.blue{
    padding: 0px;
}
.box_full_col span, .box_full_col section, .box_full_col a.cliccaescopri.cliccaescopri {
	color: #2D2D35;
	width: 100%;
	display: block;
	text-align: center;
}

.box_full_col span {
	text-align: left;
	font-size: 14px;
   
	text-transform: uppercase;
}
.box_full_col section h3 {
	text-transform: initial;
	text-align: center;
	margin: 1% auto;

}
.box_full_col a.cliccaescopri.cliccaescopri {
	text-align: right;
	font-size: 14px;
	clear: both;
}
.box_full_col.grey {
	text-align: center;
	margin: 0 auto;
	
}
.box_full_col.grey > .col-lg-one-fourth > p {
	width: 80%;
	margin: 0 auto;
	padding-bottom: 0px;
	
}
#step_1 h4, #step_2 h4, #step_3 h4, #step_4 h4{
	line-height: 60px;	
}
.box_full_col.preventivo section h3, .box_full_col.servizi section h3 {	
    width: 60%;
    padding: 15px;
	color: #FFFFFF;
	text-transform: uppercase;
}
.box_full_col.preventivo h3 {
	background: #334e9d!important;
	
}
.box_full_col.servizi h3 {
	background: #334e9d!important;
}

.preventivo{
	background-image: url(../images/patten_logo.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    color: #FFFFFF;
    text-align: center;
    display: block;
    padding: 80px 0!important;
}
.servizi{
	background-image: url("../images/servizi.jpg");
    background-size: cover;
	background-repeat: no-repeat;
    color: #FFFFFF;
    text-align: center;
	display: block;	
	padding: 30px 0!important;
}
.text_center{ text-align: center;}
.text_left{ text-align: left;}
.text_right{ text-align: right;}
.footer p {width: 60%;} 

.col_70 {
	display: block;
	width: 70%;
	margin: 20px auto;
}
.box_80{
	display: block;
	width: 100%;
	margin: 0 auto;
}

.button.clik{
	max-width: 35%;
	text-align: center;
}	

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS styles go here */
	.title_1, .title_2{
	width:80%!important;
}
}
@media (min-width: 1024px){

.menu-top-left{
	width: 40%;
	text-align:left;
}
.menu-top-center { 
	text-align: center;
    width: 19%;
    margin: 0 auto;
}
.menu-top-right { 
	text-align: right;
    width: 40%;
    float: right;
}
}

@media (max-width: 1023px){

.menu-top-center { 
	text-align: left;
    width: 58%;
    margin: 0 auto;
}
.menu-top-right { 
	text-align: right;
    width: 40%;
    float: right;
}
	.menu-top-right a span { 
		display: none;		
	 }	
	.menu-top-right  { 
		float: right;		
	 }
	.menu-top-center  { 
		float: left;		
	 }
}


/*Desktop View*/
@media (min-width: 769px){
	body > footer > .col, body > footer > div > div { padding: 0px 5px!important;}
	.hero, .hero1, .hero2, .hero3, .hero4 {	margin-top: 160px; padding: 15% 0;}
	
	.style-nav ul li {
		display: inline-block;
	}
	
	.style-nav ul {
		text-align: center;
	}
	

	
	h2 {
		margin-bottom: 15px;
	}
	
	.col-md-one-half {
		width: 50%;
	}
	
	.col {
		float: left;
		padding: 10px 10px 0px 10px;
	}
	.style-logo {
		float: left;
	}
	
	.style-nav {
		float: right;
	}
	
	.col-lg-one-fourth {
		width: 25%;
	}
}


/*Tablet View*/
@media (max-width: 768px) and (min-width: 481px){
	.preventivo {
    padding: 40px 0!important;
	display: block;
    }
	.col_70 {    width: 100%; padding: 5px;}
	footer {    margin: 0px 5px 10px 5px; }	
	.text_right{ text-align: left;}
	body > footer > .col, body > footer > div > div { padding: 0px 5px!important;}
	.footer {
    display: block;
    font-size: 10px!important;
	 padding-right: 80px;
}
	#step_4 p { margin-bottom: 40px;}
	.col.col-md-one-half.col-lg-one-fourth {
    padding: 10px;
	}
	.box_full_col.preventivo section h3, .box_full_col.servizi section h3 {
	   padding: 5px;
	}
	.box_full_col .servizi{
    padding: 5px!important;
	}
	.servizi { padding: 10px 0!important;}
	.box_full_col {
    padding: 5px;
}
	.box_full_col span, .box_full_col a.cliccaescopri.cliccaescopri {
		font-size: 0.7em;
	}

	.hero, .hero1, .hero2, .hero3, .hero4 {	margin-top: 140px; padding: 15% 0;}
	h2, h3 {	font-size: 1.2em!important;}
	h4 {	font-size: 1em!important;}
	.title_2 {	font-size: 0.8em; padding: 5px!important;}
	.col, main {    padding: 5px;}
	
	header { padding: 10px 10px 0px 10px;}	
	.col-lg-one-fourth {
		width: 50%;
		float: left;
	}
	.box_full_col.preventivo section h3, .box_full_col.servizi section h3 {
    width: 60%;
	font-size: 21px!important;
	}
}


/*old Mobile View*/
@media (max-width: 480px){
	.preventivo {
    padding: 40px 0!important;
	display: block;
    }
	footer {    margin: 0px 5px 10px 5px; }	
	.menu-top-center {    font-size: 80%;}
	header > div.menu-top, .menu-container{ padding: 5px;}
	.text_right{ text-align: left;}
	body > footer > .col, body > footer > div > div { padding: 0px 5px!important;}
	.footer {
    display: block;
	word-break: break-word;
    padding-right: 80px;
    font-size: 12px!important;
	}
	.box_full_col.preventivo section h3, .box_full_col.servizi section h3 {
    width: 60%;
	font-size: 16px!important;
	}
	.col.col-md-one-half.col-lg-one-fourth {
    padding: 10px;
	}
	.box_full_col.preventivo section h3, .box_full_col.servizi section h3 {
	   padding: 5px;
	}
	.servizi { padding: 0!important;}
	.box_full_col { padding: 5px 0;}	
	.col_70 {    width: 100%;}
	.box_80, .col.col-md-one-half { padding: 10px!important;}	
	
	#step_1 h4, #step_2 h4, #step_3 h4, #step_4 h4{
	line-height:  normal;	
	}
	.box_full_col.preventivo span, .box_full_col.servizi span {    font-size: 8px!important;}
	
	.col.col-md-one-half.col-lg-one-fourth{
		width: 100%!important;
		display: block;
		padding: 10px;
		
	}
	h4 {    height: auto;}
	.box_full_col.grey > .col-lg-one-fourth > p {
    padding-bottom: 0px;		
	}
	.box_full_col span, .box_full_col a.cliccaescopri.cliccaescopri {
	font-size: 10px;
    padding: 5px;
	}
	a.a-logo img {
    max-height: 55px!important;
    width: auto;
	}
	.hero, .hero1, .hero2, .hero3, .hero4 {	margin-top: 140px; padding: 15% 0;}
	
	.title_2 {	font-size: 0.7em; padding: 5px!important;}
	.col, main {    padding: 5px;}
	header { padding: 10px 10px 0px 10px;}	
	.col-lg-one-fourth {
		width: 100%;
		float: left;
	}
	h2 {	font-size: 1.2em; font-weight: bolder;}
	h3, h4 {	font-size: 1em; font-weight: bolder;}
	.servizi {    background-size: 130%; }
	body > main > div:nth-child(1) > div > div > div > div > h2 {font-size: 1em; padding: 5px 10px!important; }
}