/* ==========================================================================
   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, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* ==========================================================================
   HTML5 Boilerplate styles - h5bp.com (generated via initializr.com)
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

body {
    font-size: 1em;
    line-height: 1.4;
}

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

img {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

a {
	text-decoration: none;
	/*color: #fff;*/
}


/* ==========================================================================
   Author's custom styles
   ========================================================================== */
em {
	font-style: italic;
}

body {
	background: #271C0F;
	color: #fff;
	font-family: 'Lato', sans-serif;
	font-weight: 400;
	transition: background 0.25s ease;
	-moz-transition: background 0.25s ease;
	-webkit-transition: background 0.25s ease;
	-o-transition: background 0.25s ease;
	-ms-transition: background 0.25s ease;
}

body.sub {
	background: #FFFFFF;
}

.wrapper {
	width: 1020px;
	margin: 0 auto;
	box-sizing: border-box;
}

.wrapper.relative {
	position: relative;
}

.header {
	position: fixed;
	top: 0px;
	left: 0px;
	height: 80px;
	width: 100%;
	background: #FFBC00;
	z-index: 2;
}

.header .back.button {
	float:left;
	height: 50px;
	width: 50px;
	background: url(../img/button_sprites.png) -52px 0px no-repeat;
}

.header .title {
	float:left;
	font-size: 18px;
	text-transform: uppercase;
	height: 80px;
	line-height: 80px;
	margin: 0px 15px;
	font-weight: 700;
	letter-spacing: 3px;
}

.header .icon {
	float: left;
	width: 39px;
	height: 51px;
	margin: 15px 0px;
	background: url(../img/cfas_logo.png) no-repeat;
}

.header .wrapper .minimap {
	position: absolute;
	width: 248px;
	height: 330px;
	top: -232px;
	/*right: -150px;*/
	right:0px;
	background: url(../img/minimap_bg.png) right 0px no-repeat;
	
	transition: All 1s ease;
	-moz-transition: All 1s ease;
	-webkit-transition: All 1s ease;
	-o-transition: All 1s ease;
	-ms-transition: All 1s ease;
}

.header .wrapper .minimap .label {
	position: absolute;
bottom: 0px;
width: 350px;

	height: 100px;
font-size: 20px;
font-weight: bold;
text-align: center;
text-transform: uppercase;
color: #222;

background: url(../img/region-button.png) center no-repeat;
	
	opacity: 0;
	transition: opacity 0.5s;
	-moz-transition: opacity 0.5s;
	-webkit-transition: opacity 0.5s;
	-o-transition: opacity 0.5s;
	-ms-transition: opacity 0.5s;
}

.header .wrapper .minimap.active {
	top: -238px;
	width: 398px;
	right: 0px;
}

.header .wrapper .minimap.active .label {
	opacity: 1;
}

.header .wrapper .minimap.active.show {
	top:0px;
	transition: All 0.5s;
	-moz-transition: All 0.5s;
	-webkit-transition: All 0.5s;
	-o-transition: All 0.5s;
	-ms-transition: All 0.5s;
}

.header .wrapper .minimap.active.show .label {
	display:none;
}

.header .wrapper .minimap .fold {
	position: absolute;
	top: -64px;
	left: -340px;
	width: 490px;
	height: 268px;
	/* background: #000; */
	
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	overflow: hidden;
}

.header .wrapper .minimap .fold:before {
	content: "";
	position: absolute;
	top: -45px;
	left: 30px;
	width: 727px;
	height: 342px;
	background: url(../img/minimap_bg.png) 0px 0px no-repeat;
	
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
}

.header .wrapper .minimap .svg {
	position: absolute;
	top: 230px;
	left: 0px;
	width: 248px;
	height: 90px;
	opacity: 0;
	overflow:hidden;
	
	transition: All 1s;
	-moz-transition: All 1s;
	-webkit-transition: All 1s;
	-o-transition: All 1s;
	-ms-transition: All 1s;
}

.header .wrapper .minimap.active .svg {
	opacity: 0.25;
	width: 366px;
	width: 495px;
	left: -20px;
}

.header .wrapper .minimap.active.show .svg {
	opacity: 1;
	top: 25px;
	left: -150px;
	height: 270px;
	
	transition: All 0.5s;
	-moz-transition: All 0.5s;
	-webkit-transition: All 0.5s;
	-o-transition: All 0.5s;
	-ms-transition: All 0.5s;
}

.header .wrapper .minimap .svg svg {
	position: relative;
	top: 0px;
	left: 0px;
	
	transition: All 1s;
	-moz-transition: All 1s;
	-webkit-transition: All 1s;
	-o-transition: All 1s;
	-ms-transition: All 1s;
}

.header .wrapper .minimap.active.show .svg svg {
	position: relative;
	transition: All 0.5s;
	-moz-transition: All 0.5s;
	-webkit-transition: All 0.5s;
	-o-transition: All 0.5s;
	-ms-transition: All 0.5s;
}

.header .wrapper .minimap .flank {
	position: absolute;
	height: 90px;
	width: 0px;
	background: #fff;
	top: 0px;
	left: 1020px;
}

body > .footer {
	position: relative;
	/* top: 80px; */
	width: 100%;
	height: 150px;
	border-top: 1px solid #453E32;
	box-sizing: border-box;
	margin-top: 80px;
}

body > .content.omnifooter {
	position: relative;
	display:block;
	top: 120px;
	width: 100%;
	height: 100px;
	border: none;
	margin-top: 20px;
	background: #FFBC00;
}

body > .content.omnifooter .left.flank {
	position: absolute;
	display:block;
	width: 50%;
	height: 100px;
	background: #FFF;
}

body > .content.omnifooter a.footer.non-home {
	position: relative;
	display:block;
	width: 1000px;
	margin: 0 auto;
	height: 100px;
	background: #FFBC00 url(../img/footer.png) center no-repeat;
}

body > .footer.sticky {
	position: fixed;
	bottom: 0px;
	left: 0px;
}

body > .footer ul.navigation.theme {
    list-style-type: none;
    padding: 0px 12px;
    height: 150px;
}

body > .footer ul.navigation.theme li.icon {
	width: 78px;
	height: 90px;
	margin: 24px 53px 0px 0px;
	padding: 0;
	float: left;
	background: url(../img/theme_icons.png) no-repeat;
	cursor:pointer;cursor:hand;
	
	transition: margin 1s ease;
	-moz-transition: margin 1s ease;
	-webkit-transition: margin 1s ease;
	-o-transition: margin 1s ease;
	-ms-transition: margin 1s ease;
}

body > .footer ul.navigation.theme li.icon:last-of-type {
	margin: 12px 0px 0px;
}

.footer ul.navigation.theme li.icon.food-security { background-position: 0px 0px; }
.footer ul.navigation.theme li.icon.food-emissions { background-position: -78px 0px; }
.footer ul.navigation.theme li.icon.climate-impacts-production { background-position: -156px 0px; }
.footer ul.navigation.theme li.icon.climate-impacts-people { background-position: -234px 0px; }
.footer ul.navigation.theme li.icon.adaptation { background-position: -312px 0px; }
.footer ul.navigation.theme li.icon.mitigation { background-position: -390px 0px; }
.footer ul.navigation.theme li.icon.policy-and-finance { background-position: -468px 0px; }
.footer ul.navigation.theme li.icon.evidence-of-success { background-position: -547px 0px; }

body > .footer ul.navigation.theme li.icon {
	margin-top: 12px;
	transition: margin 0.2s ease;
	-moz-transition: margin 0.2s ease;
	-webkit-transition: margin 0.2s ease;
	-o-transition: margin 0.2s ease;
	-ms-transition: margin 0.2s ease;
}

body > .footer ul.navigation.theme li.icon .hover.icon {
	position:relative;
	width: 78px;
	height: 90px;
	background: url(../img/theme_icons.png) no-repeat;
	opacity: 0;
	
	transition: opacity 1s ease;
	-moz-transition: opacity 1s ease;
	-webkit-transition: opacity 1s ease;
	-o-transition: opacity 1s ease;
	-ms-transition: opacity 1s ease;
}

.footer ul.navigation.theme li.icon.food-security .hover.icon { background-position: 0px -90px; }
.footer ul.navigation.theme li.icon.food-emissions .hover.icon { background-position: -78px -90px; }
.footer ul.navigation.theme li.icon.climate-impacts-production .hover.icon { background-position: -156px -90px; }
.footer ul.navigation.theme li.icon.climate-impacts-people .hover.icon { background-position: -234px -90px; }
.footer ul.navigation.theme li.icon.adaptation .hover.icon { background-position: -312px -90px; }
.footer ul.navigation.theme li.icon.mitigation .hover.icon { background-position: -390px -90px; }
.footer ul.navigation.theme li.icon.policy-and-finance .hover.icon { background-position: -468px -90px; }
.footer ul.navigation.theme li.icon.evidence-of-success .hover.icon { background-position: -547px -90px; }

body > .footer ul.navigation.theme li.icon .hover.icon:hover {
	opacity: 1;
	transition: opacity 0.2s ease;
	-moz-transition: opacity 0.2s ease;
	-webkit-transition: opacity 0.2s ease;
	-o-transition: opacity 0.2s ease;
	-ms-transition: opacity 0.2s ease;
}

body > .footer ul.navigation.theme li.icon .hover.text {
    display: table;
    background: #fff;
    color: #000;
    width: 125px;
    
    border-bottom: 0;
    text-align:center;
    margin: 0px -26px;
    padding: 0px 10px;
    box-sizing: border-box;
    position: relative;
    bottom: -12px;
    text-transform: uppercase;
    
    height: 0px;
    -webkit-transition: height 0s ease;
    -moz-transition: height 0s ease;
    -o-transition: height 0s ease;
    transition: height 0s ease; 
    
    font-size: 0px;   
}

body > .footer ul.navigation.theme li.icon .hover.text {
    height: 38px;
    border-bottom: 5px solid #7DB45B;
    -webkit-transition: height 0.5s ease;
    -moz-transition: height 0.5s ease;
    -o-transition: height 0.5s ease;
    transition: height 0.5s ease;
}

body > .footer ul.navigation.theme li.icon .hover.text .name {
	text-align: center;
	vertical-align: middle;
}

body > .footer ul.navigation.theme li.icon .hover.text .name {
	display: table-cell;
	font-size: 12px;
}

body > .footer ul.navigation.theme li.icon .hover.text .name.table {
	
}

.content.home {
	position: relative;
	height: 500px;
	top: 80px;
	left: 0px;
	overflow: hidden;
}

.content.home .about.button {
	position: fixed;
	width: 40px;
	height: 256px;
	margin-top: -128px;
	top: 320px;
	left: 0px;
	background: url(../img/about.png) no-repeat;
}

.content.home .globeNames {
	position: absolute;
	top: 0px;
	left: 0px;
}

.content.home .globeNames a .hover.text {
	position: absolute;
	background: #FFFFFF;
	color: #000000;
	border-left: 5px solid #27A4B4;
	border-right: 5px solid #27A4B4;
	text-align: center;
	padding: 1px 20px;
	white-space: nowrap;
	font-size: 12px;
	opacity: 1px;
	-webkit-transition: All 0.5s ease;
    -moz-transition: All 0.5s ease;
    -o-transition: All 0.5s ease;
    transition: All 0.5s ease;
}

.content.home .globeNames a .hover.text.notext {
	padding: 0px;
	opacity: 0;
}

.content.home .globeNames a .hover.text.notext span.name {
	-webkit-transition: All 0.5s ease;
    -moz-transition: All 0.5s ease;
    -o-transition: All 0.5s ease;
    transition: All 0.5s ease;
}

.content.home .globeNames a .hover.text.notext span.name {
	width: 0px;
	opacity: 0px;
	font-size: 0px;
}

.content.home .globeNames .hover.text.Latin-America { top: 280px; right: -160px; }
.content.home .globeNames .hover.text.North-America { top: 110px; left: 210px; }
.content.home .globeNames .hover.text.Europe { top: 80px; right: -420px; }
.content.home .globeNames .hover.text.Sub-Saharan-Africa { top: 260px; right: -470px; }
.content.home .globeNames .hover.text.South-Asia { top: 190px; right: -690px; }
.content.home .globeNames .hover.text.N-Africa-W-Asia { top: 180px; right: -520px; }
.content.home .globeNames .hover.text.East-Asia { top: 130px; left: 850px; }

