@import url('https://fonts.googleapis.com/css?family=Roboto:400,400i,700,700i&display=swap');

body,html {width:100vw; margin:0; padding:0; font-size:14px; line-height:22px; font-family: 'Roboto', sans-serif; color:#333; overflow-x:hidden;       background: center center no-repeat fixed;
    -webkit-background-size: cover !important;
    -moz-background-size: cover !important;
    -o-background-size: cover !important;
    background-size: cover !important;
}

h1,h2,h3,h4,h5,h6 {color:#030474; position:relative; line-height:28px;}

h3 {font-size:20px; margin:0 0 40px 0;}

h3:after {content:''; position:absolute; left:0; bottom:-10px; width:20%; height:4px; background:#0e6fb7;}

a {color:#00b6ff;}

img {margin:0 10px;}

.sky_bg {width:100vw; height:100vh; margin:0; padding:0; position:fixed; top:0; left:0; z-index:-1;
        background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(255,255,255,1) 40%, rgba(255,255,255,0) 100%);
        background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 40%,rgba(255,255,255,0) 100%);
        background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 40%,rgba(255,255,255,0) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=0 );
        }

.wrapper {width:100%; max-width:1280px; margin:0 auto; padding:0;}

header {width:100%; margin:0; padding:22px 0 0 0; text-align:center;}

header ul {width:100%; float:left; margin:12px 0 6px 0; padding:0 0 20px 0; text-align:center; border-bottom:1px solid #030474;}

header ul li {display:inline; margin:0; padding:0 5px;}

header ul li a {font-size:16px; color:#030474; text-decoration:none; font-weight:bold;}

header ul li a:hover {color:#00b6ff;}

header img {width:200px; height:auto;}

main {float:left; width:100%; margin:0; padding:0;}

footer {float:left; width:100%; background:rgba(3,4,116,0.8); margin:100px 0 0 0; padding:0 0 50px 0; color:#fff;}

footer ul {width:100%; float:left; margin:0 0 40px 0; padding:20px 0; text-align:center; border-bottom:1px dotted #fff;}

footer ul li {display:inline; margin:0; padding:0 5px;}

footer ul li a {font-size:16px; color:#fff; text-decoration:none; font-weight:bold;}

footer ul li a:hover {color:#00b6ff;}

.three_col {position:relative; width:29.33%; float:left; margin:0; padding:0 2%; z-index:1;}

.prodotti {text-align:center; margin:30px 0 0 0;}

.comunicato {width:100%; max-width:80%; color:#030474; margin:50px auto 100px auto; padding:100px 5%; font-size:18px; line-height:24px; border:1px solid #0e6fb7; text-align:center; background:rgba(255,255,255,0.7); border-radius:10px;
-webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
}

.contenuti {
  width:100%;
  max-width:80%;
  color:#030474;
  margin:50px auto 0 auto;
  padding:5%;
  font-size:18px;
  line-height:24px;
  border:1px solid #0e6fb7;
  background:rgba(255,255,255,0.7);
  border-radius:10px;

  -webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
  -moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
  box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
}

.img-thumb {
  width:calc(20% - 26px);
  height:90px;
  border-radius:6px;
  object-fit: cover;
  border:1px solid #030474;
  margin-bottom:16px;
  text-decoration:none !important;
  -webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
  -moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
  box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
}

.lightboxOverlay {
  background-color:#030474 !important;
}



/* FRAMEWORK */

.txc {text-align:center;}

.box-shadow {
  -webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
  -moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
  box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
}



/* LIBRARY */

form {display:inline-block; width:100%;}
input {width:100%; line-height:32px; background:white; border:1px solid #999; border-radius:4px;}
textarea  {width:100%; min-height:100px; background:white; border:1px solid #999; border-radius:4px;}
input[type="checkbox"] {width:auto; float:left;}
input[type="button"],
input[type="reset"] {width:auto; float:left; line-height:40px; font-size:16px; color:white; padding-left:24px; padding-right:24px; margin-right:24px; background:#999;}
input[type="button"] {background:#030474; border:0 solid white; font-weight:bold; text-transform: uppercase;}











/* Responsive ------------------------------------------------------------------------------------------------*/
@media only screen
    and (min-width: 300px)
    and (max-width: 767px) {

        header img {max-width:70vw; height:auto;}
        .three_col {width:96%; margin-top:40px;}
        .comunicato {padding:10px; margin-bottom:50px;}
        h1 {font-size:20px; line-height:24px;}
        footer {text-align:center;}
        footer ul li a {font-size:14px;}

        .contenuti {padding: 2%; max-width: 90%;}
        .img-thumb {width: calc(50% - 26px);}

        form table {width:100%;}
        form td:first-child {font-size:12px; width:30%;}
        form td:last-child {width:70%;}
}
