<style type="text/css">

 
/*image background filiere */

/*.xxx{   background-image: url(https://age.hes-so.ch/imoniteur_AGEP/forminscrs.img?ww_c=HEVS_BACKGROUND_HESSO);  } */
 
.Edhea{ background-image: url(https://age.hes-so.ch/imoniteur_AGEP/forminscrs.img?ww_c=HEVS_BACKGROUND_EDEHA);}
.Heg{ background-image: url(https://age.hes-so.ch/imoniteur_AGEP/forminscrs.img?ww_c=HEVS_BACKGROUND_HEG);}
.Hei{ background-image: url(ttps://age.hes-so.ch/imoniteur_AGEP/forminscrs.img?ww_c=HEVS_BACKGROUND_HEI);}
.Heds, .HedsVisp{ background-image: url(https://age.hes-so.ch/imoniteur_AGEP/forminscrs.img?ww_c=HEVS_BACKGROUND_HEDS);}
.HedsLoeche{ background-image: url(https://age.hes-so.ch/imoniteur_AGEP/forminscrs.img?ww_c=HEVS_BACKGROUND_PHYSIO);}
.Hests{ background-image: url(https://age.hes-so.ch/imoniteur_AGEP/forminscrs.img?ww_c=HEVS_BACKGROUND_HESTS);}
.Def{background-image: url(https://age.hes-so.ch/imoniteur_AGEP/forminscrs.img?ww_c=HEVS_BACKGROUND_HESSO);}

.Edhea, .Heg, .Hei, .Heds, .Hests, .Def, .HedsLoeche, .HedsVisp{
background-color:white;
background-size: 70%;
background-repeat: no-repeat;
background-position: top 100px right 0px;

}


  /* Définition des balises HTML5 pour vieux navigateurs */
  div {display: block;}
  @font-face {
font-family: 'DIN-Regular';
font-style: normal;
font-weight: normal;
src: src:url('https://www.hevs.ch/fonts/DINRg.eot');src:url('https://www.hevs.ch//fonts/DINRg.eot?#iefix') format('embedded-opentype'),
url('https://www.hevs.ch//fonts/DINRg.woff') format('woff'),
url('https://www.hevs.ch//fonts/DINRg.ttf') format('truetype'),
url('https://www.hevs.ch//fonts/DINRg.svg') format('svg');font-weight:normal;font-style:normal}
 
body{
	background-color: rgb(234, 234, 234);
	background-image: url("https://www.hevs.ch/media/image/0/hes-so_header.jpg");
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: 50% 0px;
	background-clip: border-box;
	background-origin: padding-box;
	background-size: auto auto;
	font-family: 'DINRegular',Helvetica,Arial,sans-serif;
	color: #333;
	font-size:14px;
	}

.fondPiedPage{
  background-color: rgb(234, 234, 234);
}

#pagePrecedente{
  margin-bottom: -55px; 
  padding: 5px;
  font-weight: bold;
  padding: 5px;
}
#menu_langue{
  position: static;
  top: 95px;
  list-style: none;
  padding: 0;
  margin: 0;
  height: 1.5em;
  right:0;
}

	a{
	color:#0072b0;
	text-decoration:none;
	}
	a:hover{
	color:#02476e;
	text-decoration:none;
	}
	h1, h2, h3{
	color:black;
	margin-top:15px;
	}
	hr{
		border-top: 1px solid #333;
	border-bottom: 1px solid #dedede;
	border-left:0px solid #dedede;
	border-right:0px solid #dedede;
	}
	
	th{
  text-align: left;
}

.invisible{
  display: none;
}
.visible{
  display: table-row;
}

.excl {
  color: #ff0000;
}

.p_gras{
  font-weight: bold;
  text-align: left;
}

.hidden {
  display: none;
}

.textbold{
  font-weight: bold;
  margin-top: 20px;
  margin-bottom: 5px;
}

#titre{
  font-weight: bold;
  font-size: 1.2em;
}

form{
  padding: 10px;
  min-height: auto;
}

 input[type="text"],  input[type="email"],  input[type="password"],   textarea {
    padding: 8px 10px;
    margin: 0;
    margin-bottom: 3px;
    color: #555;
    border: 1px solid #e1e1e1; 
    /*width: 90%;*/
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-family:  'DINRegular',Helvetica,Arial,sans-serif;
    color: #333;
    background-color: #ededed;
	 font-size: 12px;
}
input[type="button"], input[type="reset"], input[type="submit"] {
    overflow: visible;
    width: auto;
    outline: none;
    padding: 6px 9px;
    font: 300 15px/1em 'Helvetica Neue', Arial, 'Lucida Grande', sans-serif;
    color: #333;
    text-shadow: 0 1px 0 #f0f0f0;
    background: #ebebeb;
    background: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#dddddd));
    background: -moz-linear-gradient(top, #fefefe, #dddddd);
    border-width: 1px;
    border-style: solid;
    border-color: #bbb #bbb #999;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 0 #f8f8f8;
    -moz-box-shadow: 0 1px 0 #f8f8f8;
    box-shadow: 0 1px 0 #f8f8f8;
	  font-size: 12px;
  	cursor: auto;
}
.espaceur{
	clear:both;height:2px;
}
select {
    border: 4px solid #EFEFEF;
    border-radius: 8px;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2) inset;
    outline: medium none;
    background: none repeat scroll 0 0 #FBFBFB;
    padding: 6px 0 6px 6px;
    color: #666666;
   
    /*font-size: 10px;*/
    margin: 1px 0;
}
.cadre{
	border: 2px solid lightgray;
	border-radius: 15px; 
	padding: 20px;
	margin:2px;
 
}

.bouton{
  text-align: center;
}

fieldset{
  border: none;
}

#header{
	
	}
#logo{
	margin:10px 10px 10px 0;
	float:left;
	
}
#menu{
	float:right;
	margin:10px 0 10px 10px;
}

#menuparcours{
  float:left;
  width: 100%;
  margin: -2px;
  margin-bottom:40px;
}

.MenuLangue{
	margin-left:10px;
	color:white;
	text-decoration:none;
}
.MenuLangue:hover{
	margin-left:10px;
	color:#0072b0;
	text-decoration:none;
}

#parcours .pagecourante a, #parcours .pagecourante a:hover, #parcours .pagecourante a:visited{
  font-weight: bold;
}
#pagePrecedente #bouton{
  padding: 7px 8px;
  font-size: 1.1em;
}

#parcours{
  color: #507EB2;
  font-weight: normal;
  padding-left: 5px;
  height: auto;
  margin-bottom:10px;
}
#parcours li{
  float:left;
  list-style-image:none;
  list-style-position:outside;
  list-style-type:none;
  margin: 0;
}
#parcours a, #parcours a:hover, #parcours a:visited{
  color: #507EB2;
  font-weight: normal;
}
#parcours a:hover{
  text-decoration: underline;
}
.pagecourante{
  font-weight: bold;
}
.descriptionPage{
  color: #507EB2;
  font-weight: bold;
}
.texteAttention{
  color: red;
  font-weight: bold;
}

a         {cursor:pointer; }
a:hover   {COLOR: #0072b0; TEXT-DECORATION: none;}

  #conteneurPrinc {
    max-width:1000px;
    margin:20px auto;
    
  }
  #contenu {
    max-width:1000px;
	min-height:600px;
	padding:20px;
    /*height:100%;*/
    background: rgba(255, 255, 255, 0.95);
	 position:relative;
  }
    .Col1_1 {
	 /*background-color:yellow;*/
	width:100%;
 
  }
 .Col2_1 {
    float:left;
    width:50%;
	 /*background: green;*/
  }

  .Col2_2 {
    float:right;
    width:50%;
	/*background-color:blue;*/
  }
  .Col3_1 {
    float:left;
    width:33%;
	/*background-color:green;*/
  }

  .Col3_2 {
    float:left;
    width:33%;
	/*background-color:pink;*/
  }
   .Col3_3 {
    float:left;
    width:34%;
	/*background-color:grey;*/
  }

  #footer{
	/* position:absolute;
    bottom:0;*/
	  text-align:center;
	  font-size:10px;
    padding:20px;
	width:95%;
	 
    /*background: rgba(255, 255, 255, 0.95)*/
  }
  @media (max-width: 600px) {
  .Col2_1, .Col2_2, .Col3_1 ,.Col3_2, .Col3_3 {
    float:none;
    width:90%;
  }

}

