/* HEADER*/
.button {
    background-color:#fd9200;
    border: none;
  border-radius: 7px;
  padding: 1px 1px;

  text-align: center;
  text-decoration: none;
  cursor: pointer;
  display: inline;
  text-decoration: none;
 
  float: right;
  font-size: 18px;
  color: white;
  text-decoration: none;
  margin: 2%;
  
 

  
}
.home1{
    background-color: #2196e5;
    border: none;
}

.img1{

 background-color:white;
margin-left: 1%;
 border:none;
position: relative;
 width: 30px;
 height: 30px;
border-radius: 100%;
}
.img1:hover{
    background-color:#f0c650;
}
.button3{
    background-color:#fd9200;
    border: none;
    border-radius: 2px;

}
.sbtnm{
    font-size: 14px;
}
.home{
    background-color:white;
    text-decoration: none;
   
    
}
.sbtna{
    text-decoration: none;
    font-size: 18px !important;
    padding-right: 15px;
    padding-left: 5px;
   
   

}
@media (max-width: 768px) {
    .sbtna {
        padding: 8px 16px; 
        font-size: 14px; 
    }
}
.sbtna:hover{
    color:#f0c650;
}

.button:hover{
  background-color:#008f00;
}
.button1{
    background-color: white;
    border-radius: 500px;
    position: absolute;
    left:46%;
    transform: translateY(-50%);
    border: none;
    width: 110px;
    height: 110px;
    margin-top: 2px;
    margin-right: 10px;
     
   
  
   

}
.bloga:hover,.storea:hover,.abouta:hover{
    color:#f0c650;
    
}
.blogm:hover,.storem:hover,.aboutm:hover{
    color:#f0c650;
    
}
.blogm,.aboutm,.storem{
    font-size: 13px;
}


.navbar{
   
    background-image: linear-gradient(to bottom,rgba(145,214,245,0.5),rgba(33,150,229,1));
    font-family:Arial;
    margin-top: 10px ;
    margin: 10px 10px;
    padding-right: 10px !important;
    border-radius: 1px;

}
.mobile-navbar,.mobile-navbar-button{
    display: none ; 
  }
@media screen and (max-width: 768px) {
    .navbar {
        display: none !important; 
      }
     
      .mobile-navbar {
        display: block; 
        margin: 5px 5px;
        border-radius: 10px;
        z-index: -1;
        padding-bottom: 10px;
        margin-left: 10px;
      }
      .mobile-navbar-button{
       
        display: block;
        background-color:#ebebeb;
        width: 10%;
      }
      .mdi-menu{
        text-align: left;
        color:#424242;
      }
      .video{
        width: 90%;
      }
      
    }
      
      .mobile-navbar-button {
        background-color:#ebebeb;
        border: none;
        border-radius: 5px;
        text-align: center;
        text-decoration: none;
        cursor: pointer;
        padding: 5px 10px;
        color: #424242;
        font-size: 16px;
        margin-top: 10px;
        margin-left: 15px;
        
    
  }

 .sbtna{
    font-size: 24px;
    color: white;
    text-decoration: none;
    margin: 2%;
  
   
  
}
.storea{
    font-size: 24px;
    color: white;
    text-decoration: none;
    margin: 2%;
    margin-left: 40px;

}
.abouta{
    font-size: 24px;
    color: white;
    text-decoration: none;
    margin-left: 10px;

}
.bloga{
    margin-right: 5px;
    font-size: 24px;
    color: white;
    text-decoration: none;
    margin: 2%;
}


@media (max-width: 768px) {
    .storea, .sbtna, .abouta ,.dropdown ,.dropdown1{
        font-size: 23px; 
        margin: 0.5%; 
    }
}

.abouta {
    margin-left: 16%;
    color: white;
}


@media (max-width: 768px) {
    .abouta {
        margin-left: 10%; 
    }
}



.dropdown {
    display: inline;
    font-size: 20px;
    margin-right: 2%; 
  }
  

  @media (max-width: 768px) {
    .dropdown {
      margin-right: 20px; 
    }
  }
  
