.modal {
	width: 400px;
	text-align: left;
	background: #fff;
	display: inline-block;
	vertical-align: middle;
	position: relative;
	z-index: 2;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	-o-border-radius: 8px;
	-ms-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 0 0 10px #000;
	-moz-box-shadow: 0 0 10px #000;
	-o-box-shadow: 0 0 10px #000;
	-ms-box-shadow: 0 0 10px #000;
	box-shadow: 0 0 10px #000;
}

.modal a.close-modal {
	position: absolute;
	top: -12.5px;
	right: -12.5px;
	display: block;
	width: 30px;
	height: 30px;
	text-indent: -9999px;
	background: url(../../../images/close.png) no-repeat 0 0;
}

.modal-spinner {
	display: none;
	width: 64px;
	height: 64px;
	position: fixed;
	top: 50%;
	left: 50%;
	margin-right: -32px;
	margin-top: -32px;
	background: url(../../../images/spinner_big.gif) no-repeat center center;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	-o-border-radius: 8px;
	-ms-border-radius: 8px;
	border-radius: 8px;
}

/** Modal End **/

/** Impromptu Start **/

/*! jQuery-Impromptu - v6.2.3 - 2016-04-23
* http://trentrichardson.com/Impromptu
* Copyright (c) 2016 Trent Richardson; Licensed MIT */

.jqifade{
	position: absolute;
	background-color: #777777;
}
iframe.jqifade{
	display:block;
	z-index:-1;
}
div.jqi{
	width: 400px;
	max-width:90%;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	position: absolute;
	background-color: #ffffff;
	font-size: 11px;
	text-align: left;
	border: solid 1px #eeeeee;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	padding: 7px;
}
div.jqi .jqicontainer{
}
div.jqi .jqiclose{
	position: absolute;
	top: 4px; right: -2px;
	width: 18px;
	cursor: default;
	color: #bbbbbb;
	font-weight: bold;
}
div.jqi .jqistate{
	background-color: #fff;
}
div.jqi .jqititle{
	padding: 5px 10px;
	font-size: 16px;
	line-height: 20px;
	border-bottom: solid 1px #eeeeee;
}
div.jqi .jqimessage{
	padding: 10px;
	line-height: 20px;
	color: #444444;
	overflow: auto;
}
div.jqi .jqibuttonshide{
	display: none;
}
div.jqi .jqibuttons{
	text-align: right;
	margin: 0 -7px -7px -7px;
	border-top: solid 1px #e4e4e4;
	background-color: #f4f4f4;
	border-radius: 0 0 6px 6px;
	-moz-border-radius: 0 0 6px 6px;
	-webkit-border-radius: 0 0 6px 6px;
}
div.jqi .jqibuttons button{
	margin: 0;
	padding: 15px 20px;
	background-color: transparent;
	font-weight: normal;
	border: none;
	border-left: solid 1px #e4e4e4;
	color: #777;
	font-weight: bold;
	font-size: 12px;
}
div.jqi .jqibuttons button.jqidefaultbutton{
	color: #489afe;
}
div.jqi .jqibuttons button:hover,
div.jqi .jqibuttons button:focus{
	color: #287ade;
	outline: none;
}
div.jqi .jqibuttons button[disabled]{
	color: #aaa;
}
.jqiwarning .jqi .jqibuttons{
	background-color: #b95656;
}

/* sub states */
div.jqi .jqiparentstate::after{
	background-color: #777;
	opacity: 0.6;
	filter: alpha(opacity=60);
	content: '';
	position: absolute;
	top:0;left:0;bottom:0;right:0;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
}
div.jqi .jqisubstate{
	position: absolute;
	top:0;
	left: 20%;
	width: 60%;
	padding: 7px;
	border: solid 1px #eeeeee;
	border-top: none;
	border-radius: 0 0 6px 6px;
	-moz-border-radius: 0 0 6px 6px;
	-webkit-border-radius: 0 0 6px 6px;
}
div.jqi .jqisubstate .jqibuttons button{
	padding: 10px 18px;
}

/* arrows for tooltips/tours */
.jqi .jqiarrow{ position: absolute; height: 0; width:0; line-height: 0; font-size: 0; border: solid 10px transparent;}

