/*
Theme Name: Musee de la Photo
Theme URI: http://dev.museephotographie.nice.fr
Description: A child theme for Twenty Twenty.
Author: Ville de Nice
Author URI: http://dev.museephotographie.nice.fr
Template: twentytwenty
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/


/* partout */ 
body {	
    font-family: le-havre, sans-serif;
}
p, li {
	font-weight:300;
	font-size:1.3em;
	color:#2e2c2c;
    font-family: le-havre, sans-serif;
}
a {
	text-decoration:none;
}
.site-logo {
    width: 100%;
    margin-top: 3rem !important;
    text-align:center;
}
.site-logo a, .site-logo img {
    display: block;
    margin: 0 auto !important;
}
.site-logo img {
    max-height: 24rem;
}
.menu-languages li {
    display: inline-block;
}
#languages-menu li.btn.btn-ticket {
    text-transform: uppercase;
    font-size: 1em;
    font-weight: 600;
    background-color: #000;
}
#languages-menu li.btn.btn-ticket a {
    padding: .25em .5em;
    letter-spacing: .0333em;
    color: #fff;
}
.primary-menu-wrapper {
    margin-top: 3rem;
}

ul.primary-menu {
    justify-content: center !important;
    padding-top: 3rem;
    border-top: 1px solid #3a3a3a;
    border-bottom: 1px solid #3a3a3a;
    max-width: 1024px;
    margin: 0 auto;
}
.lang-item {
    margin-top: 3rem !important;
}
nav a {
    color: #1a1919 !important;
    font-weight: lighter;
    font-size: 1.8em;
    letter-spacing: 0.6px;
}
nav .sub-menu a {
    font-size: 1.6em;
}
.iconesvgnav {
    display:none;
}
nav .icon {
	color:#fff !important;
}
.iconesvgnavinline {
	display:inline-block;
    width: 15px;
    height: 15px;
    margin:0 auto;
}
i.iconesvgnav.picto-1 {
    background: url(../../uploads/pratique-n.svg) no-repeat;
}
i.iconesvgnav.picto-2 {
    background: url(../../uploads/activites.svg) no-repeat;
}
i.iconesvgnav.picto-3 {
    background: url(../../uploads/collection.svg) no-repeat;
}
i.iconesvgnav.picto-4 {
    background: url(../../uploads/documentation.svg) no-repeat;
}
i.iconesvgnav.picto-5 {
    background: url(../../uploads/evenements.svg) no-repeat;
}
i.iconesvgnav.picto-6 {
    background: url(../../uploads/expositions.svg) no-repeat;
}
.picto-10 {
    background: url(../../uploads/instagram.svg) no-repeat;
    display: inline-block;
    position: relative;
    top: 8px;
    width: 30px;
    height: 30px;
    margin:0 auto;
    margin-top:12px;
}
.picto-11 {
    background: url(../../uploads/newsletter.svg) no-repeat;
    display: inline-block;
    position: relative;
    top: 8px;
    width: 30px;
    height: 30px;
    margin:0 auto;
    margin-top:12px;
}
.modal-menu ul li {
    font-size: 1.2rem;
}
body:not(.overlay-header) .primary-menu ul {
    background-color: #fff !important;
    border: 1px solid #000;
}
.entry-content li {
    font-size:22px;
}
.entry-content h3 {
    margin: 3rem auto 3rem;
}
.header-inner {
    padding: 0;
}
h1 {
    text-transform: uppercase;
    font-size: 3.4rem;
    font-weight: 600;
    letter-spacing: 1px;
    margin: 0;
    color:#000;
    padding:2rem;
}
h1.entry-title {
    padding-bottom:2.5rem;
}
h2 {
    text-transform: uppercase;
    font-size: 2.8rem;
    font-weight: 600;
    letter-spacing: 1px;
}
h3 {
    font-size: 2rem;
    color: #000;
}
h3, h4, h5, h6 {
    letter-spacing: 1px;
}
.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4, .entry-content h5, .entry-content h6, .entry-content cite, .entry-content figcaption, .entry-content table, .entry-content address, .entry-content .wp-caption-text, .entry-content .wp-block-file {
    font-family: le-havre, sans-serif !important;
}
img {
	max-width:100%;
}
.bg1 {
	background: #000;
	color:#fff;
}
.bg1 .bg2 {
	background: #fff;
	color:#000;
}
.bg2 {
	background: #fff;
}
.bg2 .bg1 {
	background: #000;
	color:#fff;
	margin:0 auto;
}
.bg2 .bg1 h1 {
    margin-top: 0;
}
.bg2 h1, .bg2 h2, .bg2 h3, .bg2 h4, .bg2 h5, .bg2 h6, .bg2 li {
    color:#000;
}
.center {
	text-align: center;
}
.center img {
	margin:0 auto;
}
.pied-de-page .les-widgets {
	padding: 20px 15px;
}
.pied-de-page, .pied-de-page a {
	color:#fff;
}
.pied-de-page h1 {
    color: #fff;
}
.iconesvg {
    width: 70px;
    height: 70px;
}
#site-footer {
    background: #000 !important;
    color:#fff;
}
#site-footer .row {
    width:100%;
}
footer img {
    margin:auto;
}
footer li {
    text-align: center;
}
footer .wp-block-column:nth-child(2n) {
    margin-left: 0;
}
#site-content {
    background: #000;
}
.singular .entry-header {
    padding: 3rem 0;
    max-width: 120rem;
    margin: 0 auto;
    margin-bottom: -4rem;
}
.entry-content {
    max-width: 140rem;
    margin: 0 auto;
    background: #fff;
}
.entry-content > * {
    margin-bottom: 0.9em;
}
.entry-content p {
    font-weight: 300;
    font-size: 1.1em;
}
.entry-content p, .entry-content li {
    line-height: 1.2em;
}
.post-meta-wrapper {
    display: none;
}
.menu-languages--container {
    max-width: 1500px;
    margin: auto;
    margin-right:10px;
}
#languages-menu {
    text-align: right;
}
#languages-menu a {
    color: #000;
    font-size: 1.1em;
    font-weight: lighter;
}
#languages-menu .current-lang {
    font-weight:bold;
    border-bottom: none !important;
}
#languages-menu a:hover, #languages-menu .current-lang {
    text-decoration: underline;
}
#menu-item-206-fr {
    border-right: 1px solid;
    padding-right: 20px;
}
#site-footer li {
    list-style-type: none;
    font-size: 1em;
}
.musees h3 {
    text-transform: uppercase;
}
.musees li {
    position: relative;
    padding: .75rem 1rem .75rem 0;
    list-style-type: none;
    border-bottom: 1px solid #dedede;
    -webkit-transition: .2s background;
    transition: .2s background;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin:0;
}
.musees li:hover {
    background: #f4f4f4;
}
.musees li::after {
    content: "+";
    position: absolute;
    right: .25rem;
    color: #dedede;
}
.musees a {
    color: #000;
    font-weight: lighter;
}
#site-footer a {
    color: #fff;
}
.pied-de-page .wp-block-column:nth-child(2n), .musees .wp-block-column:nth-child(2n) {
    margin-left: 0 !important;
}
.musees .wp-block-column {
    margin-bottom: 0;
}
.pied-de-page h6 {
    margin-top: 1rem;
    margin-bottom: 1rem !important;
}
footer ul {
  margin:0 !important;
}
.tothetop {
    text-align: right;
    margin-right: 40px;
}
#site-content a {
    color:#000;
}
#site-content p a {
    text-decoration: underline;
}
.wp-block-button, .wp-block-button a, .bg2 button {
    background:#000;
    color:#fff !important;
    font-family: le-havre, sans-serif;
}
.wp-block-columns {
    margin-top: 0 !important;
    margin-bottom: 2rem !important;
}
.large-btn .wp-block-button {
    width:100%;
    text-align:center;
}
.wp-block-button {
    margin: 0 !important;
}
.pagination-wrapper {
    border-top: 1px solid;
    padding-top: 2rem;
}
button.center {
    display:block;
    margin:auto;
    margin-top:20px;
    text-align:center;
}
button a {
    color:#fff !important;
}
.plus {
    font-weight: 300 !important;
    font-size:1.1em !important;
    letter-spacing: 1px!important;
    color:#474747 !important;
}
.plus a {
    text-decoration: none !important;
    color:#474747 !important;
}
.wp-block-column .plus {
    font-size: 1.1em !important;
}
.wp-block-column.plus a:hover {
    font-size: 1.1em;
}
a, path {
    transition: none;
}
.expo-musee .plus {
    font-size: 1.25em !important;
}
.expo-galerie .plus {
    font-size: 1.25em !important;
    letter-spacing: 2px !important;
}
.expo-galerie .plus a {
    color:#fff !important;
}
.wp-block-column h2 {
    font-size: 4.2rem !important;
}
figure a:hover img {
    transform: scale(1.035);
    max-width: 100%;
    transition: .2s all;
}
.entry-content hr, hr.styled-separator {
    background: linear-gradient(to left, currentColor calc(100%), transparent calc(100%), transparent calc(100%), currentColor calc(100%));
}
.entry-content hr::before, .entry-content hr::after, hr.styled-separator::before, hr.styled-separator::after {
    content: none;
}
.header-titles {
    margin: 0;
}
.toggle-inner .toggle-text {
    font-size: 2rem;
}