button.dropbtn:hover{

    color:#f0c650;

}
button.dropbtn1:hover{

    color:#f0c650;

}

.dropdown1 {
    display: inline;
    overflow: hidden;
    font-size: 20px;
    margin-right: 2%; 
  }
  
 
  @media (max-width: 768px) {
    .dropdown {
      margin-right: 15px; 
    }
  }
  


.dropdown .dropbtn {
  font-size: 23px;
  border: none;
  outline: none;
  color: white;
  margin: 30px 30px;
  
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}
.dropdownm .dropbtn {
    font-size: 15px;
   color: white;
   background-color: #2196e5;
    outline: none;
    margin: 30px 30px;
    border:none; 
    font-family: inherit;
    margin: 0;
  }
  .dropdown1m .dropbtn1 {
    font-size: 15px;
   color: white;
   background-color: #2196e5;
    outline: none;
    margin: 30px 30px;
    border:none; 
    font-family: inherit;
    margin: 0;
  }
.dropdown:hover .dropbtn{
    color:#f0c650;
}
.dropdown1:hover .dropbtn1{
    color:#f0c650;
}
.dropdownm:hover .dropbtn{
    color:#f0c650;
}
.dropdown1m:hover .dropbtn1{
    color:#f0c650;
}
.mobile-navbar{
    background-color:rgba(33,150,229);
    position: absolute;
    z-index: 1;
    margin-left: 20px;
    margin-top: 0;
    
    
   

}

.dropdown1 .dropbtn1 {
  font-size: 23px;
  border: none;
  outline: none;
  color: white;
  background-color: inherit;
  font-family: inherit;
  margin: 0px;
}
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
    border-style: groove;
    font-family: 'Nunito';
    font-weight: bolder;
  }
  dropdown-contentm li{

    border-style: groove;
    font-family: 'Nunito';
    font-weight: bolder;
    padding: 12px 16px;
    text-decoration: none;
    text-align: left;
    display: block; 
    color: #5e5e5e;
    

  }
  dropdown-content1m a{

    border-style: groove;
    font-family: 'Nunito';
    font-weight: bolder;
    padding: 12px 16px;
    text-decoration: none;
    text-align: left;
    display: block; 
    color: #5e5e5e;

  }
  
  
  .dropdown-content a {
    padding: 12px 16px;
    text-decoration: none;
    text-align: left;
    display: block;
    color: #5e5e5e;
  }
  
.dropdown-content1 {
  display: none;
  position:absolute;
  left: 260px;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  border-style: groove;
  font-family:'Nunito';
  font-weight: bolder;
}
.dropdown-content a {
  float: none;
  color:#5e5e5e;
  padding: 12px 16px;
  text-decoration: none; 
  text-align: left; 
}
.dropdown:hover .dropdown-content {
  display:grid;
  grid-template-columns: 350px 350px 350px;
  grid-template-rows: 40px 50px 50px 50px 50px;
  text-align: left;
  color:#008f00;
 

  
}
.dropdown-content1 a {
    color:#5e5e5e;
  padding: 12px 16px;
  text-decoration: none;
  text-align: left;

}
.dropdown-content1 a:hover{
    color:#f0c650;
}
.dropdown-content a:hover{
    color:#f0c650;
}

.dropdown-content1m a:hover{
    color:#f0c650;
}
.dropdown-contentm a:hover{
    color:#f0c650;
}
.dropdown-content1m a{
    font-size: 12px;
}
.dropdown-contentm a{
    font-size: 12px;
}
.dropdown1:hover .dropdown-content1 {
  display: grid;
  position: absolute;
  grid-template-columns: auto;
  grid-template-rows: 50px 50px 50px 50px 50px 50px;
 


}
.dropdown-content p{
  grid-column: 1/4;
  color: #2196e5;
  font-family: 'nunito';
}

/*INDEX*/

.bdy{
    
    background-color: #ebebeb;
}
.bdy-cont{
    text-align: center;
    margin-top: 20px;
}

