/* External CSS for www.pulau-suka.com */

body			{
				background-image: url("../i/bg_body.gif");
				background-repeat: repeat;
				font-size: 12pt;
				font-family: "Segoe UI", Candara, "Bitstream Vera Sans", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
				}
		
#outerborder	{
				width: 950px;
				margin-left: auto; 				/* 'auto' centres a block if width set */
				margin-right: auto;
				margin-top: 25px;
				padding: 0px;
				border: solid 10px white;
				}			
				
#bodycontent	{
				color: #660000;
				background-color: #fffcec;
				padding-left: 20px;
				padding-right: 20px;
				padding-top: 10px;
				padding-bottom: 20px;
				border: solid 1px #aa781a;
				position: relative; /* first top-down definition of position needed for banner_text */
				}
				
h1				{
				font-size: 120%;
				margin-top: 25px;
				border-bottom: solid 1px black;
				}

h2				{
				width: 454px;
				font-size: 100%;
				color: #b7b3a4;
				border-bottom: dashed 0px black;
				margin-top: 20px;
				margin-bottom: 5px;
				font-weight: normal; /* 'bold' or 'normal' */
				text-transform: uppercase;
				}
				
p				{
				margin-top: 0px;
				margin-bottom: 5px;
				}					

a:link, a:visited		{
				color: #809fff;
				text-decoration: none;
				}
				
a:hover, a:active		{
				color: #f7c0ff;
				text-decoration: underline;
				}
				
#topstuff			{
				padding-top: 0px;
				padding-bottom: 0px;
				padding-left: 0px;
				padding-right: 0px;
				}
				
#topstuff a img			{								/* http://www.w3.org/Style/Examples/007/center */
				display: block;
				margin-left: auto;
				margin-right: auto;
				}
				
#topstuff span			{
				display: block;
				width: 441px;
				height: 44px;
				position: absolute;
				top: 107px;
				left: 75px;
				background-image: url("../i/suka_banner_text.png");
				background-repeat: no-repeat;
				}
				
#topstuff p			{
				font-size: 110%;
				}
				
#topstuff p:first-letter	{
				font-weight: bold;
				font-size: 130%;
				}
				
#topnavbar			{
				height: 35px;
				padding: 3px;
				padding-left: 0px;
				border-top: dotted 1px black;
				border-bottom: solid 1px black;
				margin: 0px;
				font-size: 90%;
				font-variant: small-caps;
				font-weight: bold;
				letter-spacing: 0.1em;
				}
				
#topnavbar ul			{
				padding-top: 4px;
				padding-left: 0px;
				margin: 0;
				list-style-type: none;
				list-style-image: none;
				}
				
#topnavbar ul li			{
				display: inline;
				/* float: left; works but shifted down from topnavbar box */
				background-color: #faf5e1;
				border: solid 1px;
				border-color: #f3f3f3 #bbb #bbb #f3f3f3;
				padding: 1px;
				margin: 1px;
				}

#topnavbar a			{
				/*  display: block; seems to be unnecessary for 'float' of li elements and does not work for 'inline' */
				text-decoration: none;
				}
				
#topnavbar a:link		{
				color: #c19b52;
				text-decoration: none;
				}
				
#topnavbar a:visited		{
				color: #ffcd6d;
				text-decoration: none;
				}
				
#topnavbar a:hover		{
				color: #df9300;
				text-decoration: underline;
				}
				
#topnavbar a:active		{
				color: #000000;
				text-decoration: none;
				}	
				
#displayboxholder		{
				width: 840px;
				min-height: 380px;
				margin-left: auto;
				margin-right: auto;
				margin-top: 25px;
				margin-bottom: 25px;
				padding: 0px;
				border: dotted 1px black;
				background-color: #fffbf0;
				}
				
.displaybox			{
				float: left;
				width: 215px;
				min-height: 300px;
				padding: 10px;
				margin: 25px 21px 10px 21px;
				border: solid 1px #f7cd4d;
				background-color: #faf5e1;
				}

#twidgetdiv			{
				width: 600px;
				margin-left: auto;
				margin-right: auto;
				margin-top: 25px;
				padding: 0px;
				border: solid 0px #f7cd4d;
				}
				
#gmapswidgetdiv		{
				width: 600px;
				margin-left: auto;
				margin-right: auto;
				margin-top: 25px;
				margin-bottom: 25px;
				padding: 0px;
				border: solid 1px #f7cd4d;
				}
				
#gcalwidgetdiv		{
				width: 602px;
				height: 502px;
				margin-left: auto;
				margin-right: auto;
				margin-top: 25px;
				margin-bottom: 25px;
				padding: 0px;
				border: solid 1px #f7cd4d;
				}
				
#picasawidgetdiv		{
				width: 600px;
				height: 400px;
				margin-left: auto;
				margin-right: auto;
				margin-top: 25px;
				margin-bottom: 25px;
				padding: 0px;
				border: solid 1px #f7cd4d;
				}
				
#fbwidgetdiv			{
				width: 600px;
				/* height: 400px; */
				margin-left: auto;
				margin-right: auto;
				margin-top: 25px;
				margin-bottom: 25px;
				padding: 0px;
				border: solid 1px #f7cd4d;
				}
				
.displaybox a img		{
				display: block;
				margin-left: auto;
				margin-right: auto;
				}
				
.displaybox p			{
				font-size: 95%;
				color: #9f7700;
				padding: 13px 2px 0px 2px;
				text-align: left;
				}
				
.displaybox p:first-letter		{
				font-weight: bold;
				font-size: 100%;
				}
				
#maintext			{
				clear: both;
				}
				
#bottomstuff			{
				padding-top: 5px;
				padding-bottom: 5px;
				padding-left: 10px;
				padding-right: 10px;
				margin-top: 50px;
				background-color: #e8e2cd;
				text-align: center;
				line-height: 1.3em;
				}
				
#bottomnavbar			{
				}

#bottomcredits		{
				font-size: 90%;
				}
				
#bottomcredits a		{
				font-size: 90%;
				color: #c19b52;
				text-decoration: none;
				}