/* Bootstrap Collapse */

.fade {
  transition: opacity 0.15s linear;
}
@media (prefers-reduced-motion: reduce) {
  .fade {
    transition: none;
  }
}
.fade:not(.show) {
  opacity: 0;
}

.collapse:not(.show) {
  display: none;
}

.collapsing {
  height: 0;
  overflow: hidden;
  transition: height 0.35s ease;
}
@media (prefers-reduced-motion: reduce) {
  .collapsing {
    transition: none;
  }
}





/* Bootstrap Dropdown */

.dropup,
.dropdown {
  position: relative;
}

.dropdown-toggle::after {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: "";
  border-top: 0.3em solid;
  border-right: 0.3em solid transparent;
  border-bottom: 0;
  border-left: 0.3em solid transparent;
}

.dropdown-toggle:empty::after {
  margin-left: 0;
}

.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 10rem;
  padding: 0.5rem 0;
  margin: 0.125rem 0 0;
  font-size: 1rem;
  color: #212529;
  text-align: left;
  list-style: none;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 0.25rem;
}

.dropup .dropdown-menu {
  margin-top: 0;
  margin-bottom: 0.125rem;
}

.dropup .dropdown-toggle::after {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: "";
  border-top: 0;
  border-right: 0.3em solid transparent;
  border-bottom: 0.3em solid;
  border-left: 0.3em solid transparent;
}

