@charset "UTF-8";

/* GENERAL ELEMENTS */
html, body { height: 100%; color: #7c7c7c; background: #000000 ; font-family:Georgia, "Times New Roman", Times, serif; font-size: 12px; }
p { font-size: 12px; color: #7c7c7c; }
img { border: none; }
h1 { font-size: 30px; font-family: "Times New Roman", Times, serif; font-weight: normal; color: #FFFFFF;}
h2 { font-size: 18px; font-family: Georgia, "Times New Roman", Times, serif; color: #FFFFFF; margin: 20px 0px 10px 0px;}
h3 { font-size: 14px; font-family: Georgia, "Times New Roman", Times, serif; }
a { text-decoration: none; color: #7c7c7c; font-family:Georgia, "Times New Roman", Times, serif; font-size: 12px;}
a:hover { color: #57dcf8; }
a.active { color: #ffffff; }
ul { list-style: none; }
.white { color: #FFFFFF; }
.grey { color: #7c7c7c; }
h1 span { display:block; margin-left: -3000px; }

/* WRAPPERS */
#outerWrapper { width: 980px; min-height:570px; height:auto !important; height:570px; margin: 0 auto 0px auto; padding: 10px 0px;}

/* HEADER */
#header { width: 908px; height: 100px; padding: 20px 36px 0px 36px; float: left; }
#logos { width: 150px; height: 100px; float: left; padding: 0px 0px 0px 0px; text-align: center; }
h1.logo { width: 150px; height: 100px; float: left; padding: 0px 0px 0px 0px; text-align: center; background: url('../images/m8_logo.jpg') no-repeat; }

/* CONTENT  */
#topMod { width: 952px; height: 401px; padding: 10px 14px 0px 14px; float: left; }

#bottomMod { width: 908px; min-height: 300px; height:auto !important; height: 300px; padding: 20px 36px 0px 36px; float: left; }
#bottomMod a { font-size: 12px; color: #aeaeae;}
#bottomMod a:hover { color: #57dcf8; }
#bottomMod a.viewLinks { font-size: 12px; font-family:Arial, Helvetica, sans-serif; color: #7c7c7c; margin: 0px 0px 0px 5px; }
#bottomMod a.viewLinks:hover { color: #57dcf8; }
.viewLinks { color: #FFFFFF; margin: 0px 0px 0px 5px; }

/* WORK SLIDER */
#slider { width: 907px; margin: 0 auto; position: relative; }
.scroll { overflow: auto; position: relative; clear: left; min-height: 400px; height:auto !important; height: 400px; padding: 10px 0px 0px 0px; }
.scrollContainer div.panel { width: 908px; min-height: 400px; height: auto !important; height: 400px;}
.scrollContainer div.panel td { width: 212px; height: 180px; float:left; padding: 0px 10px;}
.scrollContainer div.panel td h3 { width: 212px; margin: 10px 0px 5px 0px; font-weight: normal;  }
.scrollContainer div.panel .firstCol { padding: 0px 9px 0px 0px; }
.scrollContainer div.panel .lastCol { padding: 0px 0px 0px 9px; }
.scrollContainer div.panel img.workImg { opacity: .33; filter: alpha(opacity=33); }
.scrollButtonsWork { padding: 0px 0px 0px 810px; }

/* LIGHT BOX CONTENT */
#projectBox { width: 800px; text-align: center; }
#projectBox .closeBtn { margin: 5px 5px 0px 740px; font-size: 14px; color: #FFFFFF; }
#projectBox #flashHeader { padding: 10px 4px;  }
#projectBox .projectLink { text-align: right; padding: 0px 20px 0px 0px; }
#projectBox .projectDetails { width: 600px; padding: 10px 10px 0px 10px; margin: 0 auto 0px auto; text-align: left; }

/* FOOTER  */
#footer {width: 908px; height: 120px; padding: 20px 36px; float: left; text-align: center; }
#footer p { font-size: 11px; font-family: Arial, Helvetica, sans-serif;  }