@font-face {
  font-family: 'NewRailAlphabet-Bold';
  src: url('../fonts/NewRailAlphabet-BoldWEB.eot'); /* IE9 Compat Modes */
  src: url('../fonts/NewRailAlphabet-BoldWEB.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/NewRailAlphabet-BoldWEB.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/NewRailAlphabet-BoldWEB.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/NewRailAlphabet-BoldWEB.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('../fonts/NewRailAlphabet-BoldWEB.svg#svgFontName') format('svg'); /* Legacy iOS */
}


/*-------------------------------
	KILL ALL PADDING AND MARGINS
	-----------------------------*/

/* padding: top left bottom right; */

html {
	margin: 0;
	padding: 0;
}
* {
	margin: 0;
	padding: 0;
}
body {
	color: #ccc;
	text-align: left;
	border: #000 solid 0px;

}


#main-contain-home {
	border: #fff solid 0px;
	width:100%;
	margin: 0px 15px 0 0;
	padding: 0px 0px 0px 0px;
	color: #000;
	text-align: left;

}


.center {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	width:100%;
	max-width:1140px;
	text-align:center;
  z-index: 2;
  opacity: 1;
  -webkit-transition: opacity .50s ease-in-out;
       -moz-transition: opacity .50s ease-in-out;
       -ms-transition: opacity .50s ease-in-out;
       -o-transition: opacity .50s ease-in-out;
       transition: opacity .50s ease-in-out;
	   cursor: pointer;
}
.center.hide {
  opacity: 0;
  -webkit-transition: opacity .50s ease-in-out;
       -moz-transition: opacity .50s ease-in-out;
       -ms-transition: opacity .50s ease-in-out;
       -o-transition: opacity .50s ease-in-out;
       transition: opacity .50s ease-in-out;
}

.center img {
	width:96%;
	max-width:1140px;

}


.thumbnail{
position: relative;
z-index: 0;

}

/* .thumbnail:hover{
background-color: transparent;
z-index: 50;

} */

.thumbnail span{ /*CSS for enlarged image*/
  z-index: 1;
position: fixed;
padding: 0px;
opacity: 0;
margin-right:15px;
/*    transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -webkit-transition: opacity 1s ease-in-out;*/
color: black;
text-decoration: none;
width:100%;
height:100%;
background:#fff;
/*-webkit-transition: opacity .50s ease-in-out;
     -moz-transition: opacity .50s ease-in-out;
     -ms-transition: opacity .50s ease-in-out;
     -o-transition: opacity .50s ease-in-out;
     transition: opacity .50s ease-in-out;*/
	 cursor: default;
	 
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 0px;
width: 100%;
border: 0px solid #000;
}

.thumbnail span.show { /*CSS for enlarged image on hover*/
opacity: 1.0;
z-index: 3;
/*    transition: opacity .20s ease-in-out;
    -moz-transition: opacity .20s ease-in-out;
    -webkit-transition: opacity .20s ease-in-out;*/
position: fixed;
top: 0px;
left: 0px; /*position where enlarged image should offset horizontally */
-webkit-transition: opacity .50s ease-in-out;
     -moz-transition: opacity .50s ease-in-out;
     -ms-transition: opacity .50s ease-in-out;
     -o-transition: opacity .50s ease-in-out;
     transition: opacity .50s ease-in-out;


}


#main-contain-home span h2 {
	display:block;
	text-decoration: none;
	font-family: 'NewRailAlphabet-Bold';
	font-size:190px;
	line-height:200px;
	border: #000 solid 0px;
	color:#000;
	position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);

  /*
  This doesn't work
  margin-left: -25%;
  margin-top: -25%;
  */

  width: 100%;
  max-width:1000px;
  /* height: 50%; */
  max-height:400px;

  padding: 0px;
  color: #000;
  text-align: center;
	border: solid 0px red;
	cursor: pointer;
}

#left-contain {
	border: #000 solid 0px !important;
	width: 235px;
	margin: 0px 0px 0px 0px;
	padding:38px 0px 0px 0px;
	color: #fff;
	text-align: left;
	background-image:  url(../images/markmuller-blk-01.svg);
	background-repeat: no-repeat;
	left:10px;
	top:10px;
	background-size:235px;
	background-position: top left;
	position:fixed;
}







#bottom-contain-home {
	position:absolute;
	bottom: 10px;
	left:14px;
	width: 190px;
	margin: 0 0 0px 0px;
	padding:14px 0 5px 2px;
	border: 0px solid #000;
}


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

#main-contain-home span h2 {
	font-size: 16.5vw;
	line-height: 16.5vw;

}

}

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



}


@media (max-width: 600px) {
#left-contain, #bottom-contain-home {
    display: none !important;
}


}


/* -------------------------------
   GENERAL LAYOUT TRICKERY
   ----------------------------- */

.material-icons {
    font-size: 64px !important;
}

.clear {
	font-size: 1px;
	height: 1px;
	clear: both;
}


.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.clearfix {display: inline-table;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}