.span_1_of_1 {width: 100%;}
div.content-img-container.small, div.corbat-small, .bioContainer,img.corbat-touch, div.content-img a.simple-ajax-popup.touch, .hideheader, .citi-logo, p.charts-mobile, .keycapital-copy-container {display: none;}
div.span_1_of_1 p a  {color: #00BDF2;}
div.span_1_of_1 p a:hover, a.simple-ajax-popup:hover {color: #008ce6;}
a.simple-ajax-popup {font-weight: normal; color: #fff; text-decoration: underline;}
div.span_1_of_1 p {padding-left: 19.5%; padding-right: 19.5%; font-size: 1.3em; line-height: 1.5;}

sup {font-family: Arial, Helvetica, sans-serif;}
ul.content-list {font-size: 1.3em;padding-left: 21%;padding-right: 21%;	line-height: 1.5; color: #002d72;}
ul.content-list li {padding-bottom: 15px;padding-left: 20px;padding-right: 20px;}
ul.content-list li a, ul.content-list li a:link {text-decoration: none; color: #00BDF2;}
ul.content-list li a:hover {text-decoration: none; color: #ff0000;}
ul.content-list.lrg li {width: 80%;}
ul.content-list li:last-child {padding-bottom: 0px;}

/* NEW 2016 */
.chart-hdr {margin-bottom: 1.2em;}
h3.global-hdr {margin-top:0; padding-top: 2.6em;}
.citi-blue {color: #002d72;}
.ocean-callout {color: #008ce6; margin-bottom: 1.8em;}

div.three-col-callout {color: #002d72; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-bottom: 2.4em;}
div.three-col-callout div {-webkit-box-flex: 1;-webkit-flex: 1;-ms-flex: 1;flex: 1;}
div.three-col-callout.img-last div:first-child {padding: 25px 25px 0px 25px;}
div.three-col-callout.img-last div:nth-of-type(2) {padding: 25px 25px 0px 0px;}
div.three-col-callout.img-first div:nth-of-type(2) {padding: 25px 25px 0px 25px;}
div.three-col-callout.img-first div:last-child {padding: 25px 25px 0px 0px;}

div.three-col-callout div.img-cover {background-repeat: no-repeat; background-position: 50% 50%; vertical-align: middle; line-height:0; width: 100%; background-size: 100%;}
div.three-col-callout div.img-cover.citibike {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/3-col-citibike-2.jpg); background-position: 50% 80%;}
div.three-col-callout div.img-cover.watch {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/3-col-watchapp.jpg);}
div.three-col-callout.lightcyan {background-color: #def3ff;}
div.three-col-callout h3 {padding-left: 0; padding-top: 0; margin-top:0; padding-right:0; padding-bottom: .5em;}
div.three-col-callout p {padding: 0;font-size: 1.2em;}

div.hero-four-wide {display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex; margin-bottom: 10px;}
div.hero-four-wide div.img {/*background-color:#CC6699;*/-webkit-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1; margin-right: 10px; height: 600px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; background-repeat: no-repeat; background-position: 50% 50%; vertical-align: middle; background-size:cover;}
div.hero-four-wide div div.caption {-webkit-box-align: end;-webkit-align-items: flex-end;-ms-flex-align: end;-ms-grid-row-align: flex-end;align-items: flex-end; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; background-color: rgba(0,33,64,.9); color: #fff; font-weight: bold; padding: 5%; -webkit-box-flex:1; -webkit-flex:1; -ms-flex:1; flex:1; }
div.hero-four-wide div div.sp {-webkit-box-flex:1.8;-webkit-flex:1.8;-ms-flex:1.8;flex:1.8;}
div.hero-four-wide div:last-child {margin-right: 0px;}

div.hero-four-wide div.img:first-child {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/hero-5-1.jpg);}
div.hero-four-wide div.img:nth-of-type(2) {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/hero-5-2.jpg);}
div.hero-four-wide div.img:nth-of-type(3) {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/hero-5-3.jpg);}
div.hero-four-wide div.img:nth-of-type(4) {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/hero-5-4.jpg);}

div.hero-four-wide.second div.img:first-child {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/hero-5-6.jpg);}
div.hero-four-wide.second div.img:nth-of-type(2) {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/hero-5-7.jpg);}
div.hero-four-wide.second div.img:nth-of-type(3) {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/hero-5-8.jpg);}
div.hero-four-wide.second div.img:nth-of-type(4) {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/hero-5-9.jpg);}

div.hero-one-wide { margin-bottom: 2.6em;}
div.hero-one-wide div.img {height: 300px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -webkit-flex-direction:column; -ms-flex-direction:column; flex-direction:column; background-repeat: no-repeat; background-position: 50% 50%; vertical-align: middle; background-size:cover;}
div.hero-one-wide div div.sp {-webkit-box-flex:3;-webkit-flex:3;-ms-flex:3;flex:3;}
div.hero-one-wide div div.caption {background-color: rgba(0,33,64,.9); color: #fff; font-weight: bold; -webkit-box-flex:1; -webkit-flex:1; -ms-flex:1; flex:1;-webkit-box-align: center;-webkit-align-items: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-webkit-justify-content: center;-ms-flex-pack: center;justify-content: center; padding: 1% 19.5%; display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex;}
div.hero-one-wide div.img {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/hero-5-5.jpg);}
div.hero-one-wide.second div.img {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/hero-5-10.jpg);}


