@charset "utf-8";
/* CSS Document */

div.gallery {
  border: 1px solid #bb0717;
}

div.gallery:hover {
  border: 1px solid #777;
}

div.gallery img {
  max-width: 100%;
  height: 250px;
}

div.galleryni {
  border: 1px solid #bb0717;
  padding: 10px;
}

div.galleryni:hover {
  border: 1px solid #777;
}


div.galleryni img {
  max-width: 100%;
  height: 250px;
}

div.gallerysan {
  border: 1px solid #bb0717;
  padding: 10px;
}

div.gallerysan:hover {
  border: 1px solid #777;
}

div.gallerysan img {
  max-width: 100%;
  height: 150px; 
}

div.gallerycir {
  position: relative; 
  max-width:180px;
  text-align: center;
  border: 1px solid #bb0717;
}

div.gallerycir:hover {
  border: 1px solid #777;
}

div.gallerycir img {
  max-width: 100%;
  height: 150px;
}

div.desc {
  font-size:0.8vw;
  padding: 15px;
  text-align: center;
  font-family:nasalization;
  word-wrap: normal;
}
div.desc2 {
  font-size:0.8vw;
  padding: 15px;
  text-align: center;
  font-family:nasalization;
  word-wrap: normal;
}
/*
* {
  box-sizing: border-box;
}
*/
.responsiveni {
  padding: 6px;
  float: left;
  max-width: 22%;
}

.responsivenismol {
  padding: 6px;
  margin: 0vw 2vw;
  float: left;
  width: 14%;
}

.responsivesan {
  padding: 6px;
  float: left;
  max-width: 700px;
  max-height:auto;
}

.responsiveshi {
  padding: 6px;
  margin-left: 12vw;
  float: left;
  max-width: 700px;
  max-height:auto;
}


@media only screen and (max-width: 800px) {
  .responsive {
    width: 49.99999%;
    margin: 6px 0;
  }
}

@media only screen and (max-width: 600px) {
  .responsive {
    width: 100%;
  }
}

@media only screen and (max-width: 400px) {
  .responsiveni {
    max-width: 100%;
	height:250px;
    float:left;
  }
  .desc {
    font-size: 10vw;
  }
}

@media only screen and (max-width: 768px) {
  .responsiveni {
    max-width: 96vw;
    padding-left: 6px;
    display:flex;
	flex-wrap:wrap;
  }
  .responsivesan {
    max-width: 96vw;
	margin-left: 0vw !important;
    padding-left: 6px;
    display:flex;
	flex-wrap:wrap;
  }
  .responsiveshi {
    max-width: 96vw;
	margin: 0vw;
    padding-left: 6px;
    display:flex;
	flex-wrap:wrap;
  }
  .responsivenismol {
    width: 42vw;
	margin-left:15vw;
    padding-left: 6px;
    display:flex;
	flex-wrap:wrap;
  }
  div.desc {
    font-size: 4vw; 
	font-weight:bold;
	padding: 0vw 21vw;
  }
  div.desc2 {
    font-size: 4vw; 
	font-weight:bold;
	padding: 0vw 5vw;
  }
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}