@import url('reset.css');	
/*
@import url('../fonts/pt-sans/stylesheet.css');	
@import url('../fonts/pt-serif/stylesheet.css');	
@import url('../fonts/genericons/genericons.css');
*/

/*
=========================================
Main cascading style sheet for Livius.org
=========================================
*/

html { position: relative; background: #efefef; }
body { color: #444; background: #fff; font-size: 16px; font-size: 1.6rem; z-index: 0; max-width: 1366px; margin: 0 auto; border-left: 1px solid #ccc; border-right: 1px solid #ccc; }

body.source { background: #fff url("images/source.jpg") repeat left top; }
body.fact-file { background: transparent url("images/factfile.jpg") repeat center top; } 
body.stub { background: transparent url("images/stub.jpg") no-repeat center top; }
div.stub { width: 100%; display: block; padding: 10px 0; background: #e3eff2; color: #35464a; font-weight: bold; text-align: center; margin: 16px 0; margin: 1.6rem 0; }
div.stub.top { margin-top: 0; }
div.stub p { padding: 0 10px; }

/* Paragraph styles */
p { line-height: 1.5; margin: 15px 0; margin: 1.5rem 0; }
p:first-child { margin-top: 0; }
p:last-child { margin-bottom: 0; }

/* Table styles */
table, tr, td { line-height: 1.5; }
table { width: 100%; margin: 24px 0; margin: 2.4rem 0; }

/* Link styles */
a, a:visited { color: #0645ad; text-decoration: none; cursor: pointer; }
a:hover, a:active { color: #d45500; cursor: pointer; }

/* Blockquotes */
blockquote { margin: 15px 0 15px 20px; margin: 1.5rem 0 1.5rem 2rem; line-height: 1.7; }

/* Clearfix */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

/* Miscellaneous rules */
.right { float: right; }
.left { float: left; }
.align_center { display: block; margin-left: auto; }
.no-mobile { display: none; }
.mobile { display: inline; }
.nospace { margin-top: 0; padding-top: 0; }
hr.ancient-text { clear: both; float: none; width: 100%; margin: 30px auto; padding: 0 !important; border: 0; border-bottom: 1px solid #ccc; }

/*
========================
Rules for the search box
========================
*/

input, select, textarea, submit { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
#search { float: right; width: 120px; }
#search input 
{ 
	margin: 0; width: 120px; width: 12rem; padding: 5px 40px 5px 5px; padding: .5rem 4rem .5rem .5rem; font-size: 16px; font-size: 1.6rem; border: 0; 
	background: #fff url("images/search.png") no-repeat 98% 4px; border: 1px solid #ccc; float: right; 
}

/*
================
Font definitions
================
*/

html, body { font-family: 'PT Serif', serif; font-weight: 400;  }
em, i, .revision, .type, body>header #slogan p, .admin-notify { font-style: italic; }
strong, b, th, body>header #logo p, #picture-details .label { font-weight: 700; }
em>strong, em>b, strong>em, strong>i { font-style: italic; font-weight: 700; }
#antescript, nav, input, select, textarea, submit { font-family: 'PT Sans', serif; font-weight: 400; }
#antescript b, #antescript strong { font-family: 'PT Sans', serif; font-weight: 700; }
#antescript i, #antescript em { font-family: 'PT Sans', serif; font-style: italic; }
input, select, textarea { font-size: 16px; font-size: 1.6rem; }
h1, h2, h3, h4, h5, h6 { clear: both; font-family: 'PT Sans', serif; font-weight: 700; color: #a40c6b; line-height: 1.5; text-align: left; font-weight: normal; margin: 0; padding: 0; }
	h1 { font-size: 36px; font-size: 3.6rem; font-weight: 700; }
	h2, h3, h4, h5, h6 { font-size: 18px; font-size: 1.8rem; font-weight: 700; }
h1 i, h1 em, h2 i, h2 em, h3 i, h3 em, h4 i, h4 em { font-family: 'PT Sans', serif; font-weight: 700; font-style: italic; }
h1, h2, h3, h4, h5, h6 { clear: none !important; }

/*
=================
Layout for NOTICE
=================
*/

#notice { background: #faebd7; padding: 12px 10px; padding: 1.2rem 1rem; }
#notice p { font-style: italic; text-align: center; }

/*
=================
Layout for HEADER
=================
*/

body>header { width: 100%; border-top: 5px solid #a40c6b; border-bottom: 1px solid #ccc; background: #faebd7 /*url("images/mosaic.jpg") repeat-x left top */; }

body>header #masthead { padding: 15px; padding: 1.5rem; font-size: 22px; font-size: 2.2rem; }
body>header #logo p { float: left; }
body>header #logo p>a { color: #a40c6b; }
body>header #slogan p { display: none; float: left; color: #808080; margin-left: 20px; margin-left: 2rem; }

/*
============================
Layout for MAIN CONTENT AREA
============================
*/

#main { width: 100%; margin: 0 auto; padding-top: 2.5rem; background: transparent url("images/shadow.png") repeat-x left top; /*max-width: 1366px;*/ }

/*
====================
Rules for breadcrumb
====================
*/

#breadcrumbs { margin: 16px 0; margin: 1.6rem 0; background: #f2f2f2; border: 1px solid #ccc; padding: 10px; padding: 1rem; }

/*
============================
Layout for the prime CONTENT
============================
*/

#content { width: 94%; padding: 0 3%; float: left; text-align: justify; line-height: 1.5; }
#content h2, h3, h4, h5 { margin: 25px 0 15px; margin: 2.5rem 0 1.5rem; }
#content h1 { margin: 0 0 15px; margin: 0 0 1.5rem; padding: 0; }
#content #antescript { margin: 20px 0; margin: 2rem 0; color: #1a1a1a; border-left: 5px solid #ccc; padding: 5px; padding: .5rem; padding-left: 20px; padding-left: 2rem; background: #efefef; padding-right: 10px; padding-right: 1rem; }
#content blockquote { color: #666; font-size: 14px; font-size: 1.4rem; }
#content ul, #content ol { padding-left: 40px; padding-left: 4rem; }
#content ul>li, #content ol>li { list-style: square; padding-left: 10px; padding-left: 1rem; margin: 15px 0; margin: 1.5rem 0; line-height: 1.5; }
#content ol>li { list-style: decimal; }

#content div#page-list { columns: 2 45%; }
#content h2.page-list { text-align: center; }
#content ul.page-list { padding: 0; }
#content ul.page-list li { list-style: none; padding: 0; margin: 5px 0; margin: .5rem 0; text-align: center; }

#content p { -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; -o-hyphens: auto; hyphens: auto; }

#content header { position: relative; }
#content header a#wikidata { position: absolute; top: 0; right: 0; color: #ccc; font-size: 12px; font-size: 1.2rem; }
#content header a#wikidata:hover { color: #999; }

#content a:hover img { box-shadow: inset 0 0 10px #000; -moz-box-shadow: inset 0 0 10px #000; -webkit-box-shadow: inset 0 0 10px #000;}

/*
===============================
Layout for the webpage's FOOTER
===============================
*/

body>footer { width: 100%; margin: 25px auto 0; margin: 2.5rem auto 0; padding-bottom: 25px; padding-bottom: 2.5rem;}
body>footer p { text-align: center; }
body>footer p.revision { color: #999; }

#menu_bottom { line-height: 1.3; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; background: #f2f2f2; }
#menu_bottom nav p { text-align: center; padding: 10px; padding: 1rem; }
#menu_bottom nav p .menu-item { margin: 0 10px; margin: 0 1rem; }

/*
==============================================
Thumbnails for Wikimedia Commons-like pictures
==============================================
*/

ul#thumbnails { padding: 0; margin: 0; }
#content #thumbnails li { padding: 0; margin: 0; list-style: none; }
#content #thumbnails li { margin-bottom: 5px; border: 1px solid #ccc; padding: 5px; }
#content #thumbnails li p { margin: 5px 0 0; text-align: center; font-size: 12px; font-size: 1.2rem; padding-bottom: 5px; }
#content #thumbnails img { width: 100%; }

/*
===============
Home page stuff
===============
*/

.summary { border-top: 1px solid #ccc; padding: 20px 0; }
.summary h1 { font-size: 26px; }

.summary div.image_wrap { display: none; }
.summary img { display: none; }

#content .intro { padding-bottom: 40px; padding-bottom: 4rem; background: transparent url("images/stripes.png") repeat-x bottom left; }
#content .summary:first-child { border-top: 0; }

/*
======================
Rules for picture data 
======================
*/

figure { box-sizing: border-box; }
#picture { background: #f2f2f2; text-align: center; width: 100%; height: auto; margin: 0; padding: 0; box-sizing: border-box; }
#picture-details { margin: 16px 0; margin: 1.6rem 0; width: 100%; }
#picture-details td { padding: 5px 0; padding: .5rem 0; }
#picture-details .label { text-align: right; padding-right: 10px; padding-right: 1rem; white-space: nowrap; }
#picture img, .picture img, figure img { display: block; max-width: 100%; height: auto; margin: 0 auto; }

/*
========================
Rules for article footer
========================
*/

article footer #article-navigation { width: 100%; margin: 16px 0; margin: 1.6rem 0; }
article footer #article-navigation .prev { float: left; max-width: 50%; text-align: left; }
article footer #article-navigation .next { float: right; max-width: 50%; text-align: right; }

article footer p#meta, article footer p#modified, p.modified { clear: both; color: #999; font-style: italic; }
p#modified { margin: 16px 0; margin: 1.6rem 0; }
article footer p#meta a { color: #666; }
article footer p#meta a:hover { color: #1a1a1a; }

/*
=======================
Layout for the SIDEBARS
=======================
*/

#sidebar_left, #sidebar_right { font-size: 14px; font-size: 1.4rem; color: #999; width: 94%; padding: 0 3%; }
#sidebar_left h2, #sidebar_left h3, #sidebar_left h4 { text-align: right; }
#sidebar_right { text-align: left; margin-top: 16px; padding-top: 32px; padding-top: 3.2rem; }
#sidebar_right li { line-height: 1.5; }
#sidebar_right li { text-indent: -1rem; padding-left: 1rem; }
#sidebar_left img, #sidebar_right img { width: 100%; }
#sidebar_left { display: none; }
#sidebar_right h4 { margin-top: 16px; margin-top: 1.6rem; border-top: 1px dotted #ccc; padding-top: 16px; padding-top: 1.6rem; margin-bottom: 0; }
#sidebar_right h4:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
#sidebar_right h2, #sidebar_right h3, #sidebar_right h4 { font-size: 16px; }

/*
============== 
Search results
==============
*/

#results { line-height: 1.5; }
#results ul, #results ul li { list-style-type: none; padding: 0; margin: 0; }
#results h2 { font-family: 'PT Serif', serif; margin: 25px 0 0; margin: 2.5rem 0 0; padding: 0; font-weight: 400; }
#results h2 a { font-size: 18px; font-size: 1.8rem; }
#results p { margin: 0; padding: 0; }
#results p.url { color: #00802a; }

/* Pagination styling */
#pagination ul { margin: 16px 0; margin: 1.6rem 0; padding: 0; list-style: none !important; }
.MarkupPagerNav * { clear: both; float: none; padding: 0 !important; margin: 0; font-family: "PT Sans", sans-serif; font-size: 12px; font-size: 1.2rem; text-transform: uppercase; }
ul.MarkupPagerNav { padding: 0; margin: 0; }
.MarkupPagerNav li { display: inline; list-style: none !important; margin-right: 3px !important; }
.MarkupPagerNav li a, .MarkupPagerNav li.MarkupPagerNavSeparator { display: inline-block; padding: 4px 9px !important; color: #fff; background: #2f4248; }
.MarkupPagerNav li.MarkupPagerNavOn a, .MarkupPagerNav li a:hover { color: #fff; background: #a40c6b; }
.MarkupPagerNav li.MarkupPagerNavSeparator { color: #777; background: #d2e4ea; }

/* 
=================
Rules for caveats
================= 
*/

#caveats { position: relative; background: #f2f2f2; border: 1px solid #ccc; padding: 10px; padding: 1rem; }
#caveats h4 { margin-top: 0; padding-top: 0; }
.whatsthis { position: absolute; top: 10px; right: 10px; font-size: 12px; font-size: 1.2rem; font-style: italic; display: inline; margin: 0; padding: 0; }

/*
===================
Rules for footnotes
===================
*/

.note-label { cursor: pointer; color: #1a1a1a; font-weight: 700; }
.note-content { display: inline; background: #f2f2f2; margin-left: 10px; margin-left: 1rem; }

/*
======================
Rules for Vici.org map
======================
*/

#map { width: 100%; height: 250px; }

/*
===============================
Image captions etc. from module
===============================
*/

div.image_wrap, figure { margin: 16px 0 0; border: 1px solid #ccc; padding: 5px; background: #fff; max-width: 100%; }
img.align_center, img.align_right, img.align_left, 
figure.align_center, figure.align_right, figure.align_left { width: 100%; max-width: 100%; height: auto; }
.center { margin: 0 auto; text-align: center; }
figcaption, .caption { font-style: italic; font-size: 12px; font-size: 1.2rem; width: 100%; text-align: center; margin: 8px 0; margin: .8rem 0; line-height: 1.5; }
figcaption, .caption { color: #808080; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; -o-hyphens: auto; hyphens: auto; }

#content table { width: 100%; max-width: 100%; margin: 16px auto; padding: 0; border: 0; }
#content td img.align_center { width: auto; max-width: 100%; height: auto; margin: 0 auto; }
#content td .image_wrap { margin: 0; border: 0; padding: 0 5px; max-width: 100%; height: auto; }

/*
======================
Tabs for "switch tabs"
======================
*/

.tabs { margin: 16px 0; margin: 1.6rem 0; padding: 0; border-bottom: 5px solid #a40c6b; font-size: 12px; font-size: 1.2rem; hyphens: auto; }
.tabs div { display: inline; float: left; text-align: center; min-width: 20%; background: #f2f2f2; max-width: 100%; hyphens: inherit; }
.tabs a { display: block; color: #1a1a1a; padding: 5px; padding: .5rem; hyphens: inherit; }
.tabs div.selected a, #tabs div a:hover { background: #a40c6b; color: #fff; font-weight: 700; hyphens: inherit; }
.tabs.bottom { border-bottom: 0; border-top: 5px solid #a40c6b; }

/*
===================
Rules for galleries
=================== 
*/

table.gallery { clear: both; width: 100%; margin: 16px auto; margin: 1.6rem auto; padding: 0; border: 0; }
table.gallery tr { /* Nothing */ }
table.gallery td { width: 25%; }
table.gallery td.gallery-thumbnail { border: 1px solid #ccc; padding: 5px 5px 12px; background: #fff; }
table.gallery td.gallery-thumbnail img { width: 100%; max-width: 100%; height: auto; }

/*
===================
Miscellaneous rules
=================== 
*/

#editpage { position: absolute; position: fixed; top: 0; left: 0; padding: 5px 6px; background: #db1174; color: #fff; display: block; }
#editpage:hover { background: #ffffcc; color: #000; }
h1 a, h1 a:visited { color: #a40c6b; }
a.readmore, a.donate { background: #efefef; color: #44445e; padding: 5px; padding: .5rem; text-align: center; display: block; }
a.readmore:hover, a.donate:hover { background: #a40c6b; color: #fff; }
a.donate { margin-top: 20px; margin-top: 2rem; padding: 10px; padding: 1rem; line-height: 1.5; }
.type { color: #ccc; }
.admin-notify { background: maroon; color: #fff; padding: 0 .5rem; }
.advert { margin-bottom: 20px; margin-bottom: 2rem; }
footer#footer p { padding-left: 10px; padding-right: 10px; }
p.page-note { font-size: 12px; font-style: italic; } 
.align_right { clear: right; }

/*
=================
CSS media queries
=================
*/

@media screen and (min-width: 480px)
{
	/* Changes to pictures */
	div.image_wrap { margin: 4px 0; margin: .4rem 0; } 
	.align_right, div.align_right, figure.align_right { float: right; margin-left: 20px; }
	.align_left, div.align_left, figure.align_left { float: left; margin-right: 20px; }
	.align_left, align.right, img.align_right, img.align_left, figure.align_right, figure.align_left { width: 200px; height: auto; max-width: 100%; height: auto; }
	img.align_center { clear: both; max-width: 100%; height: auto; margin: 16px auto; }
	.align_right .caption, .align_left .caption { width: 200px; }
	#content #thumbnails li { float: left; min-width: 50px; max-width: 24%; margin-right: 5px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
	#content #thumbnails img { max-width: 100%; }
}

@media screen and (min-width: 768px) 
{
	#sidebar_left { display: none; }
	#sidebar_right { text-align: left; float: right; border: 0; margin: 0; width: 14%; padding: 0 3%; }
	#content { border-left: 0; width: 73%; border-right: 1px solid #ccc; }
	#content .summary:last-child { padding-bottom: 0; }
	body>header #slogan p { display: block; }
	#search input { width: 220px; width: 22rem; }
	#breadcrumbs { margin-bottom: 0; }
	#map { width: 100%; height: 400px; }
}

@media screen and (min-width: 960px) 
{
	#sidebar_left, #sidebar_right { display: block; text-align: right; float: left; width: 14%; margin: 0; padding: 0 3%; font-size: 14px; font-size: 1.4rem; color: #999; }
	#sidebar_right { float: right; text-align: left; }
	#content { width: 53%; border-left: 1px solid #ccc; border-left: 1px solid #ccc; border-right: 1px solid #ccc; }
}

/*
============================
End of cascading style sheet
============================
*/