@charset "UTF-8";
/* CSS Document */


body {background-color:#8ed8f8; background-position:top }

a, a:visited {color:#FFF ;text-decoration: none;}
a:hover {color: #FFF; }
a img { border: none; }
a:focus, a:hover, a:active { outline: none; }

/*main page*/

#title { width:525px; height:100px; background-color:#8ed8f8; margin:auto;  margin-top: 250px; background-image:url(../images/title_03.png); background-repeat:no-repeat }
#mother { width: 760px; height:100%; margin:auto }
#navigation {width: 755px; height:64px; background-color:#8ed8f8; margin:auto; background-position:center; margin-top:20px }

#navigation2 {width: 755px; height:64px; background-color:#8ed8f8; margin:auto; background-position:center; margin-top:20px; margin-left:100px;}

#navigation3 {width: 755px; height:64px; background-color:#8ed8f8; margin:auto; background-position:center; margin-top:20px; margin-left:200px;}

#navigation4 {width: 755px; height:64px; background-color:#8ed8f8; margin:auto; background-position:center; margin-top:20px; margin-left:300px;}

#ci {width:138px; height: 50px; margin-right: 20px;margin-left:30px; float:left; background-image:url(../images/ci_banner.png) }
#ci:hover {background-image:url(../images/ci_sign.png); }
#ill {width:138px; height: 50px; margin-right: 20px;margin-left:30px; float:left; background-image:url(../images/ill_banner.png) }
#ill:hover {background-image:url(../images/ill_sign.png); }
#pho {width:138px; height: 50px; margin-right: 20px;margin-left:30px; float:left; background-image:url(../images/photo_banner.png) }
#pho:hover {background-image:url(../images/photo_sign.png); }
#blo {width:138px; height: 50px; margin-right: 20px;margin-left:30px; float:left; background-image:url(../images/hc_banner.png) }
#blo:hover {background-image:url(../images/hc_sign.png); }
#fla {width:138px; height: 50px; margin-right: 20px;margin-left:30px; float:left; background-image:url(../images/flash_banner.png) }
#fla:hover {background-image:url(../images/flash_sign.png); }
#php {width:138px; height: 50px; margin-right: 20px;margin-left:30px; float:left; background-image:url(../images/php_banner.png) }
#php:hover {background-image:url(../images/php_sign.png); }
#xml {width:138px; height: 50px; margin-right: 20px;margin-left:30px; float:left; background-image:url(../images/xml_banner.png) }
#xml:hover {background-image:url(../images/xml_sign.png); }
#first {width:138px; height: 50px; margin-right: 20px;margin-left:30px; float:left; background-image: url(../images/1st_banner.png) }
#first:hover {background-image: url(../images/1st_sign.png); }
#second {width:138px; height: 50px; margin-right: 20px;margin-left:30px; float:left; background-image: url(../images/2nd_banner.png) }
#second:hover {background-image: url(../images/2nd_sign.png); }
#video {width:138px; height: 50px; margin-right: 20px;margin-left:30px; float:left; background-image: url(../images/video_banner.png) }
#video:hover {background-image: url(../images/video_sign.png); }






/*nav box*/
#nav_cont { width: 880px; height:910px; background-color: #8ed8f8; margin:auto; margin-top:10px  }
#nav_box {width:70px; height: 275px; background-image:url(../images/nav_bar1.png); background-repeat:no-repeat ;position: absolute; padding:20px; float:right; left:inherit }
a {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#666; font-size:9px; }
p {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#666; font-size:9px; }
p1 {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#F06; font-size:9px; }
/*categories*/

#container {height: 910px; width: 700px; margin:auto; margin-top:10px; background-image:url(../images/bg.png); padding:20px; }
h3 {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#666; font-size:14px; }
h6 {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#666; font-size:7px;}


/*corporate identity*/
#header_ci {background-image:  url(../images/ci_header_03.png); height:122px; width:645px; background-repeat:no-repeat; margin-left: 30px; margin-top:30px; }
.content_ci {height: 658px; width: 608px; background-image:url(../images/content_box.png); margin-left:30px; margin-top:30px; padding:20px;}




/*illustrator*/
#header_ill {background-image:  url(../images/ill_header_03.png); height:122px; width:645px; background-repeat:no-repeat; margin-left: 30px; margin-top:30px; }
.content_ill {height: 658px; width: 608px; background-image:url(../images/content_box.png); margin-left:30px; margin-top:30px; padding:20px;}


/*photography*/


#header_photo {background-image:  url(../images/photo_header_03.png); height:122px; width:645px; background-repeat:no-repeat; margin-left: 30px; margin-top:30px; }
.content_photo {height: 658px; width: 608px; background-image:url(../images/content_box.png); margin-left:30px; margin-top:30px; padding:20px;}

/*flash*/
#header_flash {background-image:  url(../images/flash_header.png); height:122px; width:645px; background-repeat:no-repeat; margin-left: 30px; margin-top:30px; }
.content_flash {height: 658px; width: 608px; background-image:url(../images/content_box.png); margin-left:30px; margin-top:30px; padding:20px;}


/* BLOG PAGE*/


p.blog { font-family:Arial, Helvetica, sans-serif; font-size:12px; text-align:justify; }
form {font-family:Arial, Helvetica, sans-serif; font-size:10px; }
input {background-color:#000; border-style:none; color:#fc1d26; }
textarea { background-color:#000; border-style:none; color:#fc1d26; font-family:Arial, Helvetica, sans-serif; font-size:10px; }
 
 
/*blog page*/
#index { width:800px; height:1000px; margin:auto;  margin-top: 150px; background-image: url(../images/page.jpg); background-repeat:no-repeat; } 
#nav_bar { width:400px; height:30px; padding:474px; margin-left:-125px; }
.my_btn { width:152px; height: 54px; margin-right:-10px; float:left; }


/*bg and header*/
#main_box { width:1000px; height: 1000px; margin:auto; background-repeat: repeat; margin-left:auto; margin-right:auto; margin-top:-30px; }
#header {width:871px; height:328px; background-image: url(../images/header1.png); margin:auto; margin-top:90px; margin-left:70px; background-repeat:no-repeat; position:absolute; z-index:1; }


/*content div*/

#main_cont {width:750px; height:1000px; margin:auto; margin-left:145px; float:left;  margin-top:430px; }
#photo {width:375px; height:280px; margin-left:600px; margin-top:30px; padding-top:50px;}
#photo_s {width:439px; height:240px;}

#navi { width: 197px; height: 354px; background-image:url(../images/navi_box.png); background-repeat:no-repeat; margin:auto; margin-top:300px; margin-left:-10px; float:left; position:absolute; z-index:2;}
.button { width:152px; height: 54px; margin-left:20px; padding-top:20px; padding-left:10px; }

#footer {width:192px; height:53px; background-image:url(../images/footer.png); position: relative; margin:auto; margin-top:235px; background-repeat:no-repeat; }

#content {width:450px; height:463px; background-image:url(../images/content_box69.png); background-repeat:no-repeat; margin-left:181px; margin-top:300px; padding-left:25px; padding-right:150px; padding-left:50px; padding-top:20px; float:left; position:absolute; z-index:3 }
.title { width:258px; height:61px; margin-top:25px; }



/* cotton*/

#pattern_c { width:755px; height:420px; background-image: url(../images/cotton_all.png); margin-right:50px; margin-top:-20px; margin-left:-30px; float: left; position:absolute; z-index:4; }


/*microfibre*/

#pattern_m {width:755px; height:410px; background-image: url(../images/mf_all.png); margin-right:50px; margin-top:-20px; margin-left:-30px; float: left; position:absolute; z-index:5; }


/*swim*/
#pattern_s {width:755px; height:367px; background-image:url(../images/swimm_all.png);  margin-right:50px; margin-top:-20px; margin-left:-30px; float: left; position:absolute; z-index:6; }

/*comment*/
#comments {width: 392px; height:200px; float:left; margin-left:20px; }



#header_portfolio {background-image:  url(../images/portfolio_header.png); height:122px; width:645px; background-repeat:no-repeat; margin-left: 30px; margin-top:30px; }


#header_source {background-image:  url(../images/open_source_header.png); height:122px; width:645px; background-repeat:no-repeat; margin-left: 30px; margin-top:30px; }


/*XML-Flash*/

#main_xml {width:870px; height:100%; margin:auto;}
#title_xml {width:600px; height:95px; margin:auto; background-image:url(../images/xml_main.png); background-repeat:no-repeat; margin-top:80px;}
#gallery {width:860px; height:610px; margin:auto}
#goto_home {width:75px; height:28px; margin:auto; background-image:url(../images/home_2.png); background-repeat:no-repeat; }

#movie { width:645px; height:500px; margin:auto;}
#ani_title {width: 623px; height:58px; background-image:url(../images/animation.png); background-repeat:no-repeat; margin:auto;}
#main_ani {width:650px; height:100%; margin:auto; margin-top:50px;}
#vimeo {height:480px; width:640px; margin:auto;}