@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Text:ital@0;1&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

body {  font-family: 'Roboto', sans-serif; font-style:normal; font-size: 22px; color:var(--bs-brown); font-weight: 400;
   background:#f2efdc;}
  h1,h2,h3,h4,h5,h6 {
    color: var(--bs-heading);     font-weight: 400;
  }
:root {
  --bs-brown: #764c29;
   --bs-heading: #0f6936;
  }

  .heading_1 {  color: var(--bs-heading); }
    .heading_2 {  color: var(--bs-brown); font-family: "DM Serif Text", serif; font-style: italic; }
    .corner { background-image: url("../images/corner.jpg"); position: relative;  background-repeat:no-repeat; margin: 5% 0 2%; padding:85px 0 0 80px ; background-position: left top;}
    .corner span { position: absolute; right: 0; top: 0;}
      .corner h1 { font-size: 70px; line-height: 80px; margin-bottom: 35px; font-family: "DM Serif Text", serif;}
.conter h1,h2,h3,h4 { color: var(--bs-heading); font-weight:900; font-family: 'Roboto', sans-serif;}
     .corner strong { font-weight: 800;}
  .navbar {

    --bs-navbar-brand-font-size: 1.55rem !important;

  }
.green-box { background: var(--bs-heading); padding: 15px; text-align: center; color: #fff; font-weight: 500; font-size: 25px;}

.fixed-image {
  position: fixed;
  top: 20px; /* 20px from the bottom of the viewport */
  right: 20px; /* 20px from the right of the viewport */
   /* Optional: set a width for the image */
  height: auto; /* Optional: maintain aspect ratio */
}

.btn-brown {
  --bs-btn-color: #fff;
  --bs-btn-bg: #5d3919;
  --bs-btn-border-color: #5d3919;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #5d3919;
  --bs-btn-hover-border-color: #5d3919;
  --bs-btn-focus-shadow-rgb: 225, 83, 97;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #5d3919;
  --bs-btn-active-border-color: #5d3919;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #5d3919;
  --bs-btn-disabled-border-color: #5d3919;
}

.fs-7 { font-size: 45px; line-height: 40px;}
@media (min-width: 1600px) {
    .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
        max-width: 1420px;
    }
}

.footerline { display: flex;  background-image: url("../images/line-footer.jpg"); background-repeat: no-repeat;
   background-size: cover; background-position: bottom right; position: relative; padding:105px 30px 0 30px; }

  .accordion {
    --bs-accordion-active-color: #000 !important;
    --bs-accordion-active-bg: #fff !important;
    --bs-accordion-btn-icon: url(../images/plus.png);
    --bs-accordion-btn-active-icon:url(../images/minus.png);

  }

  .accordion-item { border: none !important;}
  .form-check-input:checked {
    background-color: #000;
    border-color: #000;
}

  a { color: #000;}
  a:hover { color: #000; text-decoration: underline;}
  .gray_box { background: #F2F2F2;}
  .bg-pitch { background: #efeee7; padding: 3% 0; }
  .bg-gray { background: #9F9F9F; padding: 3% 0; min-height: 150px; }

  .nav-link { color: #fff;}


  .list { margin: 0; padding: 0;  }
  .list ul {
 
    list-style: none;
    border-bottom: 1px dashed #000; padding-bottom: 20px;  padding-left: 10px;
  }
  
  .list li {
     line-height: 38px;
  }
  .list li input { margin-right: 5px;}

  



  .list1 { margin: 0; padding: 0;  }
  .list1 ul {
    --icon-space: 0.8em;
    list-style: none;
    padding: 0; margin-left: 17px; padding-bottom: 20px; padding-left: 10px;
  }
  
  .list1 li {
    padding-left: var(--icon-space);  line-height: 32px;
  }
  .list1 a {  text-decoration: none; }
  .list1 li a:hover { text-decoration: underline;  }
  .list1 li:before {
    content: "•";
   
    display: inline-block; color:var(--bs-brown); line-height: 25px; font-size: 25px;  
    margin-left: calc( var(--icon-space) * -1 );
    width: var(--icon-space);
  }


  
  .list2 { margin: 4% 0 0 0; padding: 50px 0 5px 20px; background: var(--bs-heading);  }
  .list2 ul {
   
    list-style: none;
    padding: 0; margin-left: 17px; padding-bottom: 30px; padding-left: 10px;
  }
  
  .list2 li {
      line-height: 40px; margin-bottom: 25px; background: url(../images/bullet.jpg) no-repeat left; padding-left: 55px; color: #fff;
  }
  .list2 a {  text-decoration: none; }
  .list2 li a:hover { text-decoration: underline;  }
  


  .list3 { margin: 0; padding: 0;  }
  .list3 ol {
 

    padding: 0;  padding-bottom: 20px; padding-left: 10px;
  }
  
  .list3 li {
   line-height: 30px;
  }
.list3 li strong { color:  var(--bs-heading);}

  @media (min-width: 1900px) {
  .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
      max-width: 1420px;
  }
  body { font-family: 'Roboto', sans-serif; font-size: 24px; font-weight: 500;}
}




/*------------------------------------------
  Responsive Grid Media Queries - 1280, 1024, 768, 480
   1280-1024   - desktop (default grid)
   1024-768    - tablet landscape
   768-480     - tablet 
   480-less    - phone landscape & smaller
--------------------------------------------*/
@media all and (min-width: 1024px) and (max-width: 1280px) { }
 
@media all and (min-width: 768px) and (max-width: 1024px) { }
 
@media all and (min-width: 480px) and (max-width: 768px) { }
 
@media all and (max-width: 480px) { }
 
/*------------------------------------------
  Foundation Media Queries 
   http://foundation.zurb.com/docs/media-queries.html
--------------------------------------------*/
 
/* Small screens - MOBILE */
@media only screen { } /* Define mobile styles - Mobile First */
 
@media only screen and (max-width: 40em) {
.corner h1 { font-size: 50px; line-height: 60px;}
.corner {  margin: 0;    padding: 35px 0 0 30px; background-size: 70%;}
.footerline { background-size: contain;}
.corner span {position: relative;}
.footerline { padding: 49px 30px 35px 30px;}
.btn-brown  img { width: 35px;}
 .list2 ul { margin-left: 0; padding-left: 0; width: 95%; }

 } /* max-width 640px, mobile-only styles, use when QAing mobile issues */
 
/* Medium screens - TABLET */
@media only screen and (min-width: 40.063em) { } /* min-width 641px, medium screens */
 
@media only screen and (min-width: 40.063em) and (max-width: 64em) { } /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */
 
/* Large screens - DESKTOP */
@media only screen and (min-width: 64.063em) { } /* min-width 1025px, large screens */
 
@media only screen and (min-width: 64.063em) and (max-width: 90em) { } /* min-width 1024px and max-width 1440px, use when QAing large screen-only issues */
 
/* XLarge screens */
@media only screen and (min-width: 90.063em) { .heading1 { font-weight: bold !important;}   .mt-6 { margin-top: 90px !important;}} /* min-width 1441px, xlarge screens */
 
@media only screen and (min-width: 90.063em) and (max-width: 120em) { } /* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */
 
/* XXLarge screens */
@media only screen and (min-width: 120.063em) { } /* min-width 1921px, xlarge screens */
 
/*------------------------------------------*/
 
 
 
/* Portrait */
@media screen and (orientation:portrait) { /* Portrait styles here */ }
/* Landscape */
@media screen and (orientation:landscape) { /* Landscape styles here */ }
 
 
/* CSS for iPhone, iPad, and Retina Displays */
 
/* Non-Retina */
@media screen and (-webkit-max-device-pixel-ratio: 1) {
}
 
/* Retina */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5) {
}
 
/* iPhone Portrait */
@media screen and (max-device-width: 480px) and (orientation:portrait) {
} 
 
/* iPhone Landscape */
@media screen and (max-device-width: 480px) and (orientation:landscape) {
}
 
/* iPad Portrait */
@media screen and (min-device-width: 481px) and (orientation:portrait) {
}
 
/* iPad Landscape */
@media screen and (min-device-width: 481px) and (orientation:landscape) {
}
 
@media screen and (max-device-width: 996px)  {


.fixed-image {
  position: fixed;
  top: 40%; /* 20px from the bottom of the viewport */
  right: 20px; /* 20px from the right of the viewport */
   /* Optional: set a width for the image */
  height: auto; /* Optional: maintain aspect ratio */
}

.fixed-image img { width: 100px;}

}