/*************************************************************/
/*   Design:   creativeoutlaw.com                            */
/*   File:     Global layout structure                       */
/*-----------------------------------------------------------*/
/*   Author:   Jesse James Salucci                           */
/*   Date:     11.20.09                                      */
/*   Homepage: www.creativeoutlaw.com                        */
/*-----------------------------------------------------------*/
/*   License:  copyright © 2009 at www.creativeoutlaw.com    */
/*************************************************************/

/* GLOBAL CLASSES
-----------------------------------------------------------*/

.clear         { clear:both; }
.float-left    { float:left; }
.float-right   { float:right; }
 
.text-left     { text-align:left; }
.text-right    { text-align:right; }
.text-center   { text-align:center; }
.text-justify  { text-align:justify; }
 
.bold          { font-weight:bold; }
.italic        { font-style:italic; }
.underline     { border-bottom:1px solid; }
.highlight     { background:#ffc; }
 
.img-left      { float:left;margin:4px 10px 4px 0; }
.img-right     { float:right;margin:4px 0 4px 10px; }
 
.nopadding     { padding:0; }
.noindent      { margin-left:0;padding-left:0; }
.nobullet      { list-style:none;list-style-image:none; }

.marginLeft10	{	margin-left:10px; }
.marginTop10	{	margin-Top:10px; }

/*---------------------------------------------------------*/


/* LAYOUT
-----------------------------------------------------------*/

body {
	background: #131313;
	background-image:url('../includes/images/page_bg.jpg');
	background-position: center top ;
	background-attachment:fixed;
    background-repeat:no-repeat;
	font-family: Trebuchet MS, sans-serif;
	font-size: 12px;
	line-height: 18px;
	color: #ffffff;
}

#header {
	background-image:url('../includes/images/header_bg.gif');
	display: block;
    background-repeat:no-repeat;
	margin-left: auto;
	margin-right: auto;
	text-indent:-9999px;
	height: 240px;
	width: 980px;
}

.contactbox {
	width: 910px;
	height: 20px;
	display: block;
	text-align: right;
	padding: 20px 70px 0px 0px;	
}

#quotebox {
	width: 920px;
	height: 110px;
	display: block;
	text-align: right;
	padding: 50px 60px 0px 0px;
}

/*  NAVBAR BUTTONS:::BEGIN  */
#topnav {
	width: 980px;
	height: 40px;
	float: right;
	position: relative;
}

#topnav a {
	height: 40px;
	text-indent: -9000px;
	font-size: 1px;
	display: block;
}

#navbar li {
    list-style:none;
    display:inline;
}
#topnav #left      { display: block; height: 40px; width: 313px; background-image: url(../includes/images/topnav_left.gif); float: left; }
#topnav #home      { display: block; height: 40px; width: 63px; background-image: url(../includes/images/topnav_home.gif); float: left; }
#topnav #web       { display: block; height: 40px; width: 51px; background-image: url(../includes/images/topnav_web.gif); float: left; }
#topnav #print     { display: block; height: 40px; width: 62px; background-image: url(../includes/images/topnav_print.gif); float: left; }
#topnav #design    { display: block; height: 40px; width: 75px; background-image: url(../includes/images/topnav_design.gif); float: left; }
#topnav #artifacts { display: block; height: 40px; width: 102px; background-image: url(../includes/images/topnav_artifacts.gif); float: left; }
#topnav #services  { display: block; height: 40px; width: 92px; background-image: url(../includes/images/topnav_services.gif); float: left; }
#topnav #about     { display: block; height: 40px; width: 69px; background-image: url(../includes/images/topnav_about.gif); float: left; }
#topnav #contact   { display: block; height: 40px; width: 133px; background-image: url(../includes/images/topnav_contact.gif); float: left; }

#topnav #left a:hover { background: url(../includes/images/topnav_left.gif) 0 40px; }
#topnav #home a:hover { background: url(../includes/images/topnav_home.gif) 0 40px; }
#topnav #web a:hover { background: url(../includes/images/topnav_web.gif) 0 40px; }
#topnav #print a:hover { background: url(../includes/images/topnav_print.gif) 0 40px; }
#topnav #design a:hover { background: url(../includes/images/topnav_design.gif) 0 40px; }
#topnav #artifacts a:hover { background: url(../includes/images/topnav_artifacts.gif) 0 40px; }
#topnav #services a:hover { background: url(../includes/images/topnav_services.gif) 0 40px; }
#topnav #about a:hover { background: url(../includes/images/topnav_about.gif) 0 40px; }
#topnav #contact a:hover { background: url(../includes/images/topnav_contact.gif) 0 40px; }

