/*Theme Name: Hélène Couderc 

Theme URI: http://www.webmaster-freelance.paris
Author: Benjamin Levaux
Author URI: http://www.webmaster-freelance.paris
Description: Le thème de Hélène Couderc 

Version: 1
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.

*//* ------------------------------ RESET ------------------------------ */

html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	vertical-align: baseline;
	outline:none;
	font-size:100%;
    box-sizing: border-box;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block;}
table {border-collapse: collapse;border-spacing: 0;}

/* ------------------------------ END RESET ------------------------------ */

/* ------------------------------ GLOBAL ------------------------------ */

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    font-size:1rem;
	line-height:1.4;
	margin:0;
	max-width:100%;
	-webkit-text-size-adjust: none;
	position:relative;
    color:#333;   
}
img {max-width:100%;height:auto;max-height:100%;width:auto;}
a img {border:0;}
.clear {clear:both;}
strong {font-weight:bold;}
a {color:#333;text-decoration: none;}

.d_none {display: none;}

/* ------------------------------ CONTENT ------------------------------ */

.container {position: relative;width:1000px;margin:0 auto;padding:20px 50px;box-sizing: border-box;overflow-x: hidden;}
.content {position: relative;width:650px;margin:50px auto;}

header {}

h1, h2, h3 {
    font-family: "Source Serif 4", serif;
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
	line-height:1.1;
}
h1 {font-size:3rem;margin: 50px 0;}
h2 {font-size:2rem;margin: 50px 0;}


/* ------------------------------ HEADER ------------------------------ */

header {}

header h1 {font-size:1.3rem;font-weight: bold;margin:0;}

nav {display: none;margin-top:50px;}

nav ul {
    list-style-type: none;margin:0;padding:0;display: flex;width:100%;justify-content: space-evenly;flex-wrap: wrap;
    font-family: "Source Serif 4", serif;
}
nav li {text-align: left;width: 100%;margin:5px 0;}
nav  a {}
nav li.current-menu-item a {font-weight: bold;}

#open_menu {
    display: flex;
    position: fixed;
    top:25px;
    right:calc(50vw - 450px);
    flex-direction: column;
    height: 40px;
    width:40px;
    justify-content:center;
    cursor: pointer;
}

.trait_haut {top: 0px;}
.trait_milieu {top: 8px;}
.trait_bas {top: 16px;}

.trait {
    width: 40px;
    height: 2px;
    background: #000;
    transition: 0.4s ease all;
    position: absolute;
}
.incline_un {transform: rotate(45deg);top:12px;}
.incline_deux {transform: rotate(-45deg);top:12px;}

/* ------------------------------  HOMEPAGE -----------------------------*/

.homepage {
    position: relative;
    height:85vh;
    background-size: cover;
    background-position: top;
    background-image: url("img/Helene_Couderc_homepage_desktop-2.webp");
}

.intro {
    position:absolute;
    width:1000px;
    bottom:30px;
    left:calc(50vw - 500px);
    font-size: 4rem;
    color:#FFF;
    z-index:10;
    text-align: right;
    font-family: "Source Serif 4", serif;
    line-height: 1.1;
    
}
/* ------------------------------  FORM -----------------------------*/

.couderc {background: #333 !important;}
label {font-family: "Source Serif 4", serif;}

/* ------------------------------  FOOTER -----------------------------*/

footer  {border-top: 1px solid #000;padding:30px 0;font-size: 0.8rem;text-align: center;}

/* ------------------------------  RESPONSIVE -----------------------------*/

@media (max-width: 1000px) {
    .container {width:100%;}
    .intro {
        width: calc(100% - 100px);
        bottom: 30px;
        left: 50px;
    }
    #open_menu {right:50px;}

}
@media (max-width: 750px) {
    .content {width:100%;}
    .intro {font-size: 3rem;}
}
@media (max-width: 640px) {
    .container {padding:20px;}
    .intro {
        width: calc(100% - 40px);
        bottom: 30px;
        left: 20px;
    }
    #open_menu {right:20px;}
    
    /*.homepage {background-image: url("img/Helene_Couderc_homepage_mobile.webp");}*/

}