/*

Maxim one page bootstrap template
@2013 by iWebStudio

/*
===========================
CONTENTS:

01 General
02 Typography
03 Non-semantic
04 Navbar
05 Page sections
06 Footer
07 Icons
08 Buttons
09 Media queries 
===========================
*/
/* Import css */
/* Google font */
@import url('http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700'); 
@import url('http://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700,700italic,400italic,300italic');

/* bootstrap */
@import url('bootstrap.css');
/* bootstrap responsive */
@import url('bootstrap-responsive.css');
/* prettyPhoto */
/* @import url('prettyPhoto.css'); */
/* flexslider */
/* @import url('flexslider.css'); */

/* font awesome */
@import url('font-awesome.css');
/* overwrite */
@import url('overwrite.css');
/* animation */
@import url('animate.css');

/* =========================================================
01. General
============================================================ */
#upgrade-IE {
	position:fixed;
	top:70px;
	left:50%;
	margin-left:-300px;
	width:600px;
	border:2px solid #444;
	background-color:#FFF;
	color:#333;
	font-weight:bold;
	padding:50px;
}
#upgrade-IE h1 {
	margin:20px 0px;
	color: #999;
}
#upgrade-IE img {
	width:50px;
	height:53px;

}
a.skipnav, 
a:visited.skipnav,
a:hover.skipnav,
#chart-data {
	position: absolute;
	clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
	clip: rect(1px, 1px, 1px, 1px);
	overflow:hidden;
	width:1px;
	height:1px;
}

a:active.skipnav, 
a:focus.skipnav,
#chart-data:focus {
	position:static !important;
	width:auto;
	height:auto;
	outline: thin dotted black;
}

.container h4 {
	position: absolute;
	left:0px;
	top:0px;
}
.brown {
	color:#666;
}
.liteblue {
	color:#71CBD2;
}
.blue {
	color:#4A7DBA;
}
.darkblue {
	color:#003366;
}
.green {
	color:#BBDC00;
}
.red {
	color:#E07900;
}

div, article, section, header, footer, nav, li {
	position:relative;
}
.group:after {
	display:block;
	height:0;
	clear:both;
	content:".";
	visibility:hidden; /* For clearing */
}
body {
	background:#fff;
	color: #444;
	font-size: 16px;
	font-weight:300;
	font-family:'Roboto Condensed', Arial, sans-serif;
}

body {
    padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
}
.showgrid {
	background-position: center top;
	background-repeat: repeat-y;
}

/*
::-moz-selection {
	color:#333;
}
::selection {
	color:#333;
}
*/

/* scroll to top */
.scrollup{
    position:fixed;
	width:50px;
	height:50px;
    bottom:20px;
    right:20px;
    z-index:5555;
}
a, a:focus {
	outline:none;
	border:none;
	-moz-outline-style: none;
}
:-moz-any-link:focus {
  outline: none;
}
a.scrollup {
	outline:0;
	text-decoration:none;
	background: transparent url(../img/campaign/scrollUP.png) no-repeat center center;
}
a.scrollup:hover,
a.scrollup:focus {
	text-decoration: none;
}

/*
a.scrollup:hover,a.scrollup:active,a.scrollup:focus {
	opacity:1;
	text-decoration:none;
	-webkit-transition: all 400ms ease-out 0s;	
	   -moz-transition: all 400ms ease-out 0s;
		 -o-transition: all 400ms ease-out 0s;
		    transition: all 400ms ease-out 0s;
}
*/

.blankdivider10 {
	height: 10px;
	display: block;
}

.blankdivider20 {
	height: 20px;
	display: block;
}
.blankdivider30 {
	height: 30px;
	display: block;
}

.row {
	margin-bottom:30px;
}

.row .row{
	margin-bottom:30px;
}

.row.nomargin {
	margin-bottom:0;
}


/*---------- forms ----------*/

input[type=text], input[type=submit], textarea {
	width: 100%;
	padding: 0.5em;
	font-size: 1em;
	margin-bottom: 1.5em;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
input, button, select, textarea {
	font-family:'Roboto Condensed', Arial, sans-serif;
}
/* =========================================================
02. Typography
============================================================ */

p {
	line-height: 1.6em;
	margin: 0 0 10px 0;
}

blockquote {
	font-size:18px;
	border:none;
	padding:0;
}


ul, ol {
	font-size: 1em; /* 16px */
	line-height: 1.5; /* 24px */
	margin: 0 0 1.5em 0;
}
body, input, textarea {
}

a {
  color: #454545;
  text-decoration: none;
}

a:hover, a:active, a:focus {
	text-decoration: underline;
}
h1, h2, h3, h4, h5, h6 {
	font-weight: 400;
	color: #312f2b;
	line-height:1.1em;
	font-family:'Roboto Condensed', Arial, sans-serif;
}
h1 {
	color: #FFC630;
	font-size: 46px;
	line-height: 1.1em;
	margin: 40px 0;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight:700;
}
h2 {
	color: #FFC630;
	font-size: 46px;
	line-height: 1.1em;
	margin: 40px 0;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight:700;
}
h3 {
	color: #FFC630;
	font-size: 32px;
	line-height: 1.1em;
	margin: 30px 0;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight:700;
}
h4 {
	font-size: 22px;
	margin-bottom:20px;
}
h5 {
	font-size: 18px;
	margin-bottom:15px;
}
h6 {
	font-size: 16px;
	margin-bottom:10px;
}
strong {
	font-weight:700;
	font-family: 'Roboto Condensed', sans-serif;
}
small {
	font-size: 0.75em; /* 12px */
	line-height: 2; /* 24px */
	margin-top: 2em;
	margin-bottom: 0em;
}
em {
	font-style:italic;
/* 	font-family: 'Roboto Condensed'; */
}
.muted {
	color: #A5A5A2;
}
.impressed {
	text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.5), /* shadow */  1px 1px 0 rgba(255, 255, 255, 0.9); /* highlight */
}

h2.pagetitle {
	color:#fff;
	font-size:46px;
}

/* =========================================================
03. Misc
============================================================ */

.hide-text {
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	font-size: 1em;
}
.alignright {
	text-align: right;
}
.alignleft {
	text-align: left;
}
.aligncenter {
	text-align: center;
}
.medium {
	font-weight: normal;
}

/* =========================================================
04. Navigation
============================================================ */

.navbar-fixed-top .container {
/* Uncomment to make nav expand full width */
 /*	width: auto; */
}
#navigation-row {
	position: fixed;
	top:0px;
	z-index:999;
	width:100%;
	background-color: #4A7DBA;
	height:60px;
}
#navigation-row .row {
	margin-bottom:0;
}
.navbar {
	margin-bottom:0;
}
.navbar .brand {
	margin-left:0;
	padding: 0;
	margin-top: 1.05em;
}
.navbar .brand a {
	padding: 0;
	color: #fff;
	font-size: 1.75em;
	margin-left: 0;
	font-weight: 400;
	text-transform:uppercase;
}
.navbar .brand a:hover {
	text-decoration: none;
	transition: color .15s linear;
	-webkit-transition: color .15s linear;
	-moz-transition: color .15s linear;
}
.navbar .brand a:focus {
	outline: none;
}
.navbar-inner {
	padding:0;
	border:none;
	border-radius:0;
}
.navbar-inverse .navbar-inner {
	background-repeat: repeat;
	background-color: transparent;
	background-image:none;
	-ms-filter: none;
	filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.logo-wrap {
	padding-top:20px;
}
.berkeley-type {
	position: relative;
    top: 2px;
    
}
.navbar-wrapper {
	overflow:hidden;
}
#menu-main {
	/* margin-top: 1.125em; */
	margin-top:7px;
}
#menu-main li.active {
	
}

.navbar-inverse .nav .active > a, 
.navbar-inverse .nav .active > a:hover, 
.navbar-inverse .nav .active > a:focus {
	background-color: transparent;
	box-shadow: none;
}


.navbar .nav {
	float:right;
}
ul#menu-main > li > a {
	font-weight: 600;
	color: #fff;
	font-size:16px;
}

ul#menu-main > li > a:hover {
	padding: 9px 15px;

}
ul#menu-main > li > a:focus {
	outline:0;
}
/* keep active highlight with scrollspy */
ul#menu-main > li.active > a {
	color: #FFC630;
}
.navbar-inverse .brand, .navbar-inverse .nav > li > a {
	text-shadow: none;
}
ul#menu-main .first {
	margin-right:75px;
}

.logo-wrap > a {
	float:left;
	margin-right:30px;
}

