/* #Media Queries Responsive ================================================== */ /* Desktop large ------------------------- */ @media (min-width: 1200px) { #header #text-logo img {width: 325px;} #banner-holder .mainslider {min-height: 540px;} #banner-holder .pageslider {min-height: 540px;} .tcontainer ul {margin-right: 17%;} } /* Desktop ------------------------- */ @media (min-width: 980px) and (max-width: 1199px) { .mobilemenu a{ background: url(../images/respberi-pi.png) center center no-repeat transparent; display: block; width: 40px; height: 40px; position: absolute; top: 5px; left: 3%; } #banner-holder .mainslider {min-height: 400px;} #banner-holder .pageslider {min-height: 400px;} #banner-holder #tempsection {min-height: 60px;} #banner-holder #tempsection .tcontainer {min-height: 60px;} #banner-holder #tempsection-page ul {text-align: center;} #banner-holder #tempsection ul li {line-height: 28px; margin-top: 15px; font-size: 23px; } #banner-holder #tempsection #thedate {font-size: 23px;} #banner-holder #tempsection #time {font-size: 23px;} #fullbody-top .page-iconthumb .pagegal {width: 90px;} #fullbody-top .page-iconthumb .pagevt {width: 100px;} #bookingpan {display: none;} } /* Tablet to desktop ------------------------- */ @media (min-width: 768px) and (max-width: 979px) { #banner-holder .mainslider {min-height: 400px;} .mobilemenu a{ background: url(../images/respberi-pi.png) center center no-repeat transparent; display: block; width: 40px; height: 40px; position: absolute; top: 6px; left: 5%; } #main-logo img {width: 90%;} #main-navi ul#sgmainmenu li.topmenu>a {padding-right: 6px; padding-left: 6px;} #header .tephone {font-size: 15px;} #header .topcontents .fbicon {background-size: 30px; -webkit-transition: all .2s ease-in; -moz-transition: all .2s ease-in; -o-transition: all .2s ease-in; transition: all .2s ease-in;} #header .topcontents .fbicon:hover {background-size: 30px;} #banner-holder #tempsection {min-height: 50px;} #banner-holder #tempsection .tcontainer {min-height: 50px;} #banner-holder #tempsection ul li {line-height: 18px; margin-top: 15px; font-size: 23px; } #banner-holder #tempsection #thedate {font-size: 23px;} #banner-holder #tempsection #time {font-size: 23px;} #fullbody-top ul#all-rooms li {width: 50%;} #fullbody-top .page-iconthumb .pagegal {width: 85px;} #banner-holder #tempsection-page ul li.last-child {border-right: none;} } /* All Mobile Sizes (devices and browser) ------------------------- */ @media only screen and (max-width: 767px) { .mobilemenu a{ background: url(../images/respberi-pi.png) center center no-repeat transparent; display: block; width: 40px; height: 40px; position: absolute; top: 0; left: 0; } #fullbody-top ul#all-rooms {position: relative; text-align: center; margin: 0 auto;} #fullbody-top ul#all-rooms li {position: relative; max-width: 500px; margin: 0 auto; text-align: center;} } /* Mobile Landscape & Tablet Portrait ------------------------- */ @media only screen and (min-width: 480px) and (max-width: 767px) { .mobilemenu a{ background: url(../images/respberi-pi.png) center center no-repeat transparent; display: block; width: 40px; height: 40px; position: absolute; top: 45px; left: 5%; } #header #text-logo {float: none; text-align: center; margin: 0 auto;} #header #text-logo img {text-align: center; margin: 0 auto; float: none;} #header .tephone {float: none; margin: 0 auto; margin-bottom: 14px; text-align: center; width: 275px;} #header .tephone span{font-size: 14px;} #fullbody-top .welcometxt {margin: 0 auto; text-align: center; padding-top: 10px; padding-bottom: 15px; margin-top: 25px; font-size: 32px; z-index: 1;} #fullbody-top .pagetitle { margin: 0 auto; text-align: center; } #fullbody-top hr {width: 45%; margin-bottom: 10px;} #fullbody-top .patterns { width: 50%; margin: 0 auto; text-align: center; float: none; } #fullbody-top .patterns-page { width: 61%; margin: 0 auto; text-align: center; float: none; } .nav-toggle {z-index: 2} #bookingpan {margin-top: 2%;} #section-maps .rightpanel {margin-top: 0px;} #section-maps .leftpanel {margin-top: 0px;} #section-maps .leftpanel h2.destiny {z-index: 1;} .ll-skin-lugo .ui-datepicker table {z-index: 2;} #fullbody-top ul#all-tariff li {width: 100%;} ul#all-tariff li > div .tariff-name { width: 50%; float: left; } ul#all-tariff li > div .the-price { float: left; width: 49%; } #banner-holder #tempsection-page {min-height: 20px !important; position: relative;} #banner-holder #tempsection-page .tcontainer {min-height: 20px;} #banner-holder #tempsection-page .tcontainer ul {margin-right: 0% !important; padding-top: 9px; line-height: 18px; padding-bottom: 9px;} #banner-holder #tempsection-page #thedate {font-size: 18px;} #banner-holder #tempsection-page #time {font-size: 18px;} #banner-holder #tempsection-page ul li {padding-top: 0px; padding-bottom: 0px;} #banner-holder #tempsection-page ul li.last-child-tmp {font-size: 18px;} #fullbody-top .pagetitle { font-size: 30px; padding: 25px 0px 15px 0px; } #fullbody-top ul#all-rooms li {width: 100%;} } /* Mobile Portrait ------------------------- */ @media only screen and (max-width: 479px) { h2 {font-size: 25px;} .mobilemenu a{ background: url(../images/respberi-pi.png) center center no-repeat transparent; display: block; width: 25px; height: 40px; position: absolute; top: 45px; left: 5%; } #header #text-logo { float: none; margin: 0 auto; position: relative; text-align: center;} #header #text-logo img {text-align: center; margin: 0 auto; float: none;width: 220px;} #header .tephone {float: none; margin: 0 auto; font-size: 16px;line-height: 25px;padding-top: 4px;margin-bottom: 7px;padding-right: 0px;padding-left: 20px;margin-right: 0px;margin-left: 31px;background-position: 0px 9px;background-size: 18px 18px;text-align: left;width: 100%;} #header .tephone span{font-size: 14px;} #fullbody-top .welcometxt {margin: 0 auto; text-align: center; padding-top: 0px; padding-bottom: 15px; margin-top: 25px; font-size: 25px;} #fullbody-top .pagetitle { margin: 0 auto; text-align: center; } #fullbody-top hr {width: 46%; margin-bottom: 10px;} #fullbody-top .patterns { width: 70%; margin: 0 auto; text-align: center; float: none; } #fullbody-top .patterns-page { width: 81%; margin: 0 auto; text-align: center; float: none; } #fullbody-top .roomsnsuites-txt p {margin-top: 10px;} #bookingpan {margin-top: 2%;} #section-maps .rightpanel {margin-top: 0px;} #section-maps .leftpanel {margin-top: 0px;} #section-maps .leftpanel h2.destiny {z-index: 1;} .ll-skin-lugo .ui-datepicker table {z-index: 2;} #banner-holder #tempsection-page {min-height: 20px !important; position: relative;} #banner-holder #tempsection-page .tcontainer {min-height: 20px;} #banner-holder #tempsection-page .tcontainer ul {margin-right: 0% !important; padding-top: 13px; line-height: 13px;} #banner-holder #tempsection-page #thedate {font-size: 15px;} #banner-holder #tempsection-page #time {font-size: 15px;} #banner-holder #tempsection-page ul li {padding-top: 0px; padding-bottom: 0px; padding: 2px 10px 1px 7px; margin-bottom: 10px;} #banner-holder #tempsection-page ul li.last-child-tmp {font-size: 15px;} #banner-holder #tempsection-page ul li.last-child {border-right: none;} #fullbody-top .pagetitle { font-size: 28px; padding: 25px 0px 15px 0px; } #fullbody-top hr {width: 100%;} #fullbody-top .page-iconthumb { padding-top: 12px; } #fullbody-top .page-iconthumb .pagevt {background-size: 55px; width: 55px; margin-top: 3px; text-indent: -999px;} #fullbody-top .page-iconthumb .pagegal {background-size: 55px; width: 55px; margin-top: 3px; margin-left: 10px; text-indent: -999px;} #fullbody-top ul#all-rooms li {width: 100%;} #restaurant img {margin-top: 10px;} #restaurant-section-space {line-height: 0px;} #facilities img {margin-top: 15px;} #facilities h1 {margin-top: 10px;} #fullbody-top ul#all-tariff li {width: 100%;} ul#all-tariff li > div .tariff-name { width: 50%; float: left; } ul#all-tariff li > div .the-price { float: left; width: 49%; } #fullbody-top .galleryphotos {width: 98px; font-size: 25px; padding: 30px 0px 6px 0px; margin-right: 8px; background-position: right 31px;} #fullbody-top .galleryphotos a{font-size: 30px;} /*#fullbody-top .gallerylink {width: 215px; font-size: 30px; padding: 35px 0px 10px 0px; margin-right: 12px; background-position: right 28px;}*/ #fullbody-top .gallerylink {width: 165px; font-size: 30px; padding: 30px 0px 6px 0px; margin-right: 0px; background-position: right 28px;} /*#fullbody-top .gallerylink a{font-size: 30px;}*/ #fullbody-top .gallerylink a{font-size: 25px;} #fullbody-top .hrbot {margin-bottom: 0px; margin-top: 10px;} #fullbody-top .gallerytours {width: 160px; font-size: 25px; padding: 35px 0px 10px 0px; margin-right: 8px; background-position: right 28px;} #fullbody-top .gallerytours a{font-size: 30px;} #fullbody-top .gallerylink-vt {width: 90px !important; font-size: 25px; padding: 35px 0px 10px 0px; margin-right: 0px; background-position: right 28px;} #filters-container .cbp-filter-item {padding: 5px 5px; margin: 6px 1px 0 0;} #grid-container .cbp-item ul li {float: left; width: 155px;} ul.cbp-wrapper .cbp-item {float: left; width: 155px; height: 103px;} .thumb-icon {width: 155px; height: 103px;} /*ul#the-terms li {line-height: 25px; background-position: left 10px; padding: 2px 0px 6px 20px;}*/ #fullbody-top .online-booking button {position: relative; margin: 0 auto; text-align: center; float: none; width: 100%;} form#contactform button {position: relative; margin: 0 auto; text-align: center; float: none; width: 100%;} }