/*---------------------------------------------------------------
    Template Name: Carvestawoods Multipage Wood Work Website Template
    Description: Carvestawoods Multipage Wood Work Website Template
    Author: Lucid Themeslab
    Author URL: https://www.templatemonster.com/store/lucid_themeslab/
    Version: 2.0.0
  -----------------------------------------------------------------
      CSS INDEX
      ==================
      1.  BASIC STYLES
      2.  HOMEPAGE STYLES
      3.  ABOUT US PAGE STYLES
      4.  SERVICE PAGE STYLES
      5.  PORTFOLIO PAGE STYLES
      6.  BLOG PAGE STYLES
      7.  BLOG DETAIL PAGE STYLES
      8.  SERVICE DETAIL PAGE STYLES
      9.  PORTFOLIO DETAIL PAGE STYLES


----------------------------------------------------------------*/

@import url('https://fonts.googleapis.com/css2?family=Julius+Sans+One&family=Mallanna&display=swap');

  /* ==================
    1. BASIC STYLES 
  ================== */

  [data-cv-theme="light"]{  
      /* colors */
      --body-bg:#ffffff;
      --white-bg:#F8F9FA;
      --head-bg:#ffffff;
      --prime-bg:#302424;
      --secondary-color:#b98c57;
      --alt-bg:#fff9f0;
      --card-bg:#ffffff;
      --input-bg:#493d3d;
      --footer-bg:#302424;
      --footer-copy-bg:#493d3d;
      --light-gray:#fafafa;
      --danger-color:#fe6464;
      --toggle-light:#ffe4c2;
      --sun-bg:#f6b40b;

      --body-txt: #FFF7ED;
      --head-txt: #302424;
      --secondary-text:#b98c57;
      --banner-txt: #F8F9FA;
      --white-txt: #F8F9FA;
      --prime-txt: #302424;
      --alt-txt: #E8DBC9;
      --input-txt: #F8F9FA;
      --footer-txt: #F8F9FA;
      --footer-copy-txt: #F8F9FA;

      --prime-shade8:  rgba(48, 36, 36, 0.8);
      --prime-shade6:  rgba(48, 36, 36, 0.6);
      --prime-shade3:  rgba(48, 36, 36, 0.3);

      --prime-stroke: #302424;
      --secondary-stroke: #F8F9FA;
      --tertiary-stroke: #FFF7ED;

      --prime-btn:  #F8F9FA;
      --prime-btn-txt: #302424;
      --prime-outline-btn: #F8F9FA;
      --prime-outlinebtn-txt:#F8F9FA;
      --alt-btn :#302424;
      --alt-btn-txt:#F8F9FA;
      --alt-outline-btn:#302424;
      --alt-outlinebtn-txt:#302424;

      /* fonts */
      --PrimaryFont : "Julius Sans One", sans-serif;
      --SecondaryFont : "Mallanna", sans-serif;
  }

  [data-cv-theme="dark"]{  
    /* colors */
    --body-bg:#201818;
    --white-bg:#F8F9FA;
    --head-bg:#382b2b;
    --prime-bg:#534444;
    --secondary-color:#b98c57;
    --alt-bg:#332929;
    --card-bg:#443535;
    --input-bg:#493d3d;
    --footer-bg:#302424;
    --footer-copy-bg:#493d3d;
    --danger-color:#fe6464;
    --toggle-dark:#7f5014;
    --moon-bg:#1a0f02;

    --body-txt: #F8F9FA;
    --head-txt: #F8F9FA;
    --secondary-text:#b98c57;
    --banner-txt: #F8F9FA;
    --white-txt: #F8F9FA;
    --prime-txt: #F8F9FA;
    --alt-txt: #F8F9FA;
    --input-txt: #F8F9FA;
    --footer-txt: #F8F9FA;
    --footer-copy-txt: #F8F9FA;
    --light-gray:#5f4e4e;

    --prime-shade8:  rgb(83, 68, 68, 0.8);;
    --prime-shade6:  rgb(83, 68, 68, 0.6);;
    --prime-shade3:  rgb(83, 68, 68, 0.3);;

    --prime-stroke: #F8F9FA;
    --secondary-stroke: #F8F9FA;
    --tertiary-stroke: #F8F9FA;

    --prime-btn:  #F8F9FA;
    --prime-btn-txt: #4E320F;
    --prime-outline-btn: #F8F9FA;
    --prime-outlinebtn-txt:#F8F9FA;
    --alt-btn :#F8F9FA;
    --alt-btn-txt:#4E320F;
    --alt-outline-btn:#F8F9FA;
    --alt-outlinebtn-txt:#F8F9FA;

    /* fonts */
    --PrimaryFont : "Julius Sans One", sans-serif;
    --SecondaryFont : "Mallanna", sans-serif;
}

  /* Background-colors */
  .body-bg{
    background-color:var(--body-bg);
  }

  .card-bg{
    background-color:var(--card-bg);
  }

  .white-bg{
    background-color:var(--white-bg);
  }
  .head-bg{
    background-color:var(--head-bg);
  }
  .prime-bg{
    background-color:var(--prime-bg);
  }
  .alt-bg{
    background-color:var(--alt-bg);
  }
  .input-bg{
    background-color:var(--input-bg) !important;
  }
  .footer-bg{
    background-color:var(--footer-bg);
  }
  .footer-copy-bg{
    background-color:var(--footer-copy-bg);
  }

  /* text-colors */
  .body-txt{
    color:var(--body-txt) !important;
  }
  .head-txt{
    color:var(--head-txt) !important;
  }
  .banner-txt{
    color:var(--banner-txt) !important;
  }
  .white-txt{
    color:var(--white-txt) !important;
  }
  .prime-txt{
    color:var(--prime-txt) !important;
  }
  .alt-txt{
    color:var(--alt-txt) !important;
  }
  .input-txt{
    color:var(--input-txt) !important;
  }
  .footer-txt{
    color:var(--footer-txt) !important;
  }
  .footer-copy-txt{
    color:var(--footer-copy-txt) !important;
  }

  .secondary-text{
    color:var(--secondary-text) !important;
  }

  /* Shades */

  .prime-shade8{
    background-color: var(--prime-shade8);
  }
  .prime-shade6{
    background-color: var(--prime-shade6);
  }
  .prime-shade3{
    background-color: var(--prime-shade3);
  }

  .stroke-secondary{
    border-color: var(--secondary-color);
  }
 

  /* Strokes */

  .prime-stroke{
    border-color: var(--prime-stroke) !important;
  }
  .secondary-stroke{
    border-color: var(--secondary-stroke) !important;
  }
  .tertiary-stroke{
    border-color: var(--tertiary-stroke) !important;
  }
 
  /* buttons */
 
  .prime-btn{
 
    text-transform: uppercase;
    font-size:18px;
    background-color: var(--prime-btn);
    border:1px solid var(--prime-btn);
    color: var(--prime-btn-txt);
    min-width: 75px;
    border-radius: 5px;
  }  
  .prime-btn:hover{
    background-color: var(--secondary-color) !important;
    border:1px solid var(--secondary-color) !important;
    color: var(--white-txt) !important;
    min-width: 75px;
    border-radius: 5px;
  }  
  .prime-outline-btn{
   
    text-transform: uppercase;
    font-size:18px;
    border:1px solid var(--prime-outline-btn);
    color: var(--prime-outlinebtn-txt);
    min-width: 75px;
    border-radius: 5px;
  }  
  .prime-outline-btn:hover{
    background-color: var(--secondary-color) !important;
    border:1px solid var(--secondary-color)  !important;
    color: var(--white-txt) !important;
    min-width: 75px;
    border-radius: 5px;
  }  
  
  .alt-btn{
    text-transform: uppercase;
    font-size:18px;
    background-color: var(--alt-btn) !important;
    border:1px solid var(--alt-btn) !important;
    color: var(--alt-btn-txt) !important;
  }  

  .alt-btn:hover{
    background-color: var(--secondary-color) !important;
    border:1px solid var(--secondary-color) !important;
    color: var(--white-txt) !important;
    min-width: 75px;
    border-radius: 5px;
     text-transform: uppercase;
  }  

  /* ===== Buttons ===== */
.alt-outline-btn {
  display: inline-block;
  padding: 0.6rem 1.4rem;
  border: 2px solid var(--secondary-color);
  color: var(--secondary-color);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-radius: 5px;
  transition: all 0.3s ease;
  text-decoration: none;
}

.alt-outline-btn:hover {
  background: var(--secondary-color);
  color: #fff;
  border-color: var(--secondary-color);
}

  .prime-font{
    font-family: var(--PrimaryFont);
  }
  .second-font{
    font-family: var(--SecondaryFont);
  }