html { 
  background: url(../img/1920x1280_mystic.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
body {
	font-size: 14px;
}

div.centered {
    position:absolute;
    top:52%;
    left:32%;
	width:50%;
	height:50%;
}

.content{
	float:left;
/*	margin-left:20%;*/
	top:0;
	left:40%;
	width: 50%;
	height:100%;
	z-index: 3;
	color:#fff;
	text-align: left;
}
.intro {
	position: relative;
	top: 390px;
}
.logo{
	width:35%;
	margin-bottom:15px;
	margin-top:30px;

}
h2{
	font-size:50px;
	line-height: 5.125rem;
	font-family: "Raleway";
	font-weight: 400;
	color:#fff;
	text-align:center;
	margin-top:10px;
}

@media only screen and (max-width: 1900px) {

  	h2{
		font-size:50px;
		line-height: 5.125rem;
		font-family: "Raleway";
		font-weight: 400;
		color:#fff;
		margin-bottom: 0px;
		margin-left:0px;
  	}
	div.centered {
	    position:absolute;
	    top:52%;
	    left:30%;
		width:50%;
		height:50%;
}
}

@media only screen and (max-width: 1760px) {

  	h2{
		font-size:50px;
		line-height: 5.125rem;
		font-family: "Raleway";
		font-weight: 400;
		color:#fff;
		margin-bottom: 0px;
		margin-left:0px;
  	}
	div.centered {
	    position:absolute;
	    top:52%;
	    left:27%;
		width:50%;
		height:50%;
}
}
@media only screen and (max-width: 1600px) {

  	h2{
		font-size:44px;
		line-height: 4.725rem;
		font-family: "Raleway";
		font-weight: 400;
		color:#fff;
		margin-bottom: 0px;
		margin-left:0px;
  	}
	div.centered {
	    position:absolute;
	    top:52%;
	    left:28%;
		width:50%;
		height:50%;
}
}
@media only screen and (max-width: 1400px) {

  	h2{
		font-size:40px;
		line-height: 4.525rem;
		font-family: "Raleway";
		font-weight: 400;
		color:#fff;
		margin-bottom: 0px;
		margin-left:0px;
  	}
	div.centered {
	    position:absolute;
	    top:52%;
	    left:28%;
		width:50%;
		height:50%;
}
}
@media only screen and (max-width: 1300px) {

  	h2{
		font-size:36px;
		line-height: 4rem;
		font-family: "Raleway";
		font-weight: 400;
		color:#fff;
		margin-bottom: 0px;
		margin-left:0px;
  	}
	div.centered {
	    position:absolute;
	    top:52%;
	    left:28%;
		width:50%;
		height:50%;
}
}
@media only screen and (max-width: 1199px) {

  	h2{
		font-size:34px;
		line-height: 3.750rem;
		font-family: "Raleway";
		font-weight: 400;
		color:#fff;
		margin-bottom: 0px;
		margin-left:0px;
  	}
	div.centered {
	    position:absolute;
	    top:52%;
	    left:28%;
		width:50%;
		height:50%;
}
}
@media only screen and (max-width: 992px) {

  	h2{
		font-size:34px;
		line-height: 3.750rem;
		font-family: "Raleway";
		font-weight: 400;
		color:#fff;
		margin-bottom: 0px;
		margin-left:0px;
  	}
	div.centered {
	    position:absolute;
	    top:50%;
	    left:27%;
		width:50%;
		height:50%;
}
	.logo {
		width:45%;
		
}
}
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape){ 

	div.centered {
	    position:absolute;
	    top:25%;
	    left:28%;
		width:50%;
		height:50%;
}
	.logo {
		width:65%;
		
}
}
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : portrait){ 

	div.centered {
	    position:absolute;
	    top:40%;
	    left:30%;
		width:50%;
		height:50%;
}
	.logo {
		width:85%;

}
}
@media only screen and (min-device-width : 375px) and (max-device-width : 627px) and (orientation : portrait) {

	div.centered {
	    position:absolute;
	    top:45%;
	    left:30%;
		width:50%;
		height:50%;
}
	.logo {
		width:85%;

}
}

@media only screen and (min-device-width : 375px) and (max-device-width : 667px) and (orientation : landscape) {

	div.centered {
	    position:absolute;
	    top:25%;
	    left:28%;
		width:50%;
		height:50%;
}
	.logo {
		width:65%;

}
}
@media only screen and (min-device-width : 414px) and (max-device-width : 736px) and (orientation : portrait) {

	div.centered {
	    position:absolute;
	    top:45%;
	    left:30%;
		width:50%;
		height:50%;
}
	.logo {
		width:85%;

}
}

@media only screen and (min-device-width : 414px) and (max-device-width : 736px) and (orientation : landscape) {

	div.centered {
	    position:absolute;
	    top:30%;
	    left:28%;
		width:50%;
		height:50%;
}
	.logo {
		width:65%;

}
}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {

  	h2{
		font-size:44px;
		line-height: 4rem;
		font-family: "Raleway";
		font-weight: 400;
		color:#fff;
		margin-bottom: 0px;
		margin-left:0px;
}
	div.centered {
	    position:absolute;
	    top:50%;
	    left:30%;
		width:50%;
		height:50%;
}
	.logo {
		width:75%;

}
}