/* Feuille de style complémentaire - PRIX TOPFFER - 2020*/

/************************* HTML ***********************************************/
@import url('font.css');

/*Couleurs*/
:root{--gray:rgb(235, 234, 241);--brown:rgb(74, 51, 39);--red:rgb(199, 70, 73);--winHeight:100vh;}
.gray{color: var(--gray);}
.brown{ color: var(--brown);}
.red{ color: var(--red);}

* {-moz-box-sizing:border-box; box-sizing: border-box;margin:0;padding:0;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
html{height:100%;}
body{font-family: "ES Formal";color: var(--brown);margin:0!important;padding:0;font-size:13px;min-height:100%;line-height:1.2em;background: var(--gray);}

h1, h2, h3, h4, h5, h6{font-family: "ES Formal Extended";line-height: 1em;color: var(--red);text-transform: uppercase;font-weight: 900;	padding: 0;margin: 0;}
h1{color: var(--brown);font-size: min(max(32px, 10vw),64px);}
h1.logo{text-align: center;margin: 0 auto;}
h1, h2, h4{/*text-align: center;margin: 0 auto;*/}
/*h1, h2{font-size: min(max(32px, 10vw), 78px);max-width: 12em;line-height: 0.8em;margin-bottom: 1rem;}*/
h1, h2{font-size: min(max(32px, 10vw), 34px);/*max-width: 12em;*/line-height:1em;margin-bottom: 1.2rem;}
h3{font-weight: 400;font-size: min(max(32px, 10vw),34px);}
h4{font-size: min(max(32px, 10vw),14px);border: 1px solid var(--red);border-radius: 100px;padding: 0.3em 0.8em 0.45em;line-height: 1em;display: table;letter-spacing: 0.3em;	margin: 1px auto;}
/*h4.laureat{background-color: var(--red);color: var(--gray);}*/
h5{font-size: min(max(32px, 10vw),16px);font-weight:400;margin-bottom:5px;}
strong{font-weight: 900;}
p, li{/*max-width: 40em;*/margin: 0 0 1.4em;font-weight: 400;font-size:15px;}
li{list-style:outside;margin-left:15px;margin-bottom:1em;}
a{color:var(--brown);text-decoration:underline;}
a:hover{color:var(--brown);text-decoration:underline;}

hr{border-top: 1px solid;color: var(--red);margin-top:25px;margin-bottom:25px;}

/*Typo*/
@font-face {font-family: 'tradeGothic-standard';src: url('../typo/trade-gothic-standard.eot?') format('eot'),url('../typo/trade-gothic-standard.otf') format('truetype'),
	url('../typo/trade-gothic-standard.woff') format('woff'),url('../typo/trade-gothic-standard.svg') format('svg');font-weight: normal;font-style: normal;}	
@font-face {font-family: 'tradeGothic-bold';src: url('../typo/trade-gothic-bold.eot?') format('eot'),url('../typo/trade-gothic-bold.otf') format('truetype'),
	url('../typo/trade-gothic-bold.woff') format('woff'),url('../typo/trade-gothic-bold.svg') format('svg');font-weight: normal;font-style: normal;}

/*retour en haut de page*/
#returnOnTop {background: url('../img/return_on_top.png') no-repeat;bottom: 1%;
    cursor: pointer;display: none;filter: alpha(opacity = 50); /* IE < 8 */height: 48px;
    opacity: 0.5;position: fixed;right: 1%;width: 48px;}
#returnOnTop:hover {filter: alpha(opacity = 100); /* IE < 8 */opacity: 1;}

/************************** HEADER ***********************************************/
header{width:100%;position:relative;background-image: url(../img/prixTopffer_Background_Autre.jpg);background-size: cover;background-position: center bottom;background-repeat: repeat-x;margin-bottom:60px;}
header a:first-child{text-decoration: none;}

.accueil header{width:100%;position: relative;background-image: url(../img/prixTopffer-Background-Pattern.jpg);background-size: auto 100%;
	background-position: center bottom ;background-repeat: repeat-x;/*display: flex;justify-content: center;*/}
