#form {
}

#content {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;	
	justify-content: space-around;
}

.bouchon {
	padding: 5px;
}

#bottom {
	font-size:8px;
	text-align:center;
}

body {
	background-color: #e7e5e4;
}

p
{
        color: black;
        font-family: Verdana, Arial, sans-serif;
}

h2
{
        color: black;
        font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
	font-size: 1em;
}

.erreur
{
        color: red;
        font-weight: bold;

}

h1.elegantshadow {
  font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
  font-size: 92px;
  padding: 10px 10px 50px 10px;
  text-align: center;
  text-transform: uppercase;
  text-rendering: optimizeLegibility;
  margin: 0px;
  
    color: #131313;
    background-color: #e7e5e4;
    letter-spacing: .15em;
    text-shadow: 
      1px -1px 0 #767676, 
      -1px 2px 1px #737272, 
      -2px 4px 1px #767474, 
      -3px 6px 1px #787777, 
      -4px 8px 1px #7b7a7a, 
      -5px 10px 1px #7f7d7d, 
      -6px 12px 1px #828181, 
      -7px 14px 1px #868585, 
      -8px 16px 1px #8b8a89, 
      -9px 18px 1px #8f8e8d, 
      -10px 20px 1px #949392, 
      -11px 22px 1px #999897, 
      -12px 24px 1px #9e9c9c, 
      -13px 26px 1px #a3a1a1, 
      -14px 28px 1px #a8a6a6, 
      -15px 30px 1px #adabab, 
      -16px 32px 1px #b2b1b0, 
      -17px 34px 1px #b7b6b5, 
      -18px 36px 1px #bcbbba, 
      -19px 38px 1px #c1bfbf, 
      -20px 40px 1px #c6c4c4, 
      -21px 42px 1px #cbc9c8, 
      -22px 44px 1px #cfcdcd, 
      -23px 46px 1px #d4d2d1, 
      -24px 48px 1px #d8d6d5, 
      -25px 50px 1px #dbdad9, 
      -26px 52px 1px #dfdddc, 
      -27px 54px 1px #e2e0df, 
      -28px 56px 1px #e4e3e2;
}

.bouchon img {
	width: 700px;
}

#datepicker {
	display: inline-block;
}	

#altdatepicker {
	display: none;
}

/*-------------------------------------*/
    
    .cf:before, .cf:after{
      content:"";
      display:table;
    }
    
    .cf:after{
      clear:both;
    }

    .cf{
      zoom:1;
    }

    /*-------------------------------------*/	
    
    .form-wrapper {
        width: 450px;
        padding: 15px;
        margin: auto;
        background: #444;
        background: rgba(0,0,0,.2);
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        border-radius: 10px;
        -moz-box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);
        -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);
        box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);
    }
    
    .form-wrapper input {
        width: 330px;
        height: 20px;
        padding: 10px 5px;
	margin-top: 10px;
        float: left;    
        font: bold 15px 'lucida sans', 'trebuchet MS', 'Tahoma';
        border: 0;
        background: #eee;
        -moz-border-radius: 3px 0 0 3px;
        -webkit-border-radius: 3px 0 0 3px;
        border-radius: 3px 0 0 3px;      
    }
    
    .form-wrapper input:focus {
        outline: 0;
        background: #fff;
        -moz-box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
        -webkit-box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
        box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
    }
    
    .form-wrapper input::-webkit-input-placeholder {
       color: #999;
       font-weight: normal;
       font-style: italic;
    }
    
    .form-wrapper input:-moz-placeholder {
        color: #999;
        font-weight: normal;
        font-style: italic;
    }
    
    .form-wrapper input:-ms-input-placeholder {
        color: #999;
        font-weight: normal;
        font-style: italic;
    }    
    
    .form-wrapper button {
		overflow: visible;
        position: relative;
        float: right;
        border: 0;
        padding: 0;
	margin-top: 10px;
        cursor: pointer;
        height: 40px;
        width: 110px;
        font: bold 15px/40px 'lucida sans', 'trebuchet MS', 'Tahoma';
        color: #fff;
        text-transform: uppercase;
        background: #d83c3c;
        -moz-border-radius: 0 3px 3px 0;
        -webkit-border-radius: 0 3px 3px 0;
        border-radius: 0 3px 3px 0;      
        text-shadow: 0 -1px 0 rgba(0, 0 ,0, .3);
    }   
      
    .form-wrapper button:hover{		
        background: #e54040;
    }	
      
    .form-wrapper button:active,
    .form-wrapper button:focus{   
        background: #c42f2f;    
    }
    
    .form-wrapper button:before {
        content: '';
        position: absolute;
        border-width: 8px 8px 8px 0;
        border-style: solid solid solid none;
        border-color: transparent #d83c3c transparent;
        top: 12px;
        left: -6px;
    }
    
    .form-wrapper button:hover:before{
        border-right-color: #e54040;
    }
    
    .form-wrapper button:focus:before{
        border-right-color: #c42f2f;
    }    
    
    .form-wrapper button::-moz-focus-inner {
        border: 0;
        padding: 0;
    }

	.formtext {
		  color:#efefef;
		  font: bold 18px Arial, Helvetica, Sans-serif;
		  text-shadow: 0 2px 3px rgba(0,0,0,0.1);
	}




@media (max-width: 1024px) {
	#content {
		flex-direction: column;
		align-items: center;
	}

	#form {
        	text-align:center;
	}

	.bouchon {
		text-align: center;
	}
	
	.bouchon img {
        	width: 98%;
		max-width: 700px;
	}
	h2 {
		text-align: left;
	}
	h1.elegantshadow {
  		font-size: 50px;
    		text-shadow:
		      1px -1px 0 #767676,
		      -1px 2px 1px #737272,
		      -2px 4px 1px #787777,
		      -3px 6px 1px #7f7d7d,
		      -4px 8px 1px #868585,
		      -5px 10px 1px #8f8e8d,
		      -6px 12px 1px #999897,
		      -7px 14px 1px #a3a1a1,
		      -8px 16px 1px #adabab,
		      -9px 18px 1px #b7b6b5,
		      -10px 20px 1px #c1bfbf,
		      -11px 22px 1px #cbc9c8,
		      -12px 24px 1px #d4d2d1,
		      -13px 26px 1px #dbdad9,
		      -14px 28px 1px #e2e0df,
		      -15px 30px 1px #e4e3e2;
	}
	
	#datepicker {
	        display: none;
	}

	#altdatepicker {
        	display: inline-block;
	}

	.form-wrapper {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		width: auto;
	}

	.form-wrapper input {
		width: auto;
	}

	.form-wrapper label {
		flex: 1 100%;
	}

	.form-wrapper input:nth-child(3) {
		
	}


}