/*
Theme Name: Twenty Seventeen btest
Theme URI: 
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Twenty Seventeen 
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentyseventeen
Tags: 
Domain Path: 
Template: twentyseventeen
Version:      1.9.9
Parent URI: https://wordpress.org/themes/twentyseventeen/;

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.
*/

/* 1.3 version for WP 4.8 and beta tests with 2017 1.3 */
/* 1.2 version for WP 4.7.4 and beta tests with 2017 1.2 */
/* 1.1 version for WP 4.7 and beta tests with 2017 1.1 */
/* 1.0 version for WP 4.7 and beta tests */

/* PERIME: the most important line of the style.css of a child from his parent twentyseventeen */
/*@import url('../twentyseventeen/style.css');*/

@media screen and (min-width: 30em) {
.site-branding {
    padding: 3em 0;
    display: none;
	}
}

/*centrage logo mobile*/
.site-branding {
 padding: 1em 2em 1em 2em;
}



@media screen and (min-width: 30em) {
.panel-content .wrap {
    padding-bottom: 2em;
    padding-top: 7.5em;
	}
}

.custom-header {
    background: #403F3F;
      }



/* https://wordpress.org/support/topic/how-to-change-the-color-of-all-menus/*/
/*.main-navigation a:link {
color: green;
}
*/
/* Active page */
/*.navigation-top .current_page_item > a {
    color: darkblue;
}

/* on hover */
/*.main-navigation a:hover {
color: pink;
}
/*
/* couleur orange est #ff9f1a gris foncé #403F3F gris clair #767676 gris tres clair #b3b3b3 quasi blanc #fafafa*/

.navigation-top a {
    color: #f2f2f2;
    font-weight: 600;
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
}

.navigation-top {
    background: #403F3F;
    color: #ffffff;
	padding-bottom: 0.5em;
  }

navigation-top a {
    background: #403F3F;
    color: #ffffff;
    font-weight: 600;
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
}


@media screen and (min-width: 48em) {
.main-navigation ul ul {
    background: #ff9f1a;
    border: 1px solid #bbb;
    left: -999em;
    padding: 0;
    position: absolute;
    top: 100%;
    z-index: 99999;
	}
}

@media screen and (min-width: 48em) {
ul.submenu.toggled-on :before {
    color: #ff0000;
    text-shadow: 1px 1px white;
    background: #ff9f1a;
    border: 1px solid #bbb;
    left: -999em;
    padding: 0;
    position: absolute;
    top: 100%;
    z-index: 99999;
	}
}


.main-navigation a:hover {
    color: #767676;
}


.navigation-top .current-menu-item > a, .navigation-top .current_page_item > a {
    color: #ff9f1a;
   }

@media screen and (max-width: 30em) {
.navigation-top .current-menu-item > a, .navigation-top .current_page_item > a {
    color: #767676;
	}
}


@media screen and (min-width: 48em) {
.menu-item-type-post_type .menu-item-object-page .navigation-top .current-menu-item > a, .navigation-top .current_page_item > a, ul.submenu.toggled-on  { 
    color: #767676;
	}
}

/*
@media screen and (min-width: 48em) {
.menu-item-type-post_type .menu-item-object-page .navigation-top .current-menu-item > a, .navigation-top .current_page_item > a, ul.submenu.toggled-on :before { 
    color: #767676;
	}
}
*/
	
	
	
	


/*couleur menu radicale*/

@media screen and (max-width: 30em) {
.main-navigation > div > ul {
    border-top: 1px solid #eee;
    padding: 0.75em 1.695em;
    background: #ff9f1a;
}
}

@media screen and (max-width: 30em) {
.main-navigation ul ul ul ul{
    background: #ff9f1a;
    border: 1px solid #bbb;
    left: -999em;
    padding: 0;
    position: absolute;
    top: 100%;
    z-index: 99999;
	}
}





/*couleur menu bidule mobile*/
.menu-toggle {
background-color: transparent;
border: 0;
-webkit-box-shadow: none;
box-shadow: none;
color: #ff9f1a;
display: none;
font-size: 14px;
font-size: 0.875rem;
font-weight: 800;
line-height: 1.5;
margin: 1px auto 2px;
padding: 1em;
text-shadow: none;
}

ul.sub-menu.toggled-on {
   background: #ff9f1a;
}





