/* reset */
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,
b, 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, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
font-family: "Hobo Std";
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/* font */
@font-face {
font-family: 'Hobo Std';
src: url('../font/HoboStd.eot');
src: url('../font/HoboStd.eot?#iefix') format('embedded-opentype'),
url('../font/HoboStd.woff') format('woff'),
url('../font/redressed.ttf') format('truetype'),
url('../font/HoboStd.svg#HoboStd') format('svg');
font-weight: normal;
font-style: normal;
}
/* inizio css */
.header {
background: #fff;
width: 100%;
height: 68px;
position: fixed;
top: 0;
left: 0;
border-bottom: 4px solid #4C9CF1;
z-index: 100;
}
a {
color: #4C9CF1;
}
.footer a{
color: white;
}
h1, h2, h3 {
text-align:center;
}
#logo{
margin-top: 20px;
margin-left: 10px;
float: left;
width: 180px;
height: 36px;
background: url(../img/logo.png) no-repeat center;
display: block;
}
nav {
float: right;
padding-left:20px;
padding-right: 10px;
padding-top:29px;
padding-bottom:11px;
}
#menu-icon {
display: none;
width: 40px;
height: 40px;
background: #4C8FEC url(../img/menu-icon.png) center;
position:relative;
top:-9px;
right:10px;
z-index:1;
}
a:hover#menu-icon {
background-color: #4C9CF1;
border-radius: 4px 4px 0 0;
}
#menu-close {
display: none;
width: 40px;
height: 40px;
background: #4C8FEC url(../img/menu-close.png) center;
margin-top: 20px;
margin-right: 10px;
float: left;
z-index:0;
}
a:hover#menu-close {
background-color: #4C9CF1;
border-radius: 4px 4px 0 0;
}
ul {
list-style: none;
}
li {
display: inline-block;
float: left;
padding: 8px;
font-size:80%;
}
.current {
color: #2262AD;
}
/*contenitore centrale*/
.ostuni {
width:100%;
border: medium;
border-color: #4C9CF1;
margin: 72px auto 5px;
max-width: 980px;
position: relative;
border-bottom: 4px solid #4C9CF1;
}
.imgostuni {
width:100%;
border-bottom:4px solid #4C9CF1;
border-left:4px solid #4C9CF1;
border-right:4px solid #4C9CF1;
border-top:0px;
}
.txtostuni {
padding:5px 15px 15px 15px;
text-align:justify;
border-bottom: 4px solid #4C9CF1;
line-height:2;
}
.navpuglia {
padding:5px;
text-align:center;
border-bottom: 4px solid #4C9CF1;
}
.imgnavpuglia {
width:48%;
display:inline-block;
margin-top:8px;
}
.imgpugliafiller {
width:48%;
display:inline-block;
}
.recenti {
padding:5px;
text-align:center;
margin-top:5px;
border-bottom: 4px solid #4C9CF1;
}
.recenti1 {
width:49%;
display:inline-block;
border:1px solid #4C9CF1;
text-align:right;
margin-top:5px;
vertical-align: top;
}
.recenti1desktop {
width:49%;
display:inline-block;
border:1px solid #4C9CF1;
text-align:right;
margin-top:5px;
vertical-align: top;
}
.articolohome {
padding:10px;
text-align:justify;
}
.morebutton {
padding:3px;
width:40%;
margin-right:10px;
margin-bottom:5px;
}
/*footer*/
.footer {
width:100%;
max-width: 980px;
border-bottom: 5px solid white;
background: #4C9CF1;
text-align:center;
margin-top:3px;
}
.subfooter {
color: white;
padding-top:20px;
padding-left:20px;
padding-right:20px;
padding-bottom:10px;
}
.singlefooter {
width:30%;
display:inline-block;
position:relative;
top:0px;
vertical-align:top;
line-height:150%;
font-size:100%;
}
.singlefootercentral {
width:30%;
display:inline-block;
position:relative;
top:0px;
vertical-align:top;
line-height:150%;
border-right:5px solid white;
border-left:5px solid white;
font-size:100%;
}
.creditsbox {
padding-left:20px;
padding-right:20px;
}
.credits {
padding:20px;
color: white;
border-top:5px solid white;
}
/*altre pagine*/
/*nav casevacanze*/
.navcasevacanze {
padding:5px;
text-align:center;
border-bottom: 4px solid #4C9CF1;
}
.imgnavcasevacanze {
width:48%;
display:inline-block;
margin-top:10px;
margin:5px;
vertical-align:middle;
font-size:135%;
}
.icocasevacanze {
width:20%;
display:inline-block;
padding:15px;
}
.navsiti {
margin-top:15px;
border-bottom:2px solid #4C9CF1;
}
.contactform {
width:60%;
}
.infobox {
border-bottom:2px solid #4C9CF1;
margin-top:10px;
padding-bottom:3px;
}
.infobox h2 {
text-align:left;
font-size:130%;
}
.info1 {
width:26%;
display:inline-block;
margin-top:10px;
vertical-align:top;
}
.info2 {
width:14%;
display:inline-block;
margin-top:10px;
vertical-align:top;
}
.info3 {
width:26%;
display:inline-block;
margin-top:10px;
vertical-align:top;
}
.info4 {
width:30%;
display:inline-block;
margin-top:10px;
vertical-align:top;
}
.info-ostuni {
display:none;
}
/*pag singole case vacanze*/
.imgcasevacanze {
width:99%;
padding:0px;
}
.icosingolecase {
text-align:center;
width:100%;
margin-bottom:10px;
margin-top:-10px;
}
.imgicosingolecase {
display:inline-block;
width:19%;
}
.imgico {
width:100%;
}
.contactformcase {
width:56%;
line-height:2;
padding-left:22%;
}
.imgnavcasevacanzesingole {
width:48%;
display:inline-block;
margin-top:10px;
margin:5px;
}
.prezzo {
width:90%;
margin-top:-15px;
}
/*pag singole spiagge*/
.mappecell {
display:none;
}
/*pag singole locali*/
.chiama-locale {
width:50%;
display:inline-block;
margin-top:1px;
vertical-align:top;
}
/*MEDIA QUERY*/
@media only screen and (max-width : 640px) {
.header {
position: absolute;
}
#menu-icon {
display:inline-block;
}
#menu-close {
display:block;
position: absolute;
top: 0px;
right:10px;
}
nav:hover #menu-icon {
display:none;
}
nav ul, nav:active ul {
display: none;
position: absolute;
padding: 20px;
background: #fff;
border: 5px solid #4C9CF1;
right: 20px;
top: 60px;
width: 75%;
border-radius: 4px 0 4px 4px;
}
nav li {
text-align: center;
width: 100%;
padding: 10px 0;
margin: 0;
font-size:100%;
}
nav:hover ul {
display: block;
}
.imgostuni {
width:100%;
border-bottom:4px solid #4C9CF1;
border-left:0px;
border-right:0px;
border-top:0px;
}
.txtostuni {
line-height:1;
padding:5px 10px 10px 10px;
}
.recenti1 {
width:97%;
}
.recenti1desktop {
display:none;
}
.morebutton {
width:30%;
}
.subfooter {
padding-top:5px;
padding-left:5px;
padding-right:5px;
padding-bottom:5px;
}
.singlefooter {
width:auto;
display:block;
position:relative;
top:0px;
vertical-align:top;
padding:10px;
font-size:115%;
}
.singlefootercentral {
width:auto;
display:block;
position:relative;
top:0px;
vertical-align:top;
border-top: 5px solid white;
border-bottom:5px solid white;
border-left:0px;
border-right:0px;
padding:10px;
font-size:115%;
}
.creditsbox {
padding-left:5px;
padding-right:5px;
}
.credits {
padding:10px;
border-top:5px solid white;
}
/*altre pagine mobile*/
/*nav casevacanze*/
.imgnavcasevacanze {
width:97%;
}
.icocasevacanze {
width:45%;
display:inline-block;
padding:0px;
padding-bottom:5px;
}
.contactform {
width:100%;
line-height:2;
font-size:55%;
overflow:hidden;
}
/*numeri utili*/
.info-ostuni {
display:inline-block;
width:100%;
}
.infodesktop {
display:none;
}
.info1 {
width:40%;
margin-top:1px;
vertical-align:top;
padding-left:3px;
}
.info2 {
width:17%;
margin-top:1px;
}
.info3 {
width:17%;
margin-top:1px;
}
.info4 {
width:17%;
margin-top:1px;
}
/*pag singole case vacanze*/
.imgcasevacanze {
width:100%;
border:0px;
padding:0px;
}
.imgicosingolecase {
width:30%;
}
.contactformcase {
width:100%;
line-height:2;
font-size:85%;
overflow:hidden;
padding-left:0px;
}
.imgnavcasevacanzesingole {
width:97%;
}
/*pag singole spiagge*/
.mappecell {
display:block;
width:100%;
text-align:center;
margin-top:15px;
}
.mapsicodiv {
display:inline-block;
padding:5px;
}
.mapsico {
width:90%;
}
.indicazionistradali {
display:none;
}
.chiama-locale {
width:27%;
}
}
@media only screen and (max-width : 640px) and (orientation: landscape) {
.txtostuni {
padding:23px 10px 25px 10px;
font-size:85%;
line-height:1;
}
.recenti1 {
width:49%;
display:inline-block;
border:1px solid #4C9CF1;
text-align:right;
margin-top:5px;
}
.imgnavpuglia {
width:40%;
padding:2%;
}
.imgpugliafiller {
display:none;
}
.subfooter {
padding-top:10px;
padding-left:5px;
padding-right:5px;
padding-bottom:10px;
}
.singlefooter {
width:27%;
display:inline-block;
font-size:100%;
}
.singlefootercentral {
width:27%;
display:inline-block;
line-height:130%;
border-right:5px solid white;
border-left:5px solid white;
border-bottom:0px;
border-top:0px;
font-size:100%;
}
.creditsbox {
padding-left:10px;
padding-right:10px;
}
.credits {
padding:10px;
}
/*altre pagine mobile*/
/*nav casevacanze*/
.imgnavcasevacanze {
width:45%;
display:inline-block;
margin-top:6px;
margin:2px;
}
.icocasevacanze {
width:30%;
display:inline-block;
padding:3px;
padding-bottom:5px;
}
.contactform {
width:95%;
line-height:2;
font-size:120%;
}
/*numeri utili*/
.info1 {
width:50%;
margin-top:1px;
vertical-align:top;
padding-left:10px;
padding-top:3px;
}
.info2 {
width:14%;
margin-top:1px;
}
.info3 {
width:14%;
margin-top:1px;
}
.info4 {
width:14%;
margin-top:1px;
}
.info-ostuni {
display:inline-block;
width:85%;
}
.imgicosingolecase {
width:19%;
}
.contactformcase {
width:70%;
line-height:2;
font-size:100%;
padding-left:15%;
}
.imgnavcasevacanzesingole {
width:75%;
}
.chiama-locale {
width:16%;
}
}
@media only screen and (min-width : 790px) {
nav {
font-size:150%;
}
.navpuglia {
padding:1px;
text-align:center;
border-bottom: 4px solid #4C9CF1;
margin-top:15px;
margin-bottom:20px;
}
.imgnavpuglia {
width:24%;
margin-top:10px;
margin-bottom:10px;
}
.imgpugliafiller {
width:24%;
margin-top:10px;
margin-bottom:10px;
}
}