/*
This is the default CSS for perturb.org
Scott Baker - 2004
*/

/* A font by Jos Buivenga (exljbris) -> www.exljbris.com */
@font-face {
	font-family : 'Fontin';
	font-style  : normal;
	font-weight : 400;
	src:
		local('Fontin Regular'),
		url('/css/fonts/fontin/fontin_regular.ttf');
}

@font-face {
	font-family : 'Fontin';
	font-style  : italic;
	font-weight : 400;
	src:
		local('Fontin Italic'),
		url('/css/fonts/fontin/fontin_italic.ttf');
}

@font-face {
	font-family : 'Fontin';
	font-style  : normal;
	font-weight : 700;
	src:
		local('Fontin Bold'),
		url('/css/fonts/fontin/fontin_bold.ttf');
}

/* Best monospace font EVAR! */
/* http://blogs.adobe.com/typblography/2012/09/source-code-pro.html */
@font-face {
	font-family : 'Source Code Pro';
	font-style  : normal;
	font-weight : 400;
	src         :
		local('Source Code Pro'),
		local('SourceCodePro-Regular'),
		url('/css/fonts/source_code_pro/source_code_pro.woff') format('woff');
}

@font-face {
	font-family : 'Source Code Pro';
	font-style  : normal;
	font-weight : 700;
	src         :
		local('Source Code Pro Bold'),
		local('SourceCodePro-Bold'),
		url('/css/fonts/source_code_pro/source_code_pro_bold.woff') format('woff');
}

/* ------------------------------------------------------------- */

body {
	font-family: 'Open Sans', sans-serif;
	margin-top: 15px;
	/*margin-left: 1.5em;*/
	/*margin-right: 1.5em;*/
	/*background-color: black;*/
	background-color: #131313;
	/*min-width: 650px;*/
	color: white;

	max-width: 1320px;
	margin: auto;
	padding: 0 1em;
}

.font-fontin {
	font-family: "Fontin", serif;
}

.font-opensans {
	font-family: "Open Sans", sans-serif;
}

.font-sourcecodepro {
	font-family: "Source Code Pro", monospace;
}

::selection {
  background: #27BC1F;
}

/* This is the header navigation buttons at the top of each page */
.page_header {
	width        : 100%;
	margin-right : auto;
	margin-top   : 25px;
	margin-bottom: 25px;
	border       : 0px solid yellow;
	color        : white;
}
.page_header img { border: 0px solid white; margin-left: 3%; margin-right: 3%; }

/* This is the formatting for the "New Entry" if you're logged in */
.admin_section {
	margin-bottom: 15px;
}

.admin_section, .entry {
	/*max-width: 125ch;*/
	/*margin: auto;*/
}

