@charset "utf-8";
/* CSS Document */

/*This is to normalize the margin and the padding for the entire site.*/
*{margin:0;
padding:0;
}

/*This is the color of the background behind the container.*/
body {background:#B4A98F;
}

.color {
 display: none;
}
/*This is the container that holds the content of each page on the site.*/
.container {
	width:50%;
/*width:980px;*/
 margin:20px auto;
 min-width:1000px;
/* background-color:#9D6D4D;*/
 background-color:#B4A98F;
 display: block;
}

#mobileNav {
	display: none;
}

.nav_open_button {
	display: none;
}

/*This is the main navigation for the site.*/
#mainnavigation {font-family:Gil Sans,Arial,Helvetica, sans-serif;
font-size:15px;

/*margin:5px auto;*/
clear:both;
}

#mainnavigation ul {list-style:none;
margin-right:auto;
margin-left:auto;
margin-top:5px;
/*width:100%;*/
height:30px;
/*margin:5px auto;*/
padding:5px 0 5px 24%;
background-color:#333333;
}

#mainnavigation li { float:left;
display:inline;
margin:5px auto; 
padding:.2em 1em; 
border-right:#333333 thin solid;
text-align:center;
background-color:#333333;
}

#mainnavigation a {display:inline;
width:10em;
text-decoration:none;
}

#mainnavigation li ul{display:none;}

#mainnavigation li:hover ul {display:block;
width:10em;
position:absolute;
}
/*End main navigation.*/

/*This is the main navigation link color information.*/
/*#mainnavigation a:link {color:#FC0;}*/
#mainnavigation a:link {color:#F7F4EF;}

#mainnavigation a:visited {color:#9D6D4D;}

#mainnavigation a:hover {color:#FC0;}

#mainnavigation a:active {color:#FC0;}
/*End link color list.*/

/*This is the content section for each page.*/
#content { 
	float:left;
clear:left;
width: 100%;
margin:15px 0 35px 0;
padding:0 2.5%;
/*background-color:#FDCB74;*/
background-color:#B4A98F;
}

#content h2 {
	text-align:left;
	padding-bottom: 10px;
}
/*End content styles.*/

.webSection {
	float: left;
	padding: 2%;
	width: 45%;
}

.webSection img {
	padding: 2% 0;
	width: 100%;
}

.motionGraphics {
	float: left;
	clear: both;
	padding: 2%;
	width: 45%;
}

.content_left {
	float:left;
clear:left;
width:100%;
margin:15px 0 55px 0;
padding:0 2.5%;
/*background-color:#FDCB74;*/
background-color:#B4A98F;
	
}

.body_copy ul {
	padding: 10px 0 10px 3%;
}

.body_copy li {
	list-style: url(../graphics/bulletredsphere.png)
}

.body_copy h3 {
    font-family: Tahoma, Geneva, sans-serif;
    font-size: 1em;
    color: #333;
    text-align: left;
    clear: none;
	padding: 10px 0 10px 0;
}

video {
	padding-left: 1%;
	width: 400px; 
	height: 225px;
/*	width: 90%;*/
}

.title {
	padding: 15px 0;
}

.content_left h2 {
		text-align:left;
	padding-bottom: 10px;
}

.content_left h3 {
		text-align:left;
	padding-bottom: 10px;
}

.content_left p {
	font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
	font-size:1em;
	color:#003;
	padding: 2%;
	width: 85%;
}

.illustration_square {
	float:left;
	width: 30%;
	padding: 1%;
}

.section_size {
	width: 100%;
}

.body_copy {
	width: 80%;
}

/*Current Work*/
.current_work {
	float:left;
	padding: 2%;
	margin: 17px 0 20px 0;
	width: 44%;
}

.current_work h2 {
	text-align:left;
	padding-bottom: 10px;
}

.current_work p {
	margin-top: 10px;
}

/*This is the small to large hover code*/

.largeAppimageHide {
	display:  none;
}

.graphic_left {
	float: left;
	width: 36%;
}

.graphic_left {
position:relative;
}
    
.graphic_left span {
position: absolute;
top : -9999px;
}

.graphic_left span img {
margin-bottom:5px;
}
    
