/*  ==========================================================================
    extra small devices (portrait phones, less than 576px)
    no media query since this is the default in Bootstrap
    ========================================================================== */

/*  ==========================================================================
    small devices (landscape phones, 576px and up)
    ========================================================================== */

@media (min-width: 576px) {

/*  ==========================================================================
    header
    ========================================================================== */
/*  header > header-nav
    ========================================================================== */
    .header .header-nav { padding: 0; }
    .header .header-nav ul > li { line-height: 30px; }
    .header .header-nav ul > li > a {
		min-width: 70px;
        padding: 20px 20px;
    }


/*  ==========================================================================
    navigation
    ========================================================================== */
    .navigation {
        padding-top: 95px;
        padding-bottom: 165px;
    }


/*  ==========================================================================
    filter-overlay
    ========================================================================== */
    .filter-overlay {
        padding-top: 95px;
        padding-bottom: 165px;
    }
    .filter-overlay .group legend { margin-top: 40px; }
    .filter-overlay .group .form-groups { display: block; }
    .filter-overlay .btn { margin-top: 70px; }


/*  ==========================================================================
    banner
    ========================================================================== */
/*  banner > caption
    ========================================================================== */
    .banner .caption { padding: 100px 0; }
    .banner .caption .container-fluid { padding: 0 10vw !important; }


/*  ==========================================================================
    section
    ========================================================================== */
/*  content
    ========================================================================== */
	.content.pt-large { padding-top: 100px; }


/*  ==========================================================================
    fixed-bar
    ========================================================================== */
	.fixed-bar .container-fluid {
		padding: 0 10vw;
    }

/*  fixed-bar > logo
    ========================================================================== */
    .fixed-bar .logo {
        right: 10vw;
        top: -42px;

        max-width: 320px;
        margin-right: 0;
		}


/*  ==========================================================================
    news
	========================================================================== */
	.news .card-columns {
		-webkit-column-count: 2;
				-moz-column-count: 2;
						column-count: 2;

		-webkit-column-gap: 15px;
				-moz-column-gap: 15px;
						column-gap: 15px;
	}
	.news .card { margin-bottom: 15px; }


/*  ==========================================================================
    accommodations
    ========================================================================== */
/*  acco > sub-nav
    ========================================================================== */
    .sub-nav ul > li { padding: 25px 20px; }

/*  acco > extra-info > gallery
    ========================================================================== */
	.acco-extra-info .gallery .col { display: block; }


/*  ==========================================================================
    search and book
	========================================================================== */
	.search-and-book .heading {
		flex-direction: row;
	}

	.search-and-book .heading .form-control {
		width: auto;
		margin-left: auto;
	}

}


/*  ==========================================================================
    medium devices (tablets, 768px and up)
    ========================================================================== */

@media (min-width: 768px) {

/*  ==========================================================================
    base
    ========================================================================== */
    .location_detail .content { padding-top: 150px; }

/*  headings & paragraph
    ========================================================================== */
	.content h1,
	.content h2 {
		font-size: 1.875rem; /* 30px */
	}

/*  links
    ========================================================================== */
    a[href^="tel:"] { pointer-events: none; }


/*  ==========================================================================
    header
    ========================================================================== */
    .header { position: fixed; }
	.header .container-fluid {
		max-width: 1700px;
        padding: 0 10vw;
        height: 0;
    }


/*  ==========================================================================
    navigation
    ========================================================================== */
    .navigation.overlay { padding-top: 25vh; }
    .navigation .container { padding: 0 25px; }
    .navigation .row { margin: 0 -25px; }
    .navigation .col { padding: 0 25px; }

/*  navigation > menu
    ========================================================================== */
    .navigation .nav ul > li { font-size: 2.25rem; /* 36px */ }

/*  navigation > extra-nav
    ========================================================================== */
    .navigation .extra-nav ul > li { font-size: 1.125rem; /* 18px */ }


/*  ==========================================================================
    filter-overlay
    ========================================================================== */
    .filter-overlay { padding-top: 10vh; }


/*  ==========================================================================
    banner
    ========================================================================== */
/*  banner > caption
    ========================================================================== */
	.banner .caption .title { font-size: 2.25rem; /* 36px */ }
	.banner .caption .subtitle { font-size: 1.5rem; /* 24px */ }
    .banner .caption p { font-size: 1.125rem; /* 18px */ }


/*  ==========================================================================
    news
		========================================================================== */
		.news .card-columns {
			-webkit-column-count: 3;
				 -moz-column-count: 3;
							column-count: 3;

			-webkit-column-gap: 30px;
				 -moz-column-gap: 30px;
							column-gap: 30px;
		}
		.news .card { margin-bottom: 30px; }


/*  ==========================================================================
    accommodations
    ========================================================================== */
/*  accommodations > heading
    ========================================================================== */
    .heading .title { font-size: 2.25rem; /* 36px */ }
    .heading .subtitle { font-size: 1.5rem; /* 24px */ }

/*  accommodations > banner
    ========================================================================== */
    .acco-banner .iframe-map {
        position: absolute;
        top: 75px;
        bottom: 45px;
        right: -115px;
        z-index: 25;

        margin-top: 0;
    }
    .acco-banner .iframe-map .icon { margin-right: 0; }
    .acco-banner .iframe-map .holder { max-width: 260px; }


/*  ==========================================================================
    location_detail
    ========================================================================== */
    .location_detail .iconlisting { display: block; }
    .location_detail .map_image {
		max-width: unset;
		margin: 0;
	}


/*  ==========================================================================
    fixed-bar
    ========================================================================== */
    .fixed-bar {
        padding: 15px 0;
        min-height: 30px;
    }
    .fixed-bar .buttons {
        margin: -42px -5px -5px;
        z-index: 10;
    }
    .fixed-bar .red-slant {
        bottom: 30px;
        pointer-events: none;
    }


}


