@import "table.css";
.hero-text.home {
	padding-top: 346px;
}
.home.intro-header	{
	height: 548px;
}

/* darken inner_banners*/
#darken, #darken50 {
  box-shadow: inset 0px 0px 960px 200px rgba(0, 0, 0, .5);  /*darkness level control - change the alpha value for the color for darken/ligheter effect */
}
#darken20 {
  box-shadow: inset 0px 0px 960px 200px rgba(0, 0, 0, .2);  /*darkness level control - change the alpha value for the color for darken/ligheter effect */
}
#darken30 {
  box-shadow: inset 0px 0px 960px 200px rgba(0, 0, 0, .3);  /*darkness level control - change the alpha value for the color for darken/ligheter effect */
}
#darken60 {
  box-shadow: inset 0px 0px 960px 200px rgba(0, 0, 0, .6);  /*darkness level control - change the alpha value for the color for darken/ligheter effect */
}
#darken70 {
  box-shadow: inset 0px 0px 960px 200px rgba(0, 0, 0, .7);  /*darkness level control - change the alpha value for the color for darken/ligheter effect */
}
#darken80 {
  box-shadow: inset 0px 0px 960px 200px rgba(0, 0, 0, .8);  /*darkness level control - change the alpha value for the color for darken/ligheter effect */
}
#darken90 {
  box-shadow: inset 0px 0px 960px 200px rgba(0, 0, 0, .8);  /*darkness level control - change the alpha value for the color for darken/ligheter effect */
}


#main-citi-footerNav {
	/*display: none; */
}
.citi-content-section h2 {
	font-family: Interstate_Light, sans-serif;
   color: #056dae;
   letter-spacing: -1px;
   font-size: 1.6em;
}
.home.hero-text-block	{
	padding-top: 0px;
}
.content-container.sub-nav {
	padding-top: 50px;
}
.container.sub-nav {
	padding-top: 50px;
}
.block-link	{
	width: 100%;
}
.mobile-only.citi-accounts {
	display: none!important;
}
.accounts_show_hide {
	visibility: hidden!important;
}
.btn-citiapp	{ margin-top: 6px;}

.modal-dialog{
    overflow-y: initial !important;
}
.modal-body{
    height: auto;
    overflow-y: auto;
}

.img-text.bottom {
    font-size: 24px;
    color: #fff;
    font-family: Interstate;
    padding: 0 10px 5px 20px;
    position: absolute;
    bottom: 0;
    line-height: 1em;
    text-shadow: 0 1px 1px #666;
}
.hero-diversity, .hero-diversity-our-approach, .hero-diversity-our-people, .hero-diversity-partnerships, .hero-diversity-awards {
	background-size: cover;	
}
.hero-diversity  {
	background: url(/citi/diversity/assets/images/home-diversity.jpg) no-repeat center center;
}
.hero-diversity-our-approach	{
	background: url(/citi/diversity/assets/images/home-diversity-our-approach.jpg) no-repeat center center;	
}
.hero-diversity-our-people	{
	background: url(/citi/diversity/assets/images/home-diversity-our-people.jpg) no-repeat center center;	
}
.hero-diversity-partnerships	{
	background: url(/citi/diversity/assets/images/home-diversity-partnerships.jpg) no-repeat center center;	
}
.hero-diversity-awards	{
	background: url(/citi/diversity/assets/images/home-diversity-awards.jpg) no-repeat center center;	
}

/* =============================== */
.diversity-content-section {
    padding-bottom: 32px;
    margin-bottom: 50px;
    border-bottom: solid #bdbdbd thin;
    line-height: 1.4em;
}
.diversity-section-title {
    font-family: Interstate;
	 font-size: 1.8em;
    font-weight: 700;
    margin: 36px 0 60px 0;
    display: inline-block;
}
.diversity-section {
    background-color: #1d3f6d;
    color: #fff;
    height: 100%;
}
.diversity-section-content-big	{
    font-size: 1.18em;	
}
.callout-section-title {
    font-size: 1.4em;
}
.citi-content-section .inner-subtext-div  {
    font-size: 1.2em;
    font-weight: 300;
    line-height: 1.0em;
}
.citi-content-section .inner-subtext-div {
    padding: 20px 10px 0 10px;
    color: #fff;
}

.citi-content-section {
    font-size: .889em;
    padding-bottom: 10px;
    margin-bottom: 20px;
    border-bottom: solid #bdbdbd thin;
    line-height: 1.4em;
}
.margin-tb	{
	margin-top: 0px;
	margin-bottom: 0px;
}
/* Our People Page */
.play-video-btn {
    background: url(/citi/assets/img/vidoverlay_small.png) no-repeat 50% 50%;
}

.bg-youtube {
    min-height: 452px;
}

.making-progress .inner-row .img-text {
    top: 84%;
}
.citi-content-section .inner-subtext {
    font-family: Interstate, sans-serif;
    font-size: 1.8em;
    font-weight: 600;
    line-height: 1.2em;
    color: #fff;
}
.linespacer	{
	padding: 2em 1em;
}
.img-text.bottom-text.sm2 {
    top: 84%!important;
}

/* ======================== */


.growth-and-progress	{
	margin: 0px 0px 28px 0px;
}
.growth-and-progress h2, .growth-and-progress h4	{
	font-family: Interstate, sans-serif;
} 
.growth-and-progress h2	{
	color: #022c78;
	font-size: 2.0em;
	padding: 2px;
	line-height: 1.2em;
	font-weight: 700;
}
.growth-and-progress h4	{
	color: #535557;
	font-size: 1.2em;
	padding: 18px 2px;
}



