/*
filter: alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
*/


/* overflow-y: hidden ! important;
overflow-x: hidden ! important; */



@font-face{
font-family: myGothic;
src: url('type/Copperplate'); 
} 

@font-face{
font-family: myText;
src: url('type/constan.ttf'); 
} 



body{
min-width: 1240px;
margin:0;
overflow: scroll;
background-color: white;
overflow-x: hidden ! important;
}


.copyright{
color: silver;
text-align: right;
font-size: 9pt;
margin-right: 10px;
font-family: myText;
letter-spacing: 2px;
word-spacing: 1px;
}


#logo{
margin:0 auto;
margin-top: 160px;
border-collapse: collapse;
outline: 0;
}

img{
border-style: none;
}

a img{
border-style: none;
border-collapse: collapse;
outline: 0;
}

a img#logo{
border-style: none;
border-collapse: collapse;
outline: 0;
}

.scroll{
outline: 0;
}


hr{
color: black;
background-color: none;
border-color: none;
width: 540px;
height: 2px;
}



#tag{
font-family: myGothic;
letter-spacing: 5px;
word-spacing: 3px;
}







.nav{
display: block;
position: fixed;
margin-left: -60px;
font-family: myGothic;
text-align: left;
font-size: 12pt;
letter-spacing: 2px;
margin-top: -20px;
}

.nav a:link{
display: block;
outline: none;
width: 136px;
height: 25px;
background-image: url('images/point001.png');
background-position: left center;
background-repeat: no-repeat;
color: white;
text-decoration: none;
padding-left: 16px;
padding-top: 6px;
}

.nav a:visited{
display: block;
outline: none;
width: 136px;
height: 25px;
background-image: url('images/point001.png');
background-position: left center;
background-repeat: no-repeat;
color: white;
text-decoration: none;
padding-left: 16px;
padding-top: 6px;
}

.nav a:hover{
display: block;
outline: none;
width: 136px;
height: 25px;
background-image: url('images/point002.png');
background-position: left center;
background-repeat: no-repeat;
color: black;
text-decoration: none;
padding-left: 16px;
padding-top: 6px;
}

.nav a:active{
display: block;
outline: none;
width: 136px;
height: 25px;
background-image: url('images/point002.png');
background-position: left center;
background-repeat: no-repeat;
color: black;
text-decoration: none;
padding-left: 16px;
padding-top: 6px;
}





#me{
display: block;
float: left;
border: 4px double black;
margin-top: 10px;
margin-right: 10px;
}





.main{
display: block;
margin:0 auto;
margin-top: -1px;
min-width: 650px;
max-width: 650px;
z-index: 20;
text-align: center;
border: 1px solid black;
background-color: white;
}

.intro{
display: block;
font-family: myText;
letter-spacing: 3px;
word-spacing: 1px;
text-align: center;
}

.content{
display: block;
font-family: myText;
letter-spacing: 1px;
word-spacing: 2px;
text-align: justify;
text-justify: inter-word;
width: 455px;
padding-right: 45px;
padding-left: 150px;
}







#home{
background-image: url('images/nomen00.png');
background-position: top left;
background-repeat: no-repeat;
}

#about{
background-image: url('images/nomen1.png');
background-position: top left;
background-repeat: no-repeat;
}

#service{
background-image: url('images/nomen2.png');
background-position: top left;
background-repeat: no-repeat;
}

#portfolio{
background-image: url('images/nomen3.png');
background-position: top left;
background-repeat: no-repeat;
}

#contact{
background-image: url('images/nomen4.png');
background-position: top left;
background-repeat: no-repeat;
}







.title{
display: block;
font-family: myGothic;
font-size: 22pt;
text-align: right;
font-weight: 900;
margin-left: -20px;
margin-top: 70px;
}

.space{
display: block;
min-height: 800px;
max-height: 800px;
background-image: url('images/flare.png');
background-repeat: no-repeat;
background-position: center center;
}




ul{
list-style-image:url('images/ul-li.png');
line-height: 30px;
}


.middle{
vertical-align:middle;
}





.toggle{
display: block;
height: 400px;
background-color: white;
font-family: myText;
font-size: 10pt;
padding: 5px;
width: 516px;
margin-left: -60px;
clear: both;
}

#graphic-top{
background-image: url('images/toggle01.png');
background-repeat: no-repeat;
background-position: top right;
margin-top: -5px;
margin-right: -5px;
padding-top: 20px;
padding-left: 26px;
}

#graphic-center, #media-center{
display: block;
background-image: url('images/toggle-center.png');
background-repeat: repeat-y;
background-position: top right;
margin-top: -5px;
margin-right: -5px;
padding-top: 20px;
padding-left: 26px;
padding-right: 26px;
font-family: myGothic;
}

#graphic-bottom, #media-bottom{
background-image: url('images/toggle-bottom.png');
background-repeat: no-repeat;
background-position: top right;
margin-top: -5px;
margin-right: -5px;
padding-top: 20px;
padding-left: 26px;
height: 35px;
clear: both;
}

#media-top{
background-image: url('images/toggle02.png');
background-repeat: no-repeat;
background-position: top right;
margin-top: -5px;
margin-right: -5px;
padding-top: 20px;
padding-left: 26px;
}







.design{
display: block;
float: right;
width: 120px;
height: 20px;
background-image: url('images/tab1.png');
background-repeat: no-repeat;
background-position: bottom center;
color: white;
text-align: right;
font-family: myGothic;
font-weight: 900;
padding: 11px 5px 5px 5px;
margin-left: 10px;
cursor: pointer;
}