.modals {
	position:fixed;
	top: 0px;
	left: 0px;
}

.modals .loading {
	position: fixed;
	top: 50%;
	left: 50%;
	width: 100px;
	height: 100px;
	margin: -50px;
	background: url(../img/loading.gif) no-repeat;
}

.modals .share.modal {
	position: fixed;
	top: 250px;
	left: -30px;
	-webkit-transition: All 0.25s ease;
    -moz-transition: All 0.25s ease;
    -o-transition: All 0.25s ease;
    transition: All 0.25s ease;
}

.modals .share.modal:hover {
	position: fixed;
	top: 250px;
	left: 10px;
}

.modals .share.modal .box {
	position: relative;
	height: 70px;
}

.modals .share.modal .box .facebook {
	position: relative;
	display:block;
	width: 54px;
	height: 62px;
	background: url(../img/cgiar_fb.png) no-repeat;
}

.modals .share.modal .box .twitter {
	position: relative;
	display: block;
	width: 54px;
	height: 62px;
	background: url(../img/cgiar_twitter.png) no-repeat;
}

.modals .share.modal .box a.download.button {
	display:block;
	width: 54px;
	height: 62px;
	background: url(../img/downloadall.png) no-repeat;
}

.modals .share.modal .box a.download.button .animated.hover {
	opacity: 0;
	
	-webkit-transition: All 0.25s ease;
    -moz-transition: All 0.25s ease;
    -o-transition: All 0.25s ease;
    transition: All 0.25s ease;
}

.modals .share.modal .box a.download.button:hover .animated.hover {
	opacity: 1;
}

.modals .shroud {
	position: fixed;
	width: 100%;
	height: 100%;
	cursor: pointer; cursor: hand;
}

.modals .start.modal .container {
	position: fixed;
	top: 225px;
	left: 50%;
	width: 658px;
	height: 200px;
	margin: 0px -329px;
	background: rgba(255,255,255,0.95);
	color: #F15A24;
	font-size: 20px;
	text-transform: uppercase;
	text-align: center;
	padding: 20px 0px;
	box-sizing: border-box;
}

.modals .start.modal .container .close {
	position: absolute;
	top: 0px;
	right: 0px;
	width: 50px;
	height: 50px;
	background: url(../img/modal_close_btn.png) no-repeat;
}

.modals .start.modal .container .row {
	letter-spacing: 1px;
	height: 50px;
	line-height: 50px;
}

.modals .start.modal .container .row.divider {
	color: #271C0F;
	font-size: 24px;
	padding: 0px 155px;
}

.modals .start.modal .container .row.divider span {
	float:left;
}

.modals .start.modal .container .row.divider .line {
	float:left;
	width: 114px;
	height: 25px;
	border-bottom: 2px solid #271C0F;
	margin: 0px 20px;
}

.modals .start.modal .container .row.divider .line.right {
	float:right;
}

/* ==========================================================================
   Subheader 
   ========================================================================== */
  
.subheader {
	position: fixed;
	background: #271C0F;
	color: #fff;
	width: 100%;
	height:  40px;
	clear: both;
	line-height: 50px;
	top: 80px;
	z-index: 1;
}

.subheader .navigation {
 	float: left;
 	width: 240px;
 	font-size: 12px;
 	text-transform: uppercase;
}

.subheader .navigation.left {
 	float: left;
 	width: 300px;
}

.subheader .navigation.center {
	float: left;
	margin-left: 150px;
}

.subheader .navigation.center #siteSearch {
	color: #e6e7e8;
	border: none;
	outline: none;
	background: #404041 url(../img/mglass.png) 4px 6px no-repeat;
	padding-left: 20px;
	height: 21px;
}

.subheader .navigation.center .resultsWrapper {
	position: absolute;
	top: 40px;
	background-color: #271C0F;
	height: 400px;
	width: 200px;
	padding: 0px 10px 13px;
	overflow: hidden;
	font-size: 11px;
	line-height: 22px;
	-webkit-transition: height 0.25s ease;
    -moz-transition: height 0.25s ease;
    -o-transition: height 0.25s ease;
    transition: height 0.25s ease;
    z-index: 105;
}

.subheader .navigation.center .resultsWrapper .results {
	height: 400px;
	overflow-y: scroll;
	width: 230px;
}

.subheader .navigation.center .resultsWrapper .carrot {
	position: absolute;
	bottom: 0px;
	left: -10px;
	width: 230px;
	height: 13px;
	background-color: #404041;
}

.subheader .navigation.center .resultsWrapper .carrot img{
	height: 8px;
	left: 65px;
	top: 3px;
	position: absolute;
}

.subheader .navigation.center .resultsWrapper .results ul li {
	cursor: pointer;
	width: 200px;
}

.subheader .navigation.center .resultsWrapper .results ul li:hover {
	background-color: #FFBC00;
}

.subheader .navigation.center .resultsWrapper .results .sResultsTitle {
	font-size: 12px;
	color: #FFBC00;
}

.subheader .navigation.center .resultsWrapper .results .theme {
	
}

.subheader .navigation.center .resultsWrapper .results .subtheme {
	padding-left: 15px;
	width: 185px;
}
.subheader .navigation.center .resultsWrapper .results .casestudy {
	padding-left: 30px;
	width: 170px;
}

.subheader .navigation.right {
 	float: right;
}

.subheader .navigation .subnav {
 	float:left;
 	width: 280px;
 	font-size: 12px;
 	overflow: hidden;
 	margin: 0px 20px;
}

.subheader .navigation .subnav .arrow {
 	display: inline-block;
 	background: url(../img/yellow_arrows.png) 0 0 no-repeat;
 	margin-right: 5px;
}

.subheader .navigation .subnav .arrow.right {
	height: 8px;
	width: 7px;
	background-position: -16px 0px;
}

.subheader .navigation .subnav .arrow.down {
	height: 7px;
	width: 8px;
	background-position: -8px 0px;
}

.subheader .navigation .subnav ul.nav-list {
	position: relative;
	top: -10px;
	width: 90%;
	padding: 10px 5%;
	background: #271C0F;
	list-style: none;
}

.subheader .navigation .subnav ul.nav-list a  {
    text-decoration: none;
    color: #fff;
}

.subheader .navigation .subnav ul.nav-list a li.nav-item {
	position: relative;
	top: 0px;
	width: 100%;
	height: 22px;
	font-size: 11px;
	line-height: 22px;
	white-space: nowrap;
	/* margin-left: 10px; */
	background: #271C0F;
	-webkit-transition: All 0.15s ease;
    -moz-transition: All 0.15s ease;
    -o-transition: All 0.15s ease;
    transition: All 0.15s ease;
    text-decoration: none;
    color: #fff;
}
.subheader .navigation .subnav ul.nav-list li.nav-item:hover {
	background: #FFBC00;
}

/* ==========================================================================
   Region Pages
   ========================================================================== */

.content.regions {
    position: relative;
    top: 100px;
    padding: 20px 0px;
}


.content.regions .hint {
	position: relative;
	margin: 10px 16px;
	width: 100%;
	height: 25px;
	background: url(../img/hint.png) no-repeat;
}

.content.regions > .region {
    position: relative;
    top: 0px;
    left: 10px;
    width: 1000px;
    margin: auto;
}

.content.regions > .region .infographic {
    
}

.content.regions > .region .infographic {
	position: absolute;
	/*background: #000000;*/
}

.content.regions > .region .infographic .source.button {
	position: absolute;
	left: 13px;
	bottom: 7px;
	font-size: 10px;
	text-transform: uppercase;
	color: #D6CEBF;
	letter-spacing: 1px;
	z-index: 1;
}

.content.regions > .region .infographic .source.button a.download {
	position: absolute;
	left: 53px;
	bottom: -1px;
	width: 16px;
	height: 15px;
	background: url(../img/download_icon.png) no-repeat;
}

.content.regions > .region .infographic .card-container {
    position: absolute;
    perspective: 800px;
    -webkit-perspective: 800px;
	-moz-perspective: 800px;
	-o-perspective: 800px;
}

.content.regions > .region .infographic .card {
    position: absolute;
    width: 100%;
    height: 100%;

   	-webkit-transition: -webkit-transform 0.5s;
	-moz-transition: -moz-transform 0.5s;
	-o-transition: -o-transform 0.5s;
	transition: transform 0.5s;
	
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.content.regions > .region .infographic .card.flipped {
	-webkit-transform: rotateY( 180deg );
	-moz-transform: rotateY( 180deg );
	-o-transform: rotateY( 180deg );
	transform: rotateY( 180deg );
}

.content.regions > .region .infographic .card .face {
  	position: absolute;
  	-webkit-backface-visibility: hidden;
  	-moz-backface-visibility: hidden;
  	-o-backface-visibility: hidden;
}

.content.regions > .region .infographic .card .face.back {
	display: table;
	transform: rotateY( 180deg );
	-webkit-transform: rotateY( 180deg );
	-moz-transform: rotateY( 180deg );
	-o-transform: rotateY( 180deg );
}

.content.regions > .region .infographic .card .face.front {
	z-index: 2;
}

.content.regions > .region .infographic .card.flipped .face.back {
	z-index: 2;
}

.content.regions > .region .infographic .card .face.back .cell {
	display: table-cell;
	padding: 20px;
	vertical-align:middle;
	font-family: Arial, Helvetica, sans-serif;
}

.content.regions > .region .infographic .card .face.back .cell .title {
	font-size: 14px;
	font-weight: bold;
	text-transform: uppercase;
}

.content.regions > .region .infographic .card .face.back .cell .source {
	word-break: break-word;
	font-size: 9px;
	padding: 10px 0px 20px;
	border-bottom: 1px solid #FFFFFF;
}

.content.regions > .region .infographic .card .face.back .cell .source p {
	margin: 1em;
}

.content.regions > .region .infographic .card .face.back .cell .source a {
	color: #FFFFFF;
	-ms-word-break: break-all;
     word-break: break-all;

     // Non standard for webkit
     word-break: break-word;

	-webkit-hyphens: auto;
	   -moz-hyphens: auto;
	        hyphens: auto;
}

.content.regions > .region .infographic .card .face.back .cell a.download {
	display: block;
	float:left;
	width: 85px;
	height: 15px;
	background: url(../img/download.png) no-repeat;
}

.content.regions > .region .infographic .card .face.back .cell a.facebook {
	display: block;
	float:right;
	margin-top: 2px;
	margin-left: 10px;
	width: 16px;
	height: 16px;
	background: url(../img/facebook.png) no-repeat;
}

.content.regions > .region .infographic .card .face.back .cell a.twitter {
	display: block;
	float:right;
	width: 20px;
	height: 16px;
	background: url(../img/twitter.png) no-repeat;
}

.content.regions > .region .infographic .card .face.back.blue { background: #00857B; }
.content.regions > .region .infographic .card .face.back.red { background: #CC4C1E; }
.content.regions > .region .infographic .card .face.back.orange { background: #FFAA00; }

/* ==========================================================================
   Compare Pages
   ========================================================================== */

.content.comparison {
    position: relative;
    top: 140px;
    padding: 20px 0px;
    margin-top: 0px;
}

.content.comparison .compareMap svg{
	margin-bottom: 0px;
}

.content.comparison .source {
	font-size: 10px;
	color: #D6CEBF;
	visibility: hidden;
}

.content.comparison .source a{
	color: #D6CEBF;
}

.content.comparison .description {
	position: relative;
	color: #222222;
}

#stackedBar  {
    height: 530px;
	
}

#stackedBar svg {
	 font-size: 10px; 
	 text-transform: uppercase;
}

#stackedBar .axis path,
#stackedBar .axis line {
  fill: none;
  stroke: #000;
  stroke-width: 2px;
  shape-rendering: crispEdges;
}

#stackedBar rect {
  stroke: #FFFFFF;
  stroke-width: 2px;
}

#stackedBar .x.axis path {
}

