/*************************************************
**************************************************

Website Name: Uganda13 Eclipse Trip
Website URL: judithwshanks.com/uganda13
Website Author: Jeanne Berger
Author URL: jeanneberger.com
Copyright 2014. All Rights Reserved.

Color Guide
***************
040101 - Black
5f4d2a - Khaki
a36e32 - Sand
e27c1c - Orange
fce4a7 - Cream
0d3963 - Navy
77868c - Blue Gray
8f4d22 - Brown


*************************************************/

/************************************************
*************************************************
0. CSS Reset ------------------------ All Files
1. Body Styles ---------------------- index.php, page.php
2. Header Styles -------------------- header.php
3. footer styles -------------------- footer.php
4. Cover Style ---------------------- cover.shtml
5. Intro Styles ---------------------- intro.shtml
6. Images ---------------------------

*************************************************
************************************************/

/*----------------------------------------------
------------------------------------------------
0. CSS Reset
------------------------------------------------
----------------------------------------------*/
 
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}

/*--------------------------------
/*
Copyright (c) 2008, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.5.1
*/
/* base.css, part of YUI's CSS Foundation */
h1 {
	/*18px via YUI Fonts CSS foundation*/
	font-size:138.5%;  
}
h2 {
	/*16px via YUI Fonts CSS foundation*/
	font-size:123.1%; 
}
h3 {
	/*14px via YUI Fonts CSS foundation*/
	font-size:108%;  
}
h2, h3 {
	/* top & bottom margin based on font size */
	/* removed h1 from this list */
	margin:1em 0 0;
}

h1,h2,h3,h4,h5,h6,strong {
	/*bringing boldness back to headers and the strong element*/
	font-weight:bold; 
}
abbr,acronym {
	/*indicating to users that more info is available */
	border-bottom:1px dotted #000;
	cursor:help;
} 
em {
	/*bringing italics back to the em element*/
	font-style:italic;
}
blockquote,ul,ol,dl {
	/*giving blockquotes and lists room to breath*/
	margin:1em;
}
ol,ul,dl {
	/*bringing lists on to the page with breathing room */
	margin-left:2em;
}
ol li {
	/*giving OL's LIs generated numbers*/
	list-style: decimal outside;	
}
ul li {
	/*giving UL's LIs generated disc markers*/
	list-style: disc outside;
}
dl dd {
	/*giving UL's LIs generated numbers*/
	margin-left:1em;
}

p,fieldset,table,pre {
	/*so things don't run into each other*/
	margin-bottom:.9em;
}

/* from reset-fonts-grids-css*/
body {font:15px/1.4 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}
table {font-size:inherit;font:100%;}


/*----------------------------------------------
------------------------------------------------
1. Body Styles
------------------------------------------------
----------------------------------------------*/
/* ***** STICKY FOOTER *****  
http://ryanfait.com/resources/footer-stick-to-bottom-of-page/
*/

#footer .push {
	height: 40px;
} /* need for sticky footer*/

* {
margin: 0;
} /*need for sticky footer */

html, body {
height: 100%;
} /*need for sticky footer */

#container {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -40px;
}

/* *****  END STICKY FOOTER ***** */
body { 
background: #fff;
}

#container {
	width: 990px; /*changed from 988px */
	background: #fff;
	padding:0 40px;
}
#content-container {
	float: left;
	width: 990px;
	background: #fff;
	padding-top: 40px;
}

#intro #content-container, #cover #content-container {
	padding-top:0;}

/*column 1*/
#col1 {
	float: left;
	width: 316px;
	padding: 20px 0 0px;
	margin: 0;
}
	
#content-container2 #col1, #content-container2 #col2_3 {padding:0;}

#col2_3 {
	float: left;
	width: 652px;
	padding: 20px 0 60px;
	margin: 0 0 0 20px;
}

#col_span {clear: left; 	
width: 988px; padding-bottom:20px;}

img {margin: 0;
padding: 0;
border: none;
vertical-align:bottom;}
	
.caption-right {text-align: right;}