section.graphic_left:hover {
z-index: 999;
cursor:pointer;
} 
   
section.graphic_left:hover span { 
top: 110px;
left: 0px;
z-index: 999;
width:275%;
height:650px;
padding: 10%;
background:#eae9d4;
-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
box-shadow: 0 0 20px rgba(0,0,0, .75);
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius:8px;
font-family: 'Droid Sans', sans-serif;
font-size:12px;
line-height:18px;
text-align: center;
color: #495a62;
padding-bottom:20px;
}

.largeImageHide {
	display:  none;
}



/*End the small to large hover code*/

/*.enlarge {
position:relative;
clear: both;
}
    
.enlarge span {
position: absolute;
left: -9999px;
}

.enlarge span img {
margin-bottom:5px;
}
    
div.enlarge:hover {
z-index: 900;
cursor:pointer;
} 
   
div.enlarge:hover span { 
top: 110px;
left: 0px;
z-index: 900;
width:75%;
height:400px;
padding: 10%;
background:#eae9d4;
-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75));
-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
box-shadow: 0 0 20px rgba(0,0,0, .75);
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius:8px;
font-family: 'Droid Sans', sans-serif;
font-size:12px;
line-height:18px;
text-align: center;
color: #495a62;
padding-bottom:20px;
}*/

.graphic_right {
	float: left;
	padding-left: 27%;
	width: 36%;
}

.graphic_right {
position:relative;
}
    
.graphic_right span {
position: absolute;
top : -9999px;
}

.graphic_right span img {
margin-bottom:5px;
}
    
section.graphic_right:hover {
/*z-index: 999;*/
z-index: 999;
cursor:pointer;
} 
   
section.graphic_right:hover span { 
top: 110px;
left: 20%;
z-index: 999;
width:200%;
height:1025px;
padding: 10%;
background:#eae9d4;
-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
box-shadow: 0 0 20px rgba(0,0,0, .75);
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius:8px;
font-family: 'Droid Sans', sans-serif;
font-size:12px;
line-height:18px;
text-align: center;
color: #495a62;
padding-bottom:20px;
}

/*This is the Dersnail Poster Info*/

.deersnail_poster_contain {
    float: left;
	/*border-top: #333333 solid thin;*/
    /*padding-left: 1.5%;
    padding-top: 47px;*/
	padding: 48px 1.5% 57px 8%;
    width: 25%;
}

.deersnail_poster {
	float: left;
	padding-left: 3%;
	width: 100%;
}

.deersnail_poster {
position:relative;
}
    
.deersnail_poster span {
position: absolute;
top : -9999px;
}

.deersnail_poster span img {
margin-bottom:5px;
}
    
section.deersnail_poster:hover {
/*z-index: 999;*/
z-index: 999;
cursor:pointer;
} 
   
section.deersnail_poster:hover span { 
top: 110px;
left: 20%;
z-index: 999;
width:200%;
height:800px;
padding: 10%;
background:#eae9d4;
-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
box-shadow: 0 0 20px rgba(0,0,0, .75);
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius:8px;
font-family: 'Droid Sans', sans-serif;
font-size:12px;
line-height:18px;
text-align: center;
color: #495a62;
padding-bottom:20px;
}

.deersnail_poster_top {
	position:absolute;
	width: 70%;
}

.deersnail_poster_bottom {
	position:relative;
	width: 100%;
}

.pad_gap_deersnail {
	padding: 300px 0 25px;
    width: 70%;
}

/*End Deersnail*/

/*Graphic For Ethical*/

.graphic_ethical_contain {
/*	float: left;
    padding-left: 7%;
    padding-top: 47px;
    width: 25%;*/
		border-top: #333333 solid thin;
    float: left;
	padding: 47px 1.5% 57px 1.5%;
    width: 25%;
}

.graphic_ethical {
	float: left;
	padding-left: 5%;
	width: 100%;
}

.graphic_ethical {
position:relative;
}
    
.graphic_ethical span {
position: absolute;
top : -9999px;
}

.graphic_ethical span img {
margin-bottom:5px;
}
    
section.graphic_ethical:hover {
/*z-index: 999;*/
z-index: 999;
cursor:pointer;
} 
   