table{
  width: 100%;
}

td{
  vertical-align: top;
}

.spacieux{
  padding: 5px 2px 10px 2px;
}
.ligne_sep{
  width: 70%;
  height: 1px;
  background-color: #ffffff;
  border: 0;
  margin: 10px auto;
}

.donneespers {
  width:80%;
}

#p_bouton{
  /*text-align: right;
  margin-top: 20px;
  padding: 10px;*/
}

#bouton_soumettre{
  display:block;
  margin:20px auto;
  cursor: inherit;
}

#bouton, #bouton_submit{
  border : 0;
  background : transparent url(forminscrs.img?ww_c=BOUTON_LOGIN) no-repeat right 9px;
  background-color:#666666;
	height : 2em;
  font-size: 1.1em;
  color : #ffffff;
  text-align: left;
  position: relative;
  cursor: pointer;
  float: right;
  margin-right: 6px;
}

.check{
  display: none;
}

.coche, .croix{
  padding: 0 0 0 10px;
}
.msgobligatoire{
  padding: 10px;
  font-weight: bold;
  font-size: 0.8em;
}

#info{
  font-weight: bold;
  font-size: 1.2em;
  text-align:center;
}
#numEtape{
  display:block;
  /*text-align:right;*/
  text-align:center;
  font-weight: bold;
  padding-right: 20px;
}