#topnav #left.current, #topnav #left.current a:hover  { background: url(../includes/images/topnav_left.gif) 0 40px; }
#topnav #home.current, #topnav #home.current a:hover  { background: url(../includes/images/topnav_home.gif) 0 40px; }
#topnav #web.current, #topnav #web.current a:hover  { background: url(../includes/images/topnav_web.gif) 0 40px; }
#topnav #print.current, #topnav #print.current a:hover  { background: url(../includes/images/topnav_print.gif) 0 40px; }
#topnav #design.current, #topnav #design.current a:hover  { background: url(../includes/images/topnav_design.gif) 0 40px; }
#topnav #artifacts.current, #topnav #artifacts.current a:hover  { background: url(../includes/images/topnav_artifacts.gif) 0 40px; }
#topnav #services.current, #topnav #services.current a:hover  { background: url(../includes/images/topnav_services.gif) 0 40px; }
#topnav #about.current, #topnav #about.current a:hover  { background: url(../includes/images/topnav_about.gif) 0 40px; }
#topnav #contact.current, #topnav #contact.current a:hover  { background: url(../includes/images/topnav_contact.gif) 0 40px; }
/*  NAVBAR BUTTONS:::END  */


#insideNav { 
	margin: 0px 0px 10px 40px;
	text-align: left;
	width: 940px;
	height: 20px;
}

.clear { 
	border-bottom: 1px dashed #666;
}

.fade {
	background-image: url('../includes/images/fullview.gif');
}

.nothumb {
    background-color:#000;
	margin: 10px 0px 0px 15px;
	border: 1px solid #444;
	filter:alpha(opacity=30);
    -moz-opacity:0.30;
    opacity: 0.30;
	height: 104px;
	width: 104px;
}
	
.thumb {
    background-color:#000;
	margin: 10px 0px 0px 15px;
	border: 3px solid #444444;
	filter:alpha(opacity=70);
    -moz-opacity:0.70;
    opacity: 0.70;
	height: 100px;
	width: 100px;
}

.thumb:hover {
	background-color:#000;
	margin: 10px 0px 0px 15px;
	border: 3px solid #666;
	filter:alpha(opacity=100);
    -moz-opacity:1;
    opacity: 1;
	height: 100px;
	width: 100px;
}

#rotator {
	height:360px;
	width:940px;
	margin-top:10px;
	margin-bottom: 30px;
	border-top: solid 3px #373737;
	border-bottom: solid 3px #373737;
	background-image: url('../images/print/co_card.jpg');
	background-repeat:no-repeat;
}

.linkimage {
    position: absolute;
	margin-top: -3000px;
	margin-left: 50px;
}

#thumbgrid{
	width: 640px;	
	padding: 0px 0px 15px 0px;
}

.project {
	height: 400px;
}

#project_info_thumbgrid {
	padding: 0px 5px 0px 0px;
	width:270px;
}

#founder {
	padding: 0px 0px 0px 0px;
	height:420px;
	width:270px;
	text-align: center;
}

#contactform {
	padding:15px;
    background: url(../includes/images/trans30.png) repeat;
	border: 1px solid #2d2d2d;
	margin-top:10px;
	width: 610px;
}

.column {
	padding: 0px 20px 0px 20px;
	margin: 0px 20px 0px 0px;
	height: 300px;
	width: 178px;
	float: left;
	border: 1px solid #2d2d2d;
	background: url(../includes/images/trans30.png) repeat;
}

.trans30 {
	padding: 0px 20px 0px 20px;
	margin: 0px 20px 0px 0px;
	float: left;
	border: 1px solid #2d2d2d;
	background: url(../includes/images/trans30.png) repeat;
}

#timeline {
	padding: 20px 20px 35px 20px;
	width: 600px;
	border: 1px solid #2d2d2d;
	background: url(../includes/images/trans30.png) repeat;
}

