/*
Theme Name: TwentySeventeen Child
Template: twentyseventeen
*/

/*Custom header*/
#page
{
    top: 120px;
}

.button-cta
{
    background-color: #793a42;
    border: none;
    color: #fff;
    text-align: center;
    font-weight: 700;
    text-transform: capitalize;
    margin-top: 50px;
}

.button-cta:hover
{
    background-color: #af5561;
}

/* Reservation form */
#wpcf7-f1717-o1 > form,
#wpcf7-f1824-o1 > form {
    display: flex;
    padding: 2rem;
    gap: 2rem;
    flex-wrap: wrap;
}

div#reservation-form-fields {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

div#reservation-form-fields > div {
    display: flex;
    justify-content: space-between;
}

#reservation-form-fields ~ p {
    display: flex;
}

@media screen and (max-width: 767px)
{
    #reservation-form-fields ~ p {
        width: 100vw;
    } 
}

.reservation-form-field
{
    width: 100%;
}

#reservation-form-fields ~ p
{
    margin: 0;
    display: flex;
    flex-direction: row-reverse;
}

@media screen and (min-width: 768px)
{
    div#reservation-form-fields > div {
        gap: 2rem;
    }
}

@media screen and (max-width: 767px)
{
    #wpcf7-f1717-o1 > form,
    #wpcf7-f1824-o1 > form,
    div#reservation-form-fields > div
    {
        flex-direction: column;
    }    
}

.wpcf7-response-output {
    flex-grow: 1;
}

input.wpcf7-form-control.wpcf7-submit {
    margin: 24px 0 8px 0;
}

/* RoomRaccoon reservation form */
.roomraccoon-search {
    margin: 2rem auto;
    display: flex;
    justify-content: center;
    padding: 0 1rem;
}

.roomraccoon-search__form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    justify-content: center;
    align-items: stretch;
    max-width: 480px;
    width: 100%;
}

.roomraccoon-search__label {
    display: flex;
    flex-direction: column;
    width: 100%;
    font-weight: 600;
}

.roomraccoon-search__label > input {
    margin-top: 0.25rem;
    padding: 0.75rem;
}

.roomraccoon-search__actions {
    display: flex;
    justify-content: center;
    width: 100%;
}

.roomraccoon-search__submit {
    padding: 0.75rem 2rem;
    width: 100%;
}

@media (min-width: 768px) {
    .roomraccoon-search__form {
        max-width: 640px;
    }
}

@media (min-width: 1200px) {
    .roomraccoon-search__form {
        flex-direction: row;
        gap: 1.5rem;
        max-width: 900px;
        align-items: flex-end;
        justify-content: center;
    }

    .roomraccoon-search__label {
        width: auto;
        flex: 0 0 260px;
    }

    .roomraccoon-search__actions {
        width: auto;
        justify-content: flex-start;
        align-self: flex-end;
    }

    .roomraccoon-search__submit {
        width: auto;
        margin-bottom: 0.6rem;
    }
}

/*OUR OFFER AREA*/
.our-offer-title
{
    text-align: center;
    background-color: #793a42;
}

.our-offer-title > h2
{
    margin-bottom: 0;
    color: #fff;

}
.our-offer 
{
    display: flex;
    flex-direction: row;
  flex-wrap: wrap;
}

.our-offer-content 
{
    width: 50%;
    position: relative;
    line-height: 0;
    background-color: black;
}

.our-offer-content img
{
    width:100%;
   height:100%;
   object-fit: cover;
   overflow: hidden;
}

.our-offer-content:hover img
{
    opacity: 0.5;
    transition: 0.5s ease;
}

.our-offer-content:hover .offer-details 
{
    opacity: 1;
    transition: 0.5s ease;
}

.offer-details 
{
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
}

.offer-details > h2
{
    color: white;
}

.button-offer
{
    background-color: #793a42;
    border: none;
    color: #fff;
    text-align: center;
    font-weight: 700;
    text-transform: capitalize;
    font-size: 1rem;
    line-height: 1.5;
    padding: 1em 2em;
}

.rs-layer h1
{
    font-family: 'Raleway';
	color: white;
}

.rs-layer h2
{
    font-style:italic;
    font-family: 'Raleway';
	color: white;
}

.rs-layer h3
{
  font-style:italic;
  font-family: 'Raleway';
	color: white;
}

