html{
  font-size: 62.5%;
}

body{
  font-size: 2rem;
  background-color: #5c6874;
}

body,html{
  margin: 0px;
  padding: 0px;
}


/*- + - + - General - + - + -*/

.clearfix:after {
content: "";
display: table;
clear: both;
}

h1, p, a{
  font-family: old standard tt;
}

h1{
  font-size: 6.6rem;
}

p{
  color: #fff;
  margin-top: 4rem;
  margin-bottom: 1rem;

}

a{
  color: #222930;
	text-decoration: none;

}

img{
  vertical-align:middle;
}


/*- + - + - Back Section - + - + -*/

.back-cont{
  width:100%;
}

.back-left{
  float:left;
  width:50%;
}

.back-cont .back-right{
  float:right;
  height:100%;
}

.back-cont .back-right img{
  width:auto;
  height: 33.33vh;
  float:left;
}


/*- + - + - Front Section - + - + -*/

.front-cont{
  box-shadow: 0px 0px 0px 9px #fff;
  position: absolute;
  top:40px;
  bottom:40px;
  left:40px;
  right:40px;
}

.front-left{
  width: 50%;
  float:left;
  box-sizing: border-box;
  padding: 0px 12.8rem;
  position:absolute;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
}

.front-left h1 {
  line-height:1;
  margin: 0px;
	color: #fff;
	font-weight: lighter;
	text-transform: uppercase;
}

.front-left hr{
  width:17.2rem;
  height:3px;
  background-color: #fff;
  border:none;
  display:block;
  text-align:left;
  margin: 3.9rem 0rem 5.5rem 0rem;
}

.logo {
	position: absolute;
	top: -9px;
	left: -9px;
}


/*- + - + - Twitter Section - + - + -*/

.twitter p {
	font-size: 1.6rem;
}

.twitter img{
  margin-right:8px;
}

.twitter a{
  font-size: 1.8rem;
  font-family: times new roman;
  font-weight: lighter;

}

.twitter a:after {
	content: '';
	width: 1px;
	height: 20px;
	display: inline-block;
	background-color: #394046;
  margin: 0px 10px 0px 16px;
	vertical-align: bottom;
}

.twitter a:last-of-type:after{
  display:none;
}


/*- + - + - Media Queries- + - + -*/

@media only screen and (max-width: 1730px){
  html{
    font-size: 9px;
  }
}

@media only screen and (max-width: 1685px){
  .back-cont .back-right img:nth-of-type(3n) {
	   display: none;
  }
}

@media only screen and (max-width: 1619px){
  html{
    font-size: 8px;
  }
}


@media only screen and (max-width: 1110px){
  .back-cont .back-right img:nth-of-type(2n) {
	   display: none;
  }

  .front-left{
    width:65%;
  }
}

@media only screen and (max-width: 850px){
  .back-cont{
    display:none;
  }

  .front-cont{
    position:static;
    box-shadow: none;
    margin: 100px 0px;
  }

  .front-left{
    width:100%;
    position:relative;
    top: 0px;
    transform: none;
    -moz-transform: none;
    -webkit-transform: none;
  }
}

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

}

@media only screen and (max-width: 600px){
  .front-left {
	  padding: 6rem;
	  margin-top: 6rem;
  }

  .front-cont {
	 margin: 0px;
  }
}