Web
Analytics
Join the HITS Discord and leave your suggestions for this wiki, talk about your edits, or just chat with fellow Tally Hall fans!

MediaWiki:Common.css

From Tally Hallmanac: The Ultimate Tally Hall Wiki
Jump to navigation Jump to search
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/* CSS placed here will be applied to all skins */
@import url('https://fonts.googleapis.com/css2?family=Carter+One&family=EB+Garamond:ital,wght@0,400;0,800;1,400;1,800&family=Eczar:wght@400;600;700&family=Lato:ital,wght@0,300;0,700;0,900;1,300;1,700;1,900&family=Londrina+Solid:wght@300;900&family=Luckiest+Guy&family=Oswald:wght@300;500;700&family=Roboto+Condensed:ital,wght@0,300;0,400;0,700;1,700&family=Roboto+Serif:wdth,[email protected],400;100,100;100,500;100,900&family=Roboto:wght@100;500;900&display=swap');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css');
@font-face {
    font-family: 'ddaftt-uppercaddafttuppercase';
    src: url('https://wiki.hiddeninthesand.com/fonts/ddaftt-u-webfont.woff2') format('woff2'),
         url('https://wiki.hiddeninthesand.com/fonts/ddaftt-u-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.mw-wiki-logo {
	background-image: url(https://wiki.hiddeninthesand.com/images/hitsWiki_logo_2_bigger.png);
}

body {
	height: auto;
	background-color: #DDE8F0;
}

.client-dark-mode {background: #daeaf4;}

#bodyContent a.image,
#bodyContent table a:first-child {border: none !important;} /* TAKING OFF LINE THROUGH TRANSPARENT IMAGE-LINKS */

.alert {
    padding: 10px;
    background-color: #fef6e7;
    border: 1px solid #ffcc32;
    border-radius: 4px;
    border-left: 5px solid #ffcc32;
    margin: 10px 10px 30px 10px !important;
    display: block;
    text-align: center;
    color: #696767;
    font-style: italic;
    }
.alert-callout {
    padding: 10px;
    background-color: #e6e6e6;
    border: 1px solid #b2b2b2;
    border-radius: 4px;
    border-left: 5px solid #b2b2b2;
    margin: 10px 10px 30px 10px !important;
    display: block;
    color: #696767;
    width: 95%;
    }
p.alert-callout i {
    float: left;
    margin: 10px;
    }
    
.alert-major {
	padding: 10px;
    background-color: #e74844;
    border: 1px solid #890000;
    border-radius: 4px;
    border-left: 5px solid #890201;
    margin: 10px 10px 30px 10px !important;
    display: block;
    text-align: center;
    color: #fff;
    font-style: italic;
    font-weight: bold;
    }

sup.citeNeeded {
    color: #1c1d87;
    }
sup.citeNeeded .citeNeededText {
    color: #1c1d87;
    font-style: italic;
}

/* ----------------- COLLAPSABLE ELEMENTS ----------------- */

.mw-collapsible.mw-collapsed {
 	width:50%; 
 	overflow:auto;
 	margin: 5px 0px;
    }

.mw-collapsible.mw-made-collapsible {
	margin-top: 20px;
    overflow:auto;
    } 
 
.setlistExpand {
	width:50%;
    }

.mw-customtoggle-tourDateHelp {
    font-size: x-large;
    color: #0645ad;
    padding: 8px;
    margin: 0px;
    border: 1px solid #ccc;
    border-bottom: none;
    background-color: #fef6e7;
    width: 98%;
    text-align: center;
    display: block;
    text-decoration: underline;
    }
    
div#mw-customcollapsible-tourDateHelp {
    width: 95%;
    margin-top:-15px;
    padding: 30px;
    background-color: #FEF6E7;
    border: 1px solid #ccc;
    border-top:none;
    }

.mw-collapsible li {
    line-height: 1.5em;
}
 

/* ---------------- TOURDATE ARCHIVE TABLE -------------- */
.showsTable th {
    text-align: left;
    background: #fff;
    position: sticky;
    top: 0px;
}
.showsTable tr:nth-child(odd) {
    background: #eee;
}
.showsTable td {
    border-right: 1px solid #ddd;
    padding: 5px;
}

.showsTable td:nth-child(5),
.showsTable td:nth-child(6),
.showsTable td:nth-child(7),
.showsTable td:nth-child(8) 
	{
    text-align: center;
	}
/* ----------------- INFOBOXES GLOBAL ----------------- */

.infobox-HITS {
	width: 300px;
	border: 1px solid #999999;
	float: right; 
	clear: right;
	margin: 10px 0px 30px 30px;
	padding: 0px 0px 0px 0px;
	text-align: left;
	line-height: 1.8em !important;
	font-size: 11px;
	-moz-border-radius-bottomleft: 7px;
	-moz-border-radius-bottomright: 7px;
	-moz-border-radius-topleft: 7px;
	-moz-border-radius-topright: 7px;
	-webkit-border-radius: 7px;
	border-radius: 7px;
	font-family: "Trebuchet MS", Futura, Verdana, Arial, Helvetica, sans-serif;
	color:#000000;
	}

table.infobox-HITS th {
	padding: 5px 2px 5px 2px;
	}

.infobox-HITS p {
    line-height: 1.8em !important;
	}

#heading_biggest {
	text-align:center;
	font-size:20px;
	color: #000000;
	font-weight: bold;
	display:block;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 3px 0px;
	line-height:normal !important;
	}

#heading_bigger {
	text-align:center;
	font-size:14px;
	font-weight: bold;
	display:block;
	margin: 5px 0px 0px 0px;
	padding: 2px 0px 2px 0px;
	line-height:normal !important;
	background-color:#0005;
	color: #fff;
	text-shadow: 1px 1px 3px #000;
	}

