/* cmsms stylesheet: styles-screen modified: lundi 23 octobre 2023 22:13:15 */
/**
 * @CSS DOCUMENT
 * @ 10.10.2016
*/
@font-face{
	font-family:"DrescherGroteskBTW01-Bo1119541";
	src:url("https://grain-de-moutarde.ch/Fonts/32fe4f63-966b-44cb-b1a6-d2911bedc7d6.eot?#iefix");
	src:url("https://grain-de-moutarde.ch/Fonts/32fe4f63-966b-44cb-b1a6-d2911bedc7d6.eot?#iefix") format("eot"),url("https://grain-de-moutarde.ch/Fonts/30d2df0a-cb52-4983-a1bd-c21a040ecf5c.woff2") format("woff2"),url("https://grain-de-moutarde.ch/Fonts/6fb729cb-4316-4fb0-95bf-39bfff0bdfa9.woff") format("woff"),url("https://grain-de-moutarde.ch/Fonts/2d9361c1-3cf5-4d72-aca3-ae57a5374e35.ttf") format("truetype"),url("https://grain-de-moutarde.ch/Fonts/fbff1e5f-b54f-41f5-9943-f0f8a1936efa.svg#fbff1e5f-b54f-41f5-9943-f0f8a1936efa") format("svg");
}
@font-face{
	font-family:"HelveticaNeueLT47";
	src:url("https://grain-de-moutarde.ch/Fonts/ee259578-3cae-4dd8-a23a-297d352ec2dc.eot?#iefix");
	src:url("https://grain-de-moutarde.ch/Fonts/ee259578-3cae-4dd8-a23a-297d352ec2dc.eot?#iefix") format("eot"),url("https://grain-de-moutarde.ch/Fonts/244ff804-5735-41ed-92a1-ce5438185e9c.woff2") format("woff2"),url("https://grain-de-moutarde.ch/Fonts/9cd26200-0d62-40ef-94b8-46fd1d8b255f.woff") format("woff"),url("https://grain-de-moutarde.ch/Fonts/7b72d33f-8b87-4c48-b397-42d28164d598.ttf") format("truetype"),url("https://grain-de-moutarde.ch/Fonts/07dba647-d830-4ba8-8b84-1e4c9858f3d3.svg#07dba647-d830-4ba8-8b84-1e4c9858f3d3") format("svg");
	}
