/* @override http://192.168.1.2/tomcodydesign.com/v1/i/css/style.css */

html { height: 100%;}
body { margin: 0; padding-bottom: 10px; font-family: Verdana, "Lucida Grande", sans-serif; font-size: 10pt; font-weight: normal; }

#bg { position:fixed; z-index:1; height:100%; width:100%; background:#fff; }
#bg_grey { position:fixed; z-index:1; height:100%; width:100%; background:#42424a; }

/* main wrapper */
/*#wrapper { position:absolute; z-index:1; top:25px; left:50%; margin:0 0 0 -440px; min-height:568px; width:880px; }*/
#wrapper { position:absolute; z-index:1; top:50%; left:50%; margin:-260px 0 0 -440px; min-height:540px; width:880px; }


/* company logo */
#logo { position:absolute; z-index:1000; top:10px; left:1px; margin:0; height:19px; width:435px; background: url(../images/logo.png) top left no-repeat;}
#logo_grey { position:absolute; z-index:1000; top:40%; left:223px; margin:0; height:19px; width:435px; background: url(../images/logo-grey.png) top left no-repeat;}


#container { position:absolute; z-index:1; top:33px; left:0; margin:0; height:504px; width:880px; }
#frame { position:absolute; z-index:100; top:0; left:0; margin:0; height:485px; width:880px; background: url(../images/frame.png) top left no-repeat; }
#frame_left { position:absolute; z-index:1000; top:0; left:0; height:485px; width:9px; background: #fff;}

/* #fabric_printing { position:absolute; z-index:1000; top:0; left:0; margin:0; height:485px; width:880px; background: url(../images/digital_printing.jpg) top left no-repeat; } */
#cad_studio { position:absolute; z-index:1000; top:0; left:0; margin:0; height:485px; width:880px; background: url(../images/cad_studio.jpg) top left no-repeat; }

#about_us { position:absolute; z-index:999; top:0; left:0; margin:0; height:504px; width:880px; background: url(../images/about_us.jpg) top left no-repeat; }


/* hide all overflow */
#wrapper, #container, #frame { overflow:hidden; }

#loading { position:absolute; top: 45%; left:428px; margin:0 0 0 -12px; height:24px; width:24px; background:url(../images/loading.gif); }
#loading_grey { position:absolute; top: 65%; left:440px; margin:0 0 0 -12px; height:24px; width:24px; background:url(../images/loading_grey.gif); }

/* this is the container that gets updated with content */
#updateable { float:left; margin:0; height: 100%; width:100%; }

/* collections */
#swatch { position:absolute; z-index:99; top:0; left:0; margin:0; height:485px; width:200px; }

#collection { position:absolute;  top: 12px; left:0px; height:380px; overflow:hidden; }
#collection_container { position:absolute;  top:0; left:440px; margin: 0;}
#collection_container img { float:left; margin: 0 5px; height:380px; background:red; }

#thumbnails { position: absolute; z-index:101; bottom:34px; right:17px; height:70px; }
#thumbnails a.thumbnail { float:left; margin:0 1px; height:70; width:70; opacity:.5; }
#thumbnails a.thumbnail:hover { opacity:.75; }
#thumbnails a.thumbnail_a { float:left; margin:0 1px; height:70; width:70; }

.img { opacity:.6; }
.img_a {opacity:1;}

a img { border:none; outline:none;}