#navigation-row ul.social-icons {
	list-style:none;
	margin:0;
	display:inline;
}
#navigation-row ul.social-icons li {
	display:inline;
	float:left;
}

#navigation-row .social-icons a {
	display:block;
	width:20px;
	height:20px;
	margin:0px 5px;
}
#navigation-row .social-icons .facebook {
	background: transparent url(../img/social_icons/facebook-20x20.gif) no-repeat center center;
}
#navigation-row .social-icons .twitter {
	background: transparent url(../img/social_icons/twitter-20x20.gif) no-repeat center center;	
}
#navigation-row .social-icons .google-plus {
	width:21px;
	background: transparent url(../img/social_icons/google-plus-21x20.gif) no-repeat center center;
}
#navigation-row .social-icons .email {
	background: transparent url(../img/social_icons/email-20x20.gif) no-repeat center center;
}







/* =========================================================
05. Page sections
============================================================ */

/* === section header === */

#header-wrapper {
	width: 100%;
	min-height: 610px;
/*
	margin-top: -60px;
	padding-top:160px;
*/
	text-align:center;
}
span.dt {
	display:block;
}

#header-wrapper h1 {
	color: #FFC630;
	font-size: 58px;
	font-weight: 400;
	line-height: 1.3em;
	margin: 1em 0;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight:700;
	text-shadow:2px 2px 1px rgba(0,0,0,0.4);
}
#header-wrapper h2 {
	color: #fff;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 2em;
	font-weight: normal;
	margin: 0.5em 0;
	text-shadow: 1px 1px 1px #333333;
}

/* --- Header slider --- */
#header-wrapper {
	/* background: #444 url(../img/campaign/B9786_campgnclose_bkgnd_r1_c1.jpg) no-repeat center center fixed; */
	background: #444 url(../img/campaign/section1_bak.jpg) no-repeat center bottom;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	/* background: no-repeat center center fixed\0/; */ /* IE8 HACK */
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://campaign.berkeley.edu/img/campaign/section1_bak.jpg',sizingMethod='scale');
	 -ms-filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://campaign.berkeley.edu/img/campaign/section1_bak.jpg',sizingMethod='scale')"; 
}


#scrolldown a {
	font-size:16px;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: 700;
	color:white;
	display:block;
	text-align:center;
	line-height:0px;
}
.proceed div {
	position: relative;
}
.proceed div a {
	position: absolute;
	display:block;
	width:140px;
	height:55px;
	bottom:-20px;
	left:50%;
	margin-left:-70px;
	background: transparent url(../img/campaign/scroll_arrow_small.png) no-repeat center 25px;
	text-decoration: none;	
}
.proceed div a:hover {
	text-decoration: none;
}
.proceed4 div a {
	background: transparent url(../img/campaign/scroll_arrow_small_blue.png) no-repeat center 25px;
}

section .proceed,
#header-wrapper .proceed {
	width:69px;
	height:20px;
	position: absolute;
	bottom:-20px;
	left:50%;
	margin-left:-34px;
	z-index:50;
}


section.section {
	padding: 60px 0px 40px;
	height:570px;
}
section.section h4 {
	text-align: center;
	margin-bottom: 40px;
	font-size: 46px;
	font-weight: 700;
	letter-spacing: -1px;
}
section.inner {
	padding: 50px 0 50px;
}

#header-wrapper .proceed1 {
	background:transparent url(../img/campaign/section1_arrow.png) no-repeat center center;
}


/* Section The Crisis */

section#crisis {
	background: #6690C2 url(../img/campaign/section2_bak.jpg) no-repeat left bottom;
}
section#crisis {
	-webkit-background-size: auto 650px; 
	-moz-background-size: auto 650px;
	-o-background-size: auto 650px;
	background-size: auto 650px;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://campaign.berkeley.edu/img/campaign/section2_bak.jpg',sizingMethod='image');
	-ms-filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://campaign.berkeley.edu/img/campaign/section2_bak.jpg',sizingMethod='scale')"; 
}
section#crisis h1 {
	padding-left:32px;
	font-size:50px;
	margin: 20px 0;
}
section#crisis h2 {

}
section#crisis #fund-percent {
	position: absolute;
	font-size:30px;
	color:white;
	z-index:500;
	font-weight: 700;
	display:none;
	text-shadow: 1px 1px 1px black
}
section .proceed2 {
	background:transparent url(../img/campaign/section2_arrow.png) no-repeat center center;
}
#pie-animation,
.pie-overlay1,
.pie-overlay2 {
	width:306px;	
	height:375px;
}
.pie-overlay1,
.pie-overlay2 {
	position: absolute;
	top:0;
	left:0;
}
#pie-animation {
	position: relative;
	margin:0 auto;

}
.pie-overlay1 {
/*
	background: transparent url(../img/campaign/pie1.png) no-repeat center center;
*/
}
.pie-overlay2 {
	visibility:hidden; 	/* use this for accessibility rather than display none */
	opacity:0;  		/* use this for accessibility rather than display none */
/* 	background: transparent url(../img/campaign/pie2.png) no-repeat center center; */
	z-index: 10;
}

/* Section The Response */
section#response {
	background-color:#BBe5E8;

}
section#response h1 {
	text-align: center;
	font-size:54px;
}
section#response .record-numbers {
	position: relative;
	top:140px;
	font-size:50px;
	font-family: 'Roboto Condensed',sans-serif;
    font-weight: 700;
    line-height: 1.1em;
}
section .proceed3 {
	background:transparent url(../img/campaign/section3_arrow.png) no-repeat center center;
}
/* Section The Victory */
section .proceed4 {
	background:transparent url(../img/campaign/section4_arrow.png) no-repeat center center;
}
section#victory h1 {
	margin-top:100px;
	margin-bottom:10px;
	font-size:54px;
}
section#victory .benefits {
	margin-top:0px;
	color:#E07900;
	font-weight: 300;
	font-size: 38px;
	margin-bottom: 18px;
	font-family: 'Roboto Condensed',sans-serif;
    line-height: 1.1em;
}
section#victory .guide-text {
	line-height: 20px;
}

/* Section Stories */
section#stories {
	padding:0;
	height:800px;/* allow for height of storypages plus padding and bottom arrow */
	overflow:hidden;	
}
section#stories h1 {
    font-size:45px;
    margin-top:60px;
    line-height: 1.1em;
    text-shadow: 1px 1px 0px black;
}
#slidebox {
	position: relative;
	width:12000px; /* allow for 4 screens at full width display 3000 x 4 = 12000 */
}
#story-menu {
	background:	#444444	url(../img/campaign/section5_bak.jpg) no-repeat scroll center bottom;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://campaign.berkeley.edu/img/campaign/section5_bak.jpg',sizingMethod='scale');
	 -ms-filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://campaign.berkeley.edu/img/campaign/section5_bak.jpg',sizingMethod='scale')";
}
section#stories #story-menu h1 {
	text-align: center;
	margin-top:72px;
	font-size: 58px;
}
#story-menu .storylinks {
	margin-top:100px;
}
a.next-students {
	margin-top:150px;
}
.storypage {
	float:left;
	/* height:590px; */
	height:635px;
	padding: 60px 0 80px;
	box-shadow: 0px 0px 0px black;
	box-shadow: none;
	text-shadow: none;
	outline:none;
	border:none;
}
#slidebox,
section.section,
.storypage .container {
	box-shadow: 0px 0px 0px black;
	box-shadow: none;
	text-shadow: none;
	outline:none;
	border:none;
	
}
.storypage p {
	color:white;
	font-size:18px;
}
.storypage .arr {
  	margin: 0 auto;
    width: 105px;
}
.arr .story-left {
	float:left;
}
.arr .story-right {
	float:right;
}
section .proceed5 {
	background:transparent url(../img/campaign/section5_arrow.png) no-repeat center center;
}
section .proceed-students {
	background:transparent url(../img/campaign/section5_students_arrow.png) no-repeat center center;
}
section .proceed-faculty {
	background:transparent url(../img/campaign/section5_faculty_arrow.png) no-repeat center center;
}
section .proceed-research {
	background:transparent url(../img/campaign/section5_research_arrow.png) no-repeat center center;
}
.storylinks {
	width:970px;
	margin:0 auto;
}
.storylinks ul {
	text-align:center;
}
.storylinks ul,
.storylinks ul li {
	list-style: none;
	list-style-type: none;
}
.storylinks ul li {
	display:inline;
	margin:0 55px;
}
.storylinks ul li a {
	display:inline-block;
	width:183px;
	height:183px;
	line-height:185px;
	font-family:'Roboto Condensed', Arial, sans-serif;
	font-weight:700;
	font-size:24px;
	color:white;
}
.storylinks ul li a:hover,
.storylinks ul li a:focus {
	text-decoration: none;
}
a.students-btn {
	background: transparent url(../img/campaign/students_button_all.png) no-repeat center top;
}
a.faculty-btn {
	background: transparent url(../img/campaign/faculty_button_all.png) no-repeat center top;	
}
a.research-btn {
	background: transparent url(../img/campaign/research_button_all.png) no-repeat center top;
}
a.students-btn:hover, a.students-btn:focus,
a.faculty-btn:hover, a.faculty-btn:focus,
a.research-btn:hover, a.research-btn:focus {
	background-position: center bottom ;
}
.story-button {
	text-align: center;
	margin-top:40px;
}
.stories-home {
	cursor: pointer;	
}
#students-menu {
	background:	#444444	url(../img/campaign/students_bckgnd.jpg) no-repeat scroll center bottom;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://campaign.berkeley.edu/img/campaign/students_bckgnd.jpg',sizingMethod='scale');
	 -ms-filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://campaign.berkeley.edu/img/campaign/students_bckgnd.jpg',sizingMethod='scale')";
}
#faculty-menu {
	background:	#444444	url(../img/campaign/faculty_bckgnd.jpg) no-repeat scroll center top;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://campaign.berkeley.edu/img/campaign/faculty_bckgnd.jpg',sizingMethod='scale');
	 -ms-filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://campaign.berkeley.edu/img/campaign/faculty_bckgnd.jpg',sizingMethod='scale')";
}
#research-menu {
	background:	#444444	url(../img/campaign/research_bckgnd.jpg) no-repeat scroll center top;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://campaign.berkeley.edu/img/campaign/research_bckgnd.jpg',sizingMethod='scale');
	 -ms-filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://campaign.berkeley.edu/img/campaign/research_bckgnd.jpg',sizingMethod='scale')";
}