h1.logo{color: var(--gray);width: 100%;max-width: 1280px;padding-top:25px;line-height: 0.8em;font-size: min(max(32px, 5vw), 65px);}
.accueil h1.logo{/*position: absolute;*/}
h1.logo div{display: flex;justify-content: space-between;padding: 0 2vw;}
h1.logo div:first-child{font-size: min(max(32px, 10.5vw), 140px);padding: 0.1em 1.6vw 0;line-height: 0.8em;}

.accueil h2{max-width: 370px;margin-left:auto;margin-right:auto;}
.accueil h3{max-width: 460px;margin-left:auto;margin-right:auto;}

body:not(.accueil) nav{width: 100%;background:url(../img/prixTopffer-Background-Pattern_Autre2.jpg) var(--gray);/*background-color:var(--gray);*/background-position:top; background-size: auto;background-repeat: repeat-X;bottom: 0;z-index: 3;padding-top:40px;}

/*#banner{width:100%;height: var(--winHeight);background-image: url(../img/prixTopffer-Accueil_2.png);background-position: center bottom;background-size: auto 100%;background-repeat: no-repeat;position:relative;z-index: 2;margin-top:-150px;}*/
#banner{width:100%;height: var(--winHeight);background-image: url(../img/prixTopffer-Accueil_2.png);background-position: center bottom;background-size: auto 70%;background-repeat: no-repeat;position:relative;z-index: 2;margin-top:-345px;min-height: 735px !important;max-height: 800px !important;}


/*bouton*/
.btn{border:solid 1px rgba(35,31,32,1) !important;border-radius: 100px;padding:0.4em 0.8em 0.2em;text-transform: uppercase;cursor: pointer;}
.card {padding:0;margin:15px 0;background:none !important;border:none;}

/*Navigation*/
.navbar{padding:0;/*padding:0 45px 0 45px;*/margin:0;z-index:5;border:none;}
.navbar-brand{padding:0;margin:0;}
	.navbar-brand a{padding:0;margin:0;}
.navbar-custom{margin:0;}
/*.navbar-custom ul{padding: 1em;max-width: 1280px;margin: 0 auto;list-style: none;display: flex;justify-content: center;}*/
.navbar-custom li{margin:0px 0 4px 0; list-style: none !important;}
	.navbar-custom li:last-child{margin-right:0;}
.navbar-custom li a{font-family: "ES Formal Extended";color: var(--brown);border: 1px solid transparent;background-color: transparent;	border-radius: 100px;padding:0.45em 0.8em 0.3em;/*padding:0.3em 0.8em 0.45em;*/text-transform: uppercase;	cursor: pointer;text-decoration: none !important;}
.navbar-custom li>.active{border-color: var(--brown);}
/*.navbar-custom li>.active>a:focus, .navbar-custom li>.active>a:hover{border-color: white;color: var(--brown);background-color: white;}*/
.navbar-custom li a:focus, .navbar-custom li a:hover{border-color:white;background-color:white;}
.active{text-decoration:underline !important;}
	.navbar-custom>.open>a, .navbar-custom>.open>a:focus, .navbar-custom>.open>a:hover{}
.navbar-toggler{border:solid 1px rgba(35,31,32,1) !important;border-radius: 100px;padding:0.45em 0.8em 0.3em;text-transform: uppercase;cursor: pointer;}


/************************** CONTENT ***********************************************/
#container{overflow:none;padding-top:0;padding-bottom:25px;padding-left:125px;padding-right:125px;border:none;text-align:left;margin:0 auto 0 auto;max-width:1500px;}
#content a{color:var(--red);text-decoration:none !important;}

/*Nominé / Lauréat*/
.laureat{border: 1px solid var(--red);border-radius: 100px;padding: 0.45em 0.8em 0.3em;line-height: 1em;display: table;letter-spacing: 0.3em;	margin: 1px auto;background-color: var(--red);	color: var(--gray);}
.nomine{border: 1px solid var(--red);border-radius: 100px;padding: 0.45em 0.8em 0.3em;line-height: 1em;display: table;letter-spacing: 0.3em;margin: 1px auto;}