section.graphic_ethical:hover span { 
top: 110px;
left: 20%;
z-index: 999;
width:200%;
height:425px;
padding: 10%;
background:#eae9d4;
-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
box-shadow: 0 0 20px rgba(0,0,0, .75);
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius:8px;
font-family: 'Droid Sans', sans-serif;
font-size:12px;
line-height:18px;
text-align: center;
color: #495a62;
padding-bottom:20px;
}

.ethical_top {
	position:absolute;
	width: 67%;
}

.ethical_bottom {
	position:relative;
	width: 100%;
}
.pad_gap_ethical {
	 padding: 210px 0 25px;
    width: 90%;
}

/*.pad_gap {
	padding: 30px 0 25px 0;
}*/

/*End Graphic Ethical*/

/*Begin Infographic Info*/

.infographic_contain {
	clear: both;
    float: left;
	border-top: #333333 solid thin;
    /*padding-left: 1.5%;
    padding-top: 47px;*/
	padding: 47px 1.5% 57px 1.5%;
    width: 25%;
}

.infographic {
	float: left;
	padding-left: 3%;
	width: 100%;
}

.infographic {
position:relative;
}
    
.infographic span {
position: absolute;
top : -9999px;
}

.infographic span img {
margin-bottom:5px;
}
    
section.infographic:hover {
/*z-index: 999;*/
z-index: 999;
cursor:pointer;
} 
   
section.infographic:hover span { 
top: 110px;
left: 20%;
z-index: 999;
width:290%;
height:800px;
padding: 10%;
background:#eae9d4;
-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
box-shadow: 0 0 20px rgba(0,0,0, .75);
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius:8px;
font-family: 'Droid Sans', sans-serif;
font-size:12px;
line-height:18px;
text-align: center;
color: #495a62;
padding-bottom:20px;
}

.infographic_top {
	position:absolute;
	width: 70%;
}

.infographic_bottom {
	position:relative;
	width: 100%;
}

.pad_gap_info {
	padding: 210px 0 25px 0;
	width: 100%;
}

/*End Infographic Info*/

/*Begin Chez Info*/
.chez_contain {
	/*clear: both;*/
	border-top: #333333 solid thin;
    float: left;
	padding: 47px 1.5% 57px 1.5%;
    width: 25%;
}

.chez_logo {
	float: left;
	padding-left: 3%;
	width: 100%;
}

.chez_logo {
position:relative;
}
    
.chez_logo span {
position: absolute;
top : -9999px;
}

.chez_logo span img {
margin-bottom:5px;
}
    
section.chez_logo:hover {
/*z-index: 999;*/
z-index: 999;
cursor:pointer;
} 
   
section.chez_logo:hover span { 
top: 110px;
left: 20%;
z-index: 999;
width:150%;
height:250px;
padding: 10%;
background:#eae9d4;
-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
box-shadow: 0 0 20px rgba(0,0,0, .75);
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius:8px;
font-family: 'Droid Sans', sans-serif;
font-size:12px;
line-height:18px;
text-align: center;
color: #495a62;
padding-bottom:20px;
}

.chez_logo_top {
	position:absolute;
	width: 70%;
}

.chez_logo_bottom {
	position:relative;
	width: 100%;
}

.pad_gap_chez {
	padding: 210px 0 25px 0;
	width: 85%;
}

/*End Chez Info*/

.story_board {
	float: left;
	border-top: #333333 solid thin;
	width: 85%;
}

.story_board_one_contain {
	    float: left;
	padding: 15px 2% 10px 1.5%;
    width: 35%;
}

.story_board_pic {
	position:absolute;
	padding: 15px 0 10px 0;
	float: left;
	width: 100%;
}

.story_board_bottom {
	position:relative;
	width: 100%;
	
}

.story_board_one {
position:relative;
}
    
.story_board_one span {
position: absolute;
top : -9999px;
}

section.story_board_one:hover {
/*z-index: 999;*/
z-index: 999;
cursor:pointer;
}

