/* css document  */
/* Demb Flash Products - 2007  */

body {font-family: Verdana, Geneva, Arial, helvetica, sans-serif;
  font-size:0.85em; margin: 0; padding: 0; border: 0; text-align: center; background-color: #F2F0E0;}
body.shortpage #sidebar {border-left: 1px solid #81817C;}  /*  adds border to sidebar for pages with little text   */
body.shortpage #main {border-right: 0;}			/* removes border from main div for pages with little text  */

h3 {font-size: 1.5em; color: #BC2D1E; margin-top: 20px;}
/* body.hr {color: #BC2D1E; height: 10px;}  old hr code, not working  */
hr {width: 550px; color: #FBFBF4; height: 3px; text-align: center; border: 1px solid #81817C;} /* sets horizontal rule style for all pages */

/* basic layout */
#wrapper {width: 790px; margin: 0 auto; padding: 0; border: 1px solid #81817C; border-top: 3px solid #81817C; text-align:left; background-color: #FBFBF4;}
#header {width: 788px; height: 80px; background-image: url(../i/logo2007.gif); background-repeat:no-repeat; padding: 0; margin: 0;}
#header span {display: none;}  /*  page title for print css   */
#topnav {width: 788px; height: 1.85em; padding-top: 10px; margin: 0; border: 1px solid #81817C;}
#content {width: 788px; margin: 0; padding: 0;}
#main {width: 570px; text-align: left; float: left; padding: 10px 15px 20px 15px; margin: 0; border-right: 1px solid #81817C;}
#sidebar {width: 176px; margin: 0; float: right; padding: 10px 5px 20px 5px; color: #555; font-size: 0.8em}
#footer {clear: both; margin: 0 -1px 0 -1px; border: 1px solid #81817C; font-size: 0.75em;}

/* table properties  */
#main table {margin-bottom: 30px;}

/* text placement  */
.centered {text-align: center; width: 568px;}
.rightprice {float: right; padding-right: 10px; margin-top: 5px; font-size: 0.8em; font-weight: bold;}
ul.spaceli {line-height: 110%; font-size: 0.86em;}
.textmini {width: 100px; height: 100px;}

/* text variations  */
.bold {font-weight: bold; font-size: 0.86em;}
.boldred {font-weight: bold; color: #BC2D1E;}
.boldgreen {font-size: 1em; font-weight: bold; color: #00FF00;}
.boldteal {font-size: 1.2em; font-weight: bold; color:#339999;}
.centered h3 {margin-bottom: 20px;}
#flickr {font-size: 0.9em; margin-top: 5px; padding: 10px 5px; border: 1px solid #BC2D1E;}

/*  image placement  */
img.floattenr {float: left; margin: 0 10px 0 0;}   /* floats left with 10px margin on right  */
img.floatleft {float: left; margin: 0 10px 20px 0;}
img.floatright {float: right; clear: none; margin-left: 10px;}
.centered img {margin:15px 5px 15px 6px; border: 0;}
.centered img.tight {margin:0 5px 0 6px; border: 0;}  /*  no space between images bottom of flipit index page  */
body.borders .centered img {border:  2px solid #C7B199;}  /*  body class that adds tan borders - for gallery pages and portrait page */

/* image borders and margins  */
img.border2 {border: 2px solid #81817C;}
img.margin {margin: 15px 0;}

/* div class for sections of 2 photos with text - flipit weddings page and bracket instructions page */
div.tutorialsample {margin-top: 20px; padding-top: 20px; padding-bottom: 20px; clear: left; border-top: 2px solid #81817C;}
div.tutorialsample_top {margin-top: 20px; padding-top: 20px; padding-bottom: 20px; clear: left; border-top: 0;}
div.tutorialsample img {padding-bottom: 10px;}
div.tutorialsample p {clear: right; padding-left: 310px; padding-top: 20px;}
div.tutorialsample p.nopic {padding-top: 20px; padding-left: 20px;}
	
/* div class for bracket specifications page  */
div.specs {margin-top: 30px; padding-bottom: 10px; clear: left; border-top: 2px solid #81817C;}
div.specs_top {margin-top: 30px; padding-bottom: 10px; border: 0;}
div.specs img, div.specs_top img {margin: 10px 20px; float: left;}
div.specs p, div.specs_top p {padding-top: 20px;}

/* p class to place text and images on homepage  */

p.phototext-r {padding: 5px 10px 20px 0;}

/* p class to place text of varying sizes beside pictures, left or right, on flipit portrait page and diffuser instructions page */
p.phototext20r {padding-top: 20px; padding-right: 10px; padding-bottom: 20px;}
p.phototext20l {padding-top: 20px; padding-bottom: 20px; padding-left: 10px;}
p.phototext60r {padding-top: 60px; padding-right: 10px; padding-bottom: 60px;}
p.phototext60l {padding-top: 60px; padding-bottom: 60px; padding-left: 10px;}
p.phototext80r {padding-top: 80px; padding-right: 10px; padding-bottom: 80px;}
p.phototext80l {padding-top: 80px; padding-bottom: 80px; padding-left: 10px;}
p.phototext40r {padding-top: 40px; padding-right: 10px; padding-bottom: 40px;}
p.phototext40l {padding-top: 40px; padding-bottom: 40px; padding-left: 10px;}

/*  div class used on flipit models page, the diffuser models page and for the accessories page */
.models {clear:right; margin-top: 20px; padding-top: 20px; border-top: 1px solid #81817C;}
.models img, .models_top img {margin-bottom: 10px;}
.models h3, .models_top h3 {color: #BC2D1E; font-size: 1.2em; font-weight: bold;}
.models h5,.models_top h5 {margin-top: 0;}
.models_top {clear:right; margin-top: 20px; padding-top: 20px;}

/*  div class for position images on portrait page  */
.portrait_position {width: auto; height: 90px; margin-bottom: 10px;}
.portrait_position p {padding-top: 20px;}
.portrait_position img {float: left; margin-right: 10px;}


/*  div class for different examples on flipit positions page */
.positions {width: auto; height: 190px;}
.positions img {float: left; margin-right: 10px;}

/*    linkage - general  */
a:link, a:visited {color: #BC2D1E; text-decoration: none;}  /* red  */
a:hover, a:active {color: #81817C; text-decoration: none;}  /*  gray  */

/*   topnav navigation    */
#topnav {margin: 0; padding: 0; border-top: 1px solid #81817C; border-bottom: 1px solid #81817C; 
	height: 1.85em;		/* shorter than ul li a line height so side border touches bottom */
	background-color:#FBFBF4; font-family: Verdana, Arial, Helvetica, sans-serif;}
	
#topnav ul {border: 0; margin: 0; padding: 0; list-style-type: none; text-align: center;}
#topnav ul li {float: left; border-right: 1px solid #81817C; border-left: none; padding: 0; margin: 0;}
#topnav ul li a  {width: 80px; padding: 0; margin: 0; text-decoration: none; display: block;
	font-weight: bold; letter-spacing: 1px; line-height: 1.84em; font-size: x-small; 
	voice-family: "\"}\"";   
	voice-family: inherit;   
	font-size:    small;   
	}
#topnav ul li.long a {width: 120px;}
html>#topnav ul li a  {font-size: small;} 
#topnav ul li a:hover {background-color: #BC2D1F; color: #FBFBF4;} /* BC2D1E and BC2D1F the same red but validates  */
	
/*  sidebar navigation   */
#sidebar h3 a:link, #sidebar h3 a:visited, #sidebar h3 a:active {font-size: 10px; color: #81817C; margin: 20px 0 0; padding: 0 0 3px; border-bottom: 2px solid #81817C;}
#sidebar h3 a:hover {color: #BC2D1E; text-decoration: none; border-bottom: 2px solid #BC2D1E; padding-bottom: 3px;}
#sidebar ul {list-style: none; margin: 0; margin-top: -10px; padding: 0;} /* also had padding-top: 20px;  */
#sidebar ul li {		/* this makes sidebar spacing in IE 6 look good  */
	display: block; font-weight: normal; font-size: 10px; margin: 0 0 0 10px; padding: 0 0 3px 0;}
div#sidebar .sub0 {margin-left: 20px; margin-bottom: 6px;}  /*  places same as ul li  */
div#sidebar .sub1 {margin-left: 30px;}  /*  indents sub-topic  */
div#sidebar .sub2 {margin-left: 54px; list-style: circle;}  /* indents sub-sub link  */
	
#sidebar a {display:block; margin: 0 0 0 10px; padding: 0 0 3px 0;}
#sidebar ul li a:link, #sidebar ul li a:visited, #sidebar ul li a:active {color: #81817C; text-decoration: none;}
#sidebar ul li a:hover {color: #BC2D1E; text-decoration: none; border-bottom: 1px solid #BC2D1E; padding-bottom: 2px;}