@font-face {
    font-family: 'Poppins-medium';
    src: url('fonts/Poppins-Medium.woff2') format('woff2'),
           url('fonts/Poppins-Medium.woff') format('woff'),
           url('fonts/Poppins-Medium.ttf') format('truetype');
}

@font-face {
    font-family: 'Poppins-light';
    src: url('fonts/Poppins-Light.woff2') format('woff2'),
           url('fonts/Poppins-Light.woff') format('woff'),
           url('fonts/Poppins-Light.ttf') format('truetype');
}

@font-face {
    font-family: 'Cranberry-gin';
    src: url('fonts/CranberryGin-Regular.woff2') format('woff2'),
           url('fonts/CranberryGin-Regular.woff') format('woff'),
           url('fonts/CranberryGin-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-Regular.woff2') format('woff2'),
           url('fonts/Poppins-Regular.woff') format('woff'),
           url('fonts/Poppins-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Agrandir-Regular';
    src: url('fonts/Agrandir-Regular.woff2') format('woff2'),
           url('fonts/Agrandir-Regular.woff') format('woff'),
           url('fonts/Agrandir-Regular.ttf') format('truetype');
}

.font-poppins-medium {
    font-family: 'Poppins-medium', sans-serif!important;
}

.font-poppins-medium {
    font-family: 'Poppins-light', sans-serif!important;
}

.font-poppins-regulaar {
    font-family: 'Poppins', sans-serif!important;
}

.font-cranberry-gin {
    font-family: 'Cranberry-gin', sans-serif!important;
}

body.custom-template main h1 {
    font-size: 56px;
    line-height: 67px;
    letter-spacing: 3.7px;
}

body.custom-template main h2 {
    /*font-family: 'Poppins-medium';*/
    font-family: 'Agrandir-Regular';
    font-size: 42px;
    line-height: 49px;
    letter-spacing: 3px;
}

body.custom-template {
    font-family: 'Agrandir-Regular', sans-serif!important;
    font-size: 16px;
    line-height: 23px;
    letter-spacing: 1.8px;
    color: #211F43;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6,
p {
    color: #211F43;
}

.font-color-1 {
    color: #B16C52;
}

.bg-color-1 {
    background: #ECE7DE;
}

.text-transform--uppercase {
    text-transform: uppercase;
}

.border-link,
.contact-form input[type=submit],
body.template-color-1 .contact-form input[type=submit],
body.template-color-1 .contact-form textarea[type=submit] {
    display: inline-block;
    width: auto;
    height: auto;
    line-height: 1;
    border-radius: 0px;
    padding: 10px 20px 10px 20px;
    border: 2px solid #B16C52;
    text-transform: uppercase;
    font-family: 'Poppins-medium';
    color: #B16C52!important;
    background-color: transparent;
    font-size: 14px;
    letter-spacing: 2.6px;
    transition: all ease-in-out 0.26s;
    -webkit-transition: all ease-in-out 0.26s;
    -moz-transition: all ease-in-out 0.26s;
    -ms-transition: all ease-in-out 0.26s;
    -o-transition: all ease-in-out 0.26s;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -ms-border-radius: 0px;
    -o-border-radius: 0px;
}

.border-link:hover {
    color: #fff!important;
    background-color: #B16C52;
    transition: all ease-in-out 0.26s;
    -webkit-transition: all ease-in-out 0.26s;
    -moz-transition: all ease-in-out 0.26s;
    -ms-transition: all ease-in-out 0.26s;
    -o-transition: all ease-in-out 0.26s;
}

.arrow-link {}

.portfolio-type3-content .type-portfolio-wrapper-3 .type-portfolio3 h3 a {
    font-family: 'Poppins';
    font-weight: 400;
    font-size: 26px;
    letter-spacing: 1.83px;
}

.portfolio-type3-content .type-portfolio-wrapper-3 .type-portfolio3 h3 a.active span {
    font-size: 18px;
}

.portfolio-type3-content .type-portfolio-wrapper-3 .type-portfolio3 h3 a.active {
    color: #211F43;
}

.header__digital--broadcast .header-left .bk-menu li a,
.hire-on-top-button.arrow-btn span.button-text {
    font-family: 'Poppins';
    font-weight: 400;
    font-size: 14px;
    color: #211F43;
    text-transform: uppercase;
}

.hire-on-top-button span.button-text {
    font-family: 'Poppins-medium';
    font-weight: 500;
    font-size: 14px;
    color: #211f43;
}

.portfolio-type3-content .type-portfolio-wrapper-3 {
    justify-content: start;
}

.hire-on-top-button.arrow-btn span.button-text {
    font-weight: 400;
    font-size: 14px;
    font-family: 'Poppins-medium';
    color: #B16C52;
}

.brook-counter .content span {
    color: #B16C52;
}

.brook-counter .content h6 {
    font-weight: 300;
    letter-spacing: 1.14px;
    font-size: 16px;
}

.custom-gallery-item {
    position: relative;
    width: 100%;
    background-position: center;
    background-size: cover;
    display: block;
}

.slick-initialized .slick-slide {
    padding-left: 0px;
    padding-right: 20px;
}

.custom-gallery-item:after {
    content: "";
    display: block;
    padding-bottom: 100%;
}

.custom-gallery-item .port-overlay-info {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80%;
    height: 80%;
    background-color: transparent;
    display: flex;
    opacity: 0;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transition: all ease-in-out 0.26s;
    -webkit-transition: all ease-in-out 0.26s;
    -moz-transition: all ease-in-out 0.26s;
    -ms-transition: all ease-in-out 0.26s;
    -o-transition: all ease-in-out 0.26s;
}

.custom-gallery-item .port-overlay-info:hover {
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    opacity: 1;
    background-color: #b16b5263;
    transition: all ease-in-out 0.26s;
    -webkit-transition: all ease-in-out 0.26s;
    -moz-transition: all ease-in-out 0.26s;
    -ms-transition: all ease-in-out 0.26s;
    -o-transition: all ease-in-out 0.26s;
}

.custom-gallery-item .port-overlay-info .hover-action {
    margin: auto;
}

.custom-gallery-wrapper .vertical-column {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
}

.top-section {
    margin-bottom: -140px;
}

.offset-image-wrapper {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.offset-image {
    display: inline-block;
    width: 57vw!important;
    max-width: 2000px;
    margin-left: calc(-100vw / 2 + 53vw / 2 + 2rem);
    align-self: flex-end;
}

.offset-image-after {
    align-self: baseline;
}

.map {
    height: 300px;
}


/* your custom CSS \*/

@-moz-keyframes pulsate {
    from {
        -moz-transform: scale(0.25);
        opacity: 1.0;
    }
    95% {
        -moz-transform: scale(1.3);
        opacity: 0;
    }
    to {
        -moz-transform: scale(0.3);
        opacity: 0;
    }
}

@-webkit-keyframes pulsate {
    from {
        -webkit-transform: scale(0.25);
        opacity: 1.0;
    }
    95% {
        -webkit-transform: scale(1.3);
        opacity: 0;
    }
    to {
        -webkit-transform: scale(0.3);
        opacity: 0;
    }
}


/* get the container that's just outside the marker image, 
    which just happens to have our Marker title in it */

#map_canvas div[title="I might be here"] {
    -moz-animation: pulsate 1.5s ease-in-out infinite;
    -webkit-animation: pulsate 1.5s ease-in-out infinite;
    border: 1px solid #B16C52;
    background: #B16C52;
    /*makeacircle*/
    -moz-border-radius: 81px;
    -webkit-border-radius: 81px;
    border-radius: 81px;
    /*multiplytheshadows,insideandoutsidethecircle*/
    -moz-box-shadow: 0px 0px 0px 15px #b16b52bb, 0px 0px 0px 50px #b16b5262;
    -webkit-box-shadow: 0px 0px 0px 15px #b16b52bb, 0px 0px 0px 50px #b16b5262;
    box-shadow: 0px 0px 0px 15px #b16b52bb, 0px 0px 0px 50px #b16b5262;
    /*setthering'snewdimensionandre-centerit*/
    height: 81px!important;
    margin: -31px 0 0 -31px;
    width: 81px!important;
    -moz-border-radius: 81px;
    -ms-border-radius: 81px;
    -o-border-radius: 81px;
}


/* hide the superfluous marker image since it would expand and shrink with its containing element */


/*	#map_canvas div[style*="987654"][title] img {*/

#map_canvas div[title="I might be here"] img {
    display: none;
}


/* compensate for iPhone and Android devices with high DPI, add iPad media query */

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (device-width: 768px) {
    #map_canvas div.gmnoprint[title="I might be here"] {
        margin: -10px 0 0 -10px;
    }
}

