import styled, { css } from 'styled-components';

import { ICover } from './Cover.interface';

export const StyledCover = styled.div<ICover>`
  display: flex;
  position:relative;
  width:100%;
  overflow: hidden;

  & > div:first-child{
    position:absolute;
    top: 0;
    left: 0;
    width:100%;
    height:100%;

    & img{
      object-fit: cover;
    }
  }
`;

export const StyledCoverOverlay = styled.div`
  position:absolute;
  top: 0;
  left: 0;
  width:100%;
  height:100%;
`;


export const StyledCoverContent = styled.div`
  position: relative;
  display: block;
  width: 100%;
`;