
:root{
  --green:#73b711;
  --green2:#8bd21e;
  --green3:#5d980b;
  --gold:#c69a5a;
  --brown:#9b6a34;
  --dark:#222;
  --paper:#fff;
  --grey:#e9e9e9;
  --line:#d5d5d5;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:Arial, Helvetica, sans-serif;
  background:#e7e7e7;
  color:#000;
  line-height:1.35;
}
a{color:inherit;text-decoration:none}
.wrapper{
  width:1080px;
  max-width:calc(100% - 24px);
  margin:0 auto;
  background:#fff;
  min-height:100vh;
}
.header{
  height:340px;
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(0,0,0,.10),rgba(0,0,0,.0)),
    radial-gradient(circle at 64% 6%,rgba(255,255,255,.6),transparent 12%),
    linear-gradient(180deg,#14540d 0%,#2d8116 40%,#77bc29 65%,#e6c690 100%);
}
.header:before{
  content:"";
  position:absolute;left:0;right:0;bottom:0;height:100%;
  background:
    radial-gradient(circle at 16% 20%,#073b0d 0 70px,transparent 72px),
    radial-gradient(circle at 26% 18%,#06400d 0 85px,transparent 86px),
    radial-gradient(circle at 78% 18%,#06400d 0 75px,transparent 76px),
    radial-gradient(circle at 92% 16%,#073b0d 0 80px,transparent 82px);
  opacity:.62;
}
.header:after{
  content:"";
  position:absolute;
  right:0;top:60px;width:360px;height:230px;
  background:
    linear-gradient(35deg,#f6e7c0,#d6aa6c 48%,#f3ddaf 49% 68%,#c9944d 69%);
  clip-path:polygon(26% 24%,100% 0,100% 80%,42% 100%,0 76%);
  box-shadow:0 12px 24px rgba(0,0,0,.18);
  opacity:.95;
}
.loghouse{
  position:absolute;left:92px;top:20px;width:360px;height:210px;
}
.loghouse:before{
  content:"";
  position:absolute;left:24px;right:30px;bottom:20px;height:126px;
  background:repeating-linear-gradient(0deg,#8e6a43 0 11px,#63482f 11px 19px);
  border:5px solid rgba(71,45,25,.65);
}
.loghouse:after{
  content:"";
  position:absolute;left:0;right:10px;top:0;height:105px;
  background:#8b5e35;
  clip-path:polygon(0 100%,26% 18%,55% 0,100% 100%);
  border-bottom:8px solid rgba(255,255,255,.45);
}
.header-text{
  position:absolute;left:28px;bottom:84px;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.55);
}
.header-text h1{
  margin:0 0 8px;
  font-size:46px;
  font-weight:400;
  letter-spacing:.2px;
}
.header-text p{
  margin:0;
  font-size:24px;
}
.nav{
  background:linear-gradient(#d5ad73,#ad7c3c);
  border-radius:4px;
  margin:12px 0 118px;
  overflow:hidden;
  display:flex;
  justify-content:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35);
}
.nav a{
  color:#fff;
  text-transform:uppercase;
  font-weight:bold;
  font-size:13px;
  padding:13px 14px;
  border-right:1px solid rgba(255,255,255,.28);
  white-space:nowrap;
}
.nav a:hover,.nav a.active{background:rgba(255,255,255,.12)}
.mainclear{
  display:grid;
  grid-template-columns:236px 1fr 236px;
  gap:28px;
  padding:0 22px 35px;
}
.leftside,.rightside{align-self:start}
.sidebox{
  background:linear-gradient(#8bd51a,#63a30e);
  color:#fff;
  border-radius:5px 5px 0 0;
  padding:11px 11px 14px;
  box-shadow:0 12px 24px rgba(0,0,0,.18);
  margin-bottom:20px;
}
.sidebox h2{
  margin:0 0 11px;
  font-size:19px;
  color:#fff;
}
.side-menu{
  margin:0;
  padding:0;
  list-style:none;
}
.side-menu li{
  border-top:1px solid rgba(255,255,255,.15);
  border-bottom:1px solid rgba(0,0,0,.10);
}
.side-menu a{
  display:block;
  padding:7px 10px;
  color:#fff;
  font-size:13px;
  line-height:1.1;
}
.side-menu a:hover{background:rgba(0,0,0,.10)}
.searchbox{
  height:45px;
  background:linear-gradient(#8ee11d,#64aa0d);
  border-radius:5px;
  box-shadow:0 13px 22px rgba(0,0,0,.18);
  display:flex;
  align-items:center;
  padding:0 10px;
  margin-bottom:70px;
}
.searchbox input{
  width:100%;
  border:0;
  height:27px;
  border-radius:16px;
  padding:0 12px;
  text-transform:uppercase;
  font-size:11px;
}
.content{
  padding-top:54px;
}
.content h1{
  font-family:Georgia,"Times New Roman",serif;
  font-weight:400;
  font-size:28px;
  line-height:1.1;
  margin:0 0 22px;
}
.content h2{
  font-size:20px;
  margin:18px 0 12px;
}
.content .red-title{
  color:red;
  font-size:22px;
  font-weight:bold;
  margin:0 0 36px;
}
.content p{
  font-size:14px;
  text-align:justify;
  margin:0 0 14px;
}
.content ul{font-size:14px;margin:0 0 16px 28px}
.contactbox{
  background:linear-gradient(#82ca19,#609d0b);
  color:#fff;
  padding:14px 12px 18px;
  border-radius:5px 5px 0 0;
  margin-top:140px;
  box-shadow:0 12px 24px rgba(0,0,0,.18);
}
.contactbox h2{
  margin:0 0 50px;
  font-size:20px;
}
.contactbox p{
  margin:0 0 18px;
  color:#fff;
  font-size:15px;
  font-weight:bold;
}
.contactbox a{color:#fff;text-decoration:underline}
.newsbox{
  background:#fff;
  border:1px solid #ddd;
  padding:12px;
  margin-top:18px;
  font-size:13px;
}
.newsbox h2{margin:0 0 10px;color:#5d980b}
.newsitem{margin-bottom:10px}
.newsitem .date{color:#777;font-size:12px}
.photo-card{
  margin-top:20px;
  width:100%;
  height:190px;
  background:
    linear-gradient(180deg,#daecff 0 38%,#79b740 39% 100%);
  border:1px solid rgba(255,255,255,.5);
  position:relative;
  overflow:hidden;
}
.photo-card:before{
  content:"";
  position:absolute;left:25px;right:25px;bottom:38px;height:88px;
  background:repeating-linear-gradient(0deg,#7b5730 0 10px,#5b3f24 10px 17px);
  clip-path:polygon(0 100%,20% 38%,50% 0,82% 40%,100% 100%);
}
.gallery{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin:20px 0;
}
.gallery div{
  height:135px;
  background:
    linear-gradient(180deg,#d7edff 0 38%,#78b63f 39% 100%);
  border:1px solid #ccc;
  position:relative;
}
.gallery div:after{
  content:"";
  position:absolute;left:16px;right:16px;bottom:28px;height:65px;
  background:repeating-linear-gradient(0deg,#7b5730 0 9px,#5b3f24 9px 15px);
  clip-path:polygon(0 100%,20% 38%,50% 0,82% 40%,100% 100%);
}
.footer{
  background:#d0d0d0;
  padding:22px;
  color:#555;
  font-size:12px;
}
.footer-menu{
  margin:14px 0 0;
  padding:0;
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.footer-menu a{text-decoration:underline}
.inner{
  padding:45px 22px 60px;
  display:grid;
  grid-template-columns:236px 1fr 236px;
  gap:28px;
}
.inner-card{
  background:#fff;
  padding-top:24px;
}
.inner-card h1{
  font-family:Georgia,"Times New Roman",serif;
  font-weight:400;
  font-size:28px;
  margin:0 0 20px;
}
.inner-card p,.inner-card li{
  font-size:14px;
  line-height:1.45;
}
.cards{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
  margin:20px 0;
}
.card{
  border:1px solid #ddd;
  padding:15px;
  background:#fafafa;
}
.card h3{margin:0 0 8px;color:#5d980b}
@media(max-width:1060px){
  .wrapper{max-width:calc(100% - 16px)}
  .mainclear,.inner{grid-template-columns:1fr}
  .content{padding-top:10px}
  .contactbox{margin-top:20px}
  .nav{flex-wrap:wrap;margin-bottom:30px}
  .header-text h1{font-size:34px}
  .header-text p{font-size:18px}
  .cards,.gallery{grid-template-columns:1fr}
}
