/* 27 inch iMac ----------- */
@media only screen and (min-width : 2400px) {
	body {
		position: relative;
		width: 100%;
		min-height: 100vh;
		box-sizing: border-box;
		z-index:1;
	}

	#slider-eplv .bg-img {
		height: 900px;
	}

	main {
		background: rgb(147, 107, 100)!important;
		background: linear-gradient(180deg, rgba(147, 107, 100,1) 30%, rgba(147, 107, 100,0) 100%);
		box-shadow: 0px 0px 18px 4px rgba(0,0,0,0.38);
	}

	footer {
		position: sticky;
		bottom: 0;
		left: 0;
		z-index:-1;
	}
}

/* 24 inch iMac ----------- */
@media only screen and (min-width : 1600px) {
	header.shrink .brand {
		width: 6%;
	}

	#slider-eplv .bg-img {
		height: 800px;
	}


	.language {
		font-size: 22px;
	}

	.brand {
		width: 10%;
	}

	.logo-left {
		height: 34px;
		width: auto;
	}

	.logo-right {
		height: 34px;
		width: auto;
	}
}

@media only screen and (max-width : 1500px) {
	.passport {
		top: 20%;
		width: 50%;
		margin: 0 25%;
	}

	#slider-eplv .bg-img {
		height: 500px;
	}

	.main-fr {
		background-image: url(../img/background-emolab-1500.jpg);
	}

	.main-en {
		background-image: url(../img/background-emolab-en-1500.jpg);
	}
}

@media only screen and (max-width : 1200px) {
	.pastille {
		bottom: -7%;
		width: 180px;
		right: 2%;
	}

	.museums h2 {
		font-size: 1.55vw!important;
	}
}

@media only screen and (min-width : 1024px) {
	.museums-content p:last-child {
		padding: 0;
		margin: 0;
	}
}

@media only screen and (max-width : 1024px) {
	#slider-eplv h1 {
		font-size: 6vw;
	}

	#slider-eplv h1 small {
		font-size: 3.5vw;
	}

	#slider-eplv p {
		font-size: 3vw!important;
	}

	.museums {
		padding: 3% 0 0;
		position: relative;
		z-index: 1;
	}

	.museums h2 {
		font-size: 2rem!important;
	}

	.museums h3 {
		font-size: 1.4rem;
	}

	.museums-content p:last-child {
		margin-top: 0;
		margin-bottom: 1rem;
	}

	.tickets-link a {
		font-size: 1.3rem;
	}
	
	h4 {
		font-size: 1.3rem!important;
		margin-bottom: 5px;
	}

	.coords h4, .coords h5 {
		font-size: 1rem!important;
	}

	#map {
        height: 450px;
	}

	address {
		padding-bottom: 20px;
	}

	address.last {
		padding-bottom: 0;
	}

	.logo-left, .logo-right {
		height: 28px;
	}

	.biosphere {
        bottom: 23px;
	}

	.butterfly {
        display: none;
    }

	.expos-item {
		text-align: center;
	}

	.middle i {
		font-size: 50px;
	}

	.expos-item:hover img {
    	padding: 6px;
	}

	.intro p {
		font-size: 16px;
	}

	.main-fr {
		background-image: url(../img/background-emolab-1024.jpg);
	}

	.main-en {
		background-image: url(../img/background-emolab-en-1024.jpg);
	}
}

/* iPads (landscape) ----------- */
@media only screen and (max-width : 768px) {
	.notice {
		font-size: 0.6rem;
	}

	.brand {
		width: 17%;
	}

	.nav-center {
		left: 50%;
		text-align: center;
	}

	.pastille {
		width: 150px;
	}

	.passport {
		top: 20%;
		width: 64%;
		margin: 0 18%;
	}

	main h2 {
		font-size: 2rem !important;
	}

	.museums {
		padding: 0;
	}

	#map {
		height: 350px;
	}

	.museums-content {
        border-bottom: 1px solid var(--third-color);;
    }

	.museums-content:nth-child(3n) {
        border-bottom: none;
    }

	.logo-left, .logo-right {
		height: 25px;
	}

	#slider-eplv .bg-img {
		height: 450px;
	}

	.expos-item img {
		width: 60%;
		margin: 5%;
	}

	.intro p, main h4 {
		font-size: 15px!important;
	}

	main {
		background: rgb(147, 107, 100)!important;
		background: linear-gradient(180deg, rgba(147, 107, 100,1) 80%, rgba(147, 107, 100,0) 100%);
	}
}

@media only screen and (max-width : 600px) {
	#slider-eplv h1 {
		font-size: 10vw;
		margin-bottom: 0;
	}

	#slider-eplv h1 small {
		font-size: 5.5vw;
	}

	#slider-eplv p {
		font-size: 4vw!important;
	}

	.pastille {
		bottom: -100px;
		margin: 0 auto;
		right: 0;
		left: 0;
	}

	.slider-caption {
		top: 65% !important;
	}

	.gradient-sky { 
		background: linear-gradient(180deg, rgba(147, 107, 100,1) 70%, rgba(147, 107, 100,0) 100%);
	}
}

/* iPads (landscape) ----------- */
@media only screen and (max-width : 480px) {
	.notice {
		padding: 5px;
		font-size: .6rem;
	}
	
	body   {
		font-size: 0.8rem!important;
	}

	ol, ul {
		padding-left: 10px;
	}

	.brand {
		width: 20%;
	}

	.nav-center .btn {
		font-size: 2.7vw!important;
	}

	.pastille {
		width: 36%;
		margin: 0 32%;
	}

    .museums h2 {
        font-size: 7vw!important;
    }

	.museums h3 {
        font-size: 1.1rem!important;
    }

	.tickets-link a {
		padding: 0.5rem 1.3rem 0.5rem 2.7rem!important;
	}

	.tickets-link a img {
		width: 20px;
	}

	.services i {
		font-size: 35px;
	}

	#slider-eplv .bg-img {
		height: 340px;
	}

	.logo-left, .logo-right {
		height: 20px;
	}

	.cky-banner-element {
		font-size: .7rem;
	}

	.passport {
		width: 80%;
		margin: 0 10%;
		top: 25%;
	}

	.path-position {
		right: -20%;
	}

	.intro p {
		font-size: 12px;
		margin-top: 90px!important;
	}

	h5 {
    	font-size: 1rem!important;
	}
}

@media only screen and (max-width : 322px) {
	.brand {
		width: 25%;
	}

	.pastille {
		width: 44%;
		margin: 0 28%;
	}
}