.student-links div img,
.faculty-links div img,
.research-links div img  {
	margin:56px 0px 0px auto;
}
.student-links h1,
.faculty-links h1,
.research-links h1 {
	margin-bottom:0px;
}

.story-left a,
.story-right a {
	display:block;
	width:12px;
	height:26px;
	padding:20px;
}
.story-left a:hover,
.story-left a:visited,
.story-left a:focus,
.story-right a:hover,
.story-right a:visited,
.story-right a:focus {
	text-decoration: none;
}
.story-left {
	width:52px;
	float:left;
}
.story-right {
	width:52px;
	float:right;
}
.story-left a {
	margin-right:auto;
	background:	transparent	url(../img/campaign/scroll_arrow_small_left.png) no-repeat scroll center center;
}
.story-right a {
	margin-left:auto;
	background:	transparent	url(../img/campaign/scroll_arrow_small_right.png) no-repeat scroll center center;
}
.story-content {
	margin-bottom: 20px;
}

/*  ==============================================  */
/*  =========   STORY LISTING STYLES =============  */


#story-nav {
	
}
ul.story-nav {
	width:750px;
	margin:0 auto;
}
.story-nav,
.story-nav li {
	list-style: none;
	list-style-type: none;
	/* reset */
	margin:0;
	padding:0;
}

.story-nav li {
	float:left;
	margin:0px 5px;
}
.story-nav li a {
	display:block;
	width:166px;
	height:47px;
	color:white;
	line-height: 35px;
	font-size: 16px;
	font-weight:700;
	font-family:'Roboto Condensed', Arial, sans-serif;
}
.story-nav li a:hover,
.story-nav li a:focus {
	text-decoration: none;
}
.students-tab a {
	background:transparent url(../img/campaign/stories_nav_students.gif) no-repeat center top;
}
.faculty-tab a {
	background:transparent url(../img/campaign/stories_nav_faculty.gif) no-repeat center top;	
}
.research-tab a {
	background:transparent url(../img/campaign/stories_nav_research.gif) no-repeat center top;
}
.videos-tab a {
	background:transparent url(../img/campaign/stories_nav_video.gif) no-repeat center top;
}

.students-tab a:hover,
.students-tab a:focus,
.students-tab a.hover,
.students-tab a.active,
.faculty-tab a:hover,
.faculty-tab a:focus,
.faculty-tab a.hover,
.faculty-tab a.active,
.research-tab a:hover,
.research-tab a:focus,
.research-tab a.hover,
.research-tab a.active,
.videos-tab a:hover,
.videos-tab a:focus,
.videos-tab a.hover,
.videos-tab a.active {
	background-position:center bottom;
}

.storyblock {
	margin-bottom:20px;	
}

a.bak-hilite {
	background-color: transparent;	
	text-decoration: none;
	display:block;
	padding:10px 85px 10px 20px;
	position: relative;
}



#videos .videos a.bak-hilite:hover, #videos .videos a.bak-hilite:focus,
#videos .research a.bak-hilite:hover, #videos .research a.bak-hilite:focus,
#videos .faculty a.bak-hilite:hover, #videos .faculty a.bak-hilite:focus,
#videos .students a.bak-hilite:hover, #videos .students a.bak-hilite:focus {
	color:#666666;	
	background: #C1CDD9 url(../img/campaign/stories_list_arrow_video.gif) no-repeat right center;
}
#research .videos a.bak-hilite:hover, #research .videos a.bak-hilite:focus,
#research .research a.bak-hilite:hover, #research .research a.bak-hilite:focus,
#research .faculty a.bak-hilite:hover, #research .faculty a.bak-hilite:focus,
#research .students a.bak-hilite:hover, #research .students a.bak-hilite:focus {
	color:#666666;
	background: #BBE6E8 url(../img/campaign/stories_list_arrow_research.gif) no-repeat right center;
}
#faculty .videos a.bak-hilite:hover, #faculty .videos a.bak-hilite:focus,
#faculty .research a.bak-hilite:hover, #faculty .research a.bak-hilite:focus,
#faculty .faculty a.bak-hilite:hover, #faculty .faculty a.bak-hilite:focus,
#faculty .students a.bak-hilite:hover, #faculty .students a.bak-hilite:focus {
	color:#666666;
	background: #EEBE93 url(../img/campaign/stories_list_arrow_faculty.gif) no-repeat right center;
}
#students .videos a.bak-hilite:hover, #students .videos a.bak-hilite:focus,
#students .research a.bak-hilite:hover, #students .research a.bak-hilite:focus,
#students .faculty a.bak-hilite:hover, #students .faculty a.bak-hilite:focus,
#students .students a.bak-hilite:hover, #students .students a.bak-hilite:focus {
	color:#666666;
	background: #DEF187 url(../img/campaign/stories_list_arrow_students.gif) no-repeat right center;
}
#all .videos a.bak-hilite:hover, #all .videos a.bak-hilite:focus,
#all .research a.bak-hilite:hover, #all .research a.bak-hilite:focus,
#all .faculty a.bak-hilite:hover, #all .faculty a.bak-hilite:focus,
#all .students a.bak-hilite:hover, #all .students a.bak-hilite:focus {
	text-decoration: none;
	color:#666666;
	background: #CCCCCC url(../img/campaign/stories_list_arrow_all.gif) no-repeat right center;
}


.storythumb {
	float:left;
	margin:10px 20px 10px;
	z-index:5; /*  pull up for click. */
	cursor: pointer;
}
/*  TEMP REMOVE */
.storythumb > div {
	width:100px;
	height:100px;
	background-color:#666;
	border-radius:50%;
	text-align: center;
	line-height: 50px;
}

.storyteaser {
	display:block;
}

.storyteaser p {
	color: #000000;
    font-family: 'Open Sans',Arial,sans-serif;
    font-size: 15px;
    font-weight: 300;
}
.storyteaser h1 {
	margin:10px 5px 5px;
	font-family:'Roboto Condensed', Arial, sans-serif;
	font-weight: 700;
	font-size:22px;
	color:#666;
}

body.story-article {
	
}
body.story-article #navigation-row ul.social-icons {
	display:none; /* hide main social icons when on a story page */
}
body.story-article h1 {
	font-family:'Roboto Condensed', Arial, sans-serif;
	font-weight: 700;
	font-size:24px;
	color:#666;
	margin-bottom:50px;
}
body.story-article h2 {
	font-family:'Roboto Condensed', Arial, sans-serif;
	font-weight: 700;
	font-size:16px;
	color:#666;
	margin-bottom:10px;
}

