.wrapper {
position: relative;
}
.section {
position: relative;
background-color:#fafaf7;
z-index: 2;
}
.bg-swish {
position: absolute;
top: 100%;
left: 0;
right: 0;
height: 100%;
background-attachment: fixed;
}
.but-watch-video,
.but-enquire,
.logo-hillside-enter,
.pass-login {
position: absolute;
z-index: 3;
}
.but-watch-video {
top: 38px;
left: 40px;
}
.but-enquire {
top: 38px;
right: 40px;
}
.but-watch-video a,
.but-enquire a {
color: #fff;
font-size: 15px;
letter-spacing: 3.5px;
text-transform: uppercase;
}
.but-watch-video a {
padding-right: 20px;
background-image: url(//hillsidevaucluse.com/wp-content/themes/hillside_web_1_0_4/images/icon-watch.png);
background-repeat: no-repeat;
background-position: right center;
background-size:12px;
-moz-background-size:12px;
}
.but-watch-video a:after,
.but-enquire a:after {
content: '';
width: 0;
position: absolute;
height: 1px;
bottom: 0px;
left: 0;
-webkit-transition: all 0.5s;
-o-transition: all 0.5s;
-moz-transition: all 0.5s;
transition: all 0.5s;
background-color: #fff;
}
.but-watch-video a:hover:after {
width: 86%;
}
.but-enquire a:hover:after {
width: 96%;
}
.popup-enquire,
.popup-enquire-general {
position: fixed;
width: 100%;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index:5;
overflow-y: auto;
}
.popup-enquire-general.off,
.popup-enquire.off {
left: 100%;
}
.pass-login {
bottom: 60px;
width: 100%;
text-align: center;
}
.pass-login span {
display: block;
color: #fff;
font-size: 16px;
letter-spacing: 0.5px;
}
.pass-login input {
width: 80%;
max-width: 460px;
padding-top: 11px;
margin-top: 10px;
color: #fff;
border-bottom: 1px solid #fff;
z-index: 2;
position: relative;
}
.pass-login input:focus {
}
.pass-login input.submit {
border: 1px solid #fff;
width: 190px;
margin-top: 30px;
padding-top: 8px;
padding-bottom: 8px;
color: #fff;
letter-spacing: 5px;
cursor: pointer;
}
.pass-login input.submit:hover {
background-color: #fff;
color: #000;
}
label.pass-login {
cursor:text;
color:#000;
position:absolute;
padding-top:15px;
padding-left:18px;
}
label.active {
margin-top:-34px;
}
.pass-login input::placeholder {
color: #ccc;
opacity: 1;
font-style: normal;
font-size: 16px;
text-transform: uppercase;
letter-spacing: 5px;
}
.pass-login input:-ms-input-placeholder {
color: #ccc;
font-style: normal;
font-size: 16px;
text-transform: uppercase;
letter-spacing: 5px;
}
.pass-login input::-ms-input-placeholder {
color: #ccc;
font-style: normal;
font-size: 16px;
text-transform: uppercase;
letter-spacing: 5px;
}
.pass-login p {
color: #fff;
font-size: 15px;
padding-top: 8px;
}
.pass-login p a {
color: #fff;
}
p.p-incorrect {
font-size: 15px;
color: #ff3333;
}
p.text-place {
color: #ccc;
opacity: 1;
font-style: normal;
font-size: 16px;
text-transform: uppercase;
letter-spacing: 5px;
height: 40px;
margin-top: -48px;
z-index: 1;
position: relative;
}
.pass-login:focus-within p.text-place {
color: transparent;
}
.logo-hillside-enter {
top: 50%;
margin-top: -90px;
width: 100%;
text-align: center;
}
.logo-hillside-enter img {
width: 60%;
max-width: 500px;
}
.video-popup-intro.off {
position: fixed;
top: 0;
left: 100%;
right: -50%;
bottom: 0;
z-index: 4;
}
.video-popup-intro {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 4;
background-color: #000;
}
.video-popup-intro video {
width: 100%;
height: 100%;
object-fit: contain;
}
.video-popup-intro-close a,
.video-popup-team-1-close a,
.video-popup-team-2-close a,
.video-popup-team-3-close a,
.video-popup-team-4-close a,
.video-close-thanks a {
width: 40px;
height: 40px;
position: absolute;
top: 30px;
right: 30px;
background-image: url(//hillsidevaucluse.com/wp-content/themes/hillside_web_1_0_4/images/icon-close-video.png);
background-repeat: no-repeat;
background-position: center center;
background-size:40px;
-moz-background-size:40px;
z-index: 4;
}
.enquire-close a,
.enquire-close-general a,
.thanks-close a {
width: 40px;
height: 40px;
position: absolute;
top: 30px;
right: 30px;
background-image: url(//hillsidevaucluse.com/wp-content/themes/hillside_web_1_0_4/images/icon-close-enquire.png);
background-repeat: no-repeat;
background-position: center center;
background-size:40px;
-moz-background-size:40px;
z-index: 4;
}
.video-popup-team-1.off,
.video-popup-team-2.off,
.video-popup-team-3.off,
.video-popup-team-4.off {
position: fixed;
top: 0;
left: 100%;
right: -50%;
bottom: 0;
z-index: 4;
}
.video-popup-team-1,
.video-popup-team-2,
.video-popup-team-3,
.video-popup-team-4 {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 4;
background-color: #000;
text-align: center;
padding-top: 2.5%;
}
.video-popup-team-1 video,
.video-popup-team-2 video,
.video-popup-team-3 video,
.video-popup-team-4 video {
height: 95%;
}
.bg-green {
background-color: #524d3a;
}
.padd-main {
padding: 70px;
}
.padd-sides {
padding-left: 90px;
padding-right: 90px;
}
.padd-main.top-med {
padding-top: 140px;
padding-bottom: 100px;
}
.padd-main.top-big {
padding-top: 190px;
}
.padd-main.bot-less {
padding-bottom: 10px;
}
.padd-top-bot {
padding-top: 100px;
padding-bottom: 100px;
padding-left: 0;
padding-right: 0;
}
.cover {
background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
-moz-background-size: cover;
background-position:center center;
}
.hero-full-enquire {
height: 100vh;
min-height: 1040px;
}
.hero-full-thanks {
height: 100vh;
min-height: 790px;
}
.hero-full-enquire-login {
height: 100vh;
min-height: 1000px;
}
.hero-full {
width: 100%;
height: 100vh;
min-height: 650px;
}
.hero-fs {
width: 100%;
height: 100vh;
min-height: 650px;
}
.hero-fs img {
width: 100%;
height: 101vh;
min-height: 650px;
object-fit: cover;
overflow: hidden;
}
.hero-full-top {
width: 100%;
height: 100vh;
min-height: 650px;
z-index: 1;
position: relative;
}
.hero-full-top img {
width: 100%;
height: 101vh;
min-height: 650px;
object-fit: cover;
overflow: hidden;
}
.hero-full-top video {
width: 100%;
height: 101vh;
min-height: 650px;
object-fit: cover;
overflow: hidden;
} .hero-fs-video {
width: 100%;
height: 100vh;
min-height: 650px;
overflow: hidden;
background-color: #000;
}
.hero-fs-video video {
width: 100%;
height: 100vh;
min-height: 650px;
overflow: hidden;
object-fit: contain;
background-color: #000;
}
.hero-full-video {
width: 100%;
height: 100vh;
min-height: 650px;
overflow: hidden;
background-color: #000;
}
.hero-full-video video {
width: 100%;
height: 100vh;
min-height: 650px;
overflow: hidden;
object-fit: cover;
background-color: #000;
}
.hero-full-intro {
width: 100%;
height: 100vh;
min-height: 650px;
overflow: hidden;
background-color: #000;
}
.hero-full-intro video {
width: 100%;
height: 100vh;
min-height: 650px;
overflow: hidden;
object-fit: cover;
}
.hero-full img {
width: 100%;
height: 101vh;
min-height: 600px;
object-fit: cover;
position: relative;
z-index: 1;
overflow: hidden;
}
.hero-next {
width: 100%;
height: 100vh;
min-height: 600px;
position: relative;
overflow: hidden;
z-index: 0;
}
.hero-next img {
width: 100%;
height: 101vh;
min-height: 600px;
object-fit: cover;
}
.hero-next video {
width: 100%;
height: 101vh;
min-height: 600px;
object-fit: cover;
z-index: -1;
position: relative;
}
.hillside-intro-logo {
margin: 0;
position: absolute;
top: 50%;
left: 5%;
width: 90%;
transform: translate(0, -50%);
z-index: 3;
text-align: center;
}
.hillside-intro-logo img {
width: 300px;
object-fit: contain;
}
.hero-full .video-bg {
width: 100%;
height: 100vh;
object-fit: cover;
}
.hero-sticky {
width: 100%;
height: 100vh;
min-height: 600px;
overflow: hidden;
}
.hero-sticky video,
.hero-full video {
width: 100%;
height: 100vh;
object-fit: cover;
overflow: hidden;
}
.hero-sticky img {
width: 100%;
height: 100vh;
min-height: 600px;
object-fit: cover;
}
.hero-video-fixed {
width: 100%;
height: 100vh;
min-height: 600px;
overflow: hidden;
left: 0;
top: 0;
position: fixed;
width: 100%;
z-index: 1;
overflow: hidden;
object-fit: cover;
}
.hero-video-fixed video {
}
.hero-fix {
margin-top: -2px;
width: 100%;
height: 100vh;
min-height: 600px;
background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
-moz-background-size: cover;
background-position:center center;
background-attachment: fixed;
}
.hero-fix-video {
width: 100%;
height: 100vh;
min-height: 600px;
background-size: cover;
-webkit-background-size: cover;
-o-background-size: cover;
-moz-background-size: cover;
background-position:center center;
background-attachment: fixed;
z-index: 1;
overflow: hidden;
}
.hero-fix-video video { }
.arrow-go {
position: absolute;
bottom: 70px;
left: 50%;
margin-left: -20px;
background-image: url(//hillsidevaucluse.com/wp-content/themes/hillside_web_1_0_4/images/icon-arrow-down.png);
background-repeat: no-repeat;
background-position: right center;
background-size:32px;
-moz-background-size:32px;
width: 40px;
height: 40px;
z-index: 2;
}  @-webkit-keyframes arrowPulse {
0% {
opacity:0;
}
40% {
opacity:1;
}
80% {
opacity:0;
}
100% {
opacity:0;
}
}
@keyframes arrowPulse {
0% {
opacity:0;
}
40% {
opacity:1;
}
80% {
opacity:0;
}
100% {
opacity:0;
}
}
.arrowPulse {
-webkit-animation-name:arrowPulse;
animation-name:arrowPulse;
}
.arrow-pulse {
-webkit-animation: arrowPulse linear 3s 9000 forwards ;
animation: arrowPulse linear 3s 9000 forwards;
}
.arrow-go.at-top {
opacity: 1;
}
.arrow-go.we-scrolled {
opacity: 0;
}
.bg-tint-main {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: rgba(0,0,0,0.5);
z-index: 1;
}
.text-middle {
margin: 0;
position: absolute;
top: 50%;
left: 5%;
width: 90%;
transform: translate(0, -50%);
z-index: 2;
text-align: center;
}
.image-border-black-thick {
border: 2px solid #000;
overflow: hidden;
margin: 0 auto;
max-width: 710px;
}
.image-border-black-thick.max-1350 {
max-width: 1090px;
}
.image-border-black-medium {
border: 2px solid #000;
overflow: hidden;
}
.image-border-black {
border: 2px solid #000;
overflow: hidden;
max-width: 1210px;
margin: 0 auto;
}
.image-border-black-thin {
border: 2px solid #000;
overflow: hidden;
}
.image-border-white-thin {
border: 2px solid #fff;
overflow: hidden;
}
.cols-x2 {
font-size: 0;
}
.cols-x2 .col-left,
.cols-x2 .col-right {
display: inline-block;
vertical-align: middle;
width: 50%;
}
.cols-x2 .col-left.align-top,
.cols-x2 .col-right.align-top {
vertical-align: top;
}
.col-left-padd {
padding-left: 50px;
}
.quote-team .image-border-black-medium {
margin-left: 8%;
width: 64%;
}
.quote-team-lrg .image-border-black-medium {
margin-left: 0;
width: 78%;
}
.feature-image-left .image-border-black-medium,
.feature-image-left p {
margin-left: 160px;
}
.next-page a {
position: absolute;
top: 50%;
margin-top: -35px;
right: 185px;
height: 70px;
width: 160px;
background-image: url(//hillsidevaucluse.com/wp-content/themes/hillside_web_1_0_4/images/icon-arrow-next.png);
background-repeat: no-repeat;
background-position: right center;
background-size:70px;
-moz-background-size:70px;
z-index: 2;
color: #fff;
text-transform: uppercase;
line-height: 70px;
font-size: 14px;
letter-spacing: 4px;
}
.next-page a:hover {
opacity: 0.8;
width: 140px;
}
.video-border { }
.video-frame {
}
.video-frame video {
padding-top: 110px;
padding-left: 110px;
width: calc(100% - 220px);
}
.video-frame.top0 video {
padding-top: 0;
}
.logo-vogue {
display: block;
text-align: center;
margin-top: -20px;
}
.logo-vogue.vogue-padd-top {
padding-top: 50px;
}
.logo-vogue img {
width: 100px;
}
.image-border {
padding: 110px;
padding-bottom: 80px;
}
.key-features {
text-align: center;
color: #fff;
max-width: 1400px;
margin: 0 auto;
padding-top: 30px;
padding-bottom: 50px;
}
.key-features img {
width: 80px;
text-align: center;
margin: 0 auto;
}
.feature-title {
font-family:'Ivy Mode', Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
font-weight: 300;
text-transform: uppercase;
font-size: 35px;
letter-spacing: 2px;
padding-top: 50px;
padding-bottom: 15px;
}
.logo-left,
.logo-right {
display: inline-block;
vertical-align: top;
width: 40%;
}
.feature-text {
padding-top: 80px;
padding-left: 30px;
padding-right: 30px;
}
.image-map {
margin: 0 auto;
max-width: 1000px;
margin-top: 60px;
margin-bottom: 35px;
position: relative;
}
.image-map .p-caps {
padding-top: 30px;
}
.feature ul {
font-size: 15px;
line-height: 22px;
text-align: center;
list-style: circle;
list-style-position: inside;
padding-top: 20px;
padding-bottom: 65px;
}
.video-key video {
width: 100%;
height: auto;
}
.feature-height {
width: calc(100% - 6px);
height: 350px;
}
.feature-height img,
.feature-height video {
width: 101%;
height: 354px;
object-fit: cover;
overflow: hidden;
margin-top: -2px;
}
.feature {
max-width: 1300px;
margin: 0 auto;
}
.feature .col-left,
.feature .col-right {
width: 44%;
margin-left: 3%;
margin-right: 3%;
display: inline-block;
vertical-align: top;
}
.feature .p-caps {
margin-top: 42px;
}
.img-capt {
display: block;
position: relative;
z-index: 1;
height: 100%;
}
.img-caption {
font-size: 15px;
color: #fff;
letter-spacing: 0.3px;
padding-left: 50px;
z-index: 2;
position: absolute;
margin-top: -65px;
}
.caption-padd {
padding-top: 20px;
}
p.caption-padd {
font-size: 15px;
}
.link-padd-top {
padding-top: 60px;
padding-bottom: 10px;
}
p.p-caps a {
display: inline-block;
position: relative;
line-height: 28px;
}
p.p-caps a:after {
content: '';
width: 100%;
position: absolute;
height: 1px;
bottom: 3px;
left: 0;
-webkit-transition: all 0.5s;
-o-transition: all 0.5s;
-moz-transition: all 0.5s;
transition: all 0.5s;
background-color: #000;
}
p.p-caps a:hover:after {
width: 0;
left: 100%;
}
.but-bottom {
position: absolute;
bottom: 11%;
z-index: 2;
text-align: center;
width: 100%;
}
.but-bottom p.p-caps a {
color: #fff;
}
.but-bottom p.p-caps a:after {
background-color: #fff;
}
.creators-x4 {
font-size: 0;
padding-top: 130px;
padding-bottom: 130px;
margin: 0 auto;
max-width: 1190px;
}
.creators-x4 .creator {
display: inline-block;
vertical-align: top;
width: 18%;
margin-left: 3.5%;
margin-right: 3.5%;
position: relative;
z-index: 1;
}
.creators-x4 .creator img {
border: 2px solid #000;
}
.creator-space {
height: 65px;
}
.creator-text {
color: #fff;
font-size: 15px;
line-height: 25px;
position: absolute;
top: 50%;
margin-top: -10px;
width: 98%;
margin-left: 2%;
text-transform: uppercase;
letter-spacing: 4px;
text-align: center;
opacity: 0;
}
.creators-x4 .creator a:hover .creator-text {
opacity: 1;
}
.creator-space + .creator-text {
top: calc(50% + 32px);
}
.creator-text.less-top {
top: 45%;
}
.creator-space + .creator-text.less-top {
top: calc(50% + 16px);
}
.owl-carousel {
max-width: 1260px;
margin: 0 auto;
}
.owl-carousel .owl-nav {
z-index:5;
width:100%;
height:0;
top:50%;
}
.owl-carousel .owl-prev {
width:50px;
height:50px;
color:transparent;
display:block;
background-image: url(//hillsidevaucluse.com/wp-content/themes/hillside_web_1_0_4/images/arrow-left.png);
background-repeat: no-repeat;
background-position: center center; background-size:50px;
-moz-background-size:50px;
z-index:5;
position:absolute;
top:50%;
margin-top: -50px;
left: -70px;
}
.owl-carousel .owl-next {
width:50px;
height:50px;
color:transparent;
display:block;
background-image: url(//hillsidevaucluse.com/wp-content/themes/hillside_web_1_0_4/images/arrow-right.png);
background-repeat: no-repeat;
background-position: center center;
background-size:50px;
-moz-background-size:50px;
z-index:5;
top:50%;
margin-top: -50px;
right: -70px;
position:absolute;
}
.owl-carousel.owl-white .owl-prev {
background-image: url(//hillsidevaucluse.com/wp-content/themes/hillside_web_1_0_4/images/arrow-left-white.png);
}
.owl-carousel.owl-white .owl-next {
background-image: url(//hillsidevaucluse.com/wp-content/themes/hillside_web_1_0_4/images/arrow-right-white.png);
}
.owl-item img {
overflow: hidden;
}
.owl-item p {
padding-top: 30px;
font-size: 15px;
}
.owl-item p,
.owl-item .owl-image-line img {
-o-transition:.3s;
-ms-transition:.3s;
-moz-transition:.3s;
-webkit-transition:.3s;
transition:.3s;
}
.owl-item p {
opacity: 0;
}
.owl-item:hover p {
opacity: 1;
}
.owl-item .owl-image-line img {
border: 2px solid #fafaf7;
}
.owl-item:hover .owl-image-line img {
border: 2px solid #000;
}
.owl-white .owl-item .owl-image-line img {
border: 2px solid #000;
}
.owl-white .owl-item:hover .owl-image-line img {
border: 2px solid #fff;
}
.team-video-thumb {
max-width: 370px;
margin: 0 auto;
margin-top: 60px;
margin-bottom: 90px;
}
.team-video-thumb img {
margin-bottom: -10px;
overflow: hidden;
}
.team-video-thumb video {
width: 100%;
height: auto;
position: relative;
overflow: hidden;
margin-bottom: -8px;
}
.bg-black {
background-color: #000;
}
.bg-black p,
.bg-black h2 {
color: #fff;
}
.line-bot-white {
border-bottom: 1px solid #fff;
}
.form-border {
border: 1px solid #000;
text-align: center;
max-width: 770px;
padding: 30px;
padding-top: 60px;
padding-bottom: 50px;
margin: 0 auto;
}
.image-map + .p-caps {
padding-bottom: 50px;
}
.image-map-content {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 2;
opacity: 1;
}
.image-map-content .click-away {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: 1;
opacity: 1;
}
.map-plus-1,
.map-plus-2,
.map-plus-3,
.map-plus-4,
.tab-area-1,
.tab-area-2,
.tab-area-3,
.tab-area-4 {
position: absolute;
z-index: 2;
}
.map-plus-1 {
top: 12%;
left: 36%;
}
.map-plus-2 {
top: 21%;
left: 18%;
}
.map-plus-3 {
top: 36%;
left: 66%;
}
.map-plus-4 {
top: 54%;
left: 36%;
}
.tab-area-1 {
top: 10%;
left: 31%;	
}
.tab-area-2 {
top: 16%;
left: 13%;	
}
.tab-area-3 {
top: 33%;
left: 61%;
}
.tab-area-4 {
top: 51%;
left: 31%;
}
.map-plus-1 a,
.map-plus-2 a,
.map-plus-3 a,
.map-plus-4 a {
background-color: #524d3a;
width: 45px;
height: 45px;
line-height: 45px;
font-family:'Ivy Mode', Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
font-weight: 300;
font-size: 35px;
color: #fff;
display: block;
text-align: center;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
}
.tab-area {
display: none;
background-color: #524d3a;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
padding: 15px;
padding-bottom: 12px;
width: 130px;
color: #fff;
font-size: 13px;
}
.tab-area p {
color: #fff;
font-size: 9px;
text-transform: uppercase;
line-height: 22px;
letter-spacing: 2px;
margin-bottom: 6px;
}
p.map-title {
font-family:'Snell Roundhand', Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";
font-weight: 500;
font-size: 28px;
margin-bottom: 16px;
text-transform: none;
letter-spacing: 0;
padding-top: 2px;
}
.tab-area p span {
font-family:'Snell Roundhand', Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";
font-size: 19px;
letter-spacing: 0;
}
.content-mobile {
display: none;
} @media screen and (min-width: 1920px) {
.video-popup-intro video,
.hero-fs-video video {
object-fit: cover;
}
}
@media screen and (min-width: 1441px) and (max-width: 1800px) {
.next-page a { right: 120px;
}
.video-frame video {
padding-top: 80px;
padding-left: 80px;
width: calc(100% - 160px);
}
.image-border {
padding: 80px;
padding-bottom: 80px;
}
}
@media screen and (min-width: 1024px) and (max-width: 1440px) {
.padd-main {
padding: 70px;
}
.padd-sides {
padding-left: 70px;
padding-right: 70px;
}
.padd-main.top-med {
padding-top: 120px;
padding-bottom: 80px;
}
.padd-main.top-big {
padding-top: 170px;
}
.padd-main.bot-less {
padding-bottom: 10px;
}
.padd-top-bot {
padding-top: 130px;
padding-bottom: 130px;
padding-left: 0;
padding-right: 0;
}
.link-padd-top {
padding-top: 60px;
}
.creators-x4 {
padding-top: 130px;
padding-bottom: 130px;
}
.creators-x4 .creator {
width: 21%;
margin-left: 2%;
margin-right: 2%;
}
.creator-text {
font-size: 15px;
line-height: 25px;
letter-spacing: 2px;
}
.next-page a {
top: 50%;
margin-top: -35px;
right: 50px;
height: 70px;
width: 160px;
background-size:70px;
-moz-background-size:70px;
line-height: 70px;
}
.cols-x2 p:first-child br {
display: none;
}
.cols-x2 p.p-caps:first-child br {
display: block;
}
.feature-image-left .image-border-black-medium,
.feature-image-left p {
margin-left: 90px;
}
.video-frame video {
padding-top: 50px;
padding-left: 50px;
width: calc(100% - 100px);
}
.image-border {
padding: 50px;
padding-bottom: 50px;
}
.feature-text p { }
.team-video-thumb {
margin-top: 60px;
margin-bottom: 100px;
}
}
@media screen and (min-width: 1440px) {
.wrap-team {
min-height: 100%;
}
.team-video-thumb {
min-height: 490px;
}
.owl-wrap {
min-height: 560px;
overflow: hidden;
}
}
@media screen and (min-width: 1024px) {
.sticky-bottom {
position:-webkit-sticky;
position:-moz-sticky;
position:-o-sticky;
position:-ms-sticky;
position:sticky;
bottom: 0;
}
.sticky {
position:-webkit-sticky;
position:-moz-sticky;
position:-o-sticky;
position:-ms-sticky;
position:sticky;
top: 0;
}
.hero-full-top {
background-attachment: fixed;
}
.hero-full-top.video-fixed video {
position: fixed;
}
.height-full-to-auto {
width: 100%;
height: 100vh;
min-height: 800px;
}
.text-middle-to-auto {
margin: 0;
position: absolute;
top: 50%;
left: 5%;
width: 90%;
transform: translate(0, -50%);
z-index: 2;
}
}
@media screen and (max-width: 1023px) {
.cols-x2 .col-left,
.cols-x2 .col-right {
width: 90%;
margin-left: 5%;
}
.cols-x2.key-features .col-left,
.cols-x2.key-features .col-right {
width: 80%;
margin-left: 0;
}
.col-left.space-below {
padding-bottom: 70px;
}
.col-left.space-below-big {
padding-bottom: 100px;
}
.col-left-padd {
padding-left: 0;
}
.quote-team .image-border-black-medium {
margin-left: 0;
width: 100%;
}
.cols-x2 p:first-child br {
display: none;
}
.cols-x2 p.p-caps:first-child br {
display: block;
}
.feature-image-left .image-border-black-medium,
.feature-image-left p {
margin-left: 0;
}
.quote-team-lrg .image-border-black-medium {
margin-left: 0;
width: 100%;
}
.map-plus-1 a,
.map-plus-2 a,
.map-plus-3 a,
.map-plus-4 a {
width: 50px;
height: 50px;
line-height: 50px;
font-size: 40px;
}
.tab-area {
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 10px;
padding: 15px;
padding-bottom: 8px;
width: 110px;
color: #fff;
font-size: 13px;
}
.tab-area p {
font-size: 10px;
line-height: 20px;
letter-spacing: 2px;
margin-bottom: 4px;
}
p.map-title {
font-size: 30px;
margin-bottom: 16px;
padding-top: 2px;
}
.tab-area p span {
font-size: 19px;
}
.tab-area-1 {
top: 7%;
left: 30%;
}
.tab-area-2 {
top: 10%;
left: 2%;	
}
.tab-area-3 {
top: 7%;
left: 58%;
}
.tab-area-4 {
top: 35%;
left: 29%;
}
.video-popup-team-1,
.video-popup-team-2,
.video-popup-team-3,
.video-popup-team-4 {
padding-top: 0;
}
.video-popup-team-1 video,
.video-popup-team-2 video,
.video-popup-team-3 video,
.video-popup-team-4 video {
height: 100%;
}
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
.padd-main {
padding: 50px;
}
.padd-sides {
padding-left: 50px;
padding-right: 50px;
}
.padd-main.top-med {
padding-top: 100px;
padding-bottom: 60px;
}
.padd-main.top-big {
padding-top: 150px;
}
.padd-main.bot-less {
padding-bottom: 10px;
}
.padd-top-bot {
padding-top: 110px;
padding-bottom: 110px;
padding-left: 0;
padding-right: 0;
}
.logo-hillside-enter img {
max-width: 400px;
}
.but-watch-video {
top: 40px;
left: 35px;
}
.but-enquire {
top: 40px;
right: 35px;
}
.link-padd-top {
padding-top: 40px;
}
.creators-x4 {
padding-top: 100px;
padding-bottom: 100px;
}
.creators-x4 .creator {
width: 46%;
margin-left: 2%;
margin-right: 2%;
margin-bottom: 5%;
}
.creator-text {
font-size: 15px;
line-height: 25px;
letter-spacing: 2px;
}
.creator-space {
height: 0;
}
.next-page a {
top: 70%;
margin-top: -35px;
right: auto;
left: 50%;
margin-left: -80px;
height: 70px;
width: 160px;
background-size:70px;
-moz-background-size:70px;
line-height: 70px;
}
.next-page a:hover {
margin-left: -70px;
}
.col-left.space-below {
padding-bottom: 60px;
}
.video-frame video {
padding-top: 30px;
padding-left: 30px;
width: calc(100% - 60px);
}
.image-border {
padding: 30px;
padding-bottom: 30px;
}
.team-video-thumb {
margin-top: 50px;
margin-bottom: 80px;
}
}
@media screen and (max-width: 767px) {
.padd-main {
padding: 30px;
padding-bottom: 50px;
}
.padd-sides {
padding-left: 30px;
padding-right: 30px;
}
.padd-sides.padd-sides-team {
padding-left: 10px;
padding-right: 10px;
}
.padd-sides.padd-sides-team .owl-carousel {
width: 90%;
}
.padd-sides.padd-sides-team .owl-carousel .owl-prev {
left: -34px;
}
.padd-sides.padd-sides-team .owl-carousel .owl-next {
right: -40px;
}
.padd-main.top-med {
padding-top: 70px;
padding-bottom: 60px;
}
.padd-main.top-big {
padding-top: 80px;
}
.padd-main.bot-less {
padding-bottom: 10px;
}
.padd-top-bot {
padding-top: 80px;
padding-bottom: 80px;
padding-left: 0;
padding-right: 0;
}
.link-padd-top {
padding-top: 35px;
padding-bottom: 30px;
}
.logo-hillside-enter img {
max-width: 300px;
}
.video-popup-intro-close a,
.video-popup-team-1-close a,
.video-popup-team-2-close a,
.video-popup-team-3-close a,
.video-popup-team-4-close a,
.video-close-thanks a,
.enquire-close a,
.enquire-close-general a,
.thanks-close a {
top: 10px;
right: 6px;
}
.but-watch-video {
top: 20px;
left: 25px;
}
.but-enquire {
top: 20px;
right: 25px;
}
.but-watch-video a,
.but-enquire a {
font-size: 13px;
letter-spacing: 3px;
}
.but-watch-video a:hover:after {
width: 82%;
}
.pass-login span {
font-size: 16px;
letter-spacing: 0.5px;
padding-bottom: 10px;
}
.pass-login input.submit {
margin-top: 30px;
padding-top: 8px;
padding-bottom: 8px;
letter-spacing: 5px;
}
.owl-item.on p {
opacity: 1;
}
.owl-item.on .owl-image-line img {
border: 2px solid #000;
}
.owl-white .owl-item.on .owl-image-line img {
border: 2px solid #fff;
}
.form-border {
padding: 15px;
padding-top: 0;
padding-bottom: 0;
border: 0;
}
.hero-fs-video {
height: 440px;
min-height: 440px;
}
.hero-fs-video video {
height: 440px;
min-height: 440px;
}
.hero-fs {
height: 500px;
min-height: 500px;
}
.hero-fs img {
height: 500px;
min-height: 500px;
}
.hero-full-top {
height: 600px;
min-height: 600px;
}
.hero-full-top img {
height: 600px;
min-height: 600px;
}
.hero-full-top video {
height: 600px;
min-height: 600px;
}
.hero-full {
height: 600px;
min-height: 600px;
}
.hero-full-video {
height: 600px;
min-height: 600px;
}
.hero-full-video video {
height: 600px;
min-height: 600px;
}
.hero-full img {
height: 600px;
min-height: 600px;
}
.hero-fix {
height: 600px;
min-height: 600px;
}
.hero-next {
height: 600px;
min-height: 600px;
}
.hero-next img {
height: 600px;
min-height: 600px;
}
.hero-next video {
height: 600px;
min-height: 600px;
} .hero-fix.img-left {
background-position:right center;
}
.hero-fix-video {
height: 600px;
min-height: 600px;
}
.hero-sticky {
height: 600px;
min-height: 600px;
}
.hero-sticky video {
height: 600px;
min-height: 600px;
}
.hero-sticky img {
height: 600px;
min-height: 600px;
}
.arrow-go {
bottom: 50px;
}
.hero-full-enquire {
min-height: 800px; }
.hero-full-thanks {
min-height: 760px; }
.hero-full-enquire-login {
min-height: 710px; }
.creators-x4 {
padding-top: 60px;
padding-bottom: 60px;
}
.creators-x4 .creator {
width: 46%;
margin-left: 2%;
margin-right: 2%;
margin-bottom: 5%;
}
.creator-text {
font-size: 15px;
line-height: 21px;
letter-spacing: 2px;
}
.creator-space {
height: 0;
}
.creator-space + .creator-text {
top: calc(44% + 10px);
}
.creator-text.less-top {
top: 44%;
}
.creator-space + .creator-text.less-top {
top: calc(44% + 16px);
}
.next-page a {
top: 70%;
margin-top: -35px;
right: auto;
left: 50%;
margin-left: -80px;
height: 70px;
width: 160px;
background-size:70px;
-moz-background-size:70px;
line-height: 70px;
}
.next-page a:hover {
margin-left: -70px;
}
.image-border-black-thick {
border: 2px solid #000;
}
.col-left.space-below {
padding-bottom: 50px;
}
.video-frame video {
padding-top: 30px;
padding-left: 25px;
width: calc(100% - 50px);
}
.image-border {
padding: 30px;
padding-bottom: 30px;
}
.feature-text {
padding-top: 50px;
padding-left: 0;
padding-right: 0;
}
.cols-x2.key-features .col-left,
.cols-x2.key-features .col-right {
width: 90%;
}
.feature-title {
font-size: 30px;
letter-spacing: 2px;
padding-top: 30px;
padding-bottom: 15px;
}
.logo-left,
.logo-right {
width: 50%;
}
.cols-x2.feature .col-left,
.cols-x2.feature .col-right {
width: 100%;
margin-left: 0;
}
.feature .p-caps {
margin-top: 30px;
}
.feature ul { padding-top: 20px;
padding-bottom: 60px;
}
.img-caption {
font-size: 15px;
letter-spacing: 0.3px;
padding-left: 30px;
margin-top: -45px;
}
.owl-carousel.owl-location {
width: 90%;
}
.owl-carousel .owl-prev {
left: -34px;
}
.owl-carousel .owl-next {
right: -40px;
}
.team-video-thumb {
margin-top: 40px;
margin-bottom: 70px;
}
.video-popup-intro video,
.video-contain-768 video {
object-fit: contain;
}
.line-bot-768 {
border-bottom: 1px solid #fff;
}
.break-text-mob span {
display: block;
}
.feature-height {
height: 300px;
}
.feature-height img,
.feature-height video {
height: 304px;
}
.content-desktop {
display: none;
}
.content-mobile {
display: block;
}
}
@media screen and (max-width: 480px) {
.creators-x4 {
padding-top: 40px;
padding-bottom: 40px;
}
.image-map + .p-caps {
padding-bottom: 30px;
}
.team-video-thumb {
margin-top: 30px;
margin-bottom: 40px;
}
.feature-height {
height: 220px;
}
.feature-height img,
.feature-height video {
height: 224px;
}
}