/*
Theme Name: Pixeles
Description: Theme enfant de Pixeles
Author: Pixeles - twentynineteen
Template: twentynineteen 
Version: 0.1.0
*/

/* Header */

#page .site-header {
	background-color: #5d002e;
	padding: 1rem 0 0 0;
}

@media only screen and (min-width: 768px) {
	.site-header { padding: 1rem; }
}


.site-branding { text-align: center; }

@media only screen and (max-width: 768px) {
	.site-branding { padding: 1rem; }
}
@media only screen and (min-width: 768px) {
	.site-branding { margin: 0 calc(5% + 60px); }
}

.site-branding a { color: #FFF; }

.site-branding .site-title { 
	font-family: "NonBreakingSpaceOverride", Garamond, "Times New Roman", serif;
	font-size: 1.5rem;
	color: #FFF;
}

.site-description {
	display: block;
	font-size: 0.8rem;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
	color: #FFF;
	opacity: 0.6;
}

.site-branding .tel { 
	display: block;
	font-size: 1rem;
	color: #FFF;
	margin-top: 0.8rem;
}


#button-contact-top .wp-block-button__link {
	font-family: "NonBreakingSpaceOverride", "Hoefler Text", "Baskerville Old Face", Garamond, "Times New Roman", serif;
	font-size: 1rem;
	font-weight: 500;
	background: #700038;
	color: #FFF;
}
#button-contact-top .wp-block-button__link:hover {
	color: #FFF;
}
 
#button-contact-top { margin-top: 20px;}
  
@media only screen and (min-width: 768px) {
  #button-contact-top { 
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;	
	}
}


/* Navigation principal */

 #site-navigation { 
	text-align: center;
	margin-top: 1.5rem;
	padding: 0.3rem 0 0.6rem;
}

#site-navigation { 
	background: #ecf3f3;
	
}

.main-navigation .main-menu > li { color: #34001A; }
.main-navigation #menu-principal a {
	font-size: 1rem;
	font-family: "NonBreakingSpaceOverride", "Hoefler Text", "Baskerville Old Face", Garamond, "Times New Roman", serif;
	color: #700038;
	font-weight: 500;
	margin-left: 1rem;
}

/* Navigation principal mobile */



.main-navigation .sub-menu { background: #ecf3f3; }

.main-navigation .sub-menu > li > a, .main-navigation .sub-menu > li > a:hover, .main-navigation .sub-menu > li > a:focus, .main-navigation .sub-menu > li > .menu-item-link-return:hover, .main-navigation .sub-menu > li > .menu-item-link-return:focus { 
	font-size: 1rem;
	font-family: "NonBreakingSpaceOverride", "Hoefler Text", "Baskerville Old Face", Garamond, "Times New Roman", serif;
	font-weight: 500;
	background: #ecf3f3;
}
.main-navigation .sub-menu > li > a { color: #700038; }

@media only screen and (max-width: 768px) {
	.main-navigation #menu-principal a, .main-navigation .sub-menu > li > a {
		padding: 0.2rem 0.5rem;
		margin: 0.2rem;
		border-radius: 0.2rem;
		background: #700038;
		color: #FFF;
	}
	
	.main-navigation #menu-principal a:hover, .main-navigation .sub-menu > li > a:hover {
		background: none;
		color: #700038;
		border: 0;
	}	
	
}
@media only screen and (max-width: 768px) {
	.main-navigation .sub-menu .sub-menu > li > a {
			background: none;
			color: #700038;
	}
}


.main-navigation .sub-menu > li > a:hover, .main-navigation .sub-menu > li > a:focus, .main-navigation .sub-menu > li > .menu-item-link-return:hover, .main-navigation .sub-menu > li > .menu-item-link-return:focus { color: #700038; }


/* Navigation principal desktop */
@media only screen and (min-width: 768px) {
	.main-navigation #menu-principal a:hover, .main-navigation #menu-principal li.current-menu-parent a, .main-navigation #menu-principal li.current-menu-parent a:hover { border-bottom: 2px solid; }
}

.main-navigation #menu-principal li.current-menu-parent li a { color: #34001A; }
.main-navigation #menu-principal li.current-menu-parent li.current-menu-item a { color: #FFF; }

.main-navigation #menu-principal li:first-child a {	
	margin-left: 0rem;
}
.submenu-expand svg { fill: #480024; }
#menu-principal .sub-menu {
	background: #ecf3f3;
}
#menu-principal .sub-menu li {
	text-align: left;
	margin: 0 1rem;
}
#menu-principal .sub-menu li a {
	display: inline;
	text-align: left;
	margin: 0 auto;
	padding: 0;
	background: none;	
}
#menu-principal .sub-menu li:last-child {
	margin-bottom: 1rem;
}
#menu-principal .sub-menu > li > a:hover { 
	background: none;
}

