@charset 'utf-8';

/* ==[ GENERAL ]=========================== */
a { color: #444 !important; cursor: pointer; text-decoration: none; }
a:hover, a:focus { text-decoration: none; }
body { color: #444; font-family: Arial, sans-serif; }
img { border: none; }
input, textarea, select { border-radius: 0 !important; font-size: 14px !important; }

/* ==[ MENU ]============================== */
footer .nav-link { padding: 5px 0px; }
nav .nav-link { font-weight: 600; }
nav .nav-link:hover, nav .nav-link:focus { color: #6599ff !important; }

/* ==[ SECTIONS ]========================== */
#copyright { background-color: #000; color: #f8f8f8; font-size: 12px; padding: 15px 0px; }
#footer { background-color: #2b2b2b; color: #f8f8f8; font-size: 12px; padding: 40px 0px; }
#jumbo { background: url('/images/slider.jpg') center/cover no-repeat; height: 750px; }
#subpage { align-items: center; background-color: #ff9900; border-bottom: 20px #ffc04d solid; color: #fff; display: flex; height: 100px; justify-content: center; padding-top: 20px; text-align: center; }
footer a { color: #ff9900 !important; }
footer a:hover { color: #fff !important; }

/* ==[ CUSTOM ]============================ */
[id^="map"] { height: 500px; }
.btn-blue, .btn-blue:active, .btn-blue:focus, .btn-blue.active { background-color: #6599ff !important; border: none; color: #fff !important; }
.btn-blue:hover { background-color: #a3c6ff !important; color: #000 !important; }
.btn-orange, .btn-orange:active, .btn-orange:focus, .btn-orange.active { background-color: #ff9900 !important; border: none; color: #fff !important; }
.btn-orange:hover { background-color: #ffc04d !important; color: #000 !important; }
.button-orange { border: 2px solid #ff9900; border-radius: 5px; display: inline-block; margin-top: 20px; padding: 10px 20px; text-decoration: none; transition: background-color 0.3s, color 0.3s; }
.button-orange:hover { background-color: #ff9900; color: #fff !important; }
.card { margin-bottom: 5px; }
.card:nth-child(even) { border: 2px solid #6599ff; }
.card:nth-child(odd) { border: 2px solid #ff9900; }
.card:nth-child(even) .card-header { background-color: #6599ff; }
.card:nth-child(odd) .card-header { background-color: #ff9900; }
.card.card-blue { border: 2px solid #6599ff !important; }
.card.card-orange { border: 2px solid #ff9900 !important; }
.card.card-blue .card-header{ background-color: #6599ff; }
.card.card-orange .card-header { background-color: #ff9900; }
.card-header { border-bottom: 0px; border-radius: 3px !important; cursor: pointer; font-weight: bold; }
.card-header button { background: none; border: none; color: #fff; font-size: inherit; font-weight: inherit; padding: 0; text-align: left; text-decoration: none; width: 100%; }
.card-header button:hover { color: #fff; }
.shadowbox { background-color: rgba(0, 0, 0, 0.6); color: #fff; padding: 30px 20px; }
.text-blue { color: #6599ff !important; }
.text-justify { text-align: justify !important; }
.text-orange { color: #ff9900 !important; }
.tile { align-items: center; background-color: #ff9900; color: #f8f8f8; display: flex; flex-direction: column; justify-content: center; padding: 30px 40px 20px; position: relative; text-align: center; }
.tile:nth-child(even) { background-color: #6599ff; }
.tile:nth-child(odd) { background-color: #ff9900; }
.whitebox { background-color: rgba(255, 255, 255, 0.6); color: #fff; padding: 5px 0px; }
.grey { background-color: #f0f0f0; }
.yellow-border { border-bottom: 20px #ffc04d solid; }

/* ==[ MEDIA ]============================= */
@media (max-width: 768px) {
    .tile { padding: 10px 10px 5px; }
}
@media (max-width: 992px) {
    #jumbo { height: 350px; }
    h3 { font-size: 20px; }
    nav .nav-link { border-bottom: 1px solid #ccc; }
}
@media (min-width: 768px) and (max-width: 1199px) {
    .tile:nth-child(1), .tile:nth-child(2), .tile:nth-child(3) { border-bottom: 5px solid #f8f8f8; }
    .tile:nth-child(1), .tile:nth-child(4) { border-right: 5px solid #f8f8f8; }
}
@media (min-width: 1200px) and (max-width: 1399px) {
    .fa-3x { font-size: 2em; }
    .title { padding: 30px 20px 20px; }
    h4 { font-size: 1.5rem; }
}
