@media screen and (max-height: 679px) and (min-width: 1200px)
{
	#alert
	{
		display: block;
	}
	#bloc-gauche, #bloc-droit, #onglet, #map{
		display: none;
	}
}

@media screen and (min-width: 780px) and (max-width: 1200px)
{
	#alert
	{
		display: block;
	}
	#bloc-gauche, #bloc-droit, #onglet, #map{
		display: none;
	}
}








/* HAUTEUR*/



@media screen and (max-height: 1050px) 
{	
	#map {
	   
	    height: 350px;	   
	}

	#contacts {
	    margin-top: 50px;
	}

	#onglet {
	    bottom: 302px;    
	}

	#map-content img {
	    position: absolute;
	    bottom: -698px;
	    right: -120px;
	   	min-width: 1820px;
	    width: 1000px;
	}


	#bloc-gauche::after,#bloc-gauche::before {
	    height: 55vh;
	}
	
	#bloc-gauche #bloc-img {
	    display: block;
	    width: 60%;
	    left: 20%;
	}	
	

}




@media screen and (max-height: 880px) 
{	
	#map {
	   
	    height: 280px;	   
	}

	#contacts {
	    width: 50%;
	    margin-left: 25%;
	    margin-top: 20px;
	}

	#onglet {
	    bottom: 222px;  
	}

	#map-content {
	    max-width: 82%;
	    width: 75%;
	    
	}

	#map-content img {
	    
	    bottom: -728px;
	    right: -120px;
	    width: 1000px;
	}


	#bloc-gauche #bloc-img {
	 
	    top: 380px;


	    width: 46%;
	    left: 25%;
	}

}

@media screen and (max-height: 779px){
	#contact_body textarea{
		height: 75px;
	}

	#contacts h2 {
	    
	    margin-bottom: 10px;
	   
	}
	.position-info {
	    
	    left: 30%;
	    top: 0%;
	}

	#bloc-gauche #bloc-img {
	    top: 320px;
	    width: 40%;
	    left: 29%;
	}
}
/* LARGEUR */


@media screen and (max-width: 2300px)
{
	#map-content img {
	    right: -110px;
        bottom: -135%;
	    min-width: 1540px;
	}

	#onglet {
		left: 36vw;
	}

	.position-info {
	    left: 27%;
	}
}

@media screen and (max-width: 1920px)
{
	#map-content img {
	    right: -210px;
	}


	#onglet {
		left: 35vw;
	}
	.position-info {
	    left: 15%;
	}
}


@media screen and (max-width: 1600px)
{
	#map-content img {
	    right: -280px;
	}


	#onglet {
		left: 32vw;
	}

	.position-info {
	    left: 15%;
	}
}

/*HAUTEUR ET LARGEUR*/

/* max-height : 1050px */
@media screen and (max-height: 1050px) and (max-width: 2300px)
{
	#map-content img {
	    right: -130px;
	    bottom: -690px;
	}
	#onglet {
	    left: 37vw;
	}
	#map-content img {
		min-width: 1680px;
	}
}


@media screen and (max-height: 1050px) and (max-width: 1920px)
{
	.position-info {
	    left: 22%;
	}

	#map-content img {
	    min-width: 1380px;
	}
	#map-content img {
	    right: -100px;
    	bottom: -480px;
	}
	#onglet {
	    left: 35vw;
	}
}

@media screen and (max-height: 1050px) and (max-width: 1600px)
{
	.position-info {
	    left: 22%;
	}

	#map-content img {
	    min-width: 1430px;
	}
	#map-content img {
	    right: -220px;
    	bottom: -500px;
	}
	#onglet {
	    left: 33vw;
	    bottom: 250px;
	}
}


/* max-height : 880px */
@media screen and (max-height: 880px) and (max-width: 2300px)
{
	#onglet {
	    bottom: 180px;
	}
	#map-content img {
	    min-width: 1580px;
	    right: -130px;
	    bottom: -660px;

	}

	#bloc-gauche #bloc-img img {
	    min-width: 450px;
	}

}
@media screen and (max-height: 880px) and (max-width: 1920px)
{
	
	#map-content img {
	    min-width: 1360px;
	    right: -120px;
	    bottom: -540px;
	}

}

@media screen and (max-height: 880px) and (max-width: 1600px)
{
	
	#map-content img {
	    min-width: 1360px;
	    right: -230px;
	  
	}

	#bloc-gauche #bloc-img img {
	    min-width: 450px;
	}

	#bloc-gauche #bloc-img {
	    left: 10%;
	}
	
}
/* version mobile */

@media screen and (max-width: 768px) and (max-height: 1334px){
	#alert {
	    display: none;
	}
	#bloc-gauche, #bloc-droit, #onglet, #map{
		display: block;
	}
	#cote-blanc-gauche {
	    display:none;
	}
	#bloc-gauche {
	    width: 100%;
	    background: #fff;
	    height: unset;
	    float: none; 
    	 transform: unset; 
	    text-align: center;
	    z-index: 10;
	    position: unset;
	    box-shadow: unset;
	}
	#bloc-gauche::before,#bloc-gauche::after {
	    content: none;
	    
	}
	.position-info {
	    transform: unset!important;
	    position: unset;
	    
	}
	#bloc-gauche div {
	     transform: unset; 
	     margin-bottom: 20px;
	}

	#bloc-droit {
	    width: 100%;
	    background: #203f7c;
	    height: unset;
	    position: unset;
	    
	}
	#content-contacts {
	    width: 50%;
	    float: unset; 
	    height: unset;
	    margin: auto;
	    text-align: center;
	}
	#bloc-gauche #bloc-img img {
	    min-width: unset;
	}

	#bloc-gauche #bloc-img {
	    position: unset;
	    display: block;
	    width: 100%;
	    margin: auto;
	}



	.copyright {
	    display: none
	    
	}
	#onglet{
		box-shadow: none
	}
	#onglet .texte{
		height: unset;
		margin: 20px 0;
		padding: 0 15px
	}

	#onglet, #onglet .texte {
	    position: unset;
	    transform: unset;
	    text-align: center;
	    width: 100%;
	}

	.logo_footer {
	    position: unset;
	   	
	}


	#contacts {
	    width: 75%;
	    margin: 0 auto;
    	padding: 10% 0;
	}
	#content-contacts {
	    width:100%;
	    
	}

	#map {
	    
	    width: 100%;
	    position: unset;
	    bottom: 0;
	    height: 400px;
	    overflow: hidden;
	 
	}
	#map-content{
		max-width: 100%;
		display: none;
		
	}
	#map-content img {
		display: none;
	    width: unset;
	    position: absolute;
	    bottom: -13%;
	    right: -75%;
	}

	#map-responsive, .copyright-responsive{
		display: block;
	}
	#map-responsive div{
		background: url(../images/map.png);
		background-repeat: no-repeat;
		background-position: 57% 85%;  
		height: 400px
	}

	

	.copyright-responsive{
		text-align: center;
		margin: 10px 0

	}

	.copyright-responsive img
	{
		width: 150px
	}

	.position-info::after {
	    content: none;
	    
	}

	.active-responsive{
		display: block;
		width: 250px
	}
	.bleu-marine {
	    color: #203f7c;
	    background: none;
	    padding: 2px 5px;
	}

}