/* slyons 11/16/18  flex container for varying contents*/

.superflex-container-row {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: stretch;
    align-content: stretch;
    height: auto;
}
.superflex-container-row > div {
		background:#F1F1F1;
		border:1px solid #999;
	   	margin: 10px;
		width: 394px;
		height: auto;
	}
	/*.hm-threecol-wrpr h1 {
	  margin: 0px !important;
	}*/
	.hm-threecol-wrpr h1:after {
	content: "";
	display: inline-block;
	/*width: 100%; nkim 041019*/
        min-width:60%; /*nkim 021419*/
	vertical-align: middle;
	border-bottom: 1px solid #999;
        }
	.threecol-cal {
		background:#F1F1F1;
		color:#FFF;
		float:left;
		margin:0;
		padding:30px 0 0 25px; /*nkim 041019*/
		width:10%;
	}
	.threecol-text {
		background:#FFF;
		margin:0;
		padding:10px 0 10px 0;
		width:77%;
		min-height:108px;
	}
	.threecol-text ul {
		
		margin:0;
		padding:0;
	}
	.threecol-text li {
		font: 600 17px 'Source Sans Pro', Arial, Helvetica, sans-serif;
		list-style: none;
		margin:0;
		padding:5px 5px 0 14px;
		text-transform: uppercase;
	}
.threecol-text li a, .threecol-text li a:link {
	color:#205493;
	font: 400 17px 'Source Sans Pro', Arial, Helvetica, sans-serif; /* nkim 082818 */
	text-decoration: none;
	text-transform:none;
}
.threecol-text li a:visited {
	color: #4c2c92; /*nkim 053019*/
	text-decoration: none;
}
.threecol-text li a:hover {
	color: #112e51; /*nkim 053019*/
	text-decoration: underline;
}
	.hm-threecol-wrpr .blue-box-btn {
   	 margin-top: 35px;
   	 text-align: center;
   	 width: 100%;
   	 }
.superflex-container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: stretch;
    align-content: stretch;
}
    .superflex-container > div { /* slyons 4/5/19 made spacing changes for defect 227953 */
    margin: 0 13px 26px 13px;
    width: 20.31%; /* slyons 5/31/19 updated now want 4 boxes across */
     border: 1px solid #999; /* begin slyons 6/5/19 updated now want 4 boxes across */
    -moz-box-shadow: 1px 2px 5px #AAA;
    -webkit-box-shadow: 1px 2px 5px #AAA;
    -ms-box-shadow: 1px 2px 5px #AAA;
    box-shadow: 1px 2px 5px #AAA; /* end slyons 6/5/19 updated now want 4 boxes across */
    padding: 10px 15px 0px 15px;
    height: auto;
    display: flex;
}

.superflex-container2, .superflex-container4 {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-items: stretch;
	align-content: stretch;
	margin-bottom:20px; /*nkim 010419*/
}

.superflex-container4  .topics-flex{ /*nkim 040219*/
    width: 45%;
    margin: 0 13px 50px 13px;
    padding: 0;
    height: auto;
    display: flex;
}

.superflex-container4 .superflex-content {/* slyons 3/28/19 */
		width:auto;
		height:100% !important;
	}

	.superflex-container2 .superflex-content {/* nkim 010419 */
		width:auto;
		height:100% !important;
	}
	.superflex-container2 .superflex-content-6-12,
	.superflex-container2 .superflex-content-mediaresources { /* nkim 010419 */
		width:auto;
		height: auto !important;
                min-height: 86%;
	}
	.superflex-container2 .superflex-content-toolsforms { /* nkim 041019 */
		width:auto;
		height: auto !important;
                min-height: 70%;
	}
	.superflex-container2 .superflex-content-4-12,
	.superflex-container2 .superflex-content-leadership {/* nkim 010419 */ 
		width:auto;
		height:auto !important;
	}

	.superflex-container2 .superflex-content-auto {/* slyons 03/29/19 added for topics boxes to be smaller*/
		width:auto;
		height:90% !important; /*nkim 041019*/
	}

/* slyons 20190408 added for auto lists with long right navigation support*/
.superflex-container-auto {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-items: stretch;
	align-content: stretch;
	margin-bottom:0px; 
        width: auto;
}


/* slyons 201904522 added to support elements within the flex container that were floating up */
.superflex-container-auto h1, .superflex-container-auto h2,  .superflex-container-auto h3, .superflex-container-auto h4, .superflex-container-auto h5, .superflex-container-auto p{
    min-width: 98%; 
        width: auto; 
}

