CSS

Story
Characters
Gallery
Rules

 
/* GENERAL */
body, p, table, ul { font-family: 'PT Sans', sans-serif; font-size: 1vw; }

ul, ol { list-style-position: outside; margin-left: 2vw; }

p { margin-bottom: 0.6em; }

h2, h3 {
font-family: 'Walter Turncoat', cursive;
text-transform: lowercase;
border:1px solid #5E2020 !important;
background-color:#BF8282;
padding:5px;
margin-bottom:10px;
width: fit-content;
}

h4 {
border-bottom: 1px solid #CCC;
margin-bottom: 15px;
margin-top: 35px;
clear: both;
}
	h4 img { padding-right: 5px; width: 35px; }

::selection { background: #6B3D84; }

textarea::selection { color: #FFF; }

table { border-spacing: 1px; }

hr {
border: 0;
height: 1px;
background-image: -webkit-linear-gradient(left, rgba(51,51,51,0), rgba(51,51,51,0.75), rgba(51,51,51,0)); 
background-image:-moz-linear-gradient(left, rgba(51,51,51,0), rgba(51,51,51,0.75), rgba(51,51,51,0)); 
background-image: -ms-linear-gradient(left, rgba(51,51,51,0)), rgba(51,51,51,0.75), rgba(51,51,51,0)); 
background-image:-o-linear-gradient(left, rgba(51,51,51,0), rgba(51,51,51,0.75), rgba(51,51,51,0)); 
}

blockquote {
  background: #f9f9f9;
  border-left: 10px solid #ccc;
  margin: 1.5em 10px;
  padding: 0.5em 10px;
}
	blockquote:before {
	  color: #ccc;
	  content: open-quote;
	  font-size: 4em;
	  line-height: 0.1em;
	  margin-right: 0.25em;
	  vertical-align: -0.4em;
	}
	blockquote p {
	  display: inline;
	  color: #666;
	}

.align-center { text-align: center; }
.align-right { text-align: right; }

.va-top td { vertical-align: top; }

.bio h6, h6, .tagline, a.knack span { display: none; }

.banner {
width: 100%;
margin-bottom: 2vw;
}

.clear { clear: both; }

#campaign-footer { clear: both; }

/* Character: Panels */
.panel {
padding: 2vw;
width: 52vw;
background: #FFF;
border: 0px solid #000; 
margin:0 0 2vw 0;
float: left;
}
	.panel td {
	padding: 3px;
	}

/* Gallery: Story Div */
.story {
padding: 5vw;
width: 100%;
background: url(https://db4sgowjqfwig.cloudfront.net/assets/315824/natural_paper.png?1397106852);
}
	.story p {
	font: 1em/1.5 'PT Serif', serif;
	text-indent: 1.2em;
	margin: 5px 0px;
	}

/* Content Divs */
.full {
width: 100%;
padding: 3vw;
background: #FFF;
}

.alt {
background: #dde8dd!important;
}

/* FRONT PAGE */

/* Spinny Newspaper Effect */
.issue {
width: 150px;
height: 150px;
margin: auto;
background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/676238/curr_epilogue.png?1481996869) no-repeat;
font-size: 1.3em;
color: #FFF;
text-align: center;
padding: 15px;
display: block;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
overflow: hidden;
}
	.issue p {
	line-height: 1.0em;
	}
	.issue a {
	color: #FFF;
	}
	.issue:hover {
	width: 525px;
	height: 700px;
	-webkit-transform: rotate(360deg);
	 -moz-transform: rotate(360deg);
	 -o-transform: rotate(360deg);
	-ms-transform: rotate(360deg);
	transform: rotate(360deg);
	}
	.issue-title {
	font: 2.5em 'Bowlby One SC', sans-serif;
	letter-spacing: 1px;
	-webkit-text-stroke: 1px black;
	 color: #FFF !important;
	 text-shadow:
	 3px 3px 0 #000,
	 -1px -1px 0 #000,
	1px -1px 0 #000,
	-1px 1px 0 #000,
	 1px 1px 0 #000;
	}
	.blurb {
	width: 525px;
	background: transparent;
	border: 0px;
	border-spacing: 0px;
	height: 30px;
	overflow: hidden;
	vertical-align: middle;
	}
	.blurb td {
	padding: 2px;
	}

/* STORY PAGE */

.calendar {
width: 100%;
margin: auto;
border-spacing: 0px;
border-top: 1px solid #ccc !important;
border-left: 1px solid #ccc !important;
}
	.calendar th {
	text-align: center;
	font-weight: bold;
	background: #223311;
	color: #aabbaa;
	border-bottom: 1px solid #ccc;
	}
	.calendar td {
	background: #FFF !important;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	width: 119px;
	vertical-align: top;
	font-size: 0.9em;
	}
	.calendar tr.dates {
	background-color: #CCC;
	}
	.bday { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/386326/cal_bday.png?1414515622) left center no-repeat; padding: 5px 5px 5px 20px; }
	.cday { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/386327/cal_general.png?1414515623) left center no-repeat; padding: 5px 5px 5px 20px; }
	.lday { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/386328/cal_log.png?1414515624) left center no-repeat; padding: 5px 5px 5px 20px; }
	.sday { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/386329/cal_story.png?1414515626) left center no-repeat; padding: 5px 5px 5px 20px; }

