@charset "UTF-8";
/* CSS MEDIA QUERIES */

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

.wrap{width:100%;}

/* ############################################################################################################################################################ */

#home {padding-top:0 !important; height: 500px;
	
}
#contact{padding:15px 0;}
#footer{height:auto;}

.image-0{
	background: url('../images/bg/1.jpg') no-repeat center 162px;
}

.image-1{
	background: url('../images/bg/2.jpg') no-repeat center 162px;
}

.image-2{
	background: url('../images/bg/3.jpg') no-repeat center 162px;
}

/* ############################################################################################################################################################ */

.topbar{height:auto; background:#acb1af; padding-top:20px;}

.topbar a img{display:block; width:50%; margin:10px auto; float:none;}


.topmenu{float:none; width:96%; margin:0 auto; text-align:center;}

.topmenu li{position:relative; display:inline;}

.topmenu .topmenulink{display:inline-block; float:none; height:45px; line-height:45px;}

.topmenu .acceslink{background:rgba(255,255,255,0.2);}






/********************************************************************************************************************/

/* SOCIAL MEDIA BOX */

#socialbox{position:relative; top:0; left:0; height:50px; width:100%; text-align:center;}
#socialbox a{display:inline-block; width:50px; margin:0 auto;}
#socialbox .sep{display:none;}

/********************************************************************************************************************/

/* 
############################################################################################################################################################ */

.phrase {
	left:10px;
	font-size: 22px;
	line-height: 48px;
	text-align: left;
	position: absolute;
	/*top: 216px;*/
}

.phrase p {
	background:rgba(219,43,39,0.5);
	padding: 7px 9px;
	display: inline;
}

#slogan1{top:25px;}
#slogan2{top:25px;}
#slogan3{top:25px;}

/* ############################################################################################################################################################ */

.intro p{

margin-left:20px;
margin-right:20px;

}


#column{
	width:100%;
height:auto;
	position:relative;
	padding-right:15px;
	
}



.column1{
	width:100%;
	padding-right:15px;
}




.column2{
	width:100%;
	margin-left:20px;
	padding-right:15px;
		
}


.column3{
	width:100%;
	margin-left:20px;
	padding-right:15px;
}


.column1 h1, .column2 h1, .column3 h1 {
	text-align:left;
	margin-left:25px;
}

.column1 p , .column2 p , .column3 p{
padding-right:15px;

}

.column1 p span, .column2 p span{display:block; width:90%;}



.acces{
width:100%;
}



footer{
	
	height:auto;
	
	
	
}



#bottommenu .bottomlinks{display:inline-block; float:none; height:45px; line-height:45px;
	transition: all 0.2s ease-in;
    -ms-transition: all 0.2s ease-in;
    -moz-transition: all 0.2s ease-in;
    -webkit-transition: all 0.2s ease-in;
}


#bottommenu li{position:relative;display:inline;

}

#bottommenu {text-align:center;margin:0 auto;

}


#bottommenu li:hover .bottomlinks{
	background-color:#e3e5e4; color:#db2b27;
	
	transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -webkit-transition: all 0.2s ease-out;
}


/* ############################################################################################################################################################ */

#page-content{width:98%; margin:0 auto; padding:20px 0;}

#page-content .left{width:100%; margin-right:0%; margin-bottom:15px;}
#page-content .right{width:100%; margin-bottom:15px;}

#page-content .news{padding-bottom:20px; margin-bottom:20px;}

#page-content table, #page-content td{font-size:0.8em;}

/* ############################################################################################################################################################ */

.textfield {width:95%;}
.textarea {width:95%;}

/* ############################################################################################################################################################ */

/* ############################################################################################################################################################ */

/* ############################################################################################################################################################ */

.nonmobile{display:none;}
.mobile{display:block;}

}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
 
.wrap{width:98%;}
 
#socialbox{position:relative; top:0; left:0; height:50px; width:100%; text-align:center;}
#socialbox a{display:inline-block; width:50px; margin:0 auto;}
#socialbox .sep{display:none;}
 
#home {-webkit-background-size: none; -moz-background-size: none; -o-background-size: none; background-size: none;}
.image-0{background: url('../images/bg/1.jpg') no-repeat center center;}
.image-1{background: url('../images/bg/2.jpg') no-repeat center center;}
.image-2{background: url('../images/bg/3.jpg') no-repeat center center;}

#column{width:100%;}
.column1{width:30%; margin-right:1%;}
.column2{width:30%; margin-right:1%;}
.column3{width:30%;}

.column1 h1 img, .column2 h1 img, .column3 h1 img{display:none;}

.column1 p span, .column2 p span, .column3 p span{display:block;}

.savoirplus{margin-left:0px; width:60%; padding:0 27%x 0 8%; background:url(../images/plus_red.png) no-repeat 95% 50%;}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */

}


/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Styles */

.topbar a img{width:35%;}
.topmenu{width:65%;}

.topmenu .topmenulink{padding:0 15px ; font-size:1.1em;
}

}