/*https://pascalcescato.gdn/blogging/personnaliser-twenty-seventeen-astuces-code-extensions/
position: fixed; ou position: relative;*/
@media screen and (max-width: 767px) {
  .navigation-top {
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99999;
  }
 
  /* Si vous affichez le menu d'administration sur le site */
  .admin-bar .navigation-top {
    padding-top: 45px;
  }
}

  /* Numéro de tél menu */

.widget_text .custom-html-widget{
    word-wrap: break-word;
    padding-left: 2em;
}

@media screen and (min-width: 30em){
.widget_text .custom-html-widget{
    word-wrap: break-word;
    padding-top: 1em;
    float: right;
    padding-right: 4em;
  }
}





/*https://wordpress.stackexchange.com/questions/280966/twenty-seventeen-theme-move-main-menu-to-top-of-screen*/
/*.navigation-top {
  top: 14px;
}
*/
/*https://allaboutbasic.com/2016/12/22/twenty-seventeen-theme-modifications-of-header-footer-sidebar-contents-and-documentations/
*/
/*
@media (min-width: 760px) {
.navigation-top {
position: absolute;
top: 0px;
width: 100%;
height: 70px;
}
}
*/

/*https://gist.github.com/gareth-gillman/af3322402dd9c458f5c5b4537188f8ec*/
/*
.navigation-top .custom-logo-link {
 display:none;
 float:left;
}
.site-branding .custom-logo-link {
 display:none;
}
.site-navigation-fixed .custom-logo-link {
 display:block;
}
.navigation-top #site-navigation {
 clear:none;
 float:left;
}
*/

.navigation-top .custom-logo-link {
 display:none;
 float:left;
}
/*.site-branding .custom-logo-link {
 display:none;
}*/
.site-navigation-fixed .custom-logo-link {
display:block;
}

/*make the logo in the navigation smaller*/
.site-navigation-fixed .custom-logo {
width: 10rem;
}

/*.site-navigation-fixed instead of .navigation-top*/
.site-navigation-fixed #site-navigation{
 clear:none;
 float:left;
}


@media screen and (max-width: 30em) {
.site-header {
	height: 8em;
    background-color: blue;
    position: relative;
	}
}

@media screen and (min-width: 30em) {
.site-header {
	height: 6em;
    background-color: blue;
    position: relative;
	}
}


/* http://www.wpbeginner.com/wp-themes/how-to-add-a-wordpress-widget-to-your-website-header/*/
/*
.teldroitemenu {
    float: right;
    padding-top :1em;
    
}  

@media screen and (max-width: 30em) {
.teldroitemenu {
    padding-left: 2em;
    float: left;
    padding-top :0em;
	}   
}  

*/




/* 
h2.chw-title {
    margin-top: 0px;
    text-align: right;
    text-transform: uppercase;
    font-size: small;
    width: 130px;
    padding: 5px;
    }

*/

/*https://wordpress.org/support/topic/how-to-make-the-logo-round-move-it-on-menubar-in-twenty-seventeen-theme/page/2/*/
/*
.has-header-image.twentyseventeen-front-page .site-branding, 
.has-header-video.twentyseventeen-front-page .site-branding, 
.has-header-image.home.blog .site-branding, 
.has-header-video.home.blog .site-branding {
    display: block;
    left: 0;
    margin-top: 4px;
    padding: 0;
    position: absolute;
    top: 75vh;
    z-index: 10;
}

.site-title {
    font-size: 1em;
}

body.has-header-image .site-title, 
body.has-header-video .site-title, 
body.has-header-image .site-title a, 
body.has-header-video .site-title a,
body.has-header-image .site-description, 
body.has-header-video .site-description {
    color: black;
}

.custom-logo-link img, 
body.home.title-tagline-hidden.has-header-image .custom-logo-link img, 
body.home.title-tagline-hidden.has-header-video .custom-logo-link img {
    max-width: 60px;
}

@media screen and (max-width: 500px) {    
    .has-header-image.twentyseventeen-front-page .site-branding, 
    .has-header-video.twentyseventeen-front-page .site-branding, 
    .has-header-image.home.blog .site-branding, 
    .has-header-video.home.blog .site-branding {
        left: 0;
        top: auto;
    }

    .menu-toggle {
        margin-left: 200px;
    }
}

@media screen and (min-width: 500px) {    
    .has-header-image.twentyseventeen-front-page .site-branding, 
    .has-header-video.twentyseventeen-front-page .site-branding, 
    .has-header-image.home.blog .site-branding, 
    .has-header-video.home.blog .site-branding {
        left: -30px;   
    }

    .menu-toggle {
        margin-left: 45%;
    }
}

@media screen and (min-width: 760px) {    
    .has-header-image.twentyseventeen-front-page .site-branding, 
    .has-header-video.twentyseventeen-front-page .site-branding, 
    .has-header-image.home.blog .site-branding, 
    .has-header-video.home.blog .site-branding {
        left: 0;
        margin-top: 0;
        top: 5px;
    }

    .navigation-top nav {
        margin-left: 250px;
    }
}

.menu-top-menu-container {
    margin-top: 1.0em;
}
*/


