@media screen and (max-width: 1800px){
	.hero{
		padding: 50px 18% 200px;
	}
	.apartment .campaign{
		top: -163px;
		left: 18%;
		width: 300px;
	}
}
@media screen and (max-width: 1680px){
	.hero{
		padding: 50px 18% 180px;
	}
	.hero h3{
		margin-top: 150px;
	}
	/*.apartment .campaign{
		width: 300px;
		top: -153px;
		left: 18%;
	}*/
	.apartment .info:after{
		top: 210px;
	}
	.barista{
		margin: 0 140px;
	}
	.barista .col-md-8{
		padding: 60px 100px 0 100px;
	}
	.prizes{
		padding: 400px 100px 110px;
	}
	.prizes .intro p{
		margin-bottom: 25px;
	}
	.prizes .col-lg-4 img{
		height: 500px;
	}
	footer{
		padding: 70px 160px 30px;
	}
	footer .fb{
		top: 35px;
		left: 50px;
	}
}
@media screen and (max-width: 1600px){
	header{
		padding: 25px 80px 15px 60px;
	}
	.menu{
		padding: 30px 95px 15px 75px;
	}
	.logo{
		width: 150px;
	}
	header .right{
		padding-top: 30px;
	}
	.hero{
		padding: 50px 10% 200px; 
	}
	.hero .col-lg-7{
		padding-right: 5%;
	}
	.hero h3{
		margin-top: 135px;
	}
	.hero .links{
		right: -12%;
	}
	.coffeebeans img{
		max-height: 750px;
	}
	.barista h3{
		margin-bottom: 35px;
	}
}
@media screen and (max-width: 1440px){
	body{
		font-size: 85%;
	}
	.main-btn{
		font-size: 15px;
		letter-spacing: 1px;
		padding: 15px 30px 15px 40px;
	}
	.link-btn{
		font-size: 1em;
	}
	.coffeebeans img{
		max-height: 650px;
	}
	h1{
		font-size: 4em;
	}
	.hero h3{
		margin-top: 125px;
		margin-bottom: 35px;
	}
	.hero .links{
		right: -11%;
	}
	.apartment{
		height: 1000px;
	}
	.apartment .campaign{
		width: 250px;
		top: -130px;
		left: 18%;
	}
	.apartment .info:after{
		height: 500px;
		top: 175px;
	}
	.apartment .beans{
		width: 230px;
		top: 30px;
	}
	.barista{
		margin: 0 110px;
	}
	.barista li{
		height: 130px;
	}
	.barista .grad{
		width: 550px;
	}
	.barista .grad img{
		width: 70px;
	}
	.barista .link{
		left: 17%;
		width: 450px;
		padding-top: 56px;
	}
	.prizes{
		height: 1300px;
		padding: 450px 100px 40px;
	}
	.prizes .intro p{
		padding: 0 15%;
		margin-bottom: 0;
	}
	.prizes .col-lg-4{
		margin-bottom: 50px;
	}
	.prizes .col-lg-4 img{
		height: 400px;
	}
	.prizes .col-lg-4 p{
		padding: 0 60px;
	}
	.cocktails{
		height: auto;
		padding: 60px 0 100px;
	}
	.cocktails .beans{
		width: 230px;
		top: -210px;
	}
	footer{
		padding: 60px 100px 30px;
	}
	footer .fb{
		top: 30px;
		left: 30px;
	}
	footer .fb img{
		width: 50px;
	}
	footer li{
		margin-right: 40px;
	}
}
@media screen and (max-width: 1366px){
	header{
		padding: 20px 55px 15px 40px;
	}
	.logo{
		width: 120px;
	}
	header .right{
		padding-top: 25px;
	}
	.menu{
		padding: 25px 70px 15px 60px;
	}
	.menu-icon .bar1, .menu-icon .bar2{
		height: 4px;
		width: 55px;
	}
	.hero .links{
		font-size: 0.8em;
	}
	.hero .links a{
		margin-right: 55px;
	}
	.hero h3{
		margin-top: 100px;
		margin-bottom: 30px;
	}
	h1{
		margin-bottom: 30px;
	}
	.apartment .campaign{
		width: 210px;
		top: -109px;
		left: 13%;
	}
	.apartment .info{
		padding: 14% 18% 10% 30%;
	}
	.apartment .info:after{
		top: 150px;
		left: 20%;
	}
	.barista .col-md-8{
		padding: 50px 120px 0 65px;
	}
	.barista h3{
		font-size: 2.7em;
	}
	.barista li{
		height: 110px;
	}
	.barista .grad{
		width: 512px;
	}
	.barista .link{
		padding-top: 50px;
	}
	.prizes{
		height: auto;
		padding: 380px 100px 100px;
	}
	.prizes .intro p{
		margin-bottom: 55px;
	}
	.prizes .col-lg-4{
		margin-bottom: 100px;
	}
	.prizes .col-lg-4 p{
		font-size: 1.2em;
	}
	footer .fb{
		top: 30px;
		left: 35px;
	}
	footer .fb img{
		width: 40px;
	}
}
@media screen and (max-width: 1280px){
	.menu ul li{
		margin-right: 80px;
	}
	.hero{
		padding: 50px 10% 165px;
	}
	.coffeebeans img{
		max-height: 600px;
	}
	.hero .links{
		right: -12%;
	}
	.apartment .info:after{
		height: 470px;
	}
	.barista{
		margin: 0 85px;
	}
	.apartment .beans,
	.cocktails .beans{
		width: 195px;
	}
	.prizes .col-lg-4 img{
		height: 355px;
	}
	.barista .grad{
		width: 497px;
		padding: 25px 0 0;
	}
	.prizes .col-lg-4 p{
		padding: 0 40px;
	}
	.overlay h3{
		font-size: 2.2em;
	}
	.owl-carousel .owl-item .overlay img{
		width: 85%;
	}
	footer{
		padding: 79px 65px 30px;
	}
	footer .fb{
		top: 20px;
		left: 20px;
	}
}
@media screen and (max-width: 1200px){
	h1{
		font-size: 3.5em;
	}
	.hero{
		padding: 50px 10% 125px;
	}
	.hero h3{
		font-size: 1.1em;
	}
	.hero p{
		margin-bottom: 40px;
	}
	.coffeebeans img{
		max-height: 570px;
	}
	.apartment .campaign{
		width: 110px;
		top: 20px;
		left: 16%;
	}
	.apartment .info{
		padding: 14% 18% 10% 27%;
	}
	.apartment .info:after{
		height: 450px;
		left: 20%;
	}
	.barista .col-md-8{
		padding: 40px 90px 0 50px;
	}
	.apartment .beans,
	.cocktails .beans{
		width: 170px;
	}
	.barista h3{
		font-size: 2.5em;
	}
	.barista .grad{
		width: 460px;
	}
	.barista .link{
		width: 400px;
	}
	.cocktails .beans{
		top: -170px;
	}
}
@media screen and (max-width: 1024px){
	h1{
		font-size: 3em;
		margin-bottom: 25px;
	}
	.main-btn{
		font-size: 13px;
	}
	.menu ul{
		margin: 50px auto 25px;
	}
	.logo{
		width: 95px;
	}
	header .right{
		padding-top: 20px;
	}
	.hero{
		padding: 50px 7% 70px;
	}
	.hero h3{
		margin-top: 75px;
		margin-bottom: 25px;
	}
	.coffeebeans img{
		max-height: 485px;
	}
	.hero .links{
		font-size: 0.7em;
	}
	.apartment .campaign{
		left: 8%;
	}
	.apartment .info{
		padding: 16% 11% 15% 22%;
	}
	.apartment .info p{
		font-size: 1.1em;
	}
	.apartment .info:after{
		height: 425px;
		left: 13%;
	}
	.barista{
		margin: 0 30px;
	}
	.barista h3{
		font-size: 2.3em;
	}
	.barista p{
		font-size: 1em;
	}
	.apartment .beans,
	.cocktails .beans{
		width: 130px;
	}
	.apartment .beans{
		top: -80px;
	}
	.barista .grad{
		width: 431px;
	}
	.barista .link{
		padding-top: 45px;
		width: 370px;
	}
	.prizes{
		height: auto;
		padding: 260px 100px 100px;
	}
	.prizes .col-lg-4 img{
		height: 270px;
	}
	.prizes .col-lg-4 p{
		padding: 0;
	}
	.cocktails .beans{
		top: -110px;
	}
	.overlay{
		padding: 0 25px;
	}
	.owl-carousel .owl-item .overlay img{
		width: 74%;
	}
	footer{
		padding: 79px 15px 30px;
	}
	footer li{
		margin-right: 0;
	}
	footer li a{
		letter-spacing: 0.2em;
	}
}
@media screen and (max-width: 991px){
	.menu ul li{
		font-size: 1em;
		margin-right: 70px;
	}
	.hero{
		background: url(../img/key.jpg);
		background-position: top left;
		background-size: cover;
		background-repeat: no-repeat;
		height: 600px;
	}
	.hero .col-lg-7{
		padding-right: 43%;
	}
	.keyhole,
	.coffeebeans,
	.hero .links{
		display: none;
	}
	.barista .col-md-8{
		padding: 40px 80px 0 40px;
	}
	.barista h3{
		margin-bottom: 30px;
	}
	.prizes .col-lg-4 img{
		height: auto;
		width: 300px;
	}
	.owl-carousel .owl-item .overlay img{
		width: 95%;
		margin-bottom: 30px;
	}
}
@media screen and (max-width: 768px){
	.hero{
		background-position: 48%;
	}
	.menu ul li{
		display: block;
		font-size: 1.1em;
		margin: 0 0 20px;
	}
	.menu ul li:last-of-type{
		margin: 0;
	}
	.apartment .campaign{
		left: 7%;
	}
	.apartment .info{
		padding: 19% 5% 15% 22%;
	}
	.barista .col-md-8{
		padding: 40px 80px 40px 40px;
	}
	.barista li{
		height: 90px;
		bottom: -90px;
	}
	.barista .grad{
		width: auto;
		padding: 20px 100px 0;
	}
	.barista .grad img{
		width: 55px;
	}
	.barista .link{
		width: auto;
		left: 4%;
		padding: 35px 50px 0;
	}
	.apartment .beans{
		top: -20px;
	}
	.prizes{
		padding: 305px 30px 100px;
	}
	.prizes .col-lg-4{
		margin-bottom: 70px;
	}
	.owl-carousel .owl-item .overlay img{
		width: 73%;
	}
	footer li{
		width: auto;
		margin-right: 50px;
	}
}
@media screen and (max-width: 767px){
	.barista .col-md-4{
		padding-top: 50px;
	}
	.barista .col-md-4 img{
		display: block;
		width: 40%;
		margin: 0 auto;
	}
	.apartment{
		height: 1360px;
	}
	.apartment .beans, .cocktails .beans{
		width: 165px;
		top: -95px;
	}
	.barista .grad{
		left: 0;
	}
	.barista .link{
		left: 36%;
	}
	.prizes{
		padding: 35% 30px 100px;
	}
	.prizes .intro p{
		padding: 0;
	}
	footer .fb{
		top: 30px;
		left: 30px;
	}
	footer .fb img{
		width: 50px;
	}
	footer ul{
		display: block;
	}
	footer ul li{
		width: 100%;
		display: block;
		text-align: center;
		margin: 0 0 20px;
	}
}
@media screen and (max-width: 575px){
	header{
		padding: 20px 40px 15px;
	}
	.menu {
		padding: 25px 50px 15px;
	}
	.hero{
		background-position: top left;
	}
	.hero .col-lg-7{
		padding-right: 0;
	}
	.apartment .info{
		padding: 12% 5% 8% 7%;
	}
	.apartment .info:after{
		display: none;
	}
	.apartment .campaign{
		width: 140px;
		top: -70px;
		left: auto;
		right: 30px;
	}
	.apartment h2{
		margin-bottom: 30px;
	}
	.apartment h2,
	.prizes h2,
	.cocktails h2{
		font-size: 2.5em;
	}
	.barista .col-md-4 img{
		width: 50%;
	}
	.barista .grad{
		padding: 20px 65px 0;
	}
	.barista .col-md-4{
		padding-top: 30px;
	}
	.prizes{
		padding: 28% 30px 80px;
	}
	.prizes .intro p{
		margin-bottom: 40px;
	}
	.prizes .col-lg-4{
		margin-bottom: 40px;
	}
	.prizes .link{
		margin: 40px 0 0;
	}
	.cocktails h2{
		margin-bottom: 50px;
	}
	footer .bottom p{
		font-size: 0.7em;
	}
}
@media screen and (max-width: 500px){
	header .right{
		padding-top: 15px;
	}
	.apartment .campaign{
		width: 110px;
		top: -55px;
		right: 10px;
	}
	.barista h3{
		font-size: 1.8em;
		margin-bottom: 15px;
	}
	.barista .col-md-8{
		padding: 40px 25px;
	}
	.barista .col-md-4 img{
		width: 60%;
	}
	.barista .grad{
		display: none;
	}
	.barista .link{
		width: 100%;
		left: 0;
	}
	.apartment .beans,
	.cocktails .beans{
		width: 125px;
	}
}
@media screen and (max-width: 425px){
	header{
		padding: 15px 20px 15px 25px;
	}
	.hero{
		height: 630px;
		padding: 50px 3% 70%; 
	}
	.apartment .info{
		padding: 16% 5% 19% 7%;
	}
	.apartment .campaign{
		width: 100px;
	}
	.apartment h2{
		margin-bottom: 15px;
	}
	.barista{
		margin: 0 15px;
	}
	.prizes{
		padding: 58% 30px 80px;
	}
}
@media screen and (max-width: 375px){
	h1{
		font-size: 2.5em;
	}
	.barista h3{
		font-size: 1.5em;
	}
	.barista p{
		font-size: 0.9em;
	}
	.prizes{
		padding: 58% 15px 80px;
	}
}
@media screen and (max-width: 320px){
	h1{
		font-size: 2.2em;
	}
	.hero{
		height: 660px;
	}
	.apartment h2,
	.prizes h2,
	.cocktails h2{
		font-size: 2em;
	}
	.apartment .info{
		padding: 22% 5% 19% 7%;
	}
	.apartment .info p{
		font-size: 1em;
	}
	.barista .col-md-8{
		padding: 25px 10px;
	}
	.barista .col-md-4 img{
		width: 70%;
	}
	.barista .link{
		padding: 35px 15px 0;
	}
	.prizes .col-lg-4 img{
		width: 250px;
	}
	.main-btn{
		font-size: 11px;
	}
	.overlay{
		padding: 0 15px;
	}
	.overlay h3{
		font-size: 1.5em;
		margin-bottom: 10px;
	}
	.owl-carousel .owl-item .overlay img{
		width: 65%;
		margin-bottom: 10px;
	}
	.overlay p{
		font-size: 0.9em;
	}
	footer .top{
		padding-bottom: 10px;
	}
	footer .fb{
		top: 20px;
		left: 20px;
	}
	footer .fb img{
		width: 40px;
	}
}