style.css
372 lines
| 6.3 KiB
| text/css
|
LassoCssLexer
r338 | ||||
:root{ | ||||
|
r362 | --primary: #0000AF; | ||
--dark-primary: #000080; | ||||
--light-primary: rgb(0, 0, 179, .7); | ||||
--secondary: #6F6F6F; | ||||
--tertiary: #0099FF; | ||||
--color-txt: #333; | ||||
--bg-main: rgba(80, 80, 80, .8); | ||||
--bg-invert: rgba(0, 0, 0, .2); | ||||
--bg-sections: #f9f9f9; | ||||
--bd-sections: 1px solid #D9D9D9; | ||||
--fs-nav: .875em; | ||||
--fs-trail: .87rem; | ||||
--hover-nav: rgba(0, 0, 0, 0.3); | ||||
--fg-nav: #2068A0; | ||||
--bs-nav: rgba(43, 43, 43, .4); | ||||
--bs-input: rgba(0, 113, 184, 0.5); | ||||
--bd-input: rgba(56, 181, 230, 0.75); | ||||
--bd-item: 1px solid #C9C9C9; | ||||
--bx-shadow: 0 2px 5px 0 var(--bs-nav); | ||||
--bg-body: #ffffff; | ||||
} | ||||
@font-face { | ||||
font-family: "Futura_Std"; | ||||
src: url("../fonts/FuturaStdBook.woff2") format("woff2"); | ||||
} | ||||
@font-face { | ||||
font-family: "Futura_Bold"; | ||||
src: url("../fonts/Futura-Bold.otf"); | ||||
} | ||||
@font-face { | ||||
font-family: "Futura_Light"; | ||||
src: url("../fonts/FuturaStdLight.otf"); | ||||
} | ||||
r338 | ||||
|
r343 | label { | ||
display: inline-block; | ||||
max-width: 100%; | ||||
margin-bottom: 5px; | ||||
font-weight: bold; | ||||
} | ||||
.form-check-input { | ||||
position: relative; | ||||
margin-top: .3rem; | ||||
margin-left: .3rem; | ||||
} | ||||
r338 | body { | |||
|
r362 | padding-top: 150px; | ||
color: #211d18; | ||||
font-family: Futura_Std, Arial, Helvetica, Poppins; | ||||
background-color: var(--bg-body); | ||||
/* color: #444; | ||||
r338 | font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; | |||
|
r362 | font-size: 14px; */ | ||
} | ||||
.carousel-caption { | ||||
top: 0; | ||||
bottom: auto; | ||||
text-align: left; | ||||
left: 5%; | ||||
} | ||||
.carousel-caption h5 { | ||||
font-family: Futura_Bold; | ||||
font-size: 33px; | ||||
} | ||||
.carousel-caption p { | ||||
font-family: Futura_Light; | ||||
font-size: 18px; | ||||
width: 50%; | ||||
r338 | } | |||
main { | ||||
min-width: 100%; | ||||
min-height: 400px; | ||||
} | ||||
|
r362 | a:link { | ||
-webkit-tap-highlight-color: var(--tertiary); | ||||
} | ||||
h2 { | ||||
color: var(--primary); | ||||
font-size: 34px; | ||||
font-weight: 300; | ||||
margin-top: 10px; | ||||
margin-bottom: 10px; | ||||
padding-bottom: 20px; | ||||
} | ||||
h3 { | ||||
color: var(--primary); | ||||
font-size: 28px; | ||||
font-weight: 300; | ||||
/*margin-top: 10px; | ||||
margin-bottom: 10px; | ||||
padding-bottom: 20px;*/ | ||||
} | ||||
.badge-primary { | ||||
background-color: var(--primary); | ||||
} | ||||
.img-tools { | ||||
padding-left: 3rem; | ||||
width: 90%; | ||||
} | ||||
r338 | ||||
.titulo { | ||||
color: #898989; | ||||
font-size: 2rem; | ||||
font-family: 'Dosis', Arial, Verdana, serif; | ||||
} | ||||
.titulo:after { | ||||
display: flex; | ||||
width: 60px; | ||||
border-bottom: 3px solid #48C7EC; | ||||
content: ''; | ||||
padding-top: .5rem; | ||||
margin: 0; | ||||
} | ||||
#sidebar a { | ||||
color: gray; | ||||
padding: 0.1rem; | ||||
} | ||||
#sidebar h5 { | ||||
color:#333; | ||||
} | ||||
.text-blue { | ||||
color: #003A8E; | ||||
} | ||||
.text-skyblue { | ||||
color: #00addc; | ||||
} | ||||
.nopadding { | ||||
padding: 0px !important; | ||||
} | ||||
.nomargin { | ||||
margin: 0px !important; | ||||
} | ||||
.legend { | ||||
list-style: none; | ||||
padding-left: 1rem; | ||||
padding-top: 1rem; | ||||
} | ||||
.legend span { | ||||
padding-left: 1em; | ||||
} | ||||
#loader { | ||||
margin-top: 40px; | ||||
color: var(--tertiary); | ||||
} | ||||
#plot { | ||||
margin-top: 2em; | ||||
margin-bottom: 2em; | ||||
} | ||||
|
r362 | .plot-container { | ||
margin: 5px !important; | ||||
} | ||||
r338 | /* Change Buttons Bootstrap */ | |||
.btn-primary { | ||||
|
r362 | color: #fff; | ||
background-color: var(--primary) !important; | ||||
border-color: var(--primary) !important; | ||||
/* border-radius: 1rem;*/ | ||||
r338 | } | |||
.btn-primary:hover { | ||||
color: #fff; | ||||
background-color: #23527c !important; | ||||
border-color: #23527c !important; | ||||
} | ||||
.card-text { | ||||
font-size: 0.8rem; | ||||
} | ||||
.tools-date { | ||||
font-size: 0.8rem; | ||||
} | ||||
|
r362 | .btn-primary:hover { | ||
color: #fff; | ||||
background-color: var(--primary) !important; | ||||
border-color: var(--primary) !important; | ||||
} | ||||
.btn-outline-primary { | ||||
color: var(--primary); | ||||
border-color: var(--primary) !important; | ||||
border-radius: 1rem; | ||||
min-width: 25%; | ||||
} | ||||
.btn-secondary { | ||||
color: #fff; | ||||
background-color: var(--secondary) !important; | ||||
border-color: var(--secondary) !important; | ||||
border-radius: 1.2rem; | ||||
} | ||||
.btn-year { | ||||
color: #211d18; | ||||
border-color: var(--primary) !important; | ||||
border-radius: 1rem; | ||||
min-width: 15%; | ||||
} | ||||
.btn-year-selected { | ||||
background-color:var(--primary) !important; | ||||
color: white !important; | ||||
border-color: var(--primary) !important; | ||||
border-radius: 1rem; | ||||
min-width: 15%; | ||||
} | ||||
.input-search { | ||||
color: #211d18; | ||||
border-color: var(--primary) !important; | ||||
border-radius: 1rem; | ||||
min-width: 15%; | ||||
} | ||||
.border-left { | ||||
border-color: var(--primary) !important; | ||||
} | ||||
.tools-input { | ||||
border: 1px solid var(--primary); | ||||
border-radius: 1.2rem; | ||||
width: 90%; | ||||
} | ||||
.text-primary { | ||||
color: var(--primary) !important; | ||||
} | ||||
|
r341 | /*------------------------------------------------*/ | ||
.panel { | ||||
margin-bottom: 20px; | ||||
background-color: #fafafa; | ||||
border: 1px solid transparent; | ||||
border-radius: 4px; | ||||
-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05); | ||||
box-shadow: 0 1px 1px rgba(0, 0, 0, .05); | ||||
} | ||||
.panel-body { | ||||
padding: 15px; | ||||
} | ||||
.panel-heading { | ||||
padding: 10px 15px; | ||||
border-bottom: 1px solid transparent; | ||||
border-top-left-radius: 3px; | ||||
border-top-right-radius: 3px; | ||||
} | ||||
.panel-title { | ||||
margin-top: 0; | ||||
margin-bottom: 0; | ||||
} | ||||
.panel-footer { | ||||
padding: 10px 15px; | ||||
background-color: #fafafa; | ||||
border-top: 1px solid #fafafa; | ||||
border-bottom-right-radius: 3px; | ||||
border-bottom-left-radius: 3px; | ||||
} | ||||
.panel-group { | ||||
margin-bottom: 20px; | ||||
} | ||||
.panel-group .panel { | ||||
margin-bottom: 0; | ||||
border-radius: 4px; | ||||
} | ||||
.panel-group .panel + .panel { | ||||
margin-top: 5px; | ||||
} | ||||
.panel-group .panel-heading { | ||||
border-bottom: 0; | ||||
} | ||||
.panel-group .panel-heading + .panel-collapse > .panel-body, | ||||
.panel-group .panel-footer { | ||||
border-top: 0; | ||||
} | ||||
.panel-group .panel-footer + .panel-collapse .panel-body { | ||||
border-bottom: 1px solid #fafafa; | ||||
} | ||||
.panel-default { | ||||
border-color: #fafafa; | ||||
} | ||||
.panel-default > .panel-heading { | ||||
|
r362 | background-color: #ffffff; | ||
|
r341 | border-color: #fafafa; | ||
} | ||||
.panel-default > .panel-heading + .panel-collapse > .panel-body { | ||||
border-top-color: #fafafa; | ||||
} | ||||
.panel-default > .panel-heading .badge { | ||||
color: #fafafa; | ||||
background-color: #fafafa; | ||||
} | ||||
.panel-default > .panel-footer + .panel-collapse > .panel-body { | ||||
border-bottom-color: #fafafa; | ||||
} | ||||
r338 | /* cards */ | |||
@media (min-width: 480px) { | ||||
.card-columns { | ||||
column-count: 2; | ||||
} | ||||
} | ||||
|
r362 | @media (min-width: 576px) { | ||
.card-columns { | ||||
column-count: 2; | ||||
} | ||||
} | ||||
r338 | @media (min-width: 768px) { | |||
.card-columns { | ||||
column-count: 3; | ||||
} | ||||
} | ||||
@media (min-width: 1180px) { | ||||
.card-columns { | ||||
column-count: 4; | ||||
} | ||||
|
r362 | .container, .container-lg, .container-md, .container-sm, .container-xl { | ||
max-width: 1120px; | ||||
} | ||||
r338 | } | |||
@media (min-width: 1380px) { | ||||
.card-columns { | ||||
column-count: 5; | ||||
} | ||||
|
r341 | } | ||