/*
-----------------------------------------------
The Ethical Occasions Company CSS
Author: David Lockie
----------------------------------------------- 
*/

/* YUI RESET ----------------------------------------------- */

/* Copyright (c) 2008, Yahoo! Inc. All rights reserved. Code licensed under the BSD License: http://developer.yahoo.net/yui/license.txt version: 2.5.0 */

html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,span{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym {border:0;font-variant:normal;}sup {vertical-align:text-top;}sub {vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{font-size:100%;}legend{color:#000;}

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

html { margin:0; padding:0; text-align:center; font-size:100%; height:100%;  } /* Somehow Fixes IE font size */
body { margin:0; padding:0; text-align:center; font-size:1em; font-family:"century gothic","avant garde",verdana,arial,sans-serif; color:white; height:100%; }
#page { margin:0; padding:5px; text-align:center; color:#fff; height:auto; min-height:100%; font-size:0.75em; background-color:#676767; vertical-align:top; }
#frame { width:1000px; margin:0 auto 0 auto; padding:0; text-align:center; background-color:#a7a6a7; height:auto; }
.center { width:100%; text-align:center; margin:auto; }
.phoneno { position:absolute;width:auto;color:white;top:10px;right:10px;font-size:2em; }

img {border:none 0;}
a img {border:none 0;}
a img:hover {border:none 0;}

.noborder {border:none 0;}
.noborder:hover {border:none 0;}
.mainimage { height:460px; width:460px; border:10px white solid; margin:0; padding:0; }

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

ol, ol li { font-size:1em; line-height:1.5em; margin:0.5em 0 0.5em 0; }
ul, ul li { list-style-type:disc; margin:0.5em 0 0.5em 1em; }
p, label { font-size:1em; line-height:1.5em; margin:1em 0 1em 0; padding:0; }
blockquote { font-size:1em; line-height:1.5em; margin:1.2em 3em 1.2em 3em; text-align:justify; }
pre { font-family:monospace; font-size:1em; }
em { font-style:italic; }
label { color:black; }
td { vertical-align:top; }
.italic { font-style:italic; }
.bold { font-weight:bold; }
.gray { color:gray; }
.center { text-align:center; }
.bigger { font-size:1.5em; }
.white { color:white; }
.red { color:red; }
.black { color:black; }

a { text-decoration:none;font-size:1em; }
a:hover { text-decoration:none;font-size:1em; }
a:visited { text-decoration:none; border:0 none; }

a.link { text-decoration:none; color:#778e1d; border-bottom:1px dotted #778e1d; }
a.link:hover { text-decoration:none; color:#17288b; border-bottom:1px solid #17288b; }

.clear { clear:both; }

/* HOME NAV ----------------------------------------------- */

#logo { display:block; float:left; width:270px; height:157px; background:url(/images/TEOC-Header-roll.png) 0 0 no-repeat; overflow:hidden; }
#logo span { display:block; float:left; width:100%; height:100%; background:url(/images/TEOC-Header-roll.png) 0 -157px no-repeat; overflow:hidden; }
#homenav { position:relative; background:url(/images/TEOC-main.jpg) no-repeat; width:480px; height:480px; overflow:hidden; }

/* CONTENT ----------------------------------------------- */

#content { width:970px; margin:0 auto 0 auto; padding:0; text-align:justify; background-color:#a7a6a7; height:auto; }

/* ROLLOVER WINDOW ----------------------------------------------- */

#TEOCmain { position:relative; display:block; top:0; width:480px; height:480px; padding:0; margin:0; background:url(/images/TEOC-main-toponly.jpg) 0 0 no-repeat; }

#TEOCmainchanger { position:relative; display:block; width:100%; height:100%; padding:0; margin:0;  }
#TEOCmainchanger.lifestyle { background:url(/images/TEOC-main.jpg) 0 -480px no-repeat; }
#TEOCmainchanger.homeecoaudit { background:url(/images/TEOC-main.jpg) 0 -960px no-repeat; }
#TEOCmainchanger.giftstreatsfun { background:url(/images/TEOC-main.jpg) 0 -1440px no-repeat; }
#TEOCmainchanger.weddingplanning { background:url(/images/TEOC-main.jpg) 0 -1920px no-repeat; }
#TEOCmainchanger.partiesevents { background:url(/images/TEOC-main.jpg) 0 -2400px no-repeat; }
#TEOCmainchanger.traveltransport { background:url(/images/TEOC-main.jpg) 0 -2880px no-repeat; }
#TEOCmainchanger.businessecoaudit { background:url(/images/TEOC-main.jpg) 0 -3360px no-repeat; }
#TEOCmainchanger.corporateevents { background:url(/images/TEOC-main.jpg) 0 -3840px no-repeat; }
#TEOCmainchanger.shoppingsuppliers { background:url(/images/TEOC-main.jpg) 0 -4320px no-repeat; }

#TEOCmain ul { position:relative; display:block; width:100%; height:100%; padding:0; margin:0; }
#TEOCmain ul li { position:relative; display:block; float:left; width:154px; height:154px; margin:0; padding:0; margin-right:9px; margin-bottom:9px; }
#TEOCmain ul li.right { margin-right:0; }
#TEOCmain ul li a { position:relative; display:block; float:left; width:100%; height:100%; margin:0; padding:0; }
	
/* NAV ----------------------------------------------- */ 

#nav { position:relative; float:left; width:970px; padding:0; margin:0; }
#nav ul { position:relative; display:block; float:left; width:700px; top:122px; left:50px; margin:0; list-style-type:none; overflow:visible; }
#nav li { position:relative; display:block; float:left; width:auto; margin:0; padding:0 0.75em 0.3em 0.75em; list-style-type:none; }
#nav li a, #nav li a:link, #nav li a:visited { font-size:1.5em; color:white; }
#nav li a:hover { color:black; border-bottom:1px dotted black; }

.home #nav .navA a, .home #nav .navA a:link, .home #nav .navA a:visited { color:black; border-bottom:1px dotted black; }
.lifestyle #nav .navA a, .lifestyle #nav #nav .navA a:link, .lifestyle #nav .navA a:visited { color:black; border-bottom:1px dotted black; }
.homeecoaudit #nav .navA a, .homeecoaudit #nav .navA a:link, .homeecoaudit #nav .navA a:visited { color:black; border-bottom:1px dotted black; }
.giftstreatsfun #nav .navA a, .giftstreatsfun #nav .navA a:link, .giftstreatsfun #nav .navA a:visited { color:black; border-bottom:1px dotted black; } 
.weddingplanning #nav .navA a, .weddingplanning #nav .navA a:link, .weddingplanning #nav .navA a:visited { color:black; border-bottom:1px dotted black; } 
.partiesevents #nav .navA a, .partiesevents #nav .navA a:link, .partiesevents #nav .navA a:visited { color:black; border-bottom:1px dotted black; } 
.traveltransport #nav .navA a, .traveltransport #nav .navA a:link, .traveltransport #nav .navA a:visited { color:black; border-bottom:1px dotted black; } 
.businessecoaudit #nav .navA a, .businessecoaudit #nav .navA a:link, .businessecoaudit #nav .navA a:visited { color:black; border-bottom:1px dotted black; } 
.corporateevents #nav .navA a, .corporateevents #nav .navA a:link, .corporateevents #nav .navA a:visited { color:black; border-bottom:1px dotted black; } 
.shoppingsuppliers #nav .navA a, .shoppingsuppliers #nav .navA a:link, .shoppingsuppliers #nav .navA a:visited { color:black; border-bottom:1px dotted black; } 
.about #nav .navB a, .about #nav .navB a:link, .about #nav .navB a:visited { color:black; border-bottom:1px dotted black; } 
.ethics #nav .navC a, .ethics #nav .navC a:link, .ethics #nav .navC a:visited { color:black; border-bottom:1px dotted black; } 
.portfolio #nav .navD a, .portfolio #nav .navD a:link, .portfolio #nav .navD a:visited { color:black; border-bottom:1px dotted black; } 
.suppliers #nav .navE a, .suppliers #nav .navE a:link, .suppliers #nav .navE a:visited { color:black; border-bottom:1px dotted black; } 
.contact #nav .navF a, .contact #nav .navF a:link, .contact #nav .navF a:visited { color:black; border-bottom:1px dotted black; } 

/* BODY ----------------------------------------------- */
		
h1 { color:#666666; font-size:2em; padding-top:0.5em; font-weight:300;	}
h2 { color:#369949; font-size: 1.8em; padding-top:5px; }
h3 { color:#666666; font-size: 1.6em; padding-top:5px;	}	
h4 { color:#666666; font-size: 1.2em; padding-top:5px; font-weight:bold; }	

/* HOMEPAGE LEFT ------------------------------------------------*/

#homeleft { width:50%; height:480px; overflow:hidden; clear:both; float:left; margin-top:10px;}

/* HOMEPAGE RIGHT ------------------------------------------------*/

#homeright { width:49%; float:left; position:relative; }
#homeright h1 { font-size:3em; margin:10px;  }
#homeright h2, h3 { margin-left:10px; }
#homeright p, li { font-size:1.2em; color:#6c6c6c; margin:10px; }

.intro { width:480px; height:480px; color:black; position:relative; padding:0; margin:0; }
.intro ul, ol, li { padding-left:10px; margin-left:10px; }
.intro ul li { list-style-type:disc; padding:0 10px 0 10px; margin-top:0; margin-bottom:0; }

#home { position:absolute; top:0; left:0; padding-top:10px; z-index:2; }
.homeimage { width:480px; height:480px; }
#lifestyle { width:480px; height:480px; background-color:white; position:absolute; top:10px; left:0; padding:0; }
#lifestyle h1 { color:#a3b729; }
#lifestyle li { list-style:disc outside url(/images/TEOC-bullet-green.gif); }
.lifestyle #lifestyle { visibility:visible; }
#homeecoaudit { width:480px; height:480px; background-color:white; position:absolute; top:10px; left:0; padding:0; }
#homeecoaudit h1 { color:#2dccfd; }
#homeecoaudit li { font-size:1em; list-style:disc outside url(/images/TEOC-bullet-lblue.gif); }
.homeecoaudit #homeecoaudit { visibility:visible; }
#giftstreatsfun { width:480px; height:480px; background-color:white; position:absolute; top:10px; left:0; padding:0; }
#giftstreatsfun h1 { color:#653c30; }
#giftstreatsfun li { list-style:disc outside url(/images/TEOC-bullet-brown.gif); }
.giftstreatsfun #giftstreatsfun { visibility:visible; }
#weddingplanning { width:480px; height:480px; background-color:white; position:absolute; top:10px; left:0; padding:0; }
#weddingplanning h1 { color:black; }
#weddingplanning h2 { color:black; }
#weddingplanning p { font-size:1em; }
.weddingplanning #weddingplanning { visibility:visible; }
#weddingplanning p.weddingteaser { font-style:italic; font-weight:bold; font-size:1.1em; }
#partiesevents { width:480px; height:480px; background-color:white; position:absolute; top:10px; left:0; padding:0; }
#partiesevents h1 { color:#ff5617; }
#partiesevents h2 { color:#ff5617; }
#partiesevents p { font-size:1em; }
.partiesevents #partiesevents { visibility:visible; }
#traveltransport { width:480px; height:480px; background-color:white; position:absolute; top:10px; left:0; padding:0; }
#traveltransport h1 { color:#708db7; }
#traveltransport h2 { color:#708db7; }
#traveltransport p { font-size:1em; }
.traveltransport #traveltransport { visibility:visible; }
#businessecoaudit { width:480px; height:480px; background-color:white; position:absolute; top:10px; left:0; padding:0; }
#businessecoaudit h1 { color:#2cd123; }
#businessecoaudit li { list-style:disc outside url(/images/TEOC-bullet-bgreen.gif); }
.businessecoaudit #businessecoaudit { visibility:visible; }
#corporateevents { width:480px; height:480px; background-color:white; position:absolute; top:10px; left:0; padding:0; }
#corporateevents h1 { color:#d5984d; }
.corporateevents #corporateevents { visibility:visible; }
#shoppingsuppliers { width:480px; height:480px; background-color:white; position:absolute; top:10px; left:0; padding:0; }
#shoppingsuppliers h1 { color:#d52312; }
.shoppingsuppliers #shoppingsuppliers { visibility:visible; }

/* MAIN CONTENT ----------------------------------------------- */

#maincontent { width:100%; height:480px; float:left; margin-top:10px; background-color:white; }
#maincontent h1 { font-size:3em; margin:10px;  }
#maincontent h2 { color:gray; margin-left:10px; }
#maincontent p, li { font-size:1.2em; color:#6c6c6c; margin:10px; }
#maincontent li { list-style:disc outside url(/images/TEOC-bullet-lblue.gif); }
#aboutintro { position:relative; float:left; width:480px; padding:70px 5px 0 5px; font-style:italic; text-align:center; }
#aboutintro p { color:black; }
#aboutintro .aboutintrostrap { font-size:1.5em; }
#aboutmain { width:460px; float:left; position:relative; margin:0; padding:0; }
#aboutmain p { font-size:1.1em; }
#ethicsintro { position:relative; float:left; width:480px; padding:0; }
#ethicsmain { width:460px; float:left; position:relative; margin:0; padding:0; }
#supplierintro { position:relative; float:left; width:480px; padding:0; }
#suppliermain { position:relative; float:left; width:460px; margin:0; padding:0; }
#iframeform { width:479px; height:460px; overflow:hidden; border:0 none; margin:0; padding:0; }
#iframeformcontainer { position:relative; float:left; width:479px; border:0 none; margin:0; padding:0; }
#contactmain { width:480px; float:left; position:relative; }
#contactmain p { font-weight:bold; font-size:1.4em; }
#portfoliomain { width:480px; float:left; position:relative; }
#portfolioflashcontainer { width:460px; height:460px; position:relative; float:left; text-align:center; margin:10px; }

/* HOME BOTTOM NAVIGATION ----------------------------------------------- */

#homebottomnav { text-align:center; }
#homebottomnav a { color:white; }
#homebottomnav a:link, #homebottomnav a:visited { font-size:1.4em; }
#homebottomnav a:hover { font-size:1.4em;color:black;border-bottom:1px dotted black; }
#homebottomnav .active:link, #homebottomnav .active:visited, #homebottomnav .active:hover { color:black;border-bottom:1px dotted black; }

/* CONTENT FOOTER ----------------------------------------------- */
			
#contentfooter { text-align:center; margin:10px; padding:5px; }
#contentfooter a:link, #contentfooter a:visited, #contentfooter a { color:#d4d4d4; }
#contentfooter a:hover { color:#d4d4d4; border-bottom:1px dashed #d4d4d4; }

/* CONTACT FORM ----------------------------------------------- */

input[type='text'] { position:absolute; left:150px; width:200px; }
input[type='submit'] { position:relative; float:right; width:auto; overflow:visible; padding:2px; font-family:"century gothic","avant garde",verdana,arial,sans-serif; }
.formfield { margin:10px; }
.formcontainer { text-align:left; border:0 none; margin:0; padding:10px; }
.formcontainerintro { color:gray; padding:0; margin:0; }
#formsubcontainer { text-align:left; border:0 none; margin:70px 10px 0 10px; }
#formsubcontainer p { color:gray; }
.formsublogo { position:relative; display:block; float:left; width:150px; height:23px; overflow:hidden; background:url(http://www.google.com/images/spreadsheets/forms/sprites_1.gif) no-repeat; }