.superflex-container-auto h2.resp-tab-active span.resp-arrow:after,.superflex-container-auto h2.resp-tab-content span.resp-arrow:after  {
    background-repeat: no-repeat;
    width: 25px;
    position: relative;
    height: 19px;
    background-size: contain;
    display: inline-block;
    right:40px;
}

.superflex-container-auto .resp-arrow:after, .superflex-container-auto .resp-tab-content .resp-arrow:after {
      background-repeat: no-repeat;
    width: 25px;
    position: relative;
    height: 19px;
    background-size: contain;
    display: inline-block;
    right:40px;

}

/* slyons 20190212 added for generic section page manual card support*/
.superflex-container3 {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-items: stretch;
	align-content: stretch;
	margin-bottom:0px; 
}
	.superflex-container3 .superflex-content {
		width:auto;
		height:100% !important;
	}
	.superflex-container3 .superflex-content-6-12,
.superflex-container3 .superflex-content-mediaresources { 
		width:auto;
		height:80% !important;
	}
	.superflex-container3 .superflex-content-4-12,
	.superflex-container3 .superflex-content-leadership {
		width:auto;
		height:auto !important;
	}

/* slyons 20190523 added for resp innovation page spacing */
.superflex-container-resp-inn {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-items: stretch;
	align-content: stretch;
	margin-bottom:-50px; 
}

.superflex-container-resp-inn .superflex-content {
		width:auto;
		height:100% !important;
}

/* slyons 20190212 added for generic section page manual card support*/

.superflex-container2 p,
.superflex-container3 p { /*nkim 031419*/
        margin-left:13px;
        /* width: 100%; slyons 20190517  */
        min-width: 95%; /*nkim 052119*/
        width: auto; /*nkim 052119*/
}

.superflex-container4 p {
        margin-bottom:10px;
}

.superflex-container .superflex-content {/* nkim 010419 */
    width: auto;
    height: 100%;
}

.superflex-container .flex-content2 { /* EH 01092019 */
	height: auto;
	width: 100%;
}

.superflex-container .flex-content3 { /* EH 01092019 */
	height: auto;
	width: 100%;
}

.superflex-container .flex-fourcol { /* EH 01092019 */
	height: auto;
}

/* EH 01/08/2019 */
.card-content-md .superflex-container {
    height: auto;
	display: flex;
}
.superflex-container .flex-content {
  width:100%;
   height: 100%;
   
}
.superflex-container span.pub-icon {
    float: left;
    margin: 0;
    padding: 0 10px 10px 0;
    height: 100%;
}
.flex-container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: stretch;
    align-content: stretch;
}
  .flex-container > div {
    width: 310px;
    margin: 10px;
    border: 1px solid #AAA;
    padding: 15px;
    min-height: 150px;
}
.flex-container .flex-content {
  width:100%;
}
.flex-container span.pub-icon {
    float: left;
    margin: 0;
    padding: 0 10px 10px 0;
}
/* slyons 5/31/19 added to make all boxes consistent */
.flex-content h4 {
    font: 600 17px 'Source Sans Pro', Arial, Helvetica, sans-serif !important;
    padding-top: 6px !important;
    line-height: 22px !important;
    vertical-align: middle;
    display: table-cell;
}
@supports (-ms-ime-align: auto) {
  .flex-content {
    float: left;
    width: 30%;
    }
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .flex-content {
    width: 30%;
    }
}