.caption-left, .caption-right, .caption {
	color: #8f4d22;
	font-size: 90%;
	line-height: 1.0;
	margin: 2px 0 0 0;

}

 a, a .caption-left, a .caption-right {
	text-decoration:none;
	color: #8f4d22;
}

h1 {color: #8f4d22; font: 20px;
font-family: 'Arial Black', Gadget, sans-serif;}

.arrow-right {
	width: 0; 
	height: 0; 
	border-top: 30px solid transparent;
	border-bottom: 30px solid transparent;
	border-left: 30px solid #a36e32;
}
.cream {color: #fce4a7;}
.navy {color:#0d3963;}
.smaller {font-size: 80%;}

/*----------------------------------------------
------------------------------------------------
2. Header Styles
------------------------------------------------
----------------------------------------------*/
#header #east-africa {
	display: none;
}

#header .caption-left { visibility: hidden;} 

#header {
background: #a36e32 url(../images/_header/header_post.jpg) no-repeat 0px 0px; /*sand*/
padding: 0;
margin: 0;
height: 144px; 
width: 990px;
overflow:hidden;	}
	
#header h1 {
padding: 60px 0 0 20px;
margin: 0; color: #000;
}
	
#header .caption-right {
	position: relative;
	bottom: 0;
	color: #fce4a7;
	margin: 26px 0 0 0;
	padding: 0;
	font-size: 9px;
	line-height: 10px;
	width: 990px;
	right: 110px
}

/* ******header-intro***** */	
#intro #header #east-africa {
	height:310px;
	width:232px;
	border:solid 2px #fce4a7;
	background:url(../images/_header/east-africa.png);
	margin: 10px 0 0 106px;
	display: block;
	}
	
#intro #header {
	background: #a36e32 url(../images/_header/header-990x342_post_3214.jpg) no-repeat 0px 0px; /*sand*/
	padding: 0;
	margin: 0;
	height: 342px;
	width: 990px;
}

#intro #header h1 {
display: none;
padding: 0;
}

#intro #header .caption-left, #intro #header .caption-right {
	position: relative;
	bottom: 0;
	color: #fce4a7;
	margin: 2px 0 0 0;
	padding: 0;
	font-size: 9px;
	line-height: 10px;
	visibility:visible;
}

#intro #header .caption-left {left: 107px;}
#intro #header .caption-right {right: 110px;margin-top: -11px;}

/* ******navigation***** */	

#navigation {
	float: left;
	width: 990px;
	background: #0d3963; /*navy*/
}

#navigation ul{	margin: 0;
	padding: 0;
}

#navigation ul li{
	font-size: 12px;
	list-style-type: none;
	display: inline;
}

#navigation li a {
	display: block;
	float: left;
	padding: 5px 10px;
	color: #fce4a7;
	text-decoration: none;
	border-right: 1px solid #fff;
}

#navigation li a:hover { background: #e27c1c; color: #FFF; } /*orange with white type */

/*----------------------------------------------
------------------------------------------------
3. Footer Styles
------------------------------------------------
----------------------------------------------*/

#footer {
	clear: left;
	background: #0d3963; /*navy*/
	text-align: left;
	padding: 6px 20px 20px;
	color: #fce4a7;
}
#footer .right {display: inline-block; float:right;}
#footer a {color: #FFF; text-decoration:none;}
#footer img {width: 30px; vertical-align:middle; }

/*----------------------------------------------
------------------------------------------------
4. Cover 
------------------------------------------------
----------------------------------------------*/

#cover { 
background: #0d3963;
}

#cover #container {width: 991px;background: #0d3963; position: relative;
}

#cover h1 {
top:487px;
left:103px;
position: absolute;
z-index: 30;color: #e27c1c; 
font-size:24px; 
/*padding: 84px 0 0 29px;*/
}
#cover h1 img {
float: left;	margin-right: 29px; margin-top: -84px;
}

#cover .arrow-right {
	position:absolute;
	right: 30px;
	top: 100px;
	width: 0; 
	height: 0; 
	border-top: 30px solid transparent;
	border-bottom: 30px solid transparent;
	border-left: 30px solid #a36e32;
}