/*http://jimmyknoll.com/restyle-twenty-seventeen-theme-using-css/
6. Remove sidebar from single post page in twenty seventeen theme and make post page full width


.single-post #secondary {
display: none !important;
}

.single-post #primary {

width: 100% !important;
}
*/
/* https://karavadra.net/reduce-size-front-page-panels-twenty-seventeen-theme/ */
/* Mobile view*/
.panel-image {
	/*background-position: center center;*/
	/*background-repeat: no-repeat;*/
	/*-webkit-background-size: cover;*/
	/*background-size: cover;*/
	/*position: relative;*/
	height: 5vh;
}
 
/*Full screen laptop/computer screen view*/
@media screen and (min-width: 48em) {
	.panel-image {
		/*height: 100vh;*/
		height: 5vh;
		/*max-height: 1200px;*/
	}
}

/* https://karavadra.net/reduce-header-height-size-twenty-seventeen-theme-front-page/ */
/*Computer screen */
@media screen and (min-width: 48em) {
	.twentyseventeen-front-page.has-header-image .custom-header-image {
	/*height: 1200px;*/
	/*height: 100vh;*/
	/*enleveé pour debugué ligne titre accueil height: 5vh;*/
	/*max-height: 100%;*/
	/*overflow: hidden;*/
	}
}
 
/* Mobile screen*/
.has-header-image.twentyseventeen-front-page .custom-header {
	/*display: table;*/
	/*height: 300px;*/
	/*height: 75vh;*/
	height: 5vh;
	/*width: 100%;*/
}
 
/* Computer screen with logged in user and admin bar showing on front end*/
@media screen and (min-width: 48em) {
	.admin-bar.twentyseventeen-front-page.has-header-image .custom-header-image {
	/*height: calc(100vh - 32px);*/
	height: calc(50vh - 32px);
	}
}

/* normal 75%*/
.content-area {
	width: 100%;
}


/* largeur menu %*/
/*


/*
.navigation-top .wrap {
max-width: 100%;
position: relative;
padding: 0.75em 3.4166666666667em;
}

@media screen and (min-width: 48em) {
.navigation-top .wrap {
max-width: 100%;
position: relative;
padding: 0.75em 3.4166666666667em; 
}
}
*/

 /*largeur 1200 semble un max pour l'instatn*/

 
 
/* 
 @media screen and (min-width: 67em)
.navigation-top .wrap {
	width: 1200px;
    padding: 0.75em 2em;
}
 
 @media screen and (min-width: 48em)
.navigation-top .wrap {
    max-width: 1200px; 
    padding: 0.75em 2em;
}
  
 
 @media screen and (min-width: 48em)
.main-navigation {
    width: 1200px;
}
*/ 
 
  /*marge (au-dessus) menu  */	
@media screen and (min-width: 30em) {
.wrap,
.navigation-top .wrap{

		max-width: 1200px;
		padding-left: 2em;
		padding-right: 2em;
		padding-top: 1.5em;
		padding-bottom: 0.5em;
	}
}


 /*marge au-dessus titre page  (5.5em) permettant au titre de glisser sous le menu*/	
@media screen and (max-width: 30em) {
	.site-content {
		border-top: 6em solid;
		border-top-color: #ff9f1a;
		padding: 1em 0 0;
		/*background-color: red;*/
			
	}
}

@media screen and (min-width: 30em) {
	.site-content {
		border-top: 3em solid;
		border-top-color: #ff9f1a;
		padding: 0em 0 0;
		/*background-color: red;*/
			
	}
}

