/* artcinco */

p {
	font-size: 16px;
	color: #CCC; /* #ffffff */
	line-height: 18px;
	margin-bottom: 9px;
	margin-top: 12px;
	font-family: 'Exo 2', Verdana, Geneva, sans-serif;
	font-weight: 500;
}

a {
	text-decoration: none;
	color: #CCC; /* #888 */
	font-weight: 800;
}

a:hover {
	text-decoration: none;
	color: #777;
}

video {
	width: 100% !important;
	height: auto !important;
}

.pic-link {
}

.pic-link:hover  { 
    opacity:0.5;
    filter:Alpha(opacity=50); /* IE8 and earlier */
  }


/* video placeholder transparent fade for iOS Safari yo and others */  

.videoplaceholder {
	background: rgb(0,0,0);
	background: -moz-linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 65%, rgba(0,0,0,1) 100%);	background: -webkit-linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 65%, rgba(0,0,0,1) 100%);
	background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 65%, rgba(0,0,0,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
	position:relative;
}

/* video jukebox overlay */

.vj-artist {
    text-align: left;
    padding-left: 3px;
    font-size: 16px;
    font-family: 'Exo 2', Verdana, Geneva, sans-serif;
	font-weight: 800;
}

.vj-song {
    text-align: left;
	font-style: italic;
    padding-left: 0px;
    font-size: 16px;
    font-family: 'Exo 2', Verdana, Geneva, sans-serif;
}

.vj-date {
    text-align: left;
    padding-left: 3px;
    font-size: 14px;
    font-family: 'Exo 2', Verdana, Geneva, sans-serif;
}

.vj-venue {
    text-align: left;
    padding-left: 0px;
    font-size: 14px;
    font-family: 'Exo 2', Verdana, Geneva, sans-serif;
}

#overlay {
	position: absolute;
	bottom: 72px;
	left: 0px;
    color: #ffffff;
    background-color: rgb(0 0 0 / 50%);
    padding: 8px 18px 12px 10px;
    z-index: 1983;
    /* border-top-right-radius: 5px;
    border-bottom-right-radius: 5px; */
    text-shadow: 0.5px 0.5px black;
	text-align: left;	
}

/* home page */

.picfade {
	display: block;
}

.picfade:hover {
	opacity: 0.4;
	filter: Alpha(opacity=40); /* IE8 and earlier */
}

.anchor {
	top:-48px;
	position:relative;
	z-index:11;
}

.toptxt {
	font-family: 'Amatic SC', Verdana, Geneva, sans-serif;
	font-size: 45px;
	margin-bottom: 36px;
}

.toptxt a {
	text-decoration: none;
	color: yellow;
	font-weight: 400;
	line-height: 54px;
}

.toptxt a:hover {
	text-decoration: none;
	color: red;
}

.promotxt {
	font-family: 'Amatic SC', Verdana, Geneva, sans-serif;
	font-size: 45px;
	color: #ffffff;
	margin-bottom: 36px;
	line-height: 42px;
}

.promotxt a {
	text-decoration: none;
	color: #3c88c8;
	font-weight: 400;
	
}

.promotxt a:hover {
	text-decoration: none;
	color: #0d314f;
}

.promotxt-red {
	font-family: 'Amatic SC', Verdana, Geneva, sans-serif;
	font-size: 45px;
	color: #ffffff;
	margin-bottom: 36px;
	line-height: 42px;
}

.promotxt-red a {
	text-decoration: none;
	color: #d71921;
	font-weight: 400;
	
}

.promotxt-red a:hover {
	text-decoration: none;
	color: #820000;
}

.index-bandname {
	font-family: 'Amatic SC', Verdana, Geneva, sans-serif;
	font-size: 60px;
	margin-bottom: 36px;
}

.index-bandname a {
	text-decoration: none;
	color: #ffffff;
	font-weight: 400;
	line-height: 54px;
}

.index-bandname a:hover {
	text-decoration: none;
	color: red;
}

/* artlogo */

#artlogoswap {
	background: url(https://artcinco.com/images/artcinco-avatar-both200px.jpg) no-repeat;
	height: 200px;
	width: 200px;
	margin-bottom: 24px;
	margin-right: auto;
	margin-left: auto;
	display: block;
	background-position: 0px;
}

#artlogoswap:hover {
	background-position: -200px;
}

#artlogoswap-home {
	background: url(https://artcinco.com/images/artcinco-avatar-both200px.jpg) no-repeat;
	height: 200px;
	width: 200px;
	margin-bottom: 24px;
	margin-right: auto;
	margin-left: auto;
	display: block;
	background-position: -200px;
}

#artlogoswap-home:hover {
	background-position: 0px;
}

.artlogo {
	font-family: 'Amatic SC', Verdana, Geneva, sans-serif;
	font-size: 60px;

}

.artlogo a {
	text-decoration: none;
	color: #CCC;
	font-weight:400;
}

.artlogo a:hover {
	text-decoration: none;
	color: #777;
}

/* social */

.social {
	font-size: 16px;
	color: #CCC; /* #ffffff */
	line-height: 18px;
	margin-bottom: 9px;
	margin-top: 12px;
	font-family: 'Exo 2', Verdana, Geneva, sans-serif;
	font-weight: 500;
}

.social a {
	text-decoration: none;
	color: #CCC; /* #888 */
	font-weight: 800;
}

.social a:hover {
	text-decoration: none;
	color: red;
}

/* stuff */


.stuff-links a {
	color: #777;
	text-align: center;
}
.stuff-links a:hover {
	color: #3c88c8; /* #0d314f */
}

/* song titles links video skip  */

.videoLinks {
  font-family: 'Amatic SC', Verdana, Geneva, sans-serif;
	font-size: 36px;
		color: #fff;
		line-height: 40px;
  text-decoration: none;
  margin: 0 6px;
}
.videoLinks ul {
  list-style: none;
  padding: 0;
  margin: 12px 0 0 0;
  display: inline-flex;   /* horizontally lay out titles */
  flex-wrap: wrap;      /* allow wrapping instead of jumbling */
  align-items: center;	
  justify-content: center; /* optional: center align */
}
.videoLinks li {
  display: inline-block;
  text-decoration: none;
  margin: 0;
  padding: 6px 0px; /* keep only vertical padding */
  cursor: pointer;
}
.videoLinks li:not(:last-child)::after {
  content: "  •  "; /* two spaces before and after bullet */
  color: #fff;
  white-space: pre;
}
.videoLinks li:hover {
  color: #777777;
}
.videoLinks li.active {
  color: #f42c0b;
}

/* photo thumbs page stuff */

.photo-grid-item {
	max-width: 500px;
	overflow: hidden;
	margin: 6px;
	display: inline-flex;
	vertical-align: middle;
}

.photo-grid-item img {
	width: 100%;
	object-fit: contain;
}

/* black text */

.blacktxt {
	font-size: 16px;
	color: #000000; /* #ffffff */
	line-height: 18px;
	margin-bottom: 9px;
	margin-top: 12px;
	font-family: 'Exo 2', Verdana, Geneva, sans-serif;
	font-weight: 500;
}

.blacktxt a {
	text-decoration: none;
	color: #000000; /* #888 */
	font-weight: 800;
}

.blacktxt a:hover {
	text-decoration: none;
	color: #777;
}

/* art logo black */

.artlogo-black {
	color: #000000;
	font-family: 'Amatic SC', Verdana, Geneva, sans-serif;
	font-size: 60px;

}

.artlogo-black a {
	text-decoration: none;
	color: #000000;
	font-weight:400;
}

.artlogo-black a:hover {
	text-decoration: none;
	color: #777;
}