.dropup .dropdown-toggle:empty::after {
  margin-left: 0;
}

.dropright .dropdown-menu {
  margin-top: 0;
  margin-left: 0.125rem;
}

.dropright .dropdown-toggle::after {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: "";
  border-top: 0.3em solid transparent;
  border-bottom: 0.3em solid transparent;
  border-left: 0.3em solid;
}

.dropright .dropdown-toggle:empty::after {
  margin-left: 0;
}

.dropright .dropdown-toggle::after {
  vertical-align: 0;
}

.dropleft .dropdown-menu {
  margin-top: 0;
  margin-right: 0.125rem;
}

.dropleft .dropdown-toggle::after {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  content: "";
}

.dropleft .dropdown-toggle::after {
  display: none;
}

.dropleft .dropdown-toggle::before {
  display: inline-block;
  width: 0;
  height: 0;
  margin-right: 0.255em;
  vertical-align: 0.255em;
  content: "";
  border-top: 0.3em solid transparent;
  border-right: 0.3em solid;
  border-bottom: 0.3em solid transparent;
}

.dropleft .dropdown-toggle:empty::after {
  margin-left: 0;
}

.dropleft .dropdown-toggle::before {
  vertical-align: 0;
}

.dropdown-divider {
  height: 0;
  margin: 0.5rem 0;
  overflow: hidden;
  border-top: 1px solid #e9ecef;
}

