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

body {
	background: #0d131f url(images/jorime-bg@1x.jpg) center 0 no-repeat;
	background-size: 1920px 1080px;
	padding-top:30px;
	font-family: 'Open Sans', sans-serif;
	font-weight: 600;	
	font-size: 16px;
	-moz-text-size-adjust: none;
	-webkit-text-size-adjust: none;
	-ms-text-size-adjust: none;
	text-size-adjust: none;
}
@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) { 
	body {
		background:#0d131f url(images/jorime-bg@2x.jpg) center 0 no-repeat;
		background-size: 1920px 1080px;
	}
}
a:visited, a:hover, a:focus, a:hover, a:active { 
	text-decoration: none; 
	outline: none;
}
#container {
	position: relative;
	width: 490px;
	margin: 0 auto;
	padding: 0;
}
.headline {
	width:490px;
	font-size: 147px;
	line-height: 150px;		
	font-weight: 300;
	color: #20283d;
	text-align:justify;
	padding-left: 16px;
}
.subline-social {
	width:490px;
	height: 22px;
	margin-top: 35px;
	font-size: 22px;
	line-height: 22px;		
	color: #74db71;
	text-transform: uppercase;
}
.social-box {
	margin-top: 20px;		
}
.social-link {
	width: 150px;
	height: 150px;
	float: left;
	margin-right: 20px;	
}
.social-box a:nth-of-type(3) {
	margin-right: 0;	
}
.social-icon {
	float: left;
	width: 150px;
	height: 150px;
	overflow: hidden;
	-webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
	outline: 1px solid transparent;
}
.social-link:hover .social-icon {
	backface-visibility: hidden;
	transform-origin: 50% 50% 0px;
	transform: perspective(130px) rotateY(10deg);
}
.youtube, .soundcloud, .myspace {
	background: rgba(255,255,255,0.1);		
}
.social-link:hover .youtube {
	background: rgba(240,0,40,1);
}
.social-link:hover .soundcloud {
	background: rgba(255,79,0,1);
}
.social-link:hover .myspace {
	background: rgba(0,123,194,1);	
}
.social-icon img {
	width: 150px;
	height: 150px;
}
.info {
	position: relative;
	margin: 30px 0;
	padding-right: 60px;
	width: 490px;
	color: #20283d;	
	text-align: justify;
	box-sizing: border-box;
}
.facebook {
	position: absolute;
	overflow: hidden;
	top: 4px;
	left: 450px;
	width: 40px;
	transition: all 0.2s ease-in-out;
	outline: 1px solid transparent;			
}
.facebook img {
	width: 122px;
	height: 82px;
}
.facebook:hover {
	width: 122px;
	transform: scale(1.05);
}
.clear {
	clear: both;	
}