@charset "UTF-8";
/* CSS Document */

body{
	background: url('Images/background.png') no-repeat center center fixed;
	color: #fff;
	font-family:'Linotype Didot W01';
	font-weight:400;
	padding:0;
	margin:0;
}

header{
	padding:30px;
}

header img{
	width:100%;
}

.container{
	width:95%;
	max-width:450px;
	margin-left:auto;
	margin-right:auto;
}

ul{
	width:220px;
	margin-left:auto;
	margin-right:auto;
	padding-left:0px;
}

li{
	list-style-type: none;
	display:inline-block;
}

.mens img{
	width:130px;
	z-index:99999;
	position:relative;
}

.ladies img{
	width:120px;
	margin-left:-40px;
	z-index:9;
	position:relative;
}

h1{
	padding-top:30px;
	text-align:center;
	font-size:20px;
}

.discount{
	font-style:italic;
	text-align:center;
}

.code{
	font-style:normal;
	font-size:20px;
}

.newsletter{
	width:95%;
	margin-left:auto;
	margin-right:auto;
}

.arrow{
	background-image: url('Images/arrow.png');
	background-size:cover;
	background-color: transparent;
	border:none;
	right:0;
	width:30px;
	height:30px;
	vertical-align: middle;
	margin-left:5px;
}

input[type="email"]{
	height:24px;
	width:calc(100% - 40px);
	background-color:transparent;
	border:1px solid #fff;
	color:#fff;
	font-family:inherit;
}

input[type="submit"]{
	display:none;
}

.social img{
	width:30px;
	height:auto;
	display:inline-block;
}

.social{
	display:block;
	margin-left:auto;
	margin-right:auto;
	padding-bottom:10px;
	padding-top:10px;
	text-align:center;
}

/*timer*/
#timer{
	font-family: Helvetica;
	font-weight:100;
	display:block;
	margin-left:auto;
	margin-right:auto;
	color: #fff;
	text-align: center;
	width:300px;
}

#timer .padding-days .smalltext{
	padding-left:3px;
	padding-right:3px;
}

#timer .padding-days, #timer .padding-hours{
	padding:25px;
	border-radius: 50%;
	background: transparent;
	border:1px solid #fff;
	display: inline-block;
}

#timer .padding-mins{
	border-radius: 50%;
	background: transparent;
	border:1px solid #fff;
	display: inline-block;
}

.textfield{
	margin:20px;
	padding-top:5px;
	padding-bottom:5px;
}

#timer div > span{
	background: transparent;
	display: inline-block;
}

.smalltext{
	font-size: 13px;
}
/*end timer*/

@media screen and (min-width:768px){
	h1{
		font-size:2em;
	}
}

@media screen and (min-width:960px){
	body{
		background-size:cover;
	}

	header{
		margin-bottom:30px;
		padding:0;
		width:70%;
		padding-bottom:20px;
		padding-left:60px;
		border-bottom:1px solid #fff;
		float:right;
	}

	.container{
		position:absolute;
		right:30px;
		bottom:50%;
		transform:translateY(50%);
		max-width: 830px;
	}

	ul{
		margin:0;
		width:auto;
		position:absolute;
		left:0;
		bottom:20px;
	}

	li{
		display:inline-block;
		vertical-align: top;
	}

	.mens img{
		width:230px;
	}

	.ladies img{
		width:210px;
		margin-left:-80px;
	}

	h1{
		text-align:right;
		font-weight:400;
		width:80%;
		padding-top:0;
		margin-top:0;
		max-width:450px;
		float:right;
		clear:both;
	}

	.discount{
		text-align:center;
		width:400px;
		float:right;
		border-top:1px solid #fff;
		padding-top:15px;
		font-size:20px;
		clear:both;
	}

	/*timer*/
	#timer{
		margin-left:0;
		margin-right:0;
		padding-bottom:20px;
		width:330px;
		float:right;
		clear:both;
	}

	#timer .days, #timer .hours, #timer .minutes{
		font-size:30px;
	}

	#timer .smalltext{
		font-size:15px;
	}

	#timer .padding-days .smalltext{
		padding-left:10px;
		padding-right:10px;
	}

	#timer .padding-days, #timer .padding-hours{
		padding:25px;
		border-radius: 50%;
		background: transparent;
		border:1px solid #fff;
		display: inline-block;
	}

	#timer .padding-hours{
		padding-left:32px;
		padding-right:32px;
	}

	#timer .padding-mins{
		border-radius: 50%;
		background: transparent;
		border:1px solid #fff;
		display: inline-block;
	}

	.textfield{
		margin:20px;
		padding:5px;
	}
	/*end timer*/

	.newsletter{
		width:525px;
		margin-left:0;
		margin-right:0;
		right:20px;
		float:right;  
		clear:both;
		margin-left: -10px;
	}

	.arrow{
		margin-right:5px;
	}

	input[type="email"]{
		width:410px;
		margin:0;
		padding-left:10px;
	}

	.social{
		width:80px;
		padding:0;
		margin:0;
		display:inline-block;
		position:absolute;
		text-align:left;
	}
}