.help{
  background-color: #cccccc;
  color: #000;
  border: 1px solid #666;
  padding-left: 2px;
  padding-right: 2px;
  padding-top: 1px;
  padding-bottom: 1px;
  font-weight: bold;
}

/* *************************** ERREUR ******************************* */
#error {
  position : relative;
  background-color : transparent;
  margin : 0.5em;
  font-weight : bold;
  text-align : center;
  color : #ff0000;
}

#erreur{
  color:#ff0000;
	border:2px solid #ff0000;
	padding: 5px;
}

ul#erreurs{
  margin: 10px;
  display: block;
  height: auto;
}
ul#erreurs li{
  color: #ff5555;
  list-style-type:disc;  
}
.erreur{
  border: 1px solid #ff5555;
  background-color: #fff1f1;
}

/* ********************** MESSAGES ******************************* */
#messages {
  position : relative;
  top : 10em;
  left : 5em;
  border : 0;
  background-color : #e6e9e9;
  padding: 2em;
  width: 50%;
}  

#messages ul { padding:0px; margin:1px; margin-left:5px; }
#messages ul li {list-style-type : none;}
#messages ul li h1 { font-weight:bold; font-size:1em; color:#507EB2;}
#messages ul li h2 { font-weight:bold; font-size:1em; color:#507EB2;}
#messages ul li p { clear:both; margin:5px; }
#messages ul li a { clear:both; }


