175 lines
3.5 KiB
CSS
175 lines
3.5 KiB
CSS
|
|
|
|
@font-face {
|
|
font-family: mainFont;
|
|
src: url("../fonts/poppins/Poppins-Regular.ttf");
|
|
}
|
|
|
|
.poppins {
|
|
font-family: mainFont;
|
|
}
|
|
|
|
#myVideo {
|
|
position: fixed;
|
|
right: 0;
|
|
bottom: 0;
|
|
min-width: 100%;
|
|
min-height: 100%;
|
|
}
|
|
|
|
.button {
|
|
cursor: pointer;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border: none;
|
|
letter-spacing: 2px;
|
|
font-size: 12px;
|
|
background-color: rgb(255, 152, 0) !important;
|
|
color: rgb(0, 0, 0);
|
|
border-radius: 70px;
|
|
padding: 0 15px 0 50px;
|
|
height: 70px;
|
|
text-transform: uppercase;
|
|
font-weight: 500;
|
|
}
|
|
|
|
.nav-item dropdown dmenu {
|
|
padding-right: 20px;
|
|
}
|
|
|
|
li a {
|
|
margin-right: 20px;
|
|
}
|
|
|
|
body {
|
|
background-image: url('../img/mango_bg_2.png');
|
|
background-size: cover;
|
|
background-attachment: fixed;
|
|
color: #fff;
|
|
}
|
|
|
|
.lc-block {
|
|
}
|
|
|
|
.glass {
|
|
background: rgba( 255, 255, 255, 0.25 );
|
|
box-shadow: 0 8px 32px 0 rgba( 30, 30, 30, 0.37 );
|
|
backdrop-filter: blur( 4px );
|
|
-webkit-backdrop-filter: blur( 4px );
|
|
border-radius: 40px;
|
|
border: 0,2px solid rgba( 255, 255, 255, 0.18 );
|
|
color: #dbdada;
|
|
font-size: 18px;
|
|
|
|
}
|
|
|
|
.hero {
|
|
background-image: url('../img/mango_hero.png');
|
|
background-size: cover;
|
|
background-position: center;
|
|
height: 80vh;
|
|
}
|
|
|
|
.bg-dark {
|
|
background-color: rgba(31, 31, 31, 255) !important;
|
|
}
|
|
|
|
|
|
.card {
|
|
border: none;
|
|
transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
|
|
overflow: hidden;
|
|
/*border-radius: 20px;*/
|
|
min-height: 450px;
|
|
box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.2);
|
|
margin-right:10px;
|
|
margin-left:10px;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.card {
|
|
min-height: 350px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 420px) {
|
|
.card {
|
|
min-height: 300px;
|
|
}
|
|
}
|
|
|
|
.card.card-has-bg {
|
|
transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
|
|
background-size: 120%;
|
|
background-repeat: no-repeat;
|
|
background-position: center center;
|
|
}
|
|
|
|
.card.card-has-bg:before {
|
|
content: "";
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
background: inherit;
|
|
-webkit-filter: grayscale(1);
|
|
-moz-filter: grayscale(100%);
|
|
-ms-filter: grayscale(100%);
|
|
-o-filter: grayscale(100%);
|
|
filter: grayscale(100%);
|
|
}
|
|
|
|
.card.card-has-bg:hover {
|
|
transform: scale(0.98);
|
|
box-shadow: 0 0 5px -2px rgba(0, 0, 0, 0.3);
|
|
background-size: 130%;
|
|
transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
|
|
}
|
|
|
|
.card.card-has-bg:hover .card-img-overlay {
|
|
transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
|
|
background: #ffba21;
|
|
background: linear-gradient(0deg, rgba(255, 186, 33, 0.5) 0%, #ffba21 100%);
|
|
}
|
|
|
|
.card .card-footer {
|
|
background: none;
|
|
border-top: none;
|
|
}
|
|
|
|
.card .card-footer .media img {
|
|
border: solid 3px rgba(255, 255, 255, 0.3);
|
|
}
|
|
|
|
.card .card-title {
|
|
font-weight: 800;
|
|
}
|
|
|
|
.card .card-meta {
|
|
color: rgba(0, 0, 0, 0.3);
|
|
text-transform: uppercase;
|
|
font-weight: 500;
|
|
letter-spacing: 2px;
|
|
}
|
|
|
|
.card .card-body {
|
|
transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
|
|
}
|
|
|
|
.card:hover {
|
|
cursor: pointer;
|
|
transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
|
|
}
|
|
|
|
.card:hover .card-body {
|
|
margin-top: 30px;
|
|
transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
|
|
}
|
|
|
|
.card .card-img-overlay {
|
|
transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
|
|
background: #ffba21;
|
|
background: linear-gradient(0deg, rgba(255, 186, 33, 0.3785889356) 0%, #f88440 100%);
|
|
}
|