/*****************************************************************/
/***** WTTR - Desktop Styles / (c) 2025 shields web services *****/
/*****************************************************************/


/******** Global Styles ********/

html, body {
  width:100%;
  height:100% important!;
  margin:0;
  padding:0;
  background:#708090;
  font-size:16px;
  box-sizing:border-box;
  overflow-x:hidden
}

::-webkit-scrollbar-track {background:#FFF}
::-webkit-scrollbar-thumb {background:#666}
::-webkit-scrollbar-thumb:hover {background:#000}
::-webkit-scrollbar {width:7px}

a {color:#FFF; text-decoration:none}
a:hover {color:#7DF9FF}
a.gigs {color:#F00; text-decoration:none}
a.selected {color:#F00}

.emoji {font-size:120%}

h2.formHeading {
  padding:0 35px;
  font-family:"Scope One", serif; 
  font-size:1.50em; 
  font-weight:bold; 
  text-align:center;
}
input[type=text], textarea {
  width:50%;
  padding:12px;
  border:1px solid #666;
  border-radius:5px;
  resize:vertical;
}

/******** Class Styles ********/

.address {
  font-family:"Scope One", serif; 
  font-size:1.35em;
  color:#FFF; 
  text-align:center;
  line-height:1.5;
}

.cancelled {
  font-family:"Scope One", serif; 
  font-size:1.00em;
  font-weight:bold;
  color:red;
}
.fBoxCredit {
  display:block;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}
.fbText {
  font-family:"Scope One", serif; 
  font-size:0.85em;
}
.gig {
  width:65%;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
  background:#FFF;
  padding:5px 0;
  box-shadow:3px 3px 4px #000;
}
.noGigs {
  width:65%;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
  background:#708090;
  color:#FFF;
  padding:5px 0;
}
.gigHeading {
  padding:0 35px;
  font-family:"Scope One", serif; 
  font-size:1.50em; 
  font-weight:bold; 
  text-align:center;
}
.gigInfo {
  font-family:"Scope One", serif; 
  font-size:1.25em; 
  text-align:center;
  line-height:1.2;
}
.noGigInfo {
  font-family:"Scope One", serif; 
  font-size:1.50em; 
  text-align:center;
  line-height:1.2;
}
.hr50 {
  width:50%;
  overflow:visible; /* For IE */
  padding:0;
  border:none;
  border-top:medium double #333;
  color:#333;
  text-align:center;
}
.hr50:after {
  content:")|(";
  display:inline-block;
  position:relative;
  top:-0.6em;
  font-size:1.25em;
  font-weight:bold;
  padding:0 0.25em;
}
.hrMusicPage {
  width:90%;
  color:#000;
  border:1px solid #000;
}
.leftPad {padding-left:200px}
.mapLink {color:#F00; font-size:0.90em; font-weight:bold}
.myPara_1 {
  padding:0 35px;
  font-family:"Scope One", serif; 
  font-size:1.50em; 
  font-weight:bold; 
  text-align:center;
}
.myPara_2 {
  padding:0 35px; 
  font-family:"Scope One", serif;
  font-size:1.50em; 
  font-weight:bold;
  text-align:center;
  color:#7DF9FF;   
  text-shadow:3px 3px 2px #000;
  line-height:1.5;
}
.myPara_3 {
  width:800px; 
  margin-left:auto; 
  margin-right:auto; 
  padding:0 35px;
  font-family:"Scope One", serif;
  color:#FFF; 
  font-size:1.20em; 
  text-align:justify; 
  line-height:1.3;
}
.photoPixPhotos {
  display:inline-block; 
  width:11.50em; 
  height:10.00em; 
  margin-top:0.50em; 
  margin-right:0.75em; 
  text-align:center;
}
.photoText {
  width:100%; 
  text-align:left; 
  color:#000; 
  font-family:"Constantina", "Georgia", "Times New Roman", serif; 
  font-size:0.80em; 
  line-height:110%;
}
.pixBorder {border:solid 2px black}
.songCredit {
	color:#000;
    font-family:"Scope One", serif; 
    font-size:0.75em; 
    text-align:center;
    line-height:1.8;
}
.spWidth {width:100%; max-width:450px; position:relative; left:0}
.sws {
  font-family:"Scope One", serif; 
  font-size:0.75em; 
  text-align:center;
  color:#7DF9FF;
  text-shadow:3px 3px 2px #000;
  line-height:1.8;
}
.tgoo {font-size:1.00em}
.vertAlign {vertical-align:middle}

/******** ID Styles ********/
 
#centerWrap {
  position:relative;
  width:900px;  
  margin-left:auto;
  margin-right:auto;
  padding-bottom:30px;
}
#footer {
  position:relative;
  bottom:0;
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:4%;
  width:100%;
  height:120px;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
  margin-bottom:25px;
  padding:25px 0;  
  background:rgba(255, 255, 255, 0);
}
#formCont {
    position:relative;
	top:25px;
	width:65%;
	text-align:center;
    margin-left:auto;
    margin-right:auto;
	margin-bottom:50px;
	padding:15px 0;
}
#indexIcons {
  display:flex;
  flex-direction:row;
  justify-content:center;
  gap:7%;
  width:80%;
  height:85px;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
} 
#logoCont {
  display:block;
  width:80%;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}
#pageHeading {
  position:relative;
  top:20px;
  width:60%;
  color:#FFF;
  font-family:"Scope One", serif;
  font-weight:bold;
  font-size:1.85em;
  text-align:center;
  margin-left:auto;
  margin-right:auto; 
  margin-bottom:35px;
  line-height:1.3;
}
#pixCont {display:inline-block; margin-left:10%}
#theMusic {
  display:flex;
  flex-direction:column;
  position:relative;
  width:90%;
  margin-left:auto;
  margin-right:auto;
  padding-bottom:45px;
} 
#oo {
  display:flex;
  flex-direction:column;
  position:relative;
  width:90%;
  margin-left:auto;
  margin-right:auto;
  padding-bottom:45px;
}
#wttr {
  display:flex;
  flex-direction:column;
  position:relative;
  width:90%;
  margin-left:auto;
  margin-right:auto;
  padding-bottom:45px;
}

