177 lines
2.7 KiB
CSS
177 lines
2.7 KiB
CSS
body {
|
|
font-family: "Roboto", sans-serif;
|
|
width: 100%;
|
|
}
|
|
|
|
|
|
|
|
i.bi-terminal-fill {
|
|
color: black;
|
|
}
|
|
|
|
#breadcrumb a {
|
|
text-decoration: none;
|
|
}
|
|
|
|
.breadcrumb-item a {
|
|
color: black;
|
|
}
|
|
|
|
p {
|
|
text-align: justify;
|
|
}
|
|
|
|
div.card-body {
|
|
width: 100%;
|
|
place-items: center;
|
|
}
|
|
|
|
#dix_container {
|
|
width: 90%;
|
|
min-height: 100vh;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
nav.navbar {
|
|
width: 95%;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
border-radius: 6px;
|
|
}
|
|
|
|
nav#breadcrumb {
|
|
width: 90%;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
#mode {
|
|
font-size: 1em;
|
|
margin-left: 1em;
|
|
margin-right: 1em;
|
|
}
|
|
|
|
.bi-moon-stars-fill {
|
|
color: #ffe246;
|
|
}
|
|
|
|
#breadcrumb {
|
|
/* color: black; */
|
|
margin-top: 0.5em;
|
|
margin-bottom: 2em;
|
|
display: grid;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.bi-sun-fill {
|
|
color: #ff7b00;
|
|
}
|
|
|
|
#theme_icon_sun {
|
|
/* animation: rotate 4.5s linear infinite; */
|
|
/* border: 1px solid red; */
|
|
float: left;
|
|
width: 2.5em;
|
|
height: 1em;
|
|
position: relative;
|
|
display: grid;
|
|
}
|
|
|
|
@keyframes rotate {
|
|
from {
|
|
transform: rotate(0deg);
|
|
}
|
|
|
|
to {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
|
|
#cursor {
|
|
position: relative;
|
|
display: inline-block;
|
|
line-height: 24px;
|
|
font-size: 24px;
|
|
/* color: white; */
|
|
}
|
|
|
|
/* #ff7b00; */
|
|
#cursor::after {
|
|
content: "";
|
|
display: inline-block;
|
|
background-color: rgba(0, 0, 0, 1);
|
|
/* vertical-align: top; */
|
|
width: 10px;
|
|
/* Set height to the line height of .text */
|
|
height: 1em;
|
|
-webkit-animation: blink 1s step-end infinite;
|
|
animation: blink 1s step-end infinite;
|
|
}
|
|
|
|
@-webkit-keyframes blink {
|
|
0% {
|
|
opacity: 1;
|
|
}
|
|
|
|
50% {
|
|
opacity: 0;
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
@keyframes blink {
|
|
0% {
|
|
opacity: 1;
|
|
}
|
|
|
|
50% {
|
|
opacity: 0;
|
|
}
|
|
|
|
100% {
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
/* media querys */
|
|
@media only screen and (max-width: 767px) {
|
|
/* Reglas CSS para pantallas de celulares */
|
|
/* red */
|
|
/* .navbar-brand {
|
|
background-color: red;
|
|
} */
|
|
}
|
|
|
|
@media only screen and (min-width: 768px) and (max-width: 991px) {
|
|
/* Reglas CSS para tablets */
|
|
/* purple */
|
|
/* .navbar-brand {
|
|
background-color: purple;
|
|
} */
|
|
}
|
|
|
|
@media only screen and (min-width: 992px) and (max-width: 1199px) {
|
|
/* Reglas CSS para laptops */
|
|
/* green */
|
|
/* .navbar-brand {
|
|
background-color: green;
|
|
} */
|
|
}
|
|
|
|
@media only screen and (min-width: 1200px) {
|
|
/* Reglas CSS para monitores ultra wide */
|
|
/* yellow */
|
|
/* .navbar-brand {
|
|
background-color: yellow;
|
|
} */
|
|
|
|
.cards_container {
|
|
display: grid;
|
|
grid-template-columns: repeat(5, 1fr);
|
|
}
|
|
}
|