/** POUR IE 9 **/
a img 
{
    border:none;
    outline:none;
}

* {
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0); 
    -indexwebkit-tap-highlight-color: transparent;  /* i.e. Nexus5/Chrome and Kindle Fire HD 7''*/
    box-sizing:border-box;
}

/**************************************/
/*** FORMULAIRE
/**************************************/

input 
{ 
    border-radius:0; 
    -webkit-appearance: none;
}

textarea, input[type=text], input[type=password]
{
   /* Remove First */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;     

    overflow: auto;
    outline: none;
    box-shadow: none;
}

label 
{
    display: block;
}



/**************************************/
/*** EFFECT 
/**************************************/

.shadow
{
    -moz-box-shadow: 2px 1px 10px 1px #c0c0c0;
    -webkit-box-shadow: 2px 1px 10px 1px #c0c0c0;
    -o-box-shadow: 2px 1px 10px 1px #c0c0c0;
    box-shadow: 2px 1px 10px 1px #c0c0c0;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=116, Strength=10);
}

.dark-shadow
{
    -moz-box-shadow: 0px 0px 10px 1px #343434;
    -webkit-box-shadow: 0px 0px 10px 1px #343434;
    -o-box-shadow: 0px 0px 10px 1px #343434;
    box-shadow: 0px 0px 10px 1px #343434;
    filter:progid:DXImageTransform.Microsoft.Shadow(color=#343434, Direction=NaN, Strength=10);
}

/** DIV FULLSCREEN **/
.fullscreen
{
    position:fixed;
    width:100vw;
    height:100vh;
    background-color:#fff;
    opacity:1;
    top:0;
    left:0;
    /*display:none;*/
}



/**************************************/
/*** UTIL 
/**************************************/

/* Clear Floted Eleemnts */
/* //sonspring.com/journal/clearing-floats */

.clear 
{
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}

/** //www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified **/

.clearfix:before,
.clearfix:after {
  content: ".";    
  display: block;    
  height: 0;    
  overflow: hidden; 
}
.clearfix:after {clear: both;}
.clearfix {zoom: 1;} /* IE < 8 */


.no-transition 
{
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -o-transition: none !important;
    -ms-transition: none !important;
    transition: none !important;
}


/*****************************************/
/*** COULEUR 
/*****************************************/

/** ROSE => #fd7f00
/** VIOLET => 


/*****************************************/
/*** TYPOGRAPHIE 
/*****************************************/

html { font-size:62.5%; }
body 
{
	  font-weight: 400;
    font-style: normal;
  	font-size: 1.6rem;
  	line-height: 3rem;
  	color:#333333;
	  font-family: 'Sintony', sans-serif;
    box-sizing:border-box;
    background-color:#FFFFFF;
    margin:0; padding:0;
}

h1, h2, h3, p {padding:0;margin:0;line-height:120%;}


}

h1, h2, h3
{
	font-family: 'Roboto Condensed', sans-serif;
	text-transform:uppercase;
  line-height:120%;
}

h1
{
	margin-top:2rem;
  line-height: 2.5rem;
  font-size: 2.5rem;
	border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: #000;
  /*padding-bottom:2rem;*/
  padding-bottom:0.5rem;
  margin-bottom:2rem;
}

h2 { font-size: 2rem; line-height:2.5rem; margin-bottom:10px;}
h3 { font-size: 1.8rem; /*line-height:2.1rem*/; margin-bottom:10px;}

p { line-height:2.5rem; }
p.intro, h5 
{
	   font-family: 'Roboto Slab', serif;
    font-size: 2rem;
    line-height: 2.5rem;
    margin-bottom: 1rem;
}

p a, p a:active, p a:visited, p a:link 
{
    border-bottom: solid;
    border-bottom-width: 1px;
    text-transform: uppercase;
}

a, a:active, a:visited, a:link 
{
    color: #fd7f00;
    text-decoration: none;
}

p a:hover {opacity:.7;}


/*****************************************/
/**** FORMULAIRE
/*****************************************/

label { display:block; };

.button 
{
    background-color: #000000;
    padding-top: .6rem;
    padding-bottom: .6rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    color: #FFFFFF;
    text-decoration: none;
    text-transform: uppercase;
    display: inline-block;
    -moz-transition: all .2s ease-in;
    -o-transition: all .2s ease-in;
    -webkit-transition: all .2s ease-in;
    transition: all .2s ease-in;
    cursor: pointer;
    margin-bottom: 1rem;
    /* margin-left: 1rem; */
    margin-right: 1rem;
    border-radius: 3px;
    width: 100%;
    box-sizing: border-box;
    max-width:450px;
    text-align:center;
}