@media screen and (min-width: 30em) {
.twentyseventeen-front-page .site-content {
    	border-top: 3em solid !important;
		border-top-color: #ff9f1a !important;
		padding: 1em 0 0;
		/*background-color: red;*/
			
	}
}



@media screen and (min-width: 48em){

.panel-content .wrap {
    padding-bottom: 4.5em;
    padding-top: 0em;
}
}

@media screen and (min-width: 30em) {

.panel-content .wrap {
    padding-bottom: 2em;
    padding-top: 1.5em;
}
}


@media screen and (min-width: 30em) {

.panel-content .entry-header {
    margin-bottom: 1em;

}
}

/* bidouille coouleur autour titre */
/*@media screen and (min-width: 48em){
body:not(.has-sidebar):not(.page-one-column) .page-header, body.has-sidebar.error404 #primary .page-header, body.page-two-column:not(.archive) #primary .entry-header, body.page-two-column.archive:not(.has-sidebar) #primary .page-header {
   /* float: left;*/
  /*  width: 150%;
    background-color: blue;
    padding-top: 1em;
    padding-left: 5em;
    padding-right: 5em;
}
}
*/


/*
.page .panel-content .entry-title, .page-title, body.page, twentyseventeen-front-page .entry-title {
    color: #222;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

*/

@media screen and (min-width: 50em) {
.entry-header .entry-title {
    width: 55em;
	}
}


 /*marge avant footer  (3.25em)*/
.page:not(.home) #content {
	    padding-bottom: 1.25em;
	    /*background-color: yellow;*/
	    /*height: 50em;*/
		
}

 /*largeur contenu page*/

	.blog:not(.has-sidebar) #primary article,
	.archive:not(.page-one-column):not(.has-sidebar) #primary article,
	.search:not(.has-sidebar) #primary article,
	.error404:not(.has-sidebar) #primary .page-content,
	.error404.has-sidebar #primary .page-content,
	body.page-two-column:not(.archive) #primary .entry-content,
	body.page-two-column #comments {
		padding-top:2em;
		float: right;
		width: 100%;
		/*height:50em; probleme cela glisse sous menu*/
		/*background-color: blue;*/
		
	}
	
	 /*largeur contenu article*/
	.single-post:not(.has-sidebar) #primary, .page.page-one-column:not(.twentyseventeen-front-page) #primary, .archive.page-one-column:not(.has-sidebar) .page-header, .archive.page-one-column:not(.has-sidebar) #primary {
    margin-left: auto;
    margin-right: auto;
    max-width: 1200px;
}


/*masquer image à la une*/	
	.single-featured-image-header {
    display: none;
}
/*masquer par auteur date article*/
.entry-meta a {
    display: none;
}
.single .byline, .group-blog .byline {
    display: none;
}
/*masquer precedent suivant*/
.post-navigation .nav-links {
    display: none;
    padding: 0em 0;
}




/* début http://stackoverflow.com/questions/26090244/responsive-table-by-columns */
@media all and (max-width:48em){
    /*.page-template-page-templatesgesa-width-php */
    .table{
        width:80%;
    }
    td{
        display:block;
        width:80%;
    }
    tr{
        display:block;
        margin-bottom:30px;
    }
    tr tr{
        margin-bottom:0;
    }
}
/*@media all and (max-width:30em){
 /*.page-template-page-templatesgesa-width-php */ 
   /* .table{
        width:60%;
    }
    td{
        display:block;
        width:60%;
    }
    tr{
        display:block;
        margin-bottom:20px;
    }
    tr tr{
        margin-bottom:0;
    }
}
/* fin http://stackoverflow.com/questions/26090244/responsive-table-by-columns */		
/* début http://stackoverflow.com/questions/26090244/responsive-table-by-columns */
@media all and (max-width:30em){
    table{
        width:100%;
    }
    td{
        display:block;
        width:100%;
    }
    tr{
        display:block;
        margin-bottom:30px;
    }
    tr tr{
        margin-bottom:0;
    }
}

tr {
    border-bottom: none; 
}
/* fin http://stackoverflow.com/questions/26090244/responsive-table-by-columns */


.widget {
    padding-bottom: 1em;
}

.site-footer .widget-area {
    padding-bottom: 1em;
    padding-top: 2em;
}	