#row {
	padding: 0px 20px 0px 20px;
	margin-bottom: 10px;
	width: 600px;
}

#padbox {
	padding: 0px 20px 0px 20px;
	width: 600px;
}

.divider {
	border-bottom: 1px dashed #666;
    width: 940px;
	height: 25px;
	margin-bottom: 15px;
}

.container_12 {
	background:  repeat-y;
	margin-top: 0px;
	padding-top: 0px;		
}

.container_16 {
	background:  repeat-y;
	margin-top: 0px;
	padding-top: 0px;
}

#footer {
	background-image:url('../includes/images/footer_bg.gif');
	display: block;
    background-repeat:no-repeat;
	margin-top: 30px;
	margin-left: auto;
	margin-right: auto;
	text-indent:-9999px;
	height: 130px;
	width: 980px;
}

/*---------------------------------------------------------*/

/* TYPOGRAPHY
-----------------------------------------------------------*/

ul {
	margin: 0;
	padding: 0;
}

li {
	margin: 0;
	padding: 0;
	list-style-type: none;
}


/*
ul{
    list-style:none;
    margin:0px 0px 0px 0px;
    padding: 0;
}

*/

.list {
    line-height:20px;
    margin: .25em 0;
    padding: 0 0 0 15px;
    background:url(../includes/images/star.gif) no-repeat 0 7px;
	color: #888888;
}



h1 {
	font-family: Georgia, serif;
	color: #ffffff;
	font-size: 30px;
	line-height:34px;
	font-weight: normal;
	text-align: left;
	margin:10px 0px 5px 0px;

}

h2 {
	font-family: Georgia, serif;
	color: #737373;
	font-size: 14px;
	font-weight: normal;
	font-variant: small-caps;
	margin: 0px 0px 20px 2px
}

p {
	border: 0px solid #666;
	overflow: hidden;
	padding: 0px 0px 10px 0px;
	text-align: left;
	color: #fff;
}



a:link     { font-family: Georgia, serif; font-size: 14px; font-variant: small-caps; color: #DF5E1A; text-decoration: none;}
a:visited  { font-family: Georgia, serif; font-size: 14px; color: #888888; font-variant: small-caps; text-decoration: none;}
a:hover    { font-family: Georgia, serif; font-size: 14px; color: #ffffff; font-variant: small-caps; text-decoration: underline;}
a:active   { font-family: Georgia, serif; font-size: 14px; color: #C86B43; font-variant: small-caps; text-decoration: underline; }

a.insidenav:link     { font-family: Georgia, serif; font-size: 14px; font-variant: small-caps; color: #ffffff; text-decoration: none;}
a.insidenav:visited  { font-family: Georgia, serif; font-size: 14px; color: #888888; font-variant: small-caps; text-decoration: none;}
a.insidenav:hover    { font-family: Georgia, serif; font-size: 14px; color: #ffffff; font-variant: small-caps; text-decoration: underline;}
a.insidenav:active   { font-family: Georgia, serif; font-size: 14px; color: #ffffff; font-variant: small-caps; text-decoration: underline; }

a:greylink { color: #737373;
}

a.backtotop { display:scroll;position:absolute;right:0px;bottom:5px; color: #737373;}
a.backtotop:hover { text-decoration: underline; ; color: #fff;}

.smallcaps { font-family: Georgia, serif; font-size: 13px; font-variant: small-caps; color: #ffffff; text-decoration: none;}

.greycaps { font-family: Georgia, serif; font-size: 14px; font-variant: small-caps; color: #888888; text-decoration: none;}

.grey { color: #888888;}
.white { color: #ffffff;}

.contactinfo {
	font-family: Georgia, serif;
	color: #737373;
	font-size: 13px;
	line-height: 14px;
	text-align: right;
}

.category {
	font-family: Georgia, serif;
	color: #737373;
	font-size: 12px;
	font-style: italic;
	margin: 10px 0px 0px 0px;
	display: block;
}

.description{
	font-family: Arial, serif;
	color: #ffffff;
	font-size: 12px;
	line-height: 18px;
}

.headerquote {
	font-family: Georgia, serif;
	color: #444444;
	font-size: 36px;
	line-height: 34px;
	text-align: right;
}
/*-----------------------------------------------------------*/