@font-face {
	font-family: BebasNeue Regular;
	src: url('../fonts/BebasNeue-Regular.ttf');
}

@font-face {
	font-family: BebasNeue Book;
	src: url('../fonts/BebasNeue Book.otf');
}

@font-face {
	font-family: GreatVibes Regular;
	src: url('../fonts/GreatVibes-Regular.ttf');
}

@font-face {
	font-family: AvantGardeMdITC;
	src: url('../fonts/avantgardeitcbybt-book.ttf');
}

@font-face {
	font-family: Myriad Roman;
	src: url('../fonts/Myriad Roman.ttf');
}
@font-face {
	font-family: Helvetica Neue;
	src: url('../fonts/Helvetica-Neue-Bold_22498.ttf');
}

@font-face {
	font-family: Helvetica;
	src: url('../fonts/helveticaneue-light-001.ttf');
}


html,
body,
div,
h1,
p,
a,
video {
  margin: 0;
  padding: 0;
}

html,
body {  
  text-align:center;
  background: url(../images/about-bg.png) no-repeat center bottom fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}



a:link, a:visited, a:hover, a:active  {
  color: #ffffff;
  text-decoration: none;
}

.main-page-wrapper {
	margin-top: 0;	
	margin-bottom: 0;
	min-height: 1500px;
}

.gold-line{
	position: fixed;
	top: 0;
	right: 0;
	z-index: 2;
	height: 100%;
}

.arrow-left{
	margin-top: 60px;
	margin-right: 120px;
	height: 100%;
}

.about-div{
	margin-left: 50px;
	background-color: rgba(0,0,0,0.5);
	height:100%;
	padding: 80px;
	width: 650px;
	padding-bottom:400px;
}

.about-header{
	font-family: BebasNeue Book;
	text-align: left;
	color: #ffffff;
	font-size: 65pt;
	text-shadow: 2px 2px 4px #000000;
}

.about-text{
	font-family:Helvetica Neue;
	text-align: left;
	color: #e1c474;	
	font-size: 17pt;
	text-shadow: 2px 2px 4px #000000;
}

.about-content{
	font-family: Helvetica;
	text-align: justify;
	color: #ffffff;	
	font-size: 12pt;
	font-weight: bold;
	letter-spacing: 1px;
	text-shadow: 2px 2px 4px #000000;
	padding-bottom: 40px;
	word-spacing:-2px;
}

.tgs-logo{
	display: inline-block;
    width:130px;
	float: right;
	margin: 5px;
}

@media screen and (min-height: 1365px) {

.gold-line{
	position: fixed;
	top: 0;
	right: 0;
	z-index: 2;
	height: 100%;
}

.arrow-left{
	margin-top: 60px;
	margin-right: 120px;
	height: 100%;
}

.about-div{
	margin-left: 50px;
	background-color: rgba(0,0,0,0.5);
	height:100%;
	padding: 80px;
	width: 550px;
	padding-bottom:400px;
}

.about-header{
	font-family: BebasNeue Book;
	text-align: left;
	color: #ffffff;
	font-size: 70pt;
	text-shadow: 2px 2px 4px #000000;
}

.about-text{
	font-family:Helvetica Neue;
	text-align: left;
	color: #e1c474;	
	font-size: 18pt;
	text-shadow: 2px 2px 4px #000000;
}

.about-content{
	font-family: Helvetica;
	text-align: justify;
	color: #ffffff;	
	font-size: 13pt;
	font-weight: bold;
	letter-spacing: 1px;
	text-shadow: 2px 2px 4px #000000;
	padding-bottom: 40px;
}

.tgs-logo{
	display: inline-block;
    width:150px;
	float: right;
	margin: 5px;
}
	
	
	
}


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

.gold-line{
	position: fixed;
	top: 0;
	right: 0;
	z-index: 2;
	height: 100%;
}

.arrow-left{
	margin-top: 60px;
	margin-right: 120px;
	height: 100%;
}

.about-div{
	margin-left: 50px;
	background-color: rgba(0,0,0,0.5);
	height:100%;
	padding: 80px;
	width: 650px;
	padding-bottom:400px;
}

.about-header{
	font-family: BebasNeue Book;
	text-align: left;
	color: #ffffff;
	font-size: 70pt;
	text-shadow: 2px 2px 4px #000000;
}

