@font-face {
    font-family: GothamLight;
    src: url(../font/Gotham-Light.otf);
}

@font-face {
    font-family:GothamBook;
    src: url(../font/Gotham-Book.otf);
}

@font-face {
    font-family: GothamMedium;
    src: url(../font/Gotham-Medium.otf);
}
@font-face {
    font-family: Gothambold;
    src: url(../font/Gotham-Bold.otf);
}

:root {
    --baseFont: 'GothamLight';
    --fontLight: 'GothamBook';
    --fontMedium: 'GothamMedium';
    --fontBold: 'Gothambold';
}

*{box-sizing: border-box;}
body{margin: 0; padding: 0; font-family: var(--baseFont);}
#wrapper{width: 100%; overflow: hidden;}
img{max-width: 100%; height: auto;}

.banner { width: 100%; height: 100vh; background: url('../images/property-banner.jpg') no-repeat center center; background-size: cover;}

.banner .left-column{background-color: rgba(14, 55, 141,0.88); width: 32vw; max-width: 450px; height: 100vh;}
.banner .left-column .column-inner{padding: 30px 40px; display: flex; flex-direction: column; height: 100%; justify-content: space-between;}


.left-column .column-inner .content{margin-top1: auto; color: #fff; }
.left-column .column-inner .content .title{ font-family:var(--fontBold); font-size: 20px;}
.left-column .column-inner .content p{font-size: 20px;  font-family: var(--fontLight);}
.left-column .column-inner .content a{color: #fff; text-decoration: none; text-underline-offset: 8px; transition: 0.2s;}
.left-column .column-inner .content a:hover{text-decoration: underline; text-underline-offset: 5px;}
.left-column .column-inner .content ul {padding-left: 20px;}
.left-column .column-inner .content ul li{
    font-size: 20px;
    font-family: var(--fontLight);
}
@media(max-width: 1200px) {
    .banner .left-column{width: 75vw;}
}
@media(max-width: 991px) {
    .banner .left-column{width: 75vw;}
}

@media(max-width: 767px) {
    .banner .left-column{width: 75vw;}
    .banner .left-column .column-inner{padding: 15px 20px;}
    .left-column .column-inner .content .title,.left-column .column-inner .content p,.left-column .column-inner .content ul li{font-size: 16px;}
    .logo{max-width: 100px;}
}

@media(max-width: 480px) {
    .left-column .column-inner .content .title,.left-column .column-inner .content p,.left-column .column-inner .content ul li{font-size: 14px;}
}