a { text-decoration:none; color:blue; outline:none;}
a:hover { color:#000; }


/* white */
#mm { position:absolute; z-index:950; top:16px; right:10px; margin:0; height:19px; font-size:.9em; }

#mm a { text-decoration: none; }

#mm ul { padding:0; margin:0 0 0 10px; list-style: none; }
#mm ul li { float:left; position:relative; margin: 0 0 0 30px; }

#mm ul li .top, #mm ul li a.top, #mm ul li .top_a, #mm ul li a.top_a  { display:block; padding: 3px 3px; color:#888; text-align:center; overflow:hidden; }
#mm ul li .top_a, #mm ul li a.top_a { color:#282828; }
#mm ul li:hover span { cursor: default; }
#mm ul li:hover .top, #mm ul li:hover .top_a { color:#282828; }

#mm ul li ul { margin: 0; display: none; background:transparent; }
#mm ul li ul li { margin: 0; padding: 0 3px;  } 

#mm ul li:hover ul { display:block; position:absolute; left:0; width:100px; background:transparent; }
#mm ul li:hover ul li a.sub { width: 100px; color:#888; text-align:left; padding: 2px 0; background:transparent; }
#mm ul li:hover ul li:hover a.sub { color:#282828; background:transparent; }

#mm ul li:hover ul li ul { display: none; }
#mm ul li:hover ul li a { display:block; background:#ddd; color:#000; }
#mm ul li:hover ul li a:hover { background:#6fc; color:#000; }
#mm ul li:hover ul li:hover ul { display:block; position:absolute; left:105px; top:0; }
#mm ul li:hover ul li:hover ul.left { left:-105px; }

/* grey */
#mm_g { position:absolute; z-index:950; top:16px; right:10px; margin:0; height:19px; font-size:.9em; }

#mm_g a { text-decoration: none; }

#mm_g ul { padding:0; margin:0 0 0 10px; list-style: none; }
#mm_g ul li { float:left; position:relative; margin: 0 0 0 30px; }

#mm_g ul li .top, #mm_g ul li a.top, #mm_g ul li .top_a, #mm_g ul li a.top_a  { display:block; padding: 3px 3px; color:#888; text-align:center; overflow:hidden; }
#mm_g ul li .top_a, #mm_g ul li a.top_a { color:#efefef; }
#mm_g ul li:hover span { cursor: default; }
#mm_g ul li:hover .top, #mm_g ul li:hover .top_a { color:#efefef; }

#mm_g ul li ul { margin: 0; display: none; background:#42424a; }
#mm_g ul li ul li { margin: 0; padding: 0 3px;  } 

#mm_g ul li:hover ul { display:block; position:absolute; left:0; width:100px; background:#42424a; }
#mm_g ul li:hover ul li a.sub { width: 100px; color:#888; text-align:left; padding: 2px 0; background:#42424a; }
#mm_g ul li:hover ul li:hover a.sub { color:#efefef; background:#42424a; }

#mm_g ul li:hover ul li ul { display: none; }
#mm_g ul li:hover ul li a { display:block; background:#ddd; color:#000; }
#mm_g ul li:hover ul li a:hover { background:#6fc; color:#000; }
#mm_g ul li:hover ul li:hover ul { display:block; position:absolute; left:105px; top:0; }
#mm_g ul li:hover ul li:hover ul.left { left:-105px; }

/* cad studio */

#updateable ul { padding:3px 15px; margin:0;}
#updateable li { padding:0; margin:0;}

.cad_studio-image { position:absolute; left: 10px; top:0px; height:485px; width:208px; background: url(../images/cad_studio-image.jpg);}
.cad_studio-header { position:absolute; top:135px; left:300px; height:13px; width:84px; background: url(../images/cad_studio-header.png);}
.cad_studio-text { position: absolute; z-index:200; top:160px; left:302px; width:450px; font-size:.8em; color:#999; }

/* fabric printing */

.fabric_printing-image { position:absolute; right:-5px; bottom:20px; height:435px; width:556px; background: url(../images/fabric_printing-image.jpg);}
.fabric_printing-header { position:absolute; top:145px; left:90px; height:16px; width:106px; background: url(../images/fabric_printing-header.png);}
.fabric_printing-text { position: absolute; z-index:200; top:170px; left:92px; width:285px; font-size:.8em; color:#999; }

/* about us */

.about_us-image { position:absolute; top:4px; left:10px; height:475px; width:864px; background: url(../images/about_us-image.jpg); }
.about_us-mani { position:absolute; z-index:950; top:10px; left:-123px; height:487px; width:123px; background: url(../images/about_us-mani.png); }
.about_us-header { position:absolute; z-index: 200; top:59px; left:345px; height:13px; width:70px; background: url(../images/about_us-header.png);}
.about_us-text { position: absolute; z-index:200; top:84px; left:345px; width:450px; font-size:.8em; color:#999; }

/* contact */

#contact { position:absolute; z-index:1000; top:40px; color:#888; font-size:.9em; }
#contact .nyc, #contact .lon { clear: both; float:left; margin-top:45px; height:18px; width:206px; }
#contact .nyc { background: url(../images/grey-contact_lowercase.png); }
#contact .lon { background: url(../images/grey-contact_lowercase.png) 0px 18px; }
#contact .info { clear:both; float: left; margin:10px 0 0 0;}

#contact a { color: #888;}
#contact a:hover { color: #ccc; }