/* Theme */
.section-report .report-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.25rem 0;
  border-bottom: 1px solid lightgray;
}
.section-report .report-item .report-title {
  font-size: 1.375rem;
  margin: 0;
}
.section-report .report-item .btn img {
  width: 1rem;
  margin-right: 0.4375rem;
  vertical-align: middle;
}

/* Section */
.section-news-highlight {
  /* padding: 6.25rem 0; */
  min-height: 1000px;
  height: 100vh;
  background-image: url('/public/img/background/background-animal-info.jpg');
  /* background-color: #0C79CB; */
}
/* Image */
.organizational-structure-page img{
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.card-content-aquarium{
  background: #e9e9e9;
  transition: 500ms ease;
}
.card-content-aquarium:hover{
  background: #0C79CB;
}
.card-content-aquarium:hover .text-content{
  color: white;
}
.card-content-aquarium:hover .text-content h3{
  color: #FECE00;
}
.card-content-aquarium .text-content{
  padding: 2em;
  font-size: 1rem;
}
.card-content-aquarium >.col:not(.text-content){
  padding: 0;
}
.card-content-aquarium .carousel{
  object-fit: cover;
}
/* button */
/* .btn{
  border: 0.2rem solid #FECE00;
  overflow: hidden;
  position: relative;
  background: #FECE00;
  z-index: 1;
}
.btn::before{
  content: "";
  position: absolute;
  top: -100%;
  left: 0;
  bottom: 100%;
  right: 0;
  background: white;
  display: block;
  z-index: -1;
  transition: 0.35s ease;
}
/* .btn:hover{
  color: #FECE00;
} 
.btn:hover::before{
  top: 0;
  bottom: 0;
} */
/* Card */
.card-news {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: white;
  height: 23rem;
  transition: 500ms ease;
  margin: 1.5rem 0;
  border-radius: 2px;
}

.card-news .card-image{
  width: 22em;
  height: 14em;
  position: absolute;
  top: 1.875rem;
  transition: 500ms ease;
  
}
.card-news .card-image img{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
  border-radius: 2px;
  transition: 400ms ease;
  /* border: 1rem solid white; */
}
.card-news .card-content {
  position: absolute;
  overflow: hidden;
  padding: 1.625rem;
  height: 7rem;
  top: 14.5rem;
  transition: 500ms ease;
}
.card-news .card-title {
  padding-top: 0.5rem;
  font-size: 1.75rem;
  height: 4.8rem;
}
.card-news .card-content .card-brief {
  margin-bottom: 1rem;
  font-size: 1.125rem;
  /* line-height: 1.375rem; */
  height: 8rem;
}
.card-news .card-action {
  /* padding: 1.625rem;
  padding-top: 0; */
  padding: 0;
  margin-top: 1.5rem;
}
.card-news .card-action .btn img {
  width: 2.5rem;
}
.card-news .card-action .btn span {
  margin: 0 0.75rem;
}

.card-news .card-action .btn::before{
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 0.5rem;
  background-color: #FECE00;
  transition: transform 300ms ease-in-out;
  transform: scaleX(0);
}
.section-plan .thumbnail {
  width: 100%;
  border: solid lightgrey 1px;
  aspect-ratio: 1241/1754;
}
.marine-card img{
  width: 100%;
}
.marine-card .image{
  margin-right: 50px;
}
.topic-underline{
  position: relative;
  font-size: 3rem;
  margin-top: 0;
  margin-bottom: 3rem;
  width: fit-content;
  transition: 300ms ease;
}
.topic-underline:after {
  content: "";
  height: 0;
  max-width: 3rem;
  width: 25%;
  position: absolute;
  bottom: -12px;
  left: 0;
  border-bottom: 0.4375rem solid #0C79CB;
  transition: 300ms ease;
}
.marine-card{
  display: flex;
  padding-bottom: 50px;
  margin-bottom: 50px;
  border-bottom: 1px solid lightgray;
}
.marine-card .content {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.marine-category .row {
  margin: 0 -2.125rem;
}
.marine-category .row .col {
  padding: 0 2.125rem;
}
.marine-category .marine-item {
  display: flex;
  flex-direction: column;
}
.marine-category .marine-thumbnail {
  width: 100%;
  height: 17.75rem;
}
.marine-category img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* .underwater-container .header-card{
  flex-direction: column;
} */
.underwater-container .header-card .text,
.underwater-container .header-card .image{
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0;
  
  background-color: #E8E8E8;
}
/* Button */
.card-news .card-action .btn {
  color: black;
  background-color: transparent;
  display: flex;
  align-items: center;
  padding: 0;
  font-size: 1.125rem;
}
.marine-card .btn,
.section-plan .btn {
  font-size: 1rem;
  margin: 0.625em 0 2.5em;
}
.marine-card .btn img,
.section-plan .btn img {
  width: 1rem;
  margin-right: 7px;
  vertical-align: middle;
}
.marine-card .btn{
  align-items: flex-end;
  align-self: flex-start;
  margin-top: auto;
  margin-bottom: 0;
}
.marine-category .card-title {
  margin-top: 0.5em;
}
.marine-category .btn{
  align-items: center;
  align-self: center;
  margin: 1em 0 3.125em 0;
}

/*royal-words-page*/
.royal-container .royal-card{
  margin-top: 4rem;
}
.royal-container .royal-card img{
  width: 100%;
  object-fit: cover;
}
.royal-container .royal-card .text{
  display: flex;
  flex-direction: column;
  margin: auto 1.875rem;
}
.royal-card .royal-word{
  margin-top: 6rem;
}
.flex-left{
  display: flex;
  align-self: flex-start;
}
.flex-right{
  display: flex;
  align-self: flex-end;
}
/* .royal-container .royal-card .text:after{
  content: "";
  position: absolute;
  bottom: 0;
  left: 45%;
  height: 0;
  width: 10%;
  border-bottom: 5px solid #0C79CB;
} */
.royal-container .royal-card .text img{
  width: 3.579rem;
}

/* marine-table */
.marine-table{
  width: 100%;
  margin-top: 40px;
}
.marine-table th,
.marine-table td{
  padding: 1rem 4rem;
  border-radius: 0;
}
.marine-table tr:nth-child(even){
  background-color: #F1F0F0;
}
.marine-table tr:nth-child(odd){
  background-color: #DEDEDE;
}
.marine-table tr{
  border-bottom: 0;
}
.marine-table th{
  padding: 12px 0;
  text-align: center;
  background-color: #717171;
  color: white;
}
#species{
  font-style: italic;
}

/* faq page */
.faq-container li.active img{
  transform: rotate(45deg);
}
.faq-container img{
  transition: ease 300ms;
  width: 2rem;
  height: 2rem;
}
.faq-container li.active .collapsible-header{
  background-color: #FEC52E;
  color: black;
}
.faq-container .collapsible-header{
  justify-content: space-between;
  background-color: #135EA8;
  color: white;
}
.faq-container .collapsible-body p{
  margin-bottom: 20px;
}
.faq-container .collapsible-body{
  background-color: #EEEEEE;
}
.faq-container .collapsible-header img{
  margin: auto 0;
}
.faq-container .collapsible-header h4{
  margin-left: 20px; 
}
.faq-container .collapsible-body p{
  margin-left: 5px; 
}
.faq-container{
  border: none;
}
.faq-announce{
  background-color: #EEEEEE;
  margin-top: 150px;
  font-size: 1.5rem;
}
.faq-announce p{
  padding: 20px 30px;
}
/* gift-shop */
.giftshop-container .topic-underline{
  font-size: 2rem;
  margin-top: 80px;
}
.giftshop-container .owl-dots{
  margin: 15px auto;
  text-align: center;
}
.giftshop-container .owl-dots .owl-dot span {
    width: 15px;
    height: 15px;
    margin: 10px 0.4375rem;
    background: #D6D6D6;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity 200ms ease;
    border-radius: 30px;
}
.giftshop-container .giftshop-announce{
  background-color: #F0F0F0;
  padding: 20px;
  margin-top: 80px;
}
.giftshop-container .giftshop-announce .topic-underline{
  font-size: 1.2rem;
  margin: 1rem 0 0;
}
.giftshop-container .giftshop-announce span{
  font-size: 1.5rem;
}
.giftshop-container .giftshop-announce img{
  width: 2.5rem;
  margin: 0 10px;
}
.giftshop-container .giftshop-announce{
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px;
}
.giftshop-container .giftshop-announce .contact{
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 30px;
  transition: 300ms ease;
}

/* admission-fee */
.fee-card{
  margin: 20px;
}
.fee-card .fee-header{
  background-color: #1267B4;
  color: white;
  padding: 10px;
  font-size: 1.5rem;
  height: 4.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 300ms ease;
}
.fee-card .fee-header .detail{
  font-size: 0.8rem;
}
.fee-card .fee-body{
  position: relative;
  padding: 3.5rem;
  min-height: 20rem;
  box-shadow: inset 0 0 0 50vw rgba(0,0,0,0.5);
}
.marine-animal-content img,
.underwater-container img,
.fee-card .fee-body img,
.fee-card .fee-body .fee-content .fee-text{
  width: 100%;
  object-fit: cover;
}
.fee-card .fee-body .fee-content .row{
  margin-bottom: 0;
}
.fee-container .row .col,
.fee-card .fee-body .fee-content .row .col{
  padding: 0;
}
.fee-card .fee-body .fee-content p{
  font-size: 1.2rem;
  margin: 10px 0;
  padding: 0 10px;
}
.fee-line{
  background-color: #135EA8;
  margin: 10px 0 30px;
  padding: 10px;
}
.fee-line .bold{
  color: #FBBB3B;
  font-size: 1.7rem;
}
.fee-line .medium{
  color: white;
  font-size: 1.5rem;
}
.fee-contact{
  position: relative;
  box-shadow: inset 0 0 0 50vw rgba(0,0,0,0.5);
  padding: 2.5rem;
  margin-top: 80px;
}
.fee-contact .content .contact-header{
  color: #135EA8;
  font-size: 1.7rem;
}
.fee-container .left-0{
  margin-left: 0;
}
.fee-container .right-0{
  margin-right: 0;
}
.fee-super-header {
  background: url("/public/img/content/admission-fee/img_13062023-001.jpg");
  box-shadow: inset 0 0 0 50vw rgba(0,0,0,0.5);
  padding: 2.5rem;
}
.fee-super-header .fee-super-body{
  font-size: 2rem;
}
.fee-super-header .fee-super-body .content:after{
  content: "";
  display: inherit;
  margin: 5px auto;
  border-bottom: 0.4375rem solid #135EA8;
  width: 10%;
  transition: 500ms ease;
}
.fee-card-container{
  margin-bottom: 50px;
}

/* underwater */
.underwater-container .header{
  color: #1267B4;
  line-height: 3rem;
  font-size: 2rem;
  position: relative;
  margin-bottom: 60px;
}
.underwater-container .header span{
  font-size: 1.8rem;
}
.underwater-container .header:after{
  content: "";
  border-bottom: 0.4375rem solid #1267B4;
  position: absolute;
  bottom: -15px;
  left: 0;
  width: 5%;
  transition: 500ms ease;
}
.underwater-container .row .col{
  margin: 0;
  padding: 0;
}
.underwater-container .text{
  padding: 1rem 1.5rem;
}
.underwater-container .text .medium{
  margin-left: 1.875rem;
}
.bg-gray{
  background-color: #E8E8E8;
}
.underwater-container .owl-carousel{
  margin-top: 3.125rem;
}
.underwater-container .owl-carousel .card-content{
  background-color: #14569B;
  color: white;
  padding: 1.5rem 1rem;
  margin-top: 0;
  height: 16.313rem;
  transition: 500ms ease;
}

/* contact-us-container */
.contact-us-container .bg-img{
  background-image: url("/public/img/content/contact-us/img_14062023-001.jpg");
  box-shadow: inset 0 0 0 50vw rgba(0,0,0,0.5);
  padding: 6rem;
}
.contact-us-container .content h2{
  color: #1367B5;
  margin-top: 0;
  font-size: 2.5rem;
}
.text-box{
  padding: 1rem;
  background-color: white;
  position: relative;
}
/* .fee-contract .text-box,
.fee-card .text-box{
  padding: 1rem;
  background-color: white;
  width: 80%;
  height: 80%;
  display: flex;
  align-items: center;
  justify-content: center;
} */
.contact-us-container .content .email{
  color: #1367B5;
  transition: 300ms ease;
}
.contact-us-container .topic-underline{
  margin: 5rem 0 3rem;
  font-size: 2.5rem;
}
.contact-us-container .map iframe{
  width: 100%;
  height: 42.375rem;
}

/* animation */
.card-news .card-action .btn:hover::before{
  transform: scaleX(1);
}
.topic-underline:hover:after{
  width: 100%;
  max-width: 100%;
}
.marine-table:hover th,
.giftshop-container .owl-dots .owl-dot.active span, 
.owl-theme .owl-dots .owl-dot:hover span {
    background: #135EA8;
}
.marine-animal-content a:hover,
.topic-underline:hover,
.giftshop-container .giftshop-announce .contact:hover{
  color: #135EA8;
}
.topic-underline:hover:after,
.underwater-container .header:hover:after,
.fee-super-header .fee-super-body .content:hover:after{
  border-color: #FBBB3B;
}

.fee-super-header .fee-super-body .content:hover:after{
  width: 100%;
}
.underwater-container .header:hover:after{
  width: 60%;
}
.fee-card:hover .fee-header,
.underwater-container .owl-carousel .item:hover .card-content{
  background-color: #FBBB3B;
  color: black;
}
.contact-us-container .content .email:hover{
  color: #FBBB3B;
}
.marine-animal-content a,
.marine-table th{
  transition: 300ms ease;
}



.site-menu a{
  transition: 300ms ease;
  position: relative;
  padding-left: 1.25rem;
}
.site-menu a:after{
  content: "";
  background-image: url('/public/img/icon/icon-koi-fish.png');
  background-size: cover;
  background-repeat: no-repeat;
  width: 1.6rem;
  height: 1.6rem;
  display: block;
  position: absolute;
  left: -1rem;
  top: 0;
  opacity: 0;
  transition: opacity 0.1s ease;
}
.site-menu a:hover:after{
  transition: opacity 1.3s ease;
  opacity: 1;
}
.site-menu a:hover{
  color: #5880B3;
  margin-left: 0.625rem;
}
.sitemap-contact .email:hover,
.copyright-policy a:hover{
  color: #5880B3;
}
.copyright-policy a,
.sitemap-contact .email,
.sitemap-contact a .icon{
  transition: 300ms ease;
}
.sitemap-contact a .icon:hover{
  filter: brightness(1.9);
}

.nav-search{
  background-color: #135EA8;
  border-radius: 40px;
  height: 3.2rem;
  padding: 6px;
  transition: 500ms ease;
}
.nav-search input{
  border-radius: 4px;
}
.nav-search .btn-search{
  color: white;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 40px;
  background: #1070C1;
  border: 2px solid #135494;
  padding: 0;
  /* transition-delay: 2s; */
}

.card-content .nav-search,
.card-content .nav-search input[type=text]:not(.browser-default){
  border-radius: 4px;
}
nav .nav-search .input-field input:hover,
nav .nav-search .input-field input:focus,
nav .nav-search:hover > .input-field input,
nav .nav-search:focus > .input-field input{
  width: 16rem;
  padding: 0 10px;
  transition: all 400ms;
  border-radius: 4px;
}

nav .nav-search:focus-within,
nav .nav-search:hover,
nav .nav-search:focus{
  border-radius: 4px;
}
.nav-search:hover .btn-search,
.nav-search:focus .btn-search{
  background: #FBBB3B;
  border: 2px solid white;
  /* border-radius: 4px; */
  transition: all 400ms;
}

.home-page .parallax img{
  max-width: 120%;
}
footer .site-menu .col{
  margin-top: 3rem;
}
footer .sitemap .site-menu .menu-list {
  height: 10rem;
}
.underwater-container .header-card .content{
  padding: 1rem;
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
  
  html, body {
    font-size: 12px;
  }
  .btn-them.btn-them-yellow.btn-large{
    height: 2.25rem;
    line-height: 2.5rem;
    font-size: 0.75rem;
    padding: 0 1rem;
  }
  /* home */
  .banner-animal-info .banner-content {
    padding: 2.5rem 2rem 1.5rem;
    width: 150%;
  }
  .banner-highlight .banner-content{
    width: 70%;
    left: 2.25rem;
    top: 60%;
  }
  .banner-visit-place .banner-content{
    width: 100%;
    padding: 1.8125rem 2.8125rem;
    left: auto;
  }
  .banner-news-release .banner-content{
    width: 100%;
    right: 0;
    bottom: 0;
    top: auto;
    transform: none;
    padding: 1.8125rem 2.8125rem;
  }
  .section-news-highlight{
    height: auto;
    background-color: #1070C1;
    background-image: none;
  }
  .banner-visit-place .banner-detail .banner-title,
  .banner-animal-info .banner-content .banner-title,
  .banner-news-release .banner-content .banner-title,
  .banner-highlight .banner-content .banner-title h1{
    font-size: 1.5rem;
    line-height: 2rem;
  }
  .banner-visit-place .banner-detail .banner-brief,
  .banner-animal-info .banner-content .banner-brief,
  .banner-news-release .banner-content .banner-brief,
  .banner-highlight .banner-content .banner-brief p{
    font-size: 1rem;
    line-height: 1.5rem;
    display: block;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
  }
  .banner-visit-place .banner-content .banner-header .text{
    padding-right: 0.25rem;
  }
  .banner-visit-place .banner-content .banner-img{
    height: 11.875rem;
  }
  .banner-animal-info .banner-content .banner-brief,{
    height: 7.375rem;
  }
  /* .banner-visit-place .banner-content .banner-detail{
    padding: 1.5rem;
  } */
  
  .banner-animal-info .banner-content .btn{
    margin-top: 0;
  }
  .carousel-animal .item img{
    width: 80%;
    height: auto;
    margin: 1rem auto;
  }
  .carousel-animal .owl-nav img{
    height: 2rem;
  }
  /* admission-fee */
  .fee-card .fee-header,
  .fee-contact .content .contact-header,
  .fee-super-header .fee-super-body{
    font-size: 1.25rem;
  }
  .fee-card .fee-body .fee-content p {
    margin: 0.25rem 0;
    font-size: 1rem;
  }
  .fee-card .fee-body{
    min-height: 0;
  }
  .fee-container .left-0,
  .fee-container .right-0{
    margin: 0.75rem auto;
  }
  .fee-contact{
    margin-top: 1.5rem;
  }
  
  .fee-line .bold,
  .fee-line .medium{
    font-size: 1rem;
  }
  .fee-contact .content .contact-body{
    font-size: 0.75rem;
  }
  .banner-visit-place .banner-content .banner-header .text .title{
    line-height: 1.5rem;
  }
  .card-news{
    margin-top: 3rem;
    height: 35rem;
  }
  .card-news .card-image{
    width: 100%;
    top: auto;
  }
  .card-news .card-content{
    padding: 2rem;
    height: 22.9rem;
    font-size: 1rem;
    top: 12.5rem;
  }
  .card-news .card-title{
    height: 2rem;
    font-size: 1.5rem;
  }
  .card-news .card-action{
    margin-top: 4.5rem;
  }
  .parallax-container .parallax img{
    object-fit: cover;
  }
  .banner-visit-place .banner-content .banner-header{
    flex-direction: column;
  }
  .banner-visit-place .banner-content .banner-header .flex-item{
    margin: 0.5rem 0;
    border: none;
  }
  .faq-container .collapsible-header h4,
  .banner-visit-place .banner-content .banner-header .text .title{
    font-size: 1.1rem;
  }
  .faq-container .collapsible-body p,
  .banner-visit-place .banner-content .banner-header .text .subtitle{
    font-size: 0.85rem;
  }
  .faq-container .collapsible-header h4{
    margin: auto 0.8rem;
  }
  .faq-container .collapsible-body p{
    line-height: 0.8rem;
  }
  .giftshop-container .topic-underline{
    margin-top: 42rem;
  }
  .giftshop-container .owl-dots .owl-dot span{
    width: 0.8rem;
    height: 0.8rem;
  }
  .giftshop-container .giftshop-announce span{
    font-size: 1rem;
  }
  .underwater-container .header-card{
    flex-direction: column;
  }
 
  .card-content-aquarium .col{
    margin: 1.2rem auto;
  }
  .underwater-container .header-card{
    display: block;
  }
  .royal-container .royal-card .col{
    padding: 0;
  }
  .royal-container .royal-card .text{
    padding-top: 4rem;
  }
  nav .nav-wrapper{
    padding: 0;
  }
  footer .sitemap .site-menu .menu-list{
    height: unset;
  }
  .giftshop-container .owl-dots .owl-dot span{
    width: 10px;
    height: 10px;
  }
  .page-them .page-content .page-title{
    font-size: 2.375rem;
  }
  nav .nav-wrapper{
    padding: 0 1.875rem;
  }
  footer .sitemap .sitemap-wrapper,
  footer .copyright .copyright-wrapper{
    padding: 1rem 1.875rem;
  }
  nav .sidenav-trigger{
    margin-left: 0;
  }
  .nav-search .btn-search{
    width: 2.8rem;
  }
}

@media only screen and (min-width: 601px) and (max-width: 992px) {
  nav, nav .nav-wrapper i, nav a.sidenav-trigger, nav a.sidenav-trigger i{
    height: 1.5rem;
    margin-left: 0;
  }
  nav .nav-wrapper{
    padding: 0 1.875rem;
  }
  header.navbar-fixed,
  nav{
    height: 4.25rem;
  }
  .nav-search .btn-search{
    width: 3rem;
  }
  .banner-visit-place .banner-detail .banner-title,
  .banner-news-release .banner-content .banner-title,
  .banner-highlight .banner-content .banner-title h1{
    font-size: 2.25rem;
    line-height: 2.875rem;
  }
  .banner-visit-place .banner-detail .banner-brief,
  .banner-animal-info .banner-content .banner-brief,
  .banner-news-release .banner-content .banner-brief,
  .banner-highlight .banner-content .banner-brief{
    font-size: 1rem;
    line-height: 1.5rem;
  }
  .banner-highlight .banner-content{
    width: 54.5%;
  }
  .card-news{
    margin-top: 3rem;
    height: 24rem;
  }
  .card-news .card-image{
    width: 100%;
    top: auto;
  }
  .card-news .card-content{
    height: 15.5rem;
    font-size: 1rem;
    top: 8.5rem;
  }
  .card-news .card-title{
    height: 2.8rem;
    font-size: 1rem;
  }
  .card-news .card-image img{
    height: 70%;
  }
  .card-news .card-content .card-brief{
    height: 5.4rem;
  }
  .card-news .card-action .btn img{
    width: 2rem;
  }
  .btn-them.btn-them-yellow.btn-large{
    height: 3rem;
    line-height: 3rem;
    font-size: 1rem;
  }
  .banner-animal-info .banner-content .banner-title {
    font-size: 2.25rem;
    line-height: 2.875rem;
  }
  .banner-animal-info .banner-content .banner-brief{
    height: 7.375rem;
  }
  .banner-visit-place .banner-content{
    width: 60%;
    left: 3.25rem;
  }
  .banner-visit-place .banner-content .banner-img{
    height: 16rem;
  }
  footer .sitemap .site-menu .menu-list li a,
  .page-them .page-content .card-content,
  .banner-visit-place .banner-content .banner-header .text .title{
    font-size: 1rem;
  }
  .banner-news-release .banner-content{
    width: 50%;
    right: 3.25rem;
  }
  .banner-visit-place .banner-content .banner-header .flex-item{
    margin-left: 0;
  }
  .banner-animal-info .banner-content .btn {
    margin: 1rem 0 2.25rem;
  }
  .carousel-animal .item img{
    height: 12.625rem;
  }
  footer .sitemap .sitemap-logo{
    height: 4rem;
  }
  .giftshop-container .giftshop-announce span,
  footer .sitemap .site-menu .menu-title{
    font-size: 1.2rem;
  }
  footer .sitemap .col{
    margin-top: 1rem;
  }
  footer .sitemap .site-menu .menu-list{
    height: unset;
  }
  .underwater-container .header{
    line-height: 2.5rem;
  }
  .btn-them.btn-them-yellow,
  .sidenav li .menu-dropdown-content .menu-list li a,
  .page-them .page-content .owl-item .card-content,
  .card-news .card-action .btn,
  .card-news .card-content .card-brief{
    font-size: 0.8rem;
  }
  .btn-them.btn-them-yellow img{
    width: 0.8rem;
  }
  .giftshop-container .topic-underline{
    font-size: 1.5rem;
  }
  .giftshop-container .owl-dots .owl-dot span{
    width: 10px;
    height: 10px;
  }
  .topic-underline:after{
    border-bottom: 0.35rem solid #0C79CB;
  }
  .sidenav li > a{
    font-size: 1rem;
  }
  footer .sitemap .sitemap-contact .icon{
    width: 2rem;
  }
  .fee-super-header .fee-super-body .content:after{
    border-bottom: 0.3rem solid #135EA8;
  }
  footer .copyright .copyright-policy li{
    font-size: 0.8rem;
  }
  .card-content-editor h2 strong{
    font-size: 2rem;
  }
  .marine-category .marine-thumbnail{
    height: 10.75rem;
  }
  .marine-category .row .col{
    padding: 1rem;
  }
  footer .sitemap .sitemap-wrapper{
    padding: 0 1.875rem;
  }
  footer .copyright .copyright-wrapper{
    padding: 1rem 1.875rem;
  }
  .contact-us-container .bg-img{
    padding: 2.5rem;
  }
  
}
@media only screen and (min-width: 1201px){
  .card-news:hover{
    height: 30rem;
    border-radius: 2px;
  }
  .card-news:hover .card-image{
    top: -6.25rem;
    /* width: 14rem; */
    scale: 0.95;
  }
  /* .card-news:hover .card-image img{
    border-radius: 50%;
  } */
  .card-news:hover .card-content{
    top: 8.125rem; 
    height: 21.9rem;
  }
  .card-news:hover .card-title{
    color: #1070C1;
  }
  .card-news .card-image{
    width: 19em;
  }
}