body{
font-family:Arial, Helvetica, sans-serif;
font-size: 10px;
background:#fafafa url('https://i.pinimg.com/originals/58/3b/d8/583bd8be37d8feac9d85e450d8ed6555.png') repeat-x right top;
background-size: contain;
}

a:link, a:active, a:visited{
color: #a0a0a0;
font-style:italic;
letter-spacing:1px;
text-decoration: none;
}

#profile-container{ background:none; }
img{
max-width:100%;
}




#center{
left:50%;
top:50%;
margin:-300px 0 0 -400px;
position:fixed;
width:800px;
height:600px;
background: url('') repeat right top;
overflow:hidden;
}


#boxone{
margin:490px 0px 0px 0px;
width:260px;
height:110px;
position:absolute;
}

#boxtwo{
margin:490px 0px 0px 270px;
width:260px;
height:110px;
position:absolute;
}

#boxthree{
margin:490px 0px 0px 540px;
width:260px;
height:110px;
position:absolute;
}

#boxed, #boxed2, #boxed3 {
width:250px;
height:90px;
padding:5px 5px 10px 5px;
bottom:-3px;
left:0;
position:absolute;
background:#2B1C33;
z-index: 123456!important;
display:block;
}

#boxone:hover, #boxtwo:hover, #boxthree:hover{
margin-top: 0;
padding-top:490px;
}

#boxone:hover #aboutone, #boxtwo:hover #abouttwo,#boxthree:hover #aboutthree{
top:0px;
}

 @font-face {font-family:neou; src:url('https://dl.dropboxusercontent.com/s/ggesu9cscg40a2p/neou-thin.ttf?dl=1'); format(“truetype”);}

#boxone h1, #boxtwo h1, #boxthree h1 {
font:35px "neou";
margin-top:20px;
color:#ccc;
text-transform:uppercase;
letter-spacing:0px;
text-align:center;
}

#boxone p, #boxtwo p, #boxthree p{
font:7px trebuchet ms;
letter-spacing:2px;
color:#ccc;
text-transform:uppercase;
text-align:center;
margin-top:15px;
margin-bottom:-20px;
line-height:7px;
}

.lineone{
width:260px;
height:1px;
background-image:linear-gradient(to right,transparent,#f0ab66,#f0ab66,transparent);
display:inline-block;
margin-top:13px;
margin-left:-5px;
position:absolute;
}

.linetwo{
width:260px;
height:1px;
background-image:linear-gradient(to right,transparent,#f0ab66,#f0ab66,transparent);
display:inline-block;
margin-left:-5px;
margin-top:13px;
position:absolute;
}

.linethree{
width:260px;
height:1px;
background-image:linear-gradient(to right,transparent,#f0ab66,#f0ab66,transparent);
display:inline-block;
margin-top:13px;
margin-left:-5px;
position:absolute;
}

@font-face {
font-family: "motor oil";
src: url('http://static.tumblr.com/1f1tzta/9Rcmhm0yl/motor_oil_1937_m54.ttf');
}

.letter, .letter2, .letter3 {
font-size:40px;
position:absolute;
z-index:1;
color:#181528;
top:-9px;
margin-left:2px;
opacity: .2;
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out;
-ms-transition: all 0.7s ease-in-out;
transition: all 0.7s ease-in-out;

}

#letter:hover{
  opacity: .5;
  -webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out;
-ms-transition: all 0.7s ease-in-out;
transition: all 0.7s ease-in-out;
}


.initialsone {
width: 50px;
height: 0px;
padding:15px 0;
position: relative;
color:#fff;
background: #f0ab66;
margin:0 auto;
}

.initialsone:before {
content: "";
position: absolute;
top: -10px;
left: 0;
width: 0;
height: 0;
border-left: 25px solid transparent;
border-right: 25px solid transparent;
border-bottom: 10px solid #f0ab66;
}

.initialsone:after {
content: "";
position: absolute;
bottom: -10px;
left: 0;
width: 0;
height: 0;
border-left: 25px solid transparent;
border-right: 25px solid transparent;
border-top: 10px solid #f0ab66;
}

.initialstwo {
width: 50px;
height: 0px;
padding:15px 0;
position: relative;
color:#fff;
background: #f0ab66;
margin:0 auto;
}

.initialstwo:before {
content: "";
position: absolute;
top: -10px;
left: 0;
width: 0;
height: 0;
border-left: 25px solid transparent;
border-right: 25px solid transparent;
border-bottom: 10px solid #f0ab66;
}

.initialstwo:after {
content: "";
position: absolute;
bottom: -10px;
left: 0;
width: 0;
height: 0;
border-left: 25px solid transparent;
border-right: 25px solid transparent;
border-top: 10px solid #f0ab66;
}

.initialsthree {
width: 50px;
height: 0px;
padding:15px 0;
position: relative;
color:#fff;
background: #f0ab66;
margin:0 auto;
}

.initialsthree:before {
content: "";
position: absolute;
top: -10px;
left: 0;
width: 0;
height: 0;
border-left: 25px solid transparent;
border-right: 25px solid transparent;
border-bottom: 10px solid #f0ab66;
}

.initialsthree:after {
content: "";
position: absolute;
bottom: -10px;
left: 0;
width: 0;
height: 0;
border-left: 25px solid transparent;
border-right: 25px solid transparent;
border-top: 10px solid #f0ab66;
}

#aboutone{
width:238px;
height:465px;
background:#2B1C33;
padding:10px;
position:absolute;
top:500px;
color:#CBCBCB;
line-height:17px !important;
font:11px calibri;
overflow:hidden;
border: solid .5px #f0ab66;
}
@font-face {font-family: "vdj";src: url('https://dl.dropboxusercontent.com/s/vn84aq1yx6s7jti/vdj.ttf?dl=1'); format("truetype");}


#abouttwo{
width:238px;
height:465px;
background:#2B1C33;
color:#fff;
padding:10px;
position:absolute;
top:500px;
overflow:hidden;
font:7px trebuchet ms;
border: solid .5px #f0ab66;

}

#aboutthree{
width:238px;
height:465px;
background:#2B1C33;
color:#CBCBCB;
padding:10px;
position:absolute;
top:500px;
overflow:hidden;
font:7px trebuchet ms;
text-align: justify;
text-transform: uppercase;
letter-spacing:1px;
border: solid .5px #f0ab66;

}

.clear{
width:235px;
border:1px solid #f0ab66;
background: #2B1C33 url('http://static1.squarespace.com/static/59a21ce68fd4d26e0437553f/59a21fa0ff7c506488d47cd5/59f3d871c83025bbacf9c350/1509153429595/illustration-skylines-feature.gif') right;
background-size:cover;
opacity: ;
float:left;
-moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
    -ms-filter: fliph; /*IE*/
    filter: fliph; /*IE*/
}
.clear img{width:240px;
opacity:.6;}

.transition{
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out;
-ms-transition: all 0.7s ease-in-out;
transition: all 0.7s ease-in-out;
}


span{float:left;}
#abouttwo p, #aboutone p {
  padding-left:25px;
  padding-right:25px;
  letter-spacing: .5px;
color:#CBCBCB;
padding-top:3px;
padding-bottom:3px;
text-align:right;
text-transform:uppercase;
}

h2{
font-size:10px;
font-weight:bold;
font-style:italic;
text-transform:uppercase;
text-align:center!important;
margin-bottom:5px!important;
padding-bottom:10px!important;
padding-top:20px;
border-bottom:1px dotted #ccc!important;
color:#CBCBCB;
width:80%!important;
margin-left:10%!important;
}