@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,700');
*{box-sizing:border-box;}

html,body {margin:0; padding:0; font-family: 'Open Sans', sans-serif; font-size:16px; line-height:1.7; color:#666; text-align:justify;}
h1,h2,h3,h4,h5, p{margin:0; padding:0; font-family: 'Open Sans', sans-serif; font-weight:300; line-height:1.7; color:#666;}
strong, b {color: #0B6796;}

.mt-1{margin-top:1rem;}
.mt-2{margin-top:2rem;}
.mt-3{margin-top:3rem;}
.mt-4{margin-top:4rem;}
.mt-5{margin-top:5rem;}

.c-image{position:relative; width:100%; height:auto;}
.c-image__image{width:100%; height:400px; background:url(bandiere-nautiche.jpg) center center no-repeat; background-size: cover;}

.c-title{font-size:1.5rem; text-transform:uppercase; text-align:center; font-weight:700; color: #0B6796; padding:10px 30px; background: #fff;}
.c-title--static{position:static; font-size:1.5rem; text-align:center;}

.c-subtitle{width:100%; padding:15px 30px; font-size:1.2rem; text-align:center; background: #0B6796; color:#fff; font-weight:700; line-height:1.2;}

.c-container{padding:50px 30px;}

.c-button{display:block; max-width:300px; width:100%; padding:14px 0; font-size:1.2rem; text-align:center; background: #FFCA05; text-decoration:none; text-transform:uppercase; color:#fff; font-weight: 700; border-radius: 8px; margin:15px auto 0 auto;}

@media only screen and (min-width:1024px){
	.c-image{position:fixed; top:0; left:0; width:50%; height:100%;}
	.c-image__image{position:absolute; top:0; left:0; width:100%; height:100%; background:url(bandiere-nautiche.jpg) center center no-repeat; background-size: cover;}


	.c-title{position:absolute; top:50px; right:0; z-index:2; font-size:2.5rem; padding:15px 40px;}
	.c-title--static{position:static; font-size:1.5rem; text-align:center;}

	.c-subtitle{position:absolute; bottom:0; left:0; padding:25px 30px;}

	.c-container{margin-left:50%; padding:60px;}
}

@media only screen and (min-width:1330px){
	.c-container{padding:100px;}
}