.jqi .jqiarrowtl{ left: 10px; top: -20px; border-bottom-color: #ffffff; }
.jqi .jqiarrowtc{ left: 50%; top: -20px; border-bottom-color: #ffffff; margin-left: -10px; }
.jqi .jqiarrowtr{ right: 10px; top: -20px; border-bottom-color: #ffffff; }

.jqi .jqiarrowbl{ left: 10px; bottom: -20px; border-top-color: #ffffff; }
.jqi .jqiarrowbc{ left: 50%; bottom: -20px; border-top-color: #ffffff; margin-left: -10px; }
.jqi .jqiarrowbr{ right: 10px; bottom: -20px; border-top-color: #ffffff; }

.jqi .jqiarrowlt{ left: -20px; top: 10px; border-right-color: #ffffff; }
.jqi .jqiarrowlm{ left: -20px; top: 50%; border-right-color: #ffffff; margin-top: -10px; }
.jqi .jqiarrowlb{ left: -20px; bottom: 10px; border-right-color: #ffffff; }

.jqi .jqiarrowrt{ right: -20px; top: 10px; border-left-color: #ffffff; }
.jqi .jqiarrowrm{ right: -20px; top: 50%; border-left-color: #ffffff; margin-top: -10px; }
.jqi .jqiarrowrb{ right: -20px; bottom: 10px; border-left-color: #ffffff; }

/** Impromptu End */

@import url(https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,400;0,700;1,400;1,700&display=swap);
@font-face {
  font-family: "Katherine";
  src: url(../../../../fonts/Katherine.woff2) format("woff2"),
       url(../../../../inc/fonts/Katherine.woff) format("woff"),
       url(../../../../inc/fonts/Katherine.otf) format("otf");
}

.combobg { background: #aaa }

* { box-sizing: border-box; outline: 0 } .clear { clear: both } img { max-width: 100% } .plain { color: inherit }
.right { text-align: right } .float_left { float: left } .float_right, .expcolimage { float: right }
#debug, .accountlist .attached br { display: none }
textarea, input, select, .button, button { background-color: rgba(255,255,255,.5); border: 0; border-radius: 0; font-family: inherit; font-size: inherit; color: inherit; padding: .15em; display: inline-block; box-shadow: 0 0 8px #01111626 }
.button, button { font-size: 70%; text-transform: uppercase; padding: .7em!important }
hr { margin: 5pt 0; border: 0; background: #eee; height: 2pt }
body { cursor: default; background-position: 50% 50%; background-size: cover; margin: 0; padding: 0; font-size: 9pt; font-family: Ubuntu; min-height: 100vh; background-attachment: fixed; transition: .4s; line-height: 1.3em }
.content { font-size: 1em; padding: 1.5em; width: 80%; max-width: 1200px; min-width: 800px; color: #204556; margin: 2em auto }
.theme { float: right; margin-top: -.5em }
.forms form { display: inline-block; margin: 0 1em }
.tab { overflow: auto }
.popup_menu { background: #eee; padding: 1em }
.table { display: table } .cell { display: table-cell }
.navigation { font-size: .65em!important; font-weight: bold; text-transform: uppercase; letter-spacing: 1pt } h1 { font-style: italic; font-weight: 100 }
summary { background: rgba(255,255,255,.5); padding: 20px; margin: 1em 0 0; cursor: pointer; font-size: 10px; font-weight: bold; text-transform: uppercase; font-family: Ubuntu; text-align: right;  }
.profile ul b { color: #87a4b1; font-variant: small-caps }
 
/* background */
.notblurry { background-image: url(../../../../images/Atlantis/atlantis_header.png) }
.blurry, nav, .content, .active .toggle, .forumdisplay_sticky td { background-image: url(../../../../images/Atlantis/atlantis_blurred.png) }

/* title */
a.title { display: block; z-index: 1; padding: 30vh 0 30vh; text-align: center }
a.title>b { font-size: 9px; text-transform: uppercase; letter-spacing: 5pt }
.amarna { transition: 1s; display: block; font-size: 150pt; line-height: 1; font-family: "Katherine", Sacramento; color: #040c1994; text-shadow: 0 0 100px rgb(139, 250, 251); margin: -30px 117pt 0 0 }
a.title:hover .amarna { color: #68dfed; text-shadow: 0 0 10px rgb(139, 250, 251) }

/* tables */
table { width: 100%; border-spacing: 0; border-collapse: collapse }
.trow1, .trow2, .board { background: rgba(255, 255, 255, 0.75) }
td.flex { padding: 0 }
.forumdisplay_regular td { background: rgba(255, 255, 255, 0.3) }
.nicetable th { background: rgba(0,0,0,.04); padding: 2em; text-align: center; font-family: Ubuntu; font-size: .6em; text-transform: uppercase; letter-spacing: .1em; border-bottom: 2px solid rgba(255,255,255,.5) }
.nicetable td { padding: .4em; border-top: 1px solid rgba(255,255,255,.5) }
.nicetable tr { transition: .4s }
.nicetable tr:hover { background: rgba(255,255,255,.3) }

/* nav */
nav { z-index: 999; font-weight: bold; letter-spacing: 1pt; position: fixed; top: 0; left: 0; right: 0 }
nav, .content, .active .toggle, .forumdisplay_sticky td { background-color: #c7c7c7; background-blend-mode: overlay; background-size: cover; background-attachment: fixed; background-position: 50% 50% }
nav a { padding: 1.5em 1.25em; display: inline-block; text-transform: uppercase; font-size: .65em!important }
.submenu { display: none; background: rgba(255,255,255,.05) }
.submenu:target { display: block }

/* welcome boxes */
.uberAccordion { padding: 0; margin: 0 } .uberAccordion > li { list-style: none; margin: 0 } .accordionContainer .toggle { cursor: pointer }
.toggle { display: block; text-transform: uppercase; letter-spacing: 1pt; font-size: 7pt; background: rgba(255,255,255,.5) }
.active .toggle { background-color: #868686!important; color: rgba(255,255,255,.5); background-position: 0 0!important }
.uberAccordion li>b { padding: 10px } .uberAccordion .uberAccordion b { padding: 5px }
.uberAccordion > li > div { background-color: rgba(255, 255, 255, 0.75); padding: 15px }
.uberAccordion.accordion-vertical { height: 300px } .uberAccordion .uberAccordion.accordion-vertical { height: 260px }
.toggle { background-attachment: unset!important }
.seasonimg { box-shadow: 2px 2px 10px rgba(0,0,0,.1); float: right; margin: 0 0 10px 10px; width: 100px; height: 100px; border-radius: 100%; background-size: cover }
.tab>.flex>div { height: 270px; overflow: hidden }
.tab>.flex>div:hover { overflow: auto }

.accordionContainer p { margin: 0 0 .5em } .accordionContainer h3 { margin: 1em 0 0 }
.forumstats { padding: 1.5em; font-size: 90% } .forumstats h3 { margin: 0 0 .5em; font-size: 1em }
.oocstats>div { background: #fff; padding: 10px; font-family: Ubuntu; text-transform: uppercase; font-size: 10px; font-weight: bold }
.stats>div { padding: 20px; color: rgba(255,255,255,.75); margin-bottom: 10px } .stats h2 { margin: 0 0 10px }

.vatabg { background: #855F23 }
.vastabg { background: #3490CE }
.ventribg { background: #EDC132 }
.amarnabg { background: #257548 }
.wilderbg { background: #E14B3C }

/* text */
a { transition: .5s } h1 { font-size: 2em } h2, .thead { font-size: 1.2em }
a, .toggle, h1, h2, h3, h4, h5, h6, .button, button, .thead { text-decoration: none; color: #116c88; font-family: Ubuntu }
h1, h2, h3, h4, h5, h6, .thead { color: inherit }
h3 { font-size: .75em; text-transform: uppercase; font-style: italic; font-weight: bold; color: #178ba6 }
.sceditor-button { box-sizing: content-box }

/*
h1::first-letter, h2::first-letter { margin: -.5em .25em 0 0 }
.boardname h1::first-letter { margin: .4em .2em 0 0 }
h1::first-letter, h2::first-letter { font-family: Katherine, Sacramento; float: left; font-weight: bold; line-height: 0 }
*/

a:hover, .accordionContainer .toggle:hover, .tablink.active, #cboxbutton:hover, .button:hover, button:hover { color: #39c4d9; text-shadow: 0 0 5px #d8d8ba; cursor: pointer; transition: .4s }
.boardname { padding: 50px; background-color: #69717d; background-blend-mode: lighten; font-size: 4pt; letter-spacing: 5pt; text-transform: uppercase; font-family: Ubuntu; background-size: cover; background-position: center center }
.boardname a { color: rgba(255,255,255,.5) }
.boardname h1 { margin: 0; line-height: 1 }
.subforums { font-size: 0; text-align: center; background: #0f1f2e0d; padding: 10px }
.subforums a { font-size: 9px; text-transform: uppercase; font-weight: bold; padding: 3px 5px; background: rgba(255,255,255,.5); display: inline-block; margin: 2px }
.subforums div { display: inline-block }

.cat { border-collapse: separate }

fieldset { border: 2px solid #fff; margin: 1em }
.items { margin-bottom: 1em }
.centered { text-align: center }
.icinfo { width: 550px; padding-right: 1.5em }
.post { margin: 1em 0 } .post>.flex { padding: 1.5em }
.postbit { width: 250px!important; margin-right: 1.5em; position: relative; height: 300px }
.post_content { flex-grow: 1 } .post .toggle { padding: 1em; font-size: .81em; text-align: right } .post .toggle a { margin: 0 0 0 1em }
.post .toggle .float_left a { margin: 0 1em 0 0!important }
.postbit_hover { position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: auto; background: rgba(255,255,255,.8); opacity: 0; padding: 1em; transition: .5s }
.postbit_hover:hover { opacity: 1 }
.postbit .flex div { background: rgba(255,255,255,.96); margin: 2.5px 0; padding: .5em; width: calc(1/2*100% - (1 - 1/2)*5px); font-size: 75%; text-transform: uppercase; text-align: center }
.wide { width: 100%!important }
.mini_icon { float: left; margin: 0 20px 0 0; width: 100px; height: 100px; border-radius: 100%; background-repeat: no-repeat; background-position: center center }
.accountlist th { padding: 2em } .accountlist td { padding: 2em 2em 2em 0 }
.accountlist { margin: 1em 0 }
.accountlist th { text-align: center; width: 200px }
.accountlist th .as_avatar { width: 150px; height: 150px; margin: 0 auto }
.accountlist span { display: block }
.as_avatar { background: rgba(255,255,255,.9); border-radius: 100%; text-align: center; overflow: hidden }
.accountlist td .as_avatar { width: 80px; height: 80px; margin: .5em }
.attachedprof { display: inline-block; text-align: center }
.sideinfo em { float:right; font-family: Ubuntu; font-size: 85%;  letter-spacing: 1px }
.sideinfo { display: table-cell; width: 300px; padding: .5em; background: rgba(255,255,255,.5) }
.sideinfo div { background: rgba(255,255,255,.5); padding: .5em; margin: .5em }

.board { margin-top: 10px }
.lastpost { font-style: italic; margin-top: 10px  }
.subforums { margin-top: 10px }
.subboards>.ooc-board { flex: 1 1 0; margin: .75em }
.subboards { padding: .75em }
.subboards>.ic-board { margin: .75em }

.ooc-board { padding: 20px }
.ooc-board h2 { padding: 0 0 10px }

.ic-board { margin-top: 1.5em; border-left: 15px solid #0f1f2e0d }
.ic-board .lastpost { text-align: right }

.ic-board>div { padding: 1.5em }
.landimg { background-size: cover; background-position: 50% 50%; background-color: #b2d4da; background-blend-mode: overlay; transition: 1s; float: right; margin: 10px; width: 150px; height: 150px; border-radius: 50% }
.ic-board>.boarddesc { height: 205px; overflow: auto }
.board:hover .landimg { background-blend-mode: normal }
.tab { display: none } #tab1 { display: block }

/* cbox */
#cboxbutton { position: fixed; bottom: 10px; right: 10px; text-align: center; background-color: #d9e5e9; border-radius: 50%; color: #116c88; font-size: 20px; padding: 20px 0; width: 60px; height: 60px; cursor: pointer }
#cboxwrap { position: fixed; bottom: 80px; right: 10px; background: #e4e9eb; padding: 20px; box-shadow: 0 0 10px rgba(0,0,0,.5); border-radius: 10px }
.discord { font-size: 12px; margin: 0 0 10px; display: inline-block }

/* responsive */
@media (min-width: 1000px) {
    .flex { display: flex; flex-direction: row; justify-content: space-between; flex-wrap: wrap }
    .five > div { box-sizing: border-box; width: calc(1/5*100% - (1 - 1/5)*10px) }
    .four > div { box-sizing: border-box; width: calc(1/4*100% - (1 - 1/4)*10px) }
    .three > div { box-sizing: border-box; width: calc(1/3*100% - (1 - 1/3)*10px) }
    .two > div { box-sizing: border-box; width: calc(1/2*100% - (1 - 1/2)*10px) }
}

@media (max-width: 500px) { .landimg { display: none!important } }

/*My CSS*/
/*Guidebook CSS*/

#ruletext {
    padding: 10px 50px;
    height: 675px;
    overflow-y: auto;
    margin-left: 5px;
    flex-grow: 4;
}

#rulenav {
    list-style-type: none;
    margin: 0;
    padding: 0;
    height: 100%;
    width: 200px;
    flex-grow: 1;
}

#rulelinks { font-size: 12px; text-transform: uppercase; font-weight: bold; padding: 3px 5px; background: rgba(255,255,255,.5); display: block; margin: 2px}