.dropdown-item {
  display: block;
  width: 100%;
  padding: 0.25rem 1.5rem;
  clear: both;
  font-weight: 400;
  color: #212529;
  text-align: inherit;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
}

.dropdown-item:hover, .dropdown-item:focus {
  color: #16181b;
  text-decoration: none;
  background-color: #f8f9fa;
}

.dropdown-item.active, .dropdown-item:active {
  color: #fff;
  text-decoration: none;
  background-color: #007bff;
}

.dropdown-item.disabled, .dropdown-item:disabled {
  color: #6c757d;
  background-color: transparent;
}

.dropdown-menu.show {
  display: block;
}

.dropdown-header {
  display: block;
  padding: 0.5rem 1.5rem;
  margin-bottom: 0;
  font-size: 0.875rem;
  color: #6c757d;
  white-space: nowrap;
}






/* accueil */


.alert {
    position: relative;
    padding: .75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
}
.alert-danger {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
    max-width: 850px;
    margin: auto;
}
.alert-danger p {
    color: #721c24 !important;
}
.singular .featured-media::before {
    background-color: transparent !important;
}
.home .entry-header {
    display: none;
}
.dates-expo-index {
    color: #474747;
    border-top: 1px solid;
    padding-top: 10px;
    border-bottom: 1px solid;
    padding-bottom: 10px;
}
.expo-musee a {
	color:#000;
}
.dates-expo-index h3 {
    font-size: 3.2rem;
    font-weight: 400 !important;
}
.dates-expo-index a {
    color: #474747;
}
.expo-galerie h2 {
	font-size:2.8rem;
}
.expo-galerie h3 {
    text-transform: uppercase;
    font-size: 2rem;
}
.expo-galerie p, .expo-galerie a {
	color:#fff;
}
.expo-galerie .plus, .expo-musee .plus {
    padding-top: 10px;
}
.expo-musee .plus img, .expo-galerie .plus img {
	width:15px;
	height:15px;
}
.featured-media, .singular .featured-media-inner {
    max-height: 500px;
    margin-top: 2rem;
}
.featured-media img, .singular .featured-media-inner img {
    max-height: 500px;
    width: auto;
    margin-bottom: 3rem;
}
.wp-block-column > :last-child {
    font-size: 1.25em;
}
.home h1 {
    margin: auto;
    padding: 2rem 0 2rem 0;
    max-width: 1024px;
}






/* expo */