footer {
    background-color: #b16c52;
}

footer h3 {
    color: #ffffff;
    font-family: 'Agrandir-Regular';
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 3px;
    text-transform: uppercase;
}

footer p {
    color: #ffffff;
    font-family: 'Poppins';
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 1.08px;
}

footer .promoter-logo {
    width: 114px;
    height: 114px;
}

footer .footer-logo {
    width: 148px;
    height: 210px;
}

.popup-mobile-click {
        width: 35px;
        padding: 0px 0px;
    }

@media only screen and (max-width: 767px) {
    .portfolio-type3-container {
        padding-left: 30px;
        padding-right: 30px;
    }
    .custom-gallery-item {
        margin-bottom: 20px;
    }
    .popup-mobile-click {
        width: 35px;
    }
}

@media only screen and (min-width: 768px) {
    .popup-mobile-click {
        width: 50px;
    }
}

.popup-mobile-manu .inner {
    background: #fff;
}

.object-custom-menu>li a span {
    color: #211F43;
    font-family: 'Poppins';
    font-weight: 400;
}

.object-custom-menu>li.has-mega-menu>a::after {
    content: none;
}

html {
    scroll-behavior: smooth;
}

.popup-mobile-manu .inner .mobileheader .logo a img {
    width: 70px;
}