#cover .arrow-right p {
	color: #fce4a7;
	font: small-caps 20px 'Arial Black', Gadget, sans-serif;
	margin: -20px -80px;
0 0 }

#pix_i01 img, #pix_i01 {height: 488px;float: left;}
#pix_i02 img, #pix_i02 {height: 244px;}
#pix_i03 img, #pix_i03 {height: 244px;clear:left;}
#pix_i04 img, #pix_i04 {width: 990px; }
#pix_i05 img, #pix_i05 {width: 253px;}


/*----------------------------------------------
------------------------------------------------
5. Intro
------------------------------------------------
----------------------------------------------*/

	/*col1-sidebar*/
	.sidebar_img {
	margin: 9px 0 0 }

	#intro #col1 p, #intro #col1 h2, #intro #col1 table, #intro #col1 img {
	padding: 0 9px;
	width: 217px}
	
	#intro #col1 #pix_n02 img, #intro #col1 #pix_n02 {
	width: 235px; padding: 0;}
	
	#intro #col1 h2 {
	font-size: 100%;
	}
	#intro #col1 {
	background: #fce4a7;
	padding: 0px;
	width: 235px;
	margin-left: 106px;}
	
	/*table*/
	#intro #col1 td {text-align: right;
	font-size: 98%;
	line-height:1.1;
	padding:0 0 2px 0;}
	#intro #col1 table {margin-top: 6px;}
	#intro #col1 td:nth-child(even) {padding-left: 9px; text-align: left;} /*right column*/
	
	/*col2_3*/
	#intro #col2_3 {
	width: 520px;
	margin: 0 0 0 20px;
	}
	#intro #col2_3 #pix_n03 img, #intro #col2_3 #pix_n03, #intro #col2_3 #pix_n03 p {
	width: 320px; 
	margin-left: 15px;
	}
	#intro #col2_3 #pix_n03 {
	float: right;
	position: relative;
	bottom:0; }
	
	#intro #col2_3 #pix_n03 img {margin-top: 20px; }

/*----------------------------------------------
------------------------------------------------
x. text and images-layout
------------------------------------------------
----------------------------------------------*/
/* **** animals ***** */
#animals #content-container p:first-child {width: 430px; float: left; margin: 20px 0 30px;}
#content-container a img, #content-container a p {width:inherit; display: block; }
#content-container a p {margin: 2px 0 30px;}
#pix_a01, #pix_a03, #pix_a05 {float: left;}
#pix_a02, #pix_a04, #pix_a06 {float: right;}
#pix_a03 img, #pix_a05 img{clear:both;}

#pix_a01 {width: 526px; }
#pix_a02 {width: 434px;}
#pix_a03 {width: 309px;}
#pix_a03 img {margin-top: 31px;}
#pix_a04 {width: 650px;}
#pix_a05 {width: 489px;}
#pix_a06 {width: 467px;}

/* **** nairobi ***** */
.txt_b01, .txt_b02, .caption_b05, .caption_b13, #pix_b02, #pix_b04, #pix_b05, #pix_b12, #pix_b13 {float: right;}
#pix_b01, #pix_b03, #pix_b06, #pix_b07, #pix_b08, #pix_b09, #pix_b10, #pix_b11 {float: left; margin-right: 30px;}
#pix_b03, #pix_b07, #pix_b08 {clear:both; margin-top: 30px;}

.txt_b01 {width: 411px; margin-top:23px;}
.txt_b02 {width: 625px; margin-top: 30px;}
#pix_b01 {width: 545px;}
#pix_b02 {width: 411px; }
#pix_b03 {width: 309px;}
#pix_b04 {width: 198px; margin-right: 348px; margin-top: -362px; z-index: 20;}
#pix_b05 {width: 514px; margin-top: 30px; z-index: 10;}
.caption_b05 {width: 120px; text-align: right; display: block; margin-right: 522px; margin-top: -129px;}
#pix_b06 {width: 138px; margin-left: -344px; margin-top: -22px;}
#pix_b07 {width: 313px; margin-top: 20px;}
#pix_b08 {width: 207px; margin-top: -30px;}
#pix_b09 {width: 177px; margin-top: 89px; margin-left: -177px;}
#pix_b10 {width: 284px; margin-top: 30px;}
#pix_b11 {width: 170px; margin-top: 209px; margin-left: -200px;}
#pix_b12 {width: 333px; margin-top: -257px;}
#pix_b13 {width: 200px; margin-left: 333px; margin-top: -19px; text-align: right;}

