/* Start Style Overrides */
.container{
	padding-bottom: 0!important;
}

footer{
	position: relative;
}

footer nav#site-map {
    font-size: 11px;
    color: #fff;
    text-shadow: 0px 0px 1px #333;
    background: red;
    width: 100%;
    padding: 0 10%;
    box-sizing: border-box;
}

footer nav#site-map ul li.parent {
    width: 32%;
}

footer nav#site-map ul li .column {
    width: 45%;
}

footer section#dark {
    width: 100%;
    background: #4A4A4A;
    height: 146px;
    position: absolute;
    bottom: 0;
    padding: 0 5%;
    box-sizing: border-box;
}

div#footer-logos {
    float: left;
    width: 30%;
}

footer .right {
    margin-top: 32px;
    width: 70%;
}

body {
	background-color: #ffffff;
	background-image:none;
}

.grid {
    width: 100%;
    box-sizing: border-box;
}

.grid.highlight {
    position: relative;
    padding: 0;
}

#main-nav li.resources {
	text-align:right;
}

#main-nav li.recommendations {
	width:220px;
}

#main-nav li.research {
	width:auto;
	padding-right:35px;
}

header.site h1 {
	z-index:999;
}

header.site h1 a{
	background: url('/assets/images/mpl-logo.index.png');
}

.gateway {
	background:#ffffff;
	border:5px solid #fee386;
	border-radius:10px;
	box-shadow:5px 5px 10px rgba(0,0,0,0.2);
	margin:0 auto;
	padding:20px;
	margin-top:-125px;
	font-size:14px;
	margin-bottom:25px;
	position:relative;
	padding-bottom:50px;
	margin-top: 0;
}

#main-nav ul.right-links {
	display:inline;
	width:auto;
	height:auto;
}

#main-nav ul.right-links li {
	display:list-item;
	margin: inherit;
	font-size:12px;
	letter-spacing:normal;
	line-height:normal;
	text-align:left;
	float:left;
}

#main-nav ul.right-links li a {
	color:#fff;
}

#main-nav ul.right-links li#location {
	width:141px;
	height:auto;
	border-color:#777;
	padding:0px 8px;
	margin-top:0px;
}

#main-nav ul.right-links li#catalog {
	width:95px;
	height:auto;
	border-color:#777;
	padding:0px 8px;
	margin-top:0px;
	position:relative;
	border-right:1px solid rgba(255,255,255,0.2);
}

.right-links {
	position: absolute;
	right: 0px;
	z-index:999;
}

.right-links ul{
	text-align:left;
	font-size:12px;
}

.right-links ul li {
	border-left: 1px solid rgba(255,255,255,0.2);
	float:left;
	list-style:none;
	text-transform:uppercase;
	width:100px;
	height:auto;
	padding:0px 8px;
	margin-top:0px;
	position:relative;
}

.right-links ul li a {
	color:#fff;
}

.right-links ul li:first-child {
	border:0px;
}

.right-links ul li#location {
	padding-right:0px;
}

.right-links ul li#catalog span {
	background:url('/assets/images/explore-countycat.index.png') bottom;
	width:16px; height:16px; display:block;
	position:absolute; bottom:3px; right:7px;
}

a.external:after {
	display:none;
}

ul.share {
    border-right: 0px;
    margin: 0 auto;
    float: none;
    padding-left: 10px;
}
/* End Style Overrides */


/* Start Loud Styles */

/* Start Loud Intro Top */
.loud-intro {
    margin-top: 50px;
    background-image: url('/assets/images/library_loud/ll-mint-bkg.jpg');
    background-position: left bottom;
}

.loud-bkg-fill{
    background-size: 100%;
    background-size: cover;
    box-sizing: border-box;
    display: table;
    background-size: 100vw 100%;
    width: 100%;
    background-repeat: no-repeat;
}

.loud-body-container {
    width: 100%;
    max-width: 960px;
    margin: 0 auto;
    padding-bottom: 0;
    box-sizing: border-box;
}

.loud-body-content-left {
    box-sizing: border-box;
    margin: 0 auto;
    float: left;
    padding-top: 20px;
}

.loud-body-content-right {
    box-sizing: border-box;
    margin: 0 auto;
    float: left;
}

.large-image img {
    width: 100%;
    max-width: 660px;
}

.large-image-center {
    margin: 0 auto;
    width: 100%;
    padding: 75px 0;
    box-sizing: border-box;
    text-align: center;
}

.large-image-center img {
    max-width: 850px;
    width: 100%;
}

.loud-events {
    background-image: url('/assets/images/library_loud/ll-cream-bkg.jpg');
    background-position: left top;
}

.loud-past {
    background-image: url('/assets/images/library_loud/ll-yellow-bkg.jpg');
    background-position: left top;
}

