Salve,
premetto di non aver mai studiato CSS,
ho un problema relativo alla Slider Responsive,
tra la slider e il menu c'è spazio bianco, come posso toglierlo?
* display none until init */.owl-carousel {
display: none;
position: relative;
width: 90%;
margin: 20px auto;
-ms-touch-action: pan-y; }
.owl-carousel .owl-wrapper {
display: none;
position: relative;
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0); }
.owl-carousel .owl-wrapper:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0; }
.owl-carousel .owl-wrapper-outer {
overflow: hidden;
position: relative;
width: 100%; }
.owl-carousel .owl-wrapper-outer.autoHeight {
-webkit-transition: height 500ms ease-in-out;
-o-transition: height 500ms ease-in-out;
transition: height 500ms ease-in-out; }
.owl-carousel .owl-item {
float: left;
padding: 0;
overflow: hidden; }
.owl-carousel .owl-item .item, .owl-carousel .owl-item .items {
position: relative;
z-index: 1;
-webkit-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease; }
.owl-carousel .owl-item .item img, .owl-carousel .owl-item .items img {
width: 100%; }
.owl-carousel .owl-page, .owl-carousel .owl-buttons div {
cursor: pointer; }
.owl-carousel .owl-wrapper, .owl-carousel .owl-item {
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden;
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0); }
.owl-carousel.property-container .owl-item {
padding: 0; }
.owl-carousel.not-16-9 .owl-item .items img {
max-width: none;
width: auto; }
.owl-controls {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-tap-highlight-color: transparent; }
/* mouse grab icon */
.owl-theme {
/* Styling Next and Prev buttons */ }
.owl-theme .owl-controls {
position: absolute;
left: 50%;
bottom: 30px;
text-align: center;
z-index: 1;
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
/* Clickable class fix problem with hover on touch devices */
/* Use it for non-touch hover action */
/* Styling Pagination*/ }
@media (max-width: 600px) {
.owl-theme .owl-controls {
width: 100%; } }
.owl-theme .owl-controls .owl-buttons div {
position: absolute;
bottom: 30px;
display: inline-block;
zoom: 1;
*display: inline;
/*IE7 life-saver */
color: #000000;
font: 0/0 a;
color: transparent;
text-shadow: none;
background-color: transparent;
border: 0;
width: 30px;
height: 45px; }
@media (min-width: 768px) and (max-width: 992px) {
.owl-theme .owl-controls .owl-buttons div {
bottom: 100%; } }
@media (max-width: 767px) {
.owl-theme .owl-controls .owl-buttons div {
bottom: 100%; } }
.owl-theme .owl-controls .owl-buttons div:after, .owl-theme .owl-controls .owl-buttons div:before {
display: block;
content: "";
position: absolute;
left: 0;
top: 10px;
width: 30px;
height: 1px;
-webkit-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
background: #000000; }
.owl-theme .owl-controls .owl-buttons div:before {
top: 31px; }
.owl-theme .owl-controls .owl-buttons div:hover:after, .owl-theme .owl-controls .owl-buttons div:hover:before {
background: #FFFFFF; }
.owl-theme .owl-controls .owl-buttons div.owl-next {
right: -145px; }
.owl-theme .owl-controls .owl-buttons div.owl-next:after {
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg); }
.owl-theme .owl-controls .owl-buttons div.owl-next:before {
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg); }
.owl-theme .owl-controls .owl-buttons div.owl-prev {
left: -145px; }
.owl-theme .owl-controls .owl-buttons div.owl-prev:after {
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg); }
.owl-theme .owl-controls .owl-buttons div.owl-prev:before {
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg); }
.owl-theme .owl-controls.clickable .owl-buttons div:hover {
opacity: 1;
filter: alpha(opacity=100);
text-decoration: none; }
.owl-theme .owl-controls .owl-pagination {
display: inline-block; }
.owl-theme .owl-controls .owl-page {
display: inline-block;
zoom: 1;
*display: inline;
/*IE7 life-saver */ }
.owl-theme .owl-controls .owl-page span {
background: #333333;
display: block;
margin: 5px 3px;
width: 15px;
height: 15px;
-webkit-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
/* If PaginationNumbers is true */ }
.owl-theme .owl-controls .owl-page span.owl-numbers {
width: auto;
height: auto;
color: #FFFFFF;
padding: 2px 10px;
font-size: 12px;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
border-radius: 30px; }
.owl-theme .owl-controls .owl-page.active span, .owl-theme .owl-controls.clickable .owl-page:hover span {
background: #C5A46D; }
/* preloading images */
.owl-item.loading {
min-height: 150px;
background: url(AjaxLoader.html) no-repeat center center; }
/**
* Main Slider style */
#home-top-section {
position: relative; }
#main-slider, #fullscreen-slider, #room-details-slider {
width: 100%;
margin: 0; }
#main-slider img, #fullscreen-slider img, #room-details-slider img {
width: 100%; }
#main-slider .owl-wrapper, #fullscreen-slider .owl-wrapper, #room-details-slider .owl-wrapper {
width: 100vw !important;
height: 100vh !important;
left: 0 !important;
position: relative;
-moz-transform: translateX(0) !important;
-ms-transform: translateX(0) !important;
-webkit-transform: translateX(0) !important;
transform: translateX(0) !important; }
#main-slider .owl-item, #fullscreen-slider .owl-item, #room-details-slider .owl-item {
position: absolute;
left: 0;
top: 0;
opacity: 0;
filter: alpha(opacity=0);
-webkit-transition: all 2s ease;
-o-transition: all 2s ease;
transition: all 2s ease;
width: 100vw;
height: 100%;
max-height: 100vh;
overflow: hidden; }
#main-slider .owl-item.active, #fullscreen-slider .owl-item.active, #room-details-slider .owl-item.active {
opacity: 1;
filter: alpha(opacity=100); }
@media (max-width: 992px) {
#main-slider .owl-controls, #fullscreen-slider .owl-controls, #room-details-slider .owl-controls {
bottom: 30px; }
#main-slider .items, #fullscreen-slider .items, #room-details-slider .items {
width: 100vw;
height: 100vh; }
#main-slider .items img, #fullscreen-slider .items img, #room-details-slider .items img {
position: absolute;
left: 50%;
top: 50%;
width: auto;
height: 100%;
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%); } }
/**