:root
{
--typo:'Titillium Web', sans-serif;
}
html
{
background: linear-gradient(90deg, rgba(223,223,223,1) 0%, rgba(244,244,244,1) 51%, rgba(223,223,223,1) 100%);
}
body
{
background-color:transparent;
}
h5
{
text-shadow: 2px -8px 9px rgb(0,16,90,0.4);
text-align:center;
font-family:var(--typo);
font-weight:90;
text-transform:uppercase;
font-size:2rem;
margin-top: -5.7rem;
letter-spacing:5px;
color:white;
-webkit-transition: all .2s ease-out;
-moz-transition: all .2s ease-out;
-ms-transition: all .2s ease-out;
-o-transition: all .2s ease-out;
transition: all .2s ease-out;
position:relative;
z-index:1;
}
.card
{
margin: 1rem 0 1rem 0;
}
.card-body
{
padding:0;
}
a.btn
{
width:100%;
padding: 1rem;
border-radius:0;
text-transform:uppercase;
font-weight:bold;
font-family:var(--typo);
letter-spacing:4px;
font-size:1.1rem;
border:7px solid #3f3f3f;;
}
p{
padding:1.5rem;
font-family:var(--typo);
}
/* https://ianlunn.github.io/Hover/ I'm sorry for the minify, it takes up less space so... */
[class^="hvr-"] {margin: .4em;padding: 1em;text-transform: uppercase;cursor: pointer;border-top:4px solid white;text-decoration: none;-webkit-font-smoothing: antialiased;}
.hvr-bounce-to-bottom{display:inline-block;vertical-align:middle;-webkit-transform:perspective(1px) translateZ(0);transform:perspective(1px) translateZ(0);box-shadow:0 0 1px transparent;position:relative;-webkit-transition-property:color;transition-property:color;-webkit-transition-duration:.5s;transition-duration:.5s}
.hvr-bounce-to-bottom:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;bottom:0;background:#4acc19 ;-webkit-transform:scaleY(0);transform:scaleY(0);-webkit-transform-origin:50% 0;transform-origin:50% 0;-webkit-transition-property:transform;transition-property:transform;-webkit-transition-duration:.5s;transition-duration:.5s;-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}
.hvr-bounce-to-bottom:active,.hvr-bounce-to-bottom:focus,.hvr-bounce-to-bottom:hover{color:#ebebeb;}
.hvr-bounce-to-bottom:active:before,.hvr-bounce-to-bottom:focus:before,.hvr-bounce-to-bottom:hover:before{-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transition-timing-function:cubic-bezier(.52,1.64,.37,.66);transition-timing-function:cubic-bezier(.52,1.64,.37,.66)}
/* The tutorial I used : https://w3bits.com/css-image-hover-zoom/ */
/* [1] The container */
.img-hover-zoom {
overflow: hidden; /* [1.2] Hide the overflowing of child elements */
}
/* Transition property for smooth transformation of images */
.img-hover-zoom img {
transition: transform .5s ease;
}
/* Zoom-n-rotate Container */
.img-hover-zoom--zoom-n-rotate img {
transition: transform .5s ease-in-out;
}
/* The Transformation */
.img-hover-zoom--zoom-n-rotate:hover img {
transform: scale(1.6) rotate(0deg);
}
.tabela-info {
border-collapse: collapse;
margin-left: 1em;
}
.tabela-info caption {
text-align: left;
margin-left: auto;
margin-right: auto;
width: 95vw;
}
@media (min-width: 768px) {
.tabela-info {
border-collapse: collapse;
margin-left: auto;
margin-right: auto;
}
.tabela-info caption {
position: absolute;
top: -2.5em; /* Ajuste o valor para definir o espaçamento superior da caption */
width: 100%;
text-align: center;
}
.tabela-info thead {
text-align: left;
background-color: #444444;
color: white;
}
.tabela-info td,
.tabela-info th {
padding: 0.25em 0.5em;
}
.tabela-info td:nth-child(2),
.tabela-info th:nth-child(2) {
border-left: 0px solid #fff;
color: #020202;
font-weight: bold;
}
}
@media (max-width: 767px) {
.tabela-info {
display: block;
margin-top: 1em;
}
td {
display: block;
}
td:first-child {
font-weight: 700;
margin-top: 0.75em;
margin-bottom: 0;
}
td:nth-child(2) {
margin-top: 0;
}
}
h1{
font-family: Poppins;
font-size:50px;
text-align:center;
color:black;
padding:1%;
}
#gallery{
-webkit-column-count:4;
-moz-column-count:4;
column-count:4;
-webkit-column-gap:20px;
-moz-column-gap:20px;
column-gap:20px;
}
@media (max-width:1200px){
#gallery{
-webkit-column-count:3;
-moz-column-count:3;
column-count:3;
-webkit-column-gap:20px;
-moz-column-gap:20px;
column-gap:20px;
}
}
@media (max-width:800px){
#gallery{
-webkit-column-count:2;
-moz-column-count:2;
column-count:2;
-webkit-column-gap:20px;
-moz-column-gap:20px;
column-gap:20px;
}
}
@media (max-width:600px){
#gallery{
-webkit-column-count:1;
-moz-column-count:1;
column-count:1;
}
}
#gallery img,#gallery video {
width:100%;
height:auto;
margin: 4% auto;
box-shadow:-3px 5px 15px #000;
cursor: pointer;
-webkit-transition: all 0.2s;
transition: all 0.2s;
}
.modal-img,.model-vid{
width:100%;
height:auto;
}
.modal-body{
padding:0px;
}
/* Uninteresting stuff below here */