/* Credit: http://www.templatemo.com */

html, body {
	font-family: 'Raleway', "Trebuchet MS", Arial, Helvetica, sans-serif;
}

body {
  background-color: #000;
}

a {
	color: #e99f00;
}

a:hover {
	text-decoration: none;
}

p {
	color: #cc343c;
}
h1, h2, h3, h4, h5, h6 {
	font-family: 'Raleway', "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: 400;
}

img {
  	max-width: 100%;
  	height: auto;
  	width:100%;
}

.btn-primary {
  background-color: #e99f00;
  border-color: #e99f00;
}

.mainTop {
	margin: 0;
}
.mailme {
	line-height: 36px;
}
.fa-envelope {
	margin-right: 10px;
}

/* IMG slider TXT */
.imgTxt {
  color: white;
	text-align: center;
}
.txtWrap1 {
  color: white;
	margin: 0 auto;
}
.txtWrap1 ul {
	margin-bottom: 20px;
  padding-left: 0;
}
.txtWrap1 ul li {
	list-style-type: none;
	display: inline-block;
}
.tinyCell {
	width: 45px;
	height: 10px;
	border-bottom: 2px solid white;
	position: relative;
	top: -30px;
	margin: 0 30px;
}
.txtWrap1 h2 {
	text-transform: uppercase;
	font-weight: 100;
	margin-bottom: 0;
}
.txtWrap1 h1 {
	text-transform: uppercase;
	font-weight: 100;
	letter-spacing: 3px;
	margin-top: 0;
}

.txtWrap2 {
  color: white;
  margin: 0 auto;
}
.txtWrap2 p {
	margin-bottom: 30px;
	color: white;
	font-weight: 100;
}

/* logo + main menu */
.mWrapper {
	margin-bottom: 50px;
	box-shadow: 0 4px 4px -2px #ddd;
  	width: 100%;
  	background-color: white;
  	z-index: 5000;
}
.logo {
	padding: 0;
}
.mainMenu {

}
.mainMenu ul {
	float: right;
	padding-left: 0;
	margin-bottom: 0;
}
.mainMenu li {
	list-style-type: none;
	display: inline-block;
}
.mainMenu li a {
	display: block;
	text-transform: uppercase;
	padding: 20px;
}
.mainMenu li a:hover {
	background-color: #e99f00;
	color: whitesmoke;
}

.hexagon-a {
	height: 160px;
	margin-top: 6px;
	position: absolute;
	z-index: 300;
	left: 50%;
	margin-left: -55px;
}
.hexagon-a a {
  margin: 0 auto;
  width: 26%;
  display: block;
  min-width: 110px;
  position: relative;
}
.hexagon-a a.hlinktop:hover .hexa-a {
  background: #e99f00;
  color: #000;
}

#ytRed3 .hexagon-a a.hlinktop:hover .hexa-a{
  background: #ff0000;
  color: #000;
}

#twtPrp3 .hexagon-a a.hlinktop:hover .hexa-a{
  background: #4b367c;
  color: #000;
}

#actBlu3 .hexagon-a a.hlinktop:hover .hexa-a{
  background: #0093f2;
  color: #000;
}

#osuPnk3 .hexagon-a a.hlinktop:hover .hexa-a{
  background: #00cfff;
  color: #000;
}

#rsGry3 .hexagon-a a.hlinktop:hover .hexa-a{
  background: #c5aa79;
  color: #000;
}

/*#indBlu3 .hexagon-a a.hlinktop:hover .hexa-a{
  background: #2164f3;
  color: #000;
}*/

#gitGry3 .hexagon-a a.hlinktop:hover .hexa-a{
  background: #24292e;
  color: #000;
}

#udeOr3 .hexagon-a a.hlinktop:hover .hexa-a{
  background: #ea5252;
  color: #000;
}

.hexagon {
	height: 160px;
	margin-top: 60px;
}
.hexagon a.hlinkbott {
  margin: 0 auto;
  width: 26%;
  display: block;
  min-width: 120px;
  position: relative;
}

