/*

/*============
/*EXTRA CSS*/

/*fonts*/
@font-face {
    font-family: 'ladylike_bbregular';
    src: url('../fonts/ladylike/ladylikebb-webfont.woff2') format('woff2'),
         url('../fonts/ladylike/ladylikebb-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'LeavingglassvegasRegular';
    src: url('../fonts/vegas/leavingg-webfont.eot');
    src: url('../fonts/vegas/leavingg-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/vegas/leavingg-webfont.woff') format('woff'),
         url('../fonts/vegas/leavingg-webfont.ttf') format('truetype'),
         url('../fonts/vegas/leavingg-webfont.svg#LeavingglassvegasRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'alphabetized_cassette_tapesRg';
    src: url('../fonts/cassette/alphabetized_cassette_tapes-webfont.woff2') format('woff2'),
         url('../fonts/cassette/alphabetized_cassette_tapes-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
.search-btn {
color: #000;
font-size: 20px;

}

.news-item{
background-color:#fff;  
border:solid 2px #000; 
padding:2.5px;
margin-bottom: 5px; 
box-shadow: #000 1px 1.3px; 
}
.odd { 

background-color:#fff;  
border:solid 1px #000; 
padding:2.5px;
margin-bottom: 5px; 
box-shadow: #000 1px 1.3px; 
border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
}
.odd a:link {color:#990000; font-size:90%; } /* unvisited link */
.odd a:visited {color:#990000; text-decoration:none; }  /* visited link */
.odd a:hover {color:#f1c40f; text-decoration:none; }  /* mouse over link */
.odd a:active {color:#000; text-decoration:none; }  /* selected link */ 

.odd h2 {font-size: 20px;}
.odd span {  float:right; font-family: 'WebLettererBBRegular';  font-size: 10px; padding: 1.5px; color:#990000; border:solid 1px #000; background-color: #fff; box-shadow: #000 1px 1.3px; }
.odd span  a:link {color:#000;  }
.odd span  a:hover {color:#000;}


.even { 

background-color:#faf5f6;  
border:solid 1px #000; padding:2.5px;
margin-bottom: 5px; 
box-shadow: #000 1px 1.3px; 
/*border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;*/
}
.even a:link {color:#9D152C; font-size:90%; } /* unvisited link */
.even a:visited {color:#9D152C; text-decoration:none; }  /* visited link */
.even a:hover {color:#f1c40f; text-decoration:none; }  /* mouse over link */
.even a:active {color:#9D152C; text-decoration:none; }  /* selected link */ 

.even h2 {font-size: 20px  }
.even span {  float:right; font-family: 'WebLettererBBRegular';  font-size: 10px; padding: 1.5px; color:#990000; border:solid 1px #000; background-color: #fff; box-shadow: #000 1px 1.3px; }





.wrapper {
  width: 100%;
  padding: 0 2rem;
  text-align: center;
}
.polaroid {
  background: #fff;
  padding: 1rem;
  box-shadow: 0 0.2rem 1.2rem rgba(0,0,0,0.2);
  
}
.polaroid > img{
  max-width: 100%;
  height: auto;
}
.caption {
  font-family: 'Rock Salt', cursive;
  font-size: 1.8rem;
  text-align: center;
  line-height: 2em;
}
.item {
  width: 100%;
  display: inline-block;
/*  margin-top: 2rem;*/
/*  filter: grayscale(100%);*/
}
.item .polaroid:before {
  content: '';
  position: absolute;
  z-index: -1;
  transition: all 0.35s;
}
.item:nth-of-type(4n+1) {
  transform: scale(0.8, 0.8) rotate(5deg);
  transition: all 0.35s;
}
.item:nth-of-type(4n+1) .polaroid:before {
  transform: rotate(6deg);
  height: 20%;
  width: 47%;
  bottom: 30px;
  right: 12px;
  box-shadow: 0 2.1rem 2rem rgba(0,0,0,0.4);
}
.item:nth-of-type(4n+2) {
  transform: scale(0.8, 0.8) rotate(-5deg);
  transition: all 0.35s;
}
.item:nth-of-type(4n+2) .polaroid:before {
  transform: rotate(-6deg);
  height: 20%;
  width: 47%;
  bottom: 30px;
  left: 12px;
  box-shadow: 0 2.1rem 2rem rgba(0,0,0,0.4);
}
.item:nth-of-type(4n+4) {
  transform: scale(0.8, 0.8) rotate(3deg);
  transition: all 0.35s;
}
.item:nth-of-type(4n+4) .polaroid:before {
  transform: rotate(4deg);
  height: 20%;
  width: 47%;
  bottom: 30px;
  right: 12px;
  box-shadow: 0 2.1rem 2rem rgba(0,0,0,0.3);
}
.item:nth-of-type(4n+3) {
  transform: scale(0.8, 0.8) rotate(-3deg);
  transition: all 0.35s;
}
.item:nth-of-type(4n+3) .polaroid:before {
  transform: rotate(-4deg);
  height: 20%;
  width: 47%;
  bottom: 30px;
  left: 12px;
  box-shadow: 0 2.1rem 2rem rgba(0,0,0,0.3);
}
.item:hover {
  filter: none;
  transform: scale(1, 1) rotate(0deg) !important;
  transition: all 0.35s;
}
.item:hover .polaroid:before {
  content: '';
  position: absolute;
  z-index: -1;
  transform: rotate(0deg);
  height: 90%;
  width: 90%;
  bottom: 0%;
  right: 5%;
  box-shadow: 0 1rem 3rem rgba(0,0,0,0.2);
  transition: all 0.35s;
}




/* GRID CODE */
.grid-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-areas: ". . Section-1 Section-1 . Section-2 Section-2 . Section-3 Section-3 . ." ". . . . . . . . . . . ." ". Section-4 Section-4 . Center-Image Center-Image Center-Image Center-Image . Section-5 Section-5 ." ". . . . Center-Image Center-Image Center-Image Center-Image . . . ." ". Section-6 Section-6 . Center-Image Center-Image Center-Image Center-Image . Section-7 Section-7 ." ". . . . Center-Image Center-Image Center-Image Center-Image . . . ." ". Section-8 Section-8 . Center-Image Center-Image Center-Image Center-Image . Section-9 Section-9 ." ". . . . . . . . . . . ." ". . Section-10 Section-10 . Section-11 Section-11 . Section-12 Section-12 . .";
}

.Section-1 { grid-area: Section-1; }

.Section-2 { grid-area: Section-2; }

.Section-3 { grid-area: Section-3; }

.Section-4 { grid-area: Section-4; }

.Section-5 { grid-area: Section-5; }

.Section-6 { grid-area: Section-6; }

.Section-7 { grid-area: Section-7; }

.Section-8 { grid-area: Section-8; }

.Section-9 { grid-area: Section-9; }

.Section-10 { grid-area: Section-10; }

.Section-11 { grid-area: Section-11; }

.Section-12 { grid-area: Section-12; }

.Center-Image { grid-area: Center-Image; }

/* Mouseover Fade */
div.fadehover { position: relative; }
img.a { position: absolute; left: 0; top: 0; z-index: 10;}
img.b { position: absolute; left: 0; top: 0;}
/* END Mouseover Fade */

.another-planet {
  border:1px solid 000;
  box-shadow: 1px 2px 3px #000;
}

.josie-slider-title{
  font-size: 55px; color: #fff; line-height: 55px; 
  font-family: 'Rock Salt', cursive, sans-serif; font-weight: 800;   
  text-shadow:
   -1px -1px 0 #000,  
    1px -1px 0 #000,
    -1px 1px 0 #000,
     1px 1px 0 #000;
     text-shadow: 4px 2px #000;
    /* text-shadow: #fff 4px 1px 13px;*/
}

#gigs-header {
  font-family: 'LeavingglassvegasRegular';
  font-size: 50px;
}
#gigs-header2 {
 font-family: 'alphabetized_cassette_tapesRg';
  font-size: 30px;
}
.josie-inner-section{
  border: solid #000 2px;
  background-color: rgba(172, 172, 173, 0.5);
  color:#000;
  width:100%;
  margin:5% auto;
  border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
  padding:1em;
  line-height:1.5em;
border:solid 2px #000;
} 

.vid {
  background-color: #0A090F;
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
    box-shadow: 1px 2px 3px 4px;
}
 
.vid iframe,
.vid object,
.vid embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* IMAGE ALIGN CODE */
img.alignright {float:right; margin:40px; }
img.alignleft {float:left; margin:40px; }
img.aligncenter {display: block; margin-left: auto; margin-right: auto;}
a img.alignright {float:right; margin:0 0 1em 1em;}
a img.alignleft {float:left; margin:0 1em 1em 0;}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto;}


/* Alignment */
.alignleft {
  display: inline;
  float: left;
  margin-right: 1.5em;
}
.alignright {
  display: inline;
  float: right;
  margin-left: 1.5em;
}
.aligncenter {
  clear: both;
  display: block;
  margin: 0 auto;
}
.featured-image-caption
{
  background-color: #fff;
  font-size: 12px;
  margin: 20px;/*
  border: 1px solid #0A090F;*/
  padding: 5px;
}
.image-styling{
  border:1px solid 000;
  box-shadow: 1px 2px 3px #000;
}


.pagination {
clear:both;
padding:5px 0;
position:relative;
font-size:26px;
line-height:13px;

}
 
.pagination span, .pagination a {
display:block;
float:left;
margin: 2px 2px 2px 0;
padding:6px 9px 5px 9px;
text-decoration:none;
width:auto;
color:#000;
background: #f1c40f;
border:solid #990000 1px;
}
 
.pagination a:hover{
color:#000;
background: #ccc;
}
 
.pagination .current{
padding:6px 9px 5px 9px;
background: #990000;
color:#fff;
}
/*POLAROIDS*/

figure, figcaption {
display: block;
}
#polaroid{
width:100%;
/*overflow:hidden;*/
/*padding:20px 10px;*/
}
#polaroid figure{
float:left;
position:relative;
width:320px;
margin:10px 20px;
padding: 6px 8px 10px 8px;
color:#000000;
/*-webkit-box-shadow: 4px 4px 8px -4px rgba(0, 0, 0, .75);
-moz-box-shadow: 4px 4px 8px -4px rgba(0, 0, 0, .75);
box-shadow: 4px 4px 8px -4px rgba(0, 0, 0, .75);*/
background: #eee6d8;
background: -webkit-linear-gradient(top, #ede1c9, #fef8e2 20%, #f2ebde 60%);
background: -moz-linear-gradient(top, #ede1c9, #fef8e2 20%, #f2ebde 60%);
background: -o-linear-gradient(top, #ede1c9, #fef8e2 20%, #f2ebde 60%);
background: -ms-linear-gradient(top, #ede1c9, #fef8e2 20%, #f2ebde 60%);
background: linear-gradient(top, #ede1c9, #fef8e2 20%, #f2ebde 60%);
-webkit-transform:rotate(-1deg);
-moz-transform: rotate(-1deg);
-o-transform: rotate(-1deg);
-ms-transform: rotate(-1deg);
transform: rotate(-1deg);
-webkit-backface-visibility:hidden; /*prevent rotated text being jagged in Chrome and Safari*/
}
#polaroid figure:nth-child(even) {
-webkit-transform:rotate(2deg);
-moz-transform: rotate(2deg);
-o-transform: rotate(2deg);
-ms-transform: rotate(2deg);
transform: rotate(2deg);
-webkit-backface-visibility:hidden; /*prevent rotated text being jagged in Chrome and Safari*/
-webkit-box-shadow: 4px 4px 8px -4px rgba(0, 0, 0, .75);
-moz-box-shadow: 4px 4px 8px -4px rgba(0, 0, 0, .75);
box-shadow: -4px 4px 8px -4px rgba(0, 0, 0, .75);
-ms-transform: rotate(-12deg);

}
#polaroid figure:before {
content: '';
display: block;
position: absolute;
left:5px;
top: -15px;
width: 75px;
height: 45px;
background-color: rgba(222,220,198,0.7);
-webkit-transform: rotate(-12deg);
-moz-transform: rotate(-12deg);
-o-transform: rotate(-12deg);
-ms-transform: rotate(-12deg);

}
#polaroid figure:nth-child(even):before {
left:150px;
top: -15px;
width: 55px;
height: 25px;
-webkit-transform: rotate(12deg);
-moz-transform: rotate(12deg);
-o-transform: rotate(12deg);
-ms-transform: rotate(12deg);
}
#polaroid figcaption{
text-align:center;
    font-family: 'alphabetized_cassette_tapesRg';
font-size:2.3em;
color:#454f40;
/*letter-spacing:0.09em;*/
}
/**IE Hacks - see http://css3pie.com/ for more info on how to use CS3Pie and to download the latest version**/
#polaroid figure{
-pie-background: linear-gradient(#ede1c9, #fef8e2 20%, #f2ebde 60%);
behavior: url(assets/pie/PIE.htc);
position:relative; /*required to make PIE work*/
padding-top:10px\9;
padding-right:10px\9;
}
.polaroid {
/*border: solid #e0e0e0;
-webkit-border-image: url('../../img/polaroid.png') 5.9% 4.5% 20.8% 4% stretch;
-moz-border-image: url('../../img/polaroid.png') 5.9% 4.5% 20.8% 4% stretch;
border-image: url('../../img/polaroid.png') 5.9% 4.5% 20.8% 4% stretch; */
}

*{margin:0px;padding:0px;}


  
#ribbon {
    padding: .34em 1em;
    margin: 0;
    margin-top: 5%;
    position:relative;
    color: #ffffff;
    font: 32px 'Patua One', sans-serif;
    text-align: center;
    letter-spacing:0.1em;
    text-shadow: 0px -1px 0px rgba(0,0,0,0.3);
    box-shadow: inset 0px 1px 0px rgba(255,255,255,.3),
          inset 0px 0px 20px rgba(0,0,0,0.1),
          0px 1px 1px rgba(0,0,0,0.4);
     background: -webkit-linear-gradient(top,#8c1101, #bc230f);
      display: inline-block;
  }
  
#ribbon:before, #ribbon:after {
    content: "";
    width:.2em;
    bottom:-.5em;
    position:absolute;
    display:block;
    border: .9em solid #bc230f;
    box-shadow:0px 1px 0px rgba(0,0,0,0.4);
    z-index:-2;
  }
  
#ribbon:before {
    left:-1.35em;
    border-right-width: .75em;
    border-left-color:transparent;
  }
  
#ribbon:after {
    right:-1.35em;
    border-left-width: .75em;
    border-right-color:transparent;
  }
  
#content:before, #content:after {
    content:"";
    bottom:-.5em;
    position:absolute;
    display:block;
    border-style:solid;
    border-color: #891a0c transparent transparent transparent;
    z-index:-1;
  }
  
#content:before {
    left: 0;
    border-width: .5em 0 0 .5em;
  }
  
#content:after {
    right: 0;
    border-width: .5em .5em 0 0;
  }
/*p{
  display:inline-block;
  width:100%;
  margin:5% auto;
  border-radius: 255px 15px 225px 15px/15px 225px 15px 255px;
  padding:1em;
  line-height:1.5em;
background-color: rgba(172, 172, 173, 0.5);
border:solid 2px #000;
}*/