@font-face{
	font-family:"HelveticaNeueLT77";
	src:url("https://grain-de-moutarde.ch/Fonts/1527aeed-e69d-4399-82e3-7b53d48da7a2.eot?#iefix");
	src:url("https://grain-de-moutarde.ch/Fonts/1527aeed-e69d-4399-82e3-7b53d48da7a2.eot?#iefix") format("eot"),url("https://grain-de-moutarde.ch/Fonts/5f4620bc-98f7-4b13-9f90-3a54ea6a9c55.woff2") format("woff2"),url("https://grain-de-moutarde.ch/Fonts/ac30e84e-cb19-4576-b6f9-491fccbd42ff.woff") format("woff"),url("https://grain-de-moutarde.ch/Fonts/b583b782-0709-4a13-899f-7e9ab1a7eccd.ttf") format("truetype"),url("https://grain-de-moutarde.ch/Fonts/d5dd03f5-3afb-46e9-aad0-234de8607afa.svg#d5dd03f5-3afb-46e9-aad0-234de8607afa") format("svg");
}
@font-face {
	font-family: 'fontello';
	src: url('https://grain-de-moutarde.ch/Fonts/fontello.eot?2093690');
	src: url('https://grain-de-moutarde.ch/Fonts/fontello.eot?2093690#iefix') format('embedded-opentype'),
       url('https://grain-de-moutarde.ch/Fonts/fontello.woff2?2093690') format('woff2'),
       url('https://grain-de-moutarde.ch/Fonts/fontello.woff?2093690') format('woff'),
       url('https://grain-de-moutarde.ch/Fonts/fontello.ttf?2093690') format('truetype'),
       url('https://grain-de-moutarde.ch/Fonts/fontello.svg?2093690#fontello') format('svg');
	font-weight: normal;
	font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'fontello';
    src: url('../font/fontello.svg?2093690#fontello') format('svg');
  }
}
*/
[class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  speak: none;
 
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */
 
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
 
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
 
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
 
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
 
  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
.icon-up-open:before { content: '\e806'; } /* '' */
.icon-left-open:before { content: '\e807'; } /* '' */
.icon-menu:before { content: '\f0c9'; } /* '' */
.icon-facebook-squared:before { content: '\f308'; } /* '' */

/**----------------- 
 * GLOBAL RESET 
-----------------**/
*, html, body, iframe, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, p, blockquote, table, th, td, audio, video { 
	margin:0; padding:0; outline:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; 
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, img { display:block; }
table { border-collapse:collapse; border-spacing:0; }
table td { vertical-align:top; }
iframe, fieldset, img, a img { border:0 none; }
address, caption, cite, code, dfn, th, var { font-style:normal; font-weight:normal; text-align:left; } 
h1, h2, h3, h5, h5, h6 { font-size:100%; }
blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; }
html>body * a { position:relative; }  /* Gets links displaying over a PNG background */
a { outline:none; } /* Gets rid of Firefox's dotted borders */
textarea, table, td, th, code, pre, samp { word-wrap: break-word; /* passage à la ligne forcé */
   -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; /* césure propre */
}
input, select { vertical-align:middle; }
ol, ul, li { list-style:none; }
strong, b { font-weight:bold; }
em, i { font-style:italic; }
img { width: 100%; }

/**------------------------------
 * GENERAL CLASSES and SETTINGS
--------------------------------**/
html, body { height: 100%; }
body { width:100%; font:1.0em/1.5em Arial,helvetica,sans-serif; color:#fff; text-align:left; background:#000; }

h1 { padding:40px 0 0.5em; font:normal 2.2em/1.0em "HelveticaNeueLT47",Arial,helvetica,sans-serif; color:#f57920; text-transform: uppercase; border-bottom: 2px solid #f57920; }
h2, h1.page-header { margin:0.5em 0; font:normal 1.6em/1.0em "HelveticaNeueLT77",Arial,helvetica,sans-serif; color:#f57920; text-transform: uppercase; }
h3 { margin:0.5em 0; font:normal 1.0em/1.0em "HelveticaNeueLT77",Arial,helvetica,sans-serif; color:#f57920; text-transform: uppercase; }
h4 { font:bold 1.0em/1.0em Arial,helvetica,sans-serif; }
h5 { font:bold 1.0em/1.0em Arial,helvetica,sans-serif; }
h6 { font:bold 1.0em/1.0em Arial,helvetica,sans-serif; }

a { color:#f57920; text-decoration:underline; }
a:hover, a:focus { color:#000; text-decoration:underline; }
p { margin:1em 0; /*max-width: 600px;*/ }

hr { display:block; margin:1em 0; padding:0; border:none; background-color:#f57920; color:#f57920; font-size:1px; height:1px; line-height:1px; }


/**--------------
	# Header
--------------**/
.header { position:fixed; top:0; left:0; width:100%; min-height:105px; background-color:#000; z-index:10; }
.header .wrapper { padding:0.5em 5% 1.5em; color:#fff; }
a.logo { width:260px; height: 120px; display:block; }
a.logo img { width:auto; height: 120px; }


/**********************************
	# Menu
**********************************/
#menu { padding: 1em 0 0; }
#toggle-menu { position:absolute; bottom:0; right:0; padding:1em 0.5em; cursor:pointer; display:block; font-size: 1.6em; line-height:1.0em; }
#menu.inactive { display:none; }
li.btn-menu a, li.btn-menu span { display:block; padding:0.4em; font:normal 1.6em/1.0em "HelveticaNeueLT47",Arial,helvetica,sans-serif; color:#fff; text-decoration:none; white-space:nowrap; text-align:center; cursor: pointer; }
li.btn-menu a:hover, #menu li.btn-menu a:focus, #menu li.current a, .menu-lang a.current { color:#f57920; } 
li.btn-facebook a, li.btn-close span { font-size:1em; }
li.btn-facebook { margin-top: 1em; }
li.btn-close { margin-top: 1em; border-top: 1px solid #333; padding-top:1em; }

/*************************************
	# Main, content
*************************************/
#main { position:relative; margin-top:152px; padding-bottom: 2em; color:#000; background-color:#fff; z-index:1; }
#main .wrapper {  }
.blk-content { margin-bottom: 2em; padding:0 5% 0; }

.blk-img { }
.text {  }
.text img { max-width:600px; }
.text ul { margin:0 0 1em 1em; }
.text ul li { margin:0.25em 0; list-style:disc; }
.text ol { margin:0 0 1em 1em; }
.text ol li { list-style:decimal; }
/*
.list-items { width:100%; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow:row wrap; flex-flow: row wrap; }
*/
.list-items { width:100%; }
.list-items .article { display:inline-block; position:relative; margin:1em 0; width:96%; -webkit-flex:none; -ms-flex:none; flex:none; }
.blk-news {  }
.blk-news img .blk-content img  { margin: 1em 0; }
.blk-news h1 { font-size:2.2em; }
.blk-news p { margin:0.5em 0; }
.blk-news a {  }
/*a.btn-back { display:block; padding:0 2em; line-height:47px; color:#080808; text-decoration:none; background:#fff url('https://www.grain-de-moutarde.ch/images/template/blk-corner.png') bottom left no-repeat; }*/
a.btn-back:hover { color:#e6172c; text-decoration:underline; }
a.btn-up { float: right; padding: 0 1em; }


/***************************************
	# Footer
***************************************/
#footer { }
#footer .wrapper { font-size:0.7em; text-align:left; color:#fff; background-color:#f57920; }
#footer a { color:#fff; text-decoration:none; }
#footer a:hover, #footer a:focus { color:#fff; text-decoration:underline; }
#footer .copyright { margin:0 0 0 5%; }


/***************************************
	# Formulaires
***************************************/
form { margin:1em 0; font-size: 0.9em; }
form p { clear:both; margin:0.3em 0; padding: 0; }
form label { display:block; float:left; padding:0.1em 1em; width:35%; min-width:100px; cursor:pointer; text-align:right; }
form input[type="text"], form input[type="password"], form input[type="email"], form textarea, form select { 
	font:1.0em/1.2em Arial,Helvetica,sans-serif; color:#080808; background-color:#fff; border:1px solid #ddd; padding:0.3em 0.5em; max-width: 350px; width:60%; 
}
form select { margin-bottom: 0.1em; padding: 0.2em 0.5em; }
form input[type="text"]:focus, form input[type="password"]:focus, form input[type="email"]:focus, form textarea:focus { border-color:#e6172c; }
form textarea { height:6em; }
form input[type="submit"], form input[type="button"] { 
	margin:1em 0 1em 35%; padding:0.3em 1em; font-family: Arial,Helvetica,sans-serif; font-size:1.0em; font-weight:bold; color:#fff; text-transform:uppercase; text-decoration:none; border:none; background-color:#f57920; box-shadow:0px 0px 2px 1px #000; cursor:pointer; 
}
form input[type="submit"]:hover, form input[type="submit"]:focus { background-color:#000000; color:#f57920; box-shadow:0px 0px 1px 0px #f57920; }

div.error_message, div.error_message ul li { margin:0.5em 0; font:normal 1.0em/1.0em "HelveticaNeueLT77",Arial,helvetica,sans-serif; color:#f57920; text-transform: uppercase; }
form div.required.fb_invalid label, form .fb_invalid { font-weight:bold; color:#f57920;  }

div.ck_0, div.ck_1, div.ck_2, div.ck_3, div.ck_4, div.ck_5 { clear: both; display:table;  width:100%; text-align:left; padding-left: 10%; }
div.ck_0 input[type="checkbox"], div.ck_1 input[type="checkbox"], div.ck_2 input[type="checkbox"], div.ck_3 input[type="checkbox"], div.ck_4 input[type="checkbox"], div.ck_5 input[type="checkbox"] { display:inline; float:none; padding:0.1em 1em; width:10%; text-align:right; }
div.ck_0 label, div.ck_1 label, div.ck_2 label, div.ck_3 label, div.ck_4 label, div.ck_5 label { float: none; display:inline; padding: 0.3em 0; width:90%; max-widht:350px; text-align:left; }

.captcha { clear:both; margin:1em 0 1em 35%; }
.captcha label { display:block; float:none; margin:0 0 0.5em 0; padding:0; width:100%; text-align:left; }
.captcha img { border:medium none; float:left; margin:0 0.5em 0.5em 0; width:200px; border-radius:inherit; }
.captcha .form-field { height:50px; width:140px; text-align:center; letter-spacing:0.4em; text-transform:uppercase; }


/***************************************
	# Classes diverses
***************************************/
.floatLeft, .floatRight { margin:1em 0; }
.imgToLeft, .imgToRight { margin:1em 0; }

.clear-float { clear:both; }
.clear-fix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clear-fix { zoom:1; } /* IE 5.5/6/7 */



/**=====================================================
   ECRANS smartphones paysage
====================================================== */
@media (max-width:959px) {
	.menu-lang { top:0; right:0; }
}


/**=====================================================
   ECRANS taille moyenne : tablettes, petits notebooks
====================================================== */
@media (min-width:640px) {
	h1 { font-size: 3em; }
	.floatLeft { float:left; margin-right:1em; padding-right:1em; width:50%; }
	.floatRight { float:right; padding-left:1em; width:50%; }
	.imgToLeft { float:left; margin:0 1em 1em 0; padding-right:1em; width:40%; }
	.imgToRight { float:right; margin:0 0 1em 1em; padding-left:1em; width:40%; }
	.blk-news img,  { float:left; width: 40%; margin: 0 1em 1em 0; }
.tablelike { display:table; text-align: center; table-layout: fixed; border-collapse:collapse;  }
.sponsors { display:table; text-align: center; table-layout: fixed; border-collapse:collapse; }
.BlcFloatLeft { display:table-cell; padding:0.5em; text-align:center;  vertical-align:middle; }
.BlcFloatLeft img { max-width:250px; }
div.ck_0, div.ck_1, div.ck_2, div.ck_3, div.ck_4, div.ck_5 { padding-left: 30%; }
}

@media (min-width:960px) {
	.header { margin-left: 5%; width:30%; height:100%; text-align:center; }
	.header .wrapper { padding:0 0 2em; }
	.header a.logo { margin:40px auto; }
    #main { margin-top:0; margin-left:35%; width:60%; min-height:600px; }
	#toggle-menu { display: none; }
	#menu.inactive { display: block; }
	li.btn-close { display: none; }
	#footer .wrapper { padding:0 5% 0 35%; }
	.text {  }
	.blk-news img  { float:left; width: 35%; margin: 0 1em 1em 0; }
}



/**=====================================================
   ECRANS + grands
====================================================== */
@media (min-width:1620px) {
    /*
    .list-items .article { width:47%; margin:0 3% 2em 0; }
    */
    .blk-news img .blk-content img  { width: 30%; }
}