.infobox-HITS #heading_bigger a {
   color: #fff;
   text-shadow: 1px 1px 3px #000;
   }

/* ----------------- INFOBOX SONG ----------------- */

table#infobox_song {
	background-color: #fff7bf;
	}

#infobox_song #heading_biggest {
	}

#infobox_song #heading_bigger {
    }



/* ----------------- INFOBOX ALBUM ----------------- */

#infobox_album {
	background-color: #accbf0;
	}

#infobox_album #heading_biggest {
	}

#infobox_album #heading_bigger {
    }


/* ----------------- INFOBOX ARTIST ----------------- */

#infobox_artist {
	background-color: #acf0b7;
	}

#infobox_artist #heading_biggest {
	}

#infobox_artist #heading_bigger {
    }



/* ----------------- INFOBOX PERSON ----------------- */

#infobox_person {
	background-color: #f0acac;
	}

#infobox_person #heading_biggest {
	}

#infobox_person #heading_bigger {
    }

/* ----------------- INFOBOX MISC ----------------- */

#infobox_misc {
	background-color: #e0e0e0;
	}

#infobox_misc #heading_biggest {
	}

#infobox_misc #heading_bigger {
 
    }


/* ----------------- TRACKLIST GLOBAL ----------------- */
table.tracklist {
/*clear: both; */
font-size: inherit;
border: 1px solid #878787;
width: inherit;
background-color: #ececec;
}

table.tracklist th {
padding: 4px 9px;
margin: 0px;
border-bottom: 1px solid #666666;
}

table.tracklist td {}


/* ----------------- TRACKLIST ALBUMS ----------------- */

table#album {}

#album th {
background-color: #878787;
color: #ffffff;
}

#album tr {}

#album td {
background-color: #ececec;
padding: 4px 9px;
border-bottom: 1px solid #c6c6c6;
}


/* ------ FRONT PAGE ----------- */


.page-Tally_Hallmanac #mw-content-text {
    background-image: url(/wiki/images/hitsWiki_logo_faded.png);
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.frontpageTopSection {

     padding: 0;
     margin: 0;
     overflow:hidden;
}


.two-columns {
    display: block;
    overflow: hidden;
    width: 45%;
    float:left;
}

 
 