.button:hover {background-color:#fd7f00;}

.button.little 
{
    width:auto;
    height:auto;
    font-size:1.1rem;
    line-height:110%;
    padding:.5rem;
    margin-right:.1rem;
}

a.button {
    color: #FFFFFF;
}


/********************************/
/*** FORMULAIRE 
/********************************/


form {margin-top:3rem;margin-bottom:1rem;}
form h3:first-child {margin-top:0;}
form h3 {margin-top:3rem;}


/** ERREUR **/
.error input[type=text], .error input[type=password], .error textarea { border-color: #bf1313; }
.error label, .form-error-message { color:#bf1313;}
.form-error-message { font-weight: bold; }
.error-hint {color:#bf1313;font-style:italic;}



/*http://codepen.io/KenanYusuf/pen/PZKEKd*/

/*.control 
{
  	display: block;
  	position: relative;
  	padding-left: 30px;
  	cursor: pointer;
  	font-size: 18px;
}*/

.disabled 
{
	color:#CCCCCC!important;
	font-weight: normal;
	cursor:initial;
}



.lo-error select
{
	background-color:#f7e7ef;
	border-color:#bf1313;
}


.form-spacer { height:3rem; }
.form-error-message { margin-bottom:2rem; } 
.form-error-message li { line-height:2rem; }

.field-short { max-width:450px; }

.error .field-question { background-color:#FF0000; }
.error .field-bulle { background-color:#FF0000; }
.error .field-info { display:block; color:#FF0000;}

.field-info { display:none; margin:0;}
.field-question
{
    font-size:22px;
    /**font-weight:bold;**/
    font-family: 'Roboto Slab', serif;
    margin:0;
    margin-bottom:20px;
    padding:0;
    background-color:#2bc3f9;
    padding:20px;
    color:#FFF;
    width:100%;
    max-width:600px;
    box-sizing:border-box;
    margin:0;
    line-height:120%;
}

.field-question .title {font-size:2.2rem;}
.field-question .subtitle {font-size:1.2rem;}
.field-remarque { font-size:1.4rem; font-style: italic; color:#2bc3f9; margin-top:-5px;}
.field-bulle
{
  background-image: url(../img/bulle-accroche.png);
  background-repeat:no-repeat;
  background-color:#2bc3f9;
  width:43px;
  height:31px;
  display:inline-block;
  margin-left:20px;
  margin-bottom:1rem;
}

.field 
{
  margin-bottom:15px;
}

.field.error label { color:#bf1313; }


p.question-form
{
    font-size:30px;
    font-weight:bold;
    margin:0;
    padding:0;
}

.info-toggle 
{
    margin-left:0;
}

.form-info 
{
    font-size:1.6rem;
    color:#BBB;
    margin-left:0;
    margin-bottom:1rem;
}

.form-mention 
{
    color:#fd7f00;
}



.complet {background-color:#a5a4a4;padding:.5rem;text-transform: uppercase; color:#FFFFFF;margin-left:1rem; position:absolute;font-size:1.2rem;line-height:100%;}


/** UPLOAD PHOTO **/
.upload-profil-content {margin-bottom:2rem;}
.upload-profil-content #preview {margin-bottom:1rem;cursor:pointer;background-color:#FFFFFF;}
.upload-profil-content #preview img {width:100%;}

ul.upload-photo-menu {list-style:none;padding:0;margin:0;display:block;margin-bottom:1rem;margin-top:1rem;}
ul.upload-photo-menu li {display:inline-block;line-height:100%; float:left;padding-right:1rem;padding-left:1rem;border-right-style: solid;border-right-color:#000000;border-right-width:2px;} 
ul.upload-photo-menu li:first-child {padding-left:0;}
ul.upload-photo-menu li:last-child {border-style:none;}




i.ui-arrow 
{
    border: solid black;
    border-width: 0 3px 3px 0;
    border-color:#CCCCCC;
    display: inline-block;
    padding: 3px;
    position:relative;
    top:-1px;
}

.ui-arrow.ui-right {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.ui-arrow.ui-left {
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}

.ui-arrow.ui-up {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
}

.ui-arrow.ui-down {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

/*.ui-help-tip {font-size:1.2rem;color:#AAAAAA; margin:0;}*/


/*****************************************/
/**** HEADER
/*****************************************/

header 
{
	height:70px;
	width:100%;
	background-color:#000000;
	position:fixed;
	top:0;
	left:0;
	z-index:100;
}

#logo, #push-logo 
{
	width:120px;
	height:50px;
	display:inline-block;
	position:relative;
	top:10px;
	float:right;
}

#logo img, #push-logo img
{
    height:auto;
    width:80px;
    position:absolute;
    top: 50%; /* poussé de la moitié de hauteur du référent */
    right:0px;
    transform: translateY(-50%);
}

#push-logo 
{
      height: 70px;
      width: 100%;
      top: 0px;
      left:0px;
      float: none;
      display: block;
      /*text-align: center;*/
}

#push-logo img
{
    display: inline-block;
    height: 40px!important;
    width: auto!important;
    left:50%;
    transform : translate(-50%,-50%);
    right:auto;
}


/*****************************************/
/** LAYOUT 
/*****************************************/

/* pousse le contenu sous le header */ 
.header-marge { height:70px; width:100%;} /** PROBLEME AVEC LA MARGE ! **/

.container-inner 
{
	width:98%;
	height:auto;
	position:relative;
	margin-left:auto;
	margin-right:auto;
}


/*****************************************/
/** LAYOUT 
/*****************************************/

.img-box 
{
    border-style: solid;
    border-color:#fd7f00;
    border-width:1px;
    padding:5px;
    display:inline-block;
}

.img-box img {width:100%; height:auto;}



/*****************************************/
/*** MENU 
/*****************************************/


.menu-user { display:none; }

/** MENU RIGHT/MOBILE **/
.menu-right 
{
	padding-top:70px;
	height:100vh;
	width:80%;
  max-width:400px;
	background-color:#FF0000;
	position:fixed;
	top:0;
	right:-80%;
}

.menu-right .menu-user 
{ 
  display:block; 
  padding-left:20px;
  padding-right:20px;
  margin-bottom:20px;
  margin-top:20px;
}


.menu-right .menu-user {}
.menu-right .menu-user ul { padding:0; margin:0; }
.menu-right .menu-user li { float:none; }

.menu-right .menu-lang li { float:left; height:20px; margin-right:20px; border-style:none;}
.menu-right li span.arrow { float:right; }

.menu-right li > li { float:left; color:#FFFF00;}
.menu-right ul > ul { float:left; position:absolute; }

.menu-right .user-name 
{
  padding-left:20px;
  color:#FFFFFF;
}

.menu-right li { 
  display:block; 
}



.menu-right ul { list-style: none; margin:0; padding-left:20px; padding-right:20px; }
.menu-right li { border-bottom-style: solid; border-bottom-color:#FFFFFF; border-bottom-width: 1px; height:40px; line-height:40px;}
.menu-right li:last-child { border-style:none; }
.menu-right a { color:#FFFFFF; display:block; text-transform:uppercase; text-decoration: none}

.menu-layer 
{
	position:absolute;
	width:400px;
	height:100vh;
	top:70px;
	/*left:400px;*/
}

/** affichage du layer menu */
.menu-layer.show 
{
	left:0px;
}

/** PASTILLE MESSAGES **/
.menu-user .lo-pastille, .mm-menu .lo-pastille 
{
    background-color:#FF0000;
    width:15px;
    height:15px;
    border-radius:7.5px;
    margin-left:.2rem;
    top:-6px;
    left:0;
    color:#FFFFFF;
    font-size:8px;
    line-height:16.5px;
    text-align:center;
    display:inline-block;
    position:relative;
}





/*************************************/
/**	MENU HAMBURGER					**/
/*************************************/

.menu-hamburger
{
	text-decoration: none;
	position:absolute;
	left:1rem;
	top:20px;
	width:40px;
	height:30px;
	margin-top:10px;
	z-index:300;
}

.menu-hamburger span
{
	background: #FFFFFF none repeat scroll 0 0;
    height: 1px;
    left: 0;
    position: absolute;
    transform: translateY(0px) translateZ(0px);
    -ms-transform:transform: translateY(0px) translateZ(0px);

    transition: background-color 0.35s ease 0s, transform 0.175s cubic-bezier(0.215, 0.61, 0.355, 1) 0s, opacity 0.175s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
    width: 100%;
}

.menu-hamburger div
{
	padding-left:25px;
	margin-top:-6px;
	visibility: hidden;
}

.menu-ui-line1 {top:0px;}
.menu-ui-line2 {top:8px;}
.menu-ui-line3 {top:16px;}

.menu-open .menu-ui-line1
{
	transform: translateY(8px) rotate(45deg);
	-ms-transform : translateY(8px) rotate(45deg);;
}
.menu-open .menu-ui-line2 {display:none;}
.menu-open .menu-ui-line3
{
	transform: translateY(-8px) rotate(-45deg);
	-ms-transform : translateY(-8px) rotate(-45deg);
}


/*****************************************/
/*** LAYOUT
/*****************************************/




.main-nav 
{
	display:none;
}

.main-nav .depth1, .main-nav .depth2 
{
	width:100%;
	height:50px;
}

.depth2 {display:none;}
@media only screen AND (min-width:1024px) 
{ 
  .depth2 {display:block;}
}



.main-nav ul { margin:0; padding:0; list-style:none; }
.main-nav li 
{ 
	float:left; 
	margin-right:1px; line-height:50px;
	text-transform: uppercase;
    line-height: 50px;
    padding-left: 20px;
    padding-right: 20px;
    height: 100%;
    transition: background-color .3s ease-in;
}

.main-nav .depth1 { background-color:#545266; color:#FFFFFF;}
.main-nav .depth2 { background-color:transparent; color:#CCCCCC;}

.main-nav .depth1 a { color:#FFFFFF; }
.main-nav .depth1 a:hover { color:#fd7f00; }
.main-nav .depth2 a { color:#CCCCCC; }
.main-nav .depth2 a:hover { color:#fd7f00; }

.main-nav .depth1 .selected a { color:#fd7f00;  border-bottom-style: solid; border-bottom-color: #fd7f00;}
.main-nav .depth2 .selected a { color:#fd7f00; }

.main-nav .depth1 li.selected, .main-nav .depth1 li:hover
{
    background-color: #FFFFFF;
    color:#fd7f00;
}


.main-nav .depth1 .selected a 
{ 
    color:#fd7f00!important;
    opacity: 1 !important;
    border-bottom-style: solid;
    border-bottom-color: #fd7f00;
}

.main-nav .depth2 li { background-color:#FFFFFF; color:#CCCCCC;}
.main-nav .depth2 li.selected, .main-nav .depht2 li:hover { color: #fd7f00; }



.main-slider 
{
	/*position:relative;*/
	/*margin-top:70px; /*hauteur du menu*/
}

.main-container 
{
	background-color:transparent;
	/*min-height:600px;*/
	position:relative;
}

/** MARGE DU BAS POUR LE CONTENU PRINCIPAL **/
.main-container .container-inner { margin-bottom:50px; padding:20px; background-color:#FFFFFF;}

.overlay 
{
	width:100vw;
	height:100vh;
	opacity:.5;
	background-color:#000000;
	display:none;
	position:fixed;
	top:0; left:0;
}


/********************************/
/** ZOOM IMAGE 
/********************************/

.zoom 
{
    width:100vw;
    height:100vh;
    padding-top:40px;
    background-color:#000000;
    position:fixed;
    top:0; left:0;
    display:none;
}

.zoom .img-container 
{
    width:100%; height:100%;
    overflow: scroll;
}

.zoom .img-container img { display:block; margin:auto;}

.zoom #zoom-close-icon
{
    width:50px;
    height:50px;
    background-image: url('../img/theme/sncf/zoom-close-icon.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    display:inline-block;
    position:absolute;
    right:20px;
    top:90px;
    z-index:100;
}


/*****************************************/
/*** UI
/*****************************************/

.bloc
{
	height:200px;
	background-color:#FFFFFF;
	position:relative;
	width:100%;
	border-style:solid;
	border-color:#fd7f00;
	border-width:1px;
	box-sizing:border-box;
}


/** LOGO SVG HEADER **/
.lomitko-svg
{

}

.lomitko-svg path, .lomitko-svg polygon, .lomitko-svg rect, .lomitko-svg polyline
{
	fill:#666;
	transition: fill .5s ease-in;
	transition-delay: .5s;
}

/** modernizr **/
.lomitko-svg-no
{
  	display: none;
}

.no-svg .lomitko-svg-no
{
  	background-image: url(../img/logo.png);
  	background-repeat:no-repeat;
}


/*****************************************/
/*** FOOTER
/*****************************************/

footer 
{
	width:100%;
	height:auto;
	background-color:#000000;
  padding-top:10px;
  padding-bottom:10px;
  min-height:100px;
}

footer #topButton {float:right;}
footer p {line-height:2rem; color:#666666;}
footer a {text-transform:lowercase; color:#909090!important; margin-bottom:20px;}
footer a:hover {color:#FFFFFF!important;}
footer .copyright { color:#444444; font-size: 1.1rem;}
footer .container-inner {width:94%;}

footer span {color:#bfbfbf;}
footer ul {padding:0;list-style:none;margin-bottom:1rem;margin-top:1rem;margin-right:0;margin-left:0;display:block;}
footer ul li {float:left;margin-right:2rem;}
footer ul li a {text-transform:uppercase;font-size:1.4rem;}


.footer-fixed {position:fixed;bottom:0;left:0;}

ul.mobile-footer
{
  margin:auto;
  padding:0;
  list-style: none;
}

ul.mobile-footer li {float:left;margin-left:.5rem;margin-right:.5rem;}


/******************************************/
/*** UI 
/******************************************/


/** PAGINATION **/
/*.pagination a
{
  background-color:#CCCCCC;
  border-radius: 5px;
  text-align: center; line-height:40px;
  height:40px; width:40px;
  display:inline-block;

  -moz-transition: all .2s ease-in;
  -o-transition: all .2s ease-in;
  -webkit-transition: all .2s ease-in;
  transition: all .2s ease-in;
}

.pagination a:hover { background-color:#222526; color:#CCCCCC;}
.pagination a.prev { margin-left:5px; margin-right:10px;}
.pagination a.next { margin-right:5px; margin-left:10px;}
*/

.pagination a {color:#0a8bcf!important;}
.pagination .prev, .pagination .next 
{
    background-size:10px 10px;
    background-repeat:no-repeat;
    background-position:left 4px;
    text-transform: uppercase;
}

/** bouton précédent **/
.pagination .prev 
{
    background-image:url('../img/theme/sncf/icon-prev.png');
    padding-left:12px;
    margin-right:7px;
}

/** bouton suivant **/
.pagination .next 
{
    background-image:url('../img/theme/sncf/icon-next.png');
    padding-right:12px;
    background-position:right 4px;
    margin-left:7px;
}

/** bouton page **/
.pagination a.page-item 
{
    width:auto;
    height:auto;
    padding-right:4px;
    padding-left:4px;
}

.pagination a.page-item:hover, .pagination a.page-item.selected
{
    background-color:#0a8bcf;
    border-radius:3px;
    color:#FFFFFF!important;
}



/*******************************************/
/** TABLE
/*******************************************/
  table {
      border-collapse: collapse;
      /* small */
      width: 100%;
  }

  th, td {
      text-align: left;
      border-bottom: 1px solid #ccc;
      padding: 5px 0;
      display:table-cell;
      /* small */     
  }

  th {
      padding-top: 15px;
  }

  td.intro {
    vertical-align: top;
    border-bottom: 0px solid #ccc;
    padding-top: 0px;
  }

  .separator {
    border-bottom: 4px solid #007BA2;
  }

  table.detail td {
    padding-top: 15px;
  }

}

/*******************************************/
/*** MENU OPEN
/*******************************************/


/** affichage du layer transparent **/
.menu-open .overlay { display:block;}

/** suppression du scroll sur le contenu **/
.menu-open .main-container-outer { overflow: hidden; }

/** position du menu de droite **/
.menu-open .menu-right { right:0;}




/*******************************************/
/*** TEMPLATE
/*******************************************/

/** COMMON **/

.item { border-style:solid; border-width: 1px; border-color:#fd7f00; padding:5px; overflow-x:hidden; position:relative;}
.item.selected { background-color:#fd7f00;}
.item.selected a { color:#FFFFFF; }
.item img { width:100%; }


/*** WHOS'WHO ***/

.participants-list { margin-top:40px; }


.item-participant a { text-transform:lowercase !important; display:inline-block; line-height: 2.5rem}
.item-participant img 
{
  float:left;
  max-width:250px;
  width:40%;
  height:auto;
  padding:5px;
  border-style: solid;
  border-width: 1px;
  border-color:#FF00FF;
}

.item-participant h3 { margin:0; padding:0; }
.item-participant .cartouche 
{
  float:left;
  padding-left:20px;
  width:60%;
  max-height:250px;
}

.item-participant { width:100%; margin-bottom:20px;}

/*** PROFIL ***/
/*** MESSAGES ***/
/*** INSCRIPTION **/


.participant-item .participant-checked
{
    width:2rem;
    height:2rem;
    position:absolute;
    top:.5rem;left:.5rem;
    background-color: #FF0000;
    border-radius:1rem;
    text-align:center;
    line-height:2rem;
}


/***************************************/
/** GALERIE PHOTO **/

.photos .selection span 
{
    width:23px; height:23px;
    background-color:#fd7f00;
    color:#FFFFFF;
    text-align: center;
    line-height: 23px;
    font-size:.8rem;
    border-radius: 23px;
    display:inline-block;
    margin-left:10px;
    top:-7px;
    position:relative;
}

.photo .item .over-layer 
{ 
    /*background-image:url('../img/theme/icon-loop-200x200.png');*/
    background-repeat: no-repeat;
    background-size: 100px 100px;
    background-position:center;
    width:100%;
    height:100px;
    position:absolute; top:50px; left:0;
    opacity:0;
}

/* sous-menu slider */
.photos ul { list-style: none; margin:0; padding:0; text-transform:uppercase;}
.photos li { float:left; display:inline-block; padding:0; margin-right:20px;}
.photos li a { color:#CCCCCC; }
.photos li a:hover { color:#fd7f00; }
.photos li.selected a { color:#fd7f00!important; }





/** BOUTON DE FERMETURE **/






.popin-icon
{
    position:absolute;
    top:50%;
    display:inline-block;
    width:50px;
    height:50px;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    transform: translateY(-50%);
}

.slider .popin-icon.closeicon
{
    width:50px;
    height:50px;
    background-image: url('../img/theme/icon-closepopin.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    display:inline-block;
    position:absolute;
    right:20px;
    top:110px;
    z-index:100;
}

@media only screen and (min-width: 600px) 
{
  .slider .popin-icon.righticon { background-image: url('../img/theme/icon-nextpopin.png'); right:20px; display:none;}
  .slider .popin-icon.lefticon { background-image: url('../img/theme/icon-prevpopin.png'); left:20px; display:none; }
}


.remarque-bloc 
{
    background-color:#f4f4f4;
    border-radius : 5px;
    padding:10px;
}







/****************************************/
/*** TEMPLATE UPLOADVIDEO           *****/
/****************************************/

.uploadvideo #progresss-bar, #progress-bar
{
    background-color:#fd7f00; /** to override style.css **/
    width:450px;
    height:10px;
    margin-bottom:10px;

    /** ?? **/
    -moz-transition: width .2s ease-in;
    -o-transition: width .2s ease-in;
    -webkit-transition: width .2s ease-in;
    transition: width .2s ease-in;
}

.uploadvideo #progress 
{
    font-size:3rem;
}

/****************************************/
/*** TEMPLATE FREE                  *****/
/****************************************/



.pink { color: #fd7f00;}

.videoWrapper 
{
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  padding-top: 25px;
  height: 0;
}

.videoWrapper iframe, .videoWrapper img
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


.avatar 
{
    width:200px;
    height:200px;
    overflow: hidden;
    padding:5px;
    border-width:1px;
    border-style: solid;
}

/**************************************/
/*** TEMPLATE DOCUMENT
/**************************************/

/** **/
.download-button
{
    display:block;
    border-style:solid;
    border-width:1px;
    border-color:#d50045;
    height:70px;
    width:100%;
    line-height:70px;
    box-sizing: border-box;
    padding-left:48px;
    padding-right:10px;
    margin-bottom:10px;
    background-image:url('../img/theme/lomitko/icon-download-104x96.png');
    background-size:26px 24px;
    background-repeat: no-repeat;
    background-position : 12px 18px;
    white-space: nowrap;
}



/**************************************/
/*** GRAPHISME / ANIMATION 
/**************************************/

/** PRELOADER **/

.preloader5 
{
   display:inline-block;
   font-size:0px;
   padding:0px;
}

.preloader5 span {
   vertical-align:middle;
   border-radius:100%;
   background:#fd7f00;
   display:inline-block;
   width:10px;
   height:10px;
   margin:3px 2px;
   -webkit-animation:preloader5 0.8s linear infinite alternate;
   animation:preloader5 0.8s linear infinite alternate;
}
.preloader5 span:nth-child(1) {
   -webkit-animation-delay:-0.8;
   animation-delay:-0.8s;
}
.preloader5 span:nth-child(2) {
   -webkit-animation-delay:-0.53333s;
   animation-delay:-0.53333s;
}
.preloader5 span:nth-child(3) {
   -webkit-animation-delay:-0.26666s;
   animation-delay:-0.26666s;
}

@keyframes preloader5 {
   from {transform: scale(0, 0);}
   to {transform: scale(1, 1);}
}

@-webkit-keyframes preloader5 {
   from {-webkit-transform: scale(0, 0);}
   to {-webkit-transform: scale(1, 1);}
}

/** preloader principal positionnement **/
#main-preloader 
{
    position:fixed;
    top:0;
    left:0;
    width:100vw; 
    height:100vh;
    background-color:#FFFFFF;
    /*opacity:.5;*/
}

#main-preloader .preloader5 
{
    position:fixed;
    top:50%;
    left:50%;
    margin-top:-11px;
    margin-left:-36px;
}

#main-preloader .preloader5 span { width:20px;height:20px; }



/** PAGE D'ACCUEIL **/

.home-bloc 
{
  border-color:#cc0045;
  border-style:solid;
  border-width: 1px;
  display:block;
  width:100%;
  height:330px;
  border-radius:4px;
  box-sizing:border-box;
  margin-bottom:2rem;
}

.home-bloc h2 
{
  font-size:2rem;color:#FFFFFF;
  line-height:120%;background-color:#cc0045;
  padding-left:1rem;padding-right:1rem;padding-top:.5rem;padding-bottom:.5px;
  margin:0;
  min-height:5rem;
  text-align:center;
}

.home-bloc p {text-align:center; text-color:#000000;}
.home-bloc-inner {padding:1rem;}

.home-bloc .img-container {text-align:center;height:100px; padding-top:3rem;}
.home-bloc .bloc-img
{
    width:100px;
    height:100px;
    /*border-radius:50px;*/
    /*border-style:solid 1px #FF0000;*/
}

@media only screen and (max-width:1023px) and (min-width:768px)
{
    .home-bloc {height:380px;}
}



/*************************************/
/*** CONTENT HEADER
/*** sous-header voir messages.tpl 
/** **/

.content-header 
{
  width:100%;
  height:5rem;
  background-color:#FF0000;
}

.content-header .back {color:#FFFFFF!important;text-transform:uppercase;float:left;line-height:5rem;font-size:2rem;}
.content-header-outer {padding-left:1rem;padding-right:1rem;width:98%;margin:auto;}

/**************************************/
/*** MENU PRINCIPAL DE SECOND NIVEAU 
/**************************************/

.container-nav2 
{ 
  padding-bottom:0px!important;padding-left:20px;padding-right:20px;padding-top:20px;
  height:60px;margin-bottom:1rem;background-color:#FFFFFF;border-radius:4px;
}

.container-nav2 ul {list-style:none;margin:0;padding:0;}
.container-nav2 li {display:inline-block; float:left; height:20px; margin-right:20px;}
.container-nav2 li a {color:#000000;}
.container-nav2 li.selected a { color:#FF0000; border-bottom-style:solid; border-bottom-color:#FF0000; border-bottom-width:1px;}  

@media only screen and (min-width: 1024px)
{
  .container-nav2 {display:block;}
}

/**************************************/
/*** MENU MOBILE 
/**************************************/

.mm-listview li:last-child { border-bottom: none; }
.mm-listview p { padding-left:20px; margin-top:20px; margin-bottom:20px;}


/** COULEURS **/
.mm-menu 
{
    background: #1A1A1E;
    border-color: rgba(0,0,0,.1);
    color: #CCCCCC;
}

/* Taille du menu */
.mm-menu.mm-offcanvas 
{
    width: 80%;
    min-width: 140px;
    /*max-width: 420px;*/
}

/** FONT des items de menu **/
.mm-listview 
{
    /*font: inherit;*/
    font-size: 14px;
    line-height: 20px;
    text-transform: uppercase;
}

/** COULEUR DE ROLLOVER **/
.mm-listview a:hover { color:##FF00E1; }

/** STYLE DU SEPARATEUR **/
.mm-listview>li:not(.mm-divider):after 
{
    /*border-bottom-width: 1px;*/
    border-bottom-style: solid;
    border-color:#464646;
    left: 20px;
    right:20px;
}

/** dernier li */
.mm-listview>li:last-child:after 
{
    border-bottom-style: none;
}

/** ne fonctionne pas **/
li.user:first-child:after, li.no-border:after 
{
  border-bottom-style:none!important;  
}

/** COULEUR DE LA FLECHE NEXT **/
.mm-menu .mm-listview>li .mm-next:after {
    border-color: #CCCCCC;
}

/** NEXT ET PREV DU HEADER **/
.mm-menu .mm-btn:after, .mm-menu .mm-btn:before {
    border-color: #FF00E1;
}

/** Décalage de la flèche NEXT à droite **/
.mm-next:after { right: 33px; }

/** NAV BAR BUTTON **/
/* couleur de la ligne horizontal */ 
.mm-navbar-bottom-1 { border-color: #464646; }

/* lien dans la navbar */
.mm-menu .mm-navbar a, .mm-menu .mm-navbar>* { color: #FF00E1; }
.mm-navbar a { text-transform:uppercase; }
.mm-navbar a:hover { color:#FFFFFF; }  /** ne fonctionne pas **/

/** header menu **/
.mm-navbar.mm-hasbtns
{
    padding-right:20px;
    padding-left:20px;
    padding-top:10px;
}

.menu-header {text-align:left;}

.mm-panels>.mm-panel>.mm-listview:first-child, .mm-panels>.mm-panel>.mm-navbar+.mm-listview {
    /*margin-top: -20px;*/
    margin-top:10px;
}

.mm-navbar .mm-btn {
    top: 10px; /** position de l'icone de retour dans le cadre d'un menu de second niveau **/
} 


/** Navigation supérieure (retour) **/
.mm-menu.mm-theme-dark .mm-navbar a, .mm-menu.mm-theme-dark .mm-navbar>*, .mm-menu.mm-theme-dark em.mm-counter 
{
    color: rgba(255,255,255,.5);
}

/** Couleur de la flèche de retoue navigation supérieure **/
.mm-menu.mm-theme-dark .mm-btn:after, .mm-menu.mm-theme-dark .mm-btn:before {
    border-color: rgba(255,255,255,1);
}


/***************************************************************/
/**** DESKTOP                         ****/ 
/***************************************************************/ 


/** DESKTOP **/
@media only screen and (min-width: 1024px)
{
  h1 { font-size: 6rem; line-height: 7rem; margin-bottom:3.5rem; padding-bottom:0;}
  h2 { font-size: 4rem; line-height:6rem;}
  h3 { font-size: 2.5rem; line-height:3rem;}
  h4 { font-size: 2.2rem; line-height:3rem;}

  #enquete-form h2 {font-size:2.3rem;}

  p.intro, h5 
  {
      font-size: 3rem;
      line-height: 4.5rem;
      margin-bottom: 3rem;
      padding-bottom:0;
  }


  /*******************************************/
  /** LAYOUT
  /*******************************************/

  .container-inner 
  {
    max-width:1200px;
    margin-top:0; margin-bottom:0;
    padding:0; 
  }



  /********************************************/
  /** SLIDER
  /********************************************/

  .main-slider 
  {
    width:100%;
    /**height:400px;**/
    height:auto;
    /**background-color:#transparent**/
  }


  /********************************************/
  /*** MENU 
  /********************************************/

  .main-nav 
  {
    display:block;
    position:relative;
  }

  .menu-user-container 
  {
      position:absolute;
      right:0;
      top:0;
  }


  .menu-user 
  {
    display:block;
    float:left;
    margin-left:15px;
    line-height:70px;
    position:relative;
    display:inline-block;
  }

  .menu-user ul { margin:0; padding:0; list-style-type: none;}
  .menu-user ul li { float:left; }
  .menu-user li { color:#999999; margin-right:10px;}
  .menu-user li a { color:#666666; font-size:1.4rem;}
  .menu-user li a:hover {color:#FFFFFF!important;}
  .menu-user li a.selected { color:#FFFFFF; }
  .menu-user li.selected { color:#FFFFFF; }

  .lang .menu-user { float:right; }


  .menu-hamburger { display:none; }


  /**  TEMPLATE **/
  
  /** WHOS WHO **/
  .item-participant { width:50%; margin-bottom:20px;float:left;}
  .item-participant .cartouche { width:50%; }


  /*************************************/
  /*** FORMULAIRE
  /*************************************/

  input[type=text], input[type=password], textarea
  {
    max-width:600px;
  }

  .button { width:auto; height:auto;}
  .field { margin-bottom:1rem; }


  /************************************/
  /**** VIMEO
  /************************************/

  /** TODO **/
  .vimeo-wrapper 
  {
    position: relative;
      padding-bottom:0; /* 16:9 */
      padding-top:0;
      height: auto;
      width:650px;
  }

  .vimeo-wrapper iframe 
  {
      position: relative;
      top: 0;
      left: 0;
      width: 100%;
      height: auto;
  }

  /********************************/
  /** ZOOM IMAGE 
  /********************************/

  .zoom #zoom-close-icon
  {
      top:50px; /** hauteur du header + 20 **/
  }

  /*********************************/
  /*** GALERIE 
  /*********************************/

  .galerie .galerie-item-container h3
  {
    font-size:2rem;
    line-height:2rem;
  }

  /**************************************/
  /*** DOCUMENTS 
  /**************************************/

  .download-button
  {
      height:35px;
      line-height:35px;
      max-width:500px;
      background-size:20px 18px;
      background-position : 7px 7px;
  }

}

/***************************************************************/
/*** WEB APP 
/***************************************************************/

.detect {display:none;opacity:0;}

@media all and (display-mode: standalone) 
{
    /* Here goes the CSS rules that will only apply if app is running standalone */
    .detect {opacity:1;}
    /**body {visibility: hidden;}**/
}

@media all and (display-mode: standalone) {
    /* Here goes the CSS rules that will only apply if app is running standalone */
}



/**********************************************/
/*** MOTEUR DE RECHERCHER FORMULAIRE 
/**********************************************/

#index-search-form .lo-field {display:inline-bloc;} 

@media only screen and (max-width:768px)
{
    
}

@media only screen and (max-width:450px) 
{
    #index-search-form .lo-field {width:100%;max-width:100%;}
}



/**********************************************/
/*** MAIN OVERLAY
/**********************************************/

#main-overlay 
{
    position:fixed;
    top:0;left:0;
    width:100vw;height:100vh;
    background-color:#000000;
    opacity:.5;
    z-index:10;
}