section.story_board_one:hover span { 
top: 110px;
left: 20%;
z-index: 999;
width:250%;
height:550px;
padding: 10%;
background:#eae9d4;
-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
box-shadow: 0 0 20px rgba(0,0,0, .75);
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius:8px;
font-family: 'Droid Sans', sans-serif;
font-size:12px;
line-height:18px;
text-align: center;
color: #495a62;
padding-bottom:20px;
} 

.story_board h2 {
	text-align: left;
	padding: 25px  0 10px 1%;
}

.story_board_two_contain {
	    float: left;
	padding: 15px 2% 10px 0;
    width: 35%;
}


.story_board_pic_right {
	position:absolute;
	padding: 15px 0 10px 0;
	float: left;
	width: 100%;
}

.story_board_two {
position:relative;
}
    
.story_board_two span {
position: absolute;
top : -9999px;
}

section.story_board_two:hover {
/*z-index: 999;*/
z-index: 999;
cursor:pointer;
}

section.story_board_two:hover span { 
top: 110px;
left: 20%;
z-index: 999;
width:250%;
height:550px;
padding: 10%;
background:#eae9d4;
-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
box-shadow: 0 0 20px rgba(0,0,0, .75);
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius:8px;
font-family: 'Droid Sans', sans-serif;
font-size:12px;
line-height:18px;
text-align: center;
color: #495a62;
padding-bottom:20px;
}

.story_board_three_contain {
	    float: left;
	padding: 15px 0 10px 0;
    width: 17.5%;
	height: 230px;
}

.story_board_pic_single {
	position:absolute;
	padding: 15px 0 10px 0;
	float: left;
	width: 100%;
}

.story_board_three {
position:relative;
}
    
.story_board_three span {
position: absolute;
top : -9999px;
}

section.story_board_three:hover {
/*z-index: 999;*/
z-index: 999;
cursor:pointer;
}

section.story_board_three:hover span { 
top: 110px;
left: 20%;
z-index: 999;
width:250%;
height:550px;
padding: 10%;
background:#eae9d4;
-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75);
-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
box-shadow: 0 0 20px rgba(0,0,0, .75);
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius:8px;
font-family: 'Droid Sans', sans-serif;
font-size:12px;
line-height:18px;
text-align: center;
color: #495a62;
padding-bottom:20px;
}


.story_board_text {
	float: left;
	width: 50%;
	padding: 20px 0 25px 1.5%;
}

.top_bottom_space {
	padding: 10px 0 20px 0;
}

.pic_sizesml_top { 
	position:absolute;
	width: 8.25%;
}

.pic_sizesml {
	position:relative;
	width: 100%;
}

/*This is for my eBook add on the home page.*/
#ebook { float:right;
width:400px;
margin:15px 10px 10px 25px;
padding:7px;
padding-bottom:22px;
background-color:#B4A98F;
}

#ebook img { padding-right:5px;
/*width:200px;*/
}

#ebook a:link{ color:#600;
text-decoration:none;
}

#ebook a:hover{ color:#600;
text-decoration:none;
}

#ebook a:visited{ color:#600;
text-decoration:none;
}
/*End eBook add styles.*/

/*This is for the content in the rght hand box.*/
#contentright { 
float:left;
width: 40%;
padding: 2%;
/*margin:15px 0 20px 0;*/
background-color:#B4A98F;
}

#contentright h2 {
	text-align:left;
	padding-bottom: 10px;
}

#contentright img {
	width:  100%;
	padding: 2% 0;
}

/*This is the information for the table in the right content box on the home page.*/
#contentright table { margin:5px auto;
}

.celltext { padding:5px;
}

.celltext p { font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
font-size:12px;
text-align:left;
color:#333;
padding:5px;
/*margin-bottom:30px;*/
}

.celltext h2{ padding-left:5px;
}

.cellimg { padding:5px;
}

.celltext1 p { font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
font-size:12px;
text-align:left;
color:#333;
padding:5px;
margin-bottom:15px;
}
/*End table information.*/

/*This is the endnote info.*/
#endnote { clear:both;
/*margin:5px 25px 10px 35px;*/
/*padding-top: 20px;
padding-bottom:20px;*/
padding: 20px 0 20px 25.5%;
text-align:left;
background-color: #333333;
}

#endnote p {
	color:#FFFFFF;
}