body.story-article section.content {
	font-family:'Open Sans', Arial, sans-serif;
	font-weight: 300;
	font-size:15px;
	color:#000;
}
body.story-article section.content a {
	color:#4A7DBA;
	text-decoration: underline;
}
body.story-article section.content a:hover,
body.story-article section.content a:focus {
	color: #003366;
}
section.content blockquote {
	margin:20px 0px 50px 80px ;
	padding:20px;
	background-color: #CCC;
	position:relative;
}
blockquote cite:before,
blockquote cite:after {
	content: none !important;
}
section.content blockquote p {
	font-family: 'UCBerkeleyOSDemiItalic', Times, serif; /* CHANGE TO BERKELEY */
	font-size:28px;
	line-height: 34px;
	font-weight:normal;
	color:white;
}
section.content blockquote p.author {
	font-size:20px;
	margin-top:10px;
	line-height: 24px;
	margin-left:20px;
}
section.content #students blockquote {
	background-color: #BBDC00;
}
section.content #faculty blockquote {
	background-color: #E07900;	
}
section.content #research blockquote {
	background-color: #71CBD2;	
}
section.content #videos blockquote {
	background-color: #003366;	
}
section.content blockquote:after {
	height: 11px;
	bottom: -5px;
	width: 36px;
	right: 40px;
    position: absolute;
}
section.content #students blockquote:after {
	content: url(../img/campaign/stories_bquote_arrow_students.gif);
}
section.content #faculty blockquote:after {
	content: url(../img/campaign/stories_bquote_arrow_faculty.gif);
}
section.content #research blockquote:after {
	content: url(../img/campaign/stories_bquote_arrow_research.gif);
}
section.content #videos blockquote:after {
	content:  url(../img/campaign/stories_bquote_arrow_video.gif);
}
section.content #all blockquote:after {
	content:  url(../img/campaign/stories_bquote_arrow_all.gif);
}
section.content blockquote aside {
	position: absolute;
	top:0px;
	right:-30px;
	width:21px;
	text-align: center;
}
section.content blockquote aside a {
	display:block;
	margin:10px 0px;
	width:21px;
	height:20px;
	background-repeat: no-repeat;
	background-position: center center;
	text-decoration: none;
}
section.content blockquote aside a:hover,
section.content blockquote aside a:focus {
	text-decoration: none;
}
section.content blockquote aside a#social-facebook {
	margin-top:0px;
	background-image: url(../img/social_icons/facebook-content-20x20.png);
}
section.content blockquote aside a#social-twitter {
	background-image: 	url(../img/social_icons/twitter-content-20x20.png);
}
section.content blockquote aside a#social-google-plus {
	background-image: url(../img/social_icons/google-plus-content-21x20.png);
}
section.content blockquote aside a#social-email {
	background-image: url(../img/social_icons/email-content-20x20.png);
}


.storycontent {
	padding:0px 30px;
}
section.content article {
/*
	margin-bottom:20px;
*/
}
 
.prev-story-page {
    float: left;
    margin-left: 230px;
    font-size: 12px;
	font-weight:700;
	font-family:'Roboto Condensed', Arial, sans-serif;    
}
.prev-story-page a {
	text-decoration: none !important;
}
.next-story-page {
    float: right;
    margin-right: 230px;
    font-size: 12px;
	font-weight:700;
	font-family:'Roboto Condensed', Arial, sans-serif;
}
.next-story-page a {
	text-decoration: none !important;
}

.page-num {
    text-align: center;
    font-size: 12px;
	font-weight:700;
	font-family:'Roboto Condensed', Arial, sans-serif;
	width:100px;
	margin:0 auto;
}
#featured-image {
	display: none;
	position:absolute;
	z-index: 1500;
	min-width:500px;
	top:140px;
	left:50%;
	margin-left:-300px;
	background-color:white;
	box-shadow: 0px 5px 10px rgba(0,0,0,0.5);
	text-align: center;
}
.inner-feature {
	position: relative;
	padding:50px;
}
.inner-feature img.close-btn {
	position: absolute;
	top:-12px;
	right:-12px;
	z-index: 101;
}
/* Intro paragraphs on the stories page */
#intro-stories-head > div {
	display:none;
}
#intro-stories-head div .storythumb {
	position:static;
}
#intro-stories-head div .storythumb img {
	margin-left:20px;
	margin-top:0px;
	cursor:default;
}
#intro-stories-head div .storyteaser {
	margin-left:160px;
	padding-right: 85px;
	padding-bottom:45px;
	position:static;
}
#intro-stories-head div .storyteaser h1 {
	margin:0px 0px 20px 0px;
	padding-top:16px;
	font-size: 40px;
    line-height: 1.1em;
    text-shadow: 1px 1px 0 #000000;

}
#intro-stories-head .all-intro {
	
}
#intro-stories-head .all-intro .storyteaser  {
	margin-left:40px;

}
#intro-stories-head .all-intro .storyteaser h1 {
	color:#999;
	text-shadow:none;
}
#intro-stories-head .students-intro {
	
}
#intro-stories-head .students-intro .storyteaser h1 {
	color:#BBDC00;
	text-shadow:none;
}
#intro-stories-head .faculty-intro {
	
}
#intro-stories-head .faculty-intro .storyteaser  h1 {
	color:#E07900;
	text-shadow:none;	
}
#intro-stories-head .research-intro {
	
}
#intro-stories-head .research-intro  .storyteaser  h1 {
	color:#71CBD2;
	text-shadow:none;	
}
#intro-stories-head .videos-intro .storyteaser  {
	margin-left:40px;
}
#intro-stories-head .videos-intro {
	
}
#intro-stories-head .videos-intro  .storyteaser  h1 {
	color:#003366;
	text-shadow:none;	
}

#intro-stories-head hr {
	clear:both;
}




/*  =========  END STORY LISTING STYLES ==========  */
/*  ==============================================  */


/* Section Thanks to you... */

section#thanks-to-you {
	height:inherit;
}
.thanksgraphic {
	margin:50px 0px 30px;
}
section#thanks-to-you p {
	font-size:20px;
	font-family:'Roboto Condensed', Arial, sans-serif;
	font-weight:300;
}
#portraits {
	height: 387px;
	background: white url(../img/campaign/B9786_campgnclose_bkgnd_r6_c1.jpg) no-repeat center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://campaign.berkeley.edu/img/campaign/B9786_campgnclose_bkgnd_r6_c1.jpg',sizingMethod='scale');
	 -ms-filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://campaign.berkeley.edu/img/campaign/B9786_campgnclose_bkgnd_r6_c1.jpg',sizingMethod='scale')";
}




/* === Isotope CSS3 transitions === */

.isotope, .isotope .isotope-item {
	-webkit-transition-duration: 0.8s;
	-moz-transition-duration: 0.8s;
	-ms-transition-duration: 0.8s;
	-o-transition-duration: 0.8s;
	transition-duration: 0.8s;
}
.isotope {
	-webkit-transition-property: height, width;
	-moz-transition-property: height, width;
	-ms-transition-property: height, width;
	-o-transition-property: height, width;
	transition-property: height, width;
}
.isotope .isotope-item {
	-webkit-transition-property: -webkit-transform, opacity;
	-moz-transition-property: -moz-transform, opacity;
	-ms-transition-property: -ms-transform, opacity;
	-o-transition-property: -o-transform, opacity;
	transition-property: transform, opacity;
}
/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition {
	-webkit-transition-duration: 0s;
	-moz-transition-duration: 0s;
	-ms-transition-duration: 0s;
	-o-transition-duration: 0s;
	transition-duration: 0s;
}


/* === section services === */

section#services h2 {
	font-size: 22px;
	margin-bottom: 15px;
	margin-top: 10px;
	text-align:center;
}
section#services p {
	margin:10px;
}


section#services .service-box {
	text-align: center;
	padding: 20px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
section#services .span3:hover,
section#services .span3:focus {
	background:#e3e3e3;
}

section#services .service-box h2 {
	color: #f7f7f7;
	font-weight: 700;
}

section#services.section.orange .service-box:hover,
section#services.section.orange .service-box:focus {
	background:#f36518;
}

body.contact h2 {
	font-size:20px;
	color:#666;
}



/* =========================================================
06. Footer
============================================================ */

footer {
	background: #003168;
	text-align: center;
	color: white;
	padding:50px 0 50px;
	font-family: helvetica, arial, sans-serif;
	font-size:14px;
}
footer .ucbseal img {
	float:left;
	margin-right:10px;
}
footer .ucbseal p {
	margin-top:20px;
}
footer .follow-us a {
	display:block;
	width:20px;
	height:20px;
	margin:0px 5px;
}