.two-columns#col-1 {
    margin: 0px 30px 0px 0px;
    
}

.two-columns#col-2 {
    padding: 0px 10px 20px 10px;
    margin: 0px 0px 0px 0px;

}

.two-columns li {
     margin-bottom: 15px;
}

.two-columns.highlight {
    background-color: #dbe8f1;
    border: 2px dashed #9ad8fd;
}


.frontpageTopSection #col-1.two-columns .floatleft a img {
    display: none;
}

@media only screen and (max-width: 750px) 
   {

.two-columns#col-1 {
	width: 90%;
	  }
	
.two-columns#col-2 {
	width: 90%;
	 }
   }
 
.randomPage {
    background-color: #e4e2d1;
    border: 1px solid #bdbbab;
    text-align: center;
    padding: 0px 0px 15px 0px;
    margin: 0px;
	}
	
.randomPageHeading {
    background-color: #bdbbab;
    display: block;
    padding: 2px 0px;
    font-weight: bold;
	}


/* ------ END FRONT PAGE ----------- */


/* ----------------- FLEXBOXES GENERAL ----------------- */

.flexRowContainer {
	display: flex; 
	flex-basis: auto;
	flex-flow: row wrap;
	justify-content: center;
	}

.flexRowContainer .flexItem {
	flex: 0;
	text-align:center;
	padding:10px; 
	margin: 2px;
}


/* ----------------- END - FLEXBOXES GENERAL ----------------- */

/* ----------------- TALLY HALL PAGE ----------------- */

.page-Tally_Hall .flexRowContainer {
	display: flex; 
	flex-basis: auto;
	flex-flow: row wrap;
	justify-content: center;
	}

.page-Tally_Hall .flexRowContainer .flexItem {
	flex: 0;
	text-align:center;
	padding:10px; 
	margin: 2px;
}

.page-Tally_Hall .flexRowContainer .flexItem .tleft {
    margin: 0.5em 0.1em 1.3em 0;
	}

.page-Tally_Hall .flexRowContainer .flexItem .tleft .thumbinner,
.page-Tally_Hall .flexRowContainer .flexItem .tleft .thumbinner .thumbimage {
	width: 150px !important;
	height: auto;
	}


/* ----------------- END - TALLY HALL PAGE ----------------- */

#mw-content-text {
    background-image: url(/wiki/images/wiki_bg_fader2.png);
    background-repeat: repeat-x;
    padding-left: 20px;
    margin: -18px 0px 0px -18px;
background-attachment: fixed;
}


#mw-panel {
top:0px;
}

#p-logo {
    top: 0;
    margin-bottom: 40px;
    margin-top: 10px;
}


#p-logo a {
	display: block;
	width: 10em;
	height: 180px; 
	background-repeat: no-repeat;
	background-position: center center;
	text-decoration: none;
    background-size: 160px 180px;
}

#mw-panel .portal h3 {
  font-weight: bold;
    color: #fff;
    font-size: .90em;
    background-color: #4b5a6d;
    padding: 5px;
    background: -moz-linear-gradient(left, rgba(50,57,66,1) 0%, rgba(50,57,66,0) 100%);
    background: -webkit-linear-gradient(left, #4b5a6c 0%,#32394200 100%);
    background: linear-gradient(to right, #4b5a6c 0%,#32394200 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#323942', endColorstr='#00323942',GradientType=1 );
    margin-left: 0px;
    margin-bottom: 0px;
    text-shadow: 2px 2px 2px #4b5a6c;
    border-radius: 5px;
}


#mw-page-base {
    height: 5em;
    background-position: bottom left;
    background-repeat: repeat-x;
    background-image: url(/wiki/skins/Vector/images/page-fade.png?ffe96);
    background-color: #fff;
background: -moz-linear-gradient(top, #ffffff 0%, #dfe8ef 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ffffff 0%,#dfe8ef 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ffffff 0%,#dfe8ef 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dfe8ef',GradientType=0 ); /* IE6-9 */
}

@media screen and (min-width: 982px) {
   #mw-panel {
       padding-left: 1em;
}
}


