/*
Theme Name: Michigan Fire Training Consultants
Theme URI: 
Author: Tiger Studios, Inc.
Description: Michigan Fire Training Consultants, 2025 theme, is build on Afterimage Designs' https://afterimagedesigns.com/wp-bootstrap-starter/ WP Bootstrap Starter theme using Twitter Bootstrap 5.
*/

/*#_Basics/Colors#*/
/*
Col 1 #ED1C24 Red
Col 2 #155680 Blue Gray
Col 3 #FFFF00 Yellow
Col 4 #424040 Light Gray
Col 5 #222 Dark Gray
*/


html,body {width: 100%; height: 100%; margin: 0px; padding: 0px} 
body {background-color: #fff; font-family: 'Roboto', sans-serif; font-size: 13pt; font-weight:400; color: #000; margin: 0; padding: 0}

.desktop {display:block}
.mobile {display:none}

h1, h2, h3, h4 {color: #000; margin-bottom: 10px; line-height: 1.3em; font-weight: 900;text-transform:uppercase}
h1 {font-size: 3.2em; text-shadow: 2px 3px 0px #000}
h2 {font-size: 2.8em;}
h3 {font-size: 1.9em;}
h4 {font-size: 1.4em;}

a {color:#000; text-decoration:underline}
a:hover{color:#ED1C24}

.alignright, .float-right {float:right; margin-left: 40px}
.alignleft, .float-left {float:left; margin-right: 40px}
.aligncenter {display:block; text-align:center; margin: 0 auto;}

p {line-height: 140%}
.nopadding {padding-left:0!important;padding-right:0!important}
sup {font-size: 50%; padding-left: 2px;}

hr {border: 1px solid #033159;}

.embed-container {position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.clear {clear: both}
.screentext, .screen-reader-text {position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden}
.skip-to-content {position: absolute; width: 1px; height: 1px;overflow: hidden;clip: rect(0,0,0,0);margin: 0} 
.skip-to-content:focus, .skip-to-content:active {position: static;height: auto;width: auto;overflow: visible;clip: auto}

.btn {font-size: 1.1em; font-weight: 800; min-width: 180px; padding: 10px 25px; text-transform:uppercase; background:transparent; border-radius:8px; text-decoration:none!important}

.redbtn {background-color: #ED1C24; color: #fff;}
.redbtn:hover, .redbtn:focus {background-color: #155680; color: #fff;}

/*# Header Styles ----------------------------------#*/
header, .navbar {padding: 15px 20px; background:#222!important;}
.navbar-brand img {width: 150px; height: auto}
.navbar-nav li {padding: 0 3px; text-transform: uppercase}
.navbar-nav li a {padding: 5px 3px; font-weight: 600; font-size: 0.95em; color: #fff; text-decoration:none}
.navbar-nav li a:hover, .current-menu-parent .dropdown-toggle, .navbar-nav li a:focus, .navbar-nav a.active{color: #ED1C24;}

.offcanvas, .offcanvas-header.bg-dark {background-color: #222!important}
.offcanvas-title {color:#155680}
.offcanvas-header {border-bottom: 4px solid #155680}
.navbar-toggler {float:right; border-color: #fff; background-color:#ED1C24}
.navbar-toggler-icon 
{background-image: url("data:image/svg+xml;charset=utf8, %3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 1)' stroke-width='4' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");}


/*# Footer ----------------------------------#*/
footer {background-color: #424040; font-weight: 600; color:#fff; padding: 50px 0 20px 0;}
footer a {color:#fff; text-decoration:none; font-weight: 800; font-size: 2.2em}
footer a:hover {color:#fed136;}
.footercontact {text-align:right}
.footercontact a {font-size: 1em; color: #fff}
.footercontact a:hover {color: #ED1C24}
.footersocial i {margin-left: 10px;}
.footersocial a {font-size:2.1em!important; color: #fff;}
.footersocial a:hover {background: transparent; color:#ED1C24; text-decoration:none}
.copyright {clear:both; color: #fff;}


/*# Home Page ----------------------------------#*/
#home {padding: 100px 20px;}
#home h1 {color:#fff}

#about-us, #benefits {padding: 100px 20px 20px 20px}
.benefitsrow {padding-bottom: 100px}
.fa-circle {color:#ED1C24}

#instruction {margin-top: 100px; padding: 100px 20px 20px 20px; background-color:#155680}
#instruction h2 {color: #fff}
.instructionrow {color: #fff; padding: 20px 20px 100px 20px; background-color:#155680}
.instructionrow h3 {color: #FFFF00}
.instructionrow p {font-weight: 600; font-size: 1.2em; line-height: 180%}

#contact {color: #fff; background-color: #222; padding: 100px 20px; margin-bottom: 0; text-transform:uppercase}
#contact h2, #contact h3, #contact h4, #contact a {color: #fff; text-decoration:none}


/*# Responsive adjustments ----------------------------------#*/
@media (min-width: 310px) and (max-width: 575px) {
body {font-size: 12pt}
h1 {font-size: 2.8em!important;}
h2 {font-size: 1.9em}
h3 {font-size: 1.5em}
header, .navbar {padding: 5px 0px}
  .navbar-nav li a {font-size: 1.1em; padding: 8px 5px}
}

@media (min-width: 576px) and (max-width: 767px) {
body {font-size: 12pt}
h2 {font-size: 2.2em}
h3 {font-size: 1.6em}

}

@media (min-width: 768px) and (max-width: 991px) {
}

@media (min-width: 992px) and (max-width: 1199px) {
}