src/wolnelektury/static/2022/styles/layout/_footer.scss

   1 .l-footer {
   2   color: #FFFFFF;
   3   background: #083F4D;
   4   margin: 0 auto;
   5   padding-top: 27px;
   6   padding-bottom: 38px;
   7
   8   .l-container {
   9       display: flex;
  10       flex-direction: column;
  11       @include rwd($break-footer) {
  12           display: block;
  13       }
  14   }
  15 }
  16
  17 .l-footer__row {
  18   display: flex;
  19
  20   align-items: flex-start;
  21   flex-direction: column;
  22
  23   @include rwd($break-footer) {
  24       flex-direction: row;
  25       align-items: center;
  26       justify-content: space-between;
  27   }
  28
  29   &:nth-child(1) {
  30     padding-bottom: 25px;
  31     border-bottom: 1px solid #007880;
  32   }
  33
  34   &:nth-child(2) {
  35       margin-top: 25px;
  36       column-gap: 20px;
  37
  38     div {
  39         font-size: 14px;
  40         @include rwd($break-footer) {
  41             font-size: unset;
  42       }
  43       &:nth-child(1) {
  44         max-width: 315px;
  45         padding-right: 53px;
  46
  47         border-right: 0;
  48         min-width: 0;
  49         margin-bottom: 20px;
  50         @include rwd($break-footer) {
  51             min-width: 270px;
  52             border-right: 1px solid #007880;
  53             margin-bottom: 0;
  54         }
  55       }
  56       &:nth-child(3) {
  57         max-width: 483px;
  58         margin-top: 20px;
  59         @include rwd($break-footer) {
  60             margin-top: 0;
  61         }
  62       }
  63
  64       a {
  65         color: #85C7CC;
  66         &:hover {
  67           color: #85C7CC;
  68           text-decoration: underline;
  69         }
  70       }
  71     }
  72   }
  73
  74   ul {
  75     padding: 0;
  76     list-style: none;
  77     margin-top: 20px 0 0 0;
  78     @include rwd($break-footer) {
  79         margin: 0;
  80     }
  81     li {
  82       font-weight: normal;
  83       font-size: 14x;
  84       line-height: 150%;
  85       @include rwd($break-footer) {
  86         font-size: 21px;
  87       }
  88     }
  89
  90     &:nth-of-type(1) {
  91       margin-left: 0;
  92       margin-right: auto;
  93       @include rwd($break-footer) {
  94         margin-left: 90px;
  95       }
  96     }
  97
  98     &:nth-of-type(2) {
  99       margin-left: 0;
 100       margin-right: auto;
 101       @include rwd($break-footer) {
 102         margin-left: 10px;
 103       }
 104     }
 105
 106     &.teal {
 107       color: #85C7CC;
 108       a {
 109         color: white;
 110         &:hover {
 111           text-decoration: underline;
 112         }
 113       }
 114     }
 115   }
 116 }