.heading{
   font-size: 27px; 
    font-family:Arial;
    font-weight:900;
    margin-top:50px;
    
}
.heading1{
    font-size: 27px;
    margin-top: 50px;
    font-family: Arial;
    font-weight: 900;
    color:#76c4f1;
}
.hc{
    
    font-size: 25px; 
    font-family:Arial;
    font-weight:900;
vertical-align: middle;
}
.im{
    
    vertical-align:middle;
    height: 40px;
    width: 340px;
   
}

.button2{
    color: white;
    background-color:#c91e07;
    border-radius: 8px;
    cursor: pointer;
    border:none;
    font-family: Arial;
    box-shadow: 2px 2px 2px 2px #abab;
   
   
    
    
}
.st{
    font-style:normal;
    margin-left:4px;
    font-family: Arial;
    
}
.yb{
    vertical-align:middle; 
}


.cd{
    background-color: white;
    font-style: normal;
    
}
.cd:hover{
    box-shadow: 2px 2px 2px 2px;
    padding: 3px 3px 3px 3px;
    color:darkblue;

}
.pc{
    background-color: white;
}
.cdt{
    font-style: normal;
    font-weight: 900;
    font-family: Arial;
    font-size: 25px;
    
}
.fmv{
    color:black;
    font-size: 20px;
    font-family: Arial;
    font-weight: 900;
    font-style:normal;
    margin-right: 2px;

}
.headinglr{
    font-size: 23px; 
    font-family:Arial;
    font-weight:900;
    margin-top:50px;

}
.headinglr1{
    font-size: 23px; 
    font-family:Arial;
    font-weight:900;
    margin-top:50px;
    color:#91d6f5;
}
.headingwm{
    font-size: 28px; 
    font-family:Arial;
    font-weight:900;
    margin-top:50px;

}
.headingwm1{
    font-size: 23px; 
    font-family:Arial;
    font-weight:900;
    margin-top:50px;
    color:#91d6f5;

}


/*ABOUT*/

.abt {
    width: 100%;
    max-width: 768px; 
    margin: 0 auto; 
    padding: 20px;
    box-sizing: border-box;
}

.abth2 {
    color: #2196e5;
    font-size: 20px;
    font-weight: 600;
}
.abtp1{
    word-wrap: break-word;
}
@media (max-width: 768px) {
    .abt {
        padding: 15px; 
    }
}
/*AFATHER*/
.card{
    box-shadow: 0 4px 8px 0 rgba(0,0,1,0.2);
    transition: 0.3s;
    display: block;
    background-color: white;
    margin-left: 30px;
    margin-right: 30px;
    margin-bottom: 2px;
    
   
    
   

    }
    .abody{
    background-color:#ebebeb;
    display: flex;
    flex-direction: column;
   

    }
    .contentdiv{
        background-color: #ebebeb;
        flex:1;
        
    }
   
    .content{
    padding: 2px 8px;
    background-color: white;
    font-family:'Nunito';
    overflow: hidden;
    word-wrap: break-word;
    text-overflow: ellipsis; 
    max-height: 5em;
    line-height: 1em;
   
   
   
    

   
   
    }
    .h1{
    color:#2196e5;
    font-family:'Nunito';
    margin-bottom: 5px;
    margin-left: 30px;
    font-weight: 900 !important;
    font-size: 25px !important;

    
    }
    .h4{
        color: #2196e5;
        font-family:'Nunito';
        margin-top: 5px;
        margin-left: 30px;
        font-weight: 900;
        font-size: 20px;
   
    }
    .nr{
        color: red;
        font-family:'Nunito';
        margin-top: 5px;
        font-weight: 900;
        font-size: 20px;
        text-align: center;
       
   
    }
    p{
        font-size: 14px;
    }
    .view {
        display: grid;
        grid-template-columns: 30% 30% 30%;
        text-align: center;
        justify-content: center;
        width: 100%;
        column-gap: 5%;
        margin-left: 5%;
        margin-bottom: 10px;

    }
    
   
    @media (max-width: 800px) {
        .view {
            grid-template-columns: 1fr; 
            margin-left: 0; 
        }
    }
    