/*Introduction*/
.intro{text-align:center;margin: 0 auto 20px auto !important;}
	.intro h1, .intro h2{font-size:min(max(32px, 10vw), 50px) !important;}
	.intro h2{margin-top:40px;}
	.intro h1, .intro h2, .intro p{max-width:100% !important;}

/*Auteur*/
.auteur{margin-bottom:40px;}
	.auteur div{}
	.auteur h1{font-size:min(max(32px, 10vw), 30px) !important;}
	.auteur h2{font-size:min(max(32px, 10vw), 30px) !important;}
	.auteur h1, .auteur h2, .auteur h4{max-width:100% !important;}
	.auteur h4{margin-bottom:15px;}
	

/*Nav-tabs / historique*/
.nav-pills{padding-top:0 !important;margin-bottom:20px;border:none;background-image: none !important; background-color:transparent !important;}
.nav-pills a{color:var(--brown) !important;font-family: "ES Formal Extended";color: var(--brown);border: 1px solid transparent;background-color: transparent;	border-radius: 100px;padding:0.45em 0.8em 0.3em;/*padding:0.3em 0.8em 0.45em;*/text-transform: uppercase;cursor: pointer;text-decoration: none !important;font-size:1rem;}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link{font-family: "ES Formal Extended";color: var(--brown);border: 1px solid  var(--brown);background-color: transparent;	border-radius: 100px;padding:0.45em 0.8em 0.3em;text-transform: uppercase;cursor: pointer;text-decoration: none !important;}
.nav-pills .nav-link:focus, .nav-pills .nav-link:hover{	border-radius: 100px;padding:0.45em 0.8em 0.3em;border-color:white;background-color:white;}
.tab-content .active{text-decoration:none !important;}
.historique h3{font-weight: 400;font-size: min(max(32px, 10vw),20px);margin-bottom:10px;}
.historique h4{font-size: min(max(32px, 10vw),14px);border: 1px solid var(--red);border-radius:100px;padding:0.45em 0.8em 0.3em;line-height:1em;display:block;letter-spacing:0.3em;margin-bottom:25px;}
.historique li{margin-bottom:5px;}


/*Videos accueil*/
.superPlayer {position:relative;padding-bottom:75%;height:0;overflow:hidden;margin:0 0 20px 0;}
.superPlayer iframe {position:absolute;top:0;left:0;width:100%!important;height:100%!important;}

/*Boutons*/
button{appearance: none;font-family: "ES Formal Extended";color: var(--brown);background-color: transparent;border: 1px solid var(--brown);
	border-radius: 100px;padding: 0.3em 0.8em 0.45em;text-transform: uppercase;cursor: pointer;font-size: 1em;}
button:hover{background-color: white;border-color: white;}

/*Row*/
.row{margin-left:0;margin-right:0;/*padding-left:125px;padding-right:125px;*/margin-bottom:100px;}
.no-padding > [class*='col-'] {padding:0 !important;}
/*.no-padding{padding-left:0;padding-right:0 !important;}*/
.no-margin-bottom{margin-bottom:0 !important;}

.cartouche{clear:both;float:none;text-align: center;}
	.cartouche ul{margin-bottom:25px;margin-left:25px;}
	.cartouche h4{display:none;}
	.cartouche .inf-main_646e058fac455de8d1e52c4c49baac06{background:none;padding:0;}
	.cartouche .inf-input{width:70%;border-radius:100px;padding:0.2em 0.8em 0.2em ;border-color:white;background-color:white;float:left;}
	.cartouche .inf-submit input{font-family: "ES Formal Extended";font-size:1.05rem !important;line-height:1.5em;color:var(--brown) !important;background:transparent !important;border:solid 1px rgba(35,31,32,1) !important;border-radius: 100px;padding:0.45em 0.8em 0.3em !important;text-transform: uppercase;cursor: pointer;}


