
/**************************************************
	Styles : SISMIQ - basic responsive website
***************************************************/

@charset "utf-8";


/* ********** RESET BASE STYLES ***********/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	/*vertical-align: baseline;*/
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
ol, ul {
	list-style: none;
}
/* tables still need cellspacing="0" (for ie6) */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	/*text-align: left;
	font-weight: normal;
	vertical-align: top;*/
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

*{
margin: 0px;
padding: 0px;
}

/* hack FF pour envlever pointillés autour des liens */
a {
	outline: none;
}

:focus {
	-moz-outline-style: none;
}
/* fin de hack */

body{
  background-color: #FFF;
}

/********* Styles pour la structure et le contenu *********/

/* pour les clear float */
.clear_float{
	clear:both;
	height:0;
	padding:0;
	margin:0;
}

/****** pour containers et wraps ******/

#container-top{
	margin:0;
	padding:0 0 50px 0;
background-image:url(images/background-top.jpg);
background-position: top center; 
background-repeat: no-repeat;
	background-color: #FFF;
}

#container-main{
	margin:0;
	padding:70px 0 50px 0;
background-image:url(images/background-main.jpg);
background-position: top center; 
background-repeat: no-repeat;
	background-color: #000;
}

.general-centerwrap {
	margin: 0 auto 0 auto;
	width:840px;
}

@media handheld, only screen and (max-width: 990px) {

 .general-centerwrap {
  width:87%;
  }
  
  }
@media handheld, only screen and (max-width: 767px) {

 .general-centerwrap {
  width:95%;
  }

}
@media handheld, only screen and (max-width: 480px) {

 .general-centerwrap {
 width:95%;
  }
}

.clients-homedisplay {
	position:relative;
	margin: 50px auto 0 auto;
	width:970px;
	background-color: #29E83F;
}

@media handheld, only screen and (max-width: 990px) {

 .clients-homedisplay {
  width:90%;
  }
  
  }
@media handheld, only screen and (max-width: 767px) {

 .clients-homedisplay {
  width:95%;
  }

}
@media handheld, only screen and (max-width: 480px) {

 .clients-homedisplay {
 width:95%;
  }
}


/* Styles pour Padding progressif responsives : pour ajuster blocs de textes */

.progpad-8 {
	padding-left:8%;
	padding-right:8%;
}

@media handheld, only screen and (max-width: 990px) {

 .progpad-8 {
	padding-left:8%;
	padding-right:8%;
}
  
  }
@media handheld, only screen and (max-width: 767px) {

 .progpad-8 {
	padding-left:0;
	padding-right:0;
}
}
@media handheld, only screen and (max-width: 480px) {

 .progpad-8 {
	padding-left:0;
	padding-right:0;
}
}


/****** Styles pour Éléments spéciaux et éléments images ******/

/* top menu contact */

.contact-navtop{
display:block;
width:180px;
background-color:#FFF;
font-family:'Sanchez', Arial, sans-serif;
font-size:18px;
text-transform:uppercase;
text-align:center;
line-height:22px;
color:#797979;
margin: 0 auto 70px auto;
padding:8px 0 11px 0;
text-decoration:none;
border-radius: 0 0 4px 4px;
-moz-border-radius:0 0 4px 4px;
-webkit-border-radius: 0 0 4px 4px;
border-bottom:1px solid #ced3d3;
border-left:1px solid #ced3d3;
border-right:1px solid #ced3d3;
}

.contact-navtop:hover{
text-decoration:none;
background-color:#FFF;
color:#00b89c;
}

/* logo sismiq dans header */

#sismiq-headlogo{
display:block;
height:250px;
width:266px;
text-indent:-999em;
margin: 0 auto 50px auto;
background-image:url(images/sismiq-headlogo.png);
background-position: center; 
background-repeat: no-repeat;
}

.client-logos{
margin:12px 25px;
}

.copyright {
	text-align:center;
	font-family: Arial, sans-serif;
	font-size:13px;
	line-height:13px;
	padding-bottom:20px;
	color:#342c2a;
}


/****** pour les elements textes *********/

p {
	font-family: Arial, sans-serif;
	font-size:20px;
	line-height:28px;
	padding-bottom:15px;
}


