@media (min-width: 768px) and (max-width: 979px){
	h2, .complementaire h2, .services h2{
		font-size:22px;
	}

	#home-header a{
		line-height:20px;
	}

	#home-header img{
		margin-left:0;
	}

	.presentation div{
		padding:5px;
	}

	.complementaire .content > div.row-fluid{
		width:80%;
	}

	.souscrire button{
		width:33%;
		margin-left:33%;
		margin-right:33%;
	}

	#souscrire3 button{
		width:50%;
		margin-left:25%;
		margin-right:25%;
	}

	#souscrire3:before{
		left:33%;
	}

	.drolivier{
		height:1000px;
	}

	.drolivier .bottomcontent{
		bottom:70px;
		height: 100%;
		height:-webkit-fill-available;
		height:-moz-available;
		height:fill-available;
	}

	.drolivier .twitterolivier{
		font-size:12px;
		padding:0;
		width:auto;
	}

	.drolivier .blogolivier{
		font-size:12px;
		width:auto;
		padding:8px;
	}

	.drolivier .youtubeolivier{
		width:auto;
		margin-right:5% !important;
	}

	.drolivier .youtubeolivier img{
		height:40px;
	}

	.souscrire:before{
		left:38%;
	}

	.services h3{
		font-size:16px;
	}
}