/*  ==========================================================================
    large devices (desktops, 992px and up)
    ========================================================================== */

@media (min-width: 992px) {

/*  ==========================================================================
    base
    ========================================================================== */
    .location_detail .content { padding-top: 50px; }

/*  ==========================================================================
    navigation
    ========================================================================== */
    .navigation .container { padding: 0 50px; }
    .navigation .row { margin: 0 -50px; }
    .navigation .col { padding: 0 50px; }

    .search-and-book .gmaps iframe {
		position: fixed;
		width: 57.5%;
	}

	.filter { margin-right: 20%; }


/*  ==========================================================================
    banner
    ========================================================================== */
/*  banner > caption
    ========================================================================== */
	.banner .caption .title { font-size: 3.75rem; /* 60px */ }
    .banner .caption .subtitle { font-size: 1.875rem; /* 30px */ }


/*  ==========================================================================
    accommodations
    ========================================================================== */
/*  accommodations > heading
    ========================================================================== */
    .heading .container-fluid { padding: 0 calc(4.5rem - 15px) !important; }
    .heading .title { font-size: 3.75rem; /* 60px */ }

/*  accommodations > sub-nav
    ========================================================================== */
    .sub-nav .container-fluid { padding: 0 calc(4.5rem - 15px) !important; }

/*  accommodations > extra-info > gallery
    ========================================================================== */
    .acco-extra-info .gallery .container-fluid { padding: 0 calc(4.5rem - 15px) !important; }

/*  accommodations > overview
	========================================================================== */
	.acco-overview h2,
    .acco-overview h3 {
        font-size: 1.875rem; /* 30px */
        margin-top: 2.5rem;
    }

/*  accommodations > extra-info > information
    ========================================================================== */
    .acco-extra-info .information .title { padding: 0 calc(3rem - 15px); }
    .acco-extra-info .information .title h2 { font-size: 1.875rem; /* 30px */ }


/*  ==========================================================================
    footer-top
    ========================================================================== */
    .footer-top h2 { font-size: 1.875rem; /* 30px */ }
    .footer-top h3 { font-size: 1.25rem; /* 20px */ }
    .footer-top.font-size-large h3 { font-size: 1.875rem; /* 30px */ }

    .footer-top .container-fluid > .title { padding: 0 calc(3rem - 15px); }

}


/*  ==========================================================================
    extra large devices (large desktops, 1200px and up)
    ========================================================================== */

@media (min-width: 1200px) {

/*  ==========================================================================
    base
    ========================================================================== */

/*  container
    ========================================================================== */
    .container { padding: 0; }

/*  search and book
    ========================================================================== */

    .search-and-book .gmaps {
		position: sticky;
        width: 100%;
        top: 90px;
	}


/*  ==========================================================================
    navigation
    ========================================================================== */
    .navigation .container { padding: 0 120px; }
    .navigation .row { margin: 0 -120px; }
    .navigation .col { padding: 0 120px; }


/*  ==========================================================================
    section
    ========================================================================== */
/*  content
    ========================================================================== */
	.content.pt-large { padding-top: 100px; }
    .content.pb-large { padding-bottom: 100px; }
    
    .acco-banner .iframe-map {
        position: relative;
        top: inherit;
        bottom: inherit;
        right: inherit;
        flex-direction: column;
        height: 100%;
    }

/*  acco banner
    ========================================================================== */
    .acco-banner .iframe-map .icon { margin-right: 0; }
    .acco-banner .iframe-map .holder { max-width: 260px; }
    .acco-banner .iconlisting { display: flex; } 
    .acco-banner .iconlisting img { max-width: 55px; margin-right: 15px; } 

    .acco-banner .holder .map_image {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        overflow: hidden;
    }

}