.loud-welcome {
    background-image: url('/assets/images/library_loud/ll-red-bkg.jpg');
    background-position: left top;
}


.loud-text-container.loudintro {
    margin-top: 40%;
}

.loud-text-container.futureevents {
    margin-top: 18%;
}

.loud-text-container.pastevents {
    margin-top: 45%;
}

.social-links {
    margin-top: 50px;
    box-sizing: border-box;
}

.social-links a {
    margin-right: 20px;
    font-size: 25px;
    color: #194348;
    -webkit-transition: background-color .25s;
    -moz-transition: background-color .25s;
    transition: background-color .25s;
}

.social-links a:hover {
    color: #072c31;
}

/* start columns padding*/
.col-50{
	width: 50%;
}

.col-full{
	width: 100%;
}

.padding-left{
	padding-left: 40px;
}

.padding-right{
	padding-right: 40px;
}

/* start fonts and links*/
h2{
	font-family: 'Slackey';
	color:  #194347;
	font-size: 30px;/* Approximation due to font substitution */
	font-weight: 400;
	text-transform: uppercase;
}
p{
	font-family: "Montserrat",sans-serif;
	color:  #194347;
	font-size: 18px;/* Approximation due to font substitution */
	font-weight: 400;
	line-height: 24px;
}

.dark-button {
    border-radius: 3px;
    border-width: 3.1084791666666667px;
    border-color: #194348;
    border-style: solid;
    background-color: #194348;
    padding: 5px 10px;
    color: #eae5c6;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    font-family: "Montserrat",sans-serif;
    -webkit-transition: background-color .25s;
    -moz-transition: background-color .25s;
    transition: background-color .25s;
}

.dark-button:hover{
    background-color: #072c31;
    color: #eae5c6;
}

/*----------START: american-klassiks-abc-css----------*/
.wrapper-american-klassiks {
	width: 100%;
	margin-top: 57px;
	padding: 20px;
	box-sizing: border-box;
 	background-color: #111;
	background-image: url(/assets/images/library_loud/american-klassiks-blue-flag-background.jpg);
	background-size: cover;
	background-repeat: no-repeat;
}

.american-klassiks-main {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	display: flex;	
}

.american-klassiks-left {
	width: 25%;
	display: flex;
	flex-direction: column;
	align-items: center;
}

/*overwrite previous styles*/
ul.share {
	border: none;
	margin: 0;
	padding: 0;
}

ul.share li {
	float: none;
	margin: 0;
}
/*-*/

.share-icons {
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-top: 32px;
}

.share-icons span {
	color: #fff;
	font-size: 24px;
	margin-bottom: 10px;
}

