/* *************************************************** reset */
html, body,
h1, h2, h3, h4, h5, h6,
ul, li, 
p, div, 
form, fieldset, label, button, input, select, textarea,
img { 
	margin: 0; 
	padding: 0; 
	border: none; 
	outline: none; 
}
a, 
a:hover,
a:active { 
	
}
ul li { 
	list-style: none; 
	line-height: 1.25em;
}
p { 
	line-height: 1.25em;
}
strong {
  	font-weight: bold;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  	line-height: 1.25em;
  	text-rendering: optimizelegibility;
  	margin: 0;
}
img {
  	border: 0;
  	-ms-interpolation-mode: bicubic;
  	outline: 0;
}
.clear {
	clear: both;	
}
@font-face {
    font-family: 'DIN';
    src: url('../fonts/DINPro.eot');
    src: local('☺'), url('../fonts/DINPro.woff') format('woff'), url('../fonts/DINPro.ttf') format('truetype'), url('../fonts/DINPro.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'DINBold';
    src: url('../fonts/DINProBold.eot');
    src: local('☺'), url('../fonts/DINProBold.woff') format('woff'), url('../fonts/DINProBold.ttf') format('truetype'), url('../fonts/DINProBold.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* *************************************************** */
html { 
	width: 100%;
	height: 100%;
}
body {
	width: 100%;
	height: 100%;
	background: #FFF;
	color: #333;
	font-family: 'DIN', Arial, Helvetica, sans-serif;
	font-size: 1em;
}
.container {
	width: 1000px;
	margin: 0 auto;
}
header {
	height: 100px;
}
header ul {
	
}
header ul li {
	float: left;
	width: 50%;
}
header ul li:first-child {
	text-align: left;
	padding-top: 40px;
}
header ul li:last-child {
	text-align: right;
	padding-top: 15px;
}
section {
	padding: 40px 0 80px;	
}
section .claim {
	
}
section .claim .hero {
	float: left;
	width: 50%;
}
section .claim .hero p img {
	max-width: 100%;
	height: auto;	
}
section .claim .info {
	float: right;
	width: 50%;
	padding-top: 30px;
}
section .claim .info h1 {
	font-size: 1.5em;
	color: #e5001d;
	font-weight: normal;
	margin-bottom: 30px;	
}
section .claim .info h1 strong {
	font-family: 'DINBold', Arial, Helvetica, sans-serif;
	font-weight: normal;
}
section .claim .info p {
	text-align: center;	
}
section .access {
	padding-top: 60px;
}
section .access p {
	text-align: center;
}
section .access p.user {
	width: 550px;
	height: 35px;
	margin: 0 auto;
}
	section .access p.user.user-pt {
		width: 500px;
	}
section .access p.user img {
	float: left;
	width: 35px;
}
section .access p.user span {
	display: inline-block;
	padding: 8px 0 0 10px;
}
section .access p.bt {
	margin-top: 50px;
}
section .access p.bt a {
	display: inline-block;
	margin: 0 auto;
	font-family: 'DINBold', Arial, Helvetica, sans-serif;
	color: #FFF;
	text-decoration: none;
	padding: 12px 40px;
	background: #e5001d;
	border-radius: 25px;
	-moz-border-radius: 25px;
	-webkit-border-radius: 25px;
}

@media screen and (max-width : 768px) {
	.container {
		width: 95%;
	}
}

@media screen and (max-width : 767px) {
	header {
		height: 70px;	
	}
	header ul li:first-child {
		padding-top: 30px;
	}
	header ul li:first-child img {
		width: 150px;
		height: auto;
	}
	header ul li:last-child img {
		width: 100px;
		height: auto;
	}
	section {
		padding: 20px 0 40px;
	}
	section .claim .hero {
		float: none;
		width: 100%;
	}
	section .claim .info {
		float: none;
		width: 100%;
	}
	section .claim .info h1 {
		font-size: 1.25em;
		text-align: center; 
	}
	section .access {
		padding-top: 30px;
	}
	section .access p.user,
	section .access p.user.user-pt {
		width: 100%;
		height: auto;
		margin: 0 auto;
	}
	section .access p.user img {
		float: none;
		margin: 0 auto 10px;
	}
	section .access p.user span {
    	display: block;
    	padding: 8px 0 0 10px;
	}
	section .access p.bt {
		margin-top: 30px;
	}
}