/* CSS formatting for Madison City Channel MediaSite*/

@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700');
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,600,700,800,900');
@import url("https://testcf.cityofmadison.com/fonts/cityicons/style.css");

/* =======================================================================================================
		Overrides
====================================================================================================== */
.nav-bar-view .nav-bar-outer,
.nav-bar-view .navbar {
  background-color: #222;
}
.nav-bar-view .navbar .navbar-nav a:active, .nav-bar-view .navbar .navbar-nav a:focus, .nav-bar-view .navbar .navbar-nav a:hover {
  background-color: #333;
}
/* =======================================================================================================
		City Styles
====================================================================================================== */

.lead-lg, p.lead-lg, .com-page .lead-lg {
    font-family: "source-sans-pro","Source Sans Pro","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 2.4rem;
    font-weight: 300;
    max-width: none;
}
/* =======================================================================================================
		City Footer
====================================================================================================== */
footer.city-footer {
	margin-top: 60px;
  font-size: 16px;
  font-family: "source-sans-pro","Source Sans Pro","Helvetica Neue",Helvetica,Arial,sans-serif;
}
.parent-nav {
  position: relative;
  display: block;
  background-image: url('https://www.cityofmadison.com/sites/default/files/city-of-madison/information-technology/assets/information_technology-banner.jpg');
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 0;
}
@media (min-width: 768px) {
  .parent-nav {
    background-position: center -150px;
  }
}
.parent-nav:after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: '';
  background-color: #000;
  opacity: .6;
  z-index: 1;
}
.parent-nav header {
  position: relative;
  padding-top: 24px;
  text-align: center;
  color: #fff;
  z-index: 2;
}
.parent-nav header p {
  max-width: none;
  margin-bottom: 0;
  font-size: 1.8rem;
}
.parent-nav header h3 {
  margin-top: 10px;
  margin-bottom: 10px;
  font-size: 4.8rem;
  font-weight: 700;
  text-transform: uppercase;
}
.parent-nav ul {
  position: relative;
  float: none;
  margin-top: 0;
  margin-right: auto;
  margin-bottom: 0;
  margin-left: auto;
  padding: 0px 15px 9px 15px;
  z-index: 2;
}
@media (min-width: 450px) and (max-width: 768px) {
  .parent-nav ul {
    -webkit-column-count: 2;
    column-count: 2;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
  .parent-nav ul {
    -webkit-column-count: 1;
    column-count: 1;
  }
}
@media (min-width: 768px) {
  .parent-nav ul {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .parent-nav ul {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .parent-nav ul {
    width: 1170px;
  }
}
.parent-nav ul > li {
  padding-top: 0;
}
@media (min-width: 768px) {
  .parent-nav ul > li {
    float: left;
  }
}
.parent-nav ul > li > a {
	padding-top: 15px;
	padding-bottom: 15px;
  font-size: 1.6rem;
  color: #fff;
  text-shadow: none;
}
@media (max-width: 992px) {
  .parent-nav ul > li > a {
    font-size: 1.4rem;
  }
}
.parent-nav ul > li > a:hover,
.parent-nav ul > li > a:focus {
  background-color: rgba(255, 255, 255, 0.2);
}
@media (min-width: 768px) {
  .parent-nav ul > li > a {
    padding-right: 10px;
    padding-left: 10px;
  }
}
@media (min-width: 992px) {
  .parent-nav ul > li > a {
    padding-right: 19px;
    padding-left: 19px;
  }
}
@media (min-width: 1200px) {
  .parent-nav ul > li > a {
    padding-right: 31px;
    padding-left: 31px;
  }
}
.parent-nav ul > li.home > a,
.parent-nav ul > li.first > a {
  position: relative;
}
@media (min-width: 768px) {
  .parent-nav ul > li.home > a,
  .parent-nav ul > li.first > a {
    padding-right: 4px;
    padding-left: 4px;
    color: transparent;
  }
  .parent-nav ul > li.home > a:after,
  .parent-nav ul > li.first > a:after {
    content: '\e950';
    position: absolute;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    font-family: 'cityicons';
    color: #fff;
  }
}
.parent-nav ul > li.media {
  margin-top: 0;
  overflow: visible;
}
.footer {
  margin-top: 0;
	padding-top: 30px;
	padding-bottom: 30px;
  clear: both;
  position: relative;
  color: #eeeeee;
  background-color: #363a41;
  border-top: none;
  z-index: 0;
}
.footer {
  background-repeat: no-repeat;
  background-position: top center;
  background-size: contain;
  background-image: url("https://www.cityofmadison.com/sites/default/files/template/background-footer-xs.jpg");
}
@media (min-width: 768px) {
  .footer {
    background-image: url("https://www.cityofmadison.com/sites/default/files/template/background-footer-sm.jpg");
  }
}
@media (min-width: 992px) {
  .footer {
    background-image: url("https://www.cityofmadison.com/sites/default/files/template/background-footer-md.jpg");
  }
}
@media (min-width: 1200px) {
  .footer {
    background-image: url("https://www.cityofmadison.com/sites/default/files/template/background-footer-lg.jpg");
    background-size: inherit;
  }
}
.footer a {
  color: #a2d7e8;
}
.footer:after {
  content: '';
  background-image: -webkit-linear-gradient(top, rgba(54, 58, 65, 0) 0px, rgba(54, 58, 65, 0) 50px, #363a41 180px, #363a41 250px);
  background-image: -o-linear-gradient(top, rgba(54, 58, 65, 0) 0px, rgba(54, 58, 65, 0) 50px, #363a41 180px, #363a41 250px);
  background-image: linear-gradient(to bottom, rgba(54, 58, 65, 0) 0px, rgba(54, 58, 65, 0) 50px, #363a41 180px, #363a41 250px);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00363a41', endColorstr='#ff363a41', GradientType=0) !important;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled=false) !important;
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#363a41, endColorstr=#363a41)";
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  z-index: -1;
}
@media (min-width: 520px) {
  .footer:after {
    background-image: -webkit-linear-gradient(top, rgba(54, 58, 65, 0) 0px, rgba(54, 58, 65, 0) 140px, #363a41 250px, #363a41 275px);
    background-image: -o-linear-gradient(top, rgba(54, 58, 65, 0) 0px, rgba(54, 58, 65, 0) 140px, #363a41 250px, #363a41 275px);
    background-image: linear-gradient(to bottom, rgba(54, 58, 65, 0) 0px, rgba(54, 58, 65, 0) 140px, #363a41 250px, #363a41 275px);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00363a41', endColorstr='#ff363a41', GradientType=0) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false) !important;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#363a41, endColorstr=#363a41)";
  }
}
@media (min-width: 768px) {
  .footer:after {
    background-image: -webkit-linear-gradient(top, rgba(54, 58, 65, 0) 0px, rgba(54, 58, 65, 0) 200px, #363a41 275px, #363a41 300px);
    background-image: -o-linear-gradient(top, rgba(54, 58, 65, 0) 0px, rgba(54, 58, 65, 0) 200px, #363a41 275px, #363a41 300px);
    background-image: linear-gradient(to bottom, rgba(54, 58, 65, 0) 0px, rgba(54, 58, 65, 0) 200px, #363a41 275px, #363a41 300px);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00363a41', endColorstr='#ff363a41', GradientType=0) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false) !important;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#363a41, endColorstr=#363a41)";
  }
}
@media (min-width: 992px) {
  .footer:after {
    background-image: -webkit-linear-gradient(top, rgba(54, 58, 65, 0) 0px, rgba(54, 58, 65, 0) 80px, #363a41 220px, #363a41 250px);
    background-image: -o-linear-gradient(top, rgba(54, 58, 65, 0) 0px, rgba(54, 58, 65, 0) 80px, #363a41 220px, #363a41 250px);
    background-image: linear-gradient(to bottom, rgba(54, 58, 65, 0) 0px, rgba(54, 58, 65, 0) 80px, #363a41 220px, #363a41 250px);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00363a41', endColorstr='#ff363a41', GradientType=0) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false) !important;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#363a41, endColorstr=#363a41)";
  }
}
.footer div[class*="col-"]:first-of-type ul li {
  padding: 0;
  margin-bottom: 10px;
}
.footer .list {
  border-top: 1px solid #808080;
}
.footer .list li {
  padding: 10px 0;
  border-bottom: 1px solid #808080;
}
.footer ul {
  padding-left: 0;
  list-style: none;
  margin: 0;
  margin-bottom: 1em;
}
.footer ul li {
  margin-bottom: 0;
}
.footer ul.list.double li {
  float: none;
  width: auto;
  margin-right: 0;
}
.footer address,
.footer p {
	line-height: 1.42857143;
}

.com-footer {
    padding-top: 2.9rem;
    padding-bottom: 2.9rem;
    color: #fff;
    background-color: #222;
}
.com-footer a {
    color: #fff;
}
@media (min-width: 768px) {
    .com-footer .com-footer-logo {
        float:left;
        margin-right: 30px;
    }
}

.com-footer .com-footer-logo img {
    width: auto;
    height: 100px;
}

.com-footer .copyright {
    margin-bottom: 5px;
}

@media (max-width: 991px) {
  .com-footer .list-inline li {
    margin: 0.5em 0;
  }
}

@media (min-width: 768px) {
    .com-footer .copyright {
        margin-right:24px;
    }
}

@media (min-width: 768px) and (max-width:991px) {
    .com-footer .copyright {
        margin-left:130px;
    }
}

@media (min-width: 1200px) {
    .com-footer .copyright {
        display:inline-block;
        margin-bottom: 0;
    }
}

.com-footer .list-inline {
    display: inline;
    margin: 0;
}

@media (min-width: 768px) and (max-width:991px) {
    .com-footer .list-inline {
        margin-left:130px;
        display: block;
    }
}

.com-footer .list-inline li {
    padding-top: 0;
}

@media (min-width: 768px) and (max-width:1199px) {
    .com-footer .list-inline li:first-child {
        padding-left:0;
    }
}

@media (max-width: 767px) {
    .com-footer .list-inline li {
        display:block;
        padding-left: 0;
        padding-right: 0;
    }
}

@media (min-width: 768px) and (max-width:991px) {
    .com-footer .list-inline li {
        display:list-item;
        padding: 0;
    }
}

@media (min-width: 1200px) {
    .com-footer .list-inline li {
        padding-right:10px;
        padding-left: 10px;
    }
}

.com-footer .com-awards-links img {
    height: 90px;
    display: inline-block;
}

.com-footer .com-awards-links a + a {
    margin-left: 17px;
}
@media (max-width: 767px) {
  .com-footer .com-awards-links {
    padding-top: 20px;
  }
}
@media (min-width: 768px) {
    .com-footer .com-awards-links {
        text-align:right;
    }
}

@media (max-width: 767px) {
    .com-footer a[href*="govtech.com"],.com-footer a[href*="bloomberg.org"],.com-footer a[href*="medium.com"] {
        margin-top:15px;
    }
}

.com-footer a[href*="govtech.com"] .external.cityicons,.com-footer a[href*="bloomberg.org"] .external.cityicons,.com-footer a[href*="medium.com"] .external.cityicons {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}