/* GOD PAGES */
.deities {
float: left;
background: #725980;
width: 11vw;
height: 4vw;
padding: 1vw;
margin: 0.3vw;
text-align: center;
font-family: 'PT Sans Narrow', sans-serif;
font-size: 1.1em;
color: #FFF !important;
display: block;
transition: background-color 0.5s ease;
vertical-align: middle;
}
	.deities a {
	color: #FFF;
	}
	.deities:hover, .deities.current {
	background: #3D2649;
	}
	.deities.npc {
	background: #aabbaa;
	}
	.deities.npc:hover, .npc.current {
	background: #223311;
	}

/* CHARACTER GUIDE */
.char {
float: left;
background: transparent;
height: 11vw;
width: 9vw;
text-align: center;
font-family: 'Walter Turncoat';
text-transform: lowercase;
color: #FFF !important;
display: block;
}
	.char img {
	width: 90%;
	-webkit-transition: all 0.5s ease;
	 -moz-transition: all 0.5s ease;
	 -o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	transition: all 0.5s ease;
	}
	.char img:hover {
	width: 100%;
	}
	.char a {
	color: #FFF;
	}
	
td.fb {
font-size: 0.6em;
padding: 1px;
}

/* Graveyard */
.grave-con {
height: 8vw;
width: 8vw;
margin: 0.3vw;
float: left;
}

.grave {
background: #444;
color: #ccc;
height: 8vw;
width: 8vw;
margin: auto;
font-size: 0.7em;
text-align: center;
-webkit-transition: all 0.5s ease;
 -moz-transition: all 0.5s ease;
 -o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}
	.grave:hover {
	height: 8.5vw;
	width: 8.5vw;
	}
	.grave img {
	width: 8vw;
	filter: grayscale(100%);
	-webkit-filter: grayscale(100%);
	-webkit-transition: all 0.5s ease;
	 -moz-transition: all 0.5s ease;
	 -o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	transition: all 0.5s ease;
	display: block;
	position: absolute;
	}
	.grave img:hover {
	width: 8.5vw;
	opacity: 0.0;
	}

/* CREATIVITY CORNER */

.cc {
float: left;
width: 11vw;
height: 11vw;
background: #779977;
text-align: center;
color: #333;
-webkit-transition: all 0.5s ease;
 -moz-transition: all 0.5s ease;
 -o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}

