body{
/*
color: #3F3F3F;
background:#3F3F3F;
*/
font-family: 'Droid Sans',Tahoma,Arial,Verdana sans-serif;
font-size:16px;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}

@font-face {
    font-family: 'IconicStroke';
    src: url('../font/iconic_stroke-webfont.eot');
    src: url('../font/iconic_stroke-webfont.eot?#iefix') format('embedded-opentype'),
    url('../font/iconic_stroke-webfont.woff') format('woff'),
    url('../font/iconic_stroke-webfont.ttf') format('truetype'),
    url('../font/iconic_stroke-webfont.svg#IconicStrokeRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

h1 {
font-family: 'Questrial', Verdana, sans-serif;
text-align:center;
font-size:25px;
padding:0;
margin:0px 0px 5px 0; /*20*/
position:relative;
color:#8C8C8C;
}

h2 {
font-family: 'Questrial', Verdana, sans-serif;
text-align:justify;
font-size:18px;
padding:0;
margin:0px 0px 0px 0px; 
position:relative;
color:#8C8C8C;
}

h3 {
font-family: 'Questrial', Verdana, sans-serif;
text-align:justify;
font-size:14px;
padding:1;
margin:5px 100px 5px 50px; 
position:relative;
color:#8C8C8C;
}

a:link,a:visited,a:hover,a:active {
font-weight:bold;
color:#8C8C8C;
}

h4 {
font-family: 'Questrial', Verdana, sans-serif;
text-align:center;
font-size:12px;
padding:1;
margin:50px 100px 50px 100px; 
position:relative;
color:#8C8C8C;
}

/* Here comes to good stuff : content styling */    
#Formulaire{
position:relative;
margin:10px auto;    /*50*/
width:650px;/*400*/
min-height:200px;
z-index:10;/*100*/
padding:20px;/* 30sinon les champs commence dans la bande de couleur*/
/*border:1px solid #383838;*/
    
/* My stipped background */
/*background: #D1D1D1; /* Old browsers */
/*background: -moz-repeating-linear-gradient(-45deg, #EFC1CB , #EFC1CB 30px, #F2F2F2 30px, #F2F2F2 40px, #C2E8F5 40px, #C2E8F5 70px,#F2F2F2 70px, #F2F2F2 80px); /* FF3.6+ */
/*background: -webkit-repeating-linear-gradient(-45deg, #EFC1CB , #EFC1CB 30px, #F2F2F2 30px, #F2F2F2 40px, #C2E8F5 40px, #C2E8F5 70px,#F2F2F2 70px, #F2F2F2 80px); /* FF3.6+ */
/*background: -o-repeating-linear-gradient(-45deg, #EFC1CB , #EFC1CB 30px, #F2F2F2 30px, #F2F2F2 40px, #C2E8F5 40px, #C2E8F5 70px,#F2F2F2 70px, #F2F2F2 80px); /* FF3.6+ */
/*background: repeating-linear-gradient(-45deg, #EFC1CB , #EFC1CB 30px, #F2F2F2 30px, #F2F2F2 40px, #C2E8F5 40px, #C2E8F5 70px,#F2F2F2 70px, #F2F2F2 80px); /* FF3.6+ */
/*border-radius*/
/*-webkit-border-radius:8px;
   -moz-border-radius:8px;
        border-radius:8px;
/*box-shadow*/
/*-webkit-box-shadow:0px 1px 6px #3F3F3F;
   -moz-box-shadow:0px 1px 6px #3F3F3F;
        box-shadow:0px 1px 6px #3F3F3F;
*/
}

/** my "fake" background that will hover the stripes **/
#Formulaire:after{
background:#F9F9F9;
margin:10px;
position: absolute;
content : " ";
bottom: 0;
left: 0;
right: 0;
top: 0;
z-index: -1; 
border:1px #E5E5E5 solid;       
/*border-radius*/
-webkit-border-radius:8px;
   -moz-border-radius:8px;
        border-radius:8px;
}


/*** form styling **/
/** we remove the red glow around required fields since we are already using the red star */
input:required, textarea:required { 
    -moz-box-shadow:none;  
    -webkit-box-shadow:none;  
    -o-box-shadow:none;  
    box-shadow:none;  
}


/** inputs and textarea texte à l'intérieur des cases placeholder**/
input:not([type="submit"]), textarea{
	outline:none;
	display:block;
	width:600px;/*380*/
	padding:4px 8px;
	border:1px dashed #DBDBDB;
	color:#3F3F3F;
	font-family:'Droid Sans',Tahoma,Arial,Verdana sans-serif;
	font-size:16px;/*14*/
	/*border-radius*/
	-webkit-border-radius:2px;
       -moz-border-radius:2px;
            border-radius:2px;
	/*transition*/
	-webkit-transition:background 0.2s linear, box-shadow 0.6s linear;
       -moz-transition:background 0.2s linear, box-shadow 0.6s linear;
         -o-transition:background 0.2s linear, box-shadow 0.6s linear;
            transition:background 0.2s linear, box-shadow 0.6s linear;
}

input:not([type="submit"]):active, 
textarea:active,
input:not([type="submit"]):focus, 
textarea:focus{
background:#F7F7F7;
border:dashed 1px #969696;
/*box-shadow*/
-webkit-box-shadow:2px 2px 7px #E8E8E8 inset;
   -moz-box-shadow:2px 2px 7px #E8E8E8 inset;
        box-shadow:2px 2px 7px #E8E8E8 inset;
}
input:not([type="submit"]){
height: 22px;/*20*/
}

