﻿
/* reset all defaults with wildcard selector */
* {
	vertical-align: baseline;
	font-weight: inherit;
	font-family: inherit;
	font-style: inherit;
	font-size: 100%;
	border: 0 none;
	outline: 0;
	padding: 0;
	margin: 0;
	}
	
/* HTML tags */

body, html { font-size: 100%; line-height: 1em; font-family: arial, verdana, helvetica, sans-serif; 
margin: 0; padding: 0; border: 0; background-color: #f1f0ed;}

p { margin: 10px 0 5px 0; padding: 0; font-size: 0.8em; }


/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

	DEFAULT LINKS STYLE

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

a, a:link {color: #fff; text-decoration:none; font-weight: bold;}
a:visited {color: #fff; text-decoration: none;}
a:hover {color: #fff; text-decoration: underline; }
a:active {color: #fff; text-decoration: underline;}
a:focus {color: #fff; text-decoration: underline; }



/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

	IMAGES & PHOTOS

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

img { border: 0; }
img.border { border: 1px solid #575353 !important; }
img.no-border { border: 0 !important; }

img.float-left-margin { border: 1px solid #575353 !important; float: left; margin: 0 10px 10px 0; }
img.float-left-margin-5 { border: 1px solid #575353 !important; float: left; margin: 0 5px 10px 0; }
img.float-left-margin-5-noborder { border: 0 !important; float: left; margin: 0 5px 10px 0; }
img.float-left-margin-0-noborder { border: 0; float: left; margin: 0 0 10px 0;}

img.float-left-margin-noborder { border: 0; float: left; margin: 0 10px 10px 0;}

img.float-right-margin { border: 1px solid #575353 !important; float: right; margin: 0 0 10px 10px; }
img.float-right-margin-noborder { border: 0; float: right; margin: 0 0 10px 10px; }
img.float-right-margin-border { border: 2px solid #575353 !important; float: right; margin: 0 0 10px 10px;}


/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

	HOLDING PAGE

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/


/* master div that holds everything in place  */
div#wrapper { width: 800px; height: 607px; border: 1px solid #565353; position: relative; 
               background-color: #827e72; margin: 5px auto 5px auto; padding: 0; }
               
div#wrapper div#message { position: absolute; top: 330px; left: 90px; border: 0; width: 460px; height: 160px;  }              

div#wrapper div#credits { z-index: 10; position: absolute; top: 362px; right: 0px; border: 0; /*width: 300px; height: 100px;*/
                           /*text-transform: uppercase;*/ color: #827e72; text-align: left; }              
div#wrapper div#credits p a { font-size: 0.60em !important; color: #827e72; }              


div#left-side { float: left; width: 245px; border: 0; height: 100%; min-height: 390px; margin: 0; }
div#left-side img.logo { position: absolute; top: 30px; left: 40px; border: 0; }


div#left-side div#contact { position: absolute; top: 460px; left: -25px; border: 0; color: #fff; text-align: center; 
                            font-size: 0.75em; text-transform: uppercase; }
div#left-side div#contact img { border: 0; float: left;  }

/* slideshow */
/*** set the width and height to match your images **/

div#slideshow { float: right; position: relative; height: 365px; width: 550px; margin: 0; padding: 0; border: 0; }

div#slideshow img { position: absolute; top: 0; left: 0; z-index: 8; opacity: 0.0; }
/* bring current image to top of z-index */
div#slideshow img.active { z-index: 10; opacity: 1.0; }
/* move last image to lower z-index */
div#slideshow img.last-active { z-index: 9; }

/* fork image */
div#right-bottom { clear: none; float: right; width: 550px; height: 242px; margin: 0; border: 0; }
div#right-bottom img.fork { width: 550px; height: 242px; margin: 0; border: 0; }



/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*

	MISC CLASSES

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/* colour scheme */
.grey { color: #827e72; }
.dark-grey { color: #565353; }
.eggshell { color: #f1f0ed; }

.clear { clear: both;}