.dates-expo {
    font-size: 3.2rem;
    font-weight: 400 !important;
    color: #474747;
    border-top: 1px solid;
    padding-top: 10px;
    border-bottom: 1px solid;
    padding-bottom: 10px;
}
.legende, .wp-caption-text, .wp-block-image .aligncenter figcaption {
	font-size:0.9em;
	font-style:italic;
	color:grey;
	margin-top:10px;
	text-align:center;
    font-family: le-havre, sans-serif;
}
h2.filtre {
	margin-top:0;
}
.expo-passee {
	border-bottom:1px solid #000;
    padding:20px 20px 0 20px;
}
.expo-passee img {
    text-align: center;
}
.expo-en-cours {
	padding:20px;
}
.expo-passee h5 a, .expo-en-cours h5 a {
	color:#000;
	text-transform: uppercase;
}
.expo-passee h5, .expo-passee p, .expo-en-cours h5, .expo-en-cours p {
	margin:0;
	padding-bottom: 0 !important;
}
.expo-passee a, .expo-en-cours a {
	color:#000;
	font-weight: lighter;
}
.expo-passee a img, .expo-en-cours a img {
	width:15px;
	height:15px;
}
.singular .featured-media-inner {
    left:auto;
    max-width:100%;
}
article .post-inner {
    padding-top: 0 !important;
}
hr {
    margin:0 !important;
}
.single-expositions .entry-content {
    padding:0 0 8rem 0;
}
.pagination {
    margin-top:20px;
}
.pagination .nav-links {
    font-size: 1.5rem;
    font-weight: 400;
}
.page-numbers.current {
    font-size: 1.8rem;
    color: #fff;
    background: #000;
    padding: 2px 8px;
}   
.right {
    text-align: center;
}
.dates-expo-index h3 {
    text-align: center;
}
.section-inner {
    width: calc(100% - 4rem);
}
.filtres {
    max-width:530px;
    margin:auto;
}
.filtres li {
    display: inline-block;
}
.btn.filtre {
    font-size:2rem;
}
.btn.annees {
    font-size: 2rem;
    padding: 3px 10px !important;
    background: #f5f5f5;
    color: #000 !important;
    text-transform: none;
    border: 1px solid #e5e5e5;
}
button:hover, button:focus {
  text-decoration:none;
}
.btn.filtre.selected {
    font-weight: normal;
}
.filtres--container .dropdown-item {
    font-size: 1.6rem;
}
.filtres .dropdown-item:hover, .dropdown-item:focus {
    text-decoration: none;
    background-color: #000;
    color: #fff !important;
}
.encours, .passee, .avenir {
  display:none;
}
.nav-toggle {
  left:0 !important;
  height:60px;
}




/* collections */

.page-id-62 .wp-block-column {
    align-self: start !important;
}






@media (min-width:600px) and (max-width:781px) {
    .wp-block-column:not(:only-child) {
        flex-basis:calc(100% - 1em) !important;
    }
    .expo-passee .wp-block-column {
        max-height:450px;
        width:auto;
    }
    .expo-passee .wp-block-column img {
        max-height:450px;
        width:auto;
        margin:auto;
    }
}


/* tablettes */

@media screen and (min-width:768px) {  
  h1 {
      font-size: 4rem;
  }
  h2 {
      font-size: 3rem;
  }
  h3 {
      font-size: 2rem;
  }
  .entry-content > :not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.is-style-wide) {
  	max-width: 120rem;
  }
  .wp-block-column {
      margin-bottom: 0;
      align-self: center !important;
  }
  .plus {
      align-self: end !important;
      -webkit-align-self:flex-end !important;
  }
  .site-logo {
      text-align: center;
      width: 300px;
      margin: auto !important;
  }  
  nav .sub-menu a {
      font-size: 1.2em;
  }    
  footer .wp-block-column:nth-child(2n) {
      margin-left: 2rem !important;
  }
}





/* ordinateurs */