/* css autocompletion */
input.autocompletion {
  border-bottom: 1px solid #5c71a2;
  border-left: 3px solid #5c71a2;
  width:200px;
}
input.alert { color:red; border-color:red;}
div.autocomplete { position:absolute; clear:both; background:#ededed; border:1px solid #666; border-left:7px solid #666; margin-left:5px; display:none; }
div.autocomplete ul { padding:1px; margin:1px; height: auto;}
div.autocomplete ul li { list-style-type:none; color:#000; cursor:pointer; margin-left: 2px;}
div.autocomplete ul li.selected { list-style-type:none; background:#ccc;}
div.autocomplete-immediately { position:absolute; clear:both; background:#eef; border:1px solid #4475ce; border-left:7px solid red; margin-left:5px; display:none }
div.autocomplete-immediately  ul { padding:1px; margin:1px}
div.autocomplete-immediately  ul li { list-style-type:none; color:#4475ce; cursor:pointer; }
div.autocomplete-immediately  ul li.selected { list-style-type:none; background:#ccc; }

/*console*/
div.mainconsole { position:absolute; /*width:100px;*/ margin:5px 5px 5px; background-color:#e5ecf9; opacity:1; border:solid 1px red; overflow:auto; display:none;}
div.mainconsole ul { padding:1px; margin:1px}
div.mainconsole ul li { list-style-type:none; color:#4475ce; cursor:pointer; }
div.mainconsole ul li.alert { list-style-type:none; color:red;}

/*Eqnx.Ajax.ewnet.calendar*/
img.calendar-img-button { border: none; cursor: pointer; vertical-align: middle; opacity:0.20; filter:alpha(opacity=20); -moz-opacity:0.20 }
img.calendar-img-button:hover { border: none; cursor: pointer; vertical-align: middle; opacity:1; filter:alpha(opacity=100); -moz-opacity:1 }
div.calendar-div-container { position: absolute; border: 1px solid #000; background-color: #f0f0f0; width: 210px; padding: 2px; font-size: 10px; cursor: default; z-index: 29; }
div.calendar-div-container ul { list-style-type: none; margin: 0; padding: 0; text-align: center; }
div.calendar-div-container li { float: left; }
div.calendar-div-container div.datepickerdiv { position: relative; }
div.calendar-div-container div.monthpickerdiv, div.calendar-div-container div.yearpickerdiv { position: absolute; top: 0; left: 0; visibility: hidden; }
div.calendar-div-container div.panelright { position: absolute; top: 0; right: 0; width: 41px; padding: 0; margin: 0; }
div.calendar-div-container img.selectnow { margin-right: 20px; }
div.calendar-div-container img.closecalendar { vertical-align: top; }
div.calendar-div-container a, div.calendar-div-container a:hover { text-decoration: none; color: #000; }
div.calendar-div-container a.month { display: block; width: 60px; text-align: center; }
div.calendar-div-container table { font-size: 10px; margin-left: auto; margin-right: auto; clear: both; width: 100%; }
div.calendar-div-container th { border: 1px solid #444; background-color: #CFCFCF; text-align: center; width: 23px; }
div.calendar-div-container td { border: 1px solid #444; text-align: center; cursor: pointer; background-color: #FFF; }
div.calendar-div-container td.inactive, div.calendar-div-container td.inactive:hover { background-color: #f0f0f0; border: 1px solid #CFCFCF; color: #f0f0f0; cursor: default; }
div.calendar-div-container td.today { background-color: #B3FF99; }
div.calendar-div-container td.selected { background-color: #FF99B3; }
div.calendar-div-container td.we { background-color: #99B3FF; }
div.calendar-div-container td:hover, div.calendar-div-container td.today:hover, div.calendar-div-container td.we:hover { background-color: #FFE699; }
div.calendar-div-container img { border: none; cursor: pointer; vertical-align: text-bottom; }

/* InfoBulles */
.infobulle { position: absolute; margin: 4px; width: 25em; background-color: #f5f5f5; opacity: 0.9; border: solid 1px #326699; text-align: left; }

#creation{
  display: block;
  font-weight:bold;
  padding:10px;
}

#formlist{
  font-weight:bold;
}
#imgstage{
  float: left;
}

.soustitre{
  font-weight: bold;
  font-size: 1.1em;
  border-bottom: 1px solid #507EB2;
  display: block;
}
#iframekk{
  background-color: #ffffff;
  border: 1px solid #666666;
  width: 100%;
  height: 550px;
}

.title{
  display: block;
  background-color: #e5e9e9;
  font-size: 1.2em;
  font-weight: bold;
  margin-top: 15px;
  margin-bottom: 15px;
  padding: 5px;
}
.prtl-crop-zone {
  margin: 0 auto;
}
.prtl-crop-buttons {
  padding: 0.5rem 0;
  text-align: initial;
}
.prtl-crop-buttons input.prtl-crop-button {
  padding: 0.36rem;
  height: 26px;
  width: 150px;
  line-height: 0.8rem;
  vertical-align: top;
  border: 1px solid #d9d9d9;
  box-sizing: border-box;
  background: white;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
  cursor: pointer;
  font-family: Arial, Verdana, Helvetica, Geneva, Swiss, SunSans-Regular, sans-serif;
  font-size: 12px;
  float: right;
}
.fileContainer-croppie {
  overflow: hidden;
  position: relative;
  border: 1px solid #d9d9d9;
  margin-right: 0.5rem;
  text-align: center;
  height: 26px;
  box-sizing: border-box;
  border-radius: 2px;
  padding: 0.1rem;
  cursor: pointer;
  min-width: 0;
  display: inline-block;
  vertical-align: top;
  width: 150px;
}
.fileContainer-croppie span {
  display: block;
  line-height: 1.4rem;
  padding: 0 0.4rem;
}
.prtl-crop-buttons input.prtl-crop-button:hover,
.fileContainer-croppie:hover {
  background: #507EB2;
  color: #ffffff;
}
.fileContainer-croppie [type=file] {
  cursor: inherit;
  display: block;
  filter: alpha(opacity=0);
  opacity: 0;
  position: absolute;
  right: 0;
  text-align: right;
  top: 0;
}
.croppie-container {
  padding: 0 0 1rem 0 !important;
  border: 1px solid #d9d9d9;
}
.croppie-container .cr-viewport {
  border: 1px solid lightgray!important;
  box-shadow: 0 0 0 899px rgba(255, 255, 255, 0.8) !important;
  /*border-style: dotted;
	border-color: black;
	border-width: thin;*/
}

</style>
