body{

  width: 100%;
  margin:0;
  padding: 0;
  background-color: #FFFFFF;
  font-family: 'Rubik', sans-serif;
  -webkit-text-size-adjust: 100%;


}

a{

	text-decoration: none;
	color: inherit;

}

.page{

  background-color: #FFFFFF;
  width: 100%;
  position: relative;
  display: block;

  margin: 0px;
  padding: 0px;
  float: none;

  font-size:13px;
  color: #999999;
  text-align: left;
  float: left;
  padding-bottom: 80px;

  border-radius: 0px;
  border-style: none;
  border-width: 0px;
  border-color: #dddddd;
  border-color: transparent; /* remove the border's colour */
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.0); /* emulate the border */

}



.dbutton{

padding: 10px;
padding-left: 30px;
padding-right: 30px;
font-size: 20px;
border-width: 1px;
border-style: solid;
margin-right: 20px;
display: inline-block;
margin-top: 20px;


}

.downloadBar{

width: 100%;
padding-top: 20px;
display: inline-block;

}

.pageContent{

  padding-top: 30px;
  padding-left: 0px;
  width: 100%;
  display: block;

}

.socialButton{

  width: 40px;
  height: 40px;
  background-repeat: no-repeat;
  background-size: contain;
  display: inline-block;
  margin-right: 10px;

}

#headerContainer{
 
  height:130px; 

}

hr{

  border-radius: 0px;
  border-style: none;
  border-width: 0px;
  height: 2px;
  background-color: #eeeeee;
}

#headerLogo{

	background-image: url("../images/title.gif");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: left center;
  position: relative;
  left: 0px;
  height:50px; 
  top: 75px;
  width: 200px;
  z-index: 20;

}

#headerWave{

  background-image: url("../waves.gif");
  background-size: contain;
  background-repeat: repeat-x;
  background-position: center center;
  position: absolute;
  right: 0%;
  height:35px; 
  top: 66px;
  width: 100%;

}

#headerSymbol{

  background-image: url("../images/titleSymbol.gif");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right center;
  position: absolute;
  right: 0px;
  height:45px; 
  top: 80px;
  width: 200px;

}

.container { 

  width: 100%;
  max-width: 1000px;
  display: block;
  position: relative;
  margin-right: auto;
  margin-left: auto;

} 

.productContainer{

  position: relative;
  width: 33.333%;
  display: inline-block;
  margin: 0px;
  padding: 0px;
  float: left;

  font-size:13px;
  color: #999999;
  text-align: left;
  margin-top: 25px;
  overflow: hidden;

  border-radius: 0px;
  border-style: solid;
  border-width: 0px;
  border-color: #dddddd;
  border-color: transparent; /* remove the border's colour */
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1); /* emulate the border */

}

.productContainer:after {

  content: "";
  display: block;
  padding-bottom: 100%;

}

.productContent {

  position: absolute;
  width: 100%;
  height: 100%;

 }

.productImage {
 
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
   
}

.productTextContainer{

  position: absolute;
  top: 0px;
  margin-bottom: 10px;
  padding-bottom: 20px;
  padding-top: 25px;
  padding-left: 30px;
 
}

.squaretext{

  width: 80%;
  position: relative;
  letter-spacing: 2px;
  text-transform: uppercase;
  line-height: 130%;

}


.productTitle {
 
  position: relative;
  left: 0px;
  width: 80%;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: left center;
  font-size: 25px;
  text-transform: uppercase;
  letter-spacing: 5px;
  color: white;
  margin-bottom: 0px;
  display: block;
  margin-right: 50px;

}








.square2w:after {

  content: "";
  display: block;
  padding-bottom: 52.5%;

}

.square2w {
 
   width: 63.00%;
   margin-left: 3.5%;

}

.square3w:after {
  
  content: "";
  display: block;
  padding-bottom: 40%;

}

.square3w {
 
   width: 100%;

}





.footer{

	text-transform: uppercase;
	color: #999999;
	font-size:13px;
	letter-spacing: 2px;
	margin-top: 50px;

	width: 100%;
	min-height: 100px;
	display: inline-block;
	margin-bottom: 50px;
	line-height: 150%;

}

.footer_left{

	float: left;
	text-align: left;
	width: 40%;
	clear: left;
  display: inline-block;

}

.footer_right{

	width: 40%;
	float: right;
	text-align: right;
  display: inline-block;

}

.footer_right a:hover{

	color: #307be2;

}


@media  (max-width: 1200px) {

.container { 
  width: 90%;

} 

.productContainer{

  font-size:13px;

}



}


@media (max-aspect-ratio: 4/5){

.footer_left{

  float: left;
  text-align: left;
  width: 100%;
  clear: left;
  display: inline-block;
  margin-top: 10px;
  font-size: 15px;
  line-height: 140%;

}

.footer_right{

  width: 100%;
  float: left;
  text-align: left;
  display: inline-block;
  font-size: 15px;
  line-height: 140%;

}


.container { 
  width: 90%;

} 

#headerContainer{
 
  height:180px; 

}

#headerLogo{

  height:55px; 
  top: 85px;

}



#headerWave{

  height:55px; 
  top: 86px;
 
}

#headerSymbol{

  height:55px; 
  top: 85px;

}

.titleImage {
 
  font-size: 30px;
  margin-bottom: 20px;

}

.productTitle {
 
  font-size: 25px;

}

.productContainer{

  font-size:18px;
  margin-bottom: 40px;
  width: 100%;
  margin-top: 25px;
}

.square2w:after {
  
  content: "";
  display: block;
  padding-bottom: 100%;

}

.square3w {
 
   width: 100%;
   margin-top: 25px;

}

.square3w:after {
  
  content: "";
  display: block;
  padding-bottom: 100%;

}

.square2w {
 
   width: 100%;
   margin-top: 25px;
   margin-left: 0.0%;

}

.square:after {
  
  content: "";
  display: block;
  padding-bottom: 100%;

}




}