MediaWiki:Common.css

/* Refreshed Skin Tweaks */ /* Google Fonts */ @import url('https://fonts.googleapis.com/css?family=Libre+Baskerville%7COvo');

/*redo header */

/* title is creates in common.js */

1. jfatitle {

   position: absolute;
   top: 4px;
   left: 214px;
   z-index: 10001;
   color: #fff;

}

1. jfatitle a, #jfatitle a:visited {

   color: #fff;
   font-size: 36px;
   

}

@media (min-width: 601px) { /* tablet and desktop */

#site-info img { width: 130px; height: 130px; top: 20px; position: absolute; left: 30px; }

#sidebar-wrapper { position: relative; float:left; margin-top: 70px; }

#sidebar { position: relative; float: left; }

#header-wrapper { position: relative; top: 30; left: 200; }

#content-wrapper { padding-left: 8px; top: 0; } }

@media (max-width: 1000px) and (min-width: 601px) { /* tablet */ #site-info img { left: 14px; } #jfatitle { left: 186px; } }

/* odd size for header adjustment to keep left and right stuff from overlapping */ @media (max-width: 760px) and (min-width: 601px) { /* tablet */ #jfatitle a, #jfatitle a:visited { font-size: 26px; left: 170px; top: 15px; } }

/* styling for phones and smaller tablets */ @media (max-width: 600px) { /* title is created in common.js */

#header-wrapper { top: 0; }

#jfatitle { top: 8px; left: 58px; position: fixed; } #jfatitle a, a:visited { color: #fff; font-size: 26px; } }

/* redo header end */

/* major fixes */

/* titles should wrap no matter where */ @media (max-width: 1000px) and (min-width: 601px) {

 #firstHeading { 
 	white-space: normal;
 }

} @media (max-width: 600px) { #firstHeading { white-space: normal; } }

/* global styling */

body { font-family: "Ovo", sans-serif; background-color: #7a7a7a; /* bg-color of site */ ; background-color: #f7f7f7; color: #555; /* content/text color of site */ ; }

DIV#bodyContent { font-family: "Ovo", sans-serif; }

h1, #firstHeading { font-family: "Libre+Baskerville", serif; color: #555; font-weight: normal; font-size: 34px; margin-top: 10px; }

h2, h3, h4, h5, h6 { font-family: "Libre+Baskerville", serif; color: rgb(198, 93, 25); font-weight: normal; }

a, a:visited { color: #5a7c9f; }

a.new, a.new:visited { color: #5a7c9f; }

a.new:hover { border-bottom: 0.25em solid #a55858; }

/* header */

1. header-wrapper {

background: #7a7a7a; /* bg-color/gradient of header web component */ ; border-bottom: 3px solid rgb(198, 93, 25);; }

.header-button:hover, .header-dropdown-item:hover, .header-button-active, .sitedropdown-highlighted, .dropdown-highlighted { /*background-color: bg-color of header items and dropdown menus */ ; /* color: content/text color of header items and dropdown menus */ ; }

/* sidebar */

1. sidebar-wrapper {

color: #444; }

1. sidebar a, #sidebar a:hover, #sidebar a:visited {

color: #444; xfont-weight: bold; color: #5a7c9f; margin-right: 10px; margin-bottom: 5px; line-height: 18px; }

/* menu headings */

1. sidebar h1 {

color: rgb(198, 93, 25); xfont-weight: bold; margin-left: 20px; margin-right: 20px; margin-top: 12px; margin-bottom: 6px; border-bottom: 1px solid; font-size: 16px; }

/* content */

1. bodyContent {

padding: 0 1em; line-height: 1.5em; font-size: 1.10em; word-wrap: break-word; font-family: "Helvetica Neue","Helvetica","Arial",sans-serif; color: #555; }

.mw-parser-output a.external, .mw-parser-output a.external:visited { color: #5a7c9f; }

/* give [expand] [collapse] some breathing room */ .mw-collapsible-toggle { margin-left: 10px; }

/* toc */

1. jfa-toc {

}

1. toc {

float: right; margin-left: 20px; margin-bottom: 20px; max-width: 50%; background-color: #fff; padding: 16px; }

/* hide table of contents numbering */ .tocnumber { display: none; }

.toctext, .tocnumber {

   font-size: .95em;
   color: #5a7c9f;

}

/* the little show/hide on toc */

1. toc .toctogglelabel, #toc .toctogglecheckbox {

color: #5a7c9f; }

.toclevel-2, .toclevel-3, .toclevel-4 {

   list-style-type: circle;

}

.header-button:hover, .header-button-active, .header-dropdown-item:hover {

   background-color: rgb(198, 93, 25);

}

.standard-toolbox { font-family: "Ovo",sans-serif; height: 1.5em; position: absolute; bottom: 1.20em; font-size: 13px; }

.standard-toolbox a.selected { border-bottom: 0; }

.fixed-toolbox { top: .3em; }

/* mobile ?? */

1. user-info .header-menu {

   top: 2.75em;
   background-color: rgb(198, 93, 25);
   padding: 0.15em 0 0.15em 0

}

.sidebar-shower { background-color: rgb(198, 93, 25); }

1. header-wrapper .search-form {

xbackground-color: rgb(198, 93, 25); }

/* styling for medium and large sized tablets */ @media (max-width: 1000px) and (min-width: 601px) { #header-wrapper .search-form { background-color: rgb(198, 93, 25); /* bg-color of search on tablet */ ; } }

/* styling for phones and smaller tablets */ @media (max-width: 600px) { #sidebar-wrapper { background-color: #f7f7f7/* bg-color of sidebar on phones */ ; color: #444;

} #user-info .header-menu { background-color: #333 /* bg-color of user dropdown menu */ ; }

#toc { float: none; margin-left: 0; width: 100%; max-width: 100%; }

}

/* TEMPLATES....................................*/

/* first set fonts for templates .jfa-expand, .jfa-plaintext { color: #555; }

.jfaredflag {

   color: #333;
   text-transform: uppercase;
   font-weight: bold;

}

.jfanote {

   margin-bottom: 16px;
   margin-top: 16px;
   padding-right: 10px;
   padding-left: 14px;
   font-size: .9em;
   line-height: 1.4em;
   border-left: 1px solid gray;
   color: #98582a;

}

.jfastart, .jfaoutline-head, .jfaclipboard-head {

   margin-bottom:0px;
   margin-top: 0px;
   padding-right: 0px;
   padding-left: 0px;
   font-size: .8em;

}

.jfastart { font-style: italic; text-align: center; font-size: .95em; color: rgb(198, 93, 25); margin-bottom: 10px; }

/* Stop Expand/Collapse Crowding */ .mw-customtoggle, .mw-collapsible-toggle {

   margin-left: 10px;

}

/* for jfa-h4wrap template */ div#content h4.jfa-hwrap, div#content h4.jfa-hwrap + p {

   display: inline !important;
   font-family: "Ovo", sans-serif !important;
   color: #eac2b4 !important;

}

/* for jfa-hwrap template */ .jfa-hwrap {

   margin-top: -16px;

} .jfa-hwrap h1, .jfa-hwrap h2, .jfa-hwrap h3, .jfa-hwrap h4, .jfa-hwrap h5, .jfa-hwrap h6, .jfa-hwrap p {

   display: inline;

}

/* plain text expand, 2nd row */

1. jfa-factsheet-help {

   color: rgb(198, 93, 25) !important;
   font-size: .9em !important;
   font-style: italic !important;

}

1. jfa-share a:hover {

border-bottom: 1px #444; }