html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
 u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section { display: block;}
html, body {height: 100%;  margin: 0;}
table {	border-collapse: collapse; border-spacing: 0;}
a { text-decoration: none; color: black;}
img { clear: both; max-width: 100%;}
i { font-style: italic; }

/*  END RESET */

body, html  { margin: 0; font-family: 'Open Sans', sans-serif; font-size: small; font-weight: 300; line-height: 24px;  }
.cut100 { width: 100%; overflow: hidden; height: 90px; margin-top: -90px;    }

#slider {width: 100%; height: 450px; background-color: #dde; }

.round { padding: 5px; border-radius: 50%; padding:  3px 5px; border: 1px solid #999; margin-right: 10px;  }
#bg {  width: 100%;  height: 90%; position: relative; }
#bg1, #bg2, #bg3, #bg4, #bg5, #bg6 { position: absolute; top: 0;  left: 0;  width: 100%; height: 100%;    background-size: cover;  background-position: center center;  }
#bg1 { background-image: url('img/bg1.jpg');  }
#bg2,  #bg3, #bg4, #bg5, #bg6 {  display: none; }
#bg1, #bg3 { background-position: bottom; }

#overlay {  background-attachment: fixed;  opacity: 0; background: black;  position: absolute; top: 0;  left: 0;  width: 100%; height: 100%;    }


.logo { position: absolute; top: 50%; left: 50%; margin-left: -350px; margin-top: -150px; width: 700px;  }
.logo img { width: 300px; }

.cursive {line-height: 80px; color: #fff; text-shadow: 1px 1px 10px #000; font-family: 'Pacifico', cursive; font-size: 30px;  }  



#menu { line-height: 40px; width: 100%; background: rgba(114,164,201, 0.9); position: fixed; top: 0; z-index: 1000; text-align: right; border-bottom: 2px solid #fff;  }
  #menu a {display: block; float: right;  height: 40px; line-height: 40px; padding: 0 25px; border-left: 1px solid #fff; color: #fff; font-size: 1.1em; font-weight: 500;  }
  #menu a:hover { background: rgba(255,255,255,0.78); color: #72a4c9; transition: all 1s; }

b { color: #72a4c9; font-weight: 400; }
h2 b { color: #888; font-weight: 400; font-size: 140%; line-height: 170%; }

.boxrotate { margin: 0px; width: 120%; height: 180px; background: white;    box-shadow: 0px -2px 2px #ccc; line-height: 16px; }

.section { width: 960px; max-width: 100%; margin: auto; min-height: 400px; clear: both; text-align: center; color: #666; font-size: 1.25em;  }
.section2 { width: 100%; clear: both; float: left;  overflow: hidden; }
.grigio { background: #fdf7fb;  border-top: 20px solid #fdf7fb;border-bottom: 20px solid #fdf7fb;  }
       .section2 h3 { font-size: 2em; color: #fff; line-height: 120%; margin-bottom: 30px; text-align: center; width: 60%; padding: 150px 20%; margin: auto;  background: rgba(25,25,25,0.78);   }

hr { border: 5px solid #72a4c9;  opacity: 0.2; margin: 20px 0;  }


	.camere td { padding: 2px 10px; }

	.icona  { padding: 5px; float: left; margin: 5px; background: white; border-radius: 10px; text-align: center; width: 80px; font-size: 60%;  border: 1px solid #666;  }
	.icona i { font-size: 300%;  }

.hide { color: rgba(255,255,255, 0); }

.fixedbg { background: url('img/_bg3.jpg') no-repeat center fixed;   background-size:  cover; font-family: 'Pacifico', cursive;   }


        .box_1 { margin: 0px 0; width: 100%; box-sizing: border-box; padding: 10px;  float: left; overflow: hidden;   }
        .box_foto { margin: 0px 10px; width: 20%; box-sizing: border-box; padding: 0px;  float: left; overflow: hidden; height: 140px; }
        .box_testo { margin: 0px 0; width: 53%; box-sizing: border-box; padding: 0 20px;  float: left; overflow: hidden; height: 140px; text-align: left; }



        .box2 { margin: 30px 0; width: 50%; box-sizing: border-box; padding: 20px;  float: left; overflow: hidden; }
        .box3 { margin: 30px 0; width: 33.33%; box-sizing: border-box; padding: 20px;  float: left; overflow: hidden; }
        .box4 { margin: 20px 0 ; width: 25%; box-sizing: border-box; padding: 20px;  float: left; overflow: hidden; }
        .box4 i { color: #72a4c9;}
         .prog { border-radius: 150px; width: 300px; height: 300px; margin: 25px auto;   }
        .prog2 {   border-radius: 10px; border: 5px solid #eee; box-sizing: border-box; }
        .boxfoto { border-radius: 10px; border: 5px solid #eee; margin-top:5px; height: 130px;  }
        .section h1 { font-size: 2.3em; color: #ff0099; font-weight: normal; line-height: 120%; margin: 40px 0;  font-weight: 100;  }
        .section h2 { font-size: 1.3em; color: #72a4c9; line-height: 120%; font-weight: 400; margin-bottom: 30px; font-weight: 100; }
        
		
        input, textarea { background: #eee; line-height: 20px; border-radius: 20px; width: 90%; padding: 10px 20px; border: 0; outline: none; margin: 2px 0; }
        textarea {  height: 250px;  }
        .bottone, .submit { width: 60%; float: right; border:0; background: #fff;  padding: 10px; border-radius: 30px; border: 3px solid #72a4c9; font-size: 15px; margin-top: 30px; color: #72a4c9; }
        .bottone2 { width: 40%; margin-left: 5%; float: right; border:0; background: #fff;  padding: 10px; border-radius: 30px; border: 3px solid #72a4c9; font-size: 15px; margin-bottom: 30px; color: #72a4c9; }
        .popup_image { position: absolute; top: 50px; z-index: 500; margin: auto;  }
        
        
        footer { background: #72a4c9; color: white; padding: 50px; text-align: center;  clear: both;   }
        footer b { color: white; font-weight: 900; }
        footer i   { margin: 0 10px -8px 0;  padding: 5px;   }
        footer a   { color: white; }

#fotogallery .box2 {overflow: hidden; margin: 20px 0;   padding:0 5px; box-sizing: border-box;  }
.phone { display: none; }

#fotogallery .box2.text { padding:15px;  }


.popup 	{	position: fixed;  top:0px; left:0; width: 100%; height: 100%;  box-shadow: -14px -10px 45px #111;
			border-left: 1px solid #333; background: #fff;  display: none; background: rgba(0,0,0,0.8);  }
.box_popup {  margin: 20px auto; padding: 0 20px;    width: 660px; position: relative;  overflow: scroll;
			 height: calc(100% - 60px); background: white; border: 10px solid white; border-radius: 10px;  }
a.closeicon {   position: absolute; top: 0px; right: 0px; }


.area_2 { height: 500px!important; overflow: hidden; }


@media (max-width: 700px)
{
        .box4 {width: 50%; margin: 20px 0 }
          .logo { position: absolute; top: 50%; left: 0; margin-left: 0px; margin-top: -125px; width: 100%; }
        .logo img { width: 50%; }
         .fixedbg { background: url('img/_bg3.jpg')no-repeat center;   background-size: auto 100%; }
        #menu {display: none; }
        .phone { display: block; position: fixed; top: 20px; right: 20px; z-index: 10000; }
        #menu a { display: block; width: 100%; text-transform: uppercase; text-align: center; padding: 20px 0}
        #fotogallery .box2 {  overflow: hidden; margin: 20px 0;  }
        
}





@media (max-width: 400px)
{
        .box2, .box4 {width: 100%; margin: 20px 0 }
        .logo { position: absolute; top: 50%; left: 0; margin-left: 0px; margin-top: -125px; width: 100%; }
        .logo img { width: 90%; }
         .fixedbg { background: url('img/_bg3.jpg')no-repeat center;   background-size: auto 100%; }
		 #fotogallery .box2 {  overflow: hidden; margin: 5px 0;  }
  
}
