:root {
/* 221 web colors */
--green: #63523C;
--lite-green: #d7cec2;
--white: antiquewhite;
--dark:#151110;
--red:#B32C15;

  --bs-font-sans-serif: $font-family-sans-serif, system-ui, -apple-system, 'minion-pro'
  ;
}


 html {
  padding: 0px;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
}

.body {
  background-color: #151110;
  position: relative;
  padding-top: 3rem;
  height: 100%;
  overflow-x: hidden;
  overflow-y: scroll; 

  
}


/* TEXT ===================================================*/

/*  Adobe Font = Minion  */
/*AVENIR FONT STUFF*/
@font-face {
    font-family: 'Avenir Next LT Pro';
    src: url('AvenirNextLTPro-Regular.woff2') format('woff2'),
        url('AvenirNextLTPro-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Avenir Next LT Pro';
    src: url('AvenirNextLTPro-It.woff2') format('woff2'),
        url('AvenirNextLTPro-It.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Avenir Next LT Pro';
    src: url('AvenirNextLTPro-Bold.woff2') format('woff2'),
        url('AvenirNextLTPro-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}



.glow-text {
    color: antiquewhite;
    font-size: 3rem;
    text-align: center;
    -webkit-animation: glow 5s ease-in-out infinite alternate;
    -moz-animation: glow 5s ease-in-out infinite alternate;
    animation: glow 5s ease-in-out infinite alternate;
  }

  
  .glow{
   text-align: center;
    -webkit-animation: glow 5s ease-in-out infinite alternate;
    -moz-animation: glow 5s ease-in-out infinite alternate;
    animation: glow 5s ease-in-out infinite alternate;
  }
  @-webkit-keyframes  glow {
    from {
      text-shadow: 0 0 15px #fff
    }
    to {
      text-shadow: 0 0 20px #fff,  0 0 80px #ff4da6;
    }
  }
  
  @keyframes glow {
    from {
      text-shadow: 0 0 15px #fff
    }
    to {
      text-shadow: 0 0 20px #fff,  0 0 80px #ff4da6;
    }
  }



.headline-page {
  text-align: center;
  color:#faebd7 ;
  font-size: 2.5rem;
  margin-top: 5rem;
  padding-top: 5rem;
}

.headline-page-device {
  text-align: center;
  background-color: #63523C;
  color:#faebd7 ;
  font-size: 1.5rem;
  margin-top: 0rem;
  padding: .5rem 0rem;
}

.dropc {
    color:antiquewhite;
    float: left;
    font-size: 75px;
    line-height: 60px;
    padding-top: 4px;
    padding-right: 8px;
    padding-left: 3px;
  }


   
/* TAB STYLING */

.tab-bg-align {
  margin-top: -2rem;
  width: 100%;
  height: 100%;
  border-radius: 8px;
}

        
.main-container {
    background: transparent;
        width: 100%;
    /*backdrop-filter: blur(10px);*/   
}

.nav-tabs {
    border-bottom: 1px solid antiquewhite;
    margin-bottom: 2rem;
    justify-content: center;
    
}
        
.nav-tabs.nav-link {
    line-height: 1.2;
    font-size: 1rem;
    text-decoration: none ;
    text-align: center;
     background-color: antiquewhite;
     color: black !important;
     padding: .5rem;
     margin: 0rem 1rem;
     box-shadow: none;
     border: none;
    border-radius: 4px 4px 0px 0px;

}

@media (max-width: 700px) {
.nav-tabs .nav-link {
    text-align: center !important;

    align-content: center;
    border-radius: 4px !important;
    width: 20rem;
    height: 2rem;
    margin-bottom: 1rem !important;

}
}
        
.nav-tabs .nav-link:hover {
    background-color: var(--lite-green) !important;
         color: rgb(126, 126, 126) !important;
         font-weight: 100;
}

.nav-tabs .nav-link.active {
    background-color: var(--red)!important;
    color: antiquewhite !important; 
}


        
.tab-content {
    min-height: 300px;
    background-color: transparent; 

}

.tab-pane {
    animation: fadeIn 0.5s ease-in;  
     
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}


.nav-tabs .nav-link {
      line-height: 1.2;
    font-size: 1rem;
    text-decoration: none ;
    text-align: center;
     background-color: antiquewhite;
     color: black !important;
     padding: .5rem;
     margin: 0rem 1rem;
     box-shadow: none;
     border: none;
    border-radius: 4px 4px 0px 0px;
}

 
/*HOME PAGE===========================*/
.bgimg-1 {
    background-image: url(/Images/Grolier-cat/Looking-North-scaled_fixed.jpg);
   height: 100%;
    position: relative;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }
  .bgimg-1-d {
    background-image: url(/Images/home-device.png);
    min-height:1000px;
    position: relative;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }
  

  .vert-center-text {
    position: absolute; 
    top: 20%; 
   left: 20%;
    text-align: center; 
    width: 100%; 
    z-index: 10;
    
  }
  
  .vert-center-text img {
    padding: 0rem;
    margin: 0rem 0rem 0rem 0rem;
  }
  .vert-center-text h1 { 
     color: rgb(0, 0, 0);
     font-size: 4rem;
  }
  

 /*ABOUT================================================*/ 

 .bgimg-about1 {
  background-image: url(/Images/leather_bg2.jpg);
  min-height:1000px;
  background-size: contain;
  background-repeat: repeat;
  
}
.bgimg-about2 {
  background-image: url(/Images//bookcover_bg2.jpg);
  min-height:1000px;
  background-size: contain;
  background-repeat: repeat;
}
.bgimg-about3 {
  background-image: url(/Images/texture_bg2.jpg);
  min-height:1000px;
  background-size:contain;
  background-repeat: repeat;
}

 .floater img {
  float: right;
  margin: 0rem 2rem;
  border-radius:8px;
 width: 40%;
}
 .ptext {
  text-align: justify;
  color: antiquewhite;
  line-height: 1.3;
  font-size: 1.2rem;
  font-weight: 200;
  text-align: justify;
  width: 100%;

}
.lead {
  color: antiquewhite;
  font-size: 2rem;
  font-weight: 600;
  text-align: center;
  padding-top: 1rem;
  padding-bottom: 1rem;
}


/* CATALOGUE================================================*/

.card-cat {
  width: 16rem; 
  margin: 0rem .25rem 2rem .25rem; 
  padding: 0rem;
  position: relative;
 
  }

  .card-cat img {
  width: 20rem;
  height: 8rem; 
  overflow: hidden;
  border-radius: 8px 8px 0px 0px;
  display: block;
  border: 1px solid antiquewhite;
  border-radius: 8px 8px 0px 0px;
  }

  .card-cat-v {
    width: 14rem; 
    margin: 0rem .25rem 2rem .25rem; 
    padding: 0rem;
    position: relative;
    }

  .card-cat-v img {
    width: 8rem;
    height: 10rem; 
    overflow: hidden;
    border-radius: 8px 8px 0px 0px;
    display: block;
    border: 1px solid antiquewhite;
    border-radius: 8px 8px 0px 0px;
    }

/*THIS WORK================================================*/

.bgimg-tw {
    background-image: url(/Images/thiswork/pierre-bamin-tY7hL5Bu7Ic-unsplash_fixed.png);
    min-height:1000px;
    background-size: cover;
    background-repeat: no-repeat;

  }

/*VENUES==============================================================================================================================================*/
.bgimg-venue1 {
  background-image: url(/Images/Grolier-cat/Looking-North-scaled_fixed.jpg);
  min-height:1000px;
  background-size: cover;
  background-repeat: no-repeat;
}
.bgimg-venue2 {
  background-image: url(/Images/Grolier-cat/Looking-South-scaled_fixed.jpg);
  min-height:1000px;
  background-size: cover;
  background-repeat: no-repeat;
  
}
.bgimg-venue3 {
  background-image: url(/Images/Grolier-cat/Looking-North-scaled_fixed.jpg);
 height: 100vh;
  background-size: cover;
  background-repeat: no-repeat;
}

.headline-venue {
  text-align: center;
  color:antiquewhite ;
  font-size: 2rem;
  margin-top: -1rem;
}

.headline-venue-d {
  text-align: center;
  color:antiquewhite ;
  font-size: 1.5rem;
  margin: -1rem 0rem 0rem 0rem;
}

.desc-venue {
  font-size: 1.2rem;
  line-height: 1.4rem;
  font-weight: 100;
  text-align: center;
  color:antiquewhite ;
  padding-bottom: 2rem;
  max-width: 1000px;
}
.desc-venue-d {
  font-size: 1.1rem;
  line-height: 1.4rem;
  font-weight: 100;
  text-align: justify;
  color:antiquewhite ;
  padding-bottom: 2rem;
}

.card-text-venues {
 text-align: center;
 font-size: 1rem;
 line-height: 1rem;
 color: antiquewhite;
 padding-top: .5rem;

}

.case-number {
  color: antiquewhite;
  font-size: 1rem;
  text-align: center;
  font-weight: 600;
}


.modal { 
  overflow: auto !important; 
}

.modal-content{
  background-color: antiquewhite;
}

.modal-header {
  background-color: #B32C15;
  height: 2rem;
}
.modal-title {
  color:  #B32C15;
  font-size: 1.5rem;
}
.modal-paragraph {
  color: black !important;
    margin-left:0rem ;
    margin-top: 1rem;
    text-align: left;
     font-size: 1.1rem;
}
.modal-paragraph-sub {
  color: rgb(0, 0, 0) !important;
    margin-left:0rem ;
    margin-top: 1rem;
    text-align: left;
    font-size: .8rem;
}

.modal-title-caret {
  color: var(--red) !important;
  font-size: 2rem;
    text-align: center;
    text-decoration: none;
    padding: 0rem 1rem;  
}
.caret-venue{
  font-size: 2rem;
  color: var(--red) !important;


}

.modal-tip {
  color: black !important;
  font-size: .8rem;
  font-style: italic;
  text-align: center;
}
.modal-title-case {
  color: black;
  font-weight: 600;
  font-size: 1.5rem;
  padding-bottom: 1rem;
  
}
.btn-close {
  fill: antiquewhite !important;
}

.carousel-control-prev-icon {
margin-left: -14rem;
  color: antiquewhite;

}
.carousel-control-next-icon {
  margin-right: -14rem;
    color: antiquewhite;
  
  }
  .modal-dialog a {
        pointer-events: all !important;
    }
    .modal-dialog {
    pointer-events: all;
}

/* IN THE NEWS==================================================*/
/*VIDEO*/
.card-news {
  background-color: #faebd7;
  line-height: 1.3;
  font-size: 1.2rem;
  text-align: left;
  margin: 0rem 0rem 2rem 0rem;
  padding: 1rem 0rem 2rem 0rem;
  border-radius: 8px;
  width: 24rem; 
  height: 9rem;
  border:2px solid #717171;
}
/*PRINT*/
.card-news-2 {
  background-color: antiquewhite;
   line-height: 1.3;
   font-size: 1.2rem;
   text-align: left;
   margin: 0rem 0rem 2rem 0rem;
   padding: 1rem 0rem 2rem 0rem;
   border-radius: 8px;
   width: 24rem; 
   height: 9rem;
   border:2px solid #717171;
 }
 .card-news-2-s {
  background-color: antiquewhite;
   text-align: left;
   margin: 0rem 0rem 2rem 0rem;
   padding: 1rem 0rem 2rem 0rem;
   border-radius: 8px;
   width: 24rem; 
   height: 10rem;
   border:2px solid #717171;
 }

 .card-news-2-s img {
 width: 100%;
 height: 10rem;
 }

.card-news iframe{
  margin: -1.1rem 0rem 0rem -1rem;
  border-radius: 8px 0px 0px 8px;
  height: 9rem;
  border:2px solid #717171;
 
}
.click-pdf {
  height: 8.8rem;
  width: 4rem;
  background: none;
  margin-top: -1rem;
}
.card-text-1 {
  line-height: 1.2;
    font-size: .8rem;
    text-align: left;
    padding-top: 1rem;
    padding-right: .5rem;
    margin: 1rem 0rem 0rem 0rem;
    font-family: Avenir;
  }
  .card-text-2 {
    line-height: 1.2;
      font-size: .8rem;
      text-align: left;
     padding-top: 1rem;
     padding-right: .5rem;
      margin-left: 0rem;
     
      font-family: Avenir;
    }
    .card-text-2-s {
      line-height: 1.2;
        font-size: .8rem;
        text-align: left;
       padding-top: 0rem;
       padding-right: .5rem;
        margin-left: 0rem;
        margin-top: 0rem;
        font-family: Avenir;
      }

    .card-header {
      height: 2rem;
      min-height: 2rem;
      line-height: 1.2;
      font-size: .9rem;
      text-align: left;
      padding: 0rem 0rem 1rem 0rem;
      margin: -.5rem .5rem 0rem .5rem;
      font-family: Avenir;
      font-weight: 600;
      border: none;
      background-color: transparent;
    }
    
    .card-header-s {
      font-size: .9rem;
      text-align: left;
      padding: 0rem 0rem 1rem 0rem;
      margin: 0rem .5rem 0rem .5rem;
      font-family: Avenir;
      font-weight: 600;
      border: none;
      background-color: transparent;
    }
    .card-body {
    height: 5rem;
    min-height: 5rem;
    margin-top:-.5rem;
    }
        
    .card-body-s {
      margin-top:-.5rem;
      }

    .card-footer{
      border: none;
      padding: 0rem;
      background-color: transparent;
      height: 2rem;
      min-height: 2rem;
      margin-right: .5rem;
    }
    .card-footer-s{
      border: none;
      background-color: transparent;
      height: 2rem;
      min-height: 2rem;
      margin-right: 1rem;

    }

.card-button {
  line-height: 1.2;
  font-size: 1rem;
  width: 8rem;
  text-align: center;
   background-color: #B32C15;
   color: antiquewhite;
   padding: .25rem;
   float: inline-end;
 

}
.card-button-v {
  line-height: 1.2;
  font-size: 1rem;
  width: 8rem;
  text-align: center;
   background-color: #717171;
   color: antiquewhite;
   padding: 0rem;
   float: inline-end;
   margin-top: -1rem;

}


/*PLAUDITS========================================================*/
.vert-rule {
  height: 100px;
  width: 4px;
  background-color: #717171;
  border-radius: 4px ; 
  margin-top: 0rem;
  margin-left: -4rem;

}
.vert-rule-d {
  height: 120px;
  width: 4px;
  background-color: #717171;
  border-radius: 4px ; 
  margin-top: 1rem;
  margin-left: -5rem;

}
.card-plaudits {
  background: none;
  border: none;
  line-height: 1.3;
  font-size: 1.2rem;
  text-align: left;
  margin-top: 0rem;

}
.card-body-plaudit {
  height: fit-content;
  margin:0rem 0rem 0rem -5rem;
}
.card-text-plaudit {
  margin-top: .5rem;
 text-align: center;
 font-size: 1rem;
 line-height: 1rem;
 color: black;
}
.card-text-plaudit-d {
  margin: .5rem 2rem 0rem 1rem;
 text-align: left;
 font-size: 1rem;
 line-height: 1.2rem;
 color: black;
}


.card-text-attr-plaudit {
  line-height: 1.2;
  font-size: .9rem;
  text-align: right;
  margin-left: 10%;
}
.card-text-attr-plaudit-d {
  line-height: 1.2;
  font-size: .9rem;
  text-align: left;

  margin: 1rem 2rem 0rem 2rem;
}


/*PURCHASE========================================================*/
.purchase-img {
  width: 100%;
  margin-bottom: 3rem;
  float: right;
}
.purchase-from {
  color: #000;
  text-align: left;
  padding-bottom: 1rem;
}
.purchase-link-logo {
  margin-left: auto;
  margin-right: auto;
  width: 35%;
  float: left;
}
.purchase-link {
  color: #000;
  text-align: left;
}
.linkbox {
  padding: .5rem;
  border: 1px solid black;
  border-radius: 4px;
  width: 100%;
}
.purchase-link-logo-d {
 
  text-align: center;
}
.purchase-link-d {
  color: black;
  text-align: center;
  text-decoration: none;
}
.card-purchase {
  background-color:#faebd7;
  color: black;
  width: 30rem;
  height: 20rem;
  text-align: center;
  border: 1px solid black;
  border-radius: 10px;
  padding: .5rem;
  margin-bottom: 2rem;
}

.card-purchase-d {
  background-color:#faebd7;
  color: black;
  width:100%;
  height: 20rem;
  text-align: center;
  border: 1px solid black;
  border-radius: 10px;
  padding: .5rem;
  margin-bottom: 2rem;
  margin-left: -1rem;
}

.card-header-purchase {
  color: black;
  line-height: 1.2;
  font-size: 1.2rem;
  text-align: center;
  padding: .5rem 0rem 2rem 0rem;
  border: none;
  background-color: transparent;
}

.card-button-purchase {
  line-height: 1.2;
  font-size: 1rem;
  text-decoration: none ;
  text-align: center;
   background-color:antiquewhite;
   color: black;
   padding: .5rem;
   margin: 2rem 1rem;
   box-shadow: none;
   border: 1px solid black;
   border-radius: 4px;
  
}
.card-button-purchase-d {
  line-height: 1;
  font-size: 1rem;
  text-decoration: none ;
  text-align: center;
   background-color: #0d6efd;
   color: white;
   padding: 1rem .5rem;
   box-shadow: none;
   border: 1px solid black;
   border-radius: 4px;
  
}
.card-button-purchase:hover {
  background-color: #0b4cae;
  color: rgb(255, 255, 255);
}

.card-button-purchase-d:hover {
  background-color: #0b4cae;
  color: rgb(255, 255, 255);
}


/*CONTACT=====================================*/
.bgimg-contact {
  background-image: url(/Images/2-013053-fixed.jpg);
  min-height:100vh;
  background-size: cover;
  background-repeat: no-repeat;
}



 /* =============================================== */ 
  
  
.bg-paper{
  background-image: url(/Images/paper_2.jpg);
  background-repeat:none;
  background-size: cover;
  } 
  
  
  

/* PARALLAX ============================================================================*/
  
  .bgimg-2, .bgimg-3 {
    position: relative;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }

  .bgimg-2 {
    background-image: url("/Images/video/Main_video_01.mp4");
    height:500px;
    background-position: bottom;
  
  }
  
  .bgimg-3 {
    background-image: url("/Images/video/Main_video-slo.mp4");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom;
    min-height: 500px;
     }


/* Turn off parallax scrolling for tablets and phones */
@media only screen and (max-device-width: 800px) {
    .bgimg-1, .bgimg-2, .bgimg-3 .bgimg-about{
      background-attachment: scroll;
    }
  }
  
     /*Parallax keyframes*/    
     @keyframes animate-sca-main {
      0% { transform: scale(1.0); }
      50% { transform: scale(1.07); }
      100% { transform: scale(1.0); }
      }
      @keyframes animate-pos-main {
      0% {background-position: 0% 100%;}
      0% {background-position: 0% 70%;}
      100% {background-position: 0% 100%;}
      }
  




   
    /*Back to Top Button*/
    
    #topBtn {
      display: none;
      /* Hidden by default */
      position: fixed;
      /* Fixed/sticky position */
      bottom: 80px;
      /* Place the button at the bottom of the page */
      right: 15px;
      /* Place the button 30px from the right */
      z-index: 99;
      /* Make sure it does not overlap */
      border: none;
      /* Remove borders */
      outline: none;
      /* Remove outline */
      background-color: #717171;
      /* Set a background color */
      color: white;
      /* Text color */
      cursor: pointer;
      /* Add a mouse pointer on hover */
      padding: 15px;
      /* Some padding */
      border-radius: 10px;
      /* Rounded corners */
      font-size: 18px;
      /* Increase font size */
  }
  
  #topBtn:hover {
      background-color: #D0D0D0;
      /* Add a dark-grey background on hover */
  }

  /* CAPTCHA====================================================*/

          .contact-container {
            background: transparent;
            backdrop-filter: blur(10px);
            border-radius: 20px;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
            padding: 3rem;
            text-align: center;
            max-width: 450px;
           
            border: 1px solid rgba(255, 255, 255, 0.2);
        }
        
        .contact-header {
            margin-bottom: 2rem;
        }
        
        .contact-header h2 {
            color: #2c3e50;
            font-weight: 700;
            margin-bottom: 0.5rem;
            font-size: 2rem;
        }
        
        .contact-header p {
            color: #6c757d;
            font-size: 1.1rem;
            margin-bottom: 0;
        }
        
        .captcha-container {
            background: transparent;
            padding: 1.5rem;
            margin: 2rem 0;
            transition: all 0.3s ease;
        }
        
        .captcha-container:hover {
            border-color: #667eea;
            box-shadow: 0 5px 15px rgba(102, 126, 234, 0.1);
        }
        
        
        /* Center the reCAPTCHA */
        .g-recaptcha {
            display: inline-block;
           
        }
        
        .captcha-wrapper {
            display: flex;
            justify-content: center;
            align-items: center;
        }

/*SCROLLBAR STYLING*/
        ::-webkit-scrollbar{
          height: 12px;
          width: 12px;
        }

        ::-webkit-scrollbar-track{
          background-color: #d9d9d9;
        }

        ::-webkit-scrollbar-thumb{
          background-color: rgb(142, 142, 142);
          border-radius: 12px;
        }