@media screen and (min-width: 48em) {
.site-footer .widget-column.footer-widget-1 {
    float: left;
    width: 36%;
    padding-left: 5em;
	}	
}


@media screen and (min-width: 48em) {
.site-footer .widget-column.footer-widget-2 {
    float: right;
    width: 58%;
    padding-left: 19em;
	}	
}

@media screen and (min-width: 48em) {

.site-info {
    float: right;
    padding: 0.7em 0 0;
    width: 58%;
    padding-left: 19em;
	}	
}

/*maxbutton Donneur d'ordre */
.maxbutton-6.maxbutton.maxbutton-esp-donneur-d-ordre-bf {
    position: relative;
    margin-left: 40px;
}


/*WORDPRESS UPLOAD PRO PLUGIN autres modifications dans custom CSS des reglages plugin */



table.file_table_clean, table.file_messageblock_table {
  margin: 0;
  border: none;
}
tr td.file_td_clean, table.file_messageblock_table tr td {
  padding: 0;
  border: none;
}
span.file_title_clean {
  font: initial;
  font-size: 20px;
  margin-bottom: 4px;
  display: inline-block;
  text-shadow: 1px 1px 0px #fff;
  color: #333
}
label.file_userdata_label {
  display: inline-block;
  color: #333;
}
input.file_userdata_message[type="text"], input.file_input_textbox[type="text"] {
  background: none repeat scroll 0% 0% #FAFAFA;
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1) inset;
  border: 1px solid #ff9f1a;
  border-radius: 3px;
  /*color: #0066CC;*/
  padding: 0.3em;

}

div.file_div_clean input[type="button"], div.file_div_clean input.file_input_submit[type="button"] {
  background-image: none;
  background-color: rgb(0, 102, 204);
  color: rgb(255, 244, 249);
  border: medium none;
  border-radius: 2px;
}
div.file_div_clean input.file_input_button_hover[type="button"], div.file_div_clean input.file_input_submit[type="button"]:hover, div.file_div_clean input.file_input_submit[type="button"]:focus {
  background-color: #4D94DB;
}
div.file_messageblock_header {
  background-color: rgb(255, 235, 242);
  border: 1px solid rgb(177, 69, 98);
  color: rgb(137, 30, 66);
}
table.file_messageblock_table div {
  padding: 8px;
}
td.file_messageblock_arrow_td div, td.file_messageblock_filearrow_td div {
  padding: 0;
}
div.file_messageblock_header, div.file_messageblock_fileheader {
  background-color: #FFD8E8 !important;
  border: medium none !important;
  color: rgb(137, 30, 66) !important;
}

/*Smart grid-layout for Contact 7 */
/*https://www.romainvincent.com/creer-un-formulaire-responsive-2-colonnes-contact-form-7/ */



#formulaire-responsive {
	max-width:800px /*-- à modifier en fonction de la largeur désirée --*/;
	margin:0 auto;
        width:100%;
}
.rang-form {
	width: 100%;
}
.demi-colonne, .colonne, .tiers-colonne, .quart-colonne {
	float: left;
	position: relative;
	padding: 0.65rem;
	width:100%;
	-webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
}
.demi-colonnered, .colonnered, .tiers-colonnered, .quart-colonnered {
	float: left;
	position: relative;
	padding: 0.65rem;
	width:100%;
	color:red;
	-webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
}


.clearfix:after {
	content: "";
	display: table;
	clear: both;
}

/**---------------- Media query ----------------**/
@media only screen and (min-width: 48em) { 
	.colonne {
		width: 100%;
	}
}	
@media only screen and (min-width: 48em) { 
	.demi-colonne {
		width: 50%;
	}
}	
@media only screen and (min-width: 48em) { 
	.tiers-colonne {
		width: 33%;
	}
}
@media only screen and (min-width: 48em) { 
	.quart-colonne {
		width: 25%;
	}
}
@media only screen and (min-width: 48em) { 
	.colonnered {
		width: 100%;
		color:red;
	}
}
@media only screen and (min-width: 48em) { 
	.demi-colonnered {
		width: 50%;
	}
}	
@media only screen and (min-width: 48em) { 
	.tiers-colonnered {
		width: 33%;
	}
}
@media only screen and (min-width: 48em) { 
	.quart-colonnered {
		width: 25%;
	}
}