/*
Theme Name: Men's Concept
Theme URI: https://mensconcept.it
Author: Tom Szczygiel
Description: Ad-hoc WordPress' theme made by Tom Szczygiel
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/*
Headings: font-family: 'Bebas Neue', cursive;
Paragraphs: font-family: 'Roboto', sans-serif;
*/
body, p {
    font-family: 'Roboto', sans-serif !important;
}

iframe div#wrapper {
    width: 100%;
    height: 100%;
    margin: 0;
    font-family: 'Roboto', sans-serif;
    background: #212121;
}
iframe span#titolo {
    background-color: #EBCB82;
    font-size: 24px
    color: #212121;
}
iframe #login p a {
    color: #EBCB82;
}
iframe #login button {
    color: #EBCB82;
    border: 1px #EBCB82 solid;
}
}

.bookly-form input[type="text"], .bookly-form input[type="number"], .bookly-form input[type="password"], .bookly-form select, .bookly-form textarea {
    color: #212121 !important;
}
.navbar-light .navbar-toggler {
    border-color: transparent !important;
    outline: 0;
}
button.navbar-toggler {
    font-size: 35px;
    padding: 15px 0;
    outline: none;
    border: none;
}
.navbar.navbar-expand-md.navbar-light.bg-light.menu-open {
  background-color: #212121 !important;
  width: 100%;
}
.navbar.navbar-expand-md.navbar-light.bg-light.menu-open .navbar-nav {
  height: 84vh !important;
}
.animated-icon11 {
  width: 30px;
  height: 20px
  position: relative;
  margin: 0px;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer
}

.animated-icon11 span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out
}

.animated-icon11 span {
  background: #FFF;
}

.animated-icon11 span:nth-child(1) {
  top: 0px;
  height: 2px
}

.animated-icon11 span:nth-child(2) {
  top: 10px;
  height: 2px
}

.animated-icon11 span:nth-child(3) {
  top: 20px;
  height: 2px
}

.animated-icon11.open span:nth-child(1) {
  background: #FFFFFF;
  top: 6px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg)
}

.animated-icon11.open span:nth-child(2) {
  background: #FFFFFF;
  opacity: 0;
  left: -60px
}

.animated-icon11.open span:nth-child(3) {
  background: #FFFFFF;
  top: 6px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg)
}

html {
  scroll-behavior: smooth;
}
body, html {
    height: 100%;
}
@media (max-width: 575.98px) {
  header.home-hero video {
    display: none;
  }
}
@media (pointer: coarse) and (hover: none) {
  header {
    background: url('assets/images/mobile-hero2.png') no-repeat bottom right scroll;
  }
}
.navbar.navbar-expand-md.navbar-light.bg-light {
    background-color: transparent !important;
    background: transparent !important;
    z-index: 10;
}
/*================================================================
 # HEADER
 ==================================================================*/
header.home-hero {
  position: relative;
  height: 89vh;
  min-height: 25rem;
  width: 100%;
  overflow: hidden;
  top: -56px;
}
header.home-hero-easy {
  position: relative;
  min-height: 12rem;
  width: 100%;
  overflow: hidden;
  top: -56px;
}
header.home-hero .container {
  position: relative;
  z-index: 2;
  height: 100%;
}
.text-container {
  background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5));
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 100%;
  width: 100%;
}
.booking-methods.text-container {
  background: none !important;
  position: unset;
  top: unset;
  left: unset;
  transform: unset;
  height: 350px;
  width: unset;
}
.booking-methods.text-container a {
  text-decoration: none !important;
}
.text-container h1 {
  color: #FFF;
  font-family: 'Roboto', sans-serif;
  font-size: 24px;
}
.text-container p {
  color: #FFF;
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  display: none;
}
.text-container a.btn {
  margin: 0 auto;
  color: #EBCB82;
  font-family: 'Roboto', sans-serif;
  border: 1px solid #EBCB82;
  text-transform: uppercase;
  font-size: 20px;
  letter-spacing: 2px;
  padding: 8px 16px;
}
.text-container a.btn:hover {
  background-color: #EBCB82;
  color: #FFF;
}
.btn {
  width: 300px;
  border-radius: 0;
  font-weight: 400;
}
header.home-hero video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: 0;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

header.home-hero img.poster {
  height: 100vh;
  min-height: 100vh;
  object-fit: cover;
  object-position:center;
  position: absolute;
  top: 0;
  left: 0;
}