#p-personal {
    top: 0px !important;
}

#right-navigation {
    margin-top: 40px !important;
}

#mw-panel div.portal {
    margin: 0 0px 0 0em;
}

div.notice1,
p.notice1 {
width: 400px;
color:#666666;
background-color:#FFFFFF;
margin: 5px 5px 5px 80px;
padding: 5px 10px 5px 10px;
font-family:"Trebuchet MS", Verdana, Arial, Helvetica;
font-size:15px;
border-top: 1px solid #333333;
border-bottom: 1px solid #333333;
border-right: 1px solid #333333;
border-left: 5px solid #FF9933;
}

div.notice2,
p.notice2 {
    width: 50%;
    color: #705000;
    border-color: #fde29b;
    background-color: #fdf1d1;
    border: 1px solid;
    padding: 0.5em 1em;
    margin-bottom: 1em !important;
    display: block;
    clear: both;
}



/*
h3 ~ pre {
    font-family: monospace;
    font-size: 1.2em;
    word-wrap: normal;
    background-color: #0000;
    border: none;
}
*/

#firstHeading.firstHeading {
    /* font-family: 'Luckiest Guy','Trebuchet MS',Verdana,Arial,Helvetica; */
    /* font-weight: normal; */
    /* font-size: 30px; */
    /* letter-spacing: .04em; */
    text-shadow: #ccc 2px 2px 5px;
    font-family: 'ddaftt-uppercaddafttuppercase','Roboto Condensed','Trebuchet MS',Verdana,Arial,Helvetica;
    font-weight: 900;
    font-size: 35px;
    /* letter-spacing: -.04em; */
    /* text-shadow: #b0ad7a 2px 2px 5px; */
    /* color: #4c5b6b; */
    /* font-style: italic; */
}

.mw-body-content h2 {
    font-family: 'Roboto Condensed';
    font-size: 2em;
    color: #4c5a6c;
    font-weight: 500;
    /* font-style: italic; */
    background: #020024;
    background: linear-gradient(90deg, #2b3e5a14 0%, #3c4e7000 100%);
    padding-left: 5px;
}

.toc h2 {
    background: none;
}

.mw-body {
margin-top:20px;}

#mw-head {
    margin-top: 21px;
}


#bodyContent p {
line-height: 1.4em;
margin: 1em 0em 1em 0em;
}

#bodyContent a {
border-bottom: 1px dotted #AAA;
}
#bodyContent a:hover {
border-bottom: 1px solid #999;
text-decoration:none;
}



#mw-head.noprint {
height:1px !important;
}

.addthis_toolbox {
    clear: both !important;
    float: none !important;
    font-size: 1.4em;
}
#addthistoolbar {
    background: #ffffff70 !important;
    margin-left: 0px !important;
}


.paypal_button_page {
    margin: 30px 10px 10px 10px;
    padding: 10px;
    text-align: center;
    background-color: #445971;
    color: #fff;
    border: 1px solid #000;
    width: 100%;
    font-size: 16px;
    font-weight: bold;
    word-wrap: break-word;
}

.paypal_button_sidebar {
    padding: 10px 0px;
    text-align: center;
    color: #000;
    width: 100%;
    font-size: 12px;
    font-weight: bold;
}

#mw-panel #p-googleadsense-portletlabel .body {
    background: none;
    border: none;
    box-shadow: none;
}

@media screen and (min-width: 976px) {
   .CategoryTreeTag {
       column-count: 3;
   }
}

@media screen and (max-width: 976px) {
   .CategoryTreeTag {
       column-count: 2;
   }
}

@media screen and (max-width: 620px) {
   .CategoryTreeTag {
       column-count: 1;
   }
}

/* ---------------------- LEFT NAV LINKS ------------------------ */
#mw-navigation #mw-panel #p-HITS_Global_Nav div:nth-child(2) {
        background-color: #dde8f0;
    border: none;
    box-shadow: none;
}
#mw-navigation #mw-panel #p-HITS_Global_Nav h3:nth-child(1) {}


