/*Theme Name: Mo&Vi

Theme URI: http://www.webmaster-freelance.paris
Author: Benjamin Levaux
Author URI: http://www.webmaster-freelance.paris
Description: Le thème de Mo&Vi

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: "Barlow Condensed", sans-serif;
    font-weight: 400;/*700*/
    font-style: normal;
    font-size:1.2rem;
	line-height:1.4;
	margin:0;
	max-width:100%;
	-webkit-text-size-adjust: none;
	position:relative;
    color:#000;   
}
img {max-width:100%;height:auto;max-height:100%;width:auto;}
a img {border:0;}
.clear {clear:both;}
strong {font-weight:bold;}
a {color:black;}

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

.container {position: relative;width:1200px;margin:0 auto;padding:20px 15px;box-sizing: border-box;overflow-x: hidden;}

.row {display: flex;flex-wrap: wrap; position: relative;margin:0 -20px;}

.col {padding:0 20px;max-width:100%;position: relative;}
.col_10 {width:83.33%}
.col_9 {width:75%}
.col_8 {width:66.66%}
.col_7 {width:58.33%}
.col_6 {width:50%}
.col_5 {width:41.66%}
.col_4 {width:33.33%}
.col_3 {width:25%}
.col_2 {width:16.66%}

.mt50 {margin-top:50px;}

.between {justify-content: space-between;}
.nowrap {flex-wrap: nowrap;}
.grow {flex:1;}

.right {text-align: right;}
.center {text-align: center;}

.top {align-items: flex-start;}
.milieu {align-items:center;}

.clear {clear:both;}

h1, h2 {font-weight:700;line-height:1.1;text-transform: uppercase;}

h1 {font-size:3rem;}

h2 {font-size:1.7rem;}

.sommaire {margin:0;padding:0; list-style-type: none;}
.sommaire_item {display: flex;align-items: center;margin:10px 0;}
.sommaire h2 {font-size:3rem;}
.sommaire a {text-decoration: none;}
.date {font-style: italic;font-size:1rem;}

.sommaire img {height:70px;margin:20px;}

.illustration {float:right; margin: 0 0 30px 30px;max-width: 30%;}

.nav_articles {margin-top:50px;}

.nav_articles a {text-decoration: none;text-transform: uppercase;font-weight: 700;}

/* ------------------------------ FORM WOOCOMMERCE ------------------------------ */

.amount {font-size:1.8rem; color:#000;font-weight: bold;}

input {padding:9px 8px;border:1px solid #000;font-size:1.2rem;}

#respond input#submit.alt,  a.button.alt, button.button.alt,  input.button.alt,  .woocommerce #respond input#submit.alt,  .woocommerce a.button.alt,  .woocommerce button.button.alt,  .woocommerce input.button.alt {
    background-color: #000 !important;
}

.product_meta {display: none;}

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

header, footer {
    font-size:1rem;
    position: fixed;
    z-index:10;
    top:0;
    width:100%;
    padding:10px;
    border-bottom: 1px solid #000;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #FFF;
}
.sous_menu {height:70px;}

.logo {width:200px;}

nav {}
nav ul {list-style-type: none;margin:0;padding:0;display: flex;}
nav li {margin:0 7px;padding:0;}
nav  a {display: block;border:1px solid #000; border-radius: 50px;padding:5px 30px;text-decoration: none;}
nav  a:hover, nav li.current-menu-item a {background: #000;color:#FFF;}
nav .lang-item a {border:0;background: transparent;padding:5px 0px;}

.open_menu {
    width: 26px;
    height: 23px;
    cursor: pointer;
    position: relative;
    display: inline-block;
    margin-top:8px;
}
.trait_haut {top: 0px;}
.trait_milieu {top: 8px;}
.trait_bas {top: 16px;}
.trait {
    width: 26px;
    height: 3px;
    background: #000;
    transition: 0.4s ease all;
    position: absolute;
}

.d_none {display: none;}

.incline_un {transform: rotate(45deg);top:12px;}
.incline_deux {transform: rotate(-45deg);top:12px;}

.menu_mobile {display: none;position: absolute;background: #FFF;width:100%;z-index: 100;top:50px;left:0;padding:10px 0;font-size:1.2rem;}
.menu_mobile nav ul {margin:0;padding:20px;list-style-type: none;display: block}
.menu_mobile li {width: 100%; text-align: center;margin:0;padding:10px 0;position: relative;}

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

footer {
    /*top:auto;
    bottom:0;*/
    position: relative;
    border-top: 1px solid #000;
    border-bottom: none;
    padding-left:80px;
}

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

@media (max-width: 1200px) {
    .container {width:100%;}
}
@media (min-width: 769px) {
    .mobile, .menu_mobile, .open_menu {display: none !important;}

}
@media (max-width: 768px) {
    .desktop {display: none !important;}
    .logo {width:150px;}
    
    h1 {font-size:2rem;}
    h2 {font-size:1.5rem;}
    .sommaire h2 {font-size:2rem;}
    
    footer {display: block;position: relative;text-align: center;}
    footer nav ul {display: block;margin-bottom:20px;}
    footer nav li a {margin:10px 0;}

}
@media (max-width: 480px) {
}