.carda {
    text-decoration: none;
    color:black;
    text-align: center;
    font-size: 10px;
}
    .card1img{
        width:100%;
        height:200px;
    }

.carda h4{
    font-size: 20px;
    font-weight: 900;
}
/*BLOG*/

.blog1 {
    display: grid;
    grid-template-columns: auto;
    gap: 20px;
    justify-content: center;
    max-width: 100%;
    margin: 0 auto;
    padding: 20px;
    box-sizing: border-box;
}


.kensblog, .jesicablog {
    text-align: center;
    margin-bottom: 20px;
}

.kensblog h2, .jesicablog h2 {
    font-weight: 900;
    font-family: Arial;
}

.kensblog h2:hover, .jesicablog h2:hover {
    color: #f0c650;
    cursor: pointer;
}

.kb, .jb {
    font-weight: 900;
    font-family: Arial;
    margin-bottom: 10px;
}

.kenimg, .jesicaimg {
    margin-bottom: 20px;
    box-shadow: 2px 2px 2px 2px gray;
}


@media (min-width: 768px) {
    .blog1 {
        grid-template-columns: repeat(2, auto);
    }

    .kensblog {
        margin-right: 20px;
    }

    .jesicablog {
        margin-left: 20px;
    }
}

/*FOOTER*/

.fut{
    color:#91d6f5;
    text-align: center;
    padding-top: 4px;
    font-size: 25px; 
    letter-spacing: 3px;
   font-family:Arial;
    font-weight: 300;  

}

.foot{
    background-color:#424242;
    position:fixed;
   
}
ul{
    list-style-type: none;
    
    padding-top: 10px;
    overflow: hidden;
    display: block;

}


li p{
    display: inline;
    color: white;
    padding-left: 50px;
    padding-bottom: 10px;
    float: left;
}

li i {
    
    padding-left: 10px;
    color: white;
    border-radius: 5px;
    float: right;
    padding-right: 10px;
}
.grid{
    text-decoration: none;
    background-color: #424242;
   
   
  
    
}
li a{
    text-decoration: none;
    color: white;
    display: inline;
    text-align: end;
    font-style: normal;

}

.line{
width: 68%;
border: 1px solid black;
margin-left: 15% !important;
}

.footdiv {
    display: grid;
    grid-template-columns: auto auto;
    width: 100%;
    max-width: 500px;
    margin: 0 60%; 
    word-wrap: break-word;
}

.footdiv a:hover {
    font-weight: bold;
    color: #f0c650;
}


@media screen and (max-width: 600px) {
    .footdiv {
        grid-template-columns: auto; 
        max-width: 100%; 
        margin: 0;
    }
}

.link1{
   
   
    margin-left: 20%;
    font-family: Arial;
    font-weight: 500;
 


    }

/*YHWH*/
.view1{
    display: grid;
    grid-template-columns: auto;
    padding-top: 20px;
     text-align: center;
     justify-content: center;
   
   
   
   
}
.fyhwh{
    width: 500px;
    height: 250px;
    
}
.contentyhwh{
    background-color: white;
     padding: 2px 8px;
     width: 500px;
    text-align: center;
    margin-bottom: 10px;
   

  
}
.sl{
    text-decoration: none;
    color:#424242;
}
.contentyhwh h2{
    font-size: 20px;
    font-family: 'nunito';
    font-weight: bold;
}
.hpara{
    color:#2196e5;
    font-size:10px;
    font-weight: bold;
    letter-spacing: -1px;
    font-family: 'nunito';
    height: 4px;
    position: absolute;
   
   
}
.viewbody{
    background-color: #ebebeb;
    display: flex;
    flex-direction: column;
   

   
}
.replayform{
   
    text-align: left;
    margin-left: 20px;
    margin-right: 20px;
    padding: 10px 10px;
}
.pform{
    font-size: 12px;
    color: black;
}
.comment{
    font-size: 12px;
}
.commentbox{
    width: 430px;
    height: 200px;
    border: 1px solid;
}

