design/public/assets/css/footer.css

168 lines
3.0 KiB
CSS
Raw Normal View History

2024-11-06 10:31:56 +00:00
.BottomMain {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
background: white;
box-shadow: 0 0 8px 0 rgb(0,0,0,0.1);
border-top: solid 1px rgba(0,0,0,0.1);
}
.BottomMainInside {
display: flex;
flex-direction: column;
grid-gap: 0px;
width: 100%;
}
.BottomMainInsideTop {
padding: 50px 0;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
border-top: solid 1px rgba(255,255,255,0.05);
}
@media (max-width: 992px) {
.BottomMainInsideTop {
padding: 25px 0;
}
}
.BottomMainInsideBottom {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
border-top: solid 1px rgba(255,255,255,0.05);
padding: 15px 0;
}
.BottomMainInsideBottomInside {
width: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
color: rgba(255,255,255,0.5);
overflow: auto;
}
@media (max-width: 768px) {
.BottomMainInsideBottomInside {
align-items: start;
}
}
.BottomMainInsideBottomInsideText {
display: flex;
flex-direction: row;
text-align: center;
white-space: nowrap;
font-size: 14px;
line-height: 1;
}
.BottomMainInsideBottomInsideTextLink {
font-weight: 500;
}
.BottomMainInsideTopInside {
width: 100%;
display: grid;
grid-template-columns: 0.75fr 1.5fr 0.75fr;
grid-gap: 50px;
}
@media (max-width: 992px) {
.BottomMainInsideTopInside {
grid-template-columns: 1fr;
grid-gap: 25px;
}
}
.BottomMainInsideTopInsideSec {
display: flex;
flex-direction: column;
grid-gap: 25px;
align-items: center;
}
.BottomMainInsideTopInsideSecLogo {
width: 100%;
max-width: 75px;
}
.BottomMainInsideTopInsideSecMid {
width: 100%;
display: flex;
flex-direction: row;
grid-gap: 15px;
flex-wrap: wrap;
}
.BottomMainInsideTopInsideSecMidLink {
transition: ease 0.2s;
padding: 10px 20px;
text-align: center;
border-radius: 5px;
font-weight: 500;
flex-grow: 1;
color: #636363;
white-space: nowrap;
}
.BottomMainInsideTopInsideSecMidLink:hover {
transition: ease 0.2s;
color: #ffffff;
background: #ff9900;
}
.BottomMainInsideTopInsideSecRight {
width: 100%;
display: flex;
flex-direction: column;
grid-gap: 25px;
}
.BottomMainInsideTopInsideSecRightText {
font-size: 16px;
font-weight: 500;
}
.BottomMainInsideTopInsideSecRightSocials {
display: flex;
flex-direction: row;
grid-gap: 15px;
}
.btnMain.BottomMainInsideTopInsideSecRightSocialsBtn {
transition: ease 0.2s;
padding: 10px 20px;
}
.btnMain.BottomMainInsideTopInsideSecRightSocialsBtn > img {
opacity: 0.75;
filter: brightness(100%) contrast(100%) saturate(0%);
}
.btnMain.BottomMainInsideTopInsideSecRightSocialsBtn:hover > img {
opacity: 1;
}
.btnMain.BottomMainInsideTopInsideSecRightSocialsBtn:active > img {
opacity: 0.5;
}
.BottomMainInsideTopInsideSecLeft {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
grid-gap: 25px;
}