*{
    font-size: 13px;
}
body{
    padding: 0px; margin: 0px; overflow-x: hidden; width: 100%; 
}

.showcase{
    background-image:url("../images/laptop-4906312_1920.jpg"); position: absolute;  width: 100%; 
    background-size: cover; background-position: fixed;  height: 100vh;
}

.showcase_cover{
    position: relative; width: 100%;  background-size: cover;  background-position: scroll;  height: 100vh;
    background:#2d31429d ;
}

@media(width < 600px){
    .showcase_cover{
        height:800px;
    }

    .showcase{
        height:800px;
    }
}


.showcase_cover img{
    width: 200px; height: auto; margin: 20px; 
}

.showcase_cover h1{
    color: #F4F4F4;  font-family: serif ; margin:30px; padding:20px;
}

.showcase_cover p{
    color: #F4F4F4; font-family: serif ; margin:60px; margin-top: -40px; font-size: larger;
    background: #1A1A1A; width: 13%; padding: 10px;

}


.showcover{
     display: flex; justify-content: space-between;
}


.showcover .empty_prt{
    width: 50px;
}

nav button{
    margin: 20px;  background: none; border: none; border-bottom: 1px solid #F4F4F4; color: #C6A664; 
    padding: 5px;
}

nav button:hover{
    transition: 0.1s; cursor: pointer; color: #F4F4F4; background: #4F3B78; padding: 5px;
    border-radius: 15px; margin: 20px;
}

@media(width < 600px){
    nav{
        width: 100%; height: 100vh; position: fixed;
    }

    nav button{
        background: none; border-bottom: 5px solid black ;
    }
}
.start_btn{
    margin: 50px; padding: 10px; color: #F4F4F4; border: 1px solid #4F3B78; border-radius: 15px;
    background: #C6A664;
}

.start_btn:hover{
    transition: 0.1s; cursor: pointer; color: #F4F4F4; background: #4F3B78; padding: 10px;
    border-radius: 15px; border: 1px solid #F4F4F4;
}


.second_part{
    background:  #2D3142; 
}

.second_part img{
   width: 100%; height: auto; border: 5px solid #C6A664;
    

}
@media(width < 600px){
    .second_part img{
         border: 5px solid #C6A664;
    
    }
   
}

.second_part h2{
    color: #C6A664; font-family: serif; 
}

.headlines h2{
    padding: 15px; margin: 20px; font-family: serif;
}

@media(width < 600px){
    .headlines{
        margin:0px;
    }
}

.headlines p{
    padding: 15px; margin: 20px;  font-family: sans-serif;
}

.footer{
    background: #C6A664;  width: 100%;  display: flex;
}

.other_btn button{
    color: #F4F4F4; padding: 10px; margin: 15px;  border:2px solid #C6A664; background: none;
    border-radius: 10px;
}

.other_btn button:hover{
    background: #F4F4F4; transition: 1s; cursor: pointer; border: white; color: #C6A664;
    border-radius: 15px;
}

@media(width < 600px){
     .other_btn button{
        width: 200px ;
     }
}
.email-signup {
      background: #4F3B78;    color: #F4F4F4;     padding: 2rem; border-radius: 8px;
       text-align: center;
    }


.email-signup input, .email-signup button {
   padding: 0.7rem; margin-top: 1rem;  border: none;    border-radius: 4px;
}


.foot{
    text-align: center; margin: 20px; padding: 10px; 
}

.icon_prt{
    justify-content: space-between; 
}

.abt_section{
    background-image:url("../images/workspace-1280538_1920.jpg"); position: absolute;  width: 100%; 
    background-size: cover; background-position: fixed;  height: 100vh;
}

.abtsection_cover{
    position: relative; width: 100%;  background-size: cover; background-position: fixed;  height: 100vh;
    background:rgba(0, 0, 128, 0.336);
}


.abtsection_cover h1{
    color: #F4F4F4;  font-family: serif ; margin:50px; padding:20px;
}

.abtsection_cover p{
    color: #F4F4F4; font-family:sans-serif ; margin:60px;  font-size: larger;
   
}

.about_sd{
    text-align: center;
}

.contact_part{
    background: #2D3142; 
}

.contact_part img{
    
    width: 500px; height: auto; margin: 50px; padding: 30px; border: 5px solid #C6A664;
}