.navbar.navbar-expand-lg.navbar-light.bg-light {
    background: transparent !important;
    z-index: 10;
}
.navbar-light .navbar-nav .nav-link {
    color: #FFF !important;
    text-align: center;
    margin: 30px 0;
}
li.nav-item a.nav-link {
  color: #FFF;
  text-transform: uppercase;
  font-family: 'Roboto', sans-serif;
  margin: 0 30px;
}
.main-logo {
  width: 250px;
  text-align: center;
  margin: 0 auto;
}
.main-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
/*================================================================
 # CHI SIAMO
 ==================================================================*/
 .chi-siamo-section {
   padding: 30px 0;
 }
 .chi-siamo-text hr {
   width: 100px;
   margin-left: 0;
   background-color: #EBCB82;
   height: 2px;
   border: none;
 }
 .chi-siamo-text {
   font-family: 'Roboto', sans-serif;
   width: 100%;
   position: relative;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
 }
 .chi-siamo-text h2 {
  font-size: 24px;
  color: #212121;
  text-transform: uppercase;
 }
 .chi-siamo-text p {
   font-size: 18px;
   font-weight: 400;
   line-height: 27px;
   color: rgba(33,33,33,0.6);
 }
 .chi-simao-img {
   width: 100%;
   height: 100%;
   overflow: hidden;
   border: 8px solid #EBCB82;
 }
 .chi-simao-img img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   padding: 15px;
 }
 .dove-simao-img {
   width: 100%;
   height: 500px;
   overflow: hidden;
   border: 15px solid #FFF;
   outline: 8px solid #EBCB82;
 }
