@font-face {
  font-family: 'PTserifBold';
  src: url("../fonts/PTSerif-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: normal;
}

@font-face {
  font-family: 'PTserifRegular';
  src: url("../fonts/PTSerif.ttf") format("truetype");
  font-style: normal;
  font-weight: normal;
}

@font-face {
  font-family: 'OpenSansRegular';
  src: url("../fonts/OpenSans-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: normal;
}

*{
  margin: 0;
  padding: 0;
}

#GobGallery{
  max-width: 1200px;
  width: 100%;
  margin: auto;
  text-align: center;
}

#GobGallery div,
#GobGallery p{
  box-sizing: border-box;
}

#GobGallery .btn-container{

}

#GobGallery .btn-container p{
  font-family: 'PTserifBold';
  font-size: 25px;
  display: inline-block;
  width: 31%;
  margin: 10px;
  margin-top: 15px;
  padding: 5px 0px;
}

#GobGallery .btn-container p:hover{
  cursor: pointer;
}

#GobGallery .btn-container p:nth-of-type(1){
  color: #98c990;
  border: solid 3px #98c990;
}

#GobGallery .btn-container p:nth-of-type(2){
  color: #eb9c26;
  border: solid 3px #eb9c26;
}

#GobGallery .btn-container p:nth-of-type(3){
  color: #55b4dd;
  border: solid 3px #55b4dd;
}

#GobGallery .btn-container p:nth-of-type(4){
  color: #0086ae;
  border: solid 3px #0086ae;
}

#GobGallery .btn-container p:nth-of-type(5){
  color: #dd3c1a;
  border: solid 3px #dd3c1a;
}

#GobGallery .btn-container p:nth-of-type(6){
  color: #38853f;
  border: solid 3px #38853f;
}

#GobGallery .btn-container p:nth-of-type(7){
  color: #f28f8f;
  border: solid 3px #f28f8f;
}

#GobGallery .btn-container p:nth-of-type(8){
  color: #224065;
  border: solid 3px #224065;
}

#GobGallery .btn-container p:nth-of-type(9){
  color: #9b9784;
  border: solid 3px #9b9784;
}

#GobGallery .galleryContainer .Gallery{

}

#GobGallery .galleryContainer .Gallery.inactive{
  display: none;
}

#GobGallery .btn-container p.active{
  /* border: none; */
}

#GobGallery .Gallery .tit p{
  font-family: "PTserifRegular";
  font-size: 40px;
  margin: 45px auto 25px auto;
}

#GobGallery .slide-container .slide{
  text-align: left;
}

#GobGallery .slide-container .slide p{
  font-family: 'OpenSansRegular';
  font-size: 14px;
  color: #51473c;
  margin-top: 10px;
}

/*========================================== GALLERY STYLES*/
.slide-container{
  max-width: 1200px;
  width: 100%;
  margin: auto;
  position: relative;
  overflow: hidden;
  margin-bottom: 25px;
}

.slide-container .slider{
  display: flex;
  /* width: 400%; */
}

.slide-container .slider .slide{
  width: 100%;
  height: 100%;
}

.slide-container .slider .slide p{
  width: 100%;
  margin: 0;
}

.slide-container .slider .slide img{
  display: block;
  width: 100%;
  height: 100%;
}

.slide-container .pager img{
  position: absolute;
  top: 50%;
  width: 45px;
  margin-top: -22px;
  cursor: pointer;
}

.slide-container .pager img.prev{
  left: 0;
  margin-left: 28px;

}

.slide-container .pager img.next{
  right: 0;
  margin-right: 28px;
}
/* ========================================== */



@media (max-width: 460px) {

  #GobGallery .btn-container p{
    width: 40%;
    font-size: 16px;
  }

  #GobGallery .Gallery .tit p{
    font-size: 24px;
    width: 80%;
  }

  #GobGallery .slide-container .slide p{
    font-size: 12px;
    width: 95%;
    margin-left: 3%;
  }

  #GobGallery .slide-container .pager img{
    width: 20px;
    top: 35%;
  }
}