/*
Theme Name: Mannatech
Theme URI: 
Author: Nasir
Author URI: https://www.facebook.com/md.nasirul.5/
Description: exipure Theme is a custom theme which  is designed to take full advantage of the flexibility of the block editor. Organizations and businesses have the ability to create dynamic landing pages with endless layouts using the group and column blocks. The centered content column and fine-tuned typography also makes it perfect for Weight Loss Fix website and traditional blogs. Complete editor styles give you a good idea of what your content will look like, even before you publish. You can give your site a personal touch by changing the background colors and the accent color in the Customizer. The colors of all elements on your site are automatically calculated based on the colors you pick, ensuring a high, accessible color contrast for your visitors.
Tags: health and beuty, Weight loss, health, Health workout, health supplyment, weight loss and fit, featured-images, footer-widgets, full-width-template, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, block-styles, wide-blocks, accessibility-ready
Version: 1.0
Requires at least: 5.0
Tested up to: 5.4
Requires PHP: 7.0
License: GNU General Public License v2 or later
License URI: 
Text Domain: mannatech
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/


#header{
   
}
/* header topNav row start */
.topNav{
    background-color:#222;
}
.authContact{
    font-size:12px;
    padding:5px 5px 5px 5px;
}
.authContact a{
    color:#fff;
    text-decoration:none;
}
.authContact a:hover{
    color:#0099FF;
    transition: .5s;
}
.loginSection{
    text-transform: uppercase;
    font-size:12px; 
    padding:5px 5px 5px 5px;  
}

/* nav  first row start */
.firstRow{
    text-transform: uppercase;
    color:#fff;
    font-size:12px;    
    background-image: linear-gradient(to right, rgba(102, 204, 102,0.9), rgba(51, 204, 204));
}
.logo{
    margin-left:20px;
}
.logo img{
    width:50%;
}
.menu ul li{
    list-style: none;
    float: left;
    display: block;
    padding: 20px;
    text-transform: uppercase;
}
.menu ul li a{
    text-decoration:none;
    color:#222;
    font-weight:bold;
}
.menu ul li a:hover{   
    color:#669966;
    transition: .5s;
}
.loginMenu ul li{
    list-style: none;
    float: left;
    display: block;
    padding: 20px;
    text-transform: uppercase;
}
.loginMenu ul li a{
    text-decoration:none;
    color:#222;
    font-weight:bold;
}
.loginMenu ul li a:hover{
    color:#669966;
    transition: .5s;
}
.cart-count-PopUp{
    text-align: center;
    background: #00a6ec;
    border-radius: 6px;
    color: #fff;
    font-size: 10pt;
    padding: 0;
    margin: -10px 0 -11px 5px;
    min-width: 25px;
    min-height: 23px;
    display: inline-block;
    line-height: 24px;
}
.pageLinkCard{
    background-color: #f2f2f2;
}
.pageLinkCard a{   
   text-decoration: none;
   font-size:12px;
   color:#222;
}
.linkCard:hover{
    background-color: rgba(225, 225, 225);
    box-shadow: -3px -3px 5px 1px rgba(0, 0, 0,0.2);  
  opacity: 0.75; 
  transition: .2s;
}
.linkCard img:hover{
    transition: .2s;
    transform: scale(1.2);
}
/* .linkCard {
    position: relative;
  }
  
  .linkCard::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: black;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
    box-shadow: 2px 2px 5px 1px rgba(0, 0, 0,0.5);
  }
  
  .linkCard:hover::before {
    opacity: 0.5;
  } */

#section{
    /* background-color: #175056;    */
}
.slider-section img {
    width: 100%;
}
/* .slogan{
    display: none;
} */
.bannerImg{
    display:none;
}
.section-01 .slogan h1{    
    margin-top:5%;
    font-size:60px;
    text-transform: uppercase;
}
.section-01 .slogan p{    
    margin-top:1%;
    font-size:40px;
    text-transform: capitalize;
}
.section-01 .slogan h1{
    /* Standard syntax*/
    animation-duration: 1s;
    animation-name: slogan-H;
}
@keyframes slogan-H{
    from {
        margin-left: -100%;
    }

    to {
        margin-left: 0%;
    }
}
.section-01 .slogan p{
    /* Standard syntax*/
    animation-duration: 1s;
    animation-name: slogan-P;
}
@keyframes slogan-P{
    from {
        margin-left: 100%;
    }

    to {
        margin-left: 0%;
    }
}