.nameinput{
    margin-top: 10px;
    width: 133px;
    border: 1px solid;
    font-size: 12px;
    margin-right: 11px;
    padding: 5px;
}
.emailinput{
    margin-top: 10px;
    width: 133px;
    font-size: 12px;
    border: 1px solid;
    margin-right: 11px;
    padding: 5px;
}
.websiteinput{
    margin-top: 10px;
    width: 133px;
    font-size: 12px;
    border: 1px solid;
    margin-right: 11px;
    padding: 5px;
}
.submitbtn{
    padding:5px;
    margin-top: 10px;
    background-color: #3d51b0;
    color: white;
    font-size: 12px;
}
.socialmedia{
    text-decoration: none;
    padding: 50px;


}
.icon{
    color: black;
    font-size: 12px;
    margin-right: 20px;
    justify-items: center;
    margin-bottom: 20px;
}
.itext{
    font-style: normal;
    margin-left: 3px;
}
.fa-square-facebook{
    vertical-align: middle;
    color:#2d62be;
}
.fa-youtube{
    vertical-align: middle;
    color: black;
}
/* jeses */
.view1j{
    display: grid;
    grid-template-columns: auto;
    padding-top: 20px;
     text-align: center;
     justify-content: center;
   
   
   
   
}
.jeses{
    width: 500px;
    height: 250px;
    
}
.contentjeses{
    background-color: white;
     padding: 2px 8px;
     width: 485px;
    text-align: center;
   

  
}
.contentjeses h4{
    font-size: 20px;
    font-family: 'nunito';
}
.viewbody{
    background-color: #ebebeb;
   

   
}
.replayform1{
   
    text-align: left;
    margin-left: 20px;
    margin-right: 20px;
    padding: 10px 10px;
}
.pform{
    font-size: 12px;
    color: black;
}
.comment{
    font-size: 12px;
}
.commentbox{
    width: 430px;
    height: 200px;
    border: 1px solid;
}

.nameinput{
    margin-top: 10px;
    width: 133px;
    border: 1px solid;
    font-size: 12px;
    margin-right: 11px;
    padding: 5px;
}
.emailinput{
    margin-top: 10px;
    width: 133px;
    font-size: 12px;
    border: 1px solid;
    margin-right: 11px;
    padding: 5px;
}
.websiteinput{
    margin-top: 10px;
    width: 133px;
    font-size: 12px;
    border: 1px solid;
    margin-right: 11px;
    padding: 5px;
}
.submitbtn{
    padding:5px;
    margin-top: 10px;
    background-color: #3d51b0;
    color: white;
    font-size: 12px;
}
.socialmedia{
    text-decoration: none;
    padding: 50px;


}
.icon{
    color: black;
    font-size: 12px;
    margin-right: 20px;
    justify-items: center;
    margin-bottom: 20px;
}

.view1j{
    display: grid;
    grid-template-columns: auto;
    padding-top: 20px;
     text-align: center;
     justify-content: center;
   
   
   
   
}
/* power of God*/
.view1p{
    display: grid;
    grid-template-columns: auto;
    padding-top: 20px;
     text-align: center;
     justify-content: center;
   
   
   
   
}
.power{
    width: 500px;
    height: 250px;
    
}
.contentpower{
    background-color: white;
     padding: 2px 8px;
     width: 485px;
    text-align: center;
   

  
}
.viewbodyp{
    background-color: #ebebeb;
   

   
}
.replayform2{
   
    text-align: left;
    margin-left: 20px;
    margin-right: 20px;
    padding: 10px 10px;
}
.itext{
    
    font-style: normal;
    margin-left: 3px;
}
.icon{
    vertical-align: middle;
    color:#2d62be;
}
.icon1{
    vertical-align: middle;
}
.itext1{
   
    color:black;
    font-style: normal;
    margin-left: 3px;
}
.pform{
    font-size: 12px;
    color: black;
}
.comment{
    font-size: 12px;
}
.commentbox{
    width: 430px;
    height: 200px;
    border: 1px solid;
}