@media only screen and (min-width: 768px) { .padding-r { padding-right: 1rem; } }
@media only screen and (min-width: 768px) { .border-left { border-left: 1px solid; padding-left: 1rem; } }

/* Page */
.content-area { margin: 1em; }
	@media only screen and (min-width: 768px) {
	.content-area {
		margin: calc(3 * 1rem) calc(5% + 60px) 1rem;
	}
}
.hfeed .entry .entry-header, .entry .entry-header, .entry .entry-summary, .entry .entry-content, .entry .entry-footer { margin: 0; padding: 0; }
#content .entry .entry-header { margin-bottom: 3rem; }
.entry .entry-content { width: 100%; padding: 0; }

@media only screen and (max-width: 768px) {
	.entry .entry-content, .entry .entry-summary { max-width: 100%; }
}

@media only screen and (min-width: 768px) {
	.entry .entry-content { width: 70%; float: left; padding-right: 3rem; }
}

/*

.entry .entry-content > *, .entry .entry-summary > * { max-width: calc(6 * (110vw / 12) - 10px); }
*/

@media only screen and (min-width: 768px) {
	aside { width: 30%; float: left;  }
}

.site-footer {background: #ecf3f3; margin-top: 2rem; }


/* Typo, content */

body, p, a { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;}
#content > * { font-size: 0.9rem; }
#content p.no-margin { margin-top: 0;}
h1.entry-title, h2 { 
	font-family: "NonBreakingSpaceOverride", "Hoefler Text", "Baskerville Old Face", Garamond, "Times New Roman", serif;
	font-weight: normal;
	color: #700038;
}
#content a { color: #700038; text-decoration: none; border-bottom: 1px dashed; }
#content a:hover { color: #700038; border-bottom: 1px solid;}
#content h1, h1.entry-title {font-size: 1.8rem;}
#content h2 {font-size: 1.3rem; padding-top: 1.5rem;}
h2:before { background: #700038; }
h2.widget-title { font-size: 1rem; padding-top: 0.5rem; }
h2.widget-title:before { content: none; }

aside, aside p { font-size: 0.75rem; line-height: 1.5rem; }
#content aside a, #content aside a:hover { color: #111; }

#content .wp-block-button__link { 
	font-family: "NonBreakingSpaceOverride", "Hoefler Text", "Baskerville Old Face", Garamond, "Times New Roman", serif;
	font-size: 1rem;
	font-weight: 500;
	color: #FFF;
	background: #700038;
	border: none;
	border-radius: 28px;
}
#content .wp-block-button__link:hover { color: #FFF; background: #5d002e; border: 0; }
.entry .entry-content .wp-block-button .wp-block-button__link:not(.has-background){ background: #700038; }

.entry .entry-title:before, #content h1:before { content: none; }

#content blockquote.wp-block-quote { border-left: 2px solid #700038; }

#content figcaption { font-size: 0.5rem; }

.border img { border: 1px solid #e4e4e4; padding: 5px; }
#content figure.alignright { margin-left: 2rem; margin-bottom: 2rem; }
#content figure.alignleft { margin-right: 2rem; margin-right: 2rem; }

.opacity { opacity: 0.03; }

/* Sidebar */

.widget-column { background: #ecf3f3; padding: 1.2rem; }
.blog aside { margin-top: 2rem;}
.blog #content .widget-area ul li { font-size: 0.75rem; font-weight: normal; }

/* Blog */

.extrait-article { background: #ecf3f3; padding: 2rem; }
.blog #content .widget_media_image { background: #FFF; }

.blog #content h2 { padding: 0 0 0.5rem 0; }
#content .byline { display: none; }

/* Footer */

footer#colophon .site-info { margin: 1rem auto; }
footer#colophon .site-branding { display: inline-block; width: 100%; margin: 0 auto; }

.site-branding .left, .site-branding .middle, .site-branding .right { width: 100%; min-height: 40px; float: left; }
.site-branding .right { line-height: 40px;}
@media only screen and (min-width: 768px) {
	footer#colophon .site-info { margin: calc(3 * 1rem) calc(5% + 60px) 3rem; }
}
@media only screen and (min-width: 768px) { 
	.site-branding .left, .site-branding .middle, .site-branding .right { width: 30%; text-align: center; }
}
@media only screen and (min-width: 768px) { 
	.site-branding .middle { margin: 0 1rem 0 1rem; padding: 0 1rem 0 1rem; border-left: 1px solid #5d002e; border-right: 1px solid #5d002e; }
}

footer#colophon .site-branding .left a, footer#colophon .site-branding .left a:hover { font-size: 0.9rem; color: #5d002e; }
footer#colophon .site-description { font-size: 0.45rem; color: #700038; opacity: 1; }
footer#colophon .site-info p { font-size: 0.6rem; color: #111; margin: 0 }
footer a { border-bottom : 1px dashed;}
footer a.site-title { border-bottom : 0; }