.grid{border:none;}
.element-item{margin:0 20px 20px 0;background:#fff;/*border:solid 1px #000;*/padding:0px;}
	/*.element-item span{float:left;background:#000;padding:1px 6px 1px 6px;color:#fff;margin:5px 8px 0 0;font-size:12px;}*/
	.element-item a{text-decoration:none;}
    .element-item a:hover, .element-item a:focus{text-decoration:underline;}
	.element-item h1{margin:0 0 5px 0;font-size:22px;}
	.element-item h2{margin:5px 0 5px 0;font-size:13px;line-height:18px;}
	.element-item p{margin-bottom:20px;}

.galerie a{float:left;margin:0 15px 15px 0;}

.galerie_presse{margin-bottom:40px;}
	.galerie_presse li{list-style:none;margin-bottom:15px;}
	.galerie_presse a{text-decoration:none;font-size:12px;height:390px;}
	.galerie_presse a:hover{text-decoration:underline;}

/*.chocolat{background:url(../img/prixTopffer-Footer-1.png) no-repeat center center;width:907px;height:303px;}*/
.chocolat{margin-top:20px;background:url(../img/prixTopffer-Footer-1.png) no-repeat center center;height:250px;background-size:contain;}

/************************* FOOTER *************************************************/
/*.couleur8_1{background-color:rgba(250,234,176,1) !important;}
.couleur8_2{background-color:rgba(216,228,232,1) !important;}*/

.couleur8_1{background-color:rgba(228,232,194,1) !important;}
.couleur8_2{background-color:rgba(74,91,134,1) !important;}

#container-footer{display:block !important;margin:0;max-width:100%;padding:0;color:#333 !important;}
	#container-footer .row{margin-bottom:0px !important;padding-left:125px;padding-right:125px;transition:0.3s;}
	#container-footer .row .row{padding-left:0;padding-right:0;}
	#container-footer .row .row .col-xl-12{margin-bottom:0 !important; }
#container-footer .row .row .col-xl-6:last-child{margin-bottom:0px !important;}
	#container-footer h5{color:#333 !important;font-family:tradeGothic-bold,Arial, Helvetica, sans-serif !important;margin:0 0 20px 0;font-size:1.25rem;text-transform: none !important;font-weight:normal;}
	#container-footer li, #container-footer p{font-family:tradeGothic-standard,Arial, Helvetica, sans-serif !important;font-size:14px;line-height:22px;}

	#container-footer li{margin-bottom:5px !important;margin-left:0 !important;}

    #container-footer a{font-family:tradeGothic-standard,Arial, Helvetica, sans-serif !important;text-decoration:none;color:#333 !important;}
    #container-footer .row{border:none !important;}

/*Première partie*/
.premiere{padding-top:40px;padding-bottom:40px;margin:0;}
	.premiere ul{list-style:none;margin:0;padding:0;}
	.premiere ul li{line-height:40px !important;display:inline;margin-right:5px;white-space: nowrap;}
	.premiere li a{border:solid 1px #000;border-radius:20px;padding:3px 8px 5px 8px;}
	.carrousel{max-width:470px;}
	.carrousel div img{border-radius:20px;}
	.carrousel .slick-prev{position:absolute;top:50px;left:20px;z-index:99;cursor:pointer;}
	.carrousel .slick-next{position:absolute;top:50px;right:20px;z-index:99;cursor:pointer;}
.d-inline-flex{padding-bottom:30px;}

/*Deuxième partie*/
.deuxieme{padding-top:40px;padding-bottom:40px;margin:0;}
	.deuxieme ul{list-style:none;margin:0;padding:0;}
	.deuxieme ul li{display:block;margin-right:5px;word-break:keep-all;}
	#container-footer .deuxieme a, #container-footer .deuxieme h5, #container-footer .deuxieme p{color:#fff !important;}
.resauxSociaux{margin-top:40px;}
	.resauxSociaux a{margin-right:10px;}
.logos-partenaires img{margin:0 20px 20px 0;}


/*Partie institutionnelle*/
.institutionnel{background-color:#fff !important;padding-top:20px;padding-bottom:20px;margin-bottom:0;}

/************************* RESPONSIVE CLASSES*************************************/
@media screen and (min-width:1280px){
	h1.logo div:first-child{ padding: 0.1em 0.6rem 0; }h1.logo div{ padding: 0 1rem;} 
}

@media (max-width:1200px) {
	/*#banner{background-size: auto 105%; background-position: center top;margin-top:-120px;}*/
	#banner{background-size: auto 55%; background-position: center bottom -10px;margin-top:-435px;min-height:750px !important;}
	/*#header .logo{padding-left:60px;padding-right:60px;}*/
	#header h1{font-size:4em;line-height:0.76em;transition:0.2s;}
	#header h1 span{margin-left:-10px;transition:0.2s;}
	
	#header h2{font-size:1em;transition:0.2s;}
	/*p, li{line-height:1.1em;font-size:1.5em;margin-bottom:18px;}*/
	#container .row{margin-bottom:40px !important;}
	/*#container .row:not(.auteur), #container-footer .row{padding-left:60px;padding-right:60px;transition:0.3s;}*/
	#container-footer .row{margin-bottom:0px !important;padding-left:60px;padding-right:60px;transition:0.3s;}
	#container-footer [class*='col-']{margin-bottom:40px !important;}
	#container-footer .double [class*='col-']:last-child{margin-bottom: 0 !important;}
}

/*@media screen and (max-height: 1080px){.accueil header #banner{background-size: auto 100%; }}
@media screen and (max-width: 992px) and (max-height: 1080px){.accueil header #banner{background-size: auto 95%; background-position: center top;}}*/

@media (max-width:992px) {
	/*#header .logo{padding-left:40px;padding-right:40px;}*/
	.accueil header{background-size: 1080px; background-position: center top -30px;background-repeat:no-repeat;background-color:var(--gray);}
	#container{margin-top:0px;padding-left:40px;padding-right:40px;}
	.navbar-collapse{margin-top:20px;}
	.navbar-custom li a{font-size:14px;font-weight:normal;padding:2px 5px 2px 5px;}
	h1.logo{top:0;padding-top:5px;}
	h1.logo div:first-child {display: block;padding: 0.1em 0.6rem 0.3rem;font-size: min(max(32px, 16vw), 100px);line-height: 0.764em;}
	h1.logo div:first-child span{display: block;}
	h1.logo div{ padding: 0 1rem;font-size: min(max(24px, 5vw), 65px);line-height: 0.8em;} 
	h1, h2, h3{font-size: min(max(32px, 10vw), 30px);/*max-width: 12em;*/line-height:1em;margin-bottom: 1.2rem;}
	p, li{line-height:1.1em;font-size:1.5em;margin-bottom:18px;}
	/*#banner{background-size: auto 50%; background-position: center bottom -5px;margin-top:-500px;}*/
	.chocolat{background-image:url(../img/prixTopffer-Footer-mobile.png);/*min-height:218px;min-width:625px;*/}
	.cartouche .inf-input{width:50%;border-radius:100px;padding:0.2em 0.8em 0.2em ;border-color:white;background-color:white;float:left;}
	
	.auteur [class*='col-'], .intro [class*='col-'], .texte-contenu [class*='col-']{padding-left:0;padding-right:0;}
	#container-footer .row, {margin-bottom:0px !important;padding:40px 20px 0 20px;}
	#container{}
	#container-footer .double{margin-bottom: 0 !important;}
	#container-footer .col-xl-2 h5, #container-footer .col-xl-3 h5{margin-top:2px;}
    /*#container .row,#container-footer .row{margin-bottom:0px !important;padding-left:40px;padding-right:40px;transition:0.3s;}*/
	#container-footer .row{margin-bottom:0px !important;padding:40px 20px 0 20px;}
	#container-footer .row:last-child{padding-top:20px;padding-bottom:20px;}
	.premiere, .deuxieme{padding-bottom:0;}
	.d-inline-flex{padding-bottom:0 !important;}
	}

@media (max-width:768px) {
	.row{margin-bottom:40px;}
	.auteur .col-lg-6:last-child{margin-top:40px;}
}

@media screen and (min-width:520px) and (max-width:992px){
	#banner{height:500px !important;background-size: auto 55%; background-position: center bottom -10px;margin-top:-435px;}
}