.lg-backdrop {
    background-color: rgba(177, 108, 82, 0.7);
}

#scrollUp {
    color: #b16c52;
}

.credits-button {
    color: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    font-size: 12px;
    line-height:17px;
}

.contact-form input[type=checkbox] {
    margin-top: 3px;
}

@media only screen and (max-width: 758px) {
    .slick-slider .slick-list {
        overflow: visible;
    }
    .slick-slide .thumb {
        opacity: 0;
        transition: all ease-in-out 0.26s;
        -webkit-transition: all ease-in-out 0.26s;
        -moz-transition: all ease-in-out 0.26s;
        -ms-transition: all ease-in-out 0.26s;
        -o-transition: all ease-in-out 0.26s;
    }
    .slick-slide.slick-current.slick-active .thumb {
        opacity: 1;
        margin-top: 0;
    }
    .slick-slide.slick-current.slick-active+.slick-slide .thumb {
        opacity: 0.5;
        margin-top: -20px;
    }
    body.custom-template main h1 {
        font-size: 46px;
        line-height: 47px;
        letter-spacing: 2.7px;
    }
    body.custom-template main h2 {
        font-family: 'Agrandir-Regular';
        font-size: 42px;
        line-height: 39px;
        letter-spacing: 2px;
    }
}

.contact-form input,
.contact-form textarea {
    color: #211F43;
    border-color: transparent;
    background-color: #fff;
    width: 100%;
    outline: 0;
    border: none;
    border-radius: 0;
    padding: 3px 20px;
    height: 62px;
    border-bottom: 1px solid #211F43;
    font-family: 'Poppins';
}

.modal.show .modal-dialog {
    -webkit-transform: translate(0, 0);
    transform: translate(0, -50%);
    top: 50%;
}

.modal.show .modal-dialog .modal-content {
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
}

.contact-form input[type=submit]:hover,
body.template-color-1 .contact-form input[type=submit]:hover,
body.template-color-1 .contact-form textarea[type=submit]:hover {
    transform: none;
    background-color: #B16C52!important;
    -webkit-transform: none;
    -moz-transform: none;
    -ms-transform: none;
    -o-transform: none;
    color: #fff!important;
    text-decoration: none;
}

.modal-header {
    border-bottom: none;
}

.contact-form input:focus {
    border: 1px solid #211F43;
    color: #211F43;
}

.contact-form textarea:focus {
    border: 1px solid #211F43;
    color: #211F43;
}

body.template-color-1 .contact-form input:focus,
body.template-color-1 .contact-form textarea:focus {
    border: none;
    border-bottom: 1px solid #211F43;
    color: #211F43;
}

.contact-form textarea {
    color: #211F43;
    border-color: #eee;
    background-color: #fff;
    height: 150px;
    width: 100%;
    outline: 0;
    border: none;
    border-radius: 0;
    border-bottom: 1px solid #211F43;
    padding: 12px 20px 3px;
    max-width: 100%;
    -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
    -o-transition: all .3s cubic-bezier(.645, .045, .355, 1);
    transition: all .3s cubic-bezier(.645, .045, .355, 1);
}

footer a,
footer a:hover,
footer a:visited,
footer a:focus,
a:active {
    color: white;
}

#creditsmodal a,
#creditsmodal a:hover,
#creditsmodal a:focus {
    color: #211F43;
}