/******** Band Member & Video Display Styles ********/

.pageElement {
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  width:80%;
  height:75px;
  margin:15px auto;
}
.iconSpace {
  display:flex;
  align-items:center;
  justify-content:center;
  width:75px;
  height:65px;
  padding-right:5%;  
}
.theInfo {
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:flex-start; 
  width:400px;
  height:65px;
  padding-left:5%;
}
.theInfoWide {
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:flex-start;
  width:600px;
}
.name {
  display:flex;
  align-items:center;
  justify-content:flex-start;
  width:100%;
  height:30px;
}
.role {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  width:100%;
  height:30px;
}
.bandMember {
  font-family:"Scope One", serif; 
  font-size:1.30em;
  font-weight:normal;
  color:#7DF9FF;
  text-shadow:3px 3px 2px #000;
  line-height:1.4;
}
.musicText {
  display:block;
  width:500px;
  font-family:"Scope One", serif; 
  font-size:1.25em;
  font-weight:normal;
  color:#7DF9FF;
  text-shadow:3px 3px 2px #000;
  line-height:1.35;
}

/******** Display Table Styles ********/

#displayContent {
     position:relative;
	 top:25px;
     display:table;
     width:60%;
     border-spacing:5px;
	 text-align:center;
	 margin:30px auto 70px auto;
}
.displayRow {
     display:table-row;
	 width:100%;
}
.displayCell_1 {
     display:table-cell;
	 width:35%;
	 height:100%;
	 vertcal-align:middle;
	 text-align:center;
}
.displayCell_YT {
     display:table-cell;
	 width:25%;
	 height:100%;
	 vertcal-align:middle;
	 text-align:center;
}
.displayCell_2 {
     display:table-cell;
	 width:65%;
	 height:100%;
	 vertcal-align:middle;
	 text-align:center;
	 margin-left:auto;
     margin-right:auto;
	 color:#FFF;
     font-family:"Scope One", serif;
     font-size:1.20em;
	 line-height:1.5;
}
.displayCell_Band {
     display:table-cell;
	 width:75%;
	 height:100%;
	 vertcal-align:middle;
	 text-align:center;
	 margin-left:auto;
     margin-right:auto;
	 color:#FFF;
     font-family:"Scope One", serif;
     font-size:1.20em;
	 line-height:1.5;
}

/********** Menu Styles **********/

.menuText {
  color:#FFF; 
  font-family:"Scope One", serif; 
  font-size:1.60em; 
  font-weight:700;
  padding-right:20px; 
  text-shadow:3px 3px 2px #000;
}
.triggerDisplay {color:#FFF; font-size:1.75em; padding-bottom:12px} 
#menuArea {
  position:relative;
  top:-1px;
  width:100%; 
  display:flex;
  flex-direction:row;
  justify-content:center;
  padding:25px 0;
  background:rgba(255, 255, 255, 0);
}
#menuArea ul li {
  display:inline;
  padding:0 1.15em;
}
#menuArea ul li:last-of-type {display:none}
#menuArea ul li.trigger {display:none}
div#nav-toggle {display:none}