body{
  font:20px/1.1em arial, sans-serif;
  font-family: 'AlteHaasGrotesk';
  background:#ffe32f;

  /*background: linear-gradient(#ffe32f, #ff2116);*/
}


    .hide-robot{
      display:none;
    }

.bold{    font-family: 'AlteHaasGroteskBold';

 }
nav{ 
	text-align: center;
	position: fixed;
	background:#ffe32f;
	border-bottom: 1px solid black;
	width: 100%;
	z-index: 99;
	padding: 8px;
	top: 0px;
  height: auto;
  box-shadow: none;
}

 nav a{ 
	padding: 10px;
	font-size: 1.5vw;
	margin: 0 auto;
  }

section{
	padding: 11px 9%;
	position: relative;
}

section#slogan{
  padding: 11px 0% 11px 9%;
}


section#spacer{   
  padding-top: 39px;

 }

section#date{ 

text-align: center; }

section#collectifs{
  font-size: 2vw;
  line-height: 2.6vw;
  text-align: center;
}

section#signataires{
    padding-top: 60px;
	font-size: 2vw;
	line-height: 2.6vw;
	text-align: center;
}
section#collectifs div{ display: inline-block; }

section#appel{
	font-size: 3vw;
	text-align: center;
  line-height: 3.5vw;
}

section#metiers{ 
    column-count: 4;
    text-align: center;
    font-size: 1.8vw;
    line-height: 2.2vw;
}

#comment{ 
    padding-top: 60px;
     }

 section .col50{ 
/*	width: 50%;
	display: inline-block;
	vertical-align: top;
	padding: 0 3%;
	box-sizing: border-box;*/
	width: 80%; 
	margin-left: 10%;
}

section#rendezvous{
    padding-top: 60px;
      font-family: 'AlteHaasGrotesk';

}

section#contact{
    padding-top: 60px;
}


section#texte{
	margin-top: 6vw;
	    padding-top: 60px;
}

  #del{
  	position: absolute;
    top: 30px;
    left: 9%;
  }

  #arten{
  	font-family: 'AlteHaasGroteskBold';
    font-size: 22.3vw;
    line-height: 19vw;
    transform: scaleY(1.5);
    margin-top: 3vw;
}

#greve{
 	font-family: 'AlteHaasGroteskBold';
	font-size: 24vw;
    line-height: 19vw;
    transform: scaleY(1.5);
    margin-top: 8vw;

}

  h1{}
  h2{}

  h3{ 
    font-size: 4vw;
    font-family: 'AlteHaasGroteskBold';

 }

  h4{ 
    font-size: 3vw;
    font-family: 'AlteHaasGroteskBold';
 }

  h5{
	  	font-family: 'AlteHaasGroteskBold';
  }


 

#recto{ width: 50%; display: inline-block;}
#recto img{ width: 100%;  }

#verso{ width: 50%; display: inline-block;}
#verso img{ width: 100%; }

section#telechargements{
	text-align: center;
	margin-bottom: 50px;
        padding-top: 60px;
}

a:link{color: black; text-decoration: none}
a:active{color: black; text-decoration: none}
a:visited{color: black; text-decoration: none}
a:hover{color: black; text-decoration: underline}




#message{ 
margin-top: 15px; }


.formulaireSignature{ width: 100%; display: block; }

.listeSignataires{
width: 100%; display: block;
    font-size: 1.8vw;
    line-height: 2.2vw;
    text-align: center;

}

.signataireItem{ 
display: block; }

.btn{ 
    background:#ffe32f;
border: 1px solid black;
color: black;
box-shadow: none;
cursor: pointer;
 }

 .btn:hover{ 
      color:#ffe32f;
background-color: black;
box-shadow: none;

  }


input:not([type]), input[type=text]:not(.browser-default), input[type=password]:not(.browser-default), input[type=email]:not(.browser-default), input[type=url]:not(.browser-default), input[type=time]:not(.browser-default), input[type=date]:not(.browser-default), input[type=datetime]:not(.browser-default), input[type=datetime-local]:not(.browser-default), input[type=tel]:not(.browser-default), input[type=number]:not(.browser-default), input[type=search]:not(.browser-default), textarea.materialize-textarea {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid black;
    border-radius: 0;
    outline: none;
    height: 3rem;
    width: 100%;
    font-size: 16px;
    margin: 0 0 8px 0;
    padding: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    -webkit-transition: border .3s, -webkit-box-shadow .3s;
    transition: border .3s, -webkit-box-shadow .3s;
    transition: box-shadow .3s, border .3s;
    transition: box-shadow .3s, border .3s, -webkit-box-shadow .3s;
}

input:not([type]):focus:not([readonly]), input[type=text]:not(.browser-default):focus:not([readonly]), input[type=password]:not(.browser-default):focus:not([readonly]), input[type=email]:not(.browser-default):focus:not([readonly]), input[type=url]:not(.browser-default):focus:not([readonly]), input[type=time]:not(.browser-default):focus:not([readonly]), input[type=date]:not(.browser-default):focus:not([readonly]), input[type=datetime]:not(.browser-default):focus:not([readonly]), input[type=datetime-local]:not(.browser-default):focus:not([readonly]), input[type=tel]:not(.browser-default):focus:not([readonly]), input[type=number]:not(.browser-default):focus:not([readonly]), input[type=search]:not(.browser-default):focus:not([readonly]), textarea.materialize-textarea:focus:not([readonly]) {
    border-bottom: 1px solid #000000;
    -webkit-box-shadow: 0 1px 0 0 #000000;
    box-shadow: 0 1px 0 0 #000000;
}

input::placeholder{
  color: black;
}



#backtotop{ 
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 30px;
  height: 30px;
  padding: 4px;
  text-align: center;
  border-radius: 4px;
  border: 1px solid black;
}


em { 
  font-style: italic!important;
 }


.step2{
 /*background-color: #ffb01a;*/
}

.step3{
 /*background-color: #FF7212;*/
}






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

nav{
  padding: 0;
  position: relative;
}

nav a{ 
    padding: 10px;
    font-size: 7.5vw;
    border-top: 1px solid black;
    margin: 0 auto;
    display: block;
  }

section{    
    padding: 11px 5%;
    position: relative;
  }

#del{
      position: absolute;
    top: 2vw;
    left: 4%;
    font-size: 3vw;
}

section#collectifs {
    font-size: 3.5vw;
    line-height: 4.6vw;
    text-align: center;
}

section#appel {
    font-size: 6vw;
    text-align: center;
}

section#metiers {
    column-count: 3;
    text-align: center;
    font-size: 2.8vw;
    line-height: 3.2vw;
    }

#arten {
    font-family: 'AlteHaasGroteskBold';
    font-size: 24.5vw;
    line-height: 20vw;
    transform: scaleY(1.5);
    margin-top: 3vw;
}

#greve {
    font-family: 'AlteHaasGroteskBold';
    font-size: 26.1vw;
    line-height: 22vw;
    transform: scaleY(1.5);
    margin-top: 8vw;
  }

  section#texte {
    margin-top: 6vw;
    padding-top: 60px;
    font-size: 4vw;
}

h3{

    font-size: 10vw;
    line-height: 11vw;
}

#contact h3{font-size: 5vw;}

.listeSignataires{
width: 100%; display: block;
    font-size: 3.5vw;
    line-height: 4.6vw;
    text-align: center;

}

}