body{
	font-family: Lalezar, cursive;
    position: relative;
    margin: 0;
    padding: 0;
    min-height: 100vh;
    z-index: 0;
     
    background-image:url("../img/img28.jpg");
    background-size: cover ;
    background-repeat: no-repeat;
    text-shadow: 2px 2px 5px black;
}
    #m{
        color: rgb(122, 67, 12);
        font-size: 25px;
    }
    h1{
        text-align: center;
        color: rgb(250, 95, 5);
        font-size: 32px;
    }
    h2{ 
        text-align: center;
        font-size: 28px;
        color: rgb(2, 252, 210);
        border: 10px dashed rgb(150, 4, 248);border-radius: 10px;
    }
    p{
        font-size: 30px;
        color: rgb(218, 255, 5);
text-align: center;
        
        
    }
    

    h3{
        font-size: 25px;
        color: rgb(173, 243, 237);
    }
    h4{
        color: rgb(91, 3, 253);
        font-size: 30px;
    }
    a{
        color: rgb(247, 3, 247);
    }
    h5{
        font-size: 30px;
    }
   


#photo-page .open-modal {

  width: 200px;

  cursor: pointer;

  border-radius: 10px;

  transition: 0.3s;

}

#photo-page .open-modal:hover {

  transform: scale(1.05);

}

#photo-page .modal {

  display: none;

  position: fixed;

  z-index: 1000;

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  background: rgba(0,0,0,0.7); 

  justify-content: center;

  align-items: center;
background-size: 100px; 
}

#photo-page .modal-content {}

#photo-page .modal-content img {

  width: 100%;

  margin-top: 10px;

  border-radius: 10px;

}

#photo-page .close {

  float: right;

  font-size: 80px;

  cursor: pointer;
color: white; 
margin-top: -40px;  

margin-right: -50px; 
}
h6 {
font-size: 100px;
color: yellow; 
} 
.video-container{
  text-align: center;
  display: flax; 
  margin: 20px 0;
 position:relative;
	width:80%;
	max-width:700px;
	margin:20px auto;
	padding-bottom:56.25%;
	height:0;
} 
.video-container iframe {
position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
border-radius:12px;
}
.subscribe-btn {
display: block;
	margin:20px auto;
	padding: 12px 24px;
font-size:20px ;
font-family: 'Lalezar', sans-serif;
color: white;
	background:#ff0000;
	border-radius:12px;
	text-decoration: none;
	text-align: center;
	transition: 0.3s;
}

.subscribe-btn:hover {
background: #cc0000
}




.menu-bar {

  text-align: right; 

  padding: 0 20px;

}

.dropbtn {

  background-color: yellow;

  color: black;

  padding: 10px;

  font-size: 30px;

  border: red 5px solid;

  cursor: pointer;

  border-radius: 6px;

  margin-left: 10px;
font-family: Lalezar, cursive; 
}

.dropbtn:hover {

  background-color: #666;

}

.dropdown {

  display: inline-block;

  position: relative;

}

.dropdown-content {

  display: none;

  position: absolute;

  right: 0;

  background-color: #333;

  min-width: 160px;

  z-index: 1;

  border-radius: 6px;

}

.dropdown-content a {

  color: white;

  padding: 10px 14px;

  text-decoration: none;

  display: block;

}

.dropdown-content a:hover {

  background-color: #555;

}

.show {

  display: block;

}
.my{
background: #111;
text-align: center; 
color: red; 
	border: 10px red solid; 
} 
.site-footer {
background: #111;
text-align: center; 
color: yellow; 
border: 10px red solid; 
} 
.my p {
color: gray; 
font-size: 30px; 
	text-align: center 
} 
.my h1{
display: inline; 

gap: 8px; 
color: red; 
font-size: 20px; 
} 
.my .logo {
display: inline; 

} 
.navbar {

  display: flex;

  justify-content: space-between; /* سمت راست و چپ */

  align-items: center;

  padding: 10px 20px;

  background: #222;

  color: white;

}

.nav-left {

  flex: 1;

}

.nav-right {

  display: flex;

  gap: 15px; /* فاصله بین دکمه‌ها */

}

.search-box {

  position: relative;

}

.search-box input {

  padding: 6px 10px;

  border-radius: 5px;

  border: none;

}

.search-results {

  position: absolute;

  top: 35px;

  left: 0;

  right: 0;

  background: white;

  color: black;

  border: 1px solid #ccc;

  display: none;

  max-height: 200px;

  overflow-y: auto;

  z-index: 999;

}

.search-results div {

  padding: 8px;

  cursor: pointer;

}

.search-results div:hover {

  background: #eee;

}