a:link { color: #ccc; font-weight: normal; text-decoration: none; }
a:visited { color: #eee; font-weight: normal; text-decoration: none; }
/*a:hover { color: #33ccff; text-decoration: underline; }*/

/* Code selections */
.code_header {
	font-size   : 8pt;
	font-weight : bold;
	margin      : 15px 0 0 0;

	/*position: relative;*/
	/*top: 24px;*/
	/*right: -10px;*/
	/*color: green;*/
	/*background: yellow;*/
}

.font-50 { font-size: 50%; }
.font-75 { font-size: 75%; }
.font-125 { font-size: 125%; }
.font-150 { font-size: 150%; }

/*
.code_table { border: 0px solid red; margin-bottom: 5px; }
*/

code, .line_numbers {
	font-family      : 'Source Code Pro', monospace;
	color            : black;
	text-align       : left;
	font-size        : 10pt;
	background-color : #FAFAFA;
	border           : 1px solid #D1D7DC;
	padding          : 3px;
	white-space      : pre;
	display          : inline-block;
	-moz-tab-size    : 4;
	tab-size         : 4;
	background-image : url('/images/graph-paper-wallpaper.gif');
}

.entry_body pre > code, .reply_body pre > code, .entry_body code {
	display       : inline-block;
	border-radius : 3px;
	padding       : 3px;
	background    : url('/images/graph-paper-wallpaper.gif');
}

.entry_body ol {
	/*margin: .5em 0 .5em 0;*/
}

.entry_body.format_markdown table {
	margin: 0 0 1rem 0;
}

.entry_body.format_markdown > h2 {
	margin-bottom: 0.2em;
}

.entry_body.format_markdown > * {
	/*margin: 1em 0;*/
	margin-top: 0;
}

.entry_body.format_html code {
	display : block;
	margin  : 0 0 1em 0;
}

.entry_body > *:first-child, .reply_body > *:first-child {
	margin-top    : 0px;
}

.entry_body > *:last-child, .reply_body > *:last-child {
	margin-bottom    : 0px !important;
}

.entry_body.format_markdown blockquote:first-child {
	margin-top: 0.75em;
}

.entry_body table, .output table {
	border-collapse: collapse;
}

.center {
	text-align: center;
}

.entry_body td, .entry_body th, .output th, .output td {
	border: 1px solid #5b5858;
	padding: 0.5em;
}

blockquote {
	border-left      : 2px solid white;
	padding          : 0.5em 1em 0.5em 0.5em;
	background-color : #414141;
	margin-right     : 1em;
	margin-left      : 1em;
}

blockquote > p:first-child {
	margin-top: 0;
}

blockquote > p:last-child {
	margin-bottom: 0;
}

/* Qutotation styles */
.quotation {
	max-width     : 500px;
	width         : 80%;
	margin-left   : auto;
	margin-right  : auto;
	border        : 0px solid white;
	margin-top    : 0px;
	margin-bottom : 40px;
}
.quote_quote { text-align: justify; }
.quote_author { text-align: right; font-style: italic; }

.quote_whole { width: 95%; border: 0px solid green; margin-bottom: 15px; }
.quote_header { border: 0px solid; color: white; font-weight: bold; }
.quote_date { color: red; width: 150px; border: 0px solid; }
.quote_buttons { margin-left: 25px; }

/* Entries */
.entry { border: 0px solid; color: yellow; }

.entry_header_text {
	/*border: 1px solid #4f4f4f;*/
	/*background: #292929;*/
	/*padding: 3px;*/
	font-size: 1.4em;
	text-shadow: gray 2px 2px 2px;
	font-weight: bold;
}

.entry_header {
	font-weight: bold;
	font-size: 10pt;
	margin-bottom: 3px;
	border: 0px;
	margin-left: 3px;
}

.entry_title {
	color: #FFAA00;
	border: 0px solid;
	margin-right: 3em;
}

.entry_header_text:hover > .entry_title, .entry_header_text:hover > .entry_date {
	text-decoration: underline;
}

.entry_date {
	color: yellow;
	border: 0px solid;
}

.entry_para { border: 0px solid red; margin: 10px 0px 0px 0px; }

.entry_buttons {
	margin-left : 10px;
	border      : 0px solid green;
}
.entry_buttons img {
	border  : 0px solid;
	padding : 0px;
}

.admin_button {
	margin-left: 0.33em;
}

/* When you hover over an entry body */
.entry_meat:hover a, .page_footer:hover a, .admin_section:hover a {
	color           : #00ffff;
	text-decoration : underline;
}

/* When you hover over an entry body */
.entry_meat:hover a > code {
	border: 1px solid #00ffff;
}

/* When you hover over a link in an entry */
.entry_meat a:hover, .page_footer a:hover, .admin_section a:hover {
	color           : #33ccff;
	text-decoration : underline;
}

.entry_body {
	color      : #ffffff;
	background : #292929;
	text-align : justify;
	border     : 1px solid #4f4f4f;
	margin-top : 7px;
	padding    : 5px;
}

.entry_reply { border: 0px solid; text-align: right; margin-bottom: 20px; margin-top: 5px; }

/* Page footer stuff */
.page_footer {
	color         : white;
	margin-top    : 15px;
	margin-bottom : 10px;
	border        : 0px solid green;
	display       : flex;
}
.page_footer > * { flex: 1; }

.page_footer > .email_footer { text-align: left; }
.page_footer > .search_wrapper { text-align: right; }

.page_counter { margin-top: 10px; border: 0px solid; }

/* Reply formatting for showing a whole entry */
.reply_main { color: white; margin-bottom: 15px; border: 0px solid; }
.reply_header { color: white; border: 1px solid #4f4f4f; font-weight: bold; margin-bottom: 3px; background: #292929; padding: 3px; margin-top: 0px; }
.reply_name { color: red; border: 0px solid; }
.reply_date { color: yellow; border: 0px solid; margin-left: 10px; }
.reply_body { color: white; border: 1px solid #4f4f4f; background: #292929; padding: 3px; margin-bottom: 15px; }
.reply_email { color: #ffa200; }
.reply_div_text { font-size: 1.1em; font-weight: bold; }

.creative_commons { text-align: center; font-size: .8em; }

.page_counter { border: 0px solid; }

/* The email address footer formatting */
.email_address { font-family: monospace; font-size: 12pt; }

/* Formatting for the search box at the bottom of the page */
.search_label { display: block; float: left; width: 120px; font-weight: normal; }
.search_input { border: 1px solid gray; }
.search_results { border: 1px solid green; }
.clear { clear: both; }

/* Assorted other little formatting */
.hidden { display: none; }
.login_header { font-size: 12pt; font-weight: bold; }
.debug_text { font-size: 8pt; color: #8f8f8f; margin-left: 15px; clear: both; }
.medium_header { font-size: 14pt; }
.small_text { font-size: 8pt; color: gray; }

/* td { font-family: Verdana, sans-serif; font-size: 10pt; } */
table.tborder { border-collapse: collapse; }
td.tborder { border: 1px solid; vertical-align: baseline; }

.input_flat { border: 1px solid gray; }
.ip_address { font-family: monospace; font-weight: bold; }

/*
See: https://bugzilla.mozilla.org/show_bug.cgi?id=116083#c22
*/
.moz-hack { margin: 0; }

.search_hl_one { font-weight: bold; color: #BFFFB6; }
.search_hl_two { font-weight: bold; color: #FFFF98; }
.search_hl_three { font-weight: bold; color: #CFF5FF; }
.search_hl_four { font-weight: bold; color: #DDBBFF; }

.private_entry { background: #4f4f4f; border: 1px solid #292929; }
.entry_header span.private_entry { margin-left: -3px; padding: 4px; }

.header_buttons { margin-left: auto; margin-right: auto; text-align: center; border: 0px solid; }

.header_icon {
	display    : inline-block;
	border     : 0px solid;
	width      : 100px;
	margin     : 0 25px;
	font-style : italic;
	font-size  : 1.2em;
}

.captcha {
	border-radius: 4px;
}

.entry_header_text, .entry_body {
	border-radius: 2px;
	overflow: auto;
}

.stat_table {
	border-collapse: collapse;
	width: 100%;
	table-layout: fixed;
}

.stat_table tr.header {
	background-color: #585858;
	text-align: center;
}

.stat_table td, .stat_table th {
	border: 1px solid;
	padding: 0.5em;
}

.entry_tags {
	border: 0px solid green;
}

.entry_tag_item {
	display          : inline-block;
	padding          : 2px 4px;
	border-radius    : 2px;
	border           : 1px solid #aaa;
	margin           : 0 5px 0 0;
	background-color : #222;
}

div.editor-toolbar {
	background: white;
	opacity: 0.9;
}

.entry_body th, .output th {
	/*background-color: #4d4a4a;*/
	text-align: center;
	color: #1a1919;
	background: #cfcccc;
}

.format_markdown table tr:nth-child(even) {
	/*background-color: #6c6a6a;*/
}

.format_markdown table tr:nth-child(odd) {
	/*background-color: #7d7d7d;*/
	background-color: #3E3C3C;
}

#textarea {
	width: 100%;
	height: 40rem;
	font-size: 120%;
}

.book_modal {
	width: 100%;
	background: white;
	height: 20em;
}

/* BS clone */
.input-group {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  width: 100%;
}

.input-group .btn {
  position: relative;
  z-index: 2;
}

.input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
  margin-left: -1px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.btn {
	display: inline-block;
	font-weight: 400;
	line-height: 1.5;
	color: #212529;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
	cursor: pointer;
	user-select: none;
	background-color: transparent;
	border: 1px solid transparent;
	border-top-color: transparent;
	border-right-color: transparent;
	border-bottom-color: transparent;
	border-left-color: transparent;
	padding: .375rem .75rem;
	font-size: 1rem;
	border-radius: .25rem;
	transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.pointer {
	cursor: pointer;
}

.btn-primary {
	color: #fff;
	background-color: #0d6efd;
	border-color: #0d6efd;
}

.btn-secondary {
	color: #fff;
	background-color: #6c757d;
	border-color: #6c757d;
}

.input-group > .form-control, .input-group > .form-select {
	position: relative;
	flex: 1 1 auto;
	width: 1%;
	min-width: 0;
}

.form-control {
	display: block;
	padding: .375rem .75rem;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: #212529;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	appearance: none;
	border-radius: .25rem;
	border-top-right-radius: 0.25rem;
	border-bottom-right-radius: 0.25rem;
	transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
	width: 100%;
}

.d-flex { display: flex; }
.d-none { display: none; }
.w-100  { width: 100%; }

.flex-1 { flex: 1 }
.flex-2 { flex: 2 }
.flex-3 { flex: 3 }
.flex-4 { flex: 4 }
.flex-5 { flex: 5 }
.flex-6 { flex: 6 }

.p-3  { padding       : 0.75em; }
.px-3 { padding       : 0.75em 0; }
.pe-3 { padding-right : 0.75em; }
.m-3  { margin        : 0.75em; }
.mt-3 { margin-top    : 0.75em; }
.me-3 { margin-right  : 0.75em; }

.pf { padding-right: 3em; }

/* ----------------------------------------------------------------- */
/* ----------------------------------------------------------------- */

/*This is for medium width devices - tablets*/
@media (min-width: 641px) and (max-width: 1025px) {
	body {
		/*margin-left  : 0.5em;*/
		/*margin-right : 0.5em;*/
		padding: 0.5em;
		/*background-color: orange ;*/
	}

	.header_icon {
		margin: 0 9px;
	}
}

/* This is for small width devices - phones */
@media (min-width: 0px) and (max-width: 640px) {
	body {
		/*margin-left  : 0.5em;*/
		/*margin-right : 0.5em;*/
		padding: 0 0.5em;
		/*background-color: red;*/
	}

	.phone-hide {
		display: none;
	}
	.header_icon {
		margin: 0;
	}

	.header_icon img {
		max-width: 50%;
	}

	.entry_title {
		display: block;
		margin-right: 0;
		margin-bottom: 6px;
	}

	/*.entry_header_text {*/
	/*    border: 0;*/
	/*    background: 0;*/
	/*}*/
}