/*Definitions to the div (/template-parts/content-page.php)
that contains Booking Rating Script (in "Quinta da Pousada" page)*/
.rating
{
    position: fixed;
    bottom: 0%;
    left: 2vw;
}

.reservation-alert
{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    background: #793a42;
    height: 70px;
    border-top-left-radius: 110px;
    border-top-right-radius: 110px;
    width: 150px;
    position: fixed;
    bottom: 0%;
    right:2vw; 
    box-shadow: black 0px 2px 10px;
    animation: shake-animation 4.72s ease infinite;
    transform-origin: 50% 50%;
}

@keyframes shake-animation 
{
0% { transform:translate(0,0) }
1.78571% { transform:translate(10px,10px) }
3.57143% { transform:translate(0,0) }
5.35714% { transform:translate(10px,10px) }
7.14286% { transform:translate(0,0) }
8.92857% { transform:translate(10px,10px) }
10.71429% { transform:translate(0,0) }
100% { transform:translate(0,0) }
}
.reservation-alert a
{
color: #fff;
font-weight: 600;
display: flex;
flex-direction: column;
align-items: center;
} 
   
.widget_eu_cookie_law_widget 
{
padding-bottom: 0 !important;
}
.reservation-alert:hover
{
    background: #b15561;
    width: 180px;
    height: 90px;
    transition: 0.1s ease;

}

/* Footer */
/* With image */
.newsletter-input
{
    width: 50% !important;

}

.newsletter-button
{
    background-color: #793a42 !important;
    box-shadow: black 2px 2px 9px !important;
}

.newsletter-button:hover
{
    background-color: #af5561 !important;
}

#colophon
{
    background-color: #793a42;
    color: white;
    background-image: url('/wp-content/uploads/2018/06/footer-overlay.jpg');
    background-repeat: no-repeat;
    background-size: cover;
}

#colophon h2,
#colophon a{
    color:white;
    -webkit-box-shadow: inset 0 -1px 0 white;
    box-shadow: inset 0 -1px 0 white;
}

#colophon h3
{
    color:white;
}

.social-navigation a
{
    background-color: white !important;
    color: #793a42 !important;

    width: 40px !important;
    height: 40px !important;
    line-height: 0 !important;
}

.social-link-icon
{
    line-height: 40px !important;
}

.site-info
{
    width: 100%;
}

#custom-credit
{
    float: left;
}

#turismo-portugal-img, #turismo-portugal-anchor
{
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    max-width: 80%;
}

/* */

/* Top menu */
#language-selector
{
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.5rem;
    padding: 0 2rem;
}