.share-icons ul {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.share-icons ul .fa {
	font-size: 1.75em;
	border: 2px solid #ccc;
	border-radius: 50%;
	width: 30px;
	height: 30px;
	text-align: center;
	padding: 8px 4px 0 4px;
	color: #ccc;
}

.share-icons ul .fa:hover {
	color: red;
	border: 2px solid red;
	transition: ease-in .2s;
}

.share-icons ul li {
/* 	width: 41px; */
	margin-bottom: 17px;
}

.american-klassiks-right {
	width: 75%;
	padding: 10% 5% 0 5%;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: flex-start;	
}

.american-klassiks-right .american-klassiks {
	width: 97%;
}

.american-klassiks-right .american-klassiks-main-text {
	width: 97%;
	height: 74px;
	margin: 12px 0 24px 0;
	display: block;
	background-image: url(/assets/images/library_loud/american-klassiks-main-text.png);
	background-repeat: no-repeat;
	background-size: contain; 
}

/*
.american-klassiks-right img {
	width: 100%;
}
*/

.img-heading {
	margin-bottom: 10px; 
	display: flex;
	align-items: center;
	justify-content: center;
}

.img-heading h2 {
	font-size: 50px;
	font-family: "Montserrat",sans-serif;
	margin: 0 6px;
}

img-heading img {
	width: 5%;
}

.img-heading span {
	color: #fff;
	font-size: 24px;
	margin: 0 6px;
	text-transform: uppercase;
}

.american-klassiks-right p {
	color: #fff;
	font-size: 25px;
	text-align: left;
}

.american-klassiks-right p a {
	color: #fff;
}

.american-klassiks-right p a:hover {
	cursor: pointer;
	color: #ddd;
}

/*-----A Bronzevile Week Events - text-----*/
.american-klassiks-right p:nth-of-type(2) {
	margin-top: 0;
	margin-left: 140px;
	text-transform: uppercase;
}

.event-time {
	display: flex;
	align-items: center;
	margin-left: 75px;
}

.event-address {
	display: flex;
	align-items: flex-start;
	margin-left: 67px;
}

.event-time img {
	margin-right: 22px;
}

.event-address img {
	width: 56px;
	margin-right: 6px;
}

.starring-klassik {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	align-self: flex-end;
}

.starring-klassik h2 {
	color: #fff;
}

.also-starring {
	align-self: flex-end;
	display: flex;
	align-items: center;
	margin-top: 35px;
	padding: 0 3% 1% 3%;
	background-image: url(/assets/images/library_loud/american-klassiks-spray-bkgd.png);
	background-repeat: no-repeat;
	background-size: 101%;
	background-position-y: bottom; 
}

.with-sista-strings {
	width: 50%;
}

.with-sista-strings h3, .and-nickel-rose h3 {
	color: #fff;
	font-size: 38px;
	text-align: center;
}

.and-nickel-rose {
	width: 50%;
	padding-top: 40px;
	position: relative;
	z-index: 2;
	right: 6px;
}

.featuring-sista-nickel-rose {
	align-self: flex-end;
	margin-top: 35px;
}

.featuring-sista-nickel-rose img {
}

.sponsor-logos {
	margin: 100px 0 80px 0;
	display: flex;
	justify-content: center;
}

.sponsor-logos img {
	margin-right: 40px;
}

/*----------END OF: american-klassiks-abc-css----------*/


@keyframes libAnimateRight {
  0% {
    transform: scale(.7) rotate(-2deg);
  }
  30% {
    transform: scale(.8.5) rotate(-1deg);
  }
  50% {
    transform: scale(1) rotate(0deg);
  }
  70% {
    transform: scale(.8) rotate(-1deg);
  }
  100% {
    transform: scale(1) rotate(0deg);
  }
}

-webkit-@keyframes libAnimateRight {
  0% {
    -webkit-transform: scale(.7) rotate(-2deg);
  }
  30% {
    -webkit-transform: scale(.8.5) rotate(-1deg);
  }
  50% {
    -webkit-transform: scale(1) rotate(0deg);
  }
  70% {
    -webkit-transform: scale(.8) rotate(-1deg);
  }
  100% {
    -webkit-transform: scale(1) rotate(0deg);
  }
}

@keyframes libAnimateLeft {
  0% {
    transform: scale(.7) rotate(2deg);
  }
  30% {
    transform: scale(.8.5) rotate(1deg);
  }
  50% {
    transform: scale(1) rotate(0deg);
  }
  70% {
    transform: scale(.8) rotate(1deg);
  }
  100% {
    transform: scale(1) rotate(0deg);
  }
}

-webkit-@keyframes libAnimateLeft {
  0% {
    -webkit-transform: scale(.7) rotate(2deg);
  }
  30% {
    -webkit-transform: scale(.8.5) rotate(1deg);
  }
  50% {
    -webkit-transform: scale(1) rotate(0deg);
  }
  70% {
    -webkit-transform: scale(.8) rotate(1deg);
  }
  100% {
    -webkit-transform: scale(1) rotate(0deg);
  }
}


.lib-fade {
  opacity: 0;
  -webkit-transition: opacity .25s;
  -moz-transition: opacity .25s;
  transition: opacity .25s;
}
.lib-fade.animate {
  opacity: 1;
}
.image-right {
  -webkit-transform: scale(.6) rotate(-3deg);
  -moz-transform: scale(.6) rotate(-3deg);
  transform: scale(.6) rotate(-3deg);
}
.image-right.animate {
  -webkit-animation: 1.5s ease-out .75s forwards libAnimateRight;
  -moz-animation: 1.5s ease-out .75s forwards libAnimateRight;
  animation: 1.5s ease-out .75s forwards libAnimateRight;
}
.image-left {
  -webkit-transform: scale(.6) rotate(3deg);
  -moz-transform: scale(.6) rotate(3deg);
  transform: scale(.6) rotate(3deg);
}
.image-left.animate {
  -webkit-animation: 1.5s ease-out .75s forwards libAnimateLeft;
  -moz-animation: 1.5s ease-out .75s forwards libAnimateLeft;
  animation: 1.5s ease-out .75s forwards libAnimateLeft;
}

.animate.delay-1 {
  -webkit-animation-delay: 0s;
  -moz-animation-delay: 0s;
  animation-delay: 0s;
}
.animate.delay-2 {
  -webkit-animation-delay: 1.5s;
  -moz-animation-delay: 1.5s;
  animation-delay: 1.5s;
}
.lib-fade.animate.delay-2{
  opacity: 1;
  -webkit-transition: opacity .25s 1.5s;
  -moz-transition: opacity .25s 1.5s;
  transition: opacity .25s 1.5s;
}
.animate.delay-3 {
  -webkit-animation-delay: 3s;
  -moz-animation-delay: 3s;
  animation-delay: 3s;
}
.lib-fade.animate.delay-3{
  opacity: 1;
  -webkit-transition: opacity .25s 3s;
  -moz-transition: opacity .25s 3s;
  transition: opacity .25s 3s;
}
.animate.delay-4 {
  -webkit-animation-delay: 4.5s;
  -moz-animation-delay: 4.5s;
  animation-delay: 4.5s;
}
.lib-fade.animate.delay-4{
  opacity: 1;
  -webkit-transition: opacity .25s 4.5s;
  -moz-transition: opacity .25s 4.5s;
  transition: opacity .25s 4.5s;
}

/* Start Tablet */
/* Tablet */
@media only screen 
and (max-width : 1023px) {
	
	.loud-body-container{
		max-width: 900px;
	}
	.loud-bkg-fill{
		background-size: 100% 100%;
	}
	.american-klassiks-right .american-klassiks-main-text {
		height: 45px;
	}	
}

/* Start Phone */
/* PHONE */
@media only screen 
and (max-width : 480px) {
	
	/* Start Style Overrides */
	#main-nav {
		display: none;
	}
	
	.locations-col {
		display: none;
	}
	
	li#location {
		display: none;
	}
	
	li#catalog {
		display: none;
	}
	
	header.site .right {
		display:none;
	}
	
	.mobile-location {
		 display:block;
		 text-align: center;
		 font-size: 16px;
	}
	
	footer {
		display: none;
	}
	/* end Style Overrides */
	
	.loud-body-container{
		padding-bottom: 20%;
	}
	
	.loud-text-container {
    	margin-top: 10%;
	}
	
	.large-image-center {
	    width: 80%;
	}
	
	.loud-text-container.loudintro {
    	margin-top: 10%;
    	margin-bottom: 10%;
	}
	
	.loud-text-container.futureevents {
	    margin-top: 10%;
	    margin-bottom: 10%;
	}
	
	.loud-text-container.pastevents {
	    margin-top: 10%;
	    margin-bottom: 10%;
	}
	
	/* 	start columns and padding */
	
	.col-50 {
	    width: 80%;
	    float: none;
	    margin: 0 auto;
	}
	
	.padding-left{
		padding-left: 0;
	}
	
	.padding-right{
		padding-right: 0;
	}
	