/* placeholder */
::-webkit-input-placeholder  { 
	color:#BABABA; 
	font-style:italic;
}
input:-moz-placeholder,
textarea:-moz-placeholder{ 
	color:#BABABA;
	font-style:italic;
} 
textarea{
	min-height:150px;
	resize:vertical
}

/** adding our icon font !! */
.iconic:before{
	font-size:26px;
	font-family: "IconicStroke";
}
.iconic.Tel:before       { content: "n"; }
.iconic.societe:before   { content: "!"; }
.iconic.resultat:before  { content: "L"; }
.iconic.quote-alt:before { content: "'"; }
.iconic.comment:before   { content: "q"; }
.iconic.user:before      { content: "u"; }
.iconic.mail-alt:before  { content: "M"; }
.iconic.lieu:before      { content: "9"; }
.iconic.date:before      { content: "1"; }


label{
color:#7F7E7E;
-webkit-transition: color 1s ease;
   -moz-transition: color 1s ease;
	    transition: color 1s ease;
}
label:hover{
color:#191919;
}
label:before{
color:#C1BFBD;
-webkit-transition: color 1s ease;
   -moz-transition: color 1s ease;
	    transition: color 1s ease;
}
label:hover:before{
color:#969696;
-webkit-transition: color 1s ease;
   -moz-transition: color 1s ease;
	    transition: color 1s ease;
}

p{ margin-bottom:10px; }

.information{ 	color:#878787;
			   	font-size:12px;
				font-style:italic;
				text-align:right;
				padding-right:10px;}

.required{ color:#E5224C; }


/** Styling the send button **/
input[type=submit]{
margin-left:270px;
cursor:pointer;
background:none;
border:none;
font-family: 'Alice',serif;
color:#767676;
font-size:18px;
padding:10px 4px;
border:1px solid #E0E0E0;
text-shadow: 0px 1px  1px #E8E8E8;
background: rgb(247,247,247);
background: -moz-linear-gradient(top,  rgba(247,247,247,1) 1%, rgba(242,242,242,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(247,247,247,1)), color-stop(100%,rgba(242,242,242,1)));
background: -webkit-linear-gradient(top,  rgba(247,247,247,1) 1%,rgba(242,242,242,1) 100%);
background: -o-linear-gradient(top,  rgba(247,247,247,1) 1%,rgba(242,242,242,1) 100%);
background: -ms-linear-gradient(top,  rgba(247,247,247,1) 1%,rgba(242,242,242,1) 100%);
background: linear-gradient(top,  rgba(247,247,247,1) 1%,rgba(242,242,242,1) 100%);
/*border-radius*/
-webkit-border-radius:5px;
   -moz-border-radius:5px;
        border-radius:5px;
/*box-shadow*/
-webkit-box-shadow:0px 1px 1px #FFF inset, 0 0 0px 5px #EAEAEA;
   -moz-box-shadow:0px 1px 1px #FFF inset, 0 0 0px 5px #EAEAEA;
        box-shadow:0px 1px 1px #FFF inset, 0 0 0px 5px #EAEAEA;
/*transition*/
-webkit-transition:all 0.2s linear;
   -moz-transition:all 0.2s linear;
     -o-transition:all 0.2s linear;
        transition:all 0.2s linear;
}

input[type=submit]:hover{
color:#686868;
border-color: #CECECE;
background: rgb(244,244,244);
background: -moz-linear-gradient(top,  rgba(244,244,244,1) 0%, rgba(242,242,242,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(244,244,244,1)), color-stop(100%,rgba(242,242,242,1)));
background: -webkit-linear-gradient(top,  rgba(244,244,244,1) 0%,rgba(242,242,242,1) 100%);
background: -o-linear-gradient(top,  rgba(244,244,244,1) 0%,rgba(242,242,242,1) 100%);
background: -ms-linear-gradient(top,  rgba(244,244,244,1) 0%,rgba(242,242,242,1) 100%);
background: linear-gradient(top,  rgba(244,244,244,1) 0%,rgba(242,242,242,1) 100%);
/*box-shadow*/
-webkit-box-shadow:0px 1px 1px #FFF inset, 0 0 0px 5px #E0E0E0;
   -moz-box-shadow:0px 1px 1px #FFF inset, 0 0 0px 5px #E0E0E0;
        box-shadow:0px 1px 1px #FFF inset, 0 0 0px 5px #E0E0E0;        
}

input[type=submit]:active,
input[type=submit]:focus{
position:relative;
top:1px;
color:#515151;
background: rgb(234,234,234);
background: -moz-linear-gradient(top,  rgba(234,234,234,1) 0%, rgba(242,242,242,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(234,234,234,1)), color-stop(100%,rgba(242,242,242,1)));
background: -webkit-linear-gradient(top,  rgba(234,234,234,1) 0%,rgba(242,242,242,1) 100%);
background: -o-linear-gradient(top,  rgba(234,234,234,1) 0%,rgba(242,242,242,1) 100%);
background: -ms-linear-gradient(top,  rgba(234,234,234,1) 0%,rgba(242,242,242,1) 100%);
background: linear-gradient(top,  rgba(234,234,234,1) 0%,rgba(242,242,242,1) 100%);
/*box-shadow*/
-webkit-box-shadow:0px -1px 1px #FFF inset, 0 0 0px 5px #E0E0E0;
   -moz-box-shadow:0px -1px 1px #FFF inset, 0 0 0px 5px #E0E0E0;
        box-shadow:0px -1px 1px #FFF inset, 0 0 0px 5px #E0E0E0;
}