.navigation-top {
    background-color: transparent;
    border: none;
    width: 100%;
    height: 120px;
    top: 0;
    font-size: 130%;
    bottom: auto;
    position: fixed !important;
    left: 0;
    right: 0;
    z-index: 7;
    border-bottom: 1px solid #793a42 !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.admin-bar .navigation-top
{
    top: 32px;
}

.menu-scroll-down .icon
{
    color: #793a42 !important;
}

#responsive-menu-button:hover
{
    transform: scale(1.2);
}

.custom-logo-link img {
    max-height: 100px !important;
}

.custom-logo-link:hover,
#language-selector a:hover
{
    transform: scale(1.01);
}

#language-selector a:hover
{
    color: gray;
}

#menu-container
{
    display: flex;
    align-items: center;
}

@media screen and (max-width: 767px)
{
    .language-code
    {
        display: none;
    }
}

@media screen and (min-width: 768px)
{
    .home #language-selector
    {
        min-width: 275px;
    }
}

#book-now-cta
{
    margin: 0;
}

#menu-container
{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 2rem;
    padding: 0 1rem;
}

#responsive-menu-container
{
    margin-top: 120px !important;
}
   
/* Entry title */
.page .panel-content .entry-title,
.entry-header .entry-title
{
	color: #793a42 !important;
}
/* */

/* Contact forms */
.input-text, input[type="email"], input[type="password"], input[type="search"], input[type="text"], input[type="url"], textarea
{
    /* Solve problems with responsiveness */
    max-width: 100%; 
}

#contact-form 
{
    width:55%;
    float: left;
}

#contact-info
{
    width:40%;
    float: right;
}

.clearfix{
    clear:both
}

#contact-info iframe
{
    margin-top: 2vh;
    height: 300px;
}
/* */

/* Houses */
.gallery-caption, .gallery-icon, .wp-caption-text
{
    text-align: center !important;
}

.house-image:hover img
{
    filter: opacity(75%);
    -webkit-filter: opacity(75%);
}

@media screen and (min-width: 48em)
{
    .page.page-one-column .entry-header, .twentyseventeen-front-page.page-one-column .entry-header, .archive.page-one-column:not(.has-sidebar) .page-header {
        margin-bottom: 0 !important;
    }
}

/* */

/* Maps */
.house-map
{
    width: 100%;
    height: 25vw;
    min-height: 250px;
    max-height: 1000px;
    border: none;
}
/**/

/* Icon font */
@font-face {
    font-family: 'icomoon';
    src:  url('fonts/icomoon.eot?pcus4a');
    src:  url('fonts/icomoon.eot?pcus4a#iefix') format('embedded-opentype'),
      url('fonts/icomoon.ttf?pcus4a') format('truetype'),
      url('fonts/icomoon.woff?pcus4a') format('woff'),
      url('fonts/icomoon.svg?pcus4a#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
  }
  
  [class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
  
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
  
  .icon-instagram:before {
    content: "\e904";
  }
  .icon-airbnb:before {
    content: "\e900";
  }
  .icon-booking:before {
    content: "\e901";
  }
  .icon-email:before {
    content: "\e902";
  }
  .icon-facebook:before {
    content: "\e903";
  }
  
  /* */

  svg.icon:nth-child(1)
{
	display: none;
}

/* Social menu */
/* Big screens */
body.home .wpfm-floating-wh-wrapper
{
	margin-left: 10px;
}

body.home .social-navigation
{
	display: none;
}

body.home .social-navigation + .site-info
{
	margin-left: 0 !important;
}

.widget_text ul{
    margin: 0 !important;
}

.social-navigation
{
    width: auto !important;
}

/**/

/* Device dependent conditions */
@media screen and (max-width: 767px)
{

    /*MOBILE DEFINITOSN*/
    .pre-reservation-alert
    {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: center;
    }
    .reservation-alert
    {
        right: unset;    
    }

    .our-offer-content 
    {
        width: 100%;
    }

    .button-cta {
        width: unset;
        height: unset;
        background-color: #af5561;
    }

    .full-width .super-hero-image img {
        width: unset;
    }
    /* Contact forms */
    #contact-info, #contact-form
    {
        position:relative;
        width:100%;
    }

    /* Footer */
    #custom-credit
    {
        width: 100%;
    }
}
@media screen and (max-width: 1100px) 
{
	body.home .wpfm-floating-wh-wrapper
	{
		display: none;
	}
	
	body.home .social-navigation
	{
        display: block;
        width: 100% !important;
    }
    
    body.home #menu-social-links-menu
    {
        margin: 0;
    }
	
	body.home .social-navigation + .site-info
	{
		margin-left: 6%;
    }
    
    /*This is the breakpoint where the menu doesn't fit the top menu container*/
    .wrap-big
    {
        padding: 0.75em 1.5em !important;
    }

    .single-featured-image-header /*Featured image*/
    {
        border-bottom: 0 !important;
    }
}

@media screen and (max-width: 400px)
{
    .super-hero-caption.caption-1
    {
        font-size: 13px;
    }  
} 

@media screen and (max-width: 375px)
{
    /*Hide slogan in very small devices */
    #separator
    {
        display: none;
    }

    #navigation-text-block
    {
        display: none;
    }
}
/**/

/*Featured image slider */
.super-hero-caption-wrapper
{
	width: 100% !important;
	max-width: 100% !important;
	background-color: #793a42;
	top: 0 !important;
	transform: none;
	margin: 10px 0;
}

.super-hero-caption
{
	color: white;
	font-family: 'Raleway';
	font-size: 1.5em;
	text-align: center;
}

.super-hero-slider
{
    max-height: calc(100vh - 145px);
}

/**/

/*House social links*/

#page-title-h3
{
    font-size: .875rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-family: 'Raleway';
    font-style: normal;
    margin-bottom: 4em;
    color: #793a42 !important;
}

#promo-video{
    width: 100%;
    height: calc(100vw*5/12);
}


#house-social-links-menu .menu-social-links-menu-container a
{
	color: white !important;
	background-color: #793a42 !important;
	-webkit-box-shadow: none !important;
	box-shadow: none !important;
}
/**/