/*
* Template Name: UntreeStore
* Template Author: Untree.co
* Author URI: https://untree.co/
* License: https://creativecommons.org/licenses/by/3.0/
*/
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/************************MessageBoxes*************************/
.messageBoxtext{
  border:none;
  color:black !important;
}
.setCustomModalSlide {
  top: 50%;
  bottom: 50%;
  animation: modalSlide 0.5s forwards;
}
@keyframes modalSlide {
  from {
      transform: translateX(100%);
  }
  to {
      transform: translateX(0);
  }
}

.removeCustomModalSlide {
  top: 50%;
  bottom: 50%;
  animation: removeModalSlide 0.5s forwards;
}
@keyframes removeModalSlide {
  from {
      transform: translateX(0);
  }
  to {
      transform: translateX(200%);
  }
}
.modal-content{
  border-radius: 1.5rem;
}
.modal-header{
  border-top-left-radius: 1.4rem;
  border-top-right-radius: 1.4rem;
}
/****************************************************/

@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");
body, html {
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
}

a {
  text-decoration: none;
  -webkit-transition: .3s all ease;
  -o-transition: .3s all ease;
  transition: .3s all ease;
  color: #2f2f2f;
  text-decoration: underline; }
  a:hover {
    color: #2f2f2f;
    text-decoration: none; }
  a.more {
    font-weight: 600; }

.custom-navbar {
  z-index: 1000;
  position: absolute;
  width: 100%;
  right: 0;
  background: rgb(60, 60, 70);
  padding-bottom: 20px;
  height: 50px;
  margin-bottom: 1.5rem;}