.circular span, .circular p	{
	color: #ffffff;
}
.circular {
  display: inline-block;
  position: relative;
  width: 280px;
  height: 280px;
  overflow: hidden;
  border-radius: 50%;
  margin: 10px;
}
.cEmployees, .cForCiti, .cForClients {
text-align: center;
height: 280px;
background-color: blue;
top: 95%;
}

.cEmployees	{
background-color: #002d71;
}
.cForCiti	{
background-color: #008dd5;
}
.cForClients	{
background-color: #00bef2;
}
.cTitle	{
	font-size: 1.6em;
	font-weight: 700;
}
#cCont	{
padding-top: 48px;
}
.cir-white-divider	{
	background-color: #fff;
    display: block;
    height: 4px;
    margin: 10px 0px;
    width: 80%;	
}



.text-container ul, .wide ul {
    margin: 0.75em 0;
    padding: 0 1em;
    list-style: none;
}
.text-container li:before, .wide li:before {
    content: "";
    border-color: transparent #049ce2;
    border-style: solid;
    border-width: 0.35em 0 0.35em 0.45em;
    display: block;
    height: 0;
    width: 0;
    left: -1em;
    top: 0.9em;
    position: relative;
}




/* custome mobile media */
@media (min-width: 992px) {
	.circular {
    width: 240px;
    height: 240px;
    border-radius: 50%;
    margin: 8px;
	}
	.cTitle {
    font-size: 1.3em;
    font-weight: 500;
	}
	#cCont {
    	padding-top: 23px;
	}
	#cCont > p	{
		font-size: 14px;
	}
	.cEmployees, .cForCiti, .cForClients {
	height: 240px;
	top: 85%;
	}
}

@media (max-width: 991px) {
}

@media (max-width: 832px) {
	.intro-message.home a {
    	letter-spacing: 0px;
    	font-size: 0.8em;
	}
	.dwnld-container a {
    	font-size: 0.8em;
	}
	.margin-tb	{
		margin-top: 0px;
		margin-bottom: 0px;
	}
}



@media (max-width: 768px) {
	.circular {
    width: 226px;
    height: 226px;
    border-radius: 50%;
    margin: 8px;
	}
	.cTitle {
    font-size: 1.2em;
    font-weight: 300;
	}
	#cCont {
    	padding-top: 22px;
	}
	#cCont > p	{
		font-size: 14px;
	}
	.cEmployees, .cForCiti, .cForClients {
	height: 240px;
	top: 85%;
	}

	div .margin-tb {
	margin-top: 10px;
	margin-bottom: 0px;
	}
}

@media (max-width: 736px) {
	.circular {
    width: 212px;
    height: 212px;
    border-radius: 50%;
	}
	#cCont {
    	padding-top: 20px;
	}
	.cEmployees, .cForCiti, .cForClients {
	height: 212px;
	top: 85%;
	}
	.cTitle {
    font-size: 1.2em;
    line-height: 1.0em;
    font-weight: 300;
	}
	#cCont > p	{
		font-size: 13px;
		line-height: 16px;
	}
	div .margin-tb {
	margin-top: 10px;
	margin-bottom: 0px;
	}
}
@media (max-width: 667px) {
	.circular {
    width: 184px;
    height: 184px;
    border-radius: 50%;
	}
	#cCont {
    	padding-top: 18px;
	}
	.cEmployees, .cForCiti, .cForClients {
	height: 184px;
	top: 85%;
	}
	.cTitle {
    font-size: 1.0em;
    line-height: 0.6em;
    font-weight: 300;
	}
	#cCont > p	{
		font-size: 12px;
		line-height: 12px;
	}
}


@media (max-width: 640px) {
	.circular {
    width: 184px;
    height: 184px;
    border-radius: 50%;
	}
	#cCont {
    	padding-top: 18px;
	}
	.cEmployees, .cForCiti, .cForClients {
	height: 184px;
	top: 85%;
	}
	.cTitle {
    font-size: 1.0em;
    line-height: 0.6em;
    font-weight: 300;
	}
	#cCont > p	{
		font-size: 12px;
		line-height: 12px;
	}
}

@media (max-width: 568px) {
.circular {
  width: 280px;
  height: 280px;
  border-radius: 50%;
  margin: 10px;
}
.cEmployees, .cForCiti, .cForClients {
	height: 280px;
	top: 95%;
	}
	.cTitle	{
	font-size: 1.6em;
	font-weight: 700;
	}
	#cCont	{
	padding-top: 48px;
	}
	#cCont > p	{
		font-size: 16px;
		line-height: 24px;
	}
}


@media (max-width: 414px) {
.circular {
  width: 280px;
  height: 280px;
  border-radius: 50%;
  margin: 10px;
}
.cEmployees, .cForCiti, .cForClients {
	height: 280px;
	top: 95%;
	}
	.cTitle	{
	font-size: 1.6em;
	font-weight: 700;
	}
	#cCont	{
	padding-top: 48px;
	}
	#cCont > p	{
		font-size: 16px;
		line-height: 24px;
	}
}

@media (max-width: 375px) {
	.circular {
  display: inline-block;
  position: relative;
  width: 280px;
  height: 280px;
  border-radius: 50%;
  margin: 10px;
	}
.cEmployees, .cForCiti, .cForClients {
	height: 280px;
	top: 95%;
	}
	.cTitle	{
	font-size: 1.6em;
	font-weight: 700;
	}
	#cCont	{
	padding-top: 48px;
	}
	.cir-white-divider	{
	background-color: #fff;
    display: block;
    height: 3px;
    margin: 10px 0px;
    width: 80%;	
	}
	#cCont > p	{
		font-size: 16px;
		line-height: 24px;
	}
}