/*
Theme Name: DoDHBCUMIOpportunities.com 2024
Version: 1.0
Description: A dedicated HTML5/CSS3 theme built by Chitra and based on the HTML 5 Boilerplate by Aaron T. Grogg.
Author: Chitre
Author URI: https://chitraproductions.com/
This CSS file is a concatenation of style.css from HTML5 Boilerplate and style.css from Starkers.
Other formulas are credited in context.
*/
/* ==|== IMPORT WEBFONTS, ETC. ================================================= */
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&family=Oswald:wght@300;400&display=swap');
/* ==|== NORMALIZE ============================================================= */
/* --- HTML5 display definitions ---------- */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block}
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1}
audio:not([controls]) { display: none}
[hidden] { display: none}
/* --- Clean & Reset ---------- */
html{margin:0;border:0}
*,::before,::after{box-sizing:border-box}
*{margin:0}
body{line-height:1.5}
img,picture,video,canvas,svg{display:block;max-width:100%}
input,button,textarea,select{font:inherit}
p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}
#root,#__next{isolation:isolate}
/* =============================================================================
1140px Grid V2 by Andy Taylor | http://cssgrid.net
http://www.twitter.com/andytlr | http://www.andytlr.com
DON'T EDIT THIS SECTION.
========================================================================== */
.container{/*padding-left:20px;padding-right:20px*/}
.row{width:100%;max-width:1400px;min-width:755px;margin:0 auto;/*overflow:hidden*/}
.onecol,.twocol,.threecol,.fourcol,.fivecol,.sixcol,.sevencol,.eightcol,.ninecol,.tencol,.elevencol{margin-right:3.8%;float:left;min-height:1px}
.row .onecol{width:4.85%}
.row .twocol{width:13.45%}
.row .threecol{width:22.05%}
.row .fourcol{width:30.75%}
.row .fivecol{width:39.45%}
.row .sixcol{width:48%}
.row .sevencol{width:56.75%}
.row .eightcol{width:65.4%}
.row .ninecol{width:74.05%}
.row .tencol{width:82.7%}
.row .elevencol{width:91.35%}
.row .twelvecol{width:100%;float:left}
.last{margin-right:0px}
/* --- Hide mobile-only elements ---------- */
.jumpnav { display:none}
/* ==|== BASE TYPOGRAPHY ========================================================= */
body {color: #000;font-weight: 400; font-size: 17px; font-family:'Lato',Arial,sans-serif}
#wrap { line-height: 1.5em}
h1, h2, h3, h4, h5, h6 {margin: 0 0 10px 0;font-weight: 400;font-family:'Oswald',"Franklin Gothic Medium Condensed",Arial,sans-serif}
h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child {margin-top:0}
/* Font sizes, colors, and line-heights */
h1 { color: #355E93;font-size: 1.95em;line-height:1.25em}
h2 { color: #717171;font-size: 1.5em}
h3 { color: #555;font-size: 1.2em}
h4 { color: #555;font-size: 1em}
h5 { color: #555;font-size: 1em}
h6 { color: #555;font-size: 1em}
p, caption, td, th, dd, dt, pre, code, address { margin-top: 0; margin-bottom: 12px;line-height: 1.6em}
/* Lists and stuff */
ul { margin: 0 0 10px 0 }
ol { margin: 0 0 10px 8px}
li { margin: 0; list-style-position: outside; font-size: 18px; /* declared explicitly to avoid nesting bugs */}
li li {margin: 0 0 0 18px} /* pad nested list items */
dt { font-weight: bold}
dd { margin: 0 0 10px 0; padding-left: 10px; font-style: italic}
/* Tables */
table { border-width: 1px; border-style: solid; border-color: #b3b3b3; border-right-style: none}
th { padding: 2px 10px; border-right-width: 1px; border-right-style: solid; border-right-color: #CCC; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #CCC; background-color: #EEE}
td { padding: 2px 10px; border-right-width: 1px; border-right-style: solid; border-right-color: #CCC; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #CCC}
caption { text-align: left; font-style: italic}
/* Other blocks of content */
blockquote { margin-left: 40px; line-height: 1em}
blockquote p { line-height: 1.5em}
pre { display: block; margin: 0 0 10px 0; color: #666}
/* Misc html elements */
del {color: #999}
ins {font-style: italic}
/* Specialized elements */
.osbold{font-weight:400}
h1.h1white{color:#fff;padding-top:36px}
h1 .subhead1{display:block;color:#728fb4;font-size:.572em;line-height:1em}
.bigdetails{font-size:110%}
p.smitalix{font-size:80%;font-style:italic}
.widget-title{margin: 0 0 10px 0; color:#254267;font-size: 1.5em;font-weight: 400;font-family:'Oswald',"Franklin Gothic Medium Condensed",Arial,sans-serif}
.post-title{text-transform:uppercase}
.post-title-main{text-transform:uppercase;border-top:2px solid #355E93;border-bottom:2px solid #355E93;padding:6px 0}
.dod-title span{text-transform:lowercase !important}
.more-link{display:inline-block;margin-left:6px;text-transform:uppercase;font-size:.8em;font-weight:800}
h2.excerpt-head{font-size: 1.35em}
.home-older-announce{background-color:#254267;color:#ebeff5;font-size:2em;text-transform:uppercase;margin:60px 0 -10px 0;padding:10px;font-weight:400;font-family:'Oswald',"Franklin Gothic Medium Condensed",Arial,sans-serif}
.title-404{color:#800}
.subhead-404{color:#b86666 !important}
/* ==|== PRIMARY STYLES ========================================================== */
/* Globals */
body {width:100%;max-width:1400px;margin:0 auto;background:#adadad;}
a {color:#355e93;text-decoration:none}
a:active, a:focus, a:hover {color:#728fb4}
hr {clear:both;margin-top:10px;margin-bottom:10px;border: 0;border-bottom: 1px dotted #fff; background: #bbb; }
.right-column hr {border-bottom: 1px dotted #bbb; background: #e0e1e1; }
hr:after { clear: both}
.clearfloat{clear:both;height:1px !important}
/* Structure */
#wrap { margin:0 auto;min-height:100%;width:1400px;background:#fff}
#content { position: relative;top:0;left:0;overflow:auto;padding:30px}
#maincontent{background:#fff;padding:10px 30px 30px 30px}
#listholder{float:right;margin-left:30px;width:400px}
#listholder2{display:none}
/* Header */
header {position:relative;display:block;width:100%}
.logo{float:left}
#topbar{background:#254267;padding:19px 30px;text-align:right;box-sizing:border-box}
#introbar{background:#beccdd;padding:30px;box-sizing:border-box;font-family:'Oswald','Franklin Gothic Medium Condensed',Arial,sans-serif;color:#141414;font-size:1.25em;line-height:1.5em;font-weight:300}
/* Navigation */
/* Banners Images */
#banner { background-image: url(images/banner-default.jpg); }
/* Homepage */
.oneopp{margin-bottom:50px}
.nextopp{border-top:2px solid #717171;padding-top:40px}
/* Content */
.single-date{text-transform:uppercase;border-top:2px solid #355E93;border-bottom:2px solid #355E93;padding:6px 0;font-size:.688em}
/*.single-date{display:block;background:#728fb4;color:#fff;font-weight:800;padding:8px;border-radius:6px;line-height:1em;letter-spacing:.15em; font-size:.688em;text-transform:uppercase}*/
.post-tag-chiclets ul{list-style-type:none;padding:10px 0 0 0;margin:50px 0 0 0;border-top:1px solid #bbb}
.post-tag-chiclets ul li{display:inline-block;margin-left:12px}
.post-tag-chiclets ul li:first-child{margin-left:0}
.post-tag-chiclets ul li a{display:block;background:#728fb4;color:#FFF;padding:8px;border-radius:6px;line-height:1em;letter-spacing:.15em; font-size:.688em;text-transform:uppercase}
.post-tag-chiclets ul li a:focus, .post-tag-chiclets ul li a:hover{background:#355e93;color:#fff}
.post-tag-chiclets ul li a:active{background:#254267;color:#fff}
.excerpt {border-top:2px solid #888;padding-top:24px;margin-top:24px}
.home-older-announce + .excerpt{border-top:0 !important}
.catposttime{display:inline-block;background:#c7d2e1;color:#333;padding:4px 8px;border-radius:4px;line-height:1em;letter-spacing:.05em; font-weight:700; font-size:.688em;text-transform:uppercase;margin-right:6px}
p.registerbutton{margin:20px 0}
.registerbutton a{background:#355e93;color:#FFF;padding:8px 12px;border-radius:6px;line-height:1em;letter-spacing:.05em;text-transform:uppercase;font-weight:800;width:auto}
.registerbutton a:focus, .registerbutton a:hover{background:#aebfd4;color:#444}
.registerbutton a:active{background:#254267;color:#fff}
/* Sidebar */
ul.xoxo,ul.xoxo ul{list-style-type:none;padding:0;margin:0}
ul.xoxo ul li{margin-left:0}
#block-10{background:#ebebeb;border-radius:12px;padding:20px;margin-bottom:20px}
#block-11{background:#dfebf9;border-radius:12px;padding:20px;margin-bottom:20px}
/* Footer */
footer {position:relative;background:#254267}
footer p{color:#fff}
#footer-mid-info p a,#footer-mid-info p a:visited {color:#aebfd4}
#footer-mid-info p a:active, #footer-mid-info p a:focus, #footer-mid-info p a:hover {color: #ebebeb}
.footercol{padding:16px 30px}
#footer-right-logo{text-align:right !important}
#footer-mid-info p{margin-top:10px;text-align:center !important}
#footer-left-logo{text-align:left !important}
.footer-seal{max-width:120px;height:auto}
.helptext{display:inline-block;color:#fff;margin:0px 16px 16px 0px}
.helpphone{margin-top:20px}
.copyright {display:block;margin-top:16px;color: #bbb;text-transform:uppercase;letter-spacing:.25em; font-size:.688em;text-align: center;padding:0px 30px}
p.dodseal{text-align:center;margin-top:60px}
p.dodseal img{max-width:200px;height:auto}
/* Images */
.postarea .aligncenter {display:block; margin:0 auto}
.postarea .alignleft {float:left;margin:0 15px 15px 0;clear:left}
.postarea .alignright {float:right;margin:0 0 15px 15px;clear:right}
.photo{max-width:100%;height:auto;margin:12px 0}
.photo-badge{float: left;margin: 0 25px 15px 0;clear:left;max-width:225px;height:auto}
.photo-thumbnail{max-width:125px;clear:left;float:left;margin:0 15px 15px 0}
.wp-caption {display:none}
.wp-caption-text{ }
.gallery-caption{ }
.bypostauthor{ }
.sticky{ }
.pdfdownload{line-height:1.8em}
.pdfdownload:after{clear:both}
.pdficon{float:left;margin-right:10px;max-width:28px;height:auto}
/* Galleries
.gallery {margin-left:20px}
.gallery-item {float:left;margin: 0 10px 15px 0}
.gallery-item img {width:125px;}
.gallery-item a {display:block;border: 1px solid #aaa; -webkit-border-radius: 6px;
-moz-border-radius: 6px; border-radius: 6px;background-color:#aaa; -ms-border-radius: 6px; -o-border-radius: 6px}
.gallery-item a:hover {margin-top:-1px;margin-left:-1px}
.gallery-item img:hover { -webkit-box-shadow: 3px 3px 6px 0px rgba(0, 0, 0, .5);box-shadow: 3px 3px 6px 0px rgba(0, 0, 0, .5)}
.gallery br {display:none} */
/* Forms */
label {}
#gform_widget-2{background:#ebeff5;border-radius:12px;padding:20px;margin-bottom:20px}
#gform_wrapper_1 .gform_heading,#gform_wrapper_1 .gfield_label,#gform_wrapper_1 label {display:none !important}
#field_1_3 p{margin-bottom:0px}
#gform_submit_button_1{background:#254267;color:#fff;text-transform:uppercase;padding:6px}
#gform_submit_button_1:hover{background:#355e93}
#gform_submit_button_1:active{background:#15263b}
#gform_wrapper_1 .gform_footer{padding-bottom:0 !important}
/* Special Elements and Callouts */
.special{color:#fff;display:inline-block;padding:0px 10px;background:#355e93;-webkit-border-radius: 8px;border-radius: 8px;font-size:94%}
.follow-holder{background-color:#fff;padding:0 30px 0 0;margin:0}
/* ==|== DoD IHE EVENT CUSTOM STYLES ========================================= */
/* Header Block */
.header-block {
display: flex;
justify-content: space-between;
align-items: center;
padding: 20px;
background-color: #ffffff;
border-bottom: 1px solid #ccc;
}
.header-logo img {
max-height: 80px;
}
.header-date-location {
text-align: right;
font-size: 1.5em;
font-weight: bold;
}
/* Section Titles */
.section-title {
font-size: 1.8em;
font-weight: bold;
margin-top: 40px;
margin-bottom: 17px;
}
/* Main Content Area */
.main-content {
background: #ffffff;
padding: 40px;
}
/* Adjust spacing between bullet points */
ul li {
margin-bottom: 12px;
}
/* Ensure all links in colored sections are black and underlined */
.blue-section a,
.dod-blue-section a,
.steel-blue-section a,
.grey-section a,
.footer-section a {
color: #000 !important;
text-decoration: underline;
}
.blue-section a:hover,
.dod-blue-section a:hover,
.steel-blue-section a:hover,
.grey-section a:hover,
.footer-section a:hover {
color: #000 !important;
text-decoration: underline;
}
/* Event Schdule */
.event-list {
margin-top: 30px;
margin-left: 20px;
padding-left: 20px;
border-left: 2px solid #ffffff;
}
.event {
position: relative;
padding-left: 2rem;
padding-bottom: 2rem;
border-left: 2px solid #ffffff;
margin-left: 1rem;
}
.event .icon {
position: absolute;
left: -1.25rem;
top: 0;
background-color: #355e93;
color: white;
border-radius: 50%;
width: 2.5rem;
height: 2.5rem;
display: flex;
align-items: center;
justify-content: center;
}
.svg-icon {
width: 1.25rem;
height: 1.25rem;
}
.basic-information {
padding-left: 1rem;
color: white;
}
.basic-information .name {
font-weight: bold;
font-size: 1.2rem;
}
.basic-information .date {
margin-top: 0.25rem;
}
.details {
margin-top: 1rem;
padding-left: 1rem;
color: white;
}
/* Colored Sections */
.blue-section {
background-color: #254267;
color: white;
padding: 40px;
}
.grey-section {
background-color: #adadad;
color: #000;
padding: 40px;
}
.dod-blue-section {
background-color: #355e93;
color: white;
padding: 40px;
}
.steel-blue-section {
background-color: #aebfd4;
color: #000;
padding: 40px;
}
.footer-section {
background-color: #254267;
color: white;
padding: 20px;
text-align: center;
font-weight: bold;
}
/* Schedule Layout */
.schedule-item {
margin-bottom: 20px;
}
.schedule-date {
font-weight: bold;
font-size: 1.2em;
}
.schedule-details {
margin-left: 20px;
font-weight: normal;
}
/* Responsive Enhancements */
@media (max-width: 768px) {
.header-block {
flex-direction: column;
text-align: center;
}
.header-date-location {
text-align: center;
margin-top: 10px;
}
}
/* ==|== media queries ======================================================
========================================================================== */
/* 1024 viewport — desktop computers; non-retina pads in landscape mode ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ */
@media only screen and (max-width: 1024px) {
/* End 1024 viewport */}
/* 1024 viewport — retina ipad in portrait mode ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ */
@media only screen and (max-device-width: 2048px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2) {
/* End ipad 1024px viewport */}
/* 1024 viewport — retina ipad in landscape mode ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ */
@media only screen and (max-device-width: 2048px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 2) {
/* End ipad 1024px viewport */}
/* --- 1000px viewport START —---------—--------- */
@media only screen and (max-width: 1000px) {
#topbar{text-align:center}
.logo{float:none}
/* --- 1000px viewport END —---------—--------- */}
/* --- 800px viewport START —---------—--------- */
@media only screen and (max-width: 800px) {
body{font-size:20px;webkit-text-size-adjust:none}
#wrap {width:revert;max-width:100%}
#content {padding:20px}
.row,body,.container{width:100%;min-width:120px;margin-left:0px;margin-right:0px;padding-left:0px;padding-right:0px}
.row .onecol,.row .twocol,.row .threecol,.row .fourcol,.row .fivecol,.row .sixcol,.row .sevencol,.row .eightcol,.row .ninecol,.row .tencol,.row .elevencol,.row .twelvecol{width:auto;float:none;margin-left:0px;margin-right:0px;padding:0px}
.logo{max-width:90%;height:auto}
.post-tag-chiclets ul li{display:inline-block;margin:4px 12px 4px 0;}
.post-tag-chiclets ul li:last-child{margin-right:0}
.post-tag-chiclets ul li a{padding:10px;border-radius:8px;line-height:1em;letter-spacing:.05em; font-size:.9em;font-weight:800}
ul.xoxo{margin-top:24px !important}
h1 {font-size: 1.5em;line-height:1.5em}
h2 {font-size: 1.35em}
h3 {font-size: 1.12em}
h1.h1white{padding-top:20px}
#footer-left-logo{display:none}
#footer-mid-info{padding-top:20px}
.footer-seal{margin:20px auto !important}
#block-10 ul.wp-block-categories-list li{border-top:1px solid #555;font-size:1.1em;padding:10px 0}
.post-tag-chiclets{padding-top:50px}
.post-tag-chiclets:before{content: 'TAGGED:';color:#555;font-size: 20px;font-weight: 400;font-family:'Oswald',"Franklin Gothic Medium Condensed",Arial,sans-serif}
.post-tag-chiclets ul{list-style-type:none;padding:10px 0 0 0;margin:0;border-top:1px solid #bbb}
/* --- 800px viewport END —---------—--------- */}
/* 640 viewport — non-retina devices in portrait mode ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ */
@media only screen and (max-width: 640px) {
.post-template-default #introbar, .archive #introbar{display:none}
.photo-badge{display:none}
/* End 640 viewport */}
/* 480 viewport — phones ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ */
@media only screen and (max-width: 480px) {
/* End 480 viewport */}
/* 360 viewport — phones ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ ‡ */
@media only screen and (max-width: 360px) {
/* End 360 viewport */}
/* --- SPECIAL viewport 1 START —---------—--------- */
@media only screen and (-webkit-min-device-pixel-ratio: 2) {
#listholder{display:none}
#listholder2{display:block;margin:0 auto;width:100%}
/* --- SPECIAL viewport 1 END —---------—--------- */}
/* ==|== non-semantic helper classes ========================================
Please define your styles before this section.
========================================================================== */
/* For image replacement */
.ir { display: block; overflow: hidden; border: 0; background-color: transparent; background-repeat: no-repeat; text-align: left; text-indent: -999em; direction: ltr; *line-height: 0}
.ir br { display: none}
/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden}
/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { position: absolute; overflow: hidden; clip: rect(0 0 0 0); margin: -1px; padding: 0; width: 1px; height: 1px; border: 0}
/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { position: static; overflow: visible; clip: auto; margin: 0; width: auto; height: auto}
/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden}
/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { display: table; content: ''}
.clearfix:after { clear: both !important}
.clearfix { *zoom: 1}
/* ==|== print styles =======================================================
Print styles.
Inlined to avoid required HTTP connection: h5bp.com/r
========================================================================== */
@media print {
* { background: transparent !important; box-shadow:none !important; color: black !important; text-shadow: none !important; -ms-filter: none !important; filter:none !important}
body {color: #000}
a, a:visited { text-decoration: underline}
.ir a:after, a[href^='javascript:']:after, a[href^='#']:after { content: ''} /* Don't show links for images, or javascript/internal links */
pre, blockquote { border: 1px solid #999; page-break-inside: avoid}
thead { display: table-header-group} /* h5bp.com/t */
tr, img { page-break-inside: avoid}
img { max-width: 100% !important}
@page { margin: 0.5cm}
p, h2, h3 { orphans: 3; widows: 3}
h2, h3 { page-break-after: avoid}
#wrap {width:auto}
nav, #banner, #searchform, .searchp, .slider {display:none !important}
#content {margin-top:10px}
#content img {max-width:100%;height:auto}
h2, h3, h4, h5, h6 {margin-top:25px}
footer {background: url(none);border-top:2px solid #888;width:100%;margin-top: -185px;height: auto}
.gallery:before, .gallery:after { display: table; content: ''}
.gallery:after { clear: both !important}
.gallery { *zoom: 1}
}