footer .follow-us .facebook {
	background: transparent url(../img/social_icons/facebook-20x20_gold.png) no-repeat center center;	
}
footer .follow-us .twitter {
	background: transparent url(../img/social_icons/twitter-20x20_gold.png) no-repeat center center;
}
footer ul.follow-us {
	list-style:none;
}

footer ul.follow-us li {
	display:inline;
	float:left;
}


footer .contact-links a {
	color:#CD9A00;
	text-decoration: none;
	padding-right:10px;
	margin-right:10px;
	border-right: 2px solid #CD9A00;
}
footer .contact-links a.last-link {
	border:none;
	margin-right:0;
	padding-right:0;
}

footer .contact-links a:hover,
footer .contact-links a:focus {
	color:#FFC630;
	text-decoration: none;
}
/* GRADIENT GIVE BUTTON */
.give-btn {
	padding:10px 30px;
	border-radius: 10px;
	color:white;
	font-weight:700;
	line-height: 42px;
	background-color:#538CCF;/* fallback for gradient */
}
.give-btn:hover,
.give-btn:focus {
	color:white;
	text-decoration: none;
	background-color:#DE791B;
	background: -webkit-radial-gradient(#ffbf83, #DE791B); /* Safari 5.1 to 6.0 */
	background: -o-radial-gradient(#ffbf83, #DE791B); /* For Opera 11.6 to 12.0 */
	background: -moz-radial-gradient(#ffbf83, #DE791B); /* For Firefox 3.6 to 15 */
	background: radial-gradient(#ffbf83, #DE791B); /* Standard syntax */
}
.blue-radial{
	background: -webkit-radial-gradient( #5c9be5, #538CCF); /* Safari 5.1 to 6.0 */
	background: -o-radial-gradient(#5c9be5, #538CCF); /* For Opera 11.6 to 12.0 */
	background: -moz-radial-gradient(#5c9be5, #538CCF); /* For Firefox 3.6 to 15 */
	background: radial-gradient(#5c9be5, #538CCF); /* Standard syntax */
}
.green-radial {
	background: -webkit-radial-gradient(#BBDC00, #e6fa77); /* Safari 5.1 to 6.0 */
	background: -o-radial-gradient(#BBDC00, #e6fa77); /* For Opera 11.6 to 12.0 */
	background: -moz-radial-gradient(#BBDC00, #e6fa77); /* For Firefox 3.6 to 15 */
	background: radial-gradient(#BBDC00, #e6fa77); /* Standard syntax */
}
.green-radial:hover,
.green-radial:focus {
	background: -webkit-radial-gradient(#BBDC00, #e6fa77); /* Safari 5.1 to 6.0 */
	background: -o-radial-gradient(#BBDC00, #e6fa77); /* For Opera 11.6 to 12.0 */
	background: -moz-radial-gradient(#BBDC00, #e6fa77); /* For Firefox 3.6 to 15 */
	background: radial-gradient(#BBDC00, #e6fa77); /* Standard syntax */
}

.orange-radial{
	background: -webkit-radial-gradient( #E07900, #ffc37d); /* Safari 5.1 to 6.0 */
	background: -o-radial-gradient(#E07900, #ffc37d); /* For Opera 11.6 to 12.0 */
	background: -moz-radial-gradient(#E07900, #ffc37d); /* For Firefox 3.6 to 15 */
	background: radial-gradient(#E07900, #ffc37d); /* Standard syntax */
}
.orange-radial:hover,
.orange-radial:focus {
	background: -webkit-radial-gradient( #E07900, #ffc37d); /* Safari 5.1 to 6.0 */
	background: -o-radial-gradient(#E07900, #ffc37d); /* For Opera 11.6 to 12.0 */
	background: -moz-radial-gradient(#E07900, #ffc37d); /* For Firefox 3.6 to 15 */
	background: radial-gradient(#E07900, #ffc37d); /* Standard syntax */
}



/* =========================================================
08. Buttons
============================================================ */
 
.btn {
	color: #fff;
	text-shadow: none;
	font-size: 16px;
	padding: 11px 19px;
	letter-spacing: 0.05em;
	border: 0;
	text-transform: none;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
  background-color: #545454;
  border-color: none;
  *background-color: #545454;
  background-image: none;
  /* Darken IE7 buttons by default so they stand out more given they won't have borders */
  filter: none;
  border: none;
  *border: 0;
  border-bottom-color: none;
}
.btn:link, .btn:visited {
	color: #fff;
}
.btn:hover {
	background: #333 !important;
}
.btn:hover,
.btn:focus,
.btn:active,
.btn.active,
.btn.disabled,
.btn[disabled] {
  color: #fff;
  background-color: #333;
  *background-color: #333;
}


.btn.btn-theme:hover,
.btn.btn-theme:focus {
	background: #333 !important;
}

/* size */
.btn-large {
  padding: 18px 25px;
  font-size: 24px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}

.btn-large [class^="icon-"],
.btn-large [class*=" icon-"] {
  margin-top: 4px;
}

.btn-small {
  padding: 6px 13px;
  font-size: 11.9px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}

.btn-small [class^="icon-"],
.btn-small [class*=" icon-"] {
  margin-top: 0;
}

.btn-mini [class^="icon-"],
.btn-mini [class*=" icon-"] {
  margin-top: -1px;
}

.btn-mini {
  padding: 0 6px;
  font-size: 10.5px;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}

/* end size */

.btn-primary {
  color: #ffffff;
  text-shadow: none;
  background-color: #09828c;
  *background-color: #09828c;
  background-image: none;
  border-color: none;
  filter:none;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-primary.disabled,
.btn-primary[disabled] {
  color: #ffffff;
  background: #065158;
  *background-color: #065158;
}

.btn-primary:active,
.btn-primary.active {
  background-color: #065158 \9;
}

.btn-warning {
  color: #ffffff;
  text-shadow: none;
  background-color: #ffe873;
  *background-color: #ffe873;
  background-image: none;
  border-color: none;
  filter:none;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning.active,
.btn-warning.disabled,
.btn-warning[disabled] {
  color: #ffffff;
  background: #b88f22;
  *background: #b88f22;
}

.btn-warning:active,
.btn-warning.active {
  background: #b88f22 \9;
}


.btn-danger {
  color: #ffffff;
  text-shadow: none;
  background-color: #f36f36;
  *background-color: #f36f36;
  background-image: none;
  border-color: none;
  filter:none;
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-danger.active,
.btn-danger.disabled,
.btn-danger[disabled] {
  color: #ffffff;
  background: #db5f58;
  *background: #db5f58;
}

.btn-danger:active,
.btn-danger.active {
  background: #db5f58 \9;
}

.btn-success {
  color: #ffffff;
  text-shadow: none;
  background-color: #1bac91;
  *background-color: #1bac91;
  background-image: none;
  border-color: none;
  filter:none;
}

.btn-success:hover,
.btn-success:focus,
.btn-success:active,
.btn-success.active,
.btn-success.disabled,
.btn-success[disabled] {
  color: #ffffff;
  background: #55ba93;
  *background: #55ba93;
}

.btn-success:active,
.btn-success.active {
  background: #55ba93 \9;
}

.btn-info {
  color: #ffffff;
  text-shadow: none;
  background-color: #4dbdc6;
  *background-color: #4dbdc6;
  background-image: none;
  border-color: none;
  filter:none;
}

.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info.active,
.btn-info.disabled,
.btn-info[disabled] {
  color: #ffffff;
  background: #6a9ad0;
  *background: #6a9ad0;
}

.btn-info:active,
.btn-info.active {
  background: #6a9ad0 \9;
}

.btn-inverse {
  color: #ffffff;
  text-shadow: none;
  background-color: #3c3c3c;
  *background-color: #3c3c3c;
  background-image: none;
  border-color: none;
  filter:none;
}

.btn-inverse:hover,
.btn-inverse:focus,
.btn-inverse:active,
.btn-inverse.active,
.btn-inverse.disabled,
.btn-inverse[disabled] {
  color: #ffffff;
  background: #2b2a2a;
  *background: #2b2a2a;
}

.btn-inverse:active,
.btn-inverse.active {
  background: #2b2a2a \9;
}


/* button flat */
.btn-flat {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}

/* button rounded */
.btn-rounded {
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
}
.btn-large.btn-rounded {
  -webkit-border-radius: 28px;
  -moz-border-radius: 28px;
  border-radius: 28px;
}


.navbar-inverse .btn-navbar {
	width: auto;
	height: auto;
}

section#response .give-bear {
	text-align: center;
	
}
section#response .give-bear img {
	margin:0 auto;
	text-align: center;
}


.isotope-hidden {
	display:none;
}


/* =========================================================
09. Media queries
============================================================ */
/*
@mobile:  ~"(max-width: 767px)";
@tablet:  ~"(min-width: 768px) and (max-width: 979px)";
@normal:  ~"(min-width: 980px) and (max-width: 1199px)";
@wide:    ~"(min-width: 1200px)";
*/
/* MOBILE  */
@media (max-width: 767px) {
	body {
		padding:70px 0px 0px;
	}
	h1,h2,h3 {
		font-size: 32px;
	}
	.logo-block {
		width:80%;
		float:left;
		padding-left:10px;
	}
	.logo {
		width:100%;
	}
	.logo-wrap {
		padding-top:10px;
	}
	.logo-wrap > a {
	    display: inline-block;
	    float: none;
	    margin-right: 30px;
	    width: 100%;
	    margin-bottom:0.5ex;
	    z-index: 10;
	}
	ul#menu-main .first {
		margin-right:0;
	}
	.social-icons {
	    position: absolute;
	    z-index: 9999;

	}
	.nav-block {
		position:absolute;
		right:0px;
		z-index: 999;
	}
	.navbar-wrapper {
		overflow:visible;
	}
	.navbar {
		
	}
	.navbar-inner {
		padding-right: 20px;
		padding-left: 20px;	
		box-shadow: none;
	}
	.navbar-inner h1.brand {
		margin-left:20px;
	}
	.navbar .btn-navbar,
	.navbar-inner .btn-navbar {
		border:none;
		background:none;
	}
	.navbar-inner .btn-navbar {
		margin:12px 0px 10px;
		padding:10px 20px;
		background-color: transparent;
		background-image: none;
		box-shadow: none;	
	}
	.navbar-inner a.btn-navbar:hover,
	.navbar-inner a.btn-navbar:focus {
		background-color: transparent !important;
		background-image: none !important;
		box-shadow: none !important;
	}
	.navbar .btn-navbar .icon-bar {
		height: 3px;
		width: 21px;
	}
	#navigation-row {
		height:70px;
	}
	#navigation-row .container {
		padding:0;
		margin:0;
	}
	.container {
	
	}	
	.navbar-inverse .navbar-inner {
		padding:0px 0px 20px;
	}
	#menu-main {
		width:100%;
		background-color: #4A7DBA;
	}
	
	ul#menu-main > li > a {
		font-size:18px;
	}
	ul#menu-main > li > a,
	ul#menu-main > li > a:hover,
	ul#menu-main > li > a:focus {
		padding:10px 8px;
		text-align:left;
	}
	ul#menu-main > li.active > a {
		color: #FFC630;
		background-color: #5691d7;
	}
	.navbar-inverse .nav-collapse .nav > li > a:hover, 
	.navbar-inverse .nav-collapse .nav > li > a:focus, 
	.navbar-inverse .nav-collapse .dropdown-menu a:hover, 
	.navbar-inverse .nav-collapse .dropdown-menu a:focus {
		background-color: #5691d7;
	}
	.nav-collapse {
		text-align:center;
		width:100%;
	}
	ul.story-nav {
		width:100%;
	}
	.story-nav li {
		width:24.5%;
		margin:0px 1px;
	}
	.story-nav li a {
		width:100%;
	}
	#story-nav header > .container,
	section.content .container {
		padding:0px;
	}
	ul#filters li.first {
		margin-left:0px;
	}
	ul#filters li.last {
		margin-right:0px;
	}

	.storyblock {
		width:100%;
	}
	body.story-article .storycontent {
		padding:0px 5px;
	}
	body.story-article .storycontent h1 {
		font-size:16px;
		margin: 5px 0px;
	}
	body.story-article blockquote {
		clear:both;
		margin:5px 30px 20px 0px;
		padding:10px;
	}
	body.story-article blockquote p {
		font-size:22px;
		line-height: 26px;
	}
	body.story-article blockquote p.author {
		margin-left:0px;
	}
	section.content blockquote aside {
		right: -25px;
	}
	#portfolio-wrap .grid {
		width: 25%;
	}
	#header-wrapper {
	    min-height:inherit;
	}
	#header-wrapper header > .container {
		margin:0;
		padding:5px;
	}
	#header-wrapper h1 {
	    font-size: 29px;
	    line-height: 1.2em;
	    margin: 1em 30px;
	    margin-top:0px;
		text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.25);
	}
	span.dt {
		display:inline;
	}
	section.section {
		padding-top:70px;
		height:360px;
	}
	.berkeley-type {
		width:132px;
	}
	section#crisis {
		background: none;		
		filter:none;
		-ms-filter:none; 
		background-color: #6690C2;
	}
	section#crisis h1 {
		font-size:32px;
		padding:0;
		margin:5px auto 12px auto;
		width:270px;
		
	}
	#pie-animation {
		position: relative;
		margin:0 auto;
		width:224px;
	}
	.pie-overlay1,
	.pie-overlay2 {
		position: absolute;
		top:0;
		left:0;
		width:224px;	
		height:265px;
	}
	.pie-overlay1 {
/*
		background: transparent url(../img/campaign/pie1_m.png) no-repeat center center;
*/
	}
	.pie-overlay2 {
		/*
display:none;
		background: transparent url(../img/campaign/pie2_m.png) no-repeat center center;
		z-index: 10;
*/
	}
	section#response h1 {
		font-size:28px;
		margin-top:10px;
		margin-bottom:10px;
	}
	section#response .record-numbers {
		font-size: 24px;
		margin-top:0px;
		 top:0px;
	}
	section#response .give-bear {
		text-align: center;
		width: 260px;
		height:215px;	
		margin:0 auto;
	}
	section#response .give-bear img {
		margin:0 auto;
		text-align: center;
	}
	section#response .record-numbers {
		width:238px;
		margin:0 auto;
	}
	
	a.next-students {
		margin-top:0px;
	}
	section#stories .student-links .alignright,
	section#stories .faculty-links .alignright,
	section#stories .research-links .alignright {
		text-align: center;
	}
	#story-menu .storyblock {
		
	}
	.arrowblock {
		position:absolute;
		right:0px;
		top:0px;
		width:15%;
	}
	#story-menu {
		
	}
	section#stories #story-menu h1 {
	    font-size: 32px;
	    margin-top:0px;
    }
	#story-menu .story-right {
		margin-top:135px;
	}
	section#victory .container {
		padding:0px 5px;
	}
	section#victory h1 {
		font-size:31px;
		margin-top: 10px;
	}
	section#victory .benefits {
		font-size: 20px;
	}
	.together {
		width:250px;
		margin: 0px auto;
	}
	section#stories {
	    height: 1300px;
    }
	.storypage {
	    padding: 70px 0;
    }
    .storypage .row {
	    margin-bottom:10px;
    }
    .storypage p {
	    font-size:17px;
        line-height: 22px;
    }
    
	.story-button {
		margin-top:25px;
	}
	.story-content {
		padding:0px 20px;
	}
	section#stories h1 {
	    font-size: 23px;
	    padding:0px 20px;
    }
    .lr-btns {
	    width:105px;
	    margin:0 auto;
    }
	section#stories .storylinks {
		width:100%;
		margin:0px auto 0px auto;
	}
	.storylinks ul {
		margin:0;
		margin-bottom: 10px;
		list-style: none;
		list-style-type: none;
		text-indent: 0;
		/* remove iOS list indent */

		-webkit-margin-before: 0px;
		-webkit-margin-after: 0px;
		-webkit-margin-start: 0px;
		-webkit-margin-end: 0px;
		-webkit-padding-start: 0px;

	}
	.storylinks ul li {
		display:block;
		margin:0 auto;
		list-style: none;
		list-style-type: none;
		text-indent: 0;
	}
	section#stories .storylinks ul li a {
	    color: #FFFFFF;
	    display: block;
	    font-family: 'Roboto Condensed',Arial,sans-serif;
	    font-size: 24px;
	    font-weight: 700;
	    height: 110px;
	    line-height: 110px;
	    width: 110px;
	    margin:20px auto;
	}
	.student-links div img,
	.faculty-links div img,
	.research-links div img  {
		margin:10px 0px 10px auto;
	}
	a.students-btn {
		background: transparent url(../img/campaign/students_button_up_m.png) no-repeat center center;
	}
	a.students-btn:hover,
	a.students-btn:focus {
		background: transparent url(../img/campaign/students_button_hover_m.png) no-repeat center center;
	}
	a.faculty-btn {
		background: transparent url(../img/campaign/faculty_button_up_m.png) no-repeat center center;	
	}
	a.faculty-btn:hover,
	a.faculty-btn:focus {
		background: transparent url(../img/campaign/faculty_button_hover_m.png) no-repeat center center;	
	}
	a.research-btn {
		background: transparent url(../img/campaign/research_button_up_m.png) no-repeat center center;
	}
	a.research-btn:hover,
	a.research-btn:focus {
		background: transparent url(../img/campaign/research_button_hover_m.png) no-repeat center center;
	}
	
	section#stories h1 {
	    font-size: 20px;
	    margin-top:10px;
	    margin-bottom:5px;
	}

	footer .ucbseal {
		text-align: center;
	}
	footer .ucbseal img {
		float:none;
	}
	footer .ucbseal p {
		margin-top:20px;
	}
	footer .contact-block { 
		text-align: center;
	}
	footer .contact-block ul.social-icons { 		
		display:inline-block;
		margin:0 auto;
		margin-bottom:20px;	
	}
	footer ul.follow-us {
		text-align: center;
	}
	footer ul.follow-us li {
		display:inline-block;
		margin:0 auto;
		width:30px;
		text-align: center;
		float:none;
	}
	footer ul.follow-us li a {
		display:block;
		text-align: center;
	}
	footer p.copyright {
		font-size: 12px;
	}
	footer p.contact-links {
		font-size: 13px;
	}
	.storyblock {
		margin-bottom:0;
	}
	.storyblock a.bak-hilite {
		padding:5px;	
	}
	
	#videos .videos a.bak-hilite:hover, #videos .videos a.bak-hilite:focus,
	#videos .research a.bak-hilite:hover, #videos .research a.bak-hilite:focus,
	#videos .faculty a.bak-hilite:hover, #videos .faculty a.bak-hilite:focus,
	#videos .students a.bak-hilite:hover, #videos .students a.bak-hilite:focus,
	#research .videos a.bak-hilite:hover, #research .videos a.bak-hilite:focus,
	#research .research a.bak-hilite:hover, #research .research a.bak-hilite:focus,
	#research .faculty a.bak-hilite:hover, #research .faculty a.bak-hilite:focus,
	#research .students a.bak-hilite:hover, #research .students a.bak-hilite:focus,
	#faculty .videos a.bak-hilite:hover, #faculty .videos a.bak-hilite:focus,
	#faculty .research a.bak-hilite:hover, #faculty .research a.bak-hilite:focus,
	#faculty .faculty a.bak-hilite:hover, #faculty .faculty a.bak-hilite:focus,
	#faculty .students a.bak-hilite:hover, #faculty .students a.bak-hilite:focus,
	#all .videos a.bak-hilite:hover, #all .videos a.bak-hilite:focus,
	#all .research a.bak-hilite:hover, #all .research a.bak-hilite:focus,
	#all .faculty a.bak-hilite:hover, #all .faculty a.bak-hilite:focus,
	#all .students a.bak-hilite:hover, 	#all .students a.bak-hilite:focus {
		background-image:none;
	}
	
	.storythumb {
		margin:5px 10px 10px 0px;
	}
	.storythumb img {
		width:50px;
		height:50px;
		
	}
	.storyteaser {
		float:left;
		width:80%;
	}
	.storyteaser p {
		margin-left:5px;
	}
	.storyteaser h1 {
		font-size:16px;
		margin-bottom:5px;

	}
	.storyteaser p {
		font-size: 13px;
		line-height: 16px;
		clear:both;
	}
	.thanksgraphic {
		margin:10px 25px;
	}
	#thanks-to-you .container > .row {
		margin-bottom: 5px;
	}
	body.story-article iframe {
		width:100%;
	}
	body.story-article .logo-wrap {
		margin-top:10px;
	}
	.prev-story-page {
	    margin-left: 5px;
	}
	.next-story-page {
	    margin-right: 5px;
	}
	#featured-image {
	    background-color: #FFFFFF;
	    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.5);
	    left: inherit;
	    margin-left: 10px;
	    min-width: inherit;
	    max-width:500px;
	    width:90%;
	    position: absolute;
	    text-align: center;
	    top: 130px;
	    z-index: 100;
	}
	.inner-feature {
		padding:10px;
	}
	
	
	#intro-stories-head div .storyteaser {
		margin-left:5px;
		width:95%;
		padding-bottom: 20px;
	}
	#intro-stories-head div .storyteaser h1 {
		padding-top:0px;
		font-size:24px;
	}
	#intro-stories-head div .storythumb {
		margin: 5px 10px 10px 5px;
	}
	#intro-stories-head div .storythumb img {
		margin: 0px;
	}

	#intro-stories-head .all-intro .storyteaser  {
		margin-left:5px;
	}
	
	#intro-stories-head .all-intro {
		
	}
	#intro-stories-head .all-intro .storyteaser  {
	
	
	}
	#intro-stories-head .all-intro .storyteaser h1 {

	}
	#intro-stories-head .students-intro .storythumb {
		
	}
	#intro-stories-head .students-intro .storyteaser  {
		width:75%;
		float:left;
		padding-right:0px;
		margin-left:5px;
	}
	#intro-stories-head .students-intro .storyteaser p {
		margin-left:0px;
	}
	#intro-stories-head .faculty-intro {
		
	}
	#intro-stories-head .faculty-intro .storyteaser  {
		width:75%;
		float:left;
		padding-right:0px;
		margin-left:5px;
	}
	#intro-stories-head .faculty-intro .storyteaser p {
		margin-left:0px;
	}
	#intro-stories-head .research-intro {
		
	}
	#intro-stories-head .research-intro  .storyteaser {
		width:75%;
		float:left;
		padding-right:0px;
		margin-left:5px;
	}
	#intro-stories-head .research-intro  .storyteaser p {
		margin-left:0px;
	}
	#intro-stories-head .videos-intro .storyteaser h1 {

	}
	#intro-stories-head .videos-intro {
		
	}
	#intro-stories-head .videos-intro  .storyteaser {
		margin-left:5px;
		padding-right:0px;
	}

	
	
	
}
/* iPhone / mobile webkit */
@media screen and (max-device-width: 480px) {
 	#slidebox,
	section.section,
	.storypage {
		box-shadow: 0px 0px 0px black;
		box-shadow: none;
		text-shadow: none;
		outline:none;
		border:none;
		
	}
 	section.section {
	 	/* padding-top:70px; */
 	}
 	section#crisis,
 	section#response,
 	section#victory,
 	section#stories storypage, 
 	section#thanks-to-you {
	 	padding-top:70px;
 	}
 	
 	/* Chart description only for iPhone fix */
 	#description {
	    font-size: 26px;
	    margin-left: -90px;
	    margin-top: -29px;
	    width: 180px;
	}
 	/* end chart fix */
 	body {
	 	background-color: #FFF; /* need to re-issue this for some reason */
 	}
 	section#stories h1 {
	 	margin:0px;
	 	margin-bottom:5px;
 	}
 	section#stories .storylinks ul li {
	 	display:block;
	 	list-style: none outside none;
	    margin: 0 auto;
	    text-indent: 0;
 	}
 	section#stories .storylinks ul li a {
	 	margin:20px auto;
	 	padding:0px;
 	}
 	.thanksgraphic {
		margin:10px 25px;
	}
	#thanks-to-you .container > .row {
		margin-bottom: 5px;
	}
	body.story-article iframe {
		width:100%;
	}
	#intro-stories-head div .storythumb {
		
		position:static;
	}
	#intro-stories-head div .storyteaser {
		
		position:static;
	}
	
	
}
    
    /* Smaller screens ----------- */
