Difference between revisions of "Common.css"
From DelDOT CADD Wiki
(250 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
/* | /* Adding hook to Font Awesome --------------------------------------------------------------------*/ | ||
@import "https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"; | |||
/* Table of Contents modifications */ | /*---------------DCK Edits 11/15/2021---------------*/ | ||
.noautonum .tocnumber { display: none; } | /* Table of Contents modifications ---------------------------------------------------------------*/ | ||
#toc{ | |||
margin: 0; | |||
} | |||
.toctogglecheckbox:checked ~ ul { | |||
display: none; | |||
} | |||
@media print { | |||
.toctogglecheckbox:checked + .toctitle { | |||
display: none; | |||
} | |||
} | |||
@media screen { | |||
:not(:checked) > .toctogglecheckbox { | |||
display: inline !important; | |||
position: absolute; | |||
opacity: 0; | |||
z-index: -1; | |||
} | |||
.toctogglespan { | |||
font-size: 94%; | |||
} | |||
:not(:checked) > .toctogglespan:before { | |||
content: " ["; | |||
} | |||
:not(:checked) > .toctogglespan:after { | |||
content: "]"; | |||
} | |||
.toctogglelabel { | |||
cursor: pointer; | |||
color: #0645ad; | |||
} | |||
.toctogglelabel:hover { | |||
text-decoration: underline; | |||
} | |||
.toctogglecheckbox:focus + .toctitle .toctogglelabel { | |||
text-decoration: underline; | |||
outline: dotted 1px; | |||
outline: auto -webkit-focus-ring-color; | |||
} | |||
.toctogglecheckbox:checked + .toctitle .toctogglelabel:after { | |||
content: "show"; | |||
} | |||
.toctogglecheckbox:not(:checked) + .toctitle .toctogglelabel:after { | |||
content: "hide"; | |||
} | |||
.toc h2 { | |||
display: inline; | |||
/*border: 0; | |||
padding: 0; | |||
font-size: 100%; | |||
font-weight: bold;*/ | |||
} | |||
} | |||
.noautonum .tocnumber { | |||
display: none; | |||
} | |||
.cFloat { | .cFloat { | ||
position: fixed; | |||
right: 2em; | |||
top: 6em; | |||
background-color: #fff; | |||
z-index: 1; /*This keeps it above the Circles.*/ | |||
max-width: 700px; | |||
} | |||
.cFloat:not(:hover) { | |||
opacity: 0.65; | |||
} | |||
.cFloat:hover { | |||
opacity: 1.0; | |||
} | } | ||
.cFloat:not(:hover) { | @media (min-width:1200px) { | ||
.cFloat .toc:not(:hover) { | |||
opacity: 0.65; | |||
} | |||
.cFloat .toc:hover { | |||
opacity: 1.0; | |||
} | |||
} | |||
/*This will add scroll bars to the TOC based on the visible height of the window. ----------------*/ | |||
/*Figuring out how to get it to only do this when not collapsed was a bear -----------------------*/ | |||
@media only screen and (max-height: 800px) { | |||
.toctogglecheckbox:not(:checked) ~ ul { | |||
display: block; | |||
height:70vh; | |||
overflow: scroll; | |||
} | } | ||
} | } | ||
/*This will create a circle around the item.*/ | |||
.justthetip { | |||
height: 25px; | |||
width: 25px; | |||
background-color: #13548e; | |||
border-radius: 50%; | |||
display: inline-flex; | |||
justify-content: center; | |||
align-items: center; | |||
color: white; | |||
font-weight: bold; | |||
} | |||
.TMI { | |||
height: 25px; | |||
width: 25px; | |||
background-color: #555555; | |||
border-radius: 10%; | |||
display: inline-flex; | |||
justify-content: center; | |||
align-items: center; | |||
color: white; | |||
font-weight: bold; | |||
} | |||
.tooltip { | |||
position: relative; | |||
display: inline-block; | |||
background: none; | |||
width:auto; | |||
left: auto; | |||
padding: 0; | |||
z-index: auto; | |||
} | |||
.tooltipTMI { | |||
position: relative; | |||
display: inline-block; | |||
background: none; | |||
width:auto; | |||
left: auto; | |||
padding: 0; | |||
z-index: auto; | |||
} | |||
.tooltiptext{ | |||
z-index: 1; | |||
} | |||
.tooltip .tooltiptext { | |||
visibility: hidden; | |||
width: 300px; /*I don't like that this is static, but I've got bigger fish to fry */ | |||
background-color: #13548e; | |||
color: #fff; | |||
text-align: center; | |||
border-radius: 6px; | |||
padding: 10px; | |||
position: absolute; | |||
top: 120%; | |||
margin-left: -162px; | |||
z-index: 1; | |||
} | |||
.tooltipTMI .tooltiptext { | |||
visibility: hidden; | |||
width: 300px; /*I don't like that this is static, but I've got bigger fish to fry */ | |||
background-color: #555555; | |||
color: #fff; | |||
text-align: center; | |||
border-radius: 6px; | |||
padding: 10px; | |||
position: absolute; | |||
top: 120%; | |||
margin-left: -162px; | |||
z-index: 1; | |||
} | |||
.tooltip .tooltiptext::after { | |||
content: ""; | |||
position: absolute; | |||
bottom: 100%; | |||
margin-left: -5px; | |||
border-width: 5px 5px 5px 5px; | |||
left: 50%; | |||
border-style: solid; | |||
border-color: transparent transparent #004684 transparent; | |||
} | |||
/*This is the little triangle */ | |||
.tooltipTMI .tooltiptext::after { | |||
content: ""; | |||
position: absolute; | |||
bottom: 100%; | |||
margin-left: -5px; | |||
border-width: 5px 5px 5px 5px; | |||
left: 50%; | |||
border-style: solid; | |||
border-color: transparent transparent #555555 transparent; | |||
} | |||
.tooltip:hover .tooltiptext { | |||
visibility: visible; | |||
/*This causes the tooltip window to be on top of everything else, since it temporary.*/ | |||
z-index: 1; | |||
} | |||
.tooltipTMI:hover .tooltiptext { | |||
visibility: visible; | |||
/*This causes the tooltip window to be on top of everything else, since it temporary.*/ | |||
z-index: 1; | |||
} | |||
/*---------------DCK Edits 11/15/2021---------------*/ | |||
/* CSS placed here will be applied to all skins --------------------------------------------------*/ | |||
/* Color values used on this site. ---------------------------------------------------------------*/ | |||
/* | |||
Black = #000 | |||
White = #fff | |||
Red = #ff0000 | |||
Blue = #2d5296 | |||
Orange = #fa6c34 | |||
Light Grey = #ededed (Table Background Color) | |||
*/ | |||
/* Sets the width of the content on the Foreground Skin ------------------------------------------*/ | |||
.row { | |||
max-width: 80%; | |||
} | |||
/* Navigation Container Settings -----------------------------------------------------------------*/ | |||
nav.top-bar, | |||
.top-bar.expanded .title-area { | |||
background: #2d5296; | |||
} | |||
#navwrapper { | |||
background: #2d5296; | |||
} | |||
#top-bar-left li, | |||
#top-bar-left li a { | |||
background: #2d5296; | |||
border: 1px solid #2d5296; | |||
} | |||
#top-bar-right li, | |||
#top-bar-right li a { | |||
background: #2d5296; | |||
} | |||
#top-bar-left li:hover, | |||
#top-bar-left li a:hover, | |||
#top-bar-right li:hover:not(.has-form), | |||
#top-bar-right li a:hover { | |||
background: #fa6c34; | |||
color: #fff; | |||
} | |||
.page-Main_Page #firstHeading { | |||
display: none; | |||
} | |||
#tagline { | |||
display: none; | |||
} | |||
#editform, #toolbar, #wpTextbox1 { | |||
width: 100%; | |||
} | |||
.top-bar-section .has-dropdown > a:hover:after { | |||
border-color: #fa6c34 transparent transparent transparent; | |||
} | |||
.top-bar-section .has-dropdown > a:hover:after { | |||
border-color: #fff transparent transparent transparent; | |||
} | |||
/* Back to Top Button Settings ------------------------------------------------------------------*/ | |||
.noprint { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 1.0em; | |||
color: #2d5296; | |||
background-color: #fff; | |||
position: fixed; | |||
bottom: 2.0%; | |||
left: 0.5%; | |||
padding: 0; | |||
margin: 0%; | |||
} | |||
/* Change the body font-family for entire site. */ | /* Change the body font-family for entire site. -------------------------------------------------*/ | ||
body { | body { | ||
font-family: | font-family: "Open Sans", sans-serif; | ||
font-size: 1.0em; | |||
color: #000; | |||
} | |||
p { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 1.0em; | |||
color: #000; | |||
margin: 0 0 1.0em 0; | |||
line-height: 1.5em; | |||
} | |||
#p_white { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 1.0em; | |||
color: #fff; | |||
margin: 0 0 1.0em 0; | |||
line-height: 1.5em; | |||
} | |||
.note_black { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 1.0em; | |||
color: #000; | |||
background-color: #E8E8E8; | |||
border: 2px solid #000; | |||
padding: 1em | |||
} | |||
.note_green { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 1.0em; | |||
color: green; | |||
background-color: #E8E8E8; | |||
border: 2px solid #000; | |||
padding: 1em | |||
} | |||
.note_red { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 1.0em; | |||
color: red; | |||
background-color: #E8E8E8; | |||
border: 2px solid #000; | |||
padding: 1em | |||
} | |||
.image_center{ | |||
margin: 0; | |||
padding: 0; | |||
color: #ff0000; | |||
text-align: center; | |||
} | } | ||
#engineering_scale { | |||
width: 45%; | |||
float:left; | |||
box-sizing: border-box; | |||
} | |||
#architectural_scale { | |||
width: 45%; | |||
float:right; | |||
box-sizing: border-box; | |||
clear: right; | |||
} | } | ||
. | .clear_float { | ||
clear: both; | |||
} | } | ||
.main_page { | |||
border: 1px solid #2d5296; | |||
} | |||
#welcome_main { | |||
color: #ffffff; | |||
background-color: #fa6c34; | |||
border-left: 20px solid #2d5296; | |||
padding: 10px; | |||
text-transform: uppercase; | |||
} | |||
/* Hiding categories at the bottom of each page. -------------------------------------------------*/ | |||
.catlinks { display: none; } | |||
/* Headers - For Use Inside of MediaWiki Table of Contents ---------------------------------------*/ | |||
#firstHeading.title { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 2.3em; | |||
color: #fff; | |||
background-color: #fa6c34; | |||
line-height: 1.60em; | |||
border-left: 20px solid #2d5296; | |||
padding-left: 10px; | |||
text-transform: uppercase; | |||
} | |||
h1 { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 2.0em; | |||
color: #2d5296; | |||
} | |||
h2 { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 1.8em; | |||
color: #2d5296; | |||
margin-top: 1.8em; | |||
border-bottom: 1px solid #2d5296; | |||
} | |||
h2.first_on_page { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 1.8em; | |||
color: #2d5296; | |||
margin-top: 1.0em; | |||
border-bottom: 1px solid #2d5296; | |||
} | |||
h3 { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 1.2em; | |||
color: #2d5296; | |||
margin-top: 1.2em; | |||
font-weight: bold; | |||
/*text-decoration: underline;*/ | |||
} | |||
h4 { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 1.1em; | |||
color: #2d5296; | |||
} | |||
h5 { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 1.0em; | |||
color: #2d5296; | |||
} | |||
h6 { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 0.9em; | |||
color: #2d5296; | |||
} | |||
/* Header - For use Outside of MediaWiki Table of Contents ---------------------------------------*/ | |||
.h1_outtoc { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 2.0em; | |||
color: #2d5296; | |||
} | |||
.h2_outtoc { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 1.8em; | |||
color: #2d5296; | |||
margin-top: 1.8em; | |||
border-bottom: 1px solid #2d5296; | |||
} | |||
h2.outtoc_first_on_page { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 1.8em; | |||
color: #2d5296; | |||
margin-top: 1.0em; | |||
border-bottom: 1px solid #2d5296; | |||
} | |||
.h3_outtoc { | |||
font-family: "Open Sans", sans-serif; | |||
/*font-size: 1.6em;*/ | |||
font-size: 1.2em; | |||
color: #2d5296; | |||
/*border-bottom: 1px solid #2d5296; */ | |||
} | |||
.h4_outtoc { | |||
font-family: "Open Sans", sans-serif; | |||
/*font-size: 1.4em;*/ | |||
font-size: 1.1em; | |||
color: #2d5296; | |||
} | |||
.h5_outtoc { | |||
font-family: "Open Sans", sans-serif; | |||
/*font-size: 1.2em;*/ | |||
font-size: 1.0em; | |||
color: #2d5296; | |||
} | |||
.h6_outtoc { | |||
font-family: "Open Sans", sans-serif; | |||
/*font-size: 1.0em;*/ | |||
font-size: 0.9em; | |||
color: #2d5296; | |||
} | |||
/* Headers - For Use With Manual Type Wiki Pages -------------------------------------------------*/ | |||
h2.manual { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 1.8em; | |||
color: #2d5296; | |||
margin-top: 3.6em; | |||
border-bottom: 1px solid #2d5296; | |||
} | |||
h3.manual { | |||
font-family: "Open Sans", sans-serif; | |||
font-size: 1.2em; | |||
color: #2d5296; | |||
margin-top: 2.0em; | |||
font-weight: bold; | |||
text-decoration: underline; | |||
} | |||
/* Alerts or Warnings text settings---------------------------------------------------------------*/ | |||
.warning_red{ | |||
color: #ff0000; | |||
font-size: 20px; | |||
text-decoration: underline; | |||
} | |||
/* Class for adding margin-bottom to tags requiring addition bottom offsets, such as <li> --------*/ | |||
li.page_content { | |||
margin-bottom: 1.25em; | |||
} | |||
li.page_content_1-1 { | |||
margin-bottom: 1.0em; | |||
} | |||
ul.ul_proper_spacing { | |||
margin: 0 0 0 2.0em; | |||
} | |||
/* CSS for Links ---------------------------------------------------------------------------------*/ | |||
/* A link that has not been visited */ | /* A link that has not been visited */ | ||
a:link { | a:link { | ||
color: blue; | color: blue; | ||
} | } | ||
/* A link that has been visited */ | /* A link that has been visited */ | ||
a:visited { | a:visited { | ||
color: blue; | color: blue; | ||
} | } | ||
/* A link that is hovered on */ | /* A link that is hovered on */ | ||
a:hover { | a:hover { | ||
color: red; | color: red; | ||
} | } | ||
/* A link that is selected */ | /* A link that is selected */ | ||
a:active { | a:active { | ||
Line 65: | Line 563: | ||
} | } | ||
/* -----------------------------------------------------*/ | /* Indentation Settings -------------------------------------------------------------------------*/ | ||
.tab { | |||
margin-left: 25px; | |||
} | |||
.tab0 { | |||
margin-left: 0px; | |||
} | |||
.tab1 { | |||
margin-left: 25px; | |||
} | |||
.tab2 { | |||
margin-left:25px; | |||
} | |||
.tab3 { | |||
margin-left: 25px; | |||
} | |||
.tab4 { | |||
margin-left: 25px; | |||
} | |||
/* Style the button that is used to open and close the collapsible content -----------------------*/ | |||
.collapsible { | |||
background-color: #fa6c34; | |||
color: #fff; | |||
cursor: pointer; | |||
padding: 18px; | |||
width: 100%; | |||
border: none; | |||
text-align: left; | |||
outline: none; | |||
font-size: 15px; | |||
} | |||
/* Add a background color to the button if it is clicked on --------------------------------------*/ | |||
/* Add the .active class with JS, and when you move the mouse over it (hover) --------------------*/ | |||
.active, .collapsible:hover { | |||
background-color: #ccc; | |||
} | |||
/* Style the collapsible content. Note: hidden by default */ | |||
.content { | |||
padding: 0 18px; | |||
display: none; | |||
overflow: hidden; | |||
background-color: #f1f1f1; | |||
} | |||
/* DelDOT Table Settings -------------------------------------------------------------------------*/ | |||
.deldot_table { | |||
color: #000; | |||
background-color: #ededed; | |||
margin: 1em 0; | |||
border: 1px solid #2d5296; | |||
border-collapse: collapse; | |||
} | |||
table.deldot_table > * > tr > th, | |||
table.deldot_table > * > tr > td { | |||
border: 1px solid #2d5296; | |||
} | |||
table.deldot_table > * > tr > th { | |||
color: #fff; | |||
background-color: #2d5296; | |||
text-align: center; | |||
} | |||
table.deldot_table * ul { | |||
padding: 0; | |||
margin: 0; | |||
} | |||
table.deldot_table * li { | |||
padding: 5px 0 ; | |||
margin: 0; | |||
} | |||
table.deldot_table * th, | |||
table.deldot_table * td { | |||
padding: 10px; | |||
} | |||
table.deldot_table * ul, | |||
table.deldot_table * ol { | |||
margin: 0 0 0 30px; | |||
} |
Latest revision as of 14:28, 4 April 2024
/* Adding hook to Font Awesome --------------------------------------------------------------------*/ @import "https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"; /*---------------DCK Edits 11/15/2021---------------*/ /* Table of Contents modifications ---------------------------------------------------------------*/ #toc{ margin: 0; } .toctogglecheckbox:checked ~ ul { display: none; } @media print { .toctogglecheckbox:checked + .toctitle { display: none; } } @media screen { :not(:checked) > .toctogglecheckbox { display: inline !important; position: absolute; opacity: 0; z-index: -1; } .toctogglespan { font-size: 94%; } :not(:checked) > .toctogglespan:before { content: " ["; } :not(:checked) > .toctogglespan:after { content: "]"; } .toctogglelabel { cursor: pointer; color: #0645ad; } .toctogglelabel:hover { text-decoration: underline; } .toctogglecheckbox:focus + .toctitle .toctogglelabel { text-decoration: underline; outline: dotted 1px; outline: auto -webkit-focus-ring-color; } .toctogglecheckbox:checked + .toctitle .toctogglelabel:after { content: "show"; } .toctogglecheckbox:not(:checked) + .toctitle .toctogglelabel:after { content: "hide"; } .toc h2 { display: inline; /*border: 0; padding: 0; font-size: 100%; font-weight: bold;*/ } } .noautonum .tocnumber { display: none; } .cFloat { position: fixed; right: 2em; top: 6em; background-color: #fff; z-index: 1; /*This keeps it above the Circles.*/ max-width: 700px; } .cFloat:not(:hover) { opacity: 0.65; } .cFloat:hover { opacity: 1.0; } @media (min-width:1200px) { .cFloat .toc:not(:hover) { opacity: 0.65; } .cFloat .toc:hover { opacity: 1.0; } } /*This will add scroll bars to the TOC based on the visible height of the window. ----------------*/ /*Figuring out how to get it to only do this when not collapsed was a bear -----------------------*/ @media only screen and (max-height: 800px) { .toctogglecheckbox:not(:checked) ~ ul { display: block; height:70vh; overflow: scroll; } } /*This will create a circle around the item.*/ .justthetip { height: 25px; width: 25px; background-color: #13548e; border-radius: 50%; display: inline-flex; justify-content: center; align-items: center; color: white; font-weight: bold; } .TMI { height: 25px; width: 25px; background-color: #555555; border-radius: 10%; display: inline-flex; justify-content: center; align-items: center; color: white; font-weight: bold; } .tooltip { position: relative; display: inline-block; background: none; width:auto; left: auto; padding: 0; z-index: auto; } .tooltipTMI { position: relative; display: inline-block; background: none; width:auto; left: auto; padding: 0; z-index: auto; } .tooltiptext{ z-index: 1; } .tooltip .tooltiptext { visibility: hidden; width: 300px; /*I don't like that this is static, but I've got bigger fish to fry */ background-color: #13548e; color: #fff; text-align: center; border-radius: 6px; padding: 10px; position: absolute; top: 120%; margin-left: -162px; z-index: 1; } .tooltipTMI .tooltiptext { visibility: hidden; width: 300px; /*I don't like that this is static, but I've got bigger fish to fry */ background-color: #555555; color: #fff; text-align: center; border-radius: 6px; padding: 10px; position: absolute; top: 120%; margin-left: -162px; z-index: 1; } .tooltip .tooltiptext::after { content: ""; position: absolute; bottom: 100%; margin-left: -5px; border-width: 5px 5px 5px 5px; left: 50%; border-style: solid; border-color: transparent transparent #004684 transparent; } /*This is the little triangle */ .tooltipTMI .tooltiptext::after { content: ""; position: absolute; bottom: 100%; margin-left: -5px; border-width: 5px 5px 5px 5px; left: 50%; border-style: solid; border-color: transparent transparent #555555 transparent; } .tooltip:hover .tooltiptext { visibility: visible; /*This causes the tooltip window to be on top of everything else, since it temporary.*/ z-index: 1; } .tooltipTMI:hover .tooltiptext { visibility: visible; /*This causes the tooltip window to be on top of everything else, since it temporary.*/ z-index: 1; } /*---------------DCK Edits 11/15/2021---------------*/ /* CSS placed here will be applied to all skins --------------------------------------------------*/ /* Color values used on this site. ---------------------------------------------------------------*/ /* Black = #000 White = #fff Red = #ff0000 Blue = #2d5296 Orange = #fa6c34 Light Grey = #ededed (Table Background Color) */ /* Sets the width of the content on the Foreground Skin ------------------------------------------*/ .row { max-width: 80%; } /* Navigation Container Settings -----------------------------------------------------------------*/ nav.top-bar, .top-bar.expanded .title-area { background: #2d5296; } #navwrapper { background: #2d5296; } #top-bar-left li, #top-bar-left li a { background: #2d5296; border: 1px solid #2d5296; } #top-bar-right li, #top-bar-right li a { background: #2d5296; } #top-bar-left li:hover, #top-bar-left li a:hover, #top-bar-right li:hover:not(.has-form), #top-bar-right li a:hover { background: #fa6c34; color: #fff; } .page-Main_Page #firstHeading { display: none; } #tagline { display: none; } #editform, #toolbar, #wpTextbox1 { width: 100%; } .top-bar-section .has-dropdown > a:hover:after { border-color: #fa6c34 transparent transparent transparent; } .top-bar-section .has-dropdown > a:hover:after { border-color: #fff transparent transparent transparent; } /* Back to Top Button Settings ------------------------------------------------------------------*/ .noprint { font-family: "Open Sans", sans-serif; font-size: 1.0em; color: #2d5296; background-color: #fff; position: fixed; bottom: 2.0%; left: 0.5%; padding: 0; margin: 0%; } /* Change the body font-family for entire site. -------------------------------------------------*/ body { font-family: "Open Sans", sans-serif; font-size: 1.0em; color: #000; } p { font-family: "Open Sans", sans-serif; font-size: 1.0em; color: #000; margin: 0 0 1.0em 0; line-height: 1.5em; } #p_white { font-family: "Open Sans", sans-serif; font-size: 1.0em; color: #fff; margin: 0 0 1.0em 0; line-height: 1.5em; } .note_black { font-family: "Open Sans", sans-serif; font-size: 1.0em; color: #000; background-color: #E8E8E8; border: 2px solid #000; padding: 1em } .note_green { font-family: "Open Sans", sans-serif; font-size: 1.0em; color: green; background-color: #E8E8E8; border: 2px solid #000; padding: 1em } .note_red { font-family: "Open Sans", sans-serif; font-size: 1.0em; color: red; background-color: #E8E8E8; border: 2px solid #000; padding: 1em } .image_center{ margin: 0; padding: 0; color: #ff0000; text-align: center; } #engineering_scale { width: 45%; float:left; box-sizing: border-box; } #architectural_scale { width: 45%; float:right; box-sizing: border-box; clear: right; } .clear_float { clear: both; } .main_page { border: 1px solid #2d5296; } #welcome_main { color: #ffffff; background-color: #fa6c34; border-left: 20px solid #2d5296; padding: 10px; text-transform: uppercase; } /* Hiding categories at the bottom of each page. -------------------------------------------------*/ .catlinks { display: none; } /* Headers - For Use Inside of MediaWiki Table of Contents ---------------------------------------*/ #firstHeading.title { font-family: "Open Sans", sans-serif; font-size: 2.3em; color: #fff; background-color: #fa6c34; line-height: 1.60em; border-left: 20px solid #2d5296; padding-left: 10px; text-transform: uppercase; } h1 { font-family: "Open Sans", sans-serif; font-size: 2.0em; color: #2d5296; } h2 { font-family: "Open Sans", sans-serif; font-size: 1.8em; color: #2d5296; margin-top: 1.8em; border-bottom: 1px solid #2d5296; } h2.first_on_page { font-family: "Open Sans", sans-serif; font-size: 1.8em; color: #2d5296; margin-top: 1.0em; border-bottom: 1px solid #2d5296; } h3 { font-family: "Open Sans", sans-serif; font-size: 1.2em; color: #2d5296; margin-top: 1.2em; font-weight: bold; /*text-decoration: underline;*/ } h4 { font-family: "Open Sans", sans-serif; font-size: 1.1em; color: #2d5296; } h5 { font-family: "Open Sans", sans-serif; font-size: 1.0em; color: #2d5296; } h6 { font-family: "Open Sans", sans-serif; font-size: 0.9em; color: #2d5296; } /* Header - For use Outside of MediaWiki Table of Contents ---------------------------------------*/ .h1_outtoc { font-family: "Open Sans", sans-serif; font-size: 2.0em; color: #2d5296; } .h2_outtoc { font-family: "Open Sans", sans-serif; font-size: 1.8em; color: #2d5296; margin-top: 1.8em; border-bottom: 1px solid #2d5296; } h2.outtoc_first_on_page { font-family: "Open Sans", sans-serif; font-size: 1.8em; color: #2d5296; margin-top: 1.0em; border-bottom: 1px solid #2d5296; } .h3_outtoc { font-family: "Open Sans", sans-serif; /*font-size: 1.6em;*/ font-size: 1.2em; color: #2d5296; /*border-bottom: 1px solid #2d5296; */ } .h4_outtoc { font-family: "Open Sans", sans-serif; /*font-size: 1.4em;*/ font-size: 1.1em; color: #2d5296; } .h5_outtoc { font-family: "Open Sans", sans-serif; /*font-size: 1.2em;*/ font-size: 1.0em; color: #2d5296; } .h6_outtoc { font-family: "Open Sans", sans-serif; /*font-size: 1.0em;*/ font-size: 0.9em; color: #2d5296; } /* Headers - For Use With Manual Type Wiki Pages -------------------------------------------------*/ h2.manual { font-family: "Open Sans", sans-serif; font-size: 1.8em; color: #2d5296; margin-top: 3.6em; border-bottom: 1px solid #2d5296; } h3.manual { font-family: "Open Sans", sans-serif; font-size: 1.2em; color: #2d5296; margin-top: 2.0em; font-weight: bold; text-decoration: underline; } /* Alerts or Warnings text settings---------------------------------------------------------------*/ .warning_red{ color: #ff0000; font-size: 20px; text-decoration: underline; } /* Class for adding margin-bottom to tags requiring addition bottom offsets, such as <li> --------*/ li.page_content { margin-bottom: 1.25em; } li.page_content_1-1 { margin-bottom: 1.0em; } ul.ul_proper_spacing { margin: 0 0 0 2.0em; } /* CSS for Links ---------------------------------------------------------------------------------*/ /* A link that has not been visited */ a:link { color: blue; } /* A link that has been visited */ a:visited { color: blue; } /* A link that is hovered on */ a:hover { color: red; } /* A link that is selected */ a:active { color: green; } /* Indentation Settings -------------------------------------------------------------------------*/ .tab { margin-left: 25px; } .tab0 { margin-left: 0px; } .tab1 { margin-left: 25px; } .tab2 { margin-left:25px; } .tab3 { margin-left: 25px; } .tab4 { margin-left: 25px; } /* Style the button that is used to open and close the collapsible content -----------------------*/ .collapsible { background-color: #fa6c34; color: #fff; cursor: pointer; padding: 18px; width: 100%; border: none; text-align: left; outline: none; font-size: 15px; } /* Add a background color to the button if it is clicked on --------------------------------------*/ /* Add the .active class with JS, and when you move the mouse over it (hover) --------------------*/ .active, .collapsible:hover { background-color: #ccc; } /* Style the collapsible content. Note: hidden by default */ .content { padding: 0 18px; display: none; overflow: hidden; background-color: #f1f1f1; } /* DelDOT Table Settings -------------------------------------------------------------------------*/ .deldot_table { color: #000; background-color: #ededed; margin: 1em 0; border: 1px solid #2d5296; border-collapse: collapse; } table.deldot_table > * > tr > th, table.deldot_table > * > tr > td { border: 1px solid #2d5296; } table.deldot_table > * > tr > th { color: #fff; background-color: #2d5296; text-align: center; } table.deldot_table * ul { padding: 0; margin: 0; } table.deldot_table * li { padding: 5px 0 ; margin: 0; } table.deldot_table * th, table.deldot_table * td { padding: 10px; } table.deldot_table * ul, table.deldot_table * ol { margin: 0 0 0 30px; }