/*amboseli_1*/
#pix_m01, #pix_m05, #pix_m06, #pix_m07, #pix_m10, #pix_m11, #pix_m13, #pix_m12, .txt_m07, .txt_m05 {float: left;}
#pix_m02, #pix_m03, #pix_m04, #pix_m08, #pix_m09, .txt_m03, .txt_m04 {float: right;}
#pix_m06, #pix_m11, .txt_m07 {clear:both; }

#pix_m01 {width: 990px;z-index:10;}
#pix_m02 {width: 486px; margin: -80px 30px 30px 30px; z-index: 20;}
#pix_m03 {width: 308px; margin-top: -35px;}
#pix_m04 {width: 353px; clear: right; margin-top: 30px;}
#pix_m05 {width: 461px;}
#pix_m06 {width: 558px; margin-top: -6px;}
#pix_m07 {width: 263px; margin: -214px 0 0 -290px; z-index: 20;} /*margin-left: -77px; margin-top: -530px;*/
#pix_m08 {width: 353px; margin-top: -30px;}
#pix_m09 {width: 353px; margin-top: 30px;}
#pix_m10 {width: 409px; margin-top: 29px;}
#pix_m11 {width: 310px; margin-right: 30px;}
#pix_m12 {width: 310px; margin-right: 30px;}
#pix_m13 {width: 310px;}
.txt_m03, .txt_m04 {text-align: right;}
.txt_m03 {margin: 207px 6px 0 0;}
.txt_m04 {margin: 274px 6px 0 0 ;}
.txt_m05 {width: 80px; margin: 132px 0 0 6px;}
.txt_m07 {width: 200px; padding-left: 60px; text-align: right; padding-bottom: 12px;}

/*amboseli_2*/
#pix_mb01, .txt_mb01, #pix_mb05, #pix_mb06, #pix_mb07 {float: left;}
#pix_mb02, #pix_mb04, .txt_mb06, .txt_mb03, #pix_mb03, .txt_mb05 {float: right;}
#pix_mb01, .txt_mb01 {width: 310px;}

#pix_mb02 {width: 650px;}
#pix_mb03 {width: 300px; margin-right: -89px; margin-top: -177px;}
#pix_mb04 {width: 438px;clear: right;}
#pix_mb05 {width: 464px; clear: right; margin-left: 407px; margin-top:-110px;}
.txt_mb03 {display: block; width: 342px; margin-top: 137px;}
.txt_mb05 {display: block; margin-top: 210px; padding-left: 6px;width: 113px;}
#pix_mb06 {width: 377px; margin-top: -216px;}
#pix_mb07 {margin-top: 28px;}
#pix_mb07 {width: 464px; margin-left: 30px; }

/*mara_serena*/
.txt_ms01 {width: 377px;}
#pix_ms01, #pix_ms02, #pix_ms03, #pix_ms04, #pix_ms05, #pix_ms06, #pix_ms07 {float: left;}
#pix_ms02 {margin-top: -53px;}
#pix_ms01 {margin-top: 8px;}

#pix_ms02, #pix_ms04, #pix_ms05, #pix_ms07 {width: 464px; margin-left: 30px; }
#pix_ms01, #pix_ms03, #pix_ms06 {width: 377px;}
#pix_ms03 {margin-top: -142px;}
#pix_ms06 {margin-top: -210px;}

#pix_ms03 {clear: both;}

/*masai-mara*/

#pix_mm01, #pix_mm02, #pix_mm03, #pix_mm04, #pix_mm05, #pix_mm06, #pix_mm08, #pix_mm09 {width: 480px; float: left;} 
.txt_mm01 {width: 200px; float: left; margin-top: 60px;} 
#pix_mm07 {width: 560px; float: left;} 
#pix_mm02, #pix_mm04, #pix_mm06, #pix_mm07, #pix_mm09 {margin-left: 30px;} 
#pix_mm01, #pix_mm03, #pix_mm05, .txt_mm01, #pix_mm08 {clear: left;} 