.dove-simao-img iframe {
   height: 520px;
 }
 .dove-simao-img .map-container {
   width: 96%;
   height: 96%;
   position: relative;
   top: 50%;
   left: 48%;
   transform: translate(-50%, -50%);
 }
 /*================================================================
  # SERVIZI
  ==================================================================*/
  .servizi-section {
    padding: 30px 0;
  }
  .servizi-text hr {
    width: 100px;
    background-color: #EBCB82;
    height: 2px;
    border: none !important;
  }
  .servizi-text h2 {
   font-size: 24px;
   color: #212121;
   text-transform: uppercase;
   text-align: center;
   margin: 0 auto;
  }
  .card.text-center.servizi-card {
    height: 300px;
    margin: 10px 0;
    border: none;
  }
  .servizi-card h3.card-title{
    font-family: 'Roboto', sans-serif;
    font-size: 20px;
    text-transform: uppercase;
  }
  .servizi-card .card-title{
    height: 60px;
  }
  .servizi-card .card-text {
    height: 130px;
  }
  .servizi-card .card-body p {
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 27px;
    color: rgba(33,33,33,0.6);
  }
  .servizi-card .card-footer {
    font-family: 'Roboto', sans-serif;
    font-size: 18px;
    font-weight: 400;
  }
  .alt-due .service-name {
    font-family: 'Roboto', sans-serif;
    font-size: 20px;
    text-transform: uppercase;
  }
  .alt-due  .service-price {
    font-family: 'Roboto', sans-serif;
    font-size: 18px;
    font-weight: 400;
  }
  .alt-due  .service-price p {
    position: absolute;
    bottom: 0;
    margin: 0;
    right: 15px;
  }
  /*================================================================
   # PRENOTA
   ==================================================================*/
   .prenota-section {
     padding: 30px 0 0;
     background-color: #212121;
   }
   .prenota-text hr {
     width: 100px;
     background-color: #EBCB82;
     height: 2px;
     border: none !important;
   }
   .prenota-text h2 {
    font-size: 24px;
    color: #FFF;
    text-transform: uppercase;
    text-align: center;
    margin: 0 auto;
   }
   .bookly-form {
    background-color: #FFF !important;
    margin: 30px 0 !important;
    padding: 30px 15px 5px !important;
    border-radius: 12px !important;
   }
   .prenota-text p {
     font-size: 18px;
     font-weight: 400;
     line-height: 27px;
     color: #FFF;
     text-align: center;
   }
   .prenota-text a {
     font-size: 18px;
     font-weight: 400;
     line-height: 27px;
     color: #EBCB82;
     text-align: center;
     text-decoration: none
   }
   .prenota-text a:hover {
     color: #EBCB82;
     text-decoration: underline;
   }
   .text-container-booking a.btn {
    margin: 0 auto;
    color: #EBCB82;
    font-family: 'Roboto', sans-serif;
    border: 1px solid #EBCB82;
    text-transform: uppercase;
    font-size: 20px;
    letter-spacing: 2px;
    padding: 8px 16px;
}
   /*================================================================
    # INFO
    ==================================================================*/
   .info-section {
     padding: 30px 0;
   }
   .info-text hr {
     width: 100px;
     background-color: #EBCB82;
     height: 2px;
     border: none !important;
   }
   .info-text h2 {
    font-size: 24px;
    color: #212121;
    text-transform: uppercase;
    text-align: center;
    margin: 0 auto;
   }
   .info-text h3 {
    font-size: 20px;
    color: #212121;
    text-transform: uppercase;
   }
   .info-text p {
     font-size: 18px;
     font-weight: 400;
     line-height: 27px;
     color: rgba(33,33,33,0.6);
   }
   /*================================================================
    # SOCIAL
    ==================================================================*/
   .social-section {
     padding: 30px 0;
     background-color: #EBCB82;
   }
   .social-text hr {
     width: 100px;
     background-color: #fff;
     height: 2px;
     border: none !important;
   }
   .social-text h2 {
    font-size: 24px;
    color: #212121;
    text-transform: uppercase;
    text-align: center;
    margin: 0 auto;
   }
    /* socila slider widget */
    ul.pllex-direction-nav {
      display: none !important;
    }
    .pllexislider .pllex-control-paging {
      display: none !important;
    }
    .instagram-feed--container {
      width: 100%;
      margin: 0 auto !important;
    }
    .pllexislider .slides {
      zoom: 1 !important;
      -ms-zoom: 1 !important;
      -webkit-zoom: 1 !important;
      -moz-transform:  scale(1) !important;
      height: auto;
    }
    .instagram-follow {
      margin: 30px auto 0;
      text-align: center;
      background-color: #212529;
      border-radius: 0.25rem;
    }
    .instagram-follow a.btn {
      margin: 0;
      font-family: 'Roboto', sans-serif;
      color: #FFF;
      font-size: 18px;
      padding: 8px 16px;
      text-decoration: none;
    }
    .MediaPopupBoxAlbum__nav-button {
      background: transparent !important;
    }

    @media screen and (min-width: 768px) {
      .instagram-feed--container {
        width: 100% !important;
        margin: 0 !important;
      }
      .pllexislider .slides {
        zoom: 0.5 !important;
        -ms-zoom: 0.5 !important;
        -webkit-zoom: 0.5 !important;
        -moz-transform:  scale(0.5,0.5) !important;
		-moz-transform-origin: left center !important;
        height: auto !important;
      }
      .pllexislider .pllex-control-paging {
        display: none !important;
      }
      .pllexislider, .pllexislider .slides li, .pllexislider .slides > li > div {
        margin: 0 20px;
      }
    }

    @media screen and (min-width: 992px) {
      .pllexislider .slides {
        zoom: 0.2 !important;
        -ms-zoom: 0.2 !important;
        -webkit-zoom: 0.2 !important;
        -moz-transform:  scale(0.2,0.2) !important;
        height: auto;
      }
		@-moz-document url-prefix() {
    		.pllexislider .slides {
				margin-top: -700px !important;
				margin-bottom: -700px !important;
			  }
		}
    }
    /*================================================================
     # FOOTER
     ==================================================================*/
     footer {
       background-color: #212121;
       padding: 30px 0 0;
       text-align: center;
     }
     .footer-brand .main-logo {
       width: 140px;
       text-align: center;
       margin: 0 auto;
     }
     .about-content, .about-content p > a {
       font-family: 'Roboto', sans-serif;
       color: #FFF;
       font-weight: 400;
       line-height: 27px;
       padding: 15px 0;
     }
     a[href^="tel"] {
        color: inherit;
        text-decoration: none;
      }
      a[x-apple-data-detectors] {
        color: inherit !important;
        text-decoration: none !important;
        font-size: inherit !important;
        font-family: inherit !important;
        font-weight: inherit !important;
        line-height: inherit !important;
      }
     .about-content h2 {
       font-size: 18px;
       font-weight: 400;
     }
     .about-content p {
       font-size: 16px;
     }
     .copyright-info {
       background-color: rgba(0,0,0,0.5);
       text-align: center;

     }
     .copyright-info p {
       font-family: 'Roboto', sans-serif;
       color: #FFF;
       font-size: 14px;
       padding: 15px 0 0;
     }
     .social-footer {
       padding-left: 0 !important;
     }
     .social-footer ul {
       list-style: none;
       padding-left: 0;
     }
     .social-footer ul li {
       font-family: 'Roboto', sans-serif;
       color: #FFF;
       font-size: 18px;
       margin-bottom: 5px;
     }
     .map-container {
      width: 350px;
      height: 350px;
      margin: 0 auto;
    }
    .mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate,.mapboxgl-canvas {
      position: relative !important;
      height: 350px;
    }
    #map .marker{
      height: 80px;
      width: 80px;
      margin-top: -25px;
      background-image: url('assets/images/map-icon.png');
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
    }
    /*================================================================
     # PRIVACY
     ==================================================================*/
    .privacy-policy-text {
      padding: 30px 0;
      font-family: 'Roboto', sans-serif;
      line-height: 27px;
    }
    .privacy-policy-text h2 {
      font-size: 20px;
      color: #212121;
      text-transform: uppercase;
      text-align: left;
      margin-left: 0;
      margin-bottom: 15px;
    }
    .privacy-policy-text p,
	.privacy-policy-text ul li {
      font-size: 16px;
      font-weight: 400;
      line-height: 24px;
      color: rgba(33,33,33,0.6);
    }