/*
	.loud-intro {
		background-size: cover; 
		background-repeat: no-repeat;
		background-position: center top;
		margin-top: 0;	
	}
*/

/*-----------START: AMERICAN-KLASSIKS - MOBILE-----------*/
	.wrapper-american-klassiks {
		margin-top: 0;
	}
	.american-klassiks-main {
		flex-direction: column;
		align-items: center;
	}
	
	.american-klassiks-left {
		width: 100%;
		margin-bottom: 25px;
		flex-direction: column;
		justify-content: space-between;
	}
	
	.american-klassiks-left img {
		width: 40%;
	}
	
	.share-icons {
		flex-direction: row;
		justify-content: center;
		align-self: center;
		align-items: center;
	}
	
	.share-icons span {
		margin-right: 15px;
		margin-bottom: 0;
		align-self: flex-start;
	}
		
	.share-icons ul {
		flex-direction: row;
		align-items: center;
	}
	
	.share-icons ul li {
		margin-bottom: 0;
		margin-right: 10px;
	}
	
	.american-klassiks-right {
		width: 100%;
		padding: 0;
	}
	

	.american-klassiks-right .american-klassiks-main-text {
		width: 100%;
		height: 118px;
		background-image: url(/assets/images/library_loud/american-klassiks-main-text-mobile.png);
		background-repeat: no-repeat;
		background-size: contain;
	}

	
	.american-klassiks-right p:nth-of-type(2) {
		margin: 0;
	}
	
	.event-time {
		margin-left: 0;
	}
	
	.event-address {
		margin-left: 0;
	}
	
	.starring-klassik {
		flex-direction: column;
		align-self: center;
		margin: 40px 0;
	}
	
	.starring-klassik .klassik {
		width: 100%;
	}
	
	.also-starring {
		flex-direction: column;
		padding: 0;
		background: none;
		align-self: center;
		align-items: baseline;
	}
	
	.sista-strings, .nickel-rose {
		width: 85%;
	}
	
	.with-sista-strings, .and-nickel-rose {
		width: 100%;
		padding: 0 2%;
		box-sizing: border-box;
		display: flex;
		flex-direction: column;
		align-items: center;
		background-image: url(/assets/images/library_loud/american-klassiks-spray-bkgd.png);
		background-repeat: no-repeat;
		background-size: 101%;
		background-position-y: 69%;
	}
	
	.and-nickel-rose {
		right: 0;
		margin-top: 60px;
		padding: 0;
	}
	
	.sponsor-logos {
		margin: 80px 0 15px 0;
		align-items: center;
		justify-content: end;
	}
	
	.sponsor-logos img {
		width: 25%;
	}
	
}
/*-----------END OF: AMERICAN-KLASSIKS-----------*/