/* titres */


h2 {
	font-family:'Sanchez', Arial, sans-serif;
	font-size:26px;
	line-height:26px;
	padding-bottom:15px;
}


h3 {
	font-family:'Sanchez', Arial, sans-serif;
	font-size:42px;
	line-height:42px;
	padding-bottom:20px;
	text-transform:uppercase;
}

h4 {
	font-family:'Sanchez', Arial, sans-serif;
	font-size:28px;
	line-height:28px;
	padding-bottom:24px;
	text-transform:uppercase;
} 

/* couleurs et shadow pour titres et textes */

.orange-txt {
color:#fe3c16;
	}
	
.orange-shadow-txt {
color:#fe3c16;
-moz-text-shadow: black 0px 0px 9px;
-webkit-text-shadow: black 0px 0px 9px;
text-shadow: black 0px 0px 14px;
	}


.darkgray-txt {
color:#232424;
	}
	
.lightgray-txt {
color:#676969;
	}	
	
.white-txt {
color:#FFF;
}
	
.white-shadow-txt {
color:#FFF;
-moz-text-shadow: black 0px 0px 9px;
-webkit-text-shadow: black 0px 0px 9px;
text-shadow: black 0px 0px 14px;
}	
	
.green-txt {
color:#00b89c;
}		
	
.green-shadow-txt {
color:#00b89c;
-moz-text-shadow: black 0px 0px 9px;
-webkit-text-shadow: black 0px 0px 9px;
text-shadow: black 0px 0px 14px;
}	
	
	
/******** styles pour boutons et éléments de formulaires  *********/

.p-button{
display:block;
height:40px;
padding:0;
margin:54px 0 0 0;
}
	
.green_button{
background-color:#00b89c;
font-family:'Sanchez', Arial, sans-serif;
font-size:18px;
text-transform:uppercase;
line-height:22px;
color:#0e0f0f;
margin: 42px 0 0 0;
padding:9px 22px 11px 22px;
text-decoration:none;
border-radius: 4px;
-moz-border-radius:4px;
-webkit-border-radius: 4px;
}

.green_button:hover{
text-decoration:none;
background-color:#06a198;
}


/* Styles pour newsletter subscription*/
.subnewsletter-wrap{
	padding-left: 6%;
	padding-top:15px;
	margin:0;
	}

.p_newsletter{
	display:block;
	float:left;
	margin:0 15px 0 0;
	}

	
.subnewsletter-textinput{
	width: 260px;
	height: 40px;
	font-family: Arial, Helvetica, sans-serif;
	text-align: left;
	font-size: 17px;
	color: #555;
	margin:0;
	padding: 0 0 0 15px;
}

.subnewsletter-submit{
background-color:#00b89c;
font-family:'Sanchez', Arial, sans-serif;
font-size:18px;
text-transform:uppercase;
line-height:22px;
color:#0e0f0f;
margin:0;
padding:9px 22px 10px 22px;
text-decoration:none;
border-radius: 4px;
-moz-border-radius:4px;
-webkit-border-radius: 4px;
	border:none;
	cursor:pointer;	
	}
	
	button[type="submit"].subnewsletter-submit:hover{
text-decoration:none;
background-color:#06a198;
}

	@media handheld, only screen and (max-width: 990px) {

.subnewsletter-wrap{
	}
  
  .p_newsletter{

	}

	
.subnewsletter-textinput{

}

.subnewsletter-submit{

	}
  
  }
@media handheld, only screen and (max-width: 767px) {

.subnewsletter-wrap{
	padding-left: 0;
	margin:0;
	}
	
.p_newsletter{
	display:block;
	float:left;
	clear:float;
	margin:0;
	width:100%;
	}

	
.subnewsletter-textinput{
width:100%;
text-align:center;
padding: 0;
}

.subnewsletter-submit{
width:100%;
	}

}
@media handheld, only screen and (max-width: 480px) {

.subnewsletter-wrap{
	padding-left: 0;
	margin:0;
	}

.p_newsletter{
	display:block;
	float:left;
	clear:float;
	margin:0;
	width:100%;
	}

	
.subnewsletter-textinput{
width:100%;
padding: 0;
}

.subnewsletter-submit{
width:100%;
}