.content.comparison .compareBars {
    position: absolute;
    top: 0px;
}

.content.comparison .compareDonuts {
    position: absolute;
    top: 0px;
    width: 1000px;
    height: 510px;
}

.content.comparison .compareDonuts .donut {
	position: absolute;
    
	width: 110px;
    height: 110px;
    color:#222222;
    text-align:center;
    text-transform: uppercase;
}

.content.comparison .compareDonuts .donut .label {
	font-weight: bold;
	font-size: 12px;	
}

.content.comparison .compareDonuts .donut.North-America { top: 110px; left: 150px; }
.content.comparison .compareDonuts .donut.Latin-America { top: 300px; left: 240px; }
.content.comparison .compareDonuts .donut.Sub-Saharan-Africa { top: 290px; left: 440px; }
.content.comparison .compareDonuts .donut.Europe { top: 60px; left: 380px; }
.content.comparison .compareDonuts .donut.North-Africa { top: 130px; left: 520px; }
.content.comparison .compareDonuts .donut.South-Asia { top: 170px; left: 660px; }
.content.comparison .compareDonuts .donut.East-Asia { top: 120px; left: 800px; }

.content.comparison .compareDonuts .donut .gauge .background {
    fill: #261800;
}
.content.comparison .compareDonuts .donut .gauge .foreground {
    fill: #F15A24;
}
.content.comparison .compareDonuts .donut .gauge .percent {
    font-size: 1em;
    font-family: sans-serif;
    font-weight: bold;
    text-anchor: middle;
    fill: #F15A24;
}

.content.comparison .compare {
    position: absolute;
    top: 0px;
}

.content.comparison .compare circle {
    fill-opacity: 0.5;
}

