* { box-sizing: border-box; margin: 0; padding: 0; } body {  font-family: Helvetica, sans-serif;  color: #666;  background-color: #f4f4f4;  line-height: 7vw; letter-spacing: 0.4vw; font-size: 4vw; display: grid; grid-template-columns: 1fr; grid-template-areas: 'header' 'main' 'random' 'sidebar-widgets' 'footer'; gap: 5vw; } p { text-align: justify; padding: 5vw 0 5vw 0; } h1,h2,h3 { color: #000000;  line-height: 1.8; margin-top: 4vw; letter-spacing: 0.8vw; } a { color: #007bff;  } a:hover { text-decoration: none;  } input[type="submit"] { font-weight: bold; letter-spacing: 0.2vw; } input[type="text"], input[type="email"], input[type="url"], textarea, input[type="submit"] { text-align: center; padding: 3vw; width: 82%; margin-bottom: 2vw; }  .flexible-image { max-width: 500px !important;  width: 100%; } .center { text-align: center; } .justify { text-align: justify; } .flexible-image { display: block; margin-top: 5vw; }  .label { display: block; } .contact-section-banner { border-radius: 2vw; }  .header { grid-area: header; background-color: #353535;  color: rgba(255, 255, 255, 0.4);  } .menu { background-color: #353535;  display: none; position: absolute; right: 0; width: 100vw; } .menu-link { color: white;  display: block; padding: 4vw 0 4vw 5vw; } .menu-icon { color: white;  display: block; font-size: 30px; cursor: pointer; } .menu.active { display: block; } .menu-link-current { text-decoration: none;  font-size: 6vw;  } .mobile-header { background-color: #353535;  display: flex; justify-content: center; align-items: center; padding: 0 0 0 4vw; height: 16vw; text-align: center; width: 100%; } .desktop-header { display: none; } .header-text { font-size: 6vw; line-height: 1.2; font-weight: 900; font-family: Arial, sans-serif;  text-align: center; width: 100%;  } .header-text a { color: #fff; text-decoration: none; } .header-text span { color: transparent; -webkit-text-fill-color: transparent; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: #fff; }  .form { text-align: center; background: brown;  color: white;  margin: 0 auto; padding: 2vw 0 8vw 0; border-radius: 2vw; width: 87% }  .main { grid-area: main; }  .opening-content-box { background-color: #fff;  box-shadow: 0 0.8vw 3vw rgba(0, 0, 0, 0.1);  border: 0.3vw solid #ddd; border-radius: 3vw; padding: 3vw 6vw 3vw 6vw; margin: 1vw 6vw 7vw 6vw; } .opening-content-box a { font-weight: bold;  } .archive-set { display: grid; grid-template-columns: 1fr;  gap: 5vw; padding: 0 5vw 0 5vw; } .archive-set-column { border: 0.3vw solid #ddd;  box-shadow: 0 0.6vw 3vw rgba(0, 0, 0, 0.1);  border-radius: 3vw; background-color: #fff; padding: 6vw; } .archive-set-column img { border-radius: 3vw; margin: 2vw 0 2vw 0; } .archive-set-post-title { display: block; font-weight: bold; font-size: 5vw; }  .horizontal-main-container { display: flex; flex-direction: column;  } .horizontal-main-column-img, .horizontal-main-column-text { width: 100%;  } .horizontal-main-column-img img { vertical-align: middle; }  .post-tags ul, .archive-set-post-tags ul { list-style: none; margin: 4vw; } .post-tags li, .archive-set-post-tags li { display: inline-block; margin: 4vw; } .share-this-post ul { list-style: none; } .share-this-post li { margin-bottom: 4vw; }  .meta-info ul { list-style: none; } .meta-info li { display: inline-block; margin: 4vw; } .post { border: 0.1vw solid #ddd; box-shadow: 0 0.2vw 1vw rgba(0, 0, 0, 0.1); border-radius: 3vw; margin: 0 5vw 5vw 5vw; background-color: #fff; padding: 1.5vw 1.5vw 6vw 1.5vw; } .post-content { width: 80%; margin: 0 auto; } .post img { display: inline-block; border-radius: 1vw; margin: 5vw 0 5vw 0; width: 100%; } .pagination a { color: #fff;  } .pagination ul { justify-content: center; list-style: none; display: flex; flex-wrap: wrap; gap: 12vw; font-size: 8vw; line-height: 16vw; padding: 8vw; } .pagination li { border-radius: 50%; display: inline-block; background-color: #353535; color: white; text-align: center; width: 16vw; }  .sidebar-widgets { grid-area: sidebar-widgets; background-color: #fff; border: 0.3vw solid #ddd;  box-shadow: 0 0.6vw 3vw rgba(0, 0, 0, 0.1);  border-radius: 3vw; margin: 0 6vw 0 6vw; } .horizontal-sidebar-widgets-container { display: flex; gap: 2vw; padding: 2vw 2vw 10vw 2vw; } .horizontal-sidebar-widgets-column-img { flex: 1; } .horizontal-sidebar-widgets-column-text { flex: 3; } .horizontal-sidebar-widgets-column-img img { border-radius: 1vw; } .sidebar-widgets-post-title { display: block; font-size: 4vw; line-height: 6vw; padding-bottom: 3vw; }  .tag-cloud { list-style: none; justify-content: center; display: flex; flex-wrap: wrap; gap: 8vw; padding: 4vw; } .tag-cloud li a { color: #353535;  transition: background-color 0.2s ease, color 0.2s ease;  display: inline-block; text-decoration: none; padding: 2vw 4vw; font-size: 4vw; border-radius: 2vw; border: 0.4vw solid #ccc;  } .tag-cloud li a:hover { background-color: #353535;  color: #fff;  }  .random { grid-area: random; }  .random-posts { display: grid; grid-template-columns: 1fr;  gap: 5vw; padding: 5vw; } .random-posts-column { border: 0.3vw solid #ddd;  box-shadow: 0 0.6vw 3vw rgba(0, 0, 0, 0.1);  border-radius: 3vw; background-color: #fff; text-align: center; padding: 6vw; } .random-posts-column img { border-radius: 3vw; margin-bottom: 3vw; } .random-posts-post-title { display: block; font-weight: bold; font-size: 5vw; margin-bottom: 5vw; }  .random-post-tags ul { list-style: none; margin: 4vw; } .random-post-tags li { display: inline-block; margin: 4vw; }  .footer { grid-area: footer; display: grid; grid-template-columns: 1fr;  gap: 10vw; padding: 10vw; background-color: #353535;  color: rgba(255, 255, 255, 0.4);  } .footer a { color: white;  } .footer-social-pages a { display: flex; margin-top: 10vw; } .footer ul { list-style: none; } .footer h3 { color:white;  } .breadcrumb { padding: 0 4vw 0 4vw; display: inline-block; margin-bottom: 5vw; }  @media (min-width: 601px) and (max-width: 1200px) {  body { line-height: 5vw; letter-spacing: 0.3vw; font-size: 3vw; gap: 3vw; } h1, h2, h3 { line-height: 1.2; margin-top: 2vw; letter-spacing: 0.5vw; } p { padding: 3vw 0 3vw 0; }  .flexible-image { max-width: 900px !important;  }  .mobile-header { height: 12vw; } .menu-link { padding: 2vw 0 2vw 5vw; }  .post-tags li, .archive-set-post-tags li { margin: 2vw; } .meta-info li { margin: 2vw; } .pagination ul { gap: 8vw; font-size: 5vw; line-height: 9vw; padding: 5vw; }  .random-post-tags li { margin: 2vw; }  .tag-cloud li a { padding: 1vw 2vw; font-size: 2vw; border-radius: 1vw; } .tag-cloud { gap: 4vw; padding: 2vw; }  .footer-social-pages a { margin-top: 5vw; } }  @media (min-width: 1201px) {  body { line-height: 2vw; letter-spacing: 0.1vw; font-size: 1.2vw; gap: 2vw; grid-template-columns: 2fr 1fr; grid-template-areas: 'header header' 'main sidebar-widgets' 'random random' 'footer footer'; } p { padding: 1vw 0 1vw 0; } h1,h2,h3 { line-height: 2.0; margin-top: 0vw; letter-spacing: 0.2vw; } input[type="text"], input[type="email"], input[type="url"], textarea, input[type="submit"] { padding: 0.8vw; width: 72%; }  .flexible-image { max-width: 1100px !important;  } .flexible-image { margin-top: 2vw; } .contact-section-banner{ border-radius: 1vw; }   .header { display: flex; justify-content: space-between; align-items: center; height: 5vw; padding: 1vw; } .desktop-header { display: block; } .mobile-header { display: none; } .menu { list-style-type: none; display: flex; justify-content: right; position: static; width: auto; } .menu-link { padding: 0 1.2vw 0 1.2vw; } .menu-icon { display: none; } .menu-link-current { font-size: 1.5vw;  } .header-text { font-size: 1.8vw; }   .meta-info li { padding: 0 2vw 0 0; margin: 0; } .post { border: 0.1vw solid #ddd; box-shadow: 0 0.2vw 1vw rgba(0, 0, 0, 0.1); border-radius: 1vw; margin: 0 0 0 2vw; padding: 1.5vw 1.5vw 3vw 1.5vw; } .post img { border-radius: 1vw; margin: 2vw; width: 80%;  }  .post-tags ul, .archive-set-post-tags ul { margin: 2vw; } .post-tags li, .archive-set-post-tags li { padding: 0 2vw 0 0; margin: 0; } .share-this-post li { margin-bottom: 1vw; }  .archive-set { grid-template-columns: 1fr; gap: 2vw; padding: 0vw 0 0 2vw; } .archive-set-column { border: 0.1vw solid #ddd;  box-shadow: 0 0.2vw 1vw rgba(0, 0, 0, 0.1);  border-radius: 1vw; padding: 2vw; } .archive-set-column img { box-shadow: 0 0.2vw 1vw rgba(0, 0, 0, 0.1);  border-radius: 1vw; } .archive-set-post-title { font-size: 1.5vw; } .opening-content-box { box-shadow: 0 0.2vw 0.8vw rgba(0, 0, 0, 0.1);  border: 0.1vw solid #ddd;  border-radius: 0.8vw; padding: 1vw 2vw 1vw 2vw; margin: 0 0 2vw 2vw; } .horizontal-main-container { flex-direction: row;  gap: 1vw;  } .horizontal-main-column-img { flex: 2;  } .horizontal-main-column-text { flex: 3;  } .horizontal-main-column-img, .horizontal-main-column-text { border: 2px solid #ccc;  padding: 1vw 1vw 1vw 1vw; } .pagination ul { gap: 2vw; font-size: 2vw; line-height: 4vw; padding: 2vw; } .pagination li { width: 4vw; }  .form { padding: 1vw 0 1vw 0; border-radius: 1vw; width: 60% }  .sidebar-widgets { border: 0.1vw solid #ddd; box-shadow: 0 0.2vw 1vw rgba(0, 0, 0, 0.1); border-radius: 1vw; margin: 0 2vw 0 0; height: 160vw; padding: 1.5vw 0 0 0; } .horizontal-sidebar-widgets-container { gap: 1vw; padding: 1vw 1vw 3vw 1vw; } .horizontal-sidebar-widgets-column-img img { border-radius: 0.5vw; } .sidebar-widgets-post-title { font-size: 1.5vw; line-height: 2.5vw; padding-bottom: 1vw; }  .tag-cloud { padding: 2vw; gap: 2vw; } .tag-cloud li a { padding: 0.5vw 1vw; font-size: 1vw; border-radius: 0.5vw; border: 0.1vw solid #ccc; }   .random-posts { grid-template-columns: 1fr 1fr 1fr 1fr; gap: 2vw; padding: 2vw 2vw 0 2vw; } .random-posts-column { border: 0.1vw solid #ddd;  box-shadow: 0 0.2vw 1vw rgba(0, 0, 0, 0.1);  border-radius: 1vw; padding: 2vw; } .random-posts-column img { border-radius: 1vw; margin: 2vw 0 1vw 0; } .random-posts-post-title { font-size: 1.3vw; margin-bottom: 1.2vw; }  .random-post-tags ul { margin: 2vw; } .random-post-tags li { padding: 0 2vw 0 0; margin: 0; }   .footer { grid-template-columns: 1fr 1fr 1fr; gap: 4vw; padding: 3vw; } .footer-social-pages a { margin: 1vw 0 1vw 0; line-height: 2; } .footer-content-box { grid-column: span 3; } .breadcrumb { padding: 0; margin-bottom: 0; } }