/*
Theme Name:         EXCA
Description:        Adaptations RESPONSIVE pour le site d'EXCA
Version:            1.0
Author:             WE JUNE Agency
Author URI:         https://www.we-june.com
*/


/*
- - - - - - - - - - -
   WE JUNE Agency : RESPONSIVE
- - - - - - - - - -
*/

.project-details-title-info {
  width: 100%;
}

.carousel-fade .carousel-control:hover {
  text-decoration: none !important;
}

@media screen and (max-width: 1024px) {

  /* GENERAL */
  .site-holder,
  .container-fluid {
    max-width: 90% !important;
    min-width: 90% !important;
  }

  #header #navigation {
    right: initial !important;
  }

  #main {
    min-width: 100% !important;
  }

  .inner-side-menu ul.parent li:first-child {
    width: 100% !important;
  }

  .inner-side-menu ul.parent li {
    width: 100% !important;
  }
}

@media screen and (max-width: 990px) {

  /* GENERAL */
  .site-holder,
  .container-fluid {
    max-width: 100% !important;
    min-width: 100% !important;
  }

  .inner-side-menu ul.parent li:first-child {
    width: 107.5% !important;
  }

  .carousel-arrows {
    display: none;
  }

  /* HEADER */
  #header {
    padding: 15px 10px !important;
  }

  /* NAV */
  .navbar-toggler {
    position: absolute;
    right: 5%;
    background: #444349 !important;
    color: #fff !important;
    padding: 5px !important;
  }
  .navbar-toggler span.navbar-toggler-icon {
    background-image : url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
  }

  #header #navigation {
    background: #444349;
    height: auto;
    width: 90%;
    left: 5%;
    right: 5% !important;
    z-index: 99 !important;
  }

  #header #navigation ul,
  #secondary-nav {
    position: relative;
    margin: 0 auto !important;
    width: 90%;
    display: block !important;
  }

  #header #navigation ul li {
    display: block !important;
    padding: 10px;
    margin: 10px 0 !important;
    background: none !important;
    width: 100% !important;
  }

  #header #navigation ul li::before,
  #navigation ul li ul.sub-menu li:after {
    content: none !important;
  }

  #secondary-nav {
    border-top: 1px solid #e9342e;
  }

  #header #navigation ul li>a {
    background: none !important;
    text-shadow: none !important;
    color: #fff !important;
    text-align: left !important;
  }

  #header #navigation ul li:hover>a {
    color: #e9342e !important;
  }

  #header #navigation ul.sub-menu {
    height: 0px;
    padding: 0 !important;
    display: none !important;
    position: absolute !important;
  }

  #navigation ul li ul.sub-menu li {
    border-bottom: none !important;
  }

  #navigation ul.sub-menu li a {
    display: none !important;
  }

  /* CONTENT */
  .item .caption h3 {
    font-size: 16px !important;
  }

  .page-template h2 {
    text-align: center;
  }

  .page-template .more-downloads {
    position: relative !important;
    text-align: center !important;
    margin: 0 auto !important;
    left: 0px;
    right: 0px !important;
    top: -15px !important;
    width: 100% !important;
    display: block;
  }

  .header-img-container {
    max-height: 100% !important;
  }

  .header-img-container img {
    height: auto;
    max-height: initial !important;
  }

  .inner-menu-holder {
    position: relative !important;
    left: 0 !important;
    right: 0 !important;
    width: 100%;
  }

  .inner-menu-holder h1 {
    float: none !important;
    padding: 20px 0;
    font-weight: 600;
  }

  .inner-menu-holder .inner-menu {
    float: none !important;
    width: 100%;
    margin: 0 !important;
  }

  .inner-menu-holder .inner-menu li {
    width: 100% !important;
    display: block !important;
    text-align: center;
    border-bottom: 5px solid #fff;
    padding: 10px 0;
  }

  ul.inner-side-menu {
    margin: 0 0 75px !important;
  }

  ul.inner-side-menu li {
    margin: 0 auto;
    width: 100% !important;
  }

  .downloads-list li {
    height: 100% !important;
  }

  .downloads-list li .list-content {
    padding: 10px !important;
  }

  .downloads-list li .list-content p {
    font-size: 12px !important;
  }

  .downloads-list li .list-link a,
  .list-link a {
    position: relative !important;
    float: right;
    width: 100% !important;
    height: auto !important;
    padding: 10px 10px 5px !important;
    border-radius: 0% !important;
    left: 0;
    right: 0 !important;
    margin: 0;
  }

  .downloads-list li .list-link a.download::before,
  .downloads-list li .list-link a.link::before {
    float: left;
    margin-right: 5px;
  }

  .page-template .main-info {
    margin-bottom: 50px !important;
  }

  input[type="text"],
  input[type="email"],
  textarea {
    width: 70% !important;
  }

  ul.reference-projects li img {
    width: 100% !important;
    height: auto !important;
  }

  ul.reference-projects li .list-content {
    width: 100% !important;
    position: relative !important;
    height: 100% !important;
  }

  .inner-side-menu li a {
    background: #444349 !important;
    color: #fff !important;
  }
  .inner-side-menu li.active a {
    background: #e9342e !important;
  }

  /* MAP */
  .page-template-reference-project #map-wrapper {
    background: #ccc url('https://www.exca.eu/wp-content/uploads/2017/10/EXCA.jpg') no-repeat center center / cover !important;
    width: 100% !important;
    height: 250px !important;
  }
  .page-template-reference-project #map-wrapper #map-europe {
    display: none !important
  }
  .page-template-reference-project .inner-menu-holder {
    bottom: 0px !important;
  }

  /* FOOTER */
  #footer {
    height: auto !important;
    padding: 15px 0 !important;
  }

  #footer ul li,
  #footer .footer-links li a,
  #footer .footer-info li a {
    line-height: 20px !important;
    text-align: center !important;
  }

  #footer ul,
  #footer li {
    margin: 0 auto !important;
    float: none !important;
    width: 100% !important;
  }

  #footer li a {
    width: 100% !important;
  }

  #footer li a:before,
  .inner-menu-holder .inner-menu li::after,
  h1::before {
    content: "" !important;
    border: none !important;
  }

  #footer img {
    margin: 30px auto !important;
  }

  /* PROJECTS */
  .metabox-holder .metabox-wrapper .country-logo {
    top: 0px !important;
  }

  .project-details-images-holder img {
    width: 100% !important;
    height: auto !important;
  }
  .page-template-expanded-clay.page-id-98 .header-img-container {
    overflow: hidden !important;
  }
  .page-template-expanded-clay.page-id-98 .header-img-container img {
    position: absolute;
    left:-20%;
    width: 120%;
    top: 0;
  }
  .page-template-expanded-clay.page-id-98 .inner-menu-holder {
    margin-top: 300px;
  }
}
@media screen and (max-width: 575px) {
  .inner-side-menu ul.parent li:first-child {
    width: 100% !important;
  }
  .item .caption-content p {
    font-size: 18px !important;
  }

  .item .caption-content {
    left: 0px;
    right: 0px !important;
    margin: 0 auto;
  }

  .metabox-holder .metabox-wrapper {
    padding: 30px 20px !important;
  }

  .metabox-holder .metabox-wrapper .country-logo {
    position: relative !important;
  }

  .metabox-holder .metabox-wrapper .metabox {
    margin-top: 25px;
  }
  .page-template-expanded-clay.page-id-98 .inner-menu-holder {
    margin-top: 225px;
  }
  .item .caption h3 {
    width: 60% !important;
  }
    .item .caption-content h2 {
    font-size: 22px !important;
  }
}

@media screen and (max-width: 376px) {
  #map-wrapper svg {
    position: relative;
    left: 235px;
  }

  .item .caption-content {
    width: 350px !important;
    height: 350px !important;
  }
  .page-template-expanded-clay.page-id-98 .inner-menu-holder {
    margin-top: 200px;
  }
}

@media screen and (max-width: 320px) {
  .item .caption-content {
    width: 300px !important;
    height: 300px !important;
  }

  .item .caption-content h2 {
    margin: 70px 0 20px 0 !important;
  }

  .item .caption-content p {
    font-size: 18px !important;
  }
}