.about-text{
	font-family:Helvetica Neue;
	text-align: left;
	color: #e1c474;	
	font-size: 18pt;
	text-shadow: 2px 2px 4px #000000;
}

.about-content{
	font-family: Helvetica;
	text-align: justify;
	color: #ffffff;	
	font-size: 13pt;
	font-weight: bold;
	letter-spacing: 1px;
	text-shadow: 2px 2px 4px #000000;
	padding-bottom: 40px;
}

.tgs-logo{
	display: inline-block;
    width:150px;
	float: right;
	margin: 5px;
}
	
	
	
}

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

	.about-header{
		font-size: 60pt;
	}

	.about-text{	
		font-size: 16pt;
		
	}

	.about-content{	
		font-size: 12pt;
	}

	.tgs-logo{
		width:140px;
	}
	
	
}

@media screen and (max-width: 1024px) {
	.arrow-left{
		margin-top: 60px;
		margin-right: 120px;
		height: 100%
		
	}

	.about-div{
		margin-left: 50px;
		background-color: rgba(0,0,0,0.5);
		height:100%;
		padding: 50px;
		width: 650px;
		padding-bottom:400px;		
	}

	.about-header{
		font-size: 60pt;
	}

	.about-text{	
		font-size: 16pt;
		
	}

	.about-content{	
		font-size: 12pt;
	}

	.tgs-logo{
		width:140px;
	}

	
}

@media screen and (max-width: 991px) and (min-width: 801px) {
	.arrow-left{
		margin-top: 20px;
		margin-right: 60px;
		height: 50px;	
		z-index: 2;		
	}

	.about-div{
		margin-left: 0px;
		background-color: rgba(0,0,0,0.5);
		height:100%;
		padding: 30px;
		width: 300px;
		padding-bottom:50px;
	}

	.about-header{
		font-size: 45pt;
	}

	.about-text{	
		font-size: 12pt;
		
	}

	.about-content{	
		font-size: 9pt;
		
	}

	.tgs-logo{
		width:90px;
	}
	
		
}


@media screen and (max-width: 800px) and (min-width: 768px) {
	.arrow-left{
		margin-top: 20px;
		margin-right: 60px;
		height: 50px;	
		z-index: 2;		
	}

	.about-div{
		margin-left: 0px;
		background-color: rgba(0,0,0,0.5);
		height:100%;
		padding: 30px;
		width: 300px;
		padding-bottom:50px;
	}

	.about-header{
		font-size: 45pt;
	}

	.about-text{	
		font-size: 12pt;
		
	}

	.about-content{	
		font-size: 9pt;
		
	}

	.tgs-logo{
		width:90px;
	}
	

}

@media screen and (max-width: 767px) {
	.arrow-left{
		margin-top: 20px;
		margin-right: 60px;
		height: 50px;	
		z-index: 2;		
	}

	.about-div{
		margin-left: 0px;
		background-color: rgba(0,0,0,0.5);
		height:100%;
		padding: 30px;
		width: 300px;
		padding-bottom:50px;
	}

	.about-header{
		font-size: 45pt;
	}

	.about-text{	
		font-size: 12pt;
		
	}

	.about-content{	
		font-size: 9pt;
		
	}

	.tgs-logo{
		width:90px;
	}
	
}

@media screen and (max-width: 667px) {
	
	
	.arrow-left{
		margin-top: 20px;
		margin-right: 60px;
		height: 50px;	
		z-index: 2;		
	}

	.about-div{
		margin-left: 0px;
		background-color: rgba(0,0,0,0.5);
		height:100%;
		padding: 30px;
		width: 300px;
		padding-bottom:50px;
	}

	.about-header{
		font-size: 45pt;
	}

	.about-text{	
		font-size: 12pt;
		
	}

	.about-content{	
		font-size: 9pt;
		
	}

	.tgs-logo{
		width:90px;
	}
	
	
}

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

	.arrow-left{
		margin-top: 20px;
		margin-right: 60px;
		height: 50px;	
		z-index: 2;		
	}

	.about-div{
		margin-left: 0px;
		background-color: rgba(0,0,0,0.5);
		height:100%;
		padding: 30px;
		width: 300px;
		padding-bottom:50px;
	}

	.about-header{
		font-size: 45pt;
	}

	.about-text{	
		font-size: 12pt;
		
	}

	.about-content{	
		font-size: 9pt;
		
	}

	.tgs-logo{
		width:90px;
	}
	
}