/* Story Corner */
.sc {
margin: 0px 1vw 1vw 0px;
padding: 1vw;
width: 33vw;
height: 18vw;
background: #aaa;
border-left: 1vw solid #333;
display: block;
}
	.sc:hover {
	border-left: 1vw solid #556633;
	background: #779977;
	}
	.sc a {
	color: #FFF;
	}
	.sc-title {
	font: 1.2vw 'Walter Turncoat' !important;
	text-transform: lowercase;
	}

/* Art Corner */
.ac {
font-family: 'Walter Turncoat';
text-transform: lowercase;
margin: 0.3vw;
}
	.ac a, .ac p, .ac span {
	color: #333;
	}
	.ac img {
	width: 11vw;
	height: 11vw;
	display: block;
	position: absolute;
	-webkit-transition: all 0.5s ease;
	 -moz-transition: all 0.5s ease;
	 -o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	transition: all 0.5s ease;
	margin-top: -1vw;
	}
	.ac img:hover {
	opacity: 0.0;
	}

/* NPC PAGES */
.npc-attr {
border-spacing: 0px;
margin: auto;
font-size: 1.2em;
}
	.npc-attr td {
	padding: 5px;
	border-spacing: 0px;
	vertical-align: middle;
	}

/* GENERAL CHARACTER PAGE */

.inv { //Inventory items
width: 7vw;
height: 7vw;
float: left;
margin-right: 1vw;
text-align: center;
margin-bottom: 3.6vw;
font-size: 0.9em;
}
	.inv img {
	border: 5px solid #000;
	padding: 1vw;
	}

