@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@500&family=Cuprum&family=Kanit&family=Lilita+One&family=Old+Standard+TT&family=Pathway+Gothic+One&family=Patua+One&family=Saira+Condensed:wght@200&family=Unbounded:wght@500&display=swap');
html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}

* {
  box-sizing: border-box; 
  margin:0;
    padding:0;
}

body {
    color:rgb(0, 0, 0);
    font:14px Arial,sans-serif;
  background-color: rgb(255, 200, 0);
  /* background-image: url(./images/bg2.jpg); */
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  /* height: 1000%; */
 
}
#wrap {
    width: 980px;
    margin: 0 auto;
    background-color: #fff;
    
    /* padding: 0 40px 0 40px; */
  }
header {
    height: 240px;
    background-color: rgb(45, 200, 99);
    background-image: url(./images/brrrr.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    display: table;
    width: 100%;
  }
  
  /* header h1 {
    color: rgb(255, 255, 255);
    text-align: center;
    text-shadow: 2px 3px black;
    font-family: Arial, Helvetica, sans-serif;
    margin: 0; 
    font-size: 40px;
    display: table-cell;
    vertical-align: middle;
  } */
  /* BODY {
    display: flex;
    align-items: center;
    justify-content: center;
    background: white;
    font-family: Georgia;
    } */
  H1 {
    font-size: 50px;
    font-weight: normal;
    cursor: pointer;
    text-shadow: 0 0 15px rgb(255, 255, 255);
    color: transparent;
    transition: all .5s;
    font-family: 'Cuprum', sans-serif;
    vertical-align: middle;
    display: table-cell;
   
    padding-left: 380px;
    }
    H1:hover {
      text-shadow: 0 0 0px rgb(255, 255, 255);
      cursor: pointer;
      font-family: 'Cuprum', sans-serif;
      vertical-align: middle;
    display: table-cell;
    padding-left: 380px;
     
      }
 
  h2, h3 {
    color: rgb(255, 153, 0);
    /* text-shadow: 2px 2px black; */
    font-family: Arial, Helvetica, sans-serif;
    text-decoration: underline;
    
    padding: 20px;
    display: table-cell;
    vertical-align: middle;
    text-align:center;
  }
  p{
    padding-left: 20px;
    padding-right: 15px;
    text-align: justify;
  }
  
/* body {
    background-color:rgb(255, 242, 0);
    
} */

/* h2{
    font-size:25px;
    margin:40px 0 10px 0;
	
} */

/* 
  /* .menu{ 
    text-align:center; 
    font-size:18px; 
    padding: 20px 0 40px; 
    margin:10px 0;
    float:left;
    list-style:none; 
     font-family: Arial, Helvetica, Sans-serif;
    font-weight:bold;
   
  }
nav li{ 
    margin:10px;
    font-family: Arial, Helvetica, sans-serif;
    width: 150px;
    float:left;
    
    
  }
  
  nav li a{ 
    padding:20px;
    display:block;
    color: #e4ffb2;
    background:#637935; 
     text-decoration: none; 
     border-radius: 50px; 
  }
  
  nav li a:hover{ 
    color: rgb(251, 255, 176);
    background:#432d00;
    transition: all 1s;
  } */
  
  aside,
  main {
    display: inline-block;
    vertical-align: top;
    padding: 20px;
  }
  
  /* nav {
    width: 25%;
  } */
  
  aside {
    width: 20%;
   float: right;
   height: 1000px;
  }
   
  
  main {
    width: 80%;
    border-top-left-radius: 50%;
  }
  .gallery{	
	width:550px;
  display: block;
	margin:50px auto auto 31%;
  /* justify-content: space-between;
  align-items: center; */
  /* align-content: center;
  object-fit: cover; */
}
.gallery a{
	display:inline-block;
	background:#fff;
	margin-top:5px;
	padding:5px; 
  object-fit: cover;
  background-size: cover;
  
}

.titlee {
    font-size: 50px;
    font-weight: normal;
    cursor: pointer;
    text-shadow: 0 0 15px rgb(52, 52, 52);
    color: transparent;
    transition: all .5s;
    font-family: 'Cuprum', sans-serif;
    vertical-align: middle;
    display: table-cell;
   padding-top: 50px;
    padding-left: 270px;
    padding-bottom: -80px;
    }
   .titlee:hover {
      text-shadow: 0 0 0px rgb(39, 39, 181);
      cursor: pointer;
      font-family: 'Cuprum', sans-serif;
      vertical-align: middle;
    display: table-cell;
    padding-left: 270px;
    padding-top: 50px;
    padding-bottom: -80px;
      }
 	

.gallery a:hover    { 
	background:rgb(255, 162, 0);
 }
 .photo{
	background: #fff;
	width:300px;
	height:300px;
	margin:30px auto;
  object-fit: cover;
}
.photos {
    width: 0;
    height: 0;
    position: fixed;
    overflow: auto;
    left: 0;
    top: 0;
    background: rgba(255, 63, 165, 0.5); 
    /* object-fit: cover;
  background-size: cover; */
}
.photos img  {
	opacity: 0;
	padding: 35px;
    padding-bottom: 50px;
	background: #ffffff;
	margin-top: 0px;
  width: 500px;
 
}
.photos:target {
    width: auto;
    height: auto;
    bottom: 0;
    right: 0;
}
 .photos:target img {
    opacity: 1;
}
  footer {
    height: 100px;
    background-color: rgb(255, 0, 132);
    background-image: url(./images/tyuiop.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    display: table;
    width: 100%;
  }
  
  footer a {
    color: rgb(210, 255, 200);
    text-align: center;
    text-shadow: 2px 2px black;
    font-size: 20px;
    font-family: Arial, Helvetica, sans-serif;
    text-decoration: none;
    margin: auto;
    display: table-cell;
    vertical-align: middle;
  }