@media screen and (min-width: 768px) {
  /*================================================================
   # HEADER
   ==================================================================*/
  .text-container h1 {
    font-size: 28px;
  }
  .text-container p {
    display: block;
  }
  @media (max-width: 575.98px) {
    header.home-hero video {
      display: none;
    }
  }
  @media (pointer: coarse) and (hover: none) {
    header {
      background: url('assets/images/mobile-hero2.png') no-repeat bottom right scroll;
    }
  }
  .navbar.navbar-expand-md.navbar-light.bg-light {
      background-color: transparent !important;
      z-index: 10 !important;
  }
  .navbar-light .navbar-nav .nav-link {
      margin: unset;
  }
  .navbar-expand-md .navbar-nav .nav-link {
      padding-left: 1.5rem !important;
      padding-right: 1.5rem !important;
  }
  .main-logo {
    width: 300px;
  }
  .dove-simao-img {
    height: 500px;
  }
  /*================================================================
   # FOOTER
   ==================================================================*/
   footer {
     text-align: left;
   }
   .footer-brand .main-logo {
     margin: 0;
   }
}

@media screen and (min-width: 992px) {
  /*================================================================
   # HEADER
   ==================================================================*/
  .text-container h1 {
    /* color: #FFF; */
    /* font-family: 'Roboto', sans-serif; */
    font-size: 44px;
  }
  .dove-simao-img {
    height: 600px;
  }
  .dove-simao-img iframe {
   height: 620px;
  }
  /* .text-container p {
    color: #FFF;
    font-family: 'Roboto', sans-serif;
  } */
  /* .text-container a.btn {
    margin: 0 auto;
    color: #EBCB82;
    font-family: 'Roboto', sans-serif;
    border: 1px solid #EBCB82;
    text-transform: uppercase;
    font-size: 20px;
    letter-spacing: 2px;
    padding: 8px 16px;
  } */
  /* .text-container a.btn:hover {
    background-color: #EBCB82;
    color: #FFF;
  } */
  /* .btn {
    width: 300px;
    border-radius: 0;
    font-weight: 400;
  } */
  /* header.home-hero video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: 0;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
  } */
  /* @media (max-width: 575.98px) {
    header.home-hero video {
      display: none;
    }
  } */
  /* header.home-hero img.poster {
    height: 100vh;
    min-height: 100vh;
    object-fit: cover;
    object-position:center;
    position: absolute;
    top: 0;
    left: 0;
  } */
  /* @media (pointer: coarse) and (hover: none) {
    header {
      background: url('assets/images/mobile-hero2.png') no-repeat bottom right scroll;
    }
  } */
  /* .navbar.navbar-expand-lg.navbar-light.bg-light {
      background: transparent !important;
      z-index: 10;
  } */
  /* .navbar-light .navbar-nav .nav-link {
      color: #FFF !important;
  } */
  /* li.nav-item a.nav-link {
    color: #FFF;
    text-transform: uppercase;
    font-family: 'Roboto', sans-serif;
    margin: 0 30px;
  } */
  /* .main-logo {
    width: 300px;
    margin: 0 auto;
  } */
  /* .main-logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  } */
}

/* Brand logo section */
.brand-logo-container .row {
	justify-content: center;
 } 

.card.text-center.servizi-card.brand.cards .card-body {
	width: 280px;
	height: 280px;
	overflow: hidden;
 }
.card.text-center.servizi-card.brand.cards .card img {
	width: 100%;
	height: 100%;
	object-fit: contain;
 }
@media screen and (min-width: 992px) { 
	.card.text-center.servizi-card.brand.cards .card-body {
		width: 150px;
		height: 150px;
	 }
}
