@charset "utf-8";
#main {
	background-color: #FFFFFF;
}
#TextBox {
	height: auto;
	width: 80%;
	margin-right: auto;
	margin-left: auto;
	padding-top:30px;
	padding-bottom:40px;
	text-align:center;
}
#Icons{
  position:relative;
  height:250px;
  width:740px;
float:none;	
	margin-right: auto;
	margin-left: auto;
background-color:#FFFFFF;

	}

#Icon1  {
  position:relative;
  height:200px;
  width:240px;
float:left;

}

#Icon1 h1 {
	margin-top: 160px;
	margin-left:60px;
	float: left;

	}
#Icon1 img{
  position:absolute;
  left:0;
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
}

#Icon1  img.top:hover {
  opacity:0;
}
#Icon2  {
  position:relative;
  height:200px;
  width:240px;
float:left;
}

#Icon2 img{
  position:absolute;
  left:0;
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
}
#Icon2 h1 {
	margin-top: 160px;
	margin-left:90px;
	float: left;

	}
#Icon2  img.top:hover {
  opacity:0;
}
#Icon3  {
  position:relative;
  height:200px;
  width:240px;
float:left;

}

#Icon3 img{
  position:absolute;
  left:0;
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
}
#Icon3 h1 {
	margin-top: 160px;
	margin-left:70px;
	float: left;

	}
#Icon3  img.top:hover {
  opacity:0;
}
#Icon4  {
  position:relative;
  height:200px;
  width:240px;
float:left;

}

#Icon4 img{
  position:absolute;
  left:0;
  -webkit-transition: opacity 0.4s ease-in-out;
  -moz-transition: opacity 0.4s ease-in-out;
  -o-transition: opacity 0.4s ease-in-out;
  transition: opacity 0.4s ease-in-out;
}


#Icon4 h1 {
	margin-top: 160px;
	margin-left:50px;
	float: left;

	}
#Icon4  img.top:hover {
  opacity:0;
}

#TermoIcon h1 {
	text-align: center;
	margin-left:25px;
}
#SatIcon h1 {
	margin-left:59px;
}

#Socials {
	background-color: #333333;
	margin-top:0px;
	padding-top:30px;
	padding-bottom:30px;
	clear:both;
	height:500px;

}
#Socials a:hover {
	font-family: "open Sans";
	color: #FFFFFF;
	text-decoration: none;
}
#SocialsContainer {
	width:960px;
	margin-right: auto;
	margin-left: auto;
}
#Socials #RightSocials {
	position: absolute;
	width:35%;
	float:right;
	margin-left:430px;
}
#Socials #FacebookWidget {
	background-color: #FFFFFF;
	height: 500px;
	width: 300px;
	float:left;
	margin-left:70px;
	}

.VideoDescription {
	font-family: "open Sans";
	color: #FFFFFF;
	text-align: justify;
	font-size: 0.95em;
}

#YoutubeMobile{display:none;}
@media only screen and (max-width: 1080px) {
	#Icons{
  position:relative;
  height:430px;
  width:55%;
float:none;	
	margin-right: auto;
	margin-left: auto;
background-color:#FFFFFF;

	}
}
@media only screen and (max-width: 980px) {
	#Icons{
  position:relative;
  height:430px;
  width:70%;
float:none;	
	margin-right: auto;
	margin-left: auto;
background-color:#FFFFFF;

	}
}
@media only screen and (max-width: 780px) {
	#Icons{
  position:relative;
  height:430px;
  width:80%;
float:none;	
	margin-right: auto;
	margin-left: auto;
background-color:#FFFFFF;

	}
}
@media only screen and (max-width: 680px) {
	#Icons{
  position:relative;
  height:430px;
  width:100%;
float:none;	
	margin-right: auto;
	margin-left: auto;
background-color:#FFFFFF;

	}
}
@media only screen and (max-width: 550px) {
	#Icons{
  position:relative;
  height:820px;
  width:60%;
float:none;	
	margin-right: auto;
	margin-left: auto;
background-color:#FFFFFF;

	}
}
@media only screen and (max-width: 370px) {
	#Icons{
  position:relative;
  height:820px;
  width:60%;
float:none;	
	margin-right: auto;
	margin-left: 0px;
background-color:#FFFFFF;

	}
}
@media only screen and (max-width: 1050px) {
	#SocialsContainer {
	width:100%;
	margin-right: auto;
	margin-left: auto;
}
#Socials #FacebookWidget {
	background-color: #FFFFFF;
	height: 500px;
	width: 300px;
	float:left;
	margin-left:20px;
	}
#Socials #RightSocials {
	position: absolute;
	width:35%;
	float:right;
	margin-left:350px;
}
}
@media only screen and (max-width: 900px) {

#RightSocials #Youtube .VideoIframe {
	width: 280px;
	height:158 px;
		margin-left:auto;
	margin-right:auto;
}
#Youtube{display:none;}

#YoutubeMobile{display:block;}
}
@media only screen and (max-width: 720px) {
	#Socials #RightSocials {
	position: relative;
	width:80%;
	float:none;
	margin-left:auto;
	margin-right:auto;
	
}
#Socials #FacebookWidget {
	background-color: #FFFFFF;
	height: 500px;
	width: 300px;
	float:none;
	margin-left:30px;
		margin-left:auto;
	margin-right:auto;
	
	}
#Socials {
	background-color: #333333;
	margin-top:0px;
	padding-top:30px;
	padding-bottom:30px;
	clear:both;
	height:1100px;

}
h2{
	margin-top:20px;
	}
}
@media only screen and (max-width: 370px) {
	#RightSocials #Youtube .VideoIframe {
	width: 224px;
	height: 126px;
		margin-left:auto;
	margin-right:auto;
}
#Socials #FacebookWidget {
	background-color: #FFFFFF;
	height: 500px;
	width: 90%;
	float:none;
	margin-left:30px;
		margin-left:auto;
	margin-right:auto;
	
	}
	#Socials {
	background-color: #333333;
	margin-top:0px;
	padding-top:30px;
	padding-bottom:30px;
	clear:both;
	height:1200px;

}
}