.nameinput{
    margin-top: 10px;
    width: 133px;
    border: 1px solid;
    font-size: 12px;
    margin-right: 11px;
    padding: 5px;
}
.emailinput{
    margin-top: 10px;
    width: 133px;
    font-size: 12px;
    border: 1px solid;
    margin-right: 11px;
    padding: 5px;
}
.websiteinput{
    margin-top: 10px;
    width: 133px;
    font-size: 12px;
    border: 1px solid;
    margin-right: 11px;
    padding: 5px;
}
.submitbtn{
    padding:5px;
    margin-top: 10px;
    background-color: #3d51b0;
    color: white;
    font-size: 12px;
}
.socialmedia{
    text-decoration: none;
    padding: 50px;


}
.icon{
    color: black;
    font-size: 12px;
    margin-right: 20px;
    justify-items: center;
    margin-bottom: 20px;
}

/*SUPPORT*/
body{
    background-color: #ebebeb !important;
    
    }
    .form{
        background-color: white;
        width: 30%;
       margin-top: 10%;
        margin-left: 30%;
        padding: 50px 50px;

    }
    input{
        width: 80%;
        padding: 8px 30px;
        box-sizing: border-box;
       
    }
    select{
        width: 80%;
        padding: 8px 30px;
        box-sizing: border-box;
    }
    /*STORE*/

    .store{
        width: 100%;
        max-width: 768px; 
        margin:  auto auto; 
        padding: 20px;
       
        box-sizing: border-box;
    }

    .h2{
        font-size: 25px;
        font-weight: 900;
        font-family: Arial;
    }
    .slink1{
    color:#2196e5;
    font-size:25px;
    margin-left: 0.5%;
    font-family: Arial;
    font-weight: 900;
 


    }

     a{
        text-decoration: none;
        font-size: 20px;
       
    }
    .slink{
        background-color: white;
        border: 1px solid;
        font-size: 25px;
        font-family: Arial;
        
    }

    
    body{
        background-color: #ebebeb;
        
        }
        .form{
            background-color: white;
            width: 30%;
           margin-top: 10%;
            margin-left: 30%;
            padding: 50px 50px;

        }
        input{
            width: 80%;
            padding: 8px 30px;
            box-sizing: border-box;
           
        }
        select{
            width: 80%;
            padding: 8px 30px;
            box-sizing: border-box;
        }
        /*CRE SOLAR*/
        .card4 {
            display: grid;
            grid-template-columns: auto;
            justify-content: center;
        }
        
        @media (min-width: 600px) {
            .card4 {
                grid-template-columns: auto auto;
            }
        }
        
        .framediv {
            padding-left: 5%;
            padding-right: 5%;
        }
        
        .frame {
           
            width: 500px;
            height: 300px;
            margin-right: 10px;
            
           
        }
        
        .content1,
        .content2 {
            padding: 2px 8px;
            width: 90%; /* Adjust the width as needed */
            max-width: 384px;
            text-align: center;
        }
        
        .content2 a {
            border: 1px solid blue;
            color: black;
            background-color: white;
            margin-left: 2px;
        }
        
        .content2 a:hover {
            box-shadow: 2px 2px 2px 2px;
            padding: 1px 1px 1px 1px;
            color: darkblue;
        }
        
         .tooltip-container {
            position: relative;
            display: inline-block;
          }
          
          .tooltip-text {
            visibility: hidden;
            width: 120px;
            background-color: #555;
            color: #fff;
            text-align: center;
            border-radius: 6px;
            padding: 5px;
            position: absolute;
            z-index: 1;
            bottom: -125%; 
            left: 50%;
            margin-left: -60px; 
            opacity: 0;
            transition: opacity 0.3s;
          }
          
          .tooltip-container:hover .tooltip-text {
            visibility: visible;
            opacity: 1;
          }