.btn {
  font-weight: 600;
  padding: 12px 30px;
  border-radius: 30px;
  color: #ffffff;
  background: #2f2f2f;
  border-color: #2f2f2f; }
  .btn:hover {
    color: #ffffff;
    background: #222222;
    border-color: #222222; }
  .btn:active, .btn:focus {
    outline: none !important;
    -webkit-box-shadow: none;
    box-shadow: none; }
  .btn.btn-primary {
    background: #3b5d50;
    border-color: #3b5d50; }
    .btn.btn-primary:hover {
      background: #314d43;
      border-color: #314d43; }
  .btn.btn-secondary {
    color: #2f2f2f;
    background: #f9bf29;
    border-color: #f9bf29; }
    .btn.btn-secondary:hover {
      background: #f8b810;
      border-color: #f8b810; }
  .btn.btn-white-outline {
    background: transparent;
    border-width: 2px;
    border-color: rgba(255, 255, 255, 0.3); }
    .btn.btn-white-outline:hover {
      border-color: white;
      color: #ffffff; }

.section-title {
  color: #2f2f2f; }

.product-section {
  padding: 7rem 0; }
  .product-section .product-item {
    text-align: center;
    text-decoration: none;
    display: block;
    position: relative;
    padding-bottom: 50px;
    cursor: pointer; }
    .product-section .product-item .product-thumbnail {
      margin-bottom: 30px;
      position: relative;
      top: 0;
      -webkit-transition: .3s all ease;
      -o-transition: .3s all ease;
      transition: .3s all ease; }
    .product-section .product-item h3 {
      font-weight: 600;
      font-size: 16px; }
    .product-section .product-item strong {
      font-weight: 800 !important;
      font-size: 18px !important; }
    .product-section .product-item h3, .product-section .product-item strong {
      color: #2f2f2f;
      text-decoration: none; }
    .product-section .product-item .icon-cross {
      position: absolute;
      width: 35px;
      height: 35px;
      display: inline-block;
      background: #2f2f2f;
      bottom: 15px;
      left: 50%;
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%);
      margin-bottom: -17.5px;
      border-radius: 50%;
      opacity: 0;
      visibility: hidden;
      -webkit-transition: .3s all ease;
      -o-transition: .3s all ease;
      transition: .3s all ease; }
      .product-section .product-item .icon-cross img {
        position: absolute;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%); }
    .product-section .product-item:before {
      bottom: 0;
      left: 0;
      right: 0;
      position: absolute;
      content: "";
      background: #dce5e4;
      height: 0%;
      z-index: -1;
      border-radius: 10px;
      -webkit-transition: .3s all ease;
      -o-transition: .3s all ease;
      transition: .3s all ease; }
    .product-section .product-item:hover .product-thumbnail {
      top: -25px; }
    .product-section .product-item:hover .icon-cross {
      bottom: 0;
      opacity: 1;
      visibility: visible; }
    .product-section .product-item:hover:before {
      height: 70%; }

.why-choose-section {
  padding: 7rem 0; }
  .why-choose-section .img-wrap {
    position: relative; }
    .why-choose-section .img-wrap:before {
      position: absolute;
      content: "";
      width: 255px;
      height: 217px;
      background-image: url("../images/dots-yellow.svg");
      background-repeat: no-repeat;
      background-size: contain;
      -webkit-transform: translate(-40%, -40%);
      -ms-transform: translate(-40%, -40%);
      transform: translate(-40%, -40%);
      z-index: -1; }
    .why-choose-section .img-wrap img {
      border-radius: 20px; }

.feature {
  margin-bottom: 30px; }
  .feature .icon {
    display: inline-block;
    position: relative;
    margin-bottom: 20px; }
    .feature .icon:before {
      content: "";
      width: 33px;
      height: 33px;
      position: absolute;
      background: rgba(59, 93, 80, 0.2);
      border-radius: 50%;
      right: -8px;
      bottom: 0; }
  .feature h3 {
    font-size: 14px;
    color: #2f2f2f; }
  .feature p {
    font-size: 14px;
    line-height: 22px;
    color: #6a6a6a; }

.we-help-section {
  padding: 7rem 0; }
  .we-help-section .imgs-grid {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: repeat(27, 1fr);
    grid-template-columns: repeat(27, 1fr);
    position: relative;}
    .we-help-section .imgs-grid:before {
      position: absolute;
      content: "";
      width: 255px;
      height: 217px;
      background-image: url("../images/dots-green.svg");
      background-size: contain;
      background-repeat: no-repeat;
      -webkit-transform: translate(-40%, -40%);
      -ms-transform: translate(-40%, -40%);
      transform: translate(-40%, -40%);
      z-index: -1; }
    .we-help-section .imgs-grid .grid {
      position: relative; }
      .we-help-section .imgs-grid .grid img {
        border-radius: 20px;
        max-width: 100%; }
      .we-help-section .imgs-grid .grid.grid-1 {
        -ms-grid-column: 1;
        -ms-grid-column-span: 18;
        grid-column: 1 / span 18;
        -ms-grid-row: 1;
        -ms-grid-row-span: 27;
        grid-row: 1 / span 27; }
      .we-help-section .imgs-grid .grid.grid-2 {
        -ms-grid-column: 19;
        -ms-grid-column-span: 27;
        grid-column: 19 / span 27;
        -ms-grid-row: 1;
        -ms-grid-row-span: 5;
        grid-row: 1 / span 5;
        padding-left: 20px; }
      .we-help-section .imgs-grid .grid.grid-3 {
        -ms-grid-column: 14;
        -ms-grid-column-span: 16;
        grid-column: 14 / span 16;
        -ms-grid-row: 6;
        -ms-grid-row-span: 27;
        grid-row: 6 / span 27;
        padding-top: 20px; }

.custom-list {
  width: 100%; }
  .custom-list li {
    display: inline-block;
    width: calc(50% - 20px);
    margin-bottom: 12px;
    line-height: 1.5;
    position: relative;
    padding-left: 20px; }
    .custom-list li:before {
      content: "";
      width: 8px;
      height: 8px;
      border-radius: 50%;
      border: 2px solid #3b5d50;
      position: absolute;
      left: 0;
      top: 8px; }

.popular-product {
  padding: 0 0 7rem 0; }
  .popular-product .product-item-sm h3 {
    font-size: 14px;
    font-weight: 700;
    color: #2f2f2f; }
  .popular-product .product-item-sm a {
    text-decoration: none;
    color: #2f2f2f;
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease; }
    .popular-product .product-item-sm a:hover {
      color: rgba(47, 47, 47, 0.5); }
  .popular-product .product-item-sm p {
    line-height: 1.4;
    margin-bottom: 10px;
    font-size: 14px; }
  .popular-product .product-item-sm .thumbnail {
    margin-right: 10px;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 120px;
    flex: 0 0 120px;
    position: relative; }
    .popular-product .product-item-sm .thumbnail:before {
      content: "";
      position: absolute;
      border-radius: 20px;
      background: #dce5e4;
      width: 98px;
      height: 98px;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
      transform: translate(-50%, -50%);
      z-index: -1; }

.testimonial-section {
  padding: 3rem 0 7rem 0; }

.testimonial-slider-wrap {
  position: relative; }
  .testimonial-slider-wrap .tns-inner {
    padding-top: 30px; }
  .testimonial-slider-wrap .item .testimonial-block blockquote {
    font-size: 16px; }
    @media (min-width: 768px) {
      .testimonial-slider-wrap .item .testimonial-block blockquote {
        line-height: 32px;
        font-size: 18px; } }
  .testimonial-slider-wrap .item .testimonial-block .author-info .author-pic {
    margin-bottom: 20px; }
    .testimonial-slider-wrap .item .testimonial-block .author-info .author-pic img {
      max-width: 80px;
      border-radius: 50%; }
  .testimonial-slider-wrap .item .testimonial-block .author-info h3 {
    font-size: 14px;
    font-weight: 700;
    color: #2f2f2f;
    margin-bottom: 0; }
  .testimonial-slider-wrap #testimonial-nav {
    position: absolute;
    top: 50%;
    z-index: 99;
    width: 100%;
    display: none; }
    @media (min-width: 768px) {
      .testimonial-slider-wrap #testimonial-nav {
        display: block; } }
    .testimonial-slider-wrap #testimonial-nav > span {
      cursor: pointer;
      position: absolute;
      width: 58px;
      height: 58px;
      line-height: 58px;
      border-radius: 50%;
      background: rgba(59, 93, 80, 0.1);
      color: #2f2f2f;
      -webkit-transition: .3s all ease;
      -o-transition: .3s all ease;
      transition: .3s all ease; }
      .testimonial-slider-wrap #testimonial-nav > span:hover {
        background: #3b5d50;
        color: #ffffff; }
    .testimonial-slider-wrap #testimonial-nav .prev {
      left: -10px; }
    .testimonial-slider-wrap #testimonial-nav .next {
      right: 0; }
  .testimonial-slider-wrap .tns-nav {
    position: absolute;
    bottom: -50px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%); }
    .testimonial-slider-wrap .tns-nav button {
      background: none;
      border: none;
      display: inline-block;
      position: relative;
      width: 0 !important;
      height: 7px !important;
      margin: 2px; }
      .testimonial-slider-wrap .tns-nav button:active, .testimonial-slider-wrap .tns-nav button:focus, .testimonial-slider-wrap .tns-nav button:hover {
        outline: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        background: none; }
      .testimonial-slider-wrap .tns-nav button:before {
        display: block;
        width: 7px;
        height: 7px;
        left: 0;
        top: 0;
        position: absolute;
        content: "";
        border-radius: 50%;
        -webkit-transition: .3s all ease;
        -o-transition: .3s all ease;
        transition: .3s all ease;
        background-color: #d6d6d6; }
      .testimonial-slider-wrap .tns-nav button:hover:before, .testimonial-slider-wrap .tns-nav button.tns-nav-active:before {
        background-color: #3b5d50; }

.before-footer-section {
  padding: 7rem 0 12rem 0 !important; }

.blog-section {
  padding: 7rem 0 12rem 0; }
  .blog-section .post-entry a {
    text-decoration: none; }
  .blog-section .post-entry .post-thumbnail {
    display: block;
    margin-bottom: 20px; }
    .blog-section .post-entry .post-thumbnail img {
      border-radius: 20px;
      -webkit-transition: .3s all ease;
      -o-transition: .3s all ease;
      transition: .3s all ease; }
  .blog-section .post-entry .post-content-entry {
    padding-left: 15px;
    padding-right: 15px; }
    .blog-section .post-entry .post-content-entry h3 {
      font-size: 16px;
      margin-bottom: 0;
      font-weight: 600;
      margin-bottom: 7px; }
    .blog-section .post-entry .post-content-entry .meta {
      font-size: 14px; }
      .blog-section .post-entry .post-content-entry .meta a {
        font-weight: 600; }
  .blog-section .post-entry:hover .post-thumbnail img, .blog-section .post-entry:focus .post-thumbnail img {
    opacity: .7; }

.footer-section {
  padding: 80px 0;
  background: #ffffff; }
  .footer-section .relative {
    position: relative; }
  .footer-section a {
    text-decoration: none;
    color: #2f2f2f;
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease; }
    .footer-section a:hover {
      color: rgba(47, 47, 47, 0.5); }
  .footer-section .subscription-form {
    margin-bottom: 40px;
    position: relative;
    z-index: 2;
    margin-top: 100px; }
    @media (min-width: 992px) {
      .footer-section .subscription-form {
        margin-top: 0px;
        margin-bottom: 80px; } }
    .footer-section .subscription-form h3 {
      font-size: 18px;
      font-weight: 500;
      color: #3b5d50; }
    .footer-section .subscription-form .form-control {
      height: 50px;
      border-radius: 10px;
      font-family: "Inter", sans-serif; }
      .footer-section .subscription-form .form-control:active, .footer-section .subscription-form .form-control:focus {
        outline: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        border-color: #3b5d50;
        -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);
        box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2); }
      .footer-section .subscription-form .form-control::-webkit-input-placeholder {
        font-size: 14px; }
      .footer-section .subscription-form .form-control::-moz-placeholder {
        font-size: 14px; }
      .footer-section .subscription-form .form-control:-ms-input-placeholder {
        font-size: 14px; }
      .footer-section .subscription-form .form-control:-moz-placeholder {
        font-size: 14px; }
    .footer-section .subscription-form .btn {
      border-radius: 10px !important; }
  .footer-section .sofa-img {
    position: absolute;
    top: -200px;
    z-index: 1;
    right: 0; }
    .footer-section .sofa-img img {
      max-width: 380px; }
  .footer-section .links-wrap {
    margin-top: 0px; }
    @media (min-width: 992px) {
      .footer-section .links-wrap {
        margin-top: 54px; } }
    .footer-section .links-wrap ul li {
      margin-bottom: 10px; }
  .footer-section .footer-logo-wrap .footer-logo {
    font-size: 32px;
    font-weight: 500;
    text-decoration: none;
    color: #3b5d50; }
  .footer-section .custom-social li {
    margin: 2px;
    display: inline-block; }
    .footer-section .custom-social li a {
      width: 40px;
      height: 40px;
      text-align: center;
      line-height: 40px;
      display: inline-block;
      background: #dce5e4;
      color: #3b5d50;
      border-radius: 50%; }
      .footer-section .custom-social li a:hover {
        background: #3b5d50;
        color: #ffffff; }
  .footer-section .border-top {
    border-color: #dce5e4; }
    .footer-section .border-top.copyright {
      font-size: 14px !important; }

.untree_co-section {
  padding: 7rem 0; }

.form-control {
  height: 50px;
  border-radius: 10px;
  font-family: "Inter", sans-serif; }
  /*.form-control:active, .form-control:focus {
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-color: #3b5d50;
    -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2); }*/
  .form-control::-webkit-input-placeholder {
    font-size: 14px; }
  .form-control::-moz-placeholder {
    font-size: 14px; }
  .form-control:-ms-input-placeholder {
    font-size: 14px; }
  .form-control:-moz-placeholder {
    font-size: 14px; }

.service {
  line-height: 1.5; }
  .service .service-icon {
    border-radius: 10px;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 50px;
    flex: 0 0 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    background: #3b5d50;
    margin-right: 20px;
    color: #ffffff; }

textarea {
  height: auto !important; }

.site-blocks-table {
  overflow: auto; }
  .site-blocks-table .product-thumbnail {
    width: 200px; }
  .site-blocks-table .btn {
    padding: 2px 10px; }
  .site-blocks-table thead th {
    padding: 30px;
    text-align: center;
    border-width: 0px !important;
    vertical-align: middle;
    color: rgba(0, 0, 0, 0.8);
    font-size: 18px; }
  .site-blocks-table td {
    padding: 20px;
    text-align: center;
    vertical-align: middle;
    color: rgba(0, 0, 0, 0.8); }
  .site-blocks-table tbody tr:first-child td {
    border-top: 1px solid #3b5d50 !important; }
  .site-blocks-table .btn {
    background: none !important;
    color: #000000;
    border: none;
    height: auto !important; }

.site-block-order-table th {
  border-top: none !important;
  border-bottom-width: 1px !important; }

.site-block-order-table td, .site-block-order-table th {
  color: #000000; }

.couponcode-wrap input {
  border-radius: 10px !important; }

.text-primary {
  color: #3b5d50 !important; }

.thankyou-icon {
  position: relative;
  color: #3b5d50; }
  .thankyou-icon:before {
    position: absolute;
    content: "";
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: rgba(59, 93, 80, 0.2); }

/*************************************************************/
/* The navigation menu */
.secondaryNavbar {
  background: rgb(60, 60, 70);
  position: absolute;
  top: 49px;
  right: 0;
  width: 100%;
  padding: 0 !important;
  margin: 0 !important;
  z-index: 1000;
  white-space: nowrap; /* Empêche les sauts de ligne */
  align-items: center;
  justify-content: center;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}

.scrollable-content {
  width: 100%; /* Ajustez la largeur pour déclencher la barre de défilement horizontale */
  overflow-x: auto; /* Active la barre de défilement horizontale si nécessaire */
  overflow-y: hidden;
  justify-content: center;
  height: 100%;
  align-items: center;
  padding: 0 !important; 
  margin: 0 !important;
}


.secondaryScrollableContent {
  width: 100%; /* Ajustez la largeur pour déclencher la barre de défilement horizontale */
  overflow-x: auto; /* Active la barre de défilement horizontale si nécessaire */
  overflow-y: hidden;
  justify-content: center;
  height: 100%;
  align-items: center;
  padding: 0 !important;
  margin-bottom: 0 !important;
  padding: 4px 6px;
  text-decoration: none;
  transition: transform 0.3s ease-in-out;
}

.container-footer{
  position: fixed;
  display: flex;
  bottom: 0;
  width: 100%; 
  background: rgb(60, 60, 70);
  align-items: center;
  z-index: 900;
  text-decoration: none;
  transition: transform 0.3s ease-in-out;
}

.footer-scroll{
  width: 100%;
  background: transparent;
  margin: 0 auto;
  padding: 5px 10px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  text-align: center;
  white-space: nowrap;
  overflow-x:auto ;
  overflow-y: hidden;
}

.subnav-footer{
  width: auto;
  display: flex;
  flex: 1;
  align-items: center;
  box-sizing: border-box;
  text-align: center;
  margin: 0 11px;
}

.subnav-footer:active {
 opacity: .2;
}

.categoryItems{
  position: relative;
}

.searchfooter{
  font-size: 16px !important;
  position: absolute;
  padding-left: 2px;
  padding-top: 2px;
  left: 40%;
  bottom: 2px;
  border-radius: 20px;
  background: rgb(60, 60, 70);
  
}

.starfooter{
  font-size: 7px !important;
  position: absolute;
  padding-left: 2px;
  padding-top: 2px;
  left: 95% !important;
  top: -1px !important;
  border-radius: 20px;
  background: rgb(60, 60, 70);
}

.footer-btn .onHover{
  font-size: 15px;
}

.footer-btn{
  font-size: 14px;
  border: none;
  outline: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-self: center;
  border-radius: 0;
  padding: 5px 10px;
  color:#f1f1f1;
  background-color: inherit;
  font-family: inherit;
  width: auto;
  border-radius: 0 ;
  cursor: pointer;
}

.subnav {
  display: inline-block;
  overflow: hidden;
  height: 100%;
  padding: 10px;
  margin-left: 15px;
  margin-right: 15px;
  border-radius: 0 ;
}

.subnavOnClick{
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  background:rgb(0,125,150);
  padding: 6px;
}


/* Subnav button */
.subnav .subnavbtn{
  font-size: 16px;
  border: none;
  outline: none;
  border-radius: 0;
  color:#f1f1f1;
  background-color: inherit;
  font-family: inherit;
  width: auto;
}



/* Add a red background color to navigation links on hover */
.navbarfooter a:hover, .subnav:hover .subnavbtn{
  font-weight: bold;
  border: none;
}
.navbarfooter a:hover{
  transform: scale(1.1);
}
/* Style the subnav content - positioned absolute */
.subnav-content {
  display: none;
  position: absolute;
  background:rgb(0, 125,150);
  width: 100%;
  left: 0;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 8px;
  top: 40px;
  z-index: 1100;
  justify-content: center;
  align-items: center;
  overflow-x: auto !important; 
  overflow-y: hidden;
  white-space: nowrap;
}

.scrollable-content::-webkit-scrollbar-track {
  background-color: transparent; /* Couleur de fond de la barre de défilement */
}
.scrollable-content-SideHome::-webkit-scrollbar {
  width: 0 ; /* Largeur de la barre de défilement */
}
.scrollable-content-SideHome::-webkit-scrollbar-track {
  background-color: transparent; /* Couleur de fond de la piste de la barre de défilement */
}
.scrollable-content-SideHome::-webkit-scrollbar-thumb {
  background-color:transparent; /* Couleur de la poignée de la barre de défilement */
  border-radius: 6px; /* Bord arrondi de la poignée */
}
.scrollbar-visible::-webkit-scrollbar-thumb {
  background-color: #888; /* Couleur de la poignée */
  border-radius: 10px;
}
.scrollable-width::-webkit-scrollbar {
  width: 8px ; /* Largeur de la barre de défilement */
}


/***************PLACE HOLDER*****************/
.form-control::-webkit-input-placeholder { /* WebKit, Blink, Edge */
  opacity: 0.75;
  color: #808080; /* Couleur du texte du placeholder */
  font-style: italic; /* Style de police pour le placeholder */
  font-size: 14px;
}
.form-control:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  opacity: 0.75;
  color: #808080; /* Couleur du texte du placeholder */
  font-style: italic; /* Style de police pour le placeholder */
  font-size: 14px;
}
.form-control::-moz-placeholder { /* Mozilla Firefox 19+ */
  opacity: 0.75;
  color: #808080; /* Couleur du texte du placeholder */
  font-style: italic; /* Style de police pour le placeholder */
  font-size: 14px;
}
.form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
  opacity: 0.75;
  color: #808080; /* Couleur du texte du placeholder */
  font-style: italic; /* Style de police pour le placeholder */
  font-size: 14px;
}
.form-control::-ms-input-placeholder { /* Microsoft Edge */
  opacity: 0.75;
  color: #808080; /* Couleur du texte du placeholder */
  font-style: italic; /* Style de police pour le placeholder */
  font-size: 14px;
}
.form-control::placeholder { /* Most modern browsers support this now. */
  opacity: 0.75;
  color: #808080; /* Couleur du texte du placeholder */
  font-style: italic; /* Style de police pour le placeholder */
  font-size: 14px;
}

.custom-placeHolder::-webkit-input-placeholder { /* WebKit, Blink, Edge */
  color: #dc3545;
}
.custom-placeHolder:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  color: #dc3545;
}
.custom-placeHolder::-moz-placeholder { /* Mozilla Firefox 19+ */
  color: #dc3545;
}
.custom-placeHolder:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #dc3545;
}
.custom-placeHolder::-ms-input-placeholder { /* Microsoft Edge */
  color: #dc3545;
}
.custom-placeHolder::placeholder { /* Most modern browsers support this now. */
  color: #dc3545;
}
/******************************************************************************/

/* Style the subnav links */
.subnav-content a {
  float: left;
  text-decoration: none;
  padding-left: 20px;
  color: rgb(0, 255, 255);
}

/* Add a grey background color on hover */
.subnav-content a:hover {
  font-weight: bold;
  padding-left: 10px;
  color: #f1f1f1;
}

.subnav-content-onClick {
  display: flex;
  justify-content: center;
  align-items: center;
}

.addPadding {
  padding-bottom: 50px;
}
/******************************START SideHome***************************************/
.navbarSideHome{
  display: none;
  position: fixed;
  width: 0;
  height: 0;
  z-index:4005;
  flex-direction: column;
  background: #4a646c;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  left: 0;
  top: 0;
  padding: 0;
  opacity: 0;
  transition: opacity .3s ease-in-out, height 0.3s ease-in-out, width 0.3s ease-in-out;
}

.textPosition{
  padding-right: 20px !important;
  padding-left: 5px !important;
}

.followUsBtn{
  color: blue;
  font-weight: bold;
  text-decoration: none;
}

.unclicable{
  pointer-events: none;
}

.hideSubmitBtn{
  border: none;
  background: transparent;
  width: 0;
  height: 0;
}

.nextStepBtnSignUpSubmit{
  background: transparent;
  color: #3b5d50;
  font-weight: bold;
  font-size: 16px;
  border: none;
}


.sideBarVisible{
  display: block;
  width: 320px;
  height: 100%;
  opacity: 1;
}

.disabledBodyContains{
  pointer-events: none;
  user-select: none; 
  touch-action: none;
}
.disabledBodyScroll{
  overflow: hidden;
}


.hamburgerBtn{
  border: none;
  background: transparent;
}

.inputbgLogin{
  background:  rgba(255, 255, 255, 0.8);
}

.timeExpirationStyle{
  padding-left: 3px;
  color: #dc3545;
}

.labelTitle{
  font-weight: bold;
  line-height: 1.5em;
} 

.showPwd{
  margin-top: 5px;
  margin-left: 15px;
}

.languageLabel{
  margin-right:30px;
}

.svgSize{
  height: 20px;
  width: 20px;
  margin-right: 10px;
}

.flagFixer{
  left: 0 !important;
  padding: 0 !important;
  margin-left: 0 !important;
}
.flagFixer.USA{
  margin-left: 3px !important;
}
.flagCountry{
  height: 20px;
  width: 28px;
  padding: 0;
  margin: 0;
  margin-right: 5px;
  left: 0;
}



.enveloppe {
  position: fixed;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  background-color: rgb(50,50,50); /* ou toute autre couleur de fond */
  opacity: 0.7;
  z-index: 1001;
  transition: width 0.1s ease-in-out, height 0.1s ease-in-out; 
  overflow: hidden;
}

.enveloppeView {
  width: 100%; 
  height: 100%;
  display: block;
}

.logoSideHome{
  padding: 0;
  margin: 0;
}

.trait{
  height: .5px;
  border: 10px;
  background: rgb(57,90,108,.5);
  margin: 0;
  margin-top: 10px;
  padding: 0;
  width: 100%;
}


.btnSideHome{
  background: transparent;
  border: none;
}


.btnSideHome:active{
  font-size: 10px !important;
}

.btnSideHome> i{
  background: transparent;
  color: #f1f1f1;
  font-size: 20px;
}

.subnavSideHome {
  overflow: hidden;
  margin-top: 20px;
  padding:0;
  left: 0;
  color: #eee;
  justify-content: left;
  padding-left: 10px !important;
}

.navbarSideHome a {
  float: left;
  font-size: 16px;
  text-align: center;
  padding: 4px 6px;
  text-decoration: none;
  transition: transform 0.3s ease-in-out;
}

.customLine,.slideCustomLine,.slideCustomLineTitle {
  width: 100%; 
  margin: 0 auto;
  position: relative;
  margin-top: 10px;
  margin-bottom: 20px;
}

.slideCustomLine{
  margin-bottom: 0 !important;
} 

.slideCustomLineTitle{
  background-color: #4a646c !important;
  height: 10px !important;
  width: 100% ;
}

.slideTitle,.slideSubtitle{
  text-align: center;
  font-weight: bold;
  margin-top: 10px;
  margin-bottom: 0;
  padding-bottom: 0;
}
.slideSubtitle{
  text-align: left;
}

.subnavSideHome .subnavbtnSideHome,.SlidebtnSideHome {
  font-size: 16px;
  border: none;
  outline: none;
  border-radius: 0;
  background-color: inherit;
  font-family: inherit;
  width: auto;
  margin-bottom: 5px;
}

.subnavbtnSideHome i, .subnav-content-SideHome i,.SlidebtnSideHome i{
  color: rgb(57,90,108,.7);
  background: transparent;
  margin-left: 10px;
  padding-right: 10px;
} 

.subnav-content-SideHome i{
  margin-left: 0;
}

.subnavbtnSideHome img,.SlidebtnSideHome img{
  margin-left: 10px;
  padding-right: 10px;
  position: relative;
}


.subnavbtnSideHome .SideHomeMotivation{
  margin-left: 0;
}

.box-shadow {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Ajustez les valeurs selon vos préférences */
  border-radius: 50%;
  background: rgb(0, 0, 0,.1);
  display: block; /* Permet au box-shadow de s'étendre correctement */
  transition: box-shadow 0.3s ease; /* Ajoute une transition pour un effet plus doux */
}

/* Add a red background color to navigation links on hover */
.navbarSideHome a:hover, .subnavSideHome:hover, .subnavbtn, .subnavbtnSideHome,.SlidebtnSideHome{
  border: none;
  opacity: 1;
}
.navbarSideHome a:hover, .subnavSideHome:hover .subnavbtnSideHome i,.subnavSideHome:hover .subnavbtnSideHome{
  font-weight: bold;
  color: rgb(10, 50, 255);
}


.-SideHome a:hover,.subnav-content-SideHome a:hover i{
  color: rgb(10, 140, 255,.8);
}

.SlidebtnSideHome:hover, .SlidebtnSideHome:hover i {
  font-weight: bold;
  color: rgb(10, 50, 255);
  
}

.spanSideHomebtn{
  font-style: normal;
  padding: 10px;
  padding-top: 3px;
  padding-bottom: 7px;
}

.spanSideHomebtn:active{
  opacity: 0.2;
}

.SlidebtnSideHome:hover i{
  background: transparent;
}
.SlidebtnSideHome{
  position: relative;
  width: 100%;
  padding: 0;
  margin: 0;
}

.divCenvakySideHome{
  position: relative;
  background: rgb(57,90,108);
  width: 100%;
  padding: 10px;
  margin-bottom: 10px;
  display: flex;
  justify-content: center;
}



.divSlidebtnSideHome{
  justify-content: center;
  margin: 0;
  padding: 0;
}

.navbarSideHome a:hover{
  transform: scale(1);
}

.scrollable-content-SideHome {
  display: grid;
  grid-template-rows: 50px 1fr; 
  width: 100%; 
  background: white;
  padding: 0;
  margin: 0;
  height: 100%;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}
#contentSlideHomeContainer{
  position: relative;
  overflow-y: auto;
  overflow-x: hidden;
}


.subnavSideHome {
  overflow: hidden;
  height: 100%;
  padding: 0;
  margin: 0;
  margin-right: 20px;
  opacity: .85;
}

.subnavSideHome .aSideHome {
  padding-left: 0;
}

.space{
  padding-right: 20px;
}
.subnav-content-SideHome,.slide-content {
  display: none;
  position: relative;
  width: auto;
  border-radius: 1.1rem;
  padding-right: 5px;
  padding-left: 25px;
  height: auto;
  flex-direction: column;
  text-align: left;
}

.iti{
  width: 100% ;
}

  .slide-subcontent{
    margin-left:10px ;
  }

  .slide-content a,.slide-subcontent a{
    padding-right: 20px;
  }

  .slide-subcontent> a{
    margin: 10px;
  }




.slide{
  max-height: 100%;
  margin: 0;
  padding: 0;
}

.subnav-content-SideHome div{
  padding-left: 0;
  padding-right: 0;
  background: transparent;
  border: none;
}

.btnSeeEverything{
    background: transparent;
    border: none;
    outline: none;
    padding-bottom: 5px;
  }
.btnSeeEverything:hover{
  transform: scale(1.1);
  font-weight: bold;
}

.seeEverythingHide{
  display: none;
}

.subnav-content-SideHome a{
  width: 100%;
  text-align: left;
  left: 0;
  margin-top: 10px;
  margin-bottom: 10px;
}
.subnav-content-SideHome-visible,.slideSideHome{
  display: flex;
}


.icons-navbar{
  color: white;
  background: transparent;
  margin-left: 10px;
  padding-right: 10px;
}


.navbarfooter {
  height: 30px;
}

.doubleIconContainer {
  display: inline-block;
  position: relative;
}

.fa-ticket-alt {
  transform: rotate(47deg); /* Applique une rotation de -45 degrés au ticket */
}

.fa-star {
  position: absolute;
  top: 30%; /* Place l'étoile à 50% de la hauteur du conteneur parent */
  left: 15%; /* Place l'étoile à 50% de la largeur du conteneur parent */
  transform: translate(-50%, -50%); /* Ajuste la position pour la centrer exactement */
  font-size: 5px;
  color: #f1f1f1;
}

.fa-check{
  position: absolute;
  top: 15%;
  font-size: 10px;
  padding: 0
}

.login{
  margin-right: 10px;
}

.turnUpsideDown{
  transform: rotateY(180deg);
}

.fa-sync{
  position: absolute;
  top: 28%;
}

/******************************END SideHome*****************************************/

/*******************************************************************************/
.footerIcone{
  width: 40px;
  height: 40px;
  background:rgb(51, 51, 51);
  border-radius: 30px;
}
.navBarIcone{
  width: 25px;
  height: 25px;
}

.SideHomeIcone{
  width: 30px;
  height: 20px;
  border-radius: 30px;
}

.SideHomeMotivation{
  width: 40px;
  height: 40px;
  border-radius: 30px;
  left: 0;
  position: absolute;
  padding-right: 0 !important;
  margin-right: 0 !important;
  opacity: .8;
}
.btnBackSignUp{
  width: 30px;
  height: 30px;
  border-radius: 30px;
  background: transparent;

}

.formTitle{
  position: absolute;
  right: 20px;
  top: 20px;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
}

.btn-items-bar:active .icons-navbar,
.btn-items-bar:active .cart-count{
  opacity: .3;
  color: rgb(0, 255, 255);
}

.navBarLogo{
  width: 110px;
  height: 30px;
  margin:0 ;
  padding: 0;
}

.labelQuestionRadioCheckNumber{
  margin-right:30px;
}

.subtitle{
  opacity: .8;
  font-style: italic; 
  line-height: 1.5rem;
  text-align:justify;
}

.labelCheckRadionColor{
  font-style: italic;
  color:rgb(0,120,255);
  font-weight:bold;
}


/*font-size:14px;width:100%;height:45px; border-radius:10px;line-height: 1.5em;text-align:justify;" */

.labelQuestionRadioCheckText{
  margin-left:10px;
  line-height: 1.5rem;
  text-align:justify;
}

.cart-container {
  position: relative;
  display: inline-block;
}
.cart-icon {
  cursor: pointer;
}
.cart-count {
  position: absolute;
  top: -8px;
  left: 51%;
  transform: translateX(-50%);
  background: rgb(249, 191, 41,.9);
  color: white;
  border-radius: 100%;
  padding: 1px 3px;
  font-size: 10px;
  font-weight: bold;
}

.itemsBar{
  position: absolute;
  right: 10px;
  top: 10px;
  display: flex;
  justify-content: center;
  width: auto;
  height: 50px;
  margin-left: 10px;
}

.searchBar {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 15px;
  display: flex;
  justify-content: center;
  width: 40%;
  height: 50px;
  margin-right: 10px; /* Si nécessaire */
  margin-left: 10px;
}

@media only screen and (min-width: 768px) {
  #navBarIcone{
    margin-right: 20px;
    position: absolute;
    left: 10px;
    top: 15px;
    display: flex;
    justify-content: left;
  }

  .search-item{
    height: 35px;
  }
  
  .searchIcone{
    height: 20px;
    width: 20px;
  }
  .btn-items-bar{
    margin-left: 5px;
    background: transparent;
    border: none;
  }
  .search-btn{
    background: white;
    border: none;
    padding: 2px;
    padding-right: 10px;
  }

  #searchInput{
    border-top-left-radius: 25px !important;
    border-bottom-left-radius: 25px !important;
  }

  .adjustBtn{
    position: fixed;
    left: 310px !important;
    z-index: 4006;
    top: 0 !important;
    justify-content: center !important;
    align-items: center !important;
    display: flex !important;
    height: 50px;
  }
  .divBtnSideHome{
    position: absolute;
    top:60px;
    left: 0;
    z-index: 4010;
    background: transparent;
    border: none;
    margin-left: 10px;
    transition: left .1s ease-in-out;
  }

  .divBtnSideHomeView{
    background: rgb(60, 60, 70);
  }

  .divBtnSideHome:hover .spanSideHomebtn{
    background:rgb(0, 125,150);
    border-top-left-radius:8px ;
    border-top-right-radius:8px ;
  }

  .subnav:hover{
    background:rgb(0, 125,150);
    border-top-left-radius:8px ;
    border-top-right-radius:8px ;
    height: 35px;
  }

  .adjustBtn:hover .spanSideHomebtn{
    background:transparent;
    border-top-left-radius:0 ;
    border-top-right-radius:0;
  }

  .element-disposition{
    pointer-events: none;
    width: 80px;
  }
  .questionStyle{
    font-size:14px; 
    width:80%;
    line-height:1.5em
  }
  .scrollable-content::-webkit-scrollbar {
    width: 5px; /* Ajustez la largeur selon vos besoins */
    height: 8px;
  }
  .navbarfooter {
    height: 40px;
  }
  .pFooter{
    padding-bottom: 10px;
    position: absolute; 
    color: #fff; 
    background: transparent; 
    text-align: center; 
    top: 250%; 
    left: 5%; 
    right: 5%; 
  }

 
}

@media only screen and (max-width: 767px) {
  *{
    margin-right: 0;
    padding-right: 0;
    box-sizing: border-box;
  }
  #navBarIcone{
    margin-right: 20px;
    position: absolute;
    left: 40%;
    transform: translateX(-50%);
    top: 15px;
    display: flex;
    justify-content: left;
  }

  .subnavbtn,.subnav-content{
    font-size: 14px !important; 
  }

  .subnav {
    margin-left: 5px !important;
    margin-right: 5px !important;
  }

  .search-item{
    height: 35px;
  }
  
  .searchIcone{
    height: 22px;
    width: 22px;
  }
  .btn-items-bar{
    background: transparent;
    border: none;
  }
  .search-btn{
    background: white;
    border: none;
    padding: 2px;
    padding-right: 10px;
  }

  #searchInput{
    border-top-left-radius: 25px !important;
    border-bottom-left-radius: 25px !important;
  }
  /******************/

  .adjustBtn{
    position: fixed;
    left: 310px !important;
    z-index: 4006;
    top: 10px !important;
    justify-content: center !important;
    align-items: center !important;
    display: flex !important;
    padding: 0 !important;
  }
  .divBtnSideHome{
    position : absolute;
    top : 15px;
    left : 0;
    z-index : 4010;
    background : transparent;
    border : none;
    margin-left : 10px;
    transition : left .3s ease-in-out;
  }
  .secondaryNavbar{
    padding-bottom: 0 !important;
  }
  .pFooter{
    padding-bottom: 10px;
    position: absolute; 
    color: #fff; 
    background: transparent; 
    text-align: center; 
    top: 215%; 
    left: 5%; 
    right: 5%; 
  }
  .questionStyle{
    font-size:14px; 
    width:100%;
    line-height:1.5em
  }
  .navbarContainer{
    min-height: 18px;
  }
  #glob{
    padding-top: 10px;
  }
  .scrollable-content::-webkit-scrollbar {
    width: 5px; /* Ajustez la largeur selon vos besoins */
    height: 3px;
  }
  .CenvakyShow{
    padding-left: 15px;
    max-height: 0px;
    max-width: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height .5s ease-in-out,max-width 1.5s ease-in-out, opacity .75s ease-in-out !important;
  }
  .body{
    opacity: 1;
    width: 100%;
    transition: opacity .5s ease-in-out;
  }
 

  .CenvakyShow.show{
    max-height: 500px !important;
    max-width: 100%;
    opacity: 1;
    padding-top: 50px; 
  }

  
}
/********************Google translate*************************/
/*.skiptranslate iframe {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}*/


.signUpStyle{
  height:50px;
  width:100%;
  height:60%;
}
.signUpStyle.step1{
  border-top-left-radius: 30px;
  border-top-right-radius:30px;
  border-bottom-left-radius: 0px;
  border-bottom-right-radius:0px;
}

.signUpStyle.step2{
  border-top-left-radius: 0px;
  border-top-right-radius:0px;
  border-bottom-left-radius: 30px;
  border-bottom-right-radius:30px;
}

.signUpStyle.step3{
  border-top-left-radius: 30px;
  border-top-right-radius:30px;
}

.signUpStyle.final-step{
  border-bottom-left-radius: 0px;
  border-bottom-right-radius:0px;
}

.signUpStyle label,.fa-times{
  color:#FEFEFE;
  font-size:16px;
  font-style:oblique;
  text-shadow: 1px 1px 10px rgba(0, 0, 0);
  font-weight: bold;
   line-height: 1.5em;
   text-align:justify;
}

.Mode{
  background:rgb(59, 93, 80,.4);
  height:50px;width:100%;
  height:60%;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.Mode label{
  opacity: .8;
  color:#FEFEFE;
  font-size:16px;
  font-style:oblique;
  text-shadow: 2px 2px 4px rgba(0, 0, 0);
  font-weight: bold;
   line-height: 1.5em;
   text-align:justify;
  
}

.warningBox {
  /* Vos styles pour la boîte d'alerte */
  background-color: rgba(246, 186, 0, 0.3);
  padding: 10px;
  border: 1px solid rgba(246, 186, 0, 0.3);
  border-radius: 5px;
  margin-bottom: 10px;
  opacity: 1;
  width: 100%;
  height: 100%; /* Ajustez la hauteur maximale selon vos besoins */
  overflow: hidden;
  transition: opacity 3s ease-in-out, height 3s ease-in-out, width 3s ease-in-out;
}

.backToHomePageBtn{
  font-size: 20px; 
  font-weight: bold; 
  font-style: normal;
  border-radius: 20px;
  border: none;
  padding: 10px; 
  text-align: center;
  color: #ffffff;
  background-color: rgb(0, 50, 250,.8);
}
.backToHomePageBtn.confirmCodeBtn{
  padding: 5px;
  padding-left: 50px;
  padding-right: 50px;
}
.backToHomePageBtn.backToHomePageBtnSystemErros{
  margin-top: 20px;
  background: rgb(255,255,255,.8);
  color: rgb(0, 50, 250,.8);
  left: 20px;
  bottom: 40%;
}
.backToHomePageBtn.backToHomePageBtnSignUpConfirm{
  background-color: rgb(0, 50, 250,.8);
}

.backToHomePageBtn:active{
  opacity: .1;
}

.warningBox.hiddenWarning {
  opacity: 0;
  height: 0;
  width:0;
  padding: 0;
  border: none;
}


.warning{
  display:none;
  color:#dc3545;
  font-style: italic;
  line-height: 1.5em;
  text-align:justify;
}
#checkAgree{
  opacity: .5;
}
.btn-Style-quit{
  width: 40px;
  height: 30px;
  font-size: var(--smoy);
  padding:4px;
  white-space: nowrap;
  overflow: hidden;
  opacity:.4;
}
.btn-Style-quit:hover{
  width: 45px;
  height: 35px;
  color:#dc3545;
  opacity: 1;
}
.btn-Style{
  width: 40px;
  height: 30px;
  font-size: var(--smoy);
  padding:4px;
  white-space: nowrap;
  overflow: hidden;
  opacity: .5;
}
.btn-Style:hover{
  width: 45px;
  height: 35px;
  opacity: 1; 
}

/* styles.css ou MonComposant.css */
.rotating-logo {
  animation: rotate 5s linear infinite;
  height:40px;
  width:42px
}
.hiddenElement{
  display: none;
}
.bodySystemErrors{
  position: relative;
  background: rgba(80,100,130);
  padding: 20px;
  margin: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  align-items: center;
}

.fa-exclamation-circle{
    font-size: 4rem; color: #f9bf29; 
    margin-top: 10px;
}

.pMessage{
    color: #fff; 
    top: 10%; 
    background: transparent; 
    font-size: 20px; 
    text-align: justify;
}



.imgFooter{
    height: 130px; 
    width: 135px; 
    margin-bottom: 10px;
}

@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}


.otpForm{
  width: 40px;
  opacity: 1;
  font-weight: bold;
  background: transparent;
  border-radius: 12px;
  margin: 2px;
  border: 2px solid rgb(59, 93, 80,.4);
  text-align: center;
}
.shieldIcon{
  font-size: 3.5rem;
  color:rgb(59, 93, 80,.7);
}

.checkIcon{
  position: relative;
  font-size: 0rem;
  color:rgb(0, 150, 100);
  background: rgb(0, 100, 200,.2);;
  border-radius: 4rem;
  justify-content: center;
  align-items: center;
  padding-top: 0;
  width: 40px;
  height: 40px;
  left: 50%;
  top: 25%;
  padding: 10px;
  opacity: .5;
  transition: font-size .8s ease-in-out, opacity .8s ease-in-out;
}

.checked {
  font-size: 4rem;
  opacity: 1;
}

.dimCheckButton{
  opacity: .3;
}



.fantomMode{
  display: none;
}

.customSelect{
  max-width: 266px;
  height: 262px;
  overflow-y:hidden;
}

.typedoc{
  max-height: 200px;
  max-width: 120px;
  overflow:auto;
}


.myStyle{
  opacity: .8;
  font-style: italic;
  font-size: 16px;
   line-height: 1.5em;
   text-align:justify;
}

.languageForm {
  border: 1px solid rgba(0, 100, 244, 0.1);
  height: 40px;
  width: 215px;
  margin: 10px;
  text-align: center;
  align-items: center;
  border-radius: 10px;
  padding: 5px;
}

.inputbg{
  background:  rgba(0, 150, 200, 0.04);
}

.confirmation{
  margin-top: 50px;
}

.pSelectPreferencelang{
  font-weight: bold;
  color: black;
}

.fixed-div {
  position: fixed;
  left: 0;
  width: 100%;
  max-height: 100%; /* Ajustez en fonction de la hauteur que vous souhaitez */
  overflow-y: auto; /* Permet le défilement vertical si le contenu dépasse la hauteur maximale */
  padding: 10px;
  /* Autres styles personnalisés */
}
.fixed-bottom{
  background: rgb(255, 255, 255);
}

.divJistified{
  right: 0;
  left: 0;
}

.btnEditResend{
  color : #3b5d50;
  font-weight : bold; 
  border : none;
  background : transparent;
  text-decoration: none;
}

.expirationDelay{
  line-height: 1.5em;
  opacity: 0.5;
  font-style: italic;
  text-align:justify;
}

.footerContinueOnEmail{
  position: absolute;
  bottom: 10px;
}

/******************************************************/
@media (min-width:768.5px){
  .container1 {
      position: center;
      width: 90%;
      height: 30%;
      z-index: 10;
      background-color: rgba(255, 255, 255, 0.5); 
      border-radius: 10px; 
      box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); 
      padding-top: 0%;
    }
    .loginForm{
      height: 50%;
      padding-top: 0;
    }
  
}
@media (max-width: 768px) {
  .container1 {
      position: center;
      width: 90%;
      z-index: 10;
      background-color: rgba(255, 255, 255, 0.5); 
      border-radius: 10px; 
      box-shadow: 0 0 10px  rgba(0, 0, 0,.5);
      opacity: 1; 
    } 
}

/**********************************************************/
.no-underline:hover{
  color: rgb(4, 113, 222);
}
.no-underline:active{
 opacity: .1;
}

/*
  PASSWORD-STRENGTH-INDICATOR
*/
.password-strength-indicator{
  font-size: 12px;
  display: inline-block;
  height: 20px;
  min-width: 20%;
  text-align: center;
  transition: 2s;
  border-radius: 10px;
  padding: 0px;
  margin-top: 5px;
  font-weight: bold;
}
.password-strength-indicator.very-weak{
  background: #dc3545;
  width: 20%;
  color: white;
}
.password-strength-indicator.weak{
  background: #f6891f;
  width: 40%;

}
.password-strength-indicator.mediocre{
  background: #eeee00;
  width: 60%;
}
.password-strength-indicator.strong{
  background: #99ff33;
  width: 80%;
}
.password-strength-indicator.very-strong{
  background: #22cf00;
  width: 100%;
  color: white;
}