a.knack{ //Tooltip Links
position:relative;
z-index:24;
color: #666;
}
	a.knack:hover{z-index:25; background-color:#eee; cursor:help;}
	a.knack:hover span{
	display:block;
	position:absolute;
	top:1.2em; left:1.0em;
	width: max-content;
	max-width: 40vw;
	border:3px solid #556633;
	background-color:#9fb574; color:#333;
	line-height: 1.3em;
	padding: .3vw;
	}
	
.desc { //Description
font: italic 300 1.4em 'Open Sans'; 
color: #FFF;
text-shadow: 1px 1px 2px rgba(150, 150, 150, 0.75);
margin-bottom: 40px;
width: 50vw;
float: left;
}

.quote { //Quote bubble
font: normal 1.6em 'Walter Turncoat', cursive;
text-transform: lowercase;
float: right;
margin: 0px 15px 30px 15px;
/* speech bubble stuff */
position: relative;
width: 45vw;
padding: 10px;
background: #FFFFFF;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
border: #000000 solid 2px;
}
	.quote:after {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 10px 0 10px 30px;
	border-color: transparent #FFFFFF;
	display: block;
	width: 0;
	z-index: 1;
	right: -30px;
	bottom: 20px;
	}
	.quote:before {
	content: '';
	position: absolute;
	border-style: solid;
	border-width: 11px 0 11px 31px;
	border-color: transparent #000000;
	display: block;
	width: 0;
	z-index: 0;
	right: -33px;
	bottom: 19px;
	}

/* Pantheon-Specific Fonts */
.aesir { font-family: 'Crushed', 'Walter Turncoat', cursive; }
.bogovi { font-family: 'Unica One', 'Walter Turncoat', cursive; }
.found { font-family: 'Overlock', 'Walter Turncoat', cursive; text-transform: none !important; }
.kami { font-family: 'Yesteryear', 'Walter Turncoat', cursive; text-transform: none !important; font-size: larger; }
.netjer { font-family: 'Macondo', 'Walter Turncoat', cursive; text-transform: none !important; }
.orisha { font-family: 'Oregano', 'Walter Turncoat', cursive; text-transform: none !important; font-size: larger; }
.teotl { font-family: 'Underdog', 'Walter Turncoat', cursive; text-transform: none !important; }
.theoi { font-family: 'Cinzel', 'Walter Turncoat', cursive; }
.tuatha { font-family: 'Delius Swash Caps', 'Walter Turncoat', cursive; text-transform: none !important; }
.yazata { font-family: 'Mirza', 'Walter Turncoat', cursive; text-transform: none !important; }
/* End Pantheon-Specific Fonts */

/* CHATLOG */

.chatlog td {
line-height: 1.3em;
font-size: 1vw;
vertical-align: top;
min-height: 5vw;
}
	.chatlog td:first-line {
	font: 1.3em 'Walter Turncoat';
	color: #CCC;
	}
	.chatlog td:nth-child(1) {
	width: 7.5vw;
	height: 7.5vw;
	background-size: cover;
	}
	.chatlog td:nth-child(2) {
	padding-left: 0.5vw;
	}

	/* ST Chatlogs */
	.st td:nth-child(1) { background: url(https://db4sgowjqfwig.cloudfront.net/assets/301851/chatlog-st.png?1393718322) no-repeat; }

	/* Bear Chatlogs */
	.bear1 td:nth-child(1) { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/491758/chatlog-bear.png?1438973770) no-repeat; }

	/* Dovile Chatlogs */
	.dovile1 td:nth-child(1) { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/398566/chatlog-dovile-alt.png?1417985719) no-repeat; } //Dovile
	.dovile2 td:nth-child(1) { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/675366/chatlog-dovile2.png?1481839037) no-repeat; } //Morevuka

	/* Ken Chatlogs */
	.ken1 td:nth-child(1) { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/448150/chatlog-ken.png?1428984676) no-repeat; } //Ken
	.ken2 td:nth-child(1) { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/676227/chatlog-ken2.png?1481994802) no-repeat; } //Ken (God)

	/* Sanura Chatlogs */
	.sanura1 td:nth-child(1) { background: url(https://db4sgowjqfwig.cloudfront.net/assets/301845/chatlog-demigod-sanura.png?1393718286) no-repeat; } //Sanura (Demigod)
	.sanura2 td:nth-child(1) { background: url(http://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/591314/chatlog-demigod-sanura2.png?1463775806) no-repeat; } //Sanura (Demigod 2)
	.sanura3 td:nth-child(1) { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/679515/chatlog-sanura3.png?1482812648) no-repeat; } //Star-Bringer
	.sanurah td:nth-child(1) { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/301847/chatlog-hero-sanura.png?1398106679) no-repeat; } //Sanura (Hero)

	/* Victor Chatlogs */
	.victor1 td:nth-child(1) { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/398567/chatlog-victor.png?1417985941) no-repeat; }

	/* Malif Chatlogs */
	.malif td:nth-child(1) { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/301849/chatlog-malif.png?1398106680) no-repeat; }

	/* Mike Chatlogs */
	.mike td:nth-child(1) { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/301850/chatlog-mike.png?1398106681) no-repeat; }

	/* Harry Chatlogs */
	.harry1 td:nth-child(1) { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/301846/chatlog-hero-harry.png?1398106679) no-repeat; } //Harry (Hero)
	.harry2 td:nth-child(1) { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/301844/chatlog-demigod-harry.png?1398106678) no-repeat; } //Harry (Demigod)

	/* Boudicca Chatlog */
	.boudicca td:nth-child(1) { background: url(https://db4sgowjqfwig.cloudfront.net/campaigns/70632/assets/301843/chatlog-boudicca.png?1398106677) no-repeat; }

/* MAKE REFORGE DISAPPEAR */
div.front-nav-container, .flame-dragon, .campaign-public-title-container, #campaign-nav, .sidebar-party-members, .game-master, 
	.player-characters, #campaign-stream, .sidebar-last-updated, .tags, .see-all-wiki-pages-button, .played-remote, 
	.sidebar-adventure-log-neighbors, .character-avatar .frame, .character-avatar .author {display: none;}

/* CONTENT BACKGROUND */
#content{background:transparent;}
#banner-container { width: 102%; margin: -4em -1em; }

/* MAKE IT ALL GO AWAY */
main.main-content {background-color: transparent !important;}
div.campaign-landing-page-container {background-color: transparent !important;}
div.wiki-page.section {background-color: transparent !important;}

/* RID OF BARS AND ARROWS */
.highlight-container {height: 0px !important;}
#campaign-nav li.active:after {display:none}

/* REMOVE PAGE TITLE */
.wiki-page-name {display:none;}

/* CHARACTER, ADVENTURE LOG POST, COVER PAGE TITLE */
h1, h2.character-name.title, .adventure-log-post-title {
font: 2.8em 'Bowlby One SC', sans-serif;
letter-spacing: 2px;
text-transform:uppercase;
margin-top:-10px;
border:0px !important;
background:transparent;
-webkit-text-stroke: 1px #223311;
 color: #aabbaa !important;
 text-shadow:
 3px 3px 0 #223311,
 -1px -1px 0 #223311,
1px -1px 0 #223311,
-1px 1px 0 #223311,
 1px 1px 0 #223311;
margin-bottom: 25px;
}

/* CHARACTER SHEET */
#character-details {
width:130%;
position:relative;
z-index:10;
background-color:transparent !important;}

/* GM & PLAYER SECRETS */
#gm-secrets, .post-gm-only, .player-secret {
color:black;
position: relative;
width: 100%;
padding:15px;
clear: both;}

