1/* 2 * DO NOT EDIT THIS FILE. 3 * See the following change record for more information, 4 * https://www.drupal.org/node/3084859 5 * @preserve 6 */ 7 8/** 9 * @file 10 * Site branding in header. 11 */ 12 13[dir="ltr"] .site-branding { 14 margin-left: -1.125rem; 15 margin-right: 1.125rem 16} 17 18[dir="rtl"] .site-branding { 19 margin-right: -1.125rem; 20 margin-left: 1.125rem 21} 22 23[dir="ltr"] .site-branding { 24 padding-left: 1.125rem 25} 26 27[dir="rtl"] .site-branding { 28 padding-right: 1.125rem 29} 30 31[dir="ltr"] .site-branding { 32 padding-right: 1.125rem 33} 34 35[dir="rtl"] .site-branding { 36 padding-left: 1.125rem 37} 38 39.site-branding { 40 display: flex; 41 flex-shrink: 1; 42 align-items: flex-end; 43 min-width: calc(33.33333vw + 0.75rem); 44 min-height: 3.375rem; 45 padding-top: 0; 46 padding-bottom: 0.5625rem; 47 48 /* @todo - #0d7ab8 isn't currently a variable. */ 49 background-image: linear-gradient(160deg, #2494db 0%, #0d7ab8 78.66%) 50} 51 52@media (min-width: 31.25rem) { 53 54.site-branding { 55 min-height: 4.5rem 56} 57 } 58 59@media (min-width: 43.75rem) { 60 61.site-branding { 62 min-height: 6.75rem; 63 padding-bottom: 1.125rem 64} 65 } 66 67@media (min-width: 62.5rem) { 68 69.site-branding { 70 min-width: calc(14.28571vw + 0.99107rem) 71} 72 } 73 74@media (min-width: 75rem) { 75 76[dir="ltr"] .site-branding { 77 margin-left: -2.25rem 78 } 79 80[dir="rtl"] .site-branding { 81 margin-right: -2.25rem 82 } 83 84[dir="ltr"] .site-branding { 85 padding-left: 2.25rem 86 } 87 88[dir="rtl"] .site-branding { 89 padding-right: 2.25rem 90 } 91 92[dir="ltr"] .site-branding { 93 padding-right: 2.25rem 94 } 95 96[dir="rtl"] .site-branding { 97 padding-left: 2.25rem 98 } 99 100.site-branding { 101 min-width: calc(14.28571vw + 0.99107rem); 102 min-height: 11.25rem; 103 padding-top: 0; 104 padding-bottom: 0 105} 106 } 107 108@media (min-width: 90rem) { 109 110.site-branding { 111 min-width: 13.98214rem 112} 113 } 114 115[dir="rtl"] .site-branding { 116 background-image: linear-gradient(-160deg, #2494db 0%, #0d7ab8 78.66%); 117} 118 119.site-branding--bg-gray { 120 background: #f7f9fa; 121} 122 123.site-branding--bg-white { 124 background: #fff; 125} 126 127.site-branding__inner { 128 display: flex; 129 align-items: center 130} 131 132.site-branding__inner a { 133 text-decoration: none; 134 } 135 136@media (min-width: 75rem) { 137 138[dir="ltr"] .site-branding__inner { 139 padding-left: 0 140 } 141 142[dir="rtl"] .site-branding__inner { 143 padding-right: 0 144 } 145 146[dir="ltr"] .site-branding__inner { 147 padding-right: 0 148 } 149 150[dir="rtl"] .site-branding__inner { 151 padding-left: 0 152 } 153 154.site-branding__inner { 155 height: 6.75rem; 156 padding-top: 0.5625rem; 157 padding-bottom: 0.5625rem 158} 159 } 160 161.site-branding__logo { 162 flex-shrink: 0; 163 max-width: 100% 164} 165 166.site-branding__logo img { 167 width: auto; 168 max-width: 100%; 169 max-height: 2.25rem 170 } 171 172@media (min-width: 31.25rem) { 173 174.site-branding__logo img { 175 max-height: 3.375rem 176 } 177 } 178 179@media (min-width: 43.75rem) { 180 181.site-branding__logo img { 182 max-height: 4.5rem 183 } 184 } 185 186@media (min-width: 75rem) { 187 188.site-branding__logo img { 189 max-height: 5.625rem 190 } 191 } 192 193.site-branding__text { 194 color: #fff; 195 font-size: 1.125rem; 196 font-weight: bold 197} 198 199.site-branding__text a { 200 color: inherit; 201 } 202 203@media (min-width: 43.75rem) { 204 205.site-branding__text { 206 font-size: 1.75rem; 207 line-height: 1.75rem 208} 209 } 210 211@media (min-width: 75rem) { 212 213.site-branding__text { 214 letter-spacing: 0.02em; 215 font-size: 2rem; 216 line-height: 2.25rem 217} 218 } 219 220.site-branding--bg-gray .site-branding__text, 221.site-branding--bg-white .site-branding__text { 222 color: #2494db; 223} 224 225[dir="ltr"] .site-branding__logo + .site-branding__text { 226 margin-left: 0.75rem 227} 228 229[dir="rtl"] .site-branding__logo + .site-branding__text { 230 margin-right: 0.75rem 231} 232