.design:hover{
display: block;
float: right;
width: 120px;
height: 20px;
background-image: url('images/tab2.png');
background-repeat: no-repeat;
background-position: bottom center;
color: black;
text-align: right;
font-family: myGothic;
font-weight: 900;
padding: 11px 5px 5px 5px;
margin-left: 10px;
cursor: pointer;
}


.click{
display: block;
float: right;
width: 120px;
height: 20px;
background-image: url('images/tab2.png');
background-repeat: no-repeat;
background-position: bottom center;
color: black;
text-align: right;
font-family: myGothic;
font-weight: 900;
padding: 11px 5px 5px 5px;
margin-left: 10px;
cursor: pointer;
}

.click:hover{
display: block;
float: right;
width: 120px;
height: 20px;
background-image: url('images/tab2.png');
background-repeat: no-repeat;
background-position: bottom center;
color: black;
text-align: right;
font-family: myGothic;
font-weight: 900;
padding: 11px 5px 5px 5px;
margin-left: 10px;
cursor: pointer;
}







.wrap{
display: block;
margin-top: 5px;
overflow: auto;
word-spacing: 0px;
letter-spacing: 0px;
}

.cushion{
display: block;
float: left;
margin: 3px;
margin-top: 0px;
}

.video{
filter: alpha(opacity=65);
-moz-opacity:0.65;
-khtml-opacity: 0.65;
opacity: 0.65;
border: 5px solid silver;
}

.video:hover{
filter: alpha(opacity=100);
-moz-opacity:1.0;
-khtml-opacity: 1.0;
opacity: 1.0;
border-color: silver;
}

.sub{
font-family: myText;
font-size: 9pt;
color: silver;
}

#clear{
clear: both;
}


/*
.thumb{
width: 100px;
height: 100px;
padding: 5px;
background-color: silver;
border: 1px solid silver;
margin: 2px;
float: left;
filter: alpha(opacity=70);
-moz-opacity:0.7;
-khtml-opacity: 0.7;
opacity: 0.7;
}


.thumb:hover{
width: 100px;
height: 100px;
padding: 5px;
background-color: silver;
border: 1px solid black;
margin: 2px;
filter: alpha(opacity=100);
-moz-opacity:1.0;
-khtml-opacity: 1.0;
opacity: 1.0;
}

a.thumb{
outline: none;
}
*/



.header{
font-family: myGothic;
font-weight: 900;
font-size: 10pt;
}

.enter{
background-color: #ddd;
color: #aaa;
border: 0px solid black;
letter-spacing: 1px;
word-spacing: 2px;
padding-left: 5px;
padding-top: 2px;
border: 1px solid white;
}

input, textarea{
font-family: myText;
font-size: 10pt;
}

#submit, #reset{
padding-top: 2px;
background-color: black;
border-style: double;
border-width: 4px;
border-color: white;
color: white;
letter-spacing: 2px;
cursor: pointer;
font-family: myGothic;
}

#submit:hover, #reset:hover{
padding-top: 2px;
background-color: white;
border-style: double;
border-width: 4px;
border-color: black;
color: black;
letter-spacing: 2px;
cursor: pointer;
font-family: myGothic;
}







.media{
float: right;
margin-right: -30px;
}


.fb{
display: block;
width: 45px;
height: 45px;
background-image: url('images/fb1.png');
background-repeat: no-repeat;
margin-bottom: 5px;
cursor: pointer;
}
.fb:hover{
display: block;
width: 45px;
height: 45px;
background-image: url('images/fb2.png');
background-repeat: no-repeat;
margin-bottom: 5px;
cursor: pointer;
}



.lin{
display: block;
width: 45px;
height: 45px;
background-image: url('images/lin1.png');
background-repeat: no-repeat;
margin-bottom: 5px;
cursor: pointer;
}
.lin:hover{
display: block;
width: 45px;
height: 45px;
background-image: url('images/lin2.png');
background-repeat: no-repeat;
margin-bottom: 5px;
cursor: pointer;
}



.yt{
display: block;
width: 45px;
height: 45px;
background-image: url('images/yt1.png');
background-repeat: no-repeat;
margin-bottom: 5px;
cursor: pointer;
}
.yt:hover{
display: block;
width: 45px;
height: 45px;
background-image: url('images/yt2.png');
background-repeat: no-repeat;
margin-bottom: 5px;
cursor: pointer;
}



.tw{
display: block;
width: 45px;
height: 45px;
background-image: url('images/tw1.png');
background-repeat: no-repeat;
margin-bottom: 5px;
cursor: pointer;
}
.tw:hover{
display: block;
width: 45px;
height: 45px;
background-image: url('images/tw2.png');
background-repeat: no-repeat;
margin-bottom: 5px;
cursor: pointer;
}












.left{
display: block;
position: fixed;
margin:0 auto;
top: -150px;
min-width: 628px;
max-width: 628px;
min-height: 1200px;
max-height: 1200px;
background-image: url('images/left-3.png');
z-index: -20;
}


.right{
display: block;
position: fixed;
right: 0px;
top: -150px;
min-width: 627px;
max-width: 627px;
min-height: 1200px;
max-height: 1200px;
background-image: url('images/right-2.png');
z-index: -50;
}



.bar{
display: block;
position: fixed;
top: 1000px;
width: 100%;
height: 2000px;
background-color: black;
z-index: -10;
}