#gm-secrets div.panel {
width: 100% !important;
float: unset !important;
}

/* WIKI PAGE APPEARANCE */
div.post-section.post-main {
width: 75vw;
z-index:9;
background-color: transparent !important;
border:0px;}

/* LANDING PAGE APPEARANCE */
div.campaign-landing-page-container {
position:relative;
z-index:9;
background-color:transparent !important;
border: 0px;}

/*Removes all background and borders from tables*/
#content table{background-color:transparent; border:0px;margin-bottom:20px !important;}
#content tr:nth-child(even) {background-color:transparent}

#content table.yes-border {border:1px solid #CCC;}

#content table.yes-border tr:nth-child(even) {background-color:#EEE;}
#content table.yes-border tr:nth-child(odd) {background-color:#FFF;}

#content table.auto {margin:auto;}

#content table.full-width {width:100%;}

/* ADVENTURE LOG */
.adventure-log-post {
width:100%;
position:relative;
z-index:9;
background-color:#FFF !important;
border:0px solid #000;}

.adventure-log-post-subtitle {
width:100%;
content: hidden;
}

.adventure-log-show div.post-header-container { 
background:#FFF;}

.adventure-log-show div.post-main.post-section {
border: 0px;
width:100%;
left:0px;}

.adventure-log-show .post-date, .adventure-log-index .post-date { 
background-color:#CCC; 
color:black;
margin-right: -50px;
margin-top: -50px;}

.adventure-log-index .post-column { width: 800px;}
.adventure-log-teasers .row { height:250px;}

.adventure-log-index .adventure-log-post { 
background:#FFF;}

.adventure-log-page .post-title { 
position:relative; 
z-order:10;}

.adventure-log-post-subtitle {
background:transparent;
border:0px !important;
overflow: auto;
font-style: normal !important;
}

/* CHARACTER SIDEBAR */

.char-sidebar {
	background:#FFF;
	width: 26vw;
	float: right;
margin: 0;
position: relative;
padding: 5px;
border-radius: 5px;
border: 0px solid #000;
text-align: center;
font-size: 0.8em;
}
	.char-sidebar img {
	width: 100%;
	}
	.char-sidebar table {
	width: 100%;
	border-spacing: 0px;
	}
	.char-sidebar table img {
	width: 24px;
	}
	.char-sidebar td {
	border-bottom: 1px solid #CCC;
	max-width: 200px;
	font-size: 0.8em;
	}
	.char-sidebar td:nth-child(1) {
	font-weight: bold;
	text-align: left;
	}
	.char-sidebar td:nth-child(2) {
	text-align: right;
	}

 

CSS

God-Touched Nut_Meg