@media (max-width : 480px) {
	/*
#header-wrapper {
		padding-top:80px;
	}
*/

	#team .team-thumb {
		 margin-right: auto;
		 margin-left: auto;
		 width: 150px;
		 display: block;
		 text-align:center;
	}

	#portfolio-wrap .grid {
		width: 50%;
	}

}
    
    /* Smartphones (portrait and landscape) ----------- */
@media only screen  and (min-device-width : 320px)  and (max-device-width : 480px) {

	 section.section {
	 padding: 1em 0;
	}
	
	 #works .container {
	 top: 0 !important;
	}
	
	.max-img {
	 width: 100%;
	}
	 .max-img {
	 margin-right: auto;
	 margin-left: auto;
	 display: block;
	}
	
	 section#services h2 {
	 margin-bottom: 0.25em;
	}
	 section#services h2, section#services ul {
	 text-align: center;
	}
			
	
	/* team */
			
	#team .team-thumb {
	 margin-right: auto;
	 margin-left: auto;
	 width: 150px;
	 display: block;
	 text-align:center
	}
	 .job-position: {
	 margin-bottom: 1.5em;
	}
	 .navbar-fixed-top, .navbar-fixed-bottom, .navbar-static-top {
	 margin-left: auto;
	 margin-right: auto;
	}
		
	/* Contact Form */
	#contact-form {
		overflow: hidden;
	}
	#contact-form input[type=submit] {
		width: 100%;
	}
	
	.storylinks {
		width:600px;
		margin:0 auto;
	
	}
	.storylinks ul li {
		display:inline;
		margin:0 45px;
	}


}

	
/*  TABLETS  */
 @media (min-width: 768px) and (max-width: 979px) {
	body {
		padding:60px 0px 0px;
	}
	.showgrid {
		background-image: url(../img/showgrid_724px.png);
	}	
	h1,h2,h3 {
		font-size: 32px;
	}
	#header-wrapper {
	    min-height: 590px;
	}
	#header-wrapper h1 {
	    font-size: 54px;
	    line-height: 1.2em;
	    margin: 1em 0;
		text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.25);
	}
	.berkeley-type {
		width:215px;
	}
	
	#menu-main {
		background-color: #4A7DBA;
		margin-top:12px;
		width:100%;
	}
	ul#menu-main > li > a,
	ul#menu-main > li > a:hover {
		padding:10px 8px;
		text-align:left;
	}
	ul#menu-main > li.active > a,
	ul#menu-main > li.focus > a {
		color: #FFC630;
		background-color: #5691d7;
	}
	.logo-block {
		float:left;
		width: 75%;
	}
	.logo-wrap {
		width:650px;
	}
	.logo-wrap > a {
		width:70%;
	}
	.social-icons {
	    position: absolute;
	    z-index: 9999;

	}
	#navigation-row .nav-block {
		position:absolute;
		right:0px;
	
	}
	ul#menu-main .first {
		margin-right:0;
	}
	.navbar-inverse .nav-collapse .nav > li > a:hover, 
	.navbar-inverse .nav-collapse .nav > li > a:focus, 
	.navbar-inverse .nav-collapse .dropdown-menu a:hover, 
	.navbar-inverse .nav-collapse .dropdown-menu a:focus {
		background-color: #5691d7;
	}
	.navbar-inner h1.brand {
		margin-left:20px;
	}
	.navbar .btn-navbar,
	.navbar-inner .btn-navbar {
		border:none;
		background:none;
	}
	.navbar-inner .btn-navbar {
		margin:12px 0px 0;
		padding:10px 20px;
		background-color: transparent;
		background-image: none;
		box-shadow: none;
		
	}
	.navbar-inner a.btn-navbar:hover,
	.navbar-inner a.btn-navbar:focus {
		background-color: transparent !important;
		background-image: none !important;
		box-shadow: none !important;
	}
	.navbar .btn-navbar .icon-bar {
		height: 3px;
		width: 21px;
	}
	.container {
	 padding-right: 20px;
	 padding-left: 20px;
	}	
	.navbar-inverse .navbar-inner {
		/* padding:0 0 30px; */
	}
	
	.nav-collapse {
		text-align:center;
		width:100%;
	}
	section#crisis h1 {
		margin-top:20px;
		font-size:45px;
	}
	section#crisis .span5 {
		width:392px;
	}
	section#response h1 {
		font-size:42px;
		margin-top:75px;
	}
	section#response .record-numbers {
		font-size: 38px;
		margin-top:20px;
	}
	section#stories .storylinks {
		width:100%;
		margin:20px auto 0px auto;
	}
	section#victory h1 {
		font-size:50px;
	}
	section#victory .benefits {
		font-size:32px;
	}
	.storylinks .row {
		margin-bottom:20px;
	}
	a.next-students {
		margin-top:80px;
	}
	
	#story-menu .storyblock {
		margin-top:50px;
	}
	.arrowblock {
		position:absolute;
		right:0px;
		top:0px;
		width:15%;
	}
	.storypage .arr {
	  
	}
	#story-menu h1 {
		
	}
	section#stories #story-menu h1 {
		font-size: 53px;
		margin-bottom:10px;
	}
	
	section.section {
		height:540px;
	}
	
	section#stories h1 {
	    font-size: 42px;
	}
	.storylinks ul li {
	    display: inline;
	    margin: 0 20px;
	}
	
	section#stories .storylinks ul li a {
		width:110px;
		height:110px;
		line-height: 110px;
	}
	a.students-btn {
		background: transparent url(../img/campaign/students_button_up_m.png) no-repeat center center;
	}
	a.students-btn:hover,
	a.students-btn:focus {
		background: transparent url(../img/campaign/students_button_hover_m.png) no-repeat center center;
	}
	a.faculty-btn {
		background: transparent url(../img/campaign/faculty_button_up_m.png) no-repeat center center;	
	}
	a.faculty-btn:hover,
	a.faculty-btn:focus {
		background: transparent url(../img/campaign/faculty_button_hover_m.png) no-repeat center center;	
	}
	a.research-btn {
		background: transparent url(../img/campaign/research_button_up_m.png) no-repeat center center;
	}
	a.research-btn:hover,
	a.research-btn:focus {
		background: transparent url(../img/campaign/research_button_hover_m.png) no-repeat center center;
	}
	.thanksgraphic {
	  	margin:50px 0px 30px;
	}
	.seal-block {
		width:414px; /* span7 */
	}
	.contact-block {
		width:290px; /* span5 */
	}
	body.story-listing #story-listing div.span8 {
		margin-left:0px;
		width:100%;
	}
	.storyblock a.bak-hilite {
		padding:10px 20px;
	}
	.storythumb {
		margin-left:0px;
	}
	body.story-article .content .offset2 {
		margin-left:72px;
	}
	body.story-article .content .span8 {
		width:578px;
	}
	body.story-article h1 {
		margin-bottom:60px;
	}
	section.content blockquote {
		margin: 30px 0px;
	    padding: 10px;
	    min-height:90px;
	}
	body.story-article iframe {
		width:100%;
	}
	.prev-story-page {
	    margin-left: 85px;
	}
	.next-story-page {
	    margin-right: 85px;
	}
	
	
	#intro-stories-head div .storyteaser {
		margin-left:140px;
		
	}
	#intro-stories-head div .storyteaser h1 {
	
	}
	
	#intro-stories-head .all-intro .storyteaser  {
		margin-left:40px;
	
	}
}