.content.comparison .compare.cyclones circle.y1970 { fill: #f05a23; }
.content.comparison .compare.cyclones circle.y2030 { fill: #c01a04; }

.content.comparison .compare.floods circle.y1970 { fill: #00a99d; }
.content.comparison .compare.floods circle.y2030 { fill: #00584b; }

.content.comparison .compare.population rect { fill-opacity: 0.75; }
.content.comparison .compare.population rect:nth-of-type(1) { fill: #f05a23; }
.content.comparison .compare.population rect:nth-of-type(2) { fill: #00a99d; }
.content.comparison .compare.population rect:nth-of-type(3) { fill-opacity:0; }

.content.comparison .compare.population .population text.value { 
	font-size: 12px;
	tex-transform: none; 
}

.content.comparison .compare.population .population text.value:nth-of-type(1) { fill: #f05a23; }
.content.comparison .compare.population .population text.value:nth-of-type(2) { fill: #f05a23; }
.content.comparison .compare.population .population text.value:nth-of-type(3) { fill: #00a99d; }

.content.comparison .compare.population .population text.legend:nth-of-type(1) { fill: #f05a23; }
.content.comparison .compare.population .population text.legend:nth-of-type(2) { fill: #f05a23; }
.content.comparison .compare.population .population text.legend:nth-of-type(3) { fill: #00a99d; }

.content.comparison .compare.population .population text.legend { 
	font-size: 12px;
	tex-transform: none; 
}

.content.comparison .compare text.name {
    text-transform: uppercase;
    font-size: 14px;
    font-weight: bold;
}

.content.comparison .compare text.units {
    text-transform: uppercase;
    font-size: 14px;
    font-weight: bold;
}

.content.comparison .compare text.value {
    text-transform: uppercase;
    font-size: 14px;
    font-weight: bold;
}

.content.comparison .compare.cyclones text.value {
    fill: #f05a23;
}

.content.comparison .compare.floods text.value {
    fill: #00a99d;
}

.content.comparison .compareBars rect.bar {
    fill: #F15A24;
    fill-opacity: 0.85;
}

.content.comparison .compareBars text.name, .content.comparison .compareCircles text.name2 {
    fill: #261800;
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
}

.content.comparison .compareBars text.value {
    fill: #00857B;
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
}

.content.comparison .compareCircles {
    position: absolute;
    top: 0px;
}

.content.comparison .compareCircles circle.region {
    fill: #F15A24;
    fill-opacity: 0.85;
}

.content.comparison .compareCircles text.name, .content.comparison .compareCircles text.name2 {
    fill: #261800;
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
}

.content.comparison .compareCircles text.value {
    fill: #00857B;
    font-size: 18px;
    font-weight: bold;
    text-transform: uppercase;
}

.content.comparison .comparePopups {
    position: absolute;
    top: 0px;
    width: 1000px;
}

.content.comparison .comparePopups .popup {
    position: absolute;
    top: 0px;
    background: #453E32;
}

.content.comparison .comparePopups .popup .pHeader .region {
	padding-left: 15px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-bottom: 2px solid black;
}

.content.comparison .comparePopups .popup .pHeader .close {
	position: absolute;
	right: 10px;
	top: 5px;
	color: white;
	cursor: pointer;
}

.content.comparison .comparePopups .popup .pHeader .close:hover {
	color: grey;
}

.content.comparison .comparePopups .popup .copy {
	padding-left: 15px;
	padding-right: 15px;
	padding-top: 5px;
	font-size: .7em;
	letter-spacing: 1px;
	padding-bottom: 5px;
}

.content.comparison .comparePopups .popup.master {
	position: absolute;
	top: 130px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	padding-bottom: 15px;
	padding-top: 34px;
	width: 500px;
	max-height: 400px;
}

.content.comparison .comparePopups .popup.master .pHeader {
	position: fixed;
	top: 0;
	left: 0;
	height: 34px;
	width: 100%;
}

.content.comparison .comparePopups .popup.master .copyContainer {
	overflow-y: scroll;
	overflow-x: hidden;
	position: relative;
	max-height: 350px;
}

.content.comparison .comparePopups .popup.master .copy a {
	color: white;
	text-decoration: underline;
}

.content.comparison .comparePopups .popup.master .copy em {
	font-style: italic;
}
.content.comparison .comparePopups .popup.master .copy sub {
	vertical-align: sub;
	font-size: 60%;
}

/* ADAPTATION */
.content.comparison .comparePopups .popup.North-America {
    top: 87px;
	left: 84px;
	width: 248px;
	height: 139px;
}

.content.comparison .comparePopups .popup.Latin-America {
    top: 256px;
	left: 84px;
	width: 256px;
    height: 144px;
}

.content.comparison .comparePopups .popup.Europe {
	top: 30px;
	left: 376px;
	width: 301px;
	height: 139px;
}

.content.comparison .comparePopups .popup.N-Africa-W-Asia {
	top: 180px;
	left: 376px;
	width: 222px;
	height: 154px;
}

.content.comparison .comparePopups .popup.Sub-Saharan-Africa {
	top: 353px;
	left: 376px;
	width: 250px;
	height: 199px;
}

.content.comparison .comparePopups .popup.East-Asia {
	top: 48px;
	left: 715px;
	width: 220px;
	height: 154px;
}

.content.comparison .comparePopups .popup.South-Asia {
	top: 222px;
	left: 627px;
	width: 280px;
	height: 109px;
}

/* MITIGATION */
.content.comparison .comparePopups.mitigation .popup.North-America {
	height: 94px;
}

.content.comparison .comparePopups.mitigation .popup.Latin-America {
	height: 109px;
}

.content.comparison .comparePopups.mitigation .popup.Europe {
	top: 30px;
	height: 94px;
}

.content.comparison .comparePopups.mitigation .popup.N-Africa-W-Asia {
	top: 179px;
	height: 109px;
}

.content.comparison .comparePopups.mitigation .popup.Sub-Saharan-Africa {
	height: 109px;
}

.content.comparison .comparePopups.mitigation .popup.East-Asia {
	top: 70px;
	height: 94px;
}

.content.comparison .comparePopups.mitigation .popup.South-Asia {
	height: 94px;
}

.content.comparison .footnote {
	position: relative;
	color: black;
	float: right;
	padding-right: 10px;
}

.content.comparison .sourceContainer {
	/*background-color: fuchsia;*/
	/*margin-top: 20px;*/
	height: 41px;
	width: 1000px;
	font-size: 10px;
	color: #D6CEBF;
}
.content.comparison .sourceContainer .button {
	float: left;
	border: 1px solid #D6CEBF;
	width: 100px;
	margin: 5px auto 0;
	color: white;
}

.content.comparison .sourceContainer .button .inner {
	position: relative;
	text-align: center;
	border: 4px solid #fff;
	background: #261800;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing: 1px;
	padding: 3px 0px;
}

.content.comparison .sourceContainer .button:hover .inner, .content.comparison .sourceContainer .button.selected .inner {
	background: #F15A24;
	-webkit-transition: All 0.2s ease;
    -moz-transition: All 0.2s ease;
    -o-transition: All 0.2s ease;
    transition: All 0.2s ease;
}

.content.comparison .sourceContainer .sources{
	float: left;
	color: black;
	width: 895px;
}

.content.comparison .sourceContainer .sources ul {
	float: left;
	margin-left: 20px;
}
.content.comparison .sourceContainer .sources ul li a {
	color: black;
	text-decoration: none;
}

.content.comparison .footer {
    position: absolute;
    top: 0px;
    right:  0px;
    width: 200px;
    /* border-top: 2px solid #D6CEBF; */
    /* padding: 20px; */
	height: auto;
	overflow:auto;
    /* margin-top: -60px; */
}

.content.comparison .footer .label {
	/* float: left; */
	/* margin: 0px 20px; */
	color: #222222;
	line-height: 35px;
	height: 35px;
	text-align: right;
}

.content.comparison .footer .button {
	float: right;
	border: 1px solid #D6CEBF;
	width: 100px;
	margin: 2px auto;
}

.content.comparison .footer .button .inner {
	position: relative;
	text-align: center;
	border: 4px solid #fff;
	background: #261800;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing: 1px;
	padding: 3px 0px;
}

.content.comparison .download.button {
	position: absolute;
	bottom: 50px;
	right: 0px;
	border: 1px solid #D6CEBF;
	width: 140px;
	margin: 2px auto;
}

.content.comparison .download.button .inner {
	position: relative;
	text-align: center;
	border: 4px solid #fff;
	background: #261800;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	font-size: 14px;
	letter-spacing: 1px;
	padding: 3px 0px;
}

.content.comparison .download.button:hover .inner {
	background: #F15A24;
}


.content.comparison .footer .button:hover .inner, .content.comparison .footer .button.selected .inner {
	background: #F15A24;
	-webkit-transition: All 0.2s ease;
    -moz-transition: All 0.2s ease;
    -o-transition: All 0.2s ease;
    transition: All 0.2s ease;
}

/* ==========================================================================
   Theme Pages
   ========================================================================== */

.content.themes {
    position: relative;
	
    top: 100px;
    padding: 20px 0px;
    /* overflow: auto; */
    height: auto;
}

.content.themes .hint {
	position: relative;
	margin: 10px 16px;
	width: 100%;
	height: 25px;
	background: url(../img/hint.png) no-repeat;
}

.content.themes > .theme {
    position: relative;
	
    top: 0px;
    left: 10px;
    width: 1000px;
}

.content.themes > .theme .infographic {
    
}

.content.themes > .theme .infographic {
	position: absolute;
	/*background: #000000;*/
}

.content.themes > .theme .infographic .source.button {
	position: absolute;
	left: 13px;
	bottom: 7px;
	font-size: 10px;
	text-transform: uppercase;
	color: #D6CEBF;
	letter-spacing: 1px;
	z-index: 1;
}

.content.themes > .theme .infographic .source.button a.download {
	position: absolute;
	left: 53px;
	bottom: -1px;
	width: 16px;
	height: 15px;
	background: url(../img/download_icon.png) no-repeat;
}

.content.themes > .theme .infographic .shroud {
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.75);
	display:none;
}

.content.themes > .theme .infographic .shroud .label {
	position: absolute;
	top: 40%;
	width: 100%;
	font-size: 20px;
	text-transform: uppercase;
	text-align: center;
}

.content.themes > .theme .infographic .expand {
    position: absolute;
    right: 0px;
    bottom: 0px;
    width: 50px;
    height: 50px;
    background: url(../img/button_sprites.png) 0px 0px no-repeat;
    z-index: 100;
    cursor: pointer; cursor: hand;
    -webkit-transition: All 0.5s ease;
    -moz-transition: All 0.5s ease;
    -o-transition: All 0.5s ease;
    transition: All 0.5s ease;
}

.content.themes > .theme .infographic:hover .expand {
	-webkit-transform: scale( 1.2 );
	-moz-transform: scale( 1.2 );
	-o-transform: scale( 1.2 );
	transform: scale( 1.2 );
	
	-webkit-transition: All 0.1s ease;
    -moz-transition: All 0.1s ease;
    -o-transition: All 0.1s ease;
    transition: All 0.1s ease;
}

.content.themes > .theme .infographic .card-container {
    position: absolute;
    perspective: 800px;
    -webkit-perspective: 800px;
	-moz-perspective: 800px;
	-o-perspective: 800px;
}

.content.themes > .theme .infographic .card {
    position: absolute;
    width: 100%;
    height: 100%;

   	-webkit-transition: -webkit-transform 0.5s;
	-moz-transition: -moz-transform 0.5s;
	-o-transition: -o-transform 0.5s;
	transition: transform 0.5s;
	
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.content.themes > .theme .infographic .card.flipped {
	-webkit-transform: rotateY( -180deg );
	-moz-transform: rotateY( -180deg );
	-o-transform: rotateY( -180deg );
	transform: rotateY( -180deg );
}

.content.themes > .theme .infographic .card .face {
  	position: absolute;
  	
  	/*backface-visibility: hidden;*/
  	-webkit-backface-visibility: hidden;
  	-moz-backface-visibility: hidden;
  	-o-backface-visibility: hidden;
  	
	-webkit-transform: rotateY(0);
	   -moz-transform: rotateY(0);
	     -o-transform: rotateY(0);
			transform: rotateY(0);
	/*-ms-word-break: break-all;
     word-break: break-all;

     // Non standard for webkit*/
     /*word-break: break-word;*/

	-webkit-hyphens: auto;
	   -moz-hyphens: auto;
	        hyphens: auto;
}

.content.themes > .theme .infographic .card .face.back {
	display: table;
	        
	transform: rotateY( 180deg );
	-webkit-transform: rotateY( 180deg );
	-moz-transform: rotateY( 180deg );
	-o-transform: rotateY( 180deg );
}

.content.themes > .theme .infographic .card .face.front {
	z-index: 2;
}

.content.themes > .theme .infographic .card.flipped .face.back {
	z-index: 2;
}

.content.themes > .theme .infographic .card .face.back .cell {
	display: table-cell;
	padding: 10px 20px;
	vertical-align:middle;
	font-family: Arial, Helvetica, sans-serif;
}

.content.themes > .theme .infographic .card .face.back .cell .title {
	font-size: 14px;
	font-weight: bold;
	text-transform: uppercase;
}

.content.themes > .theme .infographic .card .face.back .cell .source {
	font-size: 9px;
	padding: 10px 0px 20px;
	border-bottom: 1px solid #FFFFFF;
}

.content.themes > .theme .infographic .card .face.back .cell .source a {
	word-break: break-word;
}

.content.themes > .theme .infographic .card .face.back .cell .source p {
	margin: 1em;
}

.content.themes > .theme .infographic .card .face.back .cell .source a {
	color: #FFFFFF;
}

.content.themes > .theme .infographic .card .face.back .cell a.download {
	display: block;
	float:left;
	width: 85px;
	height: 15px;
	background: url(../img/download.png) no-repeat;
}

.content.themes > .theme .infographic .card .face.back .cell a.facebook {
	display: block;
	float:right;
	margin-top: 2px;
	margin-left: 10px;
	width: 16px;
	height: 16px;
	background: url(../img/facebook.png) no-repeat;
}

.content.themes > .theme .infographic .card .face.back .cell a.twitter {
	display: block;
	float:right;
	width: 20px;
	height: 16px;
	background: url(../img/twitter.png) no-repeat;
}

.content.themes > .theme .infographic .card .face.back.blue { background: #00857B; }
.content.themes > .theme .infographic .card .face.back.red { background: #CC4C1E; }
.content.themes > .theme .infographic .card .face.back.orange { background: #FFAA00; }

/* ==========================================================================
   Subtheme Pages
   ========================================================================== */

.content.subtheme {
    position: relative;
    top: 140px;
    padding: 20px 0px;
    color: #453E32;
    overflow: auto;
    height: auto;
}

.content.subtheme .column {
	float:left;
}

.content.subtheme .column.left {
	width: 65%;
}

.content.subtheme .column.right {
	width: 32.5%;
	margin-left: 2.5%;
}

.content.subtheme .column.left .title {
    text-transform: uppercase;
    font-size: 24px;
}

.content.subtheme .column.left .infographic {
    margin: 10px 0px;
    border-right: 2px solid #D6CEBF;
    border-bottom: 2px solid #D6CEBF;
}

.content.subtheme .column.left .sections {
	overflow: hidden;
}

.content.subtheme .column.left .sections .section {
	position: relative;
	padding: 10px 0px;
	border-bottom: 2px solid #D6CEBF;
	max-height: 32px;
	overflow:hidden;
	-webkit-transition: max-height 0.5s ease;
    -moz-transition: max-height 0.5s ease;
    -o-transition: max-height 0.5s ease;
    transition: max-height 0.5s ease;
}

.content.subtheme .column.left .sections .section em {
	font-style: italic;
}

.content.subtheme .column.left .sections .section strong {
	font-weight: bold;
}

.content.subtheme .column.left .sections .section sub {
	vertical-align: sub;
	font-size: 60%;
}

.content.subtheme .column.left .sections .section.accordionOpen {
	max-height: 4000px;
	-webkit-transition: max-height 1s ease;
    -moz-transition: max-height 1s ease;
    -o-transition: max-height 1s ease;
    transition: max-height 1s ease;
}

.content.subtheme .column.left .sections .section .accordionButton {
	position: absolute;
	font-family: Arial, Helvetica, sans-serif;
	/* font-weight: bold; */
	top: 20px;
	right: 40px;
	width: 20px;
	height: 20px;
	border-radius: 10px;
	color: #FFFFFF;
	background: #453E32;
	text-align:center;
	line-height: 22px;
	font-size: 20px;
}

.content.subtheme .column.left .sections .section.accordionOpen .accordionButton {
	line-height: 18px;
}

.content.subtheme .column.left .sections .section .accordionButton:before {
	content: '+';
}

.content.subtheme .column.left .sections .section.accordionOpen .accordionButton:before{
	content: '-';
}

.content.subtheme .column.left .sections .section .heading {
	color: #FFBC00;
	text-transform: uppercase;
	padding: 10px 0px;
}

.content.subtheme .column.left .sections .section .copy {
    height: auto;
	
    overflow: auto;
}

.content.subtheme .column.left .sections .section p {
    margin: 10px 5px;
	
}

.content.subtheme .column.left .sections .section ul {
    list-style: disc;
    padding-left: 20px;
}

.content.subtheme .column.left .sections .section ul li {
    margin: 1em 0;
    /*text-indent: -20px;*/
}

.content.subtheme .column.left .sections .section ul li a {
    word-break: break-word;
}

.content.subtheme .column.left .sections .section h3.tableTitle {
	margin-bottom: 10px;
}

/*FOOD EMISSIONS - DIRECT AGRICULTURAL EMMISSIONS TABLE*/
.content.subtheme .column.left .sections .section table.FE-DAE {
	border: thin solid #FFBC00;
	/*font-size: .9em;*/
}
.content.subtheme .column.left .sections .section table.FE-DAE tr {
	border-bottom: thin solid #FFBC00;
}
.content.subtheme .column.left .sections .section table.FE-DAE tr th {
	text-align: left;
	padding-left: 5px;
}
.content.subtheme .column.left .sections .section table.FE-DAE tr td {
	text-align: left;
	padding-left: 5px;
	width: 150px;
}
.content.subtheme .column.left .sections .section table.FE-DAE .tableHeader {
	background-color: #FFBC00;
	color: white;
	text-align: left;
}
.content.subtheme .column.left .sections .section table.FE-DAE .tableSubTitle td {
	text-align: center;
	border-bottom: 3px solid #FFBC00;
}

/*ADAPTATION - FISHERIES TABLE*/
.content.subtheme .column.left .sections .section table.A-F {
	border-collapse: collapse;
	text-align: left;
	margin-bottom: 10px;
}
.content.subtheme .column.left .sections .section table.A-F th {
	background-color: #FFBC00;
	color: white;
}
.content.subtheme .column.left .sections .section table.A-F, .content.subtheme .column.left .sections .section table.A-F th, .content.subtheme .column.left .sections .section table.A-F td {
	border: thin solid #FFBC00;
}
.content.subtheme .column.left .sections .section table.A-F tr td:first-child {
	width: 200px;
}
.content.subtheme .column.left .sections .section table.A-F tr td, .content.subtheme .column.left .sections .section table.A-F tr th {
	padding: 0 5px;
}

/*MITIGATION - SUPPLY CHAIN*/
.content.subtheme .column.left .sections .section table.M-SC {
	border-collapse: collapse;
	text-align: left;
	margin-bottom: 10px;
}
.content.subtheme .column.left .sections .section table.M-SC th {
	background-color: #FFBC00;
	color: white;
}
.content.subtheme .column.left .sections .section table.M-SC, .content.subtheme .column.left .sections .section table.M-SC th, .content.subtheme .column.left .sections .section table.M-SC td {
	border: thin solid #FFBC00;
}
.content.subtheme .column.left .sections .section table.M-SC tr td:first-child {
	/*width: 200px;*/
}
.content.subtheme .column.left .sections .section table.M-SC tr td, .content.subtheme .column.left .sections .section table.M-SC tr th {
	padding: 0 5px;
}

/*MITIGATION - DIRECT EMISSIONS*/
.content.subtheme .column.left .sections .section table.M-DE {
	border-collapse: collapse;
	text-align: left;
	margin-bottom: 10px;
}
.content.subtheme .column.left .sections .section table.M-DE th {
	background-color: #FFBC00;
	color: white;
}
.content.subtheme .column.left .sections .section table.M-DE, .content.subtheme .column.left .sections .section table.M-DE th, .content.subtheme .column.left .sections .section table.M-DE td {
	border: thin solid #FFBC00;
}
.content.subtheme .column.left .sections .section table.M-DE tr td:first-child {
	width: 175px;
}
.content.subtheme .column.left .sections .section table.M-DE tr td, .content.subtheme .column.left .sections .section table.M-DE tr th {
	padding: 0 5px;
}


.content.subtheme .column.right .subthemes {
	border-bottom: 2px solid #D6CEBF;
	padding: 32px 0px;
}

.content.subtheme .column.right .subthemes .subtitle {
	color: #FFBC00;
	text-transform: uppercase;
}

.content.subtheme .column.right .subthemes ul {
    list-style: disc;
    color: #FFBC00;    
    padding: 10px 20px;
}

.content.subtheme .column.right .subthemes ul li.button {
    margin: 4px 0px;
}

.content.subtheme .column.right .subthemes ul li span {
	color: #453E32;
	-webkit-transition: All 0.2s ease;
    -moz-transition: All 0.2s ease;
    -o-transition: All 0.2s ease;
    transition: All 0.2s ease;
}

.content.subtheme .column.right .subthemes ul li.button:hover span {
    color: #FFBC00;
}

.content.subtheme .column.right a.pdf-download {
	display:block;
	text-transform: uppercase;
	text-align: center;
	border-radius: 5px;
	height: 52px;
	line-height: 52px;
	font-size: 22px;
	letter-spacing: 1px;
	color: #FFFFFF;
	background: #00A99D;
	text-decoration: none;
	margin: 30px 0px;
	
	-webkit-transition: All 0.2s ease;
    -moz-transition: All 0.2s ease;
    -o-transition: All 0.2s ease;
    transition: All 0.2s ease;
}

.content.subtheme .column.right a.pdf-download:hover {
	background: #FFBC00;
}

.content.subtheme .column.right a.learn-more {
	display:block;
	text-transform: uppercase;
	text-align: center;
	border-radius: 5px;
	height: 52px;
	line-height: 52px;
	font-size: 16px;
	letter-spacing: 1px;
	color: #FFFFFF;
	background: #00A99D;
	text-decoration: none;
	margin: 30px 0px 15px;
	
	-webkit-transition: All 0.2s ease;
    -moz-transition: All 0.2s ease;
    -o-transition: All 0.2s ease;
    transition: All 0.2s ease;
}

.content.subtheme .column.right a.learn-more:hover {
	background: #FFBC00;
}

.content.subtheme .column.right iframe {
	width: 100%;
	height: 362px;
	overflow: hidden;
}

.content.subtheme .column.right .bigFacts {
	background-color: #FFBC00;
	height: 360px;
	border-radius: 5px;
}

.content.subtheme .column.right .bigFacts .title {
	width: 100%;
	line-height: 52px;
	font-size: 22px;
	letter-spacing: 1px;
	color: #FFFFFF;
	text-align: center;
	text-transform: uppercase;
}

.content.subtheme .column.right .bigFacts .fact {
	height: 80px;
	width: 300px;
	margin: auto;
	border-bottom: 3px solid black;
	margin-bottom: 20px;
}

.content.subtheme .column.right .bigFacts .fact .img {
	width: 130px;
	height: 80px;
	float: left;
	position: relative;
	background-color: grey;
}

.content.subtheme .column.right .bigFacts .fact .img .triangle {
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 1000;
}

.content.subtheme .column.right .bigFacts .fact .text {
	width: 150px;
	height: 75px;
	padding: 5px 10px 0px;
	float: left;
	background-color: #FFFFFF;
	font-size: .8em;
	vertical-align: middle;
}

/* ==========================================================================
   Case Study Subtheme Pages
   ========================================================================== */

.content.csSubtheme {
    position: relative;
    top: 140px;
    padding: 20px 0px;
    color: #453E32;
    overflow: auto;
    height: auto;
}

.content.csSubtheme .column {
	float:left;
}

.content.csSubtheme .column.left {
	width: 65%;
}

.content.csSubtheme .column.right {
	width: 32.5%;
	margin-left: 2.5%;
}

.content.csSubtheme .column.left .title {
    text-transform: uppercase;
    font-size: 24px;
}

/*
	.content.csSubtheme .column.left .infographic {
		position: relative;
	    margin: 10px 0px;
	    border-right: 2px solid #D6CEBF;
	    border-bottom: 2px solid #D6CEBF;
	}

	.content.csSubtheme .infographic .expand {
	    position: absolute;
	    right: 0px;
	    bottom: 0px;
	    width: 50px;
	    height: 50px;
	    background: url(../img/button_sprites.png) 0px 0px no-repeat;
	    z-index: 100;
	    cursor: pointer; cursor: hand;
	    -webkit-transition: All 0.5s ease;
	    -moz-transition: All 0.5s ease;
	    -o-transition: All 0.5s ease;
	    transition: All 0.5s ease;
	}

	.content.csSubtheme .infographic:hover .expand {
		-webkit-transform: scale( 1.2 );
		-moz-transform: scale( 1.2 );
		-o-transform: scale( 1.2 );
		transform: scale( 1.2 );
		
		-webkit-transition: All 0.1s ease;
	    -moz-transition: All 0.1s ease;
	    -o-transition: All 0.1s ease;
	    transition: All 0.1s ease;
	}

	.content.csSubtheme .column.left .sections {
		overflow: hidden;
	}

	.content.csSubtheme .column.left .sections .section {
		position: relative;
		padding: 10px 0px;
		border-bottom: 2px solid #D6CEBF;
		max-height: 32px;
		overflow:hidden;
		-webkit-transition: max-height 0.5s ease;
	    -moz-transition: max-height 0.5s ease;
	    -o-transition: max-height 0.5s ease;
	    transition: max-height 0.5s ease;
	}

	.content.csSubtheme .column.left .sections .section em {
		font-style: italic;
	}

	.content.csSubtheme .column.left .sections .section strong {
		font-weight: bold;
	}

	.content.csSubtheme .column.left .sections .section sub {
		vertical-align: sub;
		font-size: 60%;
	}

	.content.csSubtheme .column.left .sections .section.accordionOpen {
		max-height: 4000px;
		-webkit-transition: max-height 1s ease;
	    -moz-transition: max-height 1s ease;
	    -o-transition: max-height 1s ease;
	    transition: max-height 1s ease;
	}

	.content.csSubtheme .column.left .sections .section .accordionButton {
		position: absolute;
		font-family: Arial, Helvetica, sans-serif;
		top: 20px;
		right: 40px;
		width: 20px;
		height: 20px;
		border-radius: 10px;
		color: #FFFFFF;
		background: #453E32;
		text-align:center;
		line-height: 22px;
		font-size: 20px;
	}

	.content.csSubtheme .column.left .sections .section.accordionOpen .accordionButton {
		line-height: 18px;
	}

	.content.csSubtheme .column.left .sections .section .accordionButton:before {
		content: '+';
	}

	.content.csSubtheme .column.left .sections .section.accordionOpen .accordionButton:before{
		content: '-';
	}

	.content.csSubtheme .column.left .sections .section .heading {
		color: #FFBC00;
		text-transform: uppercase;
		padding: 10px 0px;
	}

	.content.csSubtheme .column.left .sections .section .copy {
	    height: auto;
		
	    overflow: auto;
	}

	.content.csSubtheme .column.left .sections .section p {
	    margin: 10px 5px;
		
	}

	.content.csSubtheme .column.left .sections .section ul {
	    list-style: disc;
	    padding-left: 20px;
	}

	.content.csSubtheme .column.left .sections .section ul li {
	    margin: 1em 0;
	}

	.content.csSubtheme .column.left .sections .section ul li a {
	    word-break: break-word;
	}

	.content.csSubtheme .column.left .sections .section h3.tableTitle {
		margin-bottom: 10px;
	}*/

.content.csSubtheme .column.right .subthemes {
	border-bottom: 2px solid #D6CEBF;
	padding: 32px 0px;
}

.content.csSubtheme .column.right .subthemes .subtitle {
	color: #FFBC00;
	text-transform: uppercase;
}

.content.csSubtheme .column.right .subthemes ul {
    list-style: disc;
    color: #FFBC00;    
    padding: 10px 20px;
}

.content.csSubtheme .column.right .subthemes ul li.button {
    margin: 4px 0px;
}

.content.csSubtheme .column.right .subthemes ul li span {
	color: #453E32;
	-webkit-transition: All 0.2s ease;
    -moz-transition: All 0.2s ease;
    -o-transition: All 0.2s ease;
    transition: All 0.2s ease;
}

.content.csSubtheme .column.right .subthemes ul li.button:hover span {
    color: #FFBC00;
}

.content.csSubtheme .column.right a.pdf-download {
	display:block;
	text-transform: uppercase;
	text-align: center;
	border-radius: 5px;
	height: 52px;
	line-height: 52px;
	font-size: 22px;
	letter-spacing: 1px;
	color: #FFFFFF;
	background: #00A99D;
	text-decoration: none;
	margin: 30px 0px;
	
	-webkit-transition: All 0.2s ease;
    -moz-transition: All 0.2s ease;
    -o-transition: All 0.2s ease;
    transition: All 0.2s ease;
}

.content.csSubtheme .column.right a.pdf-download:hover {
	background: #FFBC00;
}

.content.csSubtheme .column.right a.learn-more {
	display:block;
	text-transform: uppercase;
	text-align: center;
	border-radius: 5px;
	height: 52px;
	line-height: 52px;
	font-size: 16px;
	letter-spacing: 1px;
	color: #FFFFFF;
	background: #00A99D;
	text-decoration: none;
	margin: 30px 0px 15px;
	
	-webkit-transition: All 0.2s ease;
    -moz-transition: All 0.2s ease;
    -o-transition: All 0.2s ease;
    transition: All 0.2s ease;
}

.content.csSubtheme .column.right a.learn-more:hover {
	background: #FFBC00;
}

.content.csSubtheme .column.right iframe {
	width: 100%;
	height: 362px;
	overflow: hidden;
}

.content.csSubtheme .column.right .bigFacts {
	background-color: #FFBC00;
	height: 360px;
	border-radius: 5px;
}

.content.csSubtheme .column.right .bigFacts .title {
	width: 100%;
	line-height: 52px;
	font-size: 22px;
	letter-spacing: 1px;
	color: #FFFFFF;
	text-align: center;
	text-transform: uppercase;
}

.content.csSubtheme .column.right .bigFacts .fact {
	height: 80px;
	width: 300px;
	margin: auto;
	border-bottom: 3px solid black;
	margin-bottom: 20px;
}

.content.csSubtheme .column.right .bigFacts .fact .img {
	width: 130px;
	height: 80px;
	float: left;
	position: relative;
	background-color: grey;
}

.content.csSubtheme .column.right .bigFacts .fact .img .triangle {
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 1000;
}

.content.csSubtheme .column.right .bigFacts .fact .text {
	width: 150px;
	height: 75px;
	padding: 5px 10px 0px;
	float: left;
	background-color: #FFFFFF;
	font-size: .8em;
	vertical-align: middle;
}

.content.csSubtheme .column.left .infographic {
	position: relative;
	width: 660px;
	height: 320px;
}
.content.csSubtheme .column.left .infographic .cards {
	width: 660px;
	height: 320px;
}

.content.csSubtheme .column.left .infographic .source.button {
	position: absolute;
	left: 13px;
	bottom: 7px;
	font-size: 10px;
	text-transform: uppercase;
	color: #D6CEBF;
	letter-spacing: 1px;
	z-index: 1;
}

.content.csSubtheme .column.left .infographic .source.button a.download {
	position: absolute;
	left: 53px;
	bottom: -1px;
	width: 16px;
	height: 15px;
	background: url(../img/download_icon.png) no-repeat;
}

.content.csSubtheme .column.left .infographic .shroud {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.75);
	display:none;
}

.content.csSubtheme .column.left .infographic .shroud .label {
	position: absolute;
	top: 40%;
	width: 100%;
	font-size: 20px;
	text-transform: uppercase;
	text-align: center;
	width: 90%;
	padding: 0 5%;
	color: white;
}

.content.csSubtheme .column.left .infographic .expand {
    position: absolute;
    right: 0px;
    bottom: 0px;
    width: 50px;
    height: 50px;
    background: url(../img/button_sprites.png) 0px 0px no-repeat;
    z-index: 100;
    cursor: pointer; cursor: hand;
    -webkit-transition: All 0.5s ease;
    -moz-transition: All 0.5s ease;
    -o-transition: All 0.5s ease;
    transition: All 0.5s ease;
}

.content.csSubtheme .column.left .infographic:hover .expand {
	-webkit-transform: scale( 1.2 );
	-moz-transform: scale( 1.2 );
	-o-transform: scale( 1.2 );
	transform: scale( 1.2 );
	
	-webkit-transition: All 0.1s ease;
    -moz-transition: All 0.1s ease;
    -o-transition: All 0.1s ease;
    transition: All 0.1s ease;
}

.content.csSubtheme .column.left .infographic .card-container {
    position: absolute;
    perspective: 800px;
    -webkit-perspective: 800px;
	-moz-perspective: 800px;
	-o-perspective: 800px;
	width: 660px;
	height: 320px;
}

.content.csSubtheme .column.left .infographic .card {
    position: absolute;
    width: 660px;
	height: 320px;

   	-webkit-transition: -webkit-transform 0.5s;
	-moz-transition: -moz-transform 0.5s;
	-o-transition: -o-transform 0.5s;
	transition: transform 0.5s;
	
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	-o-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.content.csSubtheme .column.left .infographic .card.flipped {
	-webkit-transform: rotateY( -180deg );
	-moz-transform: rotateY( -180deg );
	-o-transform: rotateY( -180deg );
	transform: rotateY( -180deg );
}

.content.csSubtheme .column.left .infographic .card .face {
  	position: absolute;
  	
  	/*backface-visibility: hidden;*/
  	-webkit-backface-visibility: hidden;
  	-moz-backface-visibility: hidden;
  	-o-backface-visibility: hidden;
  	
	-webkit-transform: rotateY(0);
	   -moz-transform: rotateY(0);
	     -o-transform: rotateY(0);
			transform: rotateY(0);
	/*-ms-word-break: break-all;
     word-break: break-all;

     // Non standard for webkit*/
     /*word-break: break-word;*/

	-webkit-hyphens: auto;
	   -moz-hyphens: auto;
	        hyphens: auto;
}

.content.csSubtheme .column.left .infographic .card .face.back {
	display: table;
	        
	transform: rotateY( 180deg );
	-webkit-transform: rotateY( 180deg );
	-moz-transform: rotateY( 180deg );
	-o-transform: rotateY( 180deg );
}

.content.csSubtheme .column.left .infographic .card .face.front {
	z-index: 2;
	width: 660px;
	height: 320px;
}
.content.csSubtheme .column.left .infographic .card .face.front img {
	width: 660px;
	height: 320px;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	border-right: 2px solid #D6CEBF;
	border-bottom: 2px solid #D6CEBF;
}

.content.csSubtheme .column.left .infographic .card .face.back {
	width: 660px;
	height: 320px;
}

.content.csSubtheme .column.left .infographic .card.flipped .face.back {
	z-index: 2;
}

.content.csSubtheme .column.left .infographic .card .face.back .cell {
	display: table-cell;
	padding: 10px 20px;
	vertical-align:middle;
	font-family: Arial, Helvetica, sans-serif;
	color: white;
}

.content.csSubtheme .column.left .infographic .card .face.back .cell .title {
	font-size: 14px;
	font-weight: bold;
	text-transform: uppercase;
}

.content.csSubtheme .column.left .infographic .card .face.back .cell .source {
	font-size: 9px;
	padding: 10px 0px 20px;
	border-bottom: 1px solid #FFFFFF;
}

.content.csSubtheme .column.left .infographic .card .face.back .cell .source a {
	word-break: break-word;
}

.content.csSubtheme .column.left .infographic .card .face.back .cell .source p {
	margin: 1em;
}

.content.csSubtheme .column.left .infographic .card .face.back .cell .source a {
	color: #FFFFFF;
}

.content.csSubtheme .column.left .infographic .card .face.back .cell a.download {
	display: block;
	float:left;
	width: 85px;
	height: 15px;
	background: url(../img/download.png) no-repeat;
}

.content.csSubtheme .column.left .infographic .card .face.back .cell a.facebook {
	display: block;
	float:right;
	margin-top: 2px;
	margin-left: 10px;
	width: 16px;
	height: 16px;
	background: url(../img/facebook.png) no-repeat;
}

.content.csSubtheme .column.left .infographic .card .face.back .cell a.twitter {
	display: block;
	float:right;
	width: 20px;
	height: 16px;
	background: url(../img/twitter.png) no-repeat;
}

.content.csSubtheme .column.left .infographic .card .face.back.blue { background: #00857B; }
.content.csSubtheme .column.left .infographic .card .face.back.red { background: #CC4C1E; }
.content.csSubtheme .column.left .infographic .card .face.back.orange { background: #FFAA00; }

/* ==========================================================================
   Case Study Pages
   ========================================================================== */

.content.casestudy {
    position: relative;
    top: 140px;
    padding: 20px 0px;
    color: #453E32;
    overflow: auto;
    height: auto;
}

.content.casestudy .column {
	float:left;
}

.content.casestudy .column.left {
	width: 65%;
}

.content.casestudy .column.right {
	width: 32.5%;
	margin-left: 2.5%;
}

.content.casestudy .column.left .title {
    text-transform: uppercase;
    font-size: 24px;
}

.content.casestudy .column.left .infographic {
    margin: 10px 0px;
    border-right: 2px solid #D6CEBF;
    border-bottom: 2px solid #D6CEBF;
}

.content.casestudy .column.left .sections {
	overflow: hidden;
}

.content.casestudy .column.left .sections .section {
	position: relative;
	padding: 10px 0px;
	border-bottom: 2px solid #D6CEBF;
	max-height: 32px;
	overflow:hidden;
	-webkit-transition: max-height 0.5s ease;
    -moz-transition: max-height 0.5s ease;
    -o-transition: max-height 0.5s ease;
    transition: max-height 0.5s ease;
}

.content.casestudy .column.left .sections .section.casestudy {
	max-height: 75px;
}

.content.casestudy .column.left .sections.india .section:first-of-type {
	background: url(../img/themes/evidence-of-success/maps/062415-CGIAR-maps_india.png) no-repeat;
	background-position: center 150px;
}
.content.casestudy .column.left .sections.africa .section:first-of-type {
	background: url(../img/themes/evidence-of-success/maps/062415-CGIAR-maps_africa.png) no-repeat;
	background-position: center 150px;
}
.content.casestudy .column.left .sections.vietnam .section:first-of-type {
	background: url(../img/themes/evidence-of-success/maps/062415-CGIAR-maps_vietnam.png) no-repeat;
	background-position: center 150px;
}
.content.casestudy .column.left .sections.pacificisland .section:first-of-type {
	background: url(../img/themes/evidence-of-success/maps/062415-CGIAR-maps_pac-island_states.png) no-repeat;
	background-position: center 150px;
}
.content.casestudy .column.left .sections.china .section:first-of-type {
	background: url(../img/themes/evidence-of-success/maps/062415-CGIAR-maps_china.png) no-repeat;
	background-position: center 150px;
}
.content.casestudy .column.left .sections.kenya .section:first-of-type {
	background: url(../img/themes/evidence-of-success/maps/062415-CGIAR-maps_kenya.png) no-repeat;
	background-position: center 150px;
}
.content.casestudy .column.left .sections.nicaragua .section:first-of-type {
	background: url(../img/themes/evidence-of-success/maps/062415-CGIAR-maps_nicaragua.png) no-repeat;
	background-position: center 150px;
}
.content.casestudy .column.left .sections.eastafrica .section:first-of-type {
	background: url(../img/themes/evidence-of-success/maps/062415-CGIAR-maps_africa-east.png) no-repeat;
	background-position: center 20px;
}
.content.casestudy .column.left .sections.brazil .section:first-of-type {
	background: url(../img/themes/evidence-of-success/maps/062415-CGIAR-maps_brazil.png) no-repeat;
	background-position: center 150px;
}
.content.casestudy .column.left .sections.denmark .section:first-of-type {
	background: url(../img/themes/evidence-of-success/maps/062415-CGIAR-maps_denmark.png) no-repeat;
	background-position: center 150px;
}
.content.casestudy .column.left .sections.senegal .section:first-of-type {
	background: url(../img/themes/evidence-of-success/maps/062415-CGIAR-maps_africa-west-senegal.png) no-repeat;
	background-position: center 150px;
}
.content.casestudy .column.left .sections.kenyaethiopia .section:first-of-type {
	background: url(../img/themes/evidence-of-success/maps/062415-CGIAR-maps_kenya-ethiopia.png) no-repeat;
	background-position: center 150px;
}
/*.content.casestudy .column.left .sections.india .section:first-of-type {
	background: url(../img/themes/evidence-of-success/maps/062415-CGIAR-maps_pac-island_states.png) no-repeat;
	background-position: center 150px;
}
.content.casestudy .column.left .sections.india .section:first-of-type {
	background: url(../img/themes/evidence-of-success/maps/062415-CGIAR-maps_pac-island_states.png) no-repeat;
	background-position: center 150px;
}*/

.content.casestudy .column.left .sections .section em {
	font-style: italic;
}

.content.casestudy .column.left .sections .section strong {
	font-weight: bold;
}

.content.casestudy .column.left .sections .section sub {
	vertical-align: sub;
	font-size: 60%;
}

.content.casestudy .column.left .sections .section.accordionOpen {
	max-height: 4000px;
	-webkit-transition: max-height 1s ease;
    -moz-transition: max-height 1s ease;
    -o-transition: max-height 1s ease;
    transition: max-height 1s ease;
}

.content.casestudy .column.left .sections .section .accordionButton {
	position: absolute;
	font-family: Arial, Helvetica, sans-serif;
	/* font-weight: bold; */
	top: 20px;
	right: 40px;
	width: 20px;
	height: 20px;
	border-radius: 10px;
	color: #FFFFFF;
	background: #453E32;
	text-align:center;
	line-height: 22px;
	font-size: 20px;
}

.content.casestudy .column.left .sections .section.accordionOpen .accordionButton {
	line-height: 18px;
}

.content.casestudy .column.left .sections .section .accordionButton:before {
	content: '+';
}

.content.casestudy .column.left .sections .section.accordionOpen .accordionButton:before{
	content: '-';
}

.content.casestudy .column.left .sections .section .heading {
	color: #FFBC00;
	text-transform: uppercase;
	padding: 10px 0px;
}
.content.casestudy .column.left .sections .section.casestudy .heading {
	padding-right: 70px;
}

.content.casestudy .column.left .sections .section .subheading {
	color: #FFBC00;
	text-transform: uppercase;
	border-top: 2px solid #D6CEBF;
	padding-top: 15px;
	margin-top: 15px;
}
.content.casestudy .column.left .sections .section .subheading:first-child {
	border-top: none;
	padding-top: 0;
	margin-top: 0;
}

.content.casestudy .column.left .sections .section span.bigBold {
	font-weight: bold;
	text-transform: uppercase;
}

.content.casestudy .column.left .sections .section .copy {
    height: auto;
	
    overflow: auto;
}

.content.casestudy .column.left .sections .section p {
    margin: 10px 5px;
	
}

.content.casestudy .column.left .sections .section ul {
    list-style: disc;
    padding-left: 20px;
}

.content.casestudy .column.left .sections .section ul li {
    margin: 1em 0;
    /*text-indent: -20px;*/
}

.content.casestudy .column.left .sections .section ul li a {
    word-break: break-word;
}

.content.casestudy .column.left .sections .section h3.tableTitle {
	margin-bottom: 10px;
}

.content.casestudy .column.right .subthemes {
	border-bottom: 2px solid #D6CEBF;
	padding: 32px 0px;
}

.content.casestudy .column.right .subthemes .subtitle {
	color: #FFBC00;
	text-transform: uppercase;
}

.content.casestudy .column.right .subthemes ul {
    list-style: disc;
    color: #FFBC00;    
    padding: 10px 20px;
}

.content.casestudy .column.right .subthemes ul li.button {
    margin: 4px 0px;
}

.content.casestudy .column.right .subthemes ul li span {
	color: #453E32;
	-webkit-transition: All 0.2s ease;
    -moz-transition: All 0.2s ease;
    -o-transition: All 0.2s ease;
    transition: All 0.2s ease;
}

.content.casestudy .column.right .subthemes ul li.button:hover span {
    color: #FFBC00;
}

.content.casestudy .column.right a.pdf-download {
	display:block;
	text-transform: uppercase;
	text-align: center;
	border-radius: 5px;
	height: 52px;
	line-height: 52px;
	font-size: 22px;
	letter-spacing: 1px;
	color: #FFFFFF;
	background: #00A99D;
	text-decoration: none;
	margin: 30px 0px;
	
	-webkit-transition: All 0.2s ease;
    -moz-transition: All 0.2s ease;
    -o-transition: All 0.2s ease;
    transition: All 0.2s ease;
}

.content.casestudy .column.right a.pdf-download:hover {
	background: #FFBC00;
}

.content.casestudy .column.right a.learn-more {
	display:block;
	text-transform: uppercase;
	text-align: center;
	border-radius: 5px;
	height: 52px;
	line-height: 52px;
	font-size: 16px;
	letter-spacing: 1px;
	color: #FFFFFF;
	background: #00A99D;
	text-decoration: none;
	margin: 30px 0px 15px;
	
	-webkit-transition: All 0.2s ease;
    -moz-transition: All 0.2s ease;
    -o-transition: All 0.2s ease;
    transition: All 0.2s ease;
}

.content.casestudy .column.right a.learn-more:hover {
	background: #FFBC00;
}

.content.casestudy .column.right iframe {
	width: 100%;
	height: 362px;
	overflow: hidden;
}

.content.casestudy .column.right .bigFacts {
	background-color: #FFBC00;
	height: 360px;
	border-radius: 5px;
}

.content.casestudy .column.right .bigFacts .title {
	width: 100%;
	line-height: 52px;
	font-size: 22px;
	letter-spacing: 1px;
	color: #FFFFFF;
	text-align: center;
	text-transform: uppercase;
}

.content.casestudy .column.right .bigFacts .fact {
	height: 80px;
	width: 300px;
	margin: auto;
	border-bottom: 3px solid black;
	margin-bottom: 20px;
}

.content.casestudy .column.right .bigFacts .fact .img {
	width: 130px;
	height: 80px;
	float: left;
	position: relative;
	background-color: grey;
}

.content.casestudy .column.right .bigFacts .fact .img .triangle {
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 1000;
}

.content.casestudy .column.right .bigFacts .fact .text {
	width: 150px;
	height: 75px;
	padding: 5px 10px 0px;
	float: left;
	background-color: #FFFFFF;
	font-size: .8em;
	vertical-align: middle;
}

/* ==========================================================================
   About Page
   ========================================================================== */

.content.about {
    position: relative;
    top: 140px;
    padding: 20px 0px;
    color: #453E32;
    overflow: auto;
    height: auto;
}

.content.about .column {
	float:left;
}

.content.about .column.left {
	width: 65%;
}

.content.about .column.left p {
	margin: 10px 0px;
}

.content.about .column.left em {
	font-weight: bold;
	text-decoration: underline;
}

.content.about .column.right {
	width: 32.5%;
	margin-left: 2.5%;
}

.content.about .column.left .title {
    text-transform: uppercase;
    font-size: 24px;
}

.content.about .column.right iframe {
	width: 100%;
	height: 360px;
}

.content.about .column.right .bigFacts {
	background-color: #FFBC00;
	height: 360px;
	border-radius: 5px;
}

.content.about .column.right .bigFacts .title {
	width: 100%;
	line-height: 52px;
	font-size: 22px;
	letter-spacing: 1px;
	color: #FFFFFF;
	text-align: center;
	text-transform: uppercase;
}

.content.about .column.right .bigFacts .fact {
	height: 80px;
	width: 300px;
	margin: auto;
	border-bottom: 3px solid black;
	margin-bottom: 20px;
}

.content.about .column.right .bigFacts .fact .img {
	width: 130px;
	height: 80px;
	float: left;
	position: relative;
	background-color: grey;
}

.content.about .column.right .bigFacts .fact .img .triangle {
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 1000;
}

.content.about .column.right .bigFacts .fact .text {
	width: 150px;
	height: 75px;
	padding: 5px 10px 0px;
	float: left;
	background-color: #FFFFFF;
	font-size: .8em;
	vertical-align: middle;
}

/* ==========================================================================
   Region Page
   Latin America
   ========================================================================== */

.content.regions.Latin-America, .content.regions > .region.Latin-America {
    height: 1830px;
    width: 980px;
}

.region.Latin-America .infographic:nth-of-type(1) { top: 0px; left: 0px; }
.region.Latin-America .infographic:nth-of-type(2) { top: 0px; left: 400px; }
.region.Latin-America .infographic:nth-of-type(3) { top: 460px; left: 0px; }
.region.Latin-America .infographic:nth-of-type(4) { top: 460px; left: 660px; }
.region.Latin-America .infographic:nth-of-type(5) { top: 950px; left: 0px; }
.region.Latin-America .infographic:nth-of-type(6) { top: 950px; left: 490px; }
.region.Latin-America .infographic:nth-of-type(7) { top: 1370px; left: 0px; }
.region.Latin-America .infographic:nth-of-type(8) { top: 1370px; left: 520px; }

/* ==========================================================================
   Region Page
   North America
   ========================================================================== */

.content.regions.North-America, .content.regions > .region.North-America {
    height: 1830px;
    width: 980px;
}

.region.North-America .infographic:nth-of-type(1) { top: 0px; left: 0px; }
.region.North-America .infographic:nth-of-type(2) { top: 0px; left: 400px; }
.region.North-America .infographic:nth-of-type(3) { top: 460px; left: 0px; }
.region.North-America .infographic:nth-of-type(4) { top: 460px; left: 660px; }
.region.North-America .infographic:nth-of-type(5) { top: 950px; left: 0px; }
.region.North-America .infographic:nth-of-type(6) { top: 950px; left: 490px; }
.region.North-America .infographic:nth-of-type(7) { top: 1370px; left: 0px; }
.region.North-America .infographic:nth-of-type(8) { top: 1370px; left: 400px; }

/* ==========================================================================
   Region Page
   Europe
   ========================================================================== */

.content.regions.Europe, .content.regions > .region.Europe {
    height: 1830px;
    width: 980px;
}

.region.Europe .infographic:nth-of-type(1) { top: 0px; left: 0px; }
.region.Europe .infographic:nth-of-type(2) { top: 0px; left: 400px; }
.region.Europe .infographic:nth-of-type(3) { top: 460px; left: 0px; }
.region.Europe .infographic:nth-of-type(4) { top: 460px; left: 660px; }
.region.Europe .infographic:nth-of-type(5) { top: 950px; left: 0px; }
.region.Europe .infographic:nth-of-type(6) { top: 950px; left: 490px; }
.region.Europe .infographic:nth-of-type(7) { top: 1370px; left: 0px; }
.region.Europe .infographic:nth-of-type(8) { top: 1370px; left: 400px; }

/* ==========================================================================
   Region Page
   Sub-Saharan Africa
   ========================================================================== */

.content.regions.Sub-Saharan-Africa, .content.regions > .region.Sub-Saharan-Africa {
    height: 1830px;
    width: 980px;
}

.region.Sub-Saharan-Africa .infographic:nth-of-type(1) { top: 0px; left: 0px; }
.region.Sub-Saharan-Africa .infographic:nth-of-type(2) { top: 0px; left: 400px; }
.region.Sub-Saharan-Africa .infographic:nth-of-type(3) { top: 460px; left: 0px; }
.region.Sub-Saharan-Africa .infographic:nth-of-type(4) { top: 460px; left: 660px; }
.region.Sub-Saharan-Africa .infographic:nth-of-type(5) { top: 950px; left: 0px; }
.region.Sub-Saharan-Africa .infographic:nth-of-type(6) { top: 950px; left: 490px; }
.region.Sub-Saharan-Africa .infographic:nth-of-type(7) { top: 1370px; left: 0px; }
.region.Sub-Saharan-Africa .infographic:nth-of-type(8) { top: 1370px; left: 400px; }

/* ==========================================================================
   Region Page
   South-Asia 
   ========================================================================== */

.content.regions.South-Asia, .content.regions > .region.South-Asia {
    height: 1830px;
    width: 980px;
}

.region.South-Asia .infographic:nth-of-type(1) { top: 0px; left: 0px; }
.region.South-Asia .infographic:nth-of-type(2) { top: 0px; left: 400px; }
.region.South-Asia .infographic:nth-of-type(3) { top: 460px; left: 0px; }
.region.South-Asia .infographic:nth-of-type(4) { top: 460px; left: 660px; }
.region.South-Asia .infographic:nth-of-type(5) { top: 950px; left: 0px; }
.region.South-Asia .infographic:nth-of-type(6) { top: 950px; left: 490px; }
.region.South-Asia .infographic:nth-of-type(7) { top: 1370px; left: 0px; }
.region.South-Asia .infographic:nth-of-type(8) { top: 1370px; left: 400px; }

/* ==========================================================================
   Region Page
   North Africa & West Asia 
   ========================================================================== */

.content.regions.N-Africa-W-Asia, .content.regions > .region.N-Africa-W-Asia {
    height: 1830px;
    width: 980px;
}

.region.N-Africa-W-Asia .infographic:nth-of-type(1) { top: 0px; left: 0px; }
.region.N-Africa-W-Asia .infographic:nth-of-type(2) { top: 0px; left: 400px; }
.region.N-Africa-W-Asia .infographic:nth-of-type(3) { top: 460px; left: 0px; }
.region.N-Africa-W-Asia .infographic:nth-of-type(4) { top: 460px; left: 660px; }
.region.N-Africa-W-Asia .infographic:nth-of-type(5) { top: 950px; left: 0px; }
.region.N-Africa-W-Asia .infographic:nth-of-type(6) { top: 950px; left: 490px; }
.region.N-Africa-W-Asia .infographic:nth-of-type(7) { top: 1370px; left: 0px; }
.region.N-Africa-W-Asia .infographic:nth-of-type(8) { top: 1370px; left: 400px; }

/* ==========================================================================
   Region Page
   East Asia
   ========================================================================== */

.content.regions.East-Asia, .content.regions > .region.East-Asia {
    height: 1830px;
    width: 980px;
}

.region.East-Asia .infographic:nth-of-type(1) { top: 0px; left: 0px; }
.region.East-Asia .infographic:nth-of-type(2) { top: 0px; left: 400px; }
.region.East-Asia .infographic:nth-of-type(3) { top: 460px; left: 0px; }
.region.East-Asia .infographic:nth-of-type(4) { top: 460px; left: 660px; }
.region.East-Asia .infographic:nth-of-type(5) { top: 950px; left: 0px; }
.region.East-Asia .infographic:nth-of-type(6) { top: 950px; left: 490px; }
.region.East-Asia .infographic:nth-of-type(7) { top: 1370px; left: 0px; }
.region.East-Asia .infographic:nth-of-type(8) { top: 1370px; left: 400px; }

/* ==========================================================================
   Theme Page
   Food Security
   ========================================================================== */

.content.themes.food-security, .content.themes > .theme.food-security {
    height: 1162px;
}

.theme.food-security .infographic:nth-of-type(1) { top: 0px; left: 0px; }
.theme.food-security .infographic:nth-of-type(2) { top: 0px; left: 660px; }
.theme.food-security .infographic:nth-of-type(3) { top: 480px; left: 0px; }
.theme.food-security .infographic:nth-of-type(4) { top: 770px; left: 0px; }
.theme.food-security .infographic:nth-of-type(5) { top: 770px; left: 320px; }
.theme.food-security .infographic:nth-of-type(6) { top: 480px; left: 660px; }
.theme.food-security .infographic:nth-of-type(7) { top: 820px; left: 660px; }

/* ==========================================================================
   Theme Page
   Food Emissions
   ========================================================================== */

.content.themes.food-emissions, .content.themes > .theme.food-emissions {
    height: 1440px;
}

.theme.food-emissions .infographic:nth-of-type(1) { top: 0px; left: 0px; width: 1000px; height: 760px; }
.theme.food-emissions .infographic:nth-of-type(2) { top: 0px; left: 320px; width: 660px; height: 660px; }
.theme.food-emissions .infographic:nth-of-type(3) { top: 300px; left: 320px; width: 340px; height: 660px; }
.theme.food-emissions .infographic:nth-of-type(4) { top: 640px; left: 320px; width: 340px; height: 660px; }
.theme.food-emissions .infographic:nth-of-type(5) { top: 0px; left: 760px; width: 340px; height: 660px; }
.theme.food-emissions .infographic:nth-of-type(6) { top: 760px; left: 0px; width: 340px; height: 660px; }
.theme.food-emissions .infographic:nth-of-type(7) { top: 760px; left: 660px; width: 340px; height: 660px; }

/* ==========================================================================
   Theme Page
   Climate Impacts Production
   ========================================================================== */

.content.themes.climate-impacts-production, .content.themes > .theme.climate-impacts-production {
    height: 1480px;
}

.theme.climate-impacts-production .infographic:nth-of-type(1) { top: 0px; left: 0px; width: 1000px; height: 620px; }
.theme.climate-impacts-production .infographic:nth-of-type(2) { top: 0px; left: 630px; width: 1000px; height: 840px; }
.theme.climate-impacts-production .infographic:nth-of-type(3) { top: 619px; left: 0px; width: 1000px; height: 840px; }
.theme.climate-impacts-production .infographic:nth-of-type(4) { top: 619px; left: 430px; width: 1000px; height: 840px; }
.theme.climate-impacts-production .infographic:nth-of-type(5) { top: 1100px; left: 0px; width: 1000px; height: 840px; }
.theme.climate-impacts-production .infographic:nth-of-type(6) { top: 1100px; left: 660px; width: 1000px; height: 840px; }
.theme.climate-impacts-production .infographic:nth-of-type(7) { display: none;top: 1100px; left: 0px; width: 1000px; height: 840px; }
.theme.climate-impacts-production .infographic:nth-of-type(8) { display: none;top: 1100px; left: 660px; width: 1000px; height: 840px; }

/* ==========================================================================
   Theme Page
   Climate Impacts People
   ========================================================================== */

.content.themes.climate-impacts-people, .content.themes > .theme.climate-impacts-people {
    height: 1110px;
}

.theme.climate-impacts-people .infographic:nth-of-type(1) { top: 0px; left: 0px; width: 320px; height: 1110px; }
.theme.climate-impacts-people .infographic:nth-of-type(2) { top: 300px; left: 0px; width: 660px; height: 570px; }
.theme.climate-impacts-people .infographic:nth-of-type(3) { top: 550px; left: 0px; width: 400px; height: 540px; }
.theme.climate-impacts-people .infographic:nth-of-type(4) { top: 0px; left: 320px; width: 260px; height: 540px; }
.theme.climate-impacts-people .infographic:nth-of-type(5) { top: 0px; left: 590px; width: 260px; height: 540px; }
.theme.climate-impacts-people .infographic:nth-of-type(6) { top: 330px; left: 320px; width: 260px; height: 540px; }
.theme.climate-impacts-people .infographic:nth-of-type(7) { top: 570px; left: 320px; width: 260px; height: 540px; }
.theme.climate-impacts-people .infographic:nth-of-type(8) { top: 570px; left: 720px; width: 260px; height: 540px; }

/* ==========================================================================
   Theme Page
   Adaptation
   ========================================================================== */

.content.themes.adaptation, .content.themes > .theme.adaptation {
    height: 1350px;
}

.theme.adaptation .infographic:nth-of-type(1) { top: 0px; left: 0px; width: 570px; height: 910px; }
.theme.adaptation .infographic:nth-of-type(2) { top: 280px; left: 0px; width: 400px; height: 320px; }
.theme.adaptation .infographic:nth-of-type(3) { top: 580px; left: 0px; width: 400px; height: 630px; }
.theme.adaptation .infographic:nth-of-type(4) { top: 0px; left: 570px; width: 570px; height: 440px; }
.theme.adaptation .infographic:nth-of-type(5) { top: 320px; left: 570px; width: 400px; height: 400px; }
.theme.adaptation .infographic:nth-of-type(6) { top: 910px; left: 0px; width: 400px; height: 400px; }
.theme.adaptation .infographic:nth-of-type(7) { top: 910px; left: 270px; width: 400px; height: 400px; }
.theme.adaptation .infographic:nth-of-type(8) { top: 950px; left: 570px; width: 400px; height: 400px; }

/* ==========================================================================
   Theme Page
   Mitigation
   ========================================================================== */

.content.themes.mitigation, .content.themes > .theme.mitigation {
    height: 1560px;
}

.theme.mitigation .infographic:nth-of-type(1) { top: 0px; left: 0px; width: 400px; height: 490px; }
.theme.mitigation .infographic:nth-of-type(2) { top: 490px; left: 0px; width: 400px; height: 1070px; }
.theme.mitigation .infographic:nth-of-type(3) { top: 0px; left: 400px; width: 570px; height: 1240px; }
.theme.mitigation .infographic:nth-of-type(4) { top: 0px; left: 700px; width: 570px; height: 320px; }
.theme.mitigation .infographic:nth-of-type(5) { top: 440px; left: 400px; width: 570px; height: 320px; }
.theme.mitigation .infographic:nth-of-type(6) { top: 760px; left: 400px; width: 570px; height: 320px; }
.theme.mitigation .infographic:nth-of-type(7) { top: 1240px; left: 400px; width: 570px; height: 320px; }

/* ==========================================================================
   Theme Page
   Policy & Finance
   ========================================================================== */

.content.themes.policy-and-finance, .content.themes > .theme.policy-and-finance {
    height: 850px;
}

.theme.policy-and-finance .infographic:nth-of-type(1) { top: 0px; left: 0px; width: 660px; height: 370px; }
.theme.policy-and-finance .infographic:nth-of-type(2) { top: 0px; left: 320px; width: 320px; height: 850px; }
.theme.policy-and-finance .infographic:nth-of-type(3) { top: 220px; left: 320px; width: 660px; height: 480px; }
.theme.policy-and-finance .infographic:nth-of-type(4) { top: 0px; left: 660px; width: 660px; height: 480px; }
.theme.policy-and-finance .infographic:nth-of-type(5) { top: 370px; left: 660px; width: 660px; height: 480px; }
.theme.policy-and-finance .infographic:nth-of-type(6) { top: 570px; left: 660px; width: 660px; height: 480px; }
.theme.policy-and-finance .infographic:nth-of-type(7) { top: 370px; left: 0px; width: 660px; height: 480px; }
.theme.policy-and-finance .infographic:nth-of-type(8) { top: 370px; left: 270px; width: 660px; height: 480px; }

/* ==========================================================================
   Theme Page
   Evidence of Success
   ========================================================================== */

.content.themes.evidence-of-success, .content.themes > .theme.evidence-of-success {
    height: 1850px;
}

.theme.evidence-of-success .infographic:nth-of-type(1) { top: 0px; left: 0px; }
.theme.evidence-of-success .infographic:nth-of-type(2) { top: 0px; left: 575px; }
.theme.evidence-of-success .infographic:nth-of-type(3) { top: 260px; left: 0px; }
.theme.evidence-of-success .infographic:nth-of-type(4) { top: 660px; left: 0px; }
.theme.evidence-of-success .infographic:nth-of-type(5) { top: 660px; left: 405px; }
.theme.evidence-of-success .infographic:nth-of-type(6) { top: 1010px; left: 405px; }
.theme.evidence-of-success .infographic:nth-of-type(7) { top: 1380px; left: 0px; }

/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-width: 35em) {

}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {

}

/* ==========================================================================
   Animate CSS
   ========================================================================== */

.animated{-webkit-animation-fill-mode:both;-moz-animation-fill-mode:both;-ms-animation-fill-mode:both;-o-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:1s;-moz-animation-duration:1s;-ms-animation-duration:1s;-o-animation-duration:1s;animation-duration:1s;}.animated.hinge{-webkit-animation-duration:1s;-moz-animation-duration:1s;-ms-animation-duration:1s;-o-animation-duration:1s;animation-duration:1s;}@-webkit-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-20px);
	}	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}
}

@-moz-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-moz-transform: translateX(-20px);
	}
	
	100% {
		opacity: 1;
		-moz-transform: translateX(0);
	}
}

@-o-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-o-transform: translateX(-20px);
	}
	
	100% {
		opacity: 1;
		-o-transform: translateX(0);
	}
}

@keyframes fadeInLeft {
	0% {
		opacity: 0;
		transform: translateX(-20px);
	}
	
	100% {
		opacity: 1;
		transform: translateX(0);
	}
}

.fadeInLeft {
	-webkit-animation-name: fadeInLeft;
	-moz-animation-name: fadeInLeft;
	-o-animation-name: fadeInLeft;
	animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInRight {
	0% {
		opacity: 0;
		-webkit-transform: translateX(20px);
	}
	
	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
	}
}

@-moz-keyframes fadeInRight {
	0% {
		opacity: 0;
		-moz-transform: translateX(20px);
	}
	
	100% {
		opacity: 1;
		-moz-transform: translateX(0);
	}
}

@-o-keyframes fadeInRight {
	0% {
		opacity: 0;
		-o-transform: translateX(20px);
	}
	
	100% {
		opacity: 1;
		-o-transform: translateX(0);
	}
}

@keyframes fadeInRight {
	0% {
		opacity: 0;
		transform: translateX(20px);
	}
	
	100% {
		opacity: 1;
		transform: translateX(0);
	}
}

.fadeInRight {
	-webkit-animation-name: fadeInRight;
	-moz-animation-name: fadeInRight;
	-o-animation-name: fadeInRight;
	animation-name: fadeInRight;
}
@-webkit-keyframes slideInLeft {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-2000px);
	}
	
	100% {
		-webkit-transform: translateX(0);
	}
}

@-moz-keyframes slideInLeft {
	0% {
		opacity: 0;
		-moz-transform: translateX(-2000px);
	}
	
	100% {
		-moz-transform: translateX(0);
	}
}

@-o-keyframes slideInLeft {
	0% {
		opacity: 0;
		-o-transform: translateX(-2000px);
	}
	
	100% {
		-o-transform: translateX(0);
	}
}

@keyframes slideInLeft {
	0% {
		opacity: 0;
		transform: translateX(-2000px);
	}
	
	100% {
		transform: translateX(0);
	}
}

.slideInLeft {
	-webkit-animation-name: slideInLeft;
	-moz-animation-name: slideInLeft;
	-o-animation-name: slideInLeft;
	animation-name: slideInLeft;
}
@-webkit-keyframes slideInRight {
	0% {
		opacity: 0;
		-webkit-transform: translateX(2000px);
	}
	
	100% {
		-webkit-transform: translateX(0);
	}
}

@-moz-keyframes slideInRight {
	0% {
		opacity: 0;
		-moz-transform: translateX(2000px);
	}
	
	100% {
		-moz-transform: translateX(0);
	}
}

@-o-keyframes slideInRight {
	0% {
		opacity: 0;
		-o-transform: translateX(2000px);
	}
	
	100% {
		-o-transform: translateX(0);
	}
}

@keyframes slideInRight {
	0% {
		opacity: 0;
		transform: translateX(2000px);
	}
	
	100% {
		transform: translateX(0);
	}
}

.slideInRight {
	-webkit-animation-name: slideInRight;
	-moz-animation-name: slideInRight;
	-o-animation-name: slideInRight;
	animation-name: slideInRight;
}
@-webkit-keyframes slideOutLeft {
	0% {
		-webkit-transform: translateX(0);
	}
	
	100% {
		opacity: 0;
		-webkit-transform: translateX(-2000px);
	}
}

@-moz-keyframes slideOutLeft {
	0% {
		-moz-transform: translateX(0);
	}
	
	100% {
		opacity: 0;
		-moz-transform: translateX(-2000px);
	}
}

@-o-keyframes slideOutLeft {
	0% {
		-o-transform: translateX(0);
	}
	
	100% {
		opacity: 0;
		-o-transform: translateX(-2000px);
	}
}

@keyframes slideOutLeft {
	0% {
		transform: translateX(0);
	}
	
	100% {
		opacity: 0;
		transform: translateX(-2000px);
	}
}

.slideOutLeft {

	-webkit-animation-name: slideOutLeft;
	-moz-animation-name: slideOutLeft;
	-o-animation-name: slideOutLeft;
	animation-name: slideOutLeft;
}
@-webkit-keyframes slideOutRight {
	0% {
		-webkit-transform: translateX(0);
	}
	
	100% {
		opacity: 0;
		-webkit-transform: translateX(2000px);
	}
}

@-moz-keyframes slideOutRight {
	0% {
		-moz-transform: translateX(0);
	}
	
	100% {
		opacity: 0;
		-moz-transform: translateX(2000px);
	}
}

@-o-keyframes slideOutRight {
	0% {
		-o-transform: translateX(0);
	}
	
	100% {
		opacity: 0;
		-o-transform: translateX(2000px);
	}
}

@keyframes slideOutRight {
	0% {
		transform: translateX(0);
	}
	
	100% {
		opacity: 0;
		transform: translateX(2000px);
	}
}

.slideOutRight {
	-webkit-animation-name: slideOutRight;
	-moz-animation-name: slideOutRight;
	-o-animation-name: slideOutRight;
	animation-name: slideOutRight;
}


/* ==========================================================================
   Helper classes
   ========================================================================== */

.button {
	cursor: pointer; 
	cursor: hand;
}

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}