@media screen and (min-width:1000px) {    
  h1 {
      font-size: 6rem;
      margin:2rem 0;
  }
  h2 {
      font-size: 4.2rem;
  }
  h3 {
      font-size: 2.8rem;
  } 
  .plus a:hover {
      font-weight:normal;
  }
  .home h1 {
      padding:4rem 0 4rem 0;
  }  
  .bg1 .bg2 {
      padding:2rem;
  }  
  .primary-menu > li {
      padding-bottom: 3rem;
      margin: 0 1rem;
      border-bottom: 6px solid #fff;
  }
  .primary-menu > li:hover, .current-menu-item, .current-menu-parent {
      border-bottom: 6px solid #000 !important;
      transition: .2s all;
  }
  .primary-menu a:hover, .primary-menu a:focus, .primary-menu .current_page_ancestor, .primary-menu li.current-menu-item > a, .primary-menu li.current-menu-item > .link-icon-wrapper > a {
      text-decoration: none;
  }
  .current_page_item {
      border-bottom: 6px solid #000 !important;
  }
  .sub-menu .current_page_item {
      border-bottom: 1px solid #000 !important;
  }
	.iconesvgnav {
	    width: 30px;
	    height: 30px;
	    display:block;
	    margin:0 auto;
	    margin-top:12px;
	}
	 .entry-header-inner {
		max-width:120rem !important;
	}
	.bg1 .entry-header-inner {
		padding:2rem 16rem;
	}
	.bg2 {
		padding-bottom: 2rem;
	}
	.bg2 .bg1 {
		max-width:120rem !important;http://dev.museephotographie.nice.fr/
	}
	.bg2 .entry-header-inner {
		padding:0 2rem;
	}
	.bg2 .bg1 h1 {
	    padding-top: 4rem;
        padding-bottom: 4rem;
	}
	.entry-content {	    
    padding: 0 6rem 4rem 6rem;
	}
  #languages-menu {
      position: absolute;
      right: 18rem;
  }
  .expo-passee {
      max-width: 104rem;
      margin: auto;
  }
  .sub-menu {
      width: 1024px !important;
      right: -545px !important;
      top: 117px !important;
      border: none !important;
      border-radius: 0 !important;
      border-top: 1px solid #000 !important;
      padding-bottom: 0 !important;
      display:none;
  }
  #menu-item-3235 .sub-menu {
    right: -786px !important;
  }
  #menu-item-356 .sub-menu {
      right: -486px !important;
  }
  #menu-item-632 .sub-menu {
      right: -396px !important;
  }
  #menu-item-244 .sub-menu {
      right: -356px !important;
  }
  .menu-item-has-children:hover .sub-menu {
      display: block;
  }
  .sub-menu li {
      border-bottom: 1px solid #737373;
      text-align:center;
      font-size: 2.4rem;
  }
  .sub-menu li:hover {
      background:#000;
  }
  .sub-menu li:hover a {
      color:#fff !important;
  }
  .primary-menu ul::before, .primary-menu ul::after {
      content: none;
  }   
  .right {
      text-align: right;
  }
  .dates-expo-index h3 {
      text-align: left;
  }
  .section-inner {
      width: calc(100% - 8rem);
  }    
  footer li {
      text-align: left;
  }
  .pied-de-page .wp-block-column:nth-child(2n) {
      margin-left: 2rem;
  }  
  .zoom a:hover img {
      transform:scale(1.035);
      max-width: 100%;
      transition: .2s all;
  }
  .les-widgets h6 {
      margin-top: 1.5rem;
  }
  .radius {
      padding: 1em;
      display: inline-block;
  }
  .radius:hover {
      border-radius: 62px;
      background: #2e2d2d;
      padding: 1em;
      display: inline-block;
  }
  abbr, acronym {
      cursor: pointer;
  }
  .encours, .passee, .avenir {
      display: block !important;
      -webkit-transform: rotate(-90deg) translateX(-151%);
      transform: rotate(-90deg) translateX(-153%);
      -webkit-transform-origin: left top 0;
      transform-origin: left top 0;
      padding: .25rem 1.5rem;
          padding-bottom: 0.25rem;
      font-weight: 700;
      text-transform: uppercase;
      color: #fff;
      font-size: 1.6rem;
      position: relative;
      top: -11rem;
      left: 100%;
      max-width: 120px;
  }
  .encours {
      background: #000;
  }
  .passee {
      background: #e5e5e5;
      color:grey;
  }
  .avenir {
      background: grey;
      color:#000;
  }
  .encours + a, .avenir + a, .passee + a {
    margin-right:1rem;
  }    
  .home .encours, .home .avenir {
    display:none !important;
  }
  footer ul {
    margin: 0 0 0 3rem;
  }
}