/* cmsms stylesheet: stylesERF modified: mardi 12 septembre 2023 12:07:46 */
/**
 * @CSS DOCUMENT
 * @ 07.2022
*/

@font-face {
    font-family: 'nexa_rust_extrasfree';
    src: url('https://en-route-fiston.ch/fonts/nexarustextras-free-webfont.woff2') format('woff2'),
         url('https://en-route-fiston.ch/fonts/nexarustextras-free-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'nexa_rust_handmadeextended';
    src: url('https://en-route-fiston.ch/fonts/nexarusthandmade-extended-webfont.woff2') format('woff2'),
         url('https://en-route-fiston.ch/fonts/nexarusthandmade-extended-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'nexa_rust_sansblack';
    src: url('https://en-route-fiston.ch/fonts/nexarustsans-black-webfont.woff2') format('woff2'),
         url('https://en-route-fiston.ch/fonts/nexarustsans-black-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'nexa_rust_script_lregular';
    src: url('https://en-route-fiston.ch/fonts/nexarustscriptl-0-webfont.woff2') format('woff2'),
         url('https://en-route-fiston.ch/fonts/nexarustscriptl-0-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'arialnarrow';
    src: url('https://en-route-fiston.ch/fonts/arial_narrow-webfont.woff2') format('woff2'),
         url('https://en-route-fiston.ch/fonts/arial_narrow-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
	font-family: 'fontello';
	src: url('https://en-route-fiston.ch/fonts/fontello.eot?2093690');
	src: url('https://en-route-fiston.ch/fonts/fontello.eot?2093690#iefix') format('embedded-opentype'),
       url('https://en-route-fiston.ch/fonts/fontello.woff2?2093690') format('woff2'),
       url('https://en-route-fiston.ch/fonts/fontello.woff?2093690') format('woff'),
       url('http://en-route-fiston.ch/fonts/fontello.ttf?2093690') format('truetype'),
       url('https://en-route-fiston.ch/fonts/fontello.svg?2093690#fontello') format('svg');
	font-weight: normal;
	font-style: normal;
}

[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 { width:100%; border-collapse:collapse; border-spacing:0; }
table td { vertical-align:center; text-align:center; border:1px solid #DCB57E; padding:5px;}
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:#000; text-align:left; background:white; }

h1 { display:block; width:100%; padding:0 auto 0 auto; text-align:center; font:normal 2.2em/1.0em nexa_rust_sansblack, Arial,helvetica,sans-serif; color:#64BEBF; text-transform: uppercase;  }
h2 { display:block; width:100%; padding:0 auto; text-align:center;  font:normal 1.6em/1.0em nexa_rust_sansblack, Arial,helvetica,sans-serif; color:#166568; margin:01em 0 0.4em;}
h2.left { text-align:left; }
h2.it { color:#DCB57E; }
h2.lien a { display:block; width:100%; padding:0 auto; text-align:center;padding:0.3em; border:1px solid #DCB57E; border-radius: 0.5em; }
h3 { display:block; width:100%; padding:0 auto 0 auto; text-align:center; font:normal 1.0em/1.0em nexa_rust_sansblack, Arial,helvetica,sans-serif; color:#64BEBF; padding:0 0.5em 0.5em 0;text-transform: uppercase;}
h4 { font:normal 1.0em/1.0em nexa_rust_sansblack, Arial,helvetica,sans-serif; color:#64BEBF; padding: 1em 0 0.5em 0;text-transform: uppercase;}
h5 { display:inline; padding:0; font:normal 1.0em/1.5em Arial,helvetica,sans-serif; color:#166568; text-transform: uppercase; }
.h6 { color:#DCB57E; }

a { color:#DCB57E; text-decoration:underline; }
a:hover, a:focus { color:#432D25; text-decoration:underline; }

h2.lien a { color:#DCB57E; text-decoration:none; }
h2.lien a:hover, a:focus { color:#FFFFFF; text-decoration:none;background-color:#432D25; }

p { margin:1em 0; /*max-width: 600px;*/ }

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


/**--------------
	# Header
--------------**/
.header { position:fixed; top:0; left:0; width:100%; min-height:150px; min-width:150px; background-color:white; z-index:10; border-bottom: 2px dashed #DCB57E; }
.header .wrapper { padding:0.5em 5% 1.5em 5%;  }
a.logo { width:150px; /*height: 150px;*/ display:block;text-align:center; margin:0 auto; }
a.logo img { width:auto; height: 150px; }


/**********************************
	# 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:bold 1.6em/1.0em "arialnarrow", Arial,helvetica,sans-serif; color:#DCB57E; 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 { display:block; padding:0.4em; font:bold 1.6em/1.0em "arialnarrow", Arial,helvetica,sans-serif; color:#DCB57E; text-decoration:none; white-space:nowrap; text-align:center; cursor: pointer;color:#432D25; } 
li.btn-close { margin-top: 1em; border-top: 1px solid #333; padding-top:1em; font:normal 0.7em/0.7em nexa_rust_sansblack, Arial,helvetica,sans-serif !important; }

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

.blk-img { margin:2em 0 0 0; }
.text {  }
.text img { /*max-width:600px;*/ /*width:100%;*/ border-radius:0 30px;}
.text img.deco { display: block;  margin-left: auto;  margin-right: auto;  width: 90%; }
.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; }
.text .citation { display: block;  width:100%; padding:1em; margin: 0 0 1em 0; font-style:italic; color:#64BEBF;border: 2px dashed #64BEBF; border-radius: 30px 0;}


a { color:#DCB57E; text-decoration:none; cursor: pointer; }
a:hover, a:focus, a.current { color:#432D25; text-decoration:none;  cursor: pointer; } 

/***************************************
	# Footer
***************************************/
#footer { }
#footer .wrapper { height:5em; margin: 0 0 1em 0; font-size:0.7em; text-align:center; color:#166568; /*background-color:#DCB57E; */}
#footer a { color:#DCB57E; text-decoration:underline; }
#footer a:hover, #footer a:focus { color:#432D25; text-decoration:none; }
#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:#64BEBF; box-shadow:0px 0px 2px 1px #000; cursor:pointer; 
}
form input[type="submit"]:hover, form input[type="submit"]:focus { background-color:#000000; color:#64BEBF; box-shadow:0px 0px 1px 0px #64BEBF; }

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

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; }

.code-image { clear:both; margin:1em 0 1em 35%; }
.code-image label { display:block; float:none; margin:0 0 0.5em 0; padding:0; width:100%; text-align:left; }
.code-image img { border:medium none; float:left; margin:0 0.5em 0 0; width:150px; border-radius:inherit; }
.code-image .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, .imgRonde { margin:1em 0; }
.text img.imgRonde { margin:0 auto 1em auto; border-radius: 50%; width:50%; }

.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%; }
	.text img.imgRonde {margin: 0 auto 2em;  width:50%; }
	.imgToLeft { float:left; margin:0 1em 1em 0; /*padding-right:1em;*/ width:100%; }
	.imgSmall { float:left; margin: 1em 1em 0 2%; /*padding-left:1em;*/ width:45%; }
	.text .citation { display: block;  width:40%; float:right; padding:1em; margin:1em; font-style:italic; color:#64BEBF;border: 2px dashed #64BEBF; border-radius: 30px 0;}

.tablelike { display:table; text-align: center; table-layout: fixed; border-collapse:collapse;  }
.BlcFloatLeft { display:table-cell; padding:0.5em; text-align:center; }
.BlcFloatLeft img { max-width:250px; }
}

@media (min-width:960px) {
	.header { width:30%; min-width:350px;height:100%; min-height:300px;text-align:center;border-right: 2px dashed #DCB57E; /*border-bottom:25px solid #DCB57E;*/ border-bottom:none; }
	.header .wrapper { padding:0 0 2em; }
	.header a.logo { margin:40px auto; width:300px;}
	.header .logoImg { width:100%; height: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%; }
}