div.lightcyan-large {background: #def3ff; overflow: hidden; /*margin-bottom: 3.6em;*/padding-bottom: 6em;}
div.lightcyan-large p {color: #002d72;}
div.lightcyan-large div.hero {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/hero-citigold.jpg); background-repeat: no-repeat; background-position: 50% 50%; vertical-align: middle; line-height:0; width: 100%; background-size: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -ms-flex-preferred-size: auto; min-height: 640px;flex-basis: auto;}
div.lightcyan-large div.hero.pathways {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/hero-pathway.jpg);}
div.lightcyan-large div.hero div.play {-webkit-box-flex: 3;-webkit-flex: 3;-ms-flex: 3;flex: 3;  background-repeat: no-repeat; background-position: 50% 50%; vertical-align: middle; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;}
div.lightcyan-large div.hero.pathways div.play {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/play-btn-lrg.png);}
div.lightcyan-large div.hero.pathways div.play a {display: block; -webkit-box-flex:1; -webkit-flex:1; -ms-flex:1; flex:1;}
div.lightcyan-large div.hero div.caption {-webkit-box-align: end;-webkit-align-items: flex-end;-ms-flex-align: end;-ms-grid-row-align: flex-end;align-items: flex-end; padding: 15px 19.5%; background-color: rgba(0,33,64,.9); color: #fff; font-weight: bold; line-height: 18px;}
div.lightcyan-large h3 {padding: 25px 0 25px 0;padding-left: 19.4%;padding-right: 19.4%;}

h3.intro {padding-top: 0!important; padding-right:19.7%; padding-left:19.7%;}

div.shareholders {background: #00498c;}
div.shareholders {color: #fff;padding: 0 0;font-size: 1.125em;/*margin-bottom: 2.5em;*/ overflow:hidden; padding-bottom: 6em;}
div.shareholders h3 {color: #fff;padding: 0 0 15px 0;padding-left: 19.5%;padding-right: 19.5%;}
div.shareholders h4 {color: #fff;padding-bottom: 15px;font-size: 1.4em;padding-left: 19.5%;padding-right: 19.5%;}
div.shareholders p {padding: 0;font-size: 1.15em;padding-left: 19.5%;padding-right: 19.5%;margin-bottom: 1.65em;}

.sbs {display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex; margin-bottom: 1.7em;}
.sbs div {-webkit-box-flex: 1;-webkit-flex: 1;-ms-flex: 1;flex: 1; line-height:0;}

div.corbat-large {padding: 0px;overflow: hidden;margin-top: 0px;width: 100%; height: auto;}
div.corbat-container {margin-bottom: 1.6em;}
#maincontent #splash {line-height:0;}
#splash {clear: both; position: relative; /*min-height: 100vh;*/background: #00bdf2;}
#value-proposition { 
		padding-bottom: 4.6em;
		overflow: hidden;
		color: #fff;
		background: #00bdf2; /* Old browsers */
		background: -moz-linear-gradient(top, #00bdf2 0%, #00b3f0 20%, #0066b3 75%, #004785 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#00bdf2), color-stop(20%,#00b3f0), color-stop(75%,#0066b3), color-stop(100%,#004785)); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top, #00bdf2 0%,#00b3f0 20%,#0066b3 75%,#004785 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top, #00bdf2 0%,#00b3f0 20%,#0066b3 75%,#004785 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top, #00bdf2 0%,#00b3f0 20%,#0066b3 75%,#004785 100%); /* IE10+ */
		background: linear-gradient(to bottom, #00bdf2 0%,#00b3f0 20%,#0066b3 75%,#004785 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00bdf2', endColorstr='#004785',GradientType=0 ); /* IE6-9 */	
}
#value-proposition h3.global-hdr {color: #fff; padding-bottom: 1.5em;}
a.content-img.progresslrg {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/progress-lrg.jpg);border-radius: 0px 0px 70px 70px; background-repeat: no-repeat; background-position: 50% 50%; vertical-align: middle; line-height:0; width: 100%; background-size: 100%;}
#progressbg {overflow: hidden; background: #00bdf2; background: -moz-linear-gradient(top, #00bdf2 31%, #00498c 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(31%,#00bdf2), color-stop(100%,#00498c)); background: -webkit-linear-gradient(top, #00bdf2 31%,#00498c 100%);background: -o-linear-gradient(top, #00bdf2 31%,#00498c 100%); background: -ms-linear-gradient(top, #00bdf2 31%,#00498c 100%); background: linear-gradient(to bottom, #00bdf2 31%,#00498c 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00bdf2', endColorstr='#00498c',GradientType=0 );}
div.progress-container {padding-left: 19.5%; padding-right: 19.5%; margin-bottom: 2.4em; overflow: hidden; clear: both; content:"";}
#progress h3 {color: #fff; padding-top: 1.6em; padding-bottom:0.3em;}
div#progress div.col.span_1_of_1 p {color: #fff;}
div#progress div.col.span_1_of_1 {margin-left:0;}
div.progress-vid-container {margin-bottom: 27px;background: #fff;background: rgba(255, 255, 255, 0.2);padding: 36px;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}

div.progress-vid-container h5 {color: #fff; font-size: 1.2em; line-height: 1; font-weight: bold; padding: 0; margin-bottom:1.5em; margin-top:0; }
div.fin-container {padding-left: 19.5%;padding-right: 19.5%; padding-bottom:6em;}
table.fin-tbl {color: #666;}
table.fin-tbl tr th, table.fin-tbl tr td {text-align: right;font-weight: normal;padding: 6px;}
table.fin-tbl tr th, table.fin-tbl tr.section td {border-bottom: 1px solid #bebebe;}
table.fin-tbl tr td.header-yaxis {text-align: left;}
table.fin-tbl tr td.current-year, table.fin-tbl tr th.current-year, table.fin-tbl tr td.header-yaxis.bold {font-weight: bold; color: #111;}
p.table-footer {color: #999;padding-top: 10px;}
p.table-key {color: #666;font-style: italic;padding-bottom: 6px;padding-top: 15px;}
div.span_1_of_1 p.introBig {font-size: 1.6em;color: #999;line-height: 1.5em;padding-left: 19.5%;padding-right: 19.5%;font-weight: normal;margin-bottom: 1.3em;}
div.corbat-container p.introBig {padding-left: 0;padding-right: 0%;}
h4.subheader {padding-left: 19.5%;padding-right: 19.5%;margin-bottom: 0.75em;padding-top: 1px;padding-bottom: 8px;font-size: 1.625em;}
div.shareholders p.italQuoteLrg {font-size: 1.4em;color: #fff;font-style: italic;font-weight: normal;padding-right: 19.5%;padding-left: 19.5%;}
div.corbat-container {padding-left: 19.5%;padding-right: 19.5%;}
div.corbat-container p {padding: 0;}

div.centered-pic-container {padding: 0 19.5%; margin-bottom: 1.6em;}
div.centered-pic-container div.content-img {padding: 0; height: 402px;}
div.img-caption-centered {position: absolute;bottom: 0;background: #f3f3f3;background: rgba(255, 255, 255, 0.9);color: #111;font-size: 0.9em;width: 100%;}
div.img-caption-centered span {display: block;padding: 2em 10%;line-height: 1.4;}
div.img-caption-centered span.single {text-align: center;}

.charts {text-align: center;}
.flip {width: 100%; height: auto; position:relative;cursor:pointer;margin-bottom: 15px;}
.photoFlip {width:100%;height:auto;}
.bio {margin: 25px;overflow-y: scroll;overflow-x: hidden;font-size: .8em;height: 475px;padding: 0 10px 0 0;}
div.page-break {height: 3px;background: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/page-break.gif) repeat-x 0 1px;}
#letterMain, #bankingMain, #institutionalMain, #citizenshipMain, #stockholderMain {/*padding-bottom: 3em;*/}
ul.view-bio {margin:0;padding:0;}
ul.view-bio li {padding: 10px 0px; display: inline-block; width: 50%; float: left; font-family: Arial, Helvetica, sans-serif;}
ul.view-bio li span {display: block; padding:0; color: #333; font-weight: bold; }
ul.view-bio li.view-btn {text-align: right;}
div.viewphoto-btn {padding: 0 18px 0 18px; text-align: right;}
ul.view-bio li.view-btn div, div.viewphoto-btn div{background: #00BDF2; padding: 7px 10px; color: #fff; font-weight: bold; display: inline-block; font-family: Arial, Helvetica, sans-serif;}
ul.view-bio li.view-btn div:hover, div.viewphoto-btn div:hover {background: #008CE6;}
ul.view-bio li.view-btn div a,ul.view-bio li.view-btn div a:hover {text-decoration: none;color: #fff;}
.bio-small {float: left; margin-right: 15px; margin-bottom: 10px;}
.ten-k {background: #24bff7;}
.ten-k a {padding: 40px 0; text-align: center; display: block;}
h3 sup {font-size: 0.4em; vertical-align:super; font-family: Arial, Helvetica, sans-serif;}
div.progress-vid-container img:hover {cursor: pointer;}
div.span_1_of_1 p.introBig.white {color: #fff; line-height: 1.4em;}
.white-popup-block {background: #fff;padding: 15px; position: relative; text-align: left; max-width:600px; margin: 55px auto 28px auto; max-height: 535px; overflow: hidden;}
.modal-content {overflow-y: scroll; max-height: 525px; margin-top:17px;}
.modal-content h3 {padding: 0 0 0 0;padding-right: 10px; font-size:1.6em;margin-bottom: 1em;}
.modal-content p {padding-right: 10px;}
.magOpen {overflow: hidden;}
ul li span.psmall {font-size:0.5em;}
span.italic {font-style: italic;}
#financials h3, #letter h3, #banking h3, #institutional h3, #citizenship h3, #stockholder h3{padding-top: 4em; padding-bottom: 1.5em;}
#letter h3.intro {padding-top:0;}
#progress {padding-top: 72px; background-color:#def3ff;}
* {-webkit-tap-highlight-color: rgba(0,140,230,0.2) !important;}
span.spanish {font-family: Arial, Helvetica, sans-serif;}
.notation {display: block; font-size: 10px; padding-bottom: 3px;}


/** PROGRESS **/
div.new-progress-container {padding-left: 19.5%; padding-right: 19.5%; margin-bottom: 2.4em; overflow: hidden; clear: both; content:"";}
div.progress-content-container {margin-bottom: 27px;background: #fff;background: rgba(255, 255, 255, 0.3);padding: 36px;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px; clear: both; content:""; }
.content-img.progresslrg {height: 640px; display: block;}
.progressbtm {height: 250px;}
div.img-caption2-lrg span span.photocredit {font-weight: normal; font-size: 11px; margin:0; padding:7px 0 0 0; font-style:italic;}
div.progress-vid-container p.vid-copy {padding: 1em 0 0; margin: 0; font-size: 1.2em;}
div.progress-vid-container a.readblog, div.progress-vid-container a.readblog:link {display: block; color: #fff; font-weight: bold; background: #00BDF2; text-decoration: none; padding: 10px; text-align:center; font-family:Arial, Helvetica, sans-serif;}
div.progress-vid-container a.readblog:hover {background: #008CE6;}
a.white-link, a.white-link:link, a.white-link:visited {color: #fff;}
div.progress-image {padding: 0px; margin:0px;}
.progress-last {padding-bottom: 1.5em;}

div.modal-content a {color:#00bdf2;}
div.modal-content a:hover {color:#008CE6; text-decoration: underline;}


/***************  MEDIA QUERIES  ^^^^^^2560px^^^^^^ ************************************/
@media only screen and (max-width: 2048px) {

}
@media only screen and (max-width: 1920px) {

}
@media only screen and (max-width: 1680px) {

}
@media only screen and (max-width: 1600px) {

}
@media only screen and (max-width: 1480px) {
	div.lightcyan-large div.hero {min-height: 530px;}
	.content-img.progresslrg {height: 530px;}	
}
@media only screen and (max-width: 1400px) {
	div.hero-one-wide div.img {height: 224px;}
}
@media only screen and (max-width: 1366px) {

}
@media only screen and (max-width: 1280px) {
	div.three-col-callout p {font-size: 1.1em;}
	div.hero-four-wide div div.sp {-webkit-box-flex: 1.1;-webkit-flex: 1.1;-ms-flex: 1.1;flex: 1.1;}
	div.hero-four-wide div.img {height: 545px;}
	div.lightcyan-large div.hero.pathways div.play {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/play-btn-1024.png);}
}
@media only screen and (max-width: 1152px) {
	div.lightcyan-large div.hero {min-height: 480px;}
	.content-img.progresslrg {height: 480px;}
	div.three-col-callout h3 {font-size: 1.5em; font-weight: bold;}	
	div.hero-four-wide div.img {height: 500px;}
	div.hero-one-wide div div.sp {-webkit-box-flex: 1.9;-webkit-flex: 1.9;-ms-flex: 1.9;flex: 1.9;}
	div.hero-four-wide div div.sp {-webkit-box-flex: .9;-webkit-flex: .9;-ms-flex: .9;flex: .9;}
}
@media only screen and (max-width: 1080px) {
	#headcontainer {padding: 15px 0;}
	#maincontent, header{width: 90%; margin: 0 auto;}
	.pushy a, ul.pnav li.header {padding: 10px 25px;font-size: 0.90em;}	
	a.social {width: 30px;height: 30px;background: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/social.png) no-repeat 0px 0px;padding:0;margin:0;}	
	ul.pnav li.socialbtns {padding: 10px 20px 12px;}
}
@media only screen and (max-width: 1024px) {

}
@media only screen and (max-width: 961px) {
	div.lightcyan-large div.hero {min-height: 450px;}	
	.content-img.progresslrg {height: 450px;}
	div.hero-four-wide div.img {height: 440px;}
	div.hero-four-wide div div.sp {-webkit-box-flex: .7;-webkit-flex: .7;-ms-flex: .7;flex: .7;}
	div.three-col-callout div.img-cover {background-size: cover;}
}
@media only screen and (max-width: 800px) {
	#maincontent {margin: 0; width: 100%;}
	header {width: 100%; margin:0;}
	#headcontainer {padding: 10px 0;}
	.header-wrapper {padding: 0 1.8em;}
	.citilogo {width:41px; height: 30px;}
	.menu-btn, .done-btn {width: 72px; padding: 8px;}
	div#splash div.splash-image img {margin-top: 50px;}
	div.lightcyan-large div.hero {min-height:408px;}
	.content-img.progresslrg {height: 408px;}
	div.span_1_of_1 p, div.corbat-container, div.shareholders h3, h3, h3.intro, div.three-col-callout h3, div.lightcyan-large h3, div.centered-pic-container, div.progress-container, div.fin-container, div.lightcyan-large div.hero div.caption, div.hero-one-wide div div.caption {padding-left: 12.5%; padding-right: 12.5%;}
	div.three-col-callout.lightcyan div p {padding:0;}
	div.three-col-callout.lightcyan div h3 {padding-left:0; padding-right:0;}
	.content-img.progresslrg {border-radius: 0 0 40px 40px;}
	div.hero-four-wide div.img {height:430px;}
	ul.content-list {padding-left: 15%; padding-right: 12%;}
	ul.content-list li {padding-left:10px; padding-right:10px;}
	div.lightcyan-large div.hero.pathways div.play {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/play-btn-800.png);}
	div.hero-one-wide div div.caption, div.hero-four-wide div div.caption, div.lightcyan-large div.hero div.caption {font-size: 11px; line-height: 1.3;}
	div.hero-four-wide div div.sp {-webkit-box-flex: 1.3;-webkit-flex: 1.3;-ms-flex: 1.3;flex: 1.3;}	
	div.hero-one-wide div.img {height: 204px;}	
}

@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape) {
	#maincontent {margin: 0;width: 100%;}
}
@media only screen and (max-width: 768px){
	#maincontent {margin: 0;width: 100%;}
	.done-btn {font-size: 0.85em; font-size: 100%;}    
	.pushy{font-size: 1.0em;}
	.citilogo {width:41px; height: 30px;}
	.citilogo img {margin-top: 2px;}
	div.hero-one-wide div.img {height: 190px;}
	div.hero-four-wide div.img {height: 410px;}
	div.hero-four-wide div div.sp {-webkit-box-flex: 1.1;-webkit-flex: 1.1;-ms-flex: 1.1;flex: 1.1;}
}
@media only screen and (device-width: 768px) and (device-height: 1024px) {
  div.hero-four-wide div.img {height:490px; background-size:cover;}
}
@media only screen and (max-width: 720px) {
	div.lightcyan-large div.hero {min-height: 380px;}
	.content-img.progresslrg {height: 380px;}	
	div.hero-one-wide div.img {height: 180px;}
	div.hero-four-wide div.img {height: 390px;}	
	div.hero-four-wide div div.sp {-webkit-box-flex: .9;-webkit-flex: .9;-ms-flex: .9;flex: .9;}
}
@media only screen and (max-width: 640px) {
	.pushy a {font-size: 0.80em;}	
	.ten-k a img {width: 75%; height: auto;}
	div.lightcyan-large div.hero {min-height: 340px;}
	.content-img.progresslrg {height: 340px;}
	div.hero-one-wide div.img {height: 160px;}
	div.hero-four-wide div.img {height: 340px;}	
	div.hero-four-wide div div.sp {-webkit-box-flex: .5;-webkit-flex: .5;-ms-flex: .5;flex: .5;}	
}
@media only screen and (max-width : 600px){
	div.lightcyan-large div.hero {min-height: 315px;}
	.content-img.progresslrg {height: 315px;}
	div.hero-four-wide div.img {height: 320px;}	
	div.hero-one-wide div.img {height: 150px;}
	div.hero-four-wide div div.sp {-webkit-box-flex: .3;-webkit-flex: .3;-ms-flex: .3;flex: .3;}
	div.hero-one-wide div div.sp {-webkit-box-flex: 1.5;-webkit-flex: 1.5;-ms-flex: 1.5;flex: 1.5;}
}
@media only screen and (max-width: 540px) {
	div.lightcyan-large div.hero {min-height: 285px;}
	.content-img.progresslrg {height: 285px;}
	div.hero-four-wide {-webkit-box-orient: vertical;-webkit-box-direction: normal;-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column; margin-bottom: 0px;}
	div.hero-four-wide div.img {height: 250px; margin-right:0px; margin-bottom: 10px; display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;}
	div.hero-four-wide div div.sp {-webkit-box-flex: 2.5;-webkit-flex: 2.5;-ms-flex: 2.5;flex: 2.5;}
	div.hero-four-wide div div.caption {-webkit-box-flex: 1;-webkit-flex: 1;-ms-flex: 1;flex: 1; font-size: 11px; padding: 2% 12.5%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center;}
	div.hero-one-wide div div.caption {font-size: 11px; }
	div.hero-one-wide div.img {height: 250px; background-size: cover;}	
	div.hero-one-wide div div.caption {-webkit-box-flex: .8;-webkit-flex: .8;-ms-flex: .8;flex: .8;}		
}
@media only screen and (max-width: 480px) {
	.citilogo img {margin-top: 0px;}
	#maincontent {margin: 0;width: 100%;}
	.span_1_of_1 {width: 100%;}
	div.span_1_of_1 p {font-size: 1em; }
	.menu-btn, .done-btn{width: 38px;padding: 5px;}
	.done-btn {font-size: 0.85em;padding: 6px 6px 7px 6px;}
	.menu-btn:before {content: "";}
	.pushy a {padding: 10px 25px;font-size: 0.80em;}
	ul.pnav li.header {padding: 10px 25px;font-size: 0.80em;}
	a.social {padding:0; margin:0;}
	div.lightcyan-large div.hero {height: 255px;}
	.content-img.progresslrg {height: 255px;}
	div.hero-one-wide div.img {background-size: cover;}
	div.hero-four-wide div div.sp {-webkit-box-flex: 1.8;-webkit-flex: 1.8;-ms-flex: 1.8;flex: 1.8;}
	div.three-col-callout {-webkit-box-orient: vertical;-webkit-box-direction: normal;-webkit-flex-direction: column;-ms-flex-direction: column;flex-direction: column;}
	div.three-col-callout div.img-cover {height: 250px;}
	div.three-col-callout.img-first div:nth-of-type(2), div.three-col-callout.img-last div:first-child {padding: 25px 0px 0px 0px;}
	div.three-col-callout.img-first div:last-child, div.three-col-callout.img-last div:nth-of-type(2) {padding: 0px 0px 0px 0px;}	
	div.span_1_of_1 p, div.corbat-container, div.shareholders h3, h3, h3.intro, div.three-col-callout h3, div.lightcyan-large h3, div.centered-pic-container, div.progress-container, div.fin-container, div.lightcyan-large div.hero div.caption, div.hero-four-wide div div.caption, div.hero-one-wide div div.caption {padding-left: 5%!important; padding-right: 5%!important;}	
	div.modal-content h3 {font-size:1.4em; padding-left:0%!important; padding-right:0%!important;}
	div.modal-content p {font-size: 13px;}

}
@media all and (min-width: 321px) and (max-height: 480px) {

}
@media only screen and (max-width: 414px) {
	/** IPHONE 6PLUS **/
	div.span_1_of_1 p, ul.content-list,div.progress-vid-container p.vid-copy {font-size: 1em;}
	h3 {font-size: 1.4em;}
	div.hero-one-wide div div.caption {-webkit-box-flex: 1.1;-webkit-flex: 1.1;-ms-flex: 1.1;flex: 1.1;}
	div.hero-four-wide div div.sp {-webkit-box-flex: 1.6;-webkit-flex: 1.6;-ms-flex: 1.6;flex: 1.6;}
	div.hero-four-wide div div.caption {-webkit-box-flex: 1.2;-webkit-flex: 1.2;-ms-flex: 1.2;flex: 1.2;}
	div.hero-four-wide div div.caption, div.hero-one-wide div div.caption {display: -webkit-box;display: -webkit-flex;display: -ms-flexbox;display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center;}
	ul.content-list {padding-left: 10%; padding-right: 8%;}
	ul.content-list li {padding-left:10px; padding-right:10px;}
	div.lightcyan-large div.hero {min-height: 265px; background-position: 0 0;}
	div.lightcyan-large div.hero div.play {height: 224px;}
	a.content-img.progresslrg {border-radius: 0 0 30px 30px; height: 220px;}
	#progress {padding-top: 3.6em;}
	div.progress-vid-container {padding: 20px;}
	div.lightcyan-large div.hero div.caption {background: rgba(0,52,100,1);}
	div.lightcyan-large div.hero {background-color: rgba(0,52,100,1);}
	div.lightcyan-large div.hero.pathways {height: 290px;}
	.mfp-close {width: 38px;}
	.white-popup-block {max-height: 570px;}
	div.hero-four-wide div.img {height: 280px;}
}
@media only screen and (max-width: 375px) {
	/** IPHONE 6 **/
	div.lightcyan-large div.hero {height: 255px;}
	div.hero-one-wide div div.caption {-webkit-box-flex: 1;-webkit-flex: 1;-ms-flex: 1;flex: 1;}
	div.lightcyan-large div.hero.pathways {height: 280px;}
	a.content-img.progresslrg {height: 200px;}
}
@media only screen and (max-width: 360px) {
	.header-wrapper {padding: 0 1.1em;}
	a.content-img.progresslrg {height: 190px;}
	div.lightcyan-large div.hero {height: 245px;}
	div.lightcyan-large div.hero.pathways {height: 270px;}
	div.hero-four-wide div div.caption {-webkit-box-flex: 1.3;-webkit-flex: 1.3;-ms-flex: 1.3;flex: 1.3;}
	p.charts-mobile {display: block;}
	p.charts.revenues {display: none;}
}
@media only screen and (max-width: 320px) {
	.span_1_of_1 {width: 100%;}
	table.fin-tbl, p.table-footer {font-size: 0.83em;}
	p.table-footer {padding-top: 0px;}
	div.lightcyan-large div.hero {height: 225px;}
	div.hero-four-wide div div.caption {-webkit-box-flex: 1.5;-webkit-flex: 1.5;-ms-flex: 1.5;flex: 1.5;}
	div.lightcyan-large div.hero.pathways {height: 250px;}
	div.hero.pathways div.play {background-image: url(https://www.citigroup.com/rcs/citigpa/storage/public/Annual_Report/2016/images/play-btn-280.png);}
	a.content-img.progresslrg {height: 170px;}
}
@media only screen and (max-width: 300px) {
	a.content-img.progresslrg {height: 150px;}
}