.section-02{      
    background-image: url("https://mannatech.weightlossfix.com/wp-content/themes/mannatech/assets/img/23.02.2023_10.52.51_REC.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover; 
    padding-bottom:10%;     
}
.section-02 h1{    
   margin-right:40%;
   margin-top:10%;    
}
.section-02 p{    
    margin-right:15%;      
 }
.section-03 h1{    
   margin-right:20%;
   margin-top:10%;    
}
.section-04{      
    background-image: url("https://mannatech.weightlossfix.com/wp-content/themes/mannatech/assets/img/bkground-nsf-hand-without_N.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover; 
    padding-bottom:10%;     
}
.section-04 h1{    
    margin-right:20%;
    margin-top:10%;    
 }
.section-04 p{
    text-align: justify;    
    margin-right:10%;      
 }
.section-04 ul li{
    text-align: justify;      
    margin-right:15%;      
 }
.section-04 a{    
    color:#00a6ec;
    text-decoration: none;  
 }
.section-05 .content{
    margin-right:10px;   
   background-color: #f7f9fa;
 }
.section-05 .content img{
    margin:20px 0px 0px 60px;
 }
.section-05 .content h2{
    margin-left:80px;
 }
.section-05 .content p{
    margin:20px 0px 80px 80px;
 }
 .section-05 .content h2 a{    
    color:#00a6ec;
    text-decoration: none;  
 }
 
#footerSection{
    /* background-color: black;  */
     
}
.midfooter-banner{
    background-image: url("https://mannatech.weightlossfix.com/wp-content/themes/mannatech/assets/img/transform-04.jpg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover; 
    padding-bottom:10%; 
 }
 .midfooter-banner h1{
    margin-top:10%; 
   color:#fff;
 }
 .midfooter-banner h1 strong{
    font-size:30px;
   color:#fff;
 }

 .midfooter-banner .theme-btn a{
    font-size:18px; 
    padding:10px 50px 10px 50px;
    border:3px solid #fff;
    border-radius: 10px 10px 10px 10px;
    text-decoration:none;
    text-transform: uppercase;
   color:#fff;
 }
 .midfooter-banner .theme-btn a:hover{
    color:white;
  background-color:rgba(255,255,255,0.3);
  box-shadow: 5px 5px 10px 4px rgba(0, 0, 0,0.7); 
 }
 .mid-footer{
    background-color:#333a44;
 }
 .mid-footer .links{
    margin:auto 10%;
 }

 .mid-footer ul li{
    list-style: none;
    font-size:14px;
 }
 .mid-footer ul li a{
    text-decoration: none;
    color:#d6d6d7;
 }
 .mid-footer ul li a:hover{
    color:white;
 }
 .mid-footer .subscribe{
    margin: auto 40%;
 }
 .mid-footer .subscribe-btn{
    background-color:#00a6ec; 
    color:#fff; 
 }
 .mid-footer .subscribe-btn:hover{
    background-color:rgba(51, 204, 204);
    color:#fff;
 }
 .mid-footer-bottom{
    border:1px solid #666666;
    font-size:12px;
 }
 .mid-footer-bottom p{ 
    color:#999999;   
    padding:10px 100px 10px 100px;
 }
 .page-footer{ 
    background-color:#333333;   
   
 }
 .page-footer img{ 
   width:70%;   
 }





 
/*=============responsive start===========*/

/* Mobile device */
@media (max-width:600px) {
    .authContact, .loginSection{
        margin:auto;
    }
    #menu{
        display:none;
    }     
    #responsive_menu .btn {
        background-color:rgba(51, 204, 204,0.1);
        border:1px solid #00a6ec;
    } 
    #navbarSupportedContent {
        flex:1 1 auto!important;
       
    } 
     #navbarSupportedContent ul {
        text-align: center;
        width: 100%;
        border: 0.5px solid gray;
        position: relative;
        left: 0px;
    } 
    #navbarSupportedContent ul li {
        transition-duration: 1s;
        text-transform: uppercase;
        font-size: 14px;
        font-weight: bold;
        margin-top: 2px;
        padding: 10px;
        background-color:rgba(51, 204, 204,0.1);
        border:1px solid #00a6ec;
    }
    #navbarSupportedContent ul li a {
        text-decoration: none;
        color: RGB(0, 0, 0, 0.6);
    }
    .linkCard{
        margin-left:5%;
    } 
   
    .linkCard img{
      width:100%;       
    }
    .section-01 .slogan h1{
        font-size:30px;       
    }
    .section-01 .slogan p{
        font-size:22px;       
    }
    .section-01 .bannerImg img{
        margin-top:-20px;
        width:100%;
    }
    .section-02 h1{
        font-size:24px;    
        margin:5% 0% 0% 5%; 
     }
     .section-03 h1{    
        font-size:24px;    
        margin:5% 0% 0% 5%;   
     }
     .section-03 p{    
        text-align:justify;   
     }
     .section-03 img{    
       width:100%;  
     }
     .section-04 h1{    
        font-size:24px;    
        margin:5% 0% 0% 5%;   
     }
     .section-05 .content{
        flex:1 1 auto!important;
        margin-right:10px;   
       background-color: #f7f9fa;
     }
     .section-05 .content img{
        margin:auto 5%;
     }
     .section-05 .content h2{
        margin:auto 10%;
     }
    .section-05 .content p{
        margin:auto 10%;
     }
     .midfooter-banner h1{
        font-size:30px;    
        margin:5% 0% 0% 5%;
     }
     .midfooter-banner h1 strong{
        font-size:24px;    
        margin:5% 0% 0% 2%;
     }
     .midfooter-banner .theme-btn a{
        font-size:14px; 
        padding:5px 20px 5px 20px;
        border:2px solid #fff;
        border-radius: 8px 8px 8px 8px;       
     }
     .mid-footer .subscribe{
        margin: auto 20%;
     }
     .mid-footer-bottom p{       
        padding:10px 20px 10px 20px;
     }
     .page-footer p{ 
       font-size:14px;
       margin:auto 2%;
       text-align:center;  
      }
     .page-footer img{ 
        width:100%;   
      }
     
   
}

/* Tablet device */
@media (max-width:600px) {}

/* laptop device */
@media (max-width:600px) {}

/* Desktop device */
@media (min-width: 601px) and (max-width:1920px) {
    #responsive_menu {
        display: none;
    }
    .pageLinkCard a{
        white-space:nowrap!important;
    }


}