/**/
/* ITS Overrides      */
/**/

/* Normal H1(always) */
#advanced #mainContent h1{font-size:2.75em; font-weight:400; background:unset; color:#0a233f; text-align:unset; margin-bottom:.5em; display:block; line-height:1.25em; padding-left:15px; padding-right:10px; margin-right:auto; margin-left:auto}
#advanced #mainContent h1:before,.container:after{	display:table; content:" "}
#advanced #mainContent h1:after{clear:both}
#advanced.oneColumn #breadcrumbs {margin-top:-20px; margin-bottom:0px;}
#advanced.twoColumn #breadcrumbs {margin-top:-20px; margin-bottom:2em;}

@media (min-width: 1024px){#advanced #mainContent h1{padding-left:unset; padding-right:unset}}
@media (min-width: 1024px) and (max-width: 1279px){#advanced #mainContent h1{max-width:1000px !important}}
@media (min-width: 1280px) and (max-width: 1449px){#advanced #mainContent h1{max-width:1250px !important}}
@media (min-width: 1450px){#advanced #mainContent h1{max-width:1400px !important}}
@media (max-width: 400px) {#advanced #mainContent h1 {font-size:2.25em;}} /* check master css for sizes that I am overriding with my H1 normal reset above */

.lightgray {background: #fafafa}
.lightcyan.columns {border-top:2px solid #00b2e2; border-bottom:2px solid #00b2e2;}

/* Icons in Menus */
img.floatLeft {margin: 5px 25px 5px 0;}
a.btn-blue.btn-border small {font-size: .75em; display: block; text-transform: uppercase; margin-bottom: 5px;}

/* ITS Only */
.bgPhoto a div {font-size: 1.7em; padding: 30px; border: 2px solid #00b2e2;}
.flexCard.white {border: 1px solid #a7a8a9;}
.flexCard img.floatRight {float:right !important;}
.actionBlocks .lightgray {background: #f7f7f7; border:1px solid #c1e3f2;}
.actionBlocks .lightgray:hover {background: #efefef !important; border:1px solid #aeddf2;}
.grayMed {background:#757778;}

/* For Screenshots in KB Articles */
main.oneColumn img,
main.twoColumn img {max-width:100%; height:auto;}

/***/
/* New for Master CSS  */
/***/

.lead {font-family: Cambria, Times New Roman, serif; font-style: italic; font-size: 1.3em; line-height: 1.5em;}
.lead a {font-family:unset;}
.bgPhoto a:focus {display:inline-block;} /* button went 100% */
.btn-basic { border: 2px solid; border-radius: 10px; padding: 5px 10px; font-weight: bold;}
.caption[class*="align"] .heading {line-height:1.25em;}
td {vertical-align:top;}
img.img-border {border:1px solid #a7a8a9;}
.title2 {line-height: 1.35em; margin-bottom: 10px;}
.title3 {line-height: 1.35em; margin-bottom: 10px;}
.title4 {line-height: 1.35em; margin-bottom: 10px;}

.material-icons.above {margin-bottom: 12px;}

.dropdown.menu>li.opens-right>.is-dropdown-submenu {width:240px;}

#breadcrumbs {margin-bottom:25px;}
#breadcrumbs a {margin-bottom: 0px !important;}

@media (max-width: 400px){ #siteBar{font-size:3.25vw;}}
@media (min-width: 401px) and (max-width: 500px){ #siteBar{font-size:2.95vw;}}
@media (min-width: 501px) and (max-width: 600px){ #siteBar{font-size:2.65vw;}}

.columnize2 li, .columnize3 li, .columnize4 li {padding-right:10px;}

@media (max-width:600px) { /* 1-up */
    .columnize2 {column-count:1}
    .columnize3 {column-count:1}
    .columnize4 {column-count:1} }
@media (min-width:601px) and (max-width:767px) { /* 2-up */
    .columnize3 {column-count:2} 
    .columnize4 {column-count:2} }

.banner .item {background-color:currentColor;}

@media (min-width:767px) {#jobFeed .feedEkList .itemContent {width:40%;} }

/**/
/* ITS Homepage       */
/**/

/* big banner */
.homepage h1{display:none !important} /* Hide built-in H1 */
.homepage h1.headline{display:block !important} /* Hand-coded an H1 into Banner */
.homepage #bannerFull + .container {margin-top: 0px;}
.homepage #bannerFull .heading {display:none;} /* Hide built-in banner heading */
.homepage #bannerFull .caption[class*="align"] {position: unset; margin:0px auto;}
.homepage #bannerFull .caption[class*="align"] .container {background-color:rgba(10,35,63,0.5)}
@media (max-width: 600px) {
    .homepage #bannerFull .bgPhoto .caption[class*="align"] .container {padding:15px;}
    .homepage #bannerFull .caption[class*="align"] .container {width:100%; font-size:.8em; margin:15px;} }
@media (min-width: 601px) and (max-width: 800px)   {
    .homepage #bannerFull .caption[class*="align"] .container {font-size:.9em; width:65%;}}
@media (min-width: 1024px) and (max-width: 1279px) {
    .homepage #bannerFull .caption[class*="align"] {max-width:1000px !important;}}
@media (min-width: 1280px) and (max-width: 1449px) {
    .homepage #bannerFull .caption[class*="align"] {max-width:1250px !important;}}
@media (min-width: 1450px) {
    .homepage #bannerFull .caption[class*="align"] {max-width:1400px !important;}}

/* top actions */
.homepage #mainContent .actionBlocks.withIcons.col4 {margin-top: 2em; margin-bottom: 4em;}

@media (max-width:1023px) {
  .homepage .actionBlocks.withIcons .flexCard {flex: 1 1 48%; max-width: 48%; }
  .homepage .actionBlocks.withIcons .flexCard.white * {text-align: left !important;}
  .homepage .actionBlocks.withIcons .flexCard.white img {max-width:100px;} 
  .homepage .actionBlocks.withIcons .flexCard.white p.title2 {float:left;} 
  .homepage .actionBlocks.withIcons .flexCard.white div {display: block; overflow: hidden;} }
@media (max-width:700px) {
  .homepage .actionBlocks.withIcons .flexCard {flex: 1 1 100%; max-width: 100%; } }
  
/*NEW ... NO LONGER NEEDED */
@media (min-width:1024px) {
  .homepage.horiz .actionBlocks.withIcons .flexCard.white * {text-align: left !important;}
  .homepage.horiz .actionBlocks.withIcons .flexCard.white img {max-width:125px;} 
  .homepage.horiz .actionBlocks.withIcons .flexCard.white p.title2 {float:left;} 
  .homepage.horiz .actionBlocks.withIcons .flexCard.white div {display: block; overflow: hidden;} }

/* Lower Banner (employment) */
.homepage #mainContent .tier.banner .photo img {max-height: 325px;}
.homepage #mainContent .tier.banner .caption[class*="align"] .container {background-color:unset !important}
.homepage .banner.tier .full.banner .bgPhoto .caption[class*="align"] {background-color:rgba(8,49,81,0.8) !important} /* strengthen to override velocity */
.homepage .banner.tier .full.banner .bgPhoto .caption .container {width: unset !important;} /* strengthen to override velocity */
.homepage #mainContent .tier.banner .captionwrap{text-align:center; font-size: 1.35em !important;  margin: 0px auto; line-height: 1.65em;}
    @media (min-width: 767px) and (max-width:991px)  {.homepage #mainContent .tier.banner .captionwrap {width: 80%;}}
    @media (min-width: 992px) and (max-width:1324px) {.homepage #mainContent .tier.banner .captionwrap {width: 100%; }}
    @media (min-width: 1325px) {.homepage #mainContent .tier.banner .captionwrap {width: 60%; }}    
.homepage #mainContent .tier.banner .buttonwrap{float: unset !important; text-align: center; margin-top:2em; margin-bottom:2em}

/* Lower Banner (projects) */
.homepage .tier.actions.bgPhoto a:hover, 
.homepage .tier.actions.bgPhoto a:hover div { color: #0a233f; text-decoration: none !important;}
.homepage .tier.actions.bgPhoto a {text-decoration: none !important;}
.homepage .tier.actions.bgPhoto a>div {background-color: #e9e9ea !important; color: #0a233f !important; text-decoration: none !important;}
.homepage .tier.actions.bgPhoto a>div:hover {background-color: #0A233F !important; color: #ffffff !important;}
.homepage .tier.actions.bgPhoto .flexCard {padding: 20px;}

/* Numbers */
@media (max-width:991px) {
  .homepage .tier.columns.none .flexGrid.col4 .flexCard {flex: 1 1 48%; max-width: 48%; } }
@media (max-width:600px) {
  .homepage .tier.columns.none .flexGrid.col4 .flexCard {font-size: .85em; margin-bottom: 1em; border-bottom: 1px solid #00b2e2; padding-bottom: 1em; text-align: center;}
  .homepage .tier.columns.none .flexGrid.col4 .flexCard:last-child {border-bottom:none;}
  .homepage .tier.columns.none .flexGrid.col4 .flexCard img {width:60px; height:auto;} }


/**/
/* Help Desk          */
/**/
 
main#advanced.helpdesk.oneColumn > .container {margin-top: 0px !important;}
.helpdesk #mainContent h1 {}

/* Banner */
.helpdesk .heading {display:none;} /* Hide built-in banner heading */
.helpdesk h1 { margin:0em 0px .5em 0px;} /* Hand-coded an H1 into Banner */
.helpdesk h2.title3 {margin-bottom: 1em;}
.helpdesk .btn-white {color: #0a233f !important; background: rgba(255,255,255,1); width: 310px; border: 2px solid #00b2e2; padding: 12px 25px; margin-bottom: 1.25em !important; display: block; font-size: 1.25rem; font-weight: 700; text-align: left; text-decoration: none;}
.helpdesk .btn-white:hover {background: rgba(0,178,226,.7); color: #ffffff !important;}
.helpdesk .caption[class*="align"] {position: unset; margin:0px auto; max-width:95%;}
.helpdesk .caption[class*="align"] .container {background:unset; margin-top:0px !important; padding-left:0px;}
@media (max-width: 400px) {.helpdesk #bannerFull .bgPhoto .caption[class*="align"] .container {padding-left:10px !important;}}
@media (max-width: 1023px) {.helpdesk #bannerFull .bgPhoto {height: 280px}}
@media (min-width: 1024px) and (max-width: 1279px) {.helpdesk .caption[class*="align"] {max-width:1000px !important;}}
@media (min-width: 1280px) and (max-width: 1449px) {.helpdesk .caption[class*="align"] {max-width:1250px !important;}}
@media (min-width: 1450px) {.helpdesk .caption[class*="align"] {max-width:1400px !important;}}

/* OLD tier2 = Contact & Hours */ 
.helpdesk.old #tier2 table [class*="fi-"],
.helpdesk.new #tier1 table [class*="fi-"]{font-size:4em; margin-bottom:10px}
.helpdesk.old #tier2 table.contact a,
.helpdesk.new #tier1 table.contact a {color: #236595; border-bottom: 1px dotted #0a233f; text-decoration:none !important}
.helpdesk.old #tier2 .fourthRight h3,
.helpdesk.new #tier1 .fourthRight h3{margin:.25em 0px .75em 0px}
@media (min-width:992px) {
  .helpdesk.old #tier2 .fourthRight .flexCard:first-child,
  .helpdesk.new #tier1 .fourthRight .flexCard:first-child {border-right: 1px solid #a7a8a9;}}
@media (min-width:768px) and (max-width:991px) {
  .helpdesk.old #tier2 .fourthRight .flexCard,
  .helpdesk.new #tier1 .fourthRight .flexCard {flex: 1 1 100%; max-width: 100%; }
  .helpdesk.old #tier2 .fourthRight .flexCard:first-child,
  .helpdesk.new #tier1 .fourthRight .flexCard:first-child {border-bottom: 1px solid #a7a8a9; border-right:unset; padding-bottom:1em;}
  .helpdesk.old #tier2 .flexGrid.fourthRight > .flexCard:nth-child(even),
  .helpdesk.new #tier1 .flexGrid.fourthRight > .flexCard:nth-child(even) {text-align:center;}}
@media (max-width:767px) {
  .helpdesk .contact td {padding-top:2em !important;}
  .helpdesk .contact td:first-child {padding-top:0px !important;}
  .helpdesk .contact td i, 
  .helpdesk .contact td h3 {display: inline-block;}   
  .helpdesk .contact td p em br {display:none;} /*remove the extra break on emergency hotline */}

/* tier3 = Actions */ 
.helpdesk /*#tier3*/ .flexCard.gray {background:#757778; color:#ffffff !important;}
.helpdesk /*#tier3*/ .flexCard.gray:hover {background:#0a233f;}
.helpdesk /*#tier3*/ .flexCard.gray a, 
.helpdesk .flexCard.gray a * {color:#ffffff !important;}

/* tier5 = Announcements & Calendar */ 
.helpdesk.old #tier5.tier.attach, 
.helpdesk.new #tier4.tier.attach {background:#f4fbff; margin-bottom:0px; border-top: 1px solid #00b2e2;}
.helpdesk.old #tier5.attach h2,
.helpdesk.new #tier4.attach h2 {margin-left: 25px;}
.helpdesk .attach .blogItem {background:#ffffff; border: 1px solid #cde7f3; margin-top:0px; border-radius: 20px; margin-bottom:30px; border-top: 4px solid #0A233F;}        
.helpdesk .attach .blogHead {font-size: 1.55em; padding: 20px 100px; color: #007899; position: relative;}
.helpdesk .attach .blogHead span.flag {padding: 10px 5px 10px 15px; color: #ffffff; position: absolute; top: 0px; left: 20px; border-bottom-left-radius: 15px; border-bottom-right-radius: 15px;}
.helpdesk .attach article.flexCard .image {margin: 0 20px;} 
.helpdesk .attach article.flexCard .info {padding: 0 20px 0 0;}        
.helpdesk .attach article.flexCard .link {margin-top: 1em; text-align: right;}
.helpdesk .attach .datestamp {font-weight:bold; margin-top:10px;}
.helpdesk .history {text-align:center; margin-top:2em; font-weight:bold;}
.helpdesk .sideCalendar {display: flex; flex-wrap:no-wrap; flex-direction:column;}
@media (max-width:800px) {
  .helpdesk.old #tier4.attach .flexGrid.thirdRight, 
  .helpdesk.new #tier5.attach .flexGrid.thirdRight {flex-direction: column-reverse; margin-bottom:2em;}
  .helpdesk.old #tier5.attach .flexGrid.thirdRight article.flexCard, 
  .helpdesk.new #tier4.attach .flexGrid.thirdRight article.flexCard {flex: 1 1 100%; max-width: 100%; }
  .helpdesk .sideCalendar {display: flex; flex-wrap:no-wrap; flex-direction:row;}
  .helpdesk .sideCalendar #calendar {flex: 1 1 325px; margin-bottom:15px;}
  .helpdesk div#monthView::before {content: "This Month:"; font-weight: bold; padding-bottom: 10px; line-height: 2.5em; font-size: 1.25em;}
  .helpdesk .history {text-align: center;}
  .helpdesk .history p {display: inline-block; font-weight:bold;}    
  .helpdesk .history p:first-child::after {content: "|"; margin-left: 15px; margin-right: 10px;}}
@media (max-width:600px) {
  .helpdesk .sideCalendar {display: flex; flex-wrap:no-wrap; flex-direction:column;}}
@media (max-width:450px) {
  .helpdesk.old #tier5.attach .flexVertical article.flexCard, 
  .helpdesk.new #tier4.attach .flexVertical article.flexCard {-webkit-flex-direction: column; flex-direction: column; margin-top:10px;}
  .helpdesk.old #tier5.attach .flexVertical article.flexCard .info, 
  .helpdesk.new #tier4.attach .flexVertical article.flexCard .info {padding:20px 20px 0px 20px;}}

/**/
/* help.unf.edu       */
/**/

.helpTD span.question {display: block; font-size: 3em; line-height: 1em; text-align:center !important; border: 5px solid #00b2e2; border-radius: 50%; height: 65px; width: 65px; margin: 0px auto 20px auto; padding: 3px 5px 5px 8px;}
.helpTD a:hover span.question {border: 5px solid #0a233f;}
.helpTD .flexGrid[class*="action"] .flexCard > a {padding:10px;}
.helpTD .flexGrid[class*="action"] .flexCard.gray > a:hover .title3 {color:#ffffff !important;}
.helpTD .flexGrid.withIcons img {margin:0 20px 10px 0 !important;}
.helpTD .history {text-align:center; font-weight:bold;}

@media (max-width:950px) {
  .helpTD .flexGrid[class*="action"] .flexCard {flex: 1 1 100% !important; max-width: 300px !important;} }
@media (max-width:1023px) {
  .helpTD .fourthRight .flexCard {flex: 1 1 100% !important; max-width: 100% !important; }
  .helpTD .sideCalendar {display: flex; flex-wrap:no-wrap; flex-direction:row;}
  .helpTD .sideCalendar #calendar {flex: 1 1 325px; margin-bottom:15px;}
  .helpTD div#monthView::before {content: "This Month:"; font-weight: bold; padding-bottom: 10px; line-height: 2.5em; font-size: 1.25em;}   
  .helpTD .history {text-align: center;}
  .helpTD .history p {display: inline-block; font-weight:bold;}    
  .helpTD .history p:first-child::after {content: "|"; margin-left: 15px; margin-right: 10px;} }
@media (max-width:600px) {
  .helpTD .sideCalendar {display: flex; flex-wrap:no-wrap; flex-direction:column;} }
@media (max-width:500px) {
  .helpTD .flexGrid[class*="action"] .flexCard a > * {display:inline-block; padding-top:0px !important; vertical-align:middle;} }


/**/
/* Outage Feed        */
/**/

.homepage.old #tier1.tier, 
.helpdesk.old #tier1.tier {margin-bottom:0px;}
.homepage.old #tier1 > .container, 
.helpdesk.old #tier1 > .container {max-width:unset !important; width:100% !important; padding-left:0px; padding-right:0px;}

#outagefeed {position:relative;}
#outagefeed h2 {font-size: 1.25em; font-weight: 600; margin:0px; padding:12px;}
#outagefeed h2 small {display: block; font-size: .75em; text-transform: uppercase; margin-top: 5px;}
#outagefeed {background-color: #529f681a;} /*fallback = no FOUC*/   
#outagefeed.normal {background-color: #529f681a; border:1px solid #529F68; margin: 0 auto;}
#outagefeed.alert  {background-color: #fff5d1; width:100%; margin: 0px auto;}
#outagefeed h2 {text-align:center; color:#000000; padding:12px;} /*fallback = no FOUC*/  
#outagefeed.normal h2 {text-align:center; color:#428054; padding:12px 50px;}
#outagefeed.alert  h2 {border-bottom: 1px solid #ffe591;}
#outagefeed.alert .heading2 {display:block;}
#outagefeed.alert .heading1 {display:none;}
#outagefeed.normal .heading1 {display:block;}
#outagefeed        .heading2, 
#outagefeed.normal .heading2 {display:none;}
#outagefeed.normal #panel {display:none !important;}
#outagefeed h2 span#badge {background: #444648; border-radius: 50%; color: #fff5d1; margin-left: 0.5em;}
#outagefeed button {display:block;	width:100%; background: none; border:none; padding:0px 20px;}
#outagefeed #icon .arrow-down {position: absolute; top: 11px; right: 25px; border: solid #f5bb00; border-width: 0 7px 7px 0; display: inline-block; padding: 6px; transform: rotate(45deg); -webkit-transform: rotate(45deg);}
#outagefeed #icon .arrow-up   {position: absolute; top: 19px; right: 25px; border: solid #f5bb00; border-width: 0 7px 7px 0; display: inline-block; padding: 6px; transform: rotate(-135deg); -webkit-transform: rotate(-135deg);}
#outagefeed #panel {padding:0px 20px 20px 20px;}
#outagefeed .message {padding:0px 10px 5px 10px;}
#outagefeed .eventtype {margin:10px 0px 0px 0px;}
#outagefeed .datestamp {margin:0px;}
#outagefeed h3 {margin-top:.75em;}
#outagefeed a.history {text-align:right; margin-right:1em; display:block;}
@media (max-width: 400px) {#outagefeed.alert h2 {padding: 12px 40px 12px 0px}}

/* Start Collapsed ("collapsed" class is provided in the list query setup as the keyword) */
#outagefeed #icon.collapsed .arrow-down {display:inline-block;}
#outagefeed #icon.collapsed .arrow-up {display:none}
#outagefeed #icon.collapsed.toggle .arrow-down {display:none;}
#outagefeed #icon.collapsed.toggle .arrow-up {display:inline-block;}
#outagefeed #panel.collapsed {display:none;}
#outagefeed #panel.collapsed.toggle {display:block;}
 
/* Start Open ("open" class is provided in the list query setup as the keyword) */
#outagefeed #icon.open .arrow-down {display:none;}
#outagefeed #icon.open .arrow-up {display:inline-block;}
#outagefeed #icon.open.toggle .arrow-down {display:inline-block;}
#outagefeed #icon.open.toggle .arrow-up {display:none;}
#outagefeed #panel.open {display:block;}
#outagefeed #panel.open.toggle {display:none;}

/* Outage Details Page */
#outage {margin-bottom:200px}
#outage section {margin-bottom:40px;}
#outage > p[class^="label-"] {margin-bottom:40px;}
#outage .label-red {background-color:#f28c8c; color:#000; font-weight:bold; padding:3px 10px; border-radius: 20px; width:150px; text-align:center;}
#outage .label-green {background-color: rgba(167,198,163,.5) /*#a7c6a3*/; color:#000; font-weight:bold; padding:3px 10px; border-radius: 20px; width:150px; text-align:center;}
#outage .label-blue {background-color: rgba(164,199,221,.5) /*#a4c7dd*/; color:#000; font-weight:bold; padding:3px 10px; border-radius: 20px; width:150px; text-align:center;}
#outage .table-gray {width:100%;}
#outage .table-gray th {color:#ffffff !important; background-color:#6F737A; font-weight:bold;}
#outage .table-gray tr:nth-child(odd) {background-color: rgba(233,233,234,.5);}
#outage .table-gray tr:nth-child(even) {background-color: #e9e9ea;}
#outage .table-gray td.info {font-size:1.1em;}


/**/
/* About ITS          */
/**/

.about .btn-blue.btn-border {width: 100%;}
.about.division .tier.actions.bgPhoto {height: 500px !important;}
.about.division .tier.actions.bgPhoto {margin-bottom:0px;}
.about.division #tier2 .flexGrid.col2 .flexCard {position:relative; padding: 1em; padding-bottom: 55px;}
.about.division #tier2 .flexGrid.col2 .flexCard a.btn-blue {position: absolute; bottom: 15px;  right: 15px;}
.about.employment .flexCard.lightgray {position:relative; padding-right:25px;}
.about.employment .flexCard.lightgray img.floatRight {float: right !important; text-align: top !important; position: absolute; right: 15px; top: 20px;}

.contact i*[class^="fi-"]{margin-right:20px;}
.contact .flexGrid.col2>.flexCard {margin-bottom:50px;}

@media (min-width: 1024px) {
    #advanced.about.division #mainContent h1 {padding-left:40px !important}
    .about.division .tier.actions.bgPhoto {height: 275px !important;}    
    .about .lead {width: 75%;}
    .about.division .lead, 
    .about.division .mission {width: 75%; margin-left: 40px;}
    .about .flexCard.white {padding:1em} }
@media (min-width:600px) and (max-width: 991px) {
    .about.pmo #tier3 .flexGrid.col5 .flexCard {flex: 1 1 32%; max-width: 31.33333%; margin-bottom:10px;} 
    .about.employment .flexCard.lightgray {flex: 1 1 48%; max-width: 48%; margin-bottom:10px;} }
@media (max-width:767px) {
    .about .flexGrid.fourthRight > .flexCard:nth-child(odd),
    .about .flexGrid.fourthRight > .flexCard:nth-child(even) {flex: 1 1 100% !important; max-width: 100% !important; } }
@media (max-width: 600px) {
    .about.pmo .tier.lightcyan section h2 {text-align:left !important; padding-left: 20px;}
    .about.pmo .tier.lightcyan section div {width: unset !important;}
    .about.pmo .tier.columns.none section h2 {text-align:left !important;}
    .about.employment .flexCard.lightgray {margin-bottom:5px;} }

/**/
/* ITS News           */
/**/

.tier.news article.flexCard {margin-bottom: 2em;}
.tier.news article h2 {font-size: 1.65em}
@media (min-width:601px) and (max-width:1024px){
    .tier.news article h2 {font-size: 1.35em;} }
    
    
/**/
/* Leadership         */
/**/
 
/* Leaders with Bios */
@media (min-width:600px) {
    .leadership .flexGrid.fourthRight .floatSection p {display:block; overflow:hidden;} /* prevent bios from wrapping */}
@media (max-width: 1024px) {
    .leadership .flexGrid.fourthRight {-webkit-flex-direction: column; flex-direction: column;}
    .leadership .flexGrid.fourthRight > .flexCard {flex: 1 1 100%; max-width: 100%;}
    .leadership .flexGrid.fourthRight img {width:30vw;} }
@media (max-width:600px) {
    .leadership .flexGrid.fourthRight img {width:175px;} }

/* Directors & ADs */
@media (max-width: 600px) { /* 1-up vertical-stack */
    .leadership .flexGrid.col4 .flexCard img,
    .leadership .flexGrid.col5 .flexCard img {float: left; width: 100px; margin-right: 15px;} /* switch to vertical list with photo left and name right */}
@media (min-width: 601px) and (max-width:767px) { /* 3-up */
    .leadership .flexGrid.col4>.flexCard,
    .leadership .flexGrid.col5>.flexCard {flex: 1 1 32% !important; max-width: 31.333333% !important;} }
@media (min-width: 768px) and (max-width:991px) { /* 4-up*/
    .leadership .flexGrid.col4>.flexCard,
    .leadership .flexGrid.col5>.flexCard {flex: 1 1 23% !important; max-width: 23% !important;} }


/**/
/* Strategy           */
/**/

.strategy .anchors a {whitespace:nowrap}
.strategy .accordionBlock.light .accordion-title {font-weight:600}
.strategy #mainContent .container {padding-left:0px;} /* fix bug in master CSS */


/**/
/* Policies           */
/**/

#policy table.summary {margin:40px auto; background: rgb(240,248,255)}
#policy table.summary td {padding: 2px 4px; border: 1px solid #c9d6e5}
#policy table.summary td[rowspan] {background:#e1ecf7}
#policy input[type="checkbox"] {margin-bottom: 0px; margin-top: -2px; vertical-align: middle;}
#policy input[type="checkbox"][readonly] {pointer-events: none;}  

@media (min-width: 1024px) {
    #policy table.summary{width:80%;} }
@media (max-width: 767px) {
    #policy table.summary td.mini {display:inline-block;}
    #mainContent #policy input[type="checkbox"] {margin-left: 0px; margin-top:2px; vertical-align:top;}
    #mainContent #policy label {max-width:85%;} }


/**/
/* Getting Started    */
/**/

.getstarted .flexCard.white section, 
.getstarted .flexCard.white table {height:100%;}
.getstarted table {width:100%;}
.getstarted td h3 {padding-left:8px;}
.getstarted td a.btn-border {font-size:1.15em; border: 2px solid #00b2e2; background:#00b2e2; padding: 5px 15px; border-radius: 10px; top:0px; right:0px; text-decoration:none; margin:1em auto; display:block; text-align:center;}
.getstarted td a.btn-border:hover {background:rgba(205,231,243,1);}
.getstarted .lightgray table {width:100% !important;}
.getstarted .lightgray .grayMed {width: 100%;}
.getstarted .lightgray .grayMed img {max-width:100%; height:auto; margin:0px auto;}
.getstarted .lightcyan table {width: 100%; margin: 0px auto;}
.getstarted .lightcyan img {border:1px solid #a7a8a9}

@media (max-width: 600px) {
    .getstarted .flexCard.lightgray {margin-bottom:10px;} }
@media (min-width: 601px) and (max-width:991px) {
    .getstarted .lightcyan .columnize2 {column-count:1;} }
@media (min-width: 767px) and (max-width:900px) {
    .getstarted .lightgray tr > td:first-child {width: 110px;}
    .getstarted .flexCard.white td .grayMed {max-width:110px;}
    .getstarted .flexCard.lightgray {flex: 1 1 48%; max-width: 48%; margin-bottom:10px;} }
@media (min-width: 901px) and (max-width:1023px) {
    .getstarted .lightgray tr > td:first-child {width: 150px;}
    .getstarted .flexCard.white td .grayMed {max-width:150px;}
    .getstarted .flexCard.lightgray {flex: 1 1 48%; max-width: 48%; margin-bottom:10px;} }
@media (min-width: 1024px) and (max-width:1279px) {
    .getstarted .lightgray tr > td:first-child {width: 190px;}
    .getstarted .flexCard.white td .grayMed {max-width:190px;}
    .getstarted .flexCard.lightgray {flex: 1 1 48%; max-width: 48%; margin-bottom:10px;} }
@media (min-width: 1280px) {
    .getstarted .lightcyan table {width: 80%; margin: 0px auto;}    
    .getstarted .lightgray tr > td:first-child {width: 225px;}
    .getstarted .flexCard.white td .grayMed {max-width:225px;} }


/**/
/* Searchable Lists   */
/**/

/* Search Filters */
#searchList #filterbox {background:#cde7f3;	padding:20px 10px 35px 10px; border-radius:10px; margin-bottom:30px;}
#searchList #filterbox .fields {display: flex; flex-wrap:no-wrap; flex-direction:row;}
@media (max-width: 700px) { #searchList #filterbox .fields {flex-direction:column;}}
#searchList #filterbox .col {flex:1 auto;}
#searchList #filterbox .col:first-child {flex:1 40%;}
#searchList #filterbox .resetBtn {text-align:right; margin-right:1.5%;	/*display:inline-block;	*/ float:right;}
#searchList #filterbox h2, #searchList #filterbox label {font-size:1.1em; font-weight:bold; color: #0a233f; margin:0px 0px 5px 10px; display:block}
#searchList #filterbox select {height:35px /*for mobile*/; padding: 6px; margin: 0px 10px 15px 10px; border: 1px solid #ccc; border-radius: 4px}
#searchList #filterbox #searchKeywords {width:95%;}
#searchList #filterbox #searchCategory {width:70%;}
#searchList #filterbox #searchDept {width:70%}
#searchList #filterbox #searchReset {opacity:.75}
#searchList .placeholder {padding-left:15px;}
#searchList .filterApplied {height:50px;}
#searchList .filterApplied h2.label {font-size:1.65em; color:#0a233f; padding-left:15px;}
@media (max-width: 500px) {#searchList .filterApplied h2.label {font-size:5vw;}}
#searchList table {width:100%; margin:.75em 0px;}
#searchList table .lbl {width:150px;}
#searchList table .data {padding:1em 0px;}
#searchList.kb table h2 {font-size: 1.15em; font-weight:bold; padding-top:16px;}

/* Knowledgebase List */
#searchList .list.kb {padding-left: 0; margin:0px;}
#searchList .list.kb li {position: relative; display: block; margin-bottom: -1px; border: 1px solid #DDD; cursor:pointer}
#searchList .list.kb li:first-child {border-top-right-radius: 4px; border-top-left-radius: 4px;}
#searchList .list.kb li:last-child {border-bottom-right-radius: 4px; border-bottom-left-radius: 4px;}
#searchList .list.kb li:nth-child(odd) {background-color: #f6f7f9;}
#searchList .list.kb li:nth-child(even) {background-color: #ffffff;}
#searchList .list.kb li:hover {background-color: #d8eaf2;}
#searchList .list.kb li a {display:block; padding: 10px 15px; color:inherit; text-decoration:none;}

/* Services List */
#searchList .list.services {padding-left: 0; margin:0px;}
@media (min-width: 600px) {
    #searchList .list.services {columns: 2; }
}
#searchList .list.services li {page-break-inside: avoid; margin-bottom:8px; background-color: #f6f7f9; position: relative; display: block; border: 1px solid #DDD; cursor:pointer}
#searchList .list.services li:first-child {border-top-right-radius: 4px; border-top-left-radius: 4px;}
#searchList .list.services li:last-child {border-bottom-right-radius: 4px; border-bottom-left-radius: 4px;}
#searchList .list.services li:hover {background-color: #d8eaf2;}
#searchList .list.services li a {display:block; padding: 10px 15px; color:inherit; text-decoration:none;}

/* Services Catalog from Ektron */
#service #catalogMain { float:left; width:65%; border-top: #4c77aa solid 1px; padding-top:30px;}
#service #catalogSide {float:right; width:28%;}
#service #catalogSide li {margin: 0px 10px 0px 0px; list-style-position: outside;}
#service h1 {margin-bottom:8px}
#service .aka {font-size: .8em; color:#6f737a; font-weight: bold; border-bottom: #ffce00 solid 1px; margin-bottom:30px}
#service .servicelogo {float:right; padding: 0px 0px 10px 10px}
#service .crumbs {margin-bottom:15px; font-size: .8em; border-bottom:0px; font-weight:normal}
#service .crumbs a{color: #0076cc;}
#service .crumbs a:hover{color: #803795;}
#service #infoIT {width:100%; border-top: 3px solid #4c77aa; margin-bottom:25px}
#service #infoIT h2.ITtitle {font-size:1.1rem; margin:0px; padding:2px 15px; background:#DAEDFE; border-top: 1px solid #4c77aa; font-weight:bold; cursor:pointer;}
#service #infoIT .ITdetails {background: #f0f8ff; padding:10px 15px 10px 25px; border-top: 1px solid #4c77aa;}
#service #infoIT .ITdetails a {color:#00538f}
#service #infoIT .ITdetails ul {margin-top:0px; margin-bottom:0px}
#service .reverse-gray { font-family: "Open Sans",Arial,san-serif; font-size: 1.175em; color: #fff; font-weight: bold; padding: 4px 6px 4px 8px; margin: 0 0 4px 0; background: #74777a;}
#service .reverse-gray h2 {margin: 0px; padding: 4px 6px 4px 8px; font-size: 1.1rem; color:#ffffff;}
#service .box-gray {margin-top:-3px; margin-bottom:15px; font-family: "Open Sans",Arial,san-serif; padding: 8px; background: #eaeeef; border: 1px solid #a3a6ab;}
#service .box-gray ul {margin-left:20px; margin-top:0px;}
#service .box-gray li {margin-left:0px}

@media only screen and (max-width: 767px) /*Phone*/ {
	#service #catalogMain {float: none;width: 100%;}
	#service #catalogSide {clear: both; float: none; width: 100%}
	#service .servicelogo {max-width:50%}
	#service .servicelogo img{width:100% !important}}