@media(width < 600px){
    .contact_part img{
    
        width: 300px; height: auto; margin: 50px; padding: 30px; border: 5px solid #C6A664;
    }
}
.contact_part P{
    text-align: center; font-family: serif; font-size:30px; font-weight: 600;
    padding: 20px; margin: 10px; color: #C6A664;
}

textarea {
      width: 100%; padding: 10px; margin-bottom: 1rem; border: 1px solid #ccc;
       border-radius: 5px;  font-size: 1rem;
}

button {
    padding: 1rem 2rem;  background-color: #C6A664; color: #F4F4F4; border: none; border-radius: 5px;
    cursor: pointer;   font-size: 1rem;
}

.book_part{
    background: #2D3142; 
}

.book_part img{
    
    width: 500px; height: auto; margin: 50px; padding: 30px; border: 5px solid #C6A664;
}

.emoticare_part{
    background: #2D3142; 
}

.emoticare_part img{
    
    width: 500px; height: auto; margin: 50px; padding: 30px; border: 5px solid #C6A664;
}

.blog_section{
    background-image:url("../images/pen-4337521_1920.jpg"); position: absolute;  width: 100%; 
    background-size: cover; background-position: fixed;  height: 100%; 
}

.blogsection_cover{
    position: relative; width: 100%;  background-size: cover; background-position: fixed; 
    background:rgba(0, 0, 128, 0.336); height: 100%;
}


.blogsection_cover h1{
    color: #C6A664;  font-family: serif ; margin:50px; padding:20px; text-align: center;
}

.des{
    color: #C6A664; font-family:sans-serif ;  font-size: 15px; text-align:justify ;
    height: 50px; overflow: none;

   
}

.blog_prt{
    border-radius: 25px;
}

.blog_prt img{
    width: 80%; margin: 0px 20px; transition: 0.8s;
}

.dpholder img:hover{
    transform: scale(1.2); cursor: pointer;
}

.dpholder{
    background: none; align-items: center; justify-content: center; height: 300px; overflow: hidden;
    display: flex;
}

.readmore{
    float: right;
}

.dpholder img{
    width: 100%; height: auto;
}

.blog_prt button{
    background:none; border:none; color:#C6A664; padding: 5px;
}

.blog_prt button:hover{
    border-bottom: 1px solid #4F3B78;
}
em

.author{
    font-size: 13px; color: gray;
}

.dashboard-sidebar{
    background: black; padding: 10px; color: white; height: auto;
}

.dashboard-sidebar button{
    width: 100%; text-align: left; font-size: 13px;
}

.theme-btn{
    background: #C6A664; color: black; padding: 6px 12px; transition: 0.5s;
    cursor: pointer; border-radius: 10px; border: none;
}

.theme-btn:hover{
    background: #4F3B78; color: white; border: none;
}

.sec-btn{
    background: #4F3B78; color: white; padding: 6px 12px; cursor: pointer;
    transition: 0.5s;
}

.sec-btn:hover{
   color: #1A1A1A; background-color: white;
}


.sml-size{
   font-size: 12px;
}

.theme-bg{
    background: #2D3142;
}

.ai-portfolio{
  background: #2D3142; color: #C6A664; font-family: serif; padding: 60px 20px;
}

.portfolio-tabs button{
    background: transparent; border: 2px solid #C6A664;  color: #C6A664;  margin: 5px;
    padding: 8px 20px;  border-radius: 30px;
}

.portfolio-tabs  .active-btn{
    background: #C6A664;  color: #2D3142;
}

.videoTabs .active-btn{
     background: #C6A664;  color: #2D3142;
}


.portfolio-card{
  border: 5px solid #C6A664;  border-radius: 15px;  overflow: hidden;  margin-bottom: 25px;
  background: #1f2230;
}

.ai-portfolio img,.ai-portfolio video {
  width: 100%;  height: 225px;  object-fit: cover;
}

.videoTabs button{
  background: transparent;  border: 1px solid #C6A664;  color: #C6A664;  padding: 6px 14px;
  border-radius: 20px;  margin: 5px;  font-size: 14px;
}

.ai-portfolio .view-btn {
  background: #C6A664;  color: #2D3142;  border: none;  padding: 6px 16px;
  border-radius: 20px;  font-size: 14px;
}

.hidden{
    display:none; 
}