/* DESKTOP */
@media (min-width:980px) and (max-width: 1199px) {
	.showgrid {
		background-image: url(../img/showgrid_940px.png);
	}	
	ul#menu-main > li > a,
	ul#menu-main > li > a:hover,
	ul#menu-main > li > a:hover:focus {
		padding:10px 8px;
		text-align:left;
	}
	ul#menu-main .first {
		margin-right:50px;
	}
	.logo {
		margin-left:20px;
		width:400px;
	}
	body.story-listing #story-listing div.span8 {
		margin-left:100px;
		width:750px;
	}
	.storypage .arr {
	   
	}
	/*
section#stories,
	#slidebox {
		height:755px;
	}
*/
	.storypage {
		height:735px;
	}
	section#stories {
		height:900px;/* allow for height of storypages plus padding and bottom arrow */
	}

	#story-menu .storylinks {
	    width: 720px;
	    margin-top:75px;
	}
	a.next-students {
		margin-top:120px;
	}
	.storylinks ul li {
	    display: inline;
	    margin: 0 15px;
	}
	section#crisis h1 {
		font-size:54px;
		padding-left:60px;
	}
	body.story-article iframe {
		width:100%;
	}
	.prev-story-page {
	    margin-left: 190px;
	}
	.next-story-page {
	    margin-right: 190px;
	}
	
	    
}
/* WIDE */
@media (min-width: 1200px) {
	.showgrid {
		background-image: url(../img/showgrid_1170px.png);
	}
	ul#menu-main > li > a,
	ul#menu-main > li > a:hover,
	ul#menu-main > li > a:focus {
		padding:10px 15px;
	}	
	/*
section#stories,
	#slidebox {
		height:755px;
	}
*/
	.storylinks {
	width:970px;
	margin:0 auto;

	}
	.storylinks ul li {
		display:inline;
		margin:0 45px;
	}
	section#crisis h1 {
		padding-left:120px;
	}
	
}

@media print{
   section.content blockquote aside {
	   display:none;
   }
}