:root {
--primary1: #100000;
--secondary1: #E2B670;
--teritary1: #B98404;
--headertext: #100000;
--secondarytext: #554444;
--secondgrey: #89959A;
--placeholder: #8d8d8d;
--backgroundclr: #FCF8EA;
--bordergrey: #DADADA;
--bs-font-sans-serif: "Raleway", sans-serif !important;
--bs-font-sans-serif2: "Inter", sans-serif !important;
}
body {
font-family: var(--bs-font-sans-serif) !important;
font-size: .9rem;
min-height: 100vh;
cursor: url('data:image/svg+xml,'), auto;
}
p {
margin-bottom: 0 !important;
}
.fw-semibold {
font-weight: 600;
}
.fs-7{
font-size: .9rem;
}
.fs-8{
font-size: .8rem;
}
.btn {
font-size: 1.1rem !important;
}
.btn-dark {
background-color: var(--primary1) !important;
transition: .5s ease-in-out;
}
.btn-dark:hover {
background-color: #554444 !important;
}
.btn-grey {
background-color: #f5f5f5 !important;
}
.btn-grey:hover {
background-color: #deca7a !important;
}
.primary_shadow {
box-shadow: 0px 4px 50px 0px rgba(199, 199, 199, 0.55);
}
.secondary_shadow {
box-shadow: 0px 4px 50px 0px rgba(199, 199, 199, 0.55);
}
.numberfont {
font-family: var(--bs-font-sans-serif2) !important;
}
.textfont {
font-family: var(--bs-font-sans-serif) !important;
}
.texture {
position: relative;
z-index: 0;
min-height: 100vh;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
flex-direction: column;
}
.texture::before {
position: absolute;
content: '';
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
opacity: 0.35;
background: url(../img/texture.png) #fff 0% 0% / 85px 45px repeat;
}
.header,
.footer {
display: flex;
justify-content: space-between;
}
.logo {
width: 8rem;
max-height: 6rem;
display: block;
margin: 1rem auto;
object-fit: contain;
cursor: url('data:image/svg+xml,'), auto !important;
}
.social {
text-decoration: none;
list-style: none;
display: flex;
align-items: center;
flex-wrap: wrap;
margin: 0;
padding: 0;
a {
font-size: 20px;
padding: 0 .2rem;
color: var(--secondary1);
transition: .5s ease-in-out;
}
a:hover {
color: var(--primary1);
}
}
.powered {
width: 6rem;
}
.dropdown>.dropdown-menu,
.dropdown.open>.dropdown-menu {
display: block !important;
opacity: 0;
visibility: hidden;
transition: all ease 0.2s;
}
.dropdown:hover>.dropdown-menu,
.dropdown.open:hover>.dropdown-menu {
opacity: 1;
visibility: visible;
}
.dropdown-menu {
bottom: 100%;
right: -42%;
padding: 0 !important;
width: max-content;
min-width: 16vw !important;
max-width: 90vw !important;
border: 1px solid #ffe5bc !important;
border-radius: 1vh !important;
a{
padding: .5rem;
grid-gap:.5rem;
border-radius: 1vh;
}
a:hover{
background-color: var(--backgroundclr);
}
p{
line-height: 1rem;
}
.headtxt{
font-size: .8rem;
}
.addresstxt{
font-size: .7rem;
font-weight: 400;
}
}
.logincard {
background-color: #fff;
border-radius: 2vh;
overflow: hidden;
.logindetails {
max-width: 85%;
height: 100%;
margin: auto;
}
}
.inputGroup {
margin: 1em 0 0em 0;
font-family: var(--bs-font-sans-serif2);
position: relative;
}
.inputGroup input {
padding: 0.6em;
outline: none;
border: 2px solid var(--bordergrey);
background-color: #F5F5F5;
border-radius: 5px;
width: 100%;
}
.inputGroup label {
color: #8D8D8D;
position: absolute;
left: 0;
padding: 0.6em;
margin-left: 0.5em;
font-size: .9rem;
pointer-events: none;
transition: all 0.3s ease;
}
.inputGroup :is(input:focus, input:valid)~label {
transform: translateY(-60%) scale(.9);
margin: 0em;
margin-left: 1em;
padding: 0 0.4em;
background-color: #fff;
color: var(--placeholder);
}
.inputGroup :is(input:focus, input:valid) {
border-color: var(--secondary1);
background-color: #fff;
}
.store {
list-style: none;
border-radius: 0.625rem;
background: rgba(170, 170, 170, 0.13);
backdrop-filter: blur(2px);
padding: .5rem 1rem;
a {
color: var(--primary1);
font-weight: 600;
text-decoration: none;
}
a:hover{
color: var(--secondarytext);
}
}
.carousel-indicators [data-bs-target] {
width: 6px !important;
height: 6px !important;
border-radius: 50%;
}
.carousel-control-next-icon,
.carousel-control-prev-icon {
height: 1rem !important;
background-image: url('data:image/svg+xml,') !important;
}
.carousel-control-prev-icon {
transform: rotate(180deg);
}
.carousel-indicators {
justify-content: flex-end !important;
margin-right: 1rem !important;
margin-left: 0% !important;
}
.apps {
justify-content: center;
grid-gap: 1.5rem;
margin-top: 1rem;
margin-bottom: 1rem;
img {
max-width: 130px;
}
}
.addresbar{
border: 1px solid #89959A;
padding: .6rem;
border-radius: 1vh;
}
.contact{
position: fixed;
left: 3%;
bottom: 2%;
z-index: 999;
display: flex;
flex-wrap: wrap;
grid-gap: 0rem;
a{
text-decoration: none;
svg{
background-color: var(--secondary1);
margin: 0 .3rem;
border-radius: 5vh;
font-size: 2.2rem;
color: var(--primary1);
}
span{
font-family: var(--bs-font-sans-serif2);
color: var(--secondarytext);
font-size: 0rem;
}
}
}
@media (min-width: 992px) {
.contact{
position: relative;
left: auto;
bottom: auto;
a{
svg{
background-color: var(--secondary1);
margin: 0 .3rem;
border-radius: 5vh;
font-size: 1.8rem;
color: var(--primary1);
}
span{
font-family: var(--bs-font-sans-serif2);
color: var(--secondarytext);
font-size: .9rem;
}
}
}
}
.footext{
a{
font-size: .8rem;
font-weight: 400;
color: var(--primary1);
}
a:hover{
color: var(--secondarytext);
}
}
@media (min-width: 992px) {
.logo {
width: 10rem !important;
}
.logindetails {
max-width: 75% !important;
}
}
@media (min-width: 768px) {
.dropdown-menu {
right: 0 !important;
}
}