/****************************************************************** TABLE OF CONTENT - 02.1 Lists - 02.3 Icons 04 - Layout 06 - Header 18 - Plugins - 18.2 Mega menu 19 - Responsiveness **********************************/ /* Styles for list of optional Preferences, if these are available eg. pets allowed */ #PreferencesSearchList li {font-size: 90%;} /* controls spacing before the preferences if available */ #divCriteriaLabel0 {padding-top: 5px;} #PreferencesSearchList input {margin: 0 6px 0 12px;} /* Places preferences in columns instead of a long list */ #PreferencesSearchList li {display: block; width: 145px; float: left;} .ThumbnailTD img {min-width: 150px; height: auto;} /* 02.1 Lists */ ul > li {list-style:none;} .listCriteria {list-style-type: none; clear: both;} /* Styles for list of optional Preferences, if these are available eg. pets allowed */ #PreferencesSearchList li {font-size: 90%; line-height: 2; width: 16.6%;} /* controls spacing before the preferences if available */ #divCriteriaLabel0 {padding-top: 5px;} .divCriteria {padding-bottom: 5%; width: 100%;} #PreferencesSearchList input {margin: 0 6px 0 12px; width: 25px; height: 25px; float: left; display: block;} .ThumbnailTD img {min-width: 150px; height: auto;} ul > li:before {content:"\2022";font-size:10px;position:absolute;top:-7px;left:0;display:none;} ul ul {margin:8px 0 -8px 15px;} ol {margin:0 0 17px 25px;display:inline-block;} ol li {list-style:decimal outside;padding:0 0 8px 5px;} ol ol {margin:8px 0 -8px 15px;} .widget ul {margin:0;} nav ul,footer ul,.gallery ul {margin:0;} nav ul > li,footer ul > li,.widget,aside ul > li,.gallery li {padding:0;} nav ul > li:before,.widget:before, aside ul > li:before,.widget > div > ul li:before,.social li:before,.gallery li:before {display:none !important;} .social li {display:inline-block;padding:0 1px 4px 0 !important;font-size:15px;} .social li a {text-align:center;color:#fff !important;background:#FFC525;display:block;} .social li:last-child {padding-right:0 !important;} /* 02.3 Icons */ .material-icons {font-family: 'Material Icons';font-weight: normal;font-style: normal;font-size: 24px;display: inline-block;width: 1em;height: 1em;line-height: 1;text-transform: none;letter-spacing: normal;word-wrap: normal;/* Support for all WebKit browsers. */-webkit-font-smoothing: antialiased;/* Support for Safari and Chrome. */text-rendering: optimizeLegibility;/* Support for Firefox. */-moz-osx-font-smoothing: grayscale;/* Support for IE. */font-feature-settings: 'liga';} .material-icons.md-18 { font-size: 18px; } .material-icons.md-24 { font-size: 24px; } .material-icons.md-36 { font-size: 36px; } .material-icons.md-48 { font-size: 48px; } /* 06 Header */ .header-bottom {min-height: 45px; background-color: #FFC525;} .contact {float:right;display:block;position:relative;margin:20px 22px 0;padding:0 0 0 40px;} .contact span {display:block;color:#fff;} .contact .number {font-weight:700;} .contact:before {font-family: 'Material Icons';content:"\e0cd";font-size:22px;position:absolute;top:3px;left:0;width:33px;height:33px;text-align:center;line-height:33px;color:#fff;float:left;-webkit-border-radius:17px;-moz-border-radius:17px;border-radius:17px;} /* Slicknav Mobile Menu Core Style */ .menu-collapser {position:relative; width:100%; height:40px; color:#FFF; font-size:14px; line-height:40px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box } .collapse-button {position:absolute; right:0; top:50%; width:40px; padding:7px 10px; color:#FFFFFF; font-size:14px; text-align:center; background-color:#F0A400;border-radius:2px;cursor:pointer;transform:translate(0, -50%);-o-transform:translate(0, -50%);-ms-transform:translate(0, -50%);-moz-transform:translate(0, -50%);-webkit-transform:translate(0, -50%);box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box} .collapse-button:hover,.collapse-button:focus{color:#FFF;background-color:#F0A400;}.collapse-button .icon-bar{display:block;height:2px;width:18px;margin:2px 0;background-color:#F5F5F5;border-radius:1px} ul.slimmenu{width:110%;margin:0;padding:0;list-style-type:none;} ul.slimmenu:before,ul.slimmenu:after{content:'';display:table} ul.slimmenu:after{clear:both} ul.slimmenu.collapsed li{display:block;width:100%;background:#FFC525;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box} ul.slimmenu.collapsed li>ul{position:static;display:none} ul.slimmenu.collapsed li a{display:block;border-bottom:1px solid rgba(0,0,0,0.075);box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}ul.slimmenu.collapsed li .sub-toggle{height:40px} ul.slimmenu li {position:relative; float:left; display:inline-block; width:16%; text-align:center;} ul.slimmenu li ul{margin:0;list-style-type:none;} ul.slimmenu li ul li { background:#FFC525; } ul.slimmenu li>ul{position:absolute;left:1em;top:100%;z-index:999;display:none;width:100%;} ul.slimmenu li>ul>li ul{position:absolute;left:100%;top:0;z-index:999;display:none;width:100%;} ul.slimmenu li a{display:block;} ul.slimmenu li a:hover{text-decoration:none;color:#006225;} ul.slimmenu li .sub-toggle{position:absolute;right:0;top:0;z-index:999;width:40px;height:100%;text-align:center;cursor:pointer;} ul.slimmenu li .sub-toggle:before{content:'';display:inline-block;height:100%;margin-right:-0.25em;vertical-align:middle;} ul.slimmenu li .sub-toggle>i{display:inline-block;color:#006225;margin-left:1.5em;margin-top:1em;} ul.slimmenu>li{}ul.slimmenu>li:first-child,ul.slimmenu>li.has-submenu+li{} ul.slimmenu {margin-left:-60px;} ul.slimmenu li a {padding:14px 0px 10px 0px;} ul.slimmenu li:hover a, ul.slimmenu li.current > a, ul.slimmenu li:hover a:hover {} ul.slimmenu li:hover li a {color:#006225;} ul.slimmenu li.active > a {font-weight:600;} ul.slimmenu li .sub-toggle {display:none;} ul.slimmenu li li .sub-toggle {display:block;} ul.slimmenu li ul li {min-width:180px;text-align:left;padding-left:15px;} ul.slimmenu.collapsed li .sub-toggle {display:block;} ul.slimmenu.collapsed .has-mega {position:relative;} ul.slimmenu .has-mega {position:static;} ul.slimmenu .mega li {width:100%;padding:0;} ul.slimmenu .mega .has-submenu {padding:20px;} ul.slimmenu .mega ul {display: block !important;position:static !important;} ul.slimmenu .mega .sub-toggle {display:none;} ul.slimmenu .mega li a {padding:0 0 5px;text-transform:none;letter-spacing:0;border:none !important;} ul.slimmenu .mega li p {padding:0 0 10px;color:#3F3F3F;text-shadow:0 1px 0 rgba(255,255,255,0.15);font-weight:700;} .main-nav {position:relative;float:left;display:block;width:100%;height:40px;background:#FFC525;z-index:99;} @media screen and (max-width: 1040px) { .main-nav .wrap {max-width:100%;} ul.slimmenu {margin-left:0;width:100%} .menu-collapser {padding:0 2.7%;} .collapse-button {right:2.7%;} ul.slimmenu li a {padding:10px 10px 10px 2.7%;} } /* 19 - Responsiveness */ @media screen and (max-width: 1070px) { .header {height:auto;} .logo {width:100%;} .header .search {float:left;width:40%;margin:0;padding:0 0 15px;} .header .contact {display: block;float:right;margin:8px;} .header .social-top {display: none;} .deals .one-fourth, .deals .one-third, .deals .one-fifth, .deals .one-sixth, .destinations .one-fourth, .destinations .one-third, .destinations .one-fifth, .destinations .one-sixth, .offers .one-fourth, .offers .one-third, .offers .one-fifth, .offers .one-sixth, .boxes .one-fourth {width:50%;} .slider {height:auto;float:left;width:100%;} .main-search .wrap > form {position:static;} .main-search {padding-bottom:20px;} .main-search .column, .main-search .three-fourth {width:100% !important;padding:0 15px;} .main-search h5 {padding:0;} .main-search .form .column > .row {min-height:auto;border-left:none;} .main-search .form h5 {border-top:1px solid #ccc;margin:15px 0 0;padding:15px 0;float:left;width:100%;} .main-search .f-item.one-half, .main-search .f-item.one-third {padding-right:10px;} .main-search .radios .f-item {width:33% !important;} .main-search .f-item.one-half {width:50% !important;} .main-search .f-item.one-third {width:33.33% !important;} .main-search .gradient-button {width:auto;bottom:3px;min-width:17%;} .lb-wrap {width:46%;left:27%;} section .offers figure, section .deals figure, section .destinations figure {height:auto !important;} section .deals .full-width {height:auto !important;} section .deals .full-width figure, section .deals .full-width .details {height:auto !important;width:100% !important;max-height:none;} section .deals .full-width .details {padding-left:25px;} .inner-nav {width:26.4%;} .tab-content {width:70.4%;} .get_inspired li {width:25%;height:140px;} .sort li {padding:0 40px 0 0;} .comment .third {width:25%;} .comment .comment-content {width:75%;} .depth-1 .third {width:27%;} .depth-1 .comment-content {width:73%;} .depth-2 .third {width:30%;} .depth-2 .comment-content {width:70%;} } @media screen and (min-width: 861px) and (max-width: 1200px) { .small-list h3, .small-list p, .small-list .stars, .small-list .rating, .deal-of-the-day h3, .deal-of-the-day p, .deal-of-the-day .stars, .deal-of-the-day .rating {float:left;width:100%;} } @media screen and (max-width: 960px) { .room-types li figure {width:50%;max-height:none;} .tab-content .room-types .meta {width:50%;min-height:0;} .room-types .room-information {width:50%;height:auto;border-left:none;} .room-information .gradient-button {position:static;} .footer .full-width nav {float:left;width:100%;padding:20px 0 0;} .footer .full-width nav li:first-child {margin:0;padding:0;} .get_inspired li {width:33.3333%;height:155px;} .comment {width:100% !important;} .comment .third {width:30% !important;} .comment .comment-content {width:70% !important;} section.error {text-align:center;} .error-content {padding:60px 0 0;} .error-content h3, .error-content ul {text-align:left;} .three-col li {width:50%;} .top-right-nav {float:left;} } @media screen and (max-width: 860px) { .full-width, .three-fourth, .one-half, .one-third, .two-third, .one-fourth, .one-fifth, .one-sixth, .boxes .one-fourth {width:100% !important;} .boxes article > div {min-height:auto;} .lb-wrap {width:80%;left:10%;max-width:80%;} .score,.chart {width:100%;} .main-search .gradient-button {left:38%;} .get_inspired li {height:170px;} .sort-by {height:auto;} .sort {margin:0;border-left:none;} .sort, .sort li {width:100%;} .sort li {border-right:none;margin:0;padding:10px 0;border-top:1px solid #ccc;} .view-type {position:absolute;right:10px;} .ascending {top:11px;} .descending {top:20px;} } @media screen and (max-width: 600px) { .header .search {width:60%;} .header .contact {width:100%;float:left;margin:0 0 15px;} .header .social-top {display: none;} .header .links {display: none;} .main-search .radios .f-item {width:50% !important;} .main-search .f-item.one-half, .main-search .f-item.one-third {width:100% !important;} .main-search .gradient-button {left:33%;} .lb-wrap {width:90%;left:5%;max-width:90%;} .chart {margin-top:10px;} .inner-nav,.inner-nav li.active, .inner-nav li.active:hover,.tab-content {width:100%;} .inner-nav {margin-bottom:20px;} .inner-nav li.active a:after, .inner-nav li.active a:after {display:none;} .room-types li figure, .tab-content .room-types .meta, .room-types .room-information {width:100%;} .tab-content .room-types .meta {padding:20px 0 0;} .room-types .room-information {padding:13px 0 0;} .get_inspired li {width:50%;height:190px;} .comment .third {width:40% !important;} .comment .comment-content {width:60% !important;} .copy {width:100%;text-align:center;} .footer .full-width nav {text-align:center;margin:20px 0 0;border-top:1px solid #ccc;} .footer .full-width nav li {float:none;display:inline-block;border:none;margin:0;padding:0 15px 15px;} } @media screen and (max-width: 500px) { .logo img {max-width:60%;} .main-search .gradient-button {left:25%;} .get_inspired li {width:100%;height:300px;} .comment .third, .comment .comment-content {width:100% !important;} .comment .comment-content {border:none;padding:15px 0 0;} } @media screen and (max-width: 380px) { .get_inspired li {height:220px;} } .social-top {float:right; display:block; position:relative; padding:0; margin-top: -0.8em;} .links {float:right; display:block; position:relative; margin-top:1em; padding:0; color:#FFF;} .links a {color:#FFF;} .links ul {} .links ul li {display:inline-block;} #contentsearch {position:static;}