@media (max-width: 768px){
	body{
		font-size:16px;
		line-height:20px;
	}
	
	h1 {
		font-size: 28px;
		line-height: 32px;
		text-align:center;
	}
	h2 {
		font-size: 20px;
		line-height: 24px;
	}
	h3 {
		font-size: 16px;
		line-height: 20px;
	}
	h4 {
		font-size: 12px;
		line-height: 16px;
	}
	h5 {
		font-size: 10px;
		line-height: 14px;
	}
	h6 {
		font-size: 10px;
		line-height: 14px;
	}
	
	input{
		font-size:16px;
	}
	
	a.brand.span9{
		float:left;
		width:30%;
	}
	
	.header{
		top:0;
		left:0;
		z-index:998;
		width:100%;
		padding:0 5px 0 5px;
	}

	.nav-collapse{
		position:fixed !important;
		width:100%;
		top:80px;
		background:#fff;
	}
	
	.header-search.span3{
		float:right;
		width:70%;
		padding-top:5px;
	}

	#site-title{
		font-size:22px;
	}

	#logo{
		margin:5px 20px 0 10px;
	}

	#home-header{
		display:none;
	}


	.home-img{
		height:450px;
		position:relative;
	}
	
	.promesse{
		position:relative;
		width:auto;
		height:330px;
		right:inherit;
		width:100%;
		top:0px;
		font-size:16px;
		margin-bottom:30px;
	}

	.promesse .punchline{
		position:absolute;
		bottom:0;
		margin-left:auto;
		margin-right: auto;
		margin-bottom: 0;
	}

	.promesse img{
		max-width:40%;
		max-height:50%;
		margin-top:30px;
		margin-bottom: 0px;
		margin-left:0px;
	}

	.informations{
		position:relative;
		margin-top:30px;
		float:none;
		width:35%;
		font-size:12px;
	}
	.informations .active{
		border:none;
	}

	.informations .span2{
		font-size:10px !important;
		min-height:150px;
		padding:10px 10px 10px 0 !important;
		width:100% !important;
	}

	.informations img{
		max-height:30px;
		margin-top:10px;
	}

	.presentation{
		float:right;
		width:100%;
		font-size:12px;
	}

	.presentation .row-fluid{
		display:table-cell;
	}

	.informations .span3,.presentation .span3, .presentation p{
		margin:0;
	}

	.presentation > div{
		min-height:150px;
		padding:10px 10px 10px 0;
	}


	.presentation p{
		box-sizing:border-box;
		font-size:13px;
		line-height:16px;
	}

	.moduletable{
		clear:both;
	}

	.souscrire button{
		width:60%;
		margin-left:20%;
		margin-right:20%;
	}

	.souscrire:before{
		left:25%;
	}

	#souscrire3 button{
		width:80%;
		margin-left:10%;
		margin-right:10%;
	}

	#souscrire3:before{
		left:17%;
	}

	.complementaire .content > div.row-fluid{
		width:100%;
		margin:30px 0 0 0;
	}

	.complementaire h2 {
		font-size: 16px;
		line-height:24px;
		margin:0;
	}

	.complementaire .content .rounded{
		font-size:12px;
	}

	.complementaire .rounded > div[class^="span"]{
		max-height:120px;
	}

	.complementaire .maternite .span6{
		width:40%;
		float:left;
	}


	.complementaire .maternite .span6:nth-child(2){
		padding-top:5px;
	}

	.complementaire .first-row .span2{
		float:left;
		width:15%;
		margin-left:2% !important;
		margin-right:2% !important;
	}

	.complementaire .second-row .span2{
		float:left;
		margin-left:2% !important;
                margin-right:2% !important;
		width:22%;
	}

	.complementaire .span3{
		width:40%;
		float:left;
		background:#e5e5e5;
	}

	.complementaire .row-fluid img {
		max-height: 60px;
	}


	.drolivier{
		height:1250px;
		margin-bottom:100px;
	}

	.drolivier .twitterolivier{
		width:auto !important;
		line-height:50px;
	}

	.drolivier .linkedinolivier{
		width:auto !important;
		margin : 0 10px 0 10px !important;
	}

	.drolivier .bottomcontent{
		height: 100%;
		height:-webkit-fill-available;
		height:-moz-available;
		height:fill-available;
		bottom:-80px;
		transform:rotate(0deg);
	}

	.drolivier .bottomcontent > div{
		width: 100%;
		width:-webkit-fill-available;
		width:-moz-available;
		width:fill-available;
		margin:0;
		font-size:16px;
	}

	.drolivier .bottomcontent .youtubeolivier{
		display:none;
	}

	.servicespicto > .span6{
		float:left;
		width:100%;
	}

	.servicespicto > .span6 .span3{
		float:left;
		width:25%;
	}

	.services h2{
		font-size:20px;
	}

	.services h3{
		font-size:18px !important;
	}

	.services .span4{
		padding:5px;
	}
	
	.nav-collapse.in.collapse{
		position:absolute;
		width:100%;
		background:#fff;
		z-index:998;
	}
	
	.nav-collapse ul.menu{
		margin: 0;
	}
	
	.navigation .menu li{
		float:none;
		width:100%;
		text-align:left;
		padding-left:30px;
	}
	
	.navbar.pull-left{
		position:fixed;
		z-index:999;
		right:15px;
		top:15px;
	}
	
	.navbar .btn-navbar{
		background-color: #fff !important;
	    	background-image: none;
		padding:8px 8px 10px 8px;
		margin:5px;
	}
	
	.bottom div[class*="span"] {
		width: 50%;
		float: left;
		margin-top: 0;
	}

	.bottom .span4{
		width:100% !important;
		clear:both;
	}

	.bottom img{
		max-width:50%;
	}

	.footer{
		height:auto;
	}

	.footer .container-fluid{
		padding:0;
	}
	
	.footer .row-fluid [class*="span"]{
		float:left;
	}
	
	.footer-menu li{
		width:fit-content;
	}
	
	.footer-logo{
		margin-top:5px;
	}
	
	.footer-logo img{
		margin-left:20%;
	}
	
	.footer-menu li{
		display:inherit;
	}
	
	.ftsmall{
		font-size:inherit;
	}
	
	.documents .row-fluid{
		clear:both;
		width:100%;
	}
	
	/***************************************************************/
	.row-fluid.message [class*="span"]{
		float:left;
	}
	
	.row-fluid.message .span8{
		width:60%;
	}
	
	.row-fluid.message .span3{
		width:30%;
	}
	
	.row-fluid.message .span1{
		width:10%;
	}
	
	/**composant**/
	
	.messages .row-fluid [class*="span"]{
		float:left;
	}
	
	.messages .row-fluid .span1{
		width:10%;
	}
	
	.messages .row-fluid .span7{
		width:60%;
	}
	
	.messages .row-fluid .span3{
		width:20%;
	}
	
}