@media screen and (max-width: 79.9em) { /* width 1279px */
	.hm-threecol-row {
  	background-size: 300% !important; /* slyons 12/7/18 update in occ-styles */
  	}
  	.threecol-cal { /*nkim 041019*/
      	padding: 30px 0 0 15px; 
  	}
  	.superflex-container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: stretch;
    align-content: stretch;
  	}
	.superflex-container > div {
	width: 27.2%;/*nkim 121118*/
	}
  	.superflex-container4  .topics-flex{ /*nkim 040219*/
    width: 44%;
    }
    .superflex-container-auto {
            width: auto;
    }

}
@media screen and (max-width: 62.45em) { /* width 999px */
  	.threecol-cal { /*nkim 041019*/
      	padding: 30px 0 0 20px; 
  	}
	.superflex-container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: stretch;
    align-content: stretch;
	}
	.superflex-container > div {
	width: 41.8%;/*nkim 121118*/
	}
	  .superflex-container-auto {
	            width: auto;
    }
    
	.superflex-container4 .topics-flex {
    width: 46.3%;
	}
}
@media screen and (max-width: 900px) {
    .superflex-container4 .topics-flex {
    width: 46%;
	}
}
@media screen and (max-width: 882px) { /*nkim 042319*/
	.hm-threecol-wrpr h1:after {  /*nkim 042319*/
		border-bottom: 0 solid #999;
	}
}
@media screen and (max-width: 850px) {
    .superflex-container4 .topics-flex {
    width: 45.7%;
	}
}
@media screen and (max-width: 800px) {
    .superflex-container4 .topics-flex {
    width: 45.5%;
	}
}
@media screen and (max-width: 47.8em) { /* width 764px */
    .hm-threecol-row {
    background-size: 475% !important; 
    height: 120%;
    }
   .threecol-cal {  /*nkim 041019*/
    padding: 30px 0 0 4%;
    }
.superflex-container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: stretch;
    align-content: stretch;
}
	.superflex-container > div {
	width: 38.7%;/*nkim 121118*/
	}
	  .superflex-container-auto {
	            width: auto;
    }
	.superflex-container2 .superflex-content-6-12,
	.superflex-container2 .superflex-content-mediaresources { /* nkim 031419 */
		/*width:94.7% !important; nkim 042319*/
                width:auto !important; /*nkim 042319*/
		height: auto !important;
        min-height: 83%;
	}
	.superflex-container2 .superflex-content-toolsforms { /* nkim 041019 */
		width:auto !important;
	}
}
@media screen and (max-width: 726px) {
    .superflex-container4 .topics-flex {
    width: 45.3%;
	}
}
@media screen and (max-width: 680px) {
    .superflex-container4 .topics-flex {
    width: 45%;
	}
}
@media screen and (max-width: 600px) {
    .superflex-container4 .topics-flex {
    width: 44.75%;
	}
}
@media screen and (max-width: 35em) { /* width 560px */
	.hm-threecol-wrpr h1:after {
	width: auto; /*nkim 041019*/
        }
       	.threecol-cal { /*nkim 041019*/
      	padding: 30px 0 0 7%; 
  	}
.superflex-container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: stretch;
    align-content: stretch;
}
	.superflex-container > div {
		width: 90%;/*nkim 121118*/
	}
	
	.superflex-container-auto {
		
		            width: 100%;
    }
    
	  .superflex-container4  .topics-flex{ /* slyons 3/28/19 */
    width: 92.5%; /*nkim 040219*/
    height: auto;
    margin: 0px 15px 10px 15px;
  
}
.superflex-container4 p {
        margin-bottom:40px;
}
	.superflex-container2 .superflex-content, /* nkim 010419 */
        .superflex-container2 .superflex-content-auto { /* slyons 03/29/19 added for topics boxes to be smaller*/ 
		width:auto;
		height:auto !important;
	}
	.superflex-container2 .superflex-content-6-12,
	.superflex-container2 .superflex-content-mediaresources {/* nkim 010419 */
		width:auto;
		height:auto !important;
	}
        .superflex-container2 .superflex-content-toolsforms {/* nkim 041019 */
		width:auto;
		height:auto !important;
	}
	.superflex-container2 .superflex-content-4-12,
	.superflex-container2 .superflex-content-leadership {/* nkim 010419 */
		width:auto;
		height:auto !important;
	}

/* slyons 20190212 added for generic section page manual card support*/
.superflex-container3 .superflex-content, .superflex-container4 .superflex-content {/* slyons 03/29/19 */
		width:auto;
		height:auto !important;
	}
	
	.superflex-container3 .superflex-content-6-12,
	.superflex-container3 .superflex-content-mediaresources {/* nkim 010419 */
		width:auto;
		height:auto !important;
	}
	.superflex-container3 .superflex-content-4-12,
	.superflex-container3 .superflex-content-leadership {/* nkim 010419 */
		width:auto;
		height:auto !important;
	}
/* slyons 20190212 added for generic section page manual card support*/
        .superflex-container2 p,
        .superflex-container3 p { /* nkim 031419 */
        margin-left:13px;
        }
}
@media screen and (max-width: 380px) { /* width 380px */
       	.threecol-cal { /*nkim 041019*/
      	padding: 30px 0 0 7%; 
  	}
}