#homebutton{
color:#FF9900;
}
#profilebutton{
color:white;
}
#projectsbutton{
color:white;
}
#miscbutton{
color:white;
}

#master{
display: none;
z-index: 8;
height:450px;
width:1140px;
margin: 20px auto 20px auto;
background-color: #00FFCC;
border-radius: 7px;
position: relative;
}

#welcome{
position:absolute;
top:48%;
-webkit-transform: translate(0%, -50%);
-ms-transform: translate(0%, -50%);
-webkit-transform: translate(0%, -50%);
-moz-transform: translate(0%, -50%);
-o-transform: translate(0%, -50%);
transform: translate(0%, -50%);
left: 8%;
color: white;
font-family: 'Open Sans';
font-size: 36pt;
display: none;
}
#chinese{
position: absolute;
top:64%;
left: 77%;
color: white;
font-size: 42pt;
display: none;
}
#german{
position: absolute;
top:25%;
left: 72%;
color: white;
font-size: 36pt;
display: none;
font-family: open sans;
}


#canvas{
z-index: 9;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}

#bluewide{
display: none;
margin: auto;
min-width: 1140px;
background-image: url("../images/circuitbackground.jpg");
background-repeat:repeat-x;
background-position: 50% 50%;
}
#bluecolor{
min-width: 1140px;
background-color: rgba(0, 191, 255,0.8);
}
#blue{
font-family: 'lato';
color: white;
height: 170px;
width:1140px;
margin: auto;
font-weight: 100;
}
#circuit{
width:140px;
display:block;
position: relative;
top: 5%;
margin: auto;

}
#bluetext{
margin-top:0px;
margin-bottom:0px;
text-align: center;
position: relative;
top: 5%;
font-size: 16pt;
}
#redgreencontainer{
width: 1140px;
margin: auto;
position: relative;
}
#red{
display: none;
background-color:#E6005C;
height: 200px;
width:560px;
margin: 20px 0px 20px 0px;
border-radius: 10px;
font-family: 'lato';
color: white;
position: absolute;
top: 50%;
}

#red1{
font-family: 'lato';
position: absolute;
top:2%;
left: 50%;
-webkit-transform: translate(-50%, -0%);
-ms-transform: translate(-50%, -0%);
-webkit-transform: translate(-50%, -0%);
-moz-transform: translate(-50%, -0%);
-o-transform: translate(-50%, -0%);
transform: translate(-50%, 0%);
font-size:17pt;
z-index: 10;
}

#red img{
width: 100px;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}

#red2{
font-family: lato;
position: absolute;
top: 83%;
left: 50%;
-webkit-transform: translate(-50%, -0%);
-ms-transform: translate(-50%, -0%);
-webkit-transform: translate(-50%, -0%);
-moz-transform: translate(-50%, -0%);
-o-transform: translate(-50%, -0%);
transform:translate(-50%, 0%);
font-size: 17pt;
}




#green{
display: none;
background-color: #FFB84D;
height: 200px;
width: 560px;
float: right;
position: relative;
margin: 20px 0px 20px 0px;
border-radius: 10px;
}
#iconcontainer{
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 345px;
border-radius: 80px;
padding: 15px;
background-color: white;
}
#iconcontainer img{
margin-left:2px;
margin-right:2px;
display: none;
}
#facebook{
width: 75px;
}
#instagram{
width: 75px;
}
#email{
width: 75px;
}
#linkedin{
width: 83px;
}
#github{
width: 75px;
}