.vector-menu-portal {
     margin: 0 0em 0 0.7em;
    }
    
#mw-panel.noprint .body,
#mw-panel .vector-menu-content {
    background-color: #e5e2d1;
    padding-left: 5px;
    border-top: 1px solid #999;
    border-left: 1px solid #999;
    border-bottom: 1px solid #999;
    -moz-border-radius-bottomleft: 7px;
    -moz-border-radius-bottomright: 0px;
    -moz-border-radius-topleft: 7px;
    -moz-border-radius-topright: 0px;
    -webkit-border-radius: 7px 0px 0px 7px;
    border-radius: 0px 0px 0px 7px;
    -moz-box-shadow: -1px 3px 5px #7f7f7f;
    -webkit-box-shadow: -1px 3px 5px #7f7f7f;
    box-shadow: -1px 3px 5px #7f7f7f
}

#mw-panel.noprint h5,
#mw-panel div.vector-menu-content h5 {
    font-weight: bold;
    font-size: 14px
}

#mw-panel {
    top: 0px
}

#p-logo {
    top: -170px
}

#p-personal {
    top: 30px
}

#left-navigation {
    top: 65px
}

#right-navigation {
    margin-top: 65px
}

/* --------------- old ------------------- */ 


#p-Wiki_Navigation {
    display: none;
}

#p-HITS_Global_Nav .body {
background-color: inherit;
}

#mw-panel .portal .body ul li a {
    font-weight: normal
}

#nav {
    position: inherit;
    width: 100%;
    height: 22px;
    padding: 0px 0px 0px 0px;
    background-color: #868573;
    background-image: url(/images/design_files/HITS2_menuBG2.gif);
    background-repeat: repeat-x;
    border-top: 1px solid #797865;
    border-bottom: 2px solid #797865;
    text-align: left;
    font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif
}

#nav #menuicon {
    margin: 0px 2px 0px 2px
}

#hitsnav {
    width: 100%;
    height: 22px;
    padding: 0px 0px 0px 0px;
    background-color: #868573;
    background-image: url(https://www.hiddeninthesand.com/images/design_files/HITS2_menuBG2.gif);
    background-repeat: repeat;
    border-top: 1px solid #797865;
    border-bottom: 1px solid #797865;
    text-align: left;
    font-family: Trebuchet, Verdana, Helvetica, Arial, Geneva, "Lucida Sans";
    font-size: 14px;
    color: #333333
}

#hitsnav #menuicon {
    margin: 0px 2px 0px 2px
}


/* --------------------- MOBILE STYLES ---------*/

.skin-minerva div.post-content.footer-content:before {
    display: inline-block;
    width: 50px;
    height: 53px;
    margin-right: 15px;
    content: " ";
    background: url(/wiki/images/hitsWiki_logo-2014.png) no-repeat 0 0;
    background-size: 100%;
    float: left;
}


@media only screen and (max-width: 400px) {
 
#mw-page-base {
    height: 0em;
  }
}

@media only screen and (max-width: 500px) {

#mobilelogo {
    margin-top: 100px;
}

.frontpageTopSection #col-1.two-columns .floatleft a img {
    display: block;
}
}

/* ConfirmEdit QuestyCaptcha --*/
.mw-htmlform-field-HTMLInfoField.mw-ui-vform-field {
    background: #c3dbc3;
    padding: 5px;
}

.mw-htmlform-field-HTMLInfoField.mw-ui-vform-field .mw-input {
    font-weight: bold;
}


/* --------------------- PRETTY BUTTONS ---------*/

#prettybutton {
	background-color: #3366cc;
	color: #ffffff;
}
#prettybutton:focus {
	background-color: #22456d;
	color: #ffffff;
}
#prettybutton:visited {
	background-color: #22456d;
	color: #ffffff;
}
.prettybutton-clicked {
	background-color: #22456d;
	color: #ffffff;
}
#prettybutton-clicked {
	background-color: #22456d;
	color: #ffffff;
}

.fontawesomeicon {
	font-size: 2em;
}