.hexagon a.hlinkbott:hover .hexa {
  background: #e99f00;
}

/* mid hexa */
.hexa-a {
  width: 100%;
  min-width: 110px;
  height: 0;
  padding-bottom: 57.7%;
  margin: 30% 0 0;
  background: #000;
  position: absolute;
  color: #e99f00;
  font-family: Futura, "Trebuchet MS", Arial, sans-serif;
  font-size: 32px;
  -webkit-transition: all 0.2s ease-in-out;
  -webkit-transition-delay: 0s;
  -moz-transition: all 0.2s ease-in-out 0s;
  -o-transition: all 0.2s ease-in-out 0s;
  transition: all 0.2s ease-in-out 0s;
  border-radius: 0%;
}

#ytRed {
  color: #ff0000;
}

#twtPrp {
  color: #4b367c;
}

#actBlu {
  color: #0093f2;
}

#osuPnk {
  color: #00cfff;
}

#rsGry {
  color: #c5aa79;
}

/*#indBlu {
  color: #2164f3;
}*/

#gitGry {
  color: #24292e;
}

#udeOr {
  color: #ea5252;
}

.hexa-a:before, .hexa-a:after {
  content: "";
  display: block;
  width: inherit;
  height: inherit;
  padding: inherit;
  background: inherit;
  -webkit-transform: rotate(60deg);
  -moz-transform: rotate(60deg);
  -ms-transform: rotate(60deg);
  -o-transform: rotate(60deg);
  transform: rotate(60deg);
  z-index: 0;
  position: absolute;
  border-radius: inherit;
}

.hexa-a:after {
  -webkit-transform: rotate(-60deg);
  -moz-transform: rotate(-60deg);
  -ms-transform: rotate(-60deg);
  -o-transform: rotate(-60deg);
  transform: rotate(-60deg);
}

.hcontainer-a {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}

.vertical-align-a {
  display: table;
  height: 100%;
  width: 100%;
}

.texts-a {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
} 

/* main Hexa */ 
.hexa {
  width: 100%;
  min-width: 120px;
  height: 0;
  padding-bottom: 57.7%;
  margin: 30% 0 0;
  background: #e99f00;
  position: absolute;
  color: #000;
  font-family: Futura, "Trebuchet MS", Arial, sans-serif;
  font-size: 14px;
  -webkit-transition: all 0.2s ease-in-out;
  -webkit-transition-delay: 0s;
  -moz-transition: all 0.2s ease-in-out 0s;
  -o-transition: all 0.2s ease-in-out 0s;
  transition: all 0.2s ease-in-out 0s;
  border-radius: 0%;
}

#ytRed2 {
  background: #ff0000;
}

#twtPrp2 {
  background: #4b367c;
}

#actBlu2 {
  background: #0093f2;
}

#osuPnk2 {
  background: #00cfff;
}

#rsGry2 {
  background: #c5aa79;
}

/*#indBlu2 {
  background: #2164f3;
}*/

#gitGry2 {
  background: #24292e;
}

#udeOr2 {
  background: #ea5252;
}

.hexa:before, .hexa:after {
  content: "";
  display: block;
  width: inherit;
  height: inherit;
  padding: inherit;
  background: inherit;
  -webkit-transform: rotate(60deg);
  -moz-transform: rotate(60deg);
  -ms-transform: rotate(60deg);
  -o-transform: rotate(60deg);
  transform: rotate(60deg);
  z-index: 0;
  position: absolute;
  border-radius: inherit;
}

.hexa:after {
  -webkit-transform: rotate(-60deg);
  -moz-transform: rotate(-60deg);
  -ms-transform: rotate(-60deg);
  -o-transform: rotate(-60deg);
  transform: rotate(-60deg);
}

.hcontainer {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}

.vertical-align {
  display: table;
  height: 100%;
  width: 100%;
}

.texts {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}