Ela_Front/src/components/FooterStyles.js

61 lines
1000 B
JavaScript

import styled from 'styled-components';
export const Box = styled.div`
padding: 1rem 1rem;
background: #F2F3F4;
bottom: 0;
width: 100%;
@media (max-width: 601px) {
padding: 2rem 30px;
}
`;
export const Container = styled.div`
display: flex;
flex-direction: column;
justify-content: center;
max-width: 1000px;
margin: 0 auto;
/* background: red; */
`
export const Column = styled.div`
display: flex;
flex-direction: column;
text-align: left;
margin-left: 60px;
`;
export const Row = styled.div`
display: grid;
grid-template-columns: repeat(auto-fill,
minmax(185px, 1fr));
grid-gap: 20px;
@media (max-width: 1000px) {
grid-template-columns: repeat(auto-fill,
minmax(200px, 1fr));
}
`;
export const FooterLink = styled.a`
color: #17202A;
margin-bottom: 0.2rem;
font-size: medium;
text-decoration: none;
&:hover {
color: green;
transition: 200ms ease-in;
}
`;
export const Heading = styled.p`
font-size: large;
color: #17202A;
margin-bottom: 0.5rem;
font-weight: bold;
`;