/*big-game*/

.txt_bg01, #pix_bg01, #pix_bg02, #pix_bg03, #pix_bg04, #pix_bg05, #pix_bg07, #pix_bg09, #pix_bg11, #pix_bg12, #pix_bg13 {width: 480px; float: left;} 
#pix_bg10 {width: 480px; float: right;}
#pix_bg06, #pix_bg08 {width: 400px;float: left;}
#pix_bg01, #pix_bg03, #pix_bg06, #pix_bg08, #pix_bg10, #pix_bg13 {margin-left: 30px;} 

#pix_bg02, #pix_bg04, #pix_bg05, #pix_bg07, #pix_bg09, #pix_bg11, #pix_bg12 {clear: left; } 

#pix_bg02, #pix_bg04  {clear: left; margin-top: -235px;} 
#pix_bg06 {margin-top: -120px;}
#pix_bg07 {margin-top: -73px;}
#pix_bg09 {margin-top: -116px;}
#pix_bg13 {margin-top: -48px;}

/*murchison-falls*/
#pix_mf01, .txt_mf01, #pix_mf03, #pix_mf04, #pix_mf05, #pix_mf06, #pix_mf07, #pix_mf08, #pix_mf09, #pix_mf10, #pix_mf11, #pix_mf12, #pix_mf13, #pix_mf14, #pix_mf15 {float: left;} 

#pix_mf01 {width: 650px;}
.txt_mf01 {width: 280px; margin-left: 30px; }
#pix_mf02 {width: 438px; margin-top: -408px; float: right;}
#pix_mf03 {width: 523px; clear: both;}
#pix_mf04 {width: 406px; float: right;}

#pix_mf05 {width: 389px; clear: both;}
#pix_mf06 {width: 310px; float: right;}
#pix_mf07 {width: 292px; margin: -132px 0 0 -30px;  }
#pix_mf07 p {width: 359px; text-align: right; display: block;}

#pix_mf08, #pix_mf11 {width: 389px; clear: left;}
#pix_mf09, #pix_mf10, #pix_mf12 {width: 480px; margin-left: 30px;}
#pix_mf08 {margin-top: 100px;}
#pix_mf11 {margin-top: -136px;}

#pix_mf13 {width: 291px; clear: left;}
#pix_mf14 {width: 274px;}
#pix_mf15 {width: 360px;}
#pix_mf14, #pix_mf15 {margin-left: 30px;}


/*eclipse*/
#pix_e01, .txt_e01, #pix_e02, #pix_e03, #pix_e04, #pix_e05, #pix_e06, #pix_e07, #pix_e08, #pix_e09, #pix_e10, #pix_e11, #pix_e12 {float: left;} 

#pix_e01, .txt_e01, #pix_e02, #pix_e03, #pix_e04, #pix_e05, #pix_e06, #pix_e07, #pix_e08, #pix_e09, #pix_e10 {width: 480px;}
#pix_e02, #pix_e04, #pix_e06, #pix_e08, #pix_e10 {margin-left: 30px;}
#pix_e12 {margin: 30px 0 0 -13px;}
#pix_e12 p {text-align: right;}
#pix_e11 {width: 623px;}
#pix_e12 {width: 380px;}
#pix_e03, #pix_e05, #pix_e07, #pix_e09, #pix_e11 {clear: left;} 
#pix_e04, #pix_e05 {margin-top: -22px;}
#pix_e07 {margin-top: -69px;}

#cover h1 {margin:1em 0 0;}
.clear {clear: both;}

/* iPad [portrait + landscape] */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
#footer {margin-left:40px; margin-right:0;}
#containter {margin-left: 0; margin-right: 0;}
}

/* iPhone [portrait + landscape] */
@media only screen and (max-device-width: 480px) {
#footer {margin-left:40px; margin-right:0;}
#containter {margin-left: 0; margin-right: 0;}
}









