@import url(daftarproduct.css);
@import url(daftarvideo.css);
@import url(daftarnews.css);
@import url(daftaralbum.css);
@import url(daftarvideo.css);
@import url(hoverbox.css);

.informasiberanda {
     text-align: center;
}
.informasiberanda h3 {
     margin:10px 0px 5px 0px;
     font-size:20px;
     text-transform:uppercase;
     color: #048944;
}
.informasiberanda strong {
     margin:10px 0px 5px 0px;
     font-size:20px;
     text-transform:uppercase;
     color: #048944;
     display: block;
}
.informasiberanda p {
     margin-bottom:10px;
}
.informasiberanda .selengkapnya a {
     width:100px;
     text-align:center;
     padding:10px;
     font-weight:bold;
     display:block;
     margin:0px;
     background: #333;
     color:#fff;
}
.informasiberanda .selengkapnya a:hover {
     background:#000;
     color:#FFF;
}

.text3  {
     font-size:16px;
     color: white;
     background: #1E1E1E;
     padding: 60px 0px;
     text-align: center;
     text-shadow: 2px 2px #1E1E1E;
}
.text3 strong {
     margin:0px;
     clear:both;
     font-size:30px;
}
.text3 p {
     margin:0px;
}
.text3 .hubungikami {
     display:block;
     margin:20px auto;
     color:white;
     padding:20px;
     text-align:center;
     width:200px;
     font-size:18px;
     text-transform:uppercase;
     background: #B92B2B;
}
.hubungikami:hover{
     background:#333;
     color: white;
}

.text1 {
     color: white;
}

.informasiberanda-container {grid-gap:10px;}

.map {
	position: relative;
	height:300px; overflow:hidden;
	display:block;
}
.map iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


.testimoni-container  {
	background: #EFEFEF;
}
.testimoni-container a {color: #333;}
.testimoni-container a:hover {color: #f60;}

.thumbnail-testimoni {
     object-fit:cover;
     height: 200px;
     width: 200px;
}

#album div {
     text-align: center;

}
.album {
     background: #DDDDDD;
}
.album:hover {
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.more {
     margin: 10px 0px;
}
.more a {
     border-radius: 25px;
     display: block;
     color:white;
     padding: 10px;
     background: #048944;
     width: 200px;
     margin: 0px auto;
}
.more a:hover {
     background: #FF7500;
     color: #333;
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.newsletter input {
     padding: 10px 20px;
     background: white;
     border-radius: 5px;
     border: none;
}
.newsletter li {
     justify-content: center;
     align-items: center;
     display: grid;
     padding: 0px 10px;
}
.newsletter strong {
     font-size: 20px;
     font-weight: 400;
}
.newsletter button {
     padding: 10px 20px;
     border: none;
     border-radius: 5px;
     background-image: linear-gradient(#3b3b3b, #2e2e2e);
     color: white;
     cursor: pointer;
     font-weight: bold;
}
.newsletter button:hover {
     background: red;
}
.layout-2 {grid-gap:10px;}

.headline {
     border: 3px solid #c1c1c1;
}
.headline .judul a {
     font-weight: bold;
     color: white;
     text-shadow: 0 0 3px #303030, 0 0 5px #303030;
}
.headline .judul a:hover {
     text-decoration: underline;
}
.headline .tayang {
     font-style: italic;
     color: white;
     text-shadow: 0 0 3px #303030, 0 0 5px #303030;
}

.headline2 {
     grid-template-columns: 1fr 3fr;
     grid-gap:10px;
     padding: 20px 0px;
     border-top: 1px solid #dbdbdb;
}
.headline2:hover {
     background: #dbdbdb;
     padding-left: 10px;
     padding-right: 10px;
}
.headline2 img {
     width: 120px;
     height: 70px;
}
.headline2 .judul {
     display: grid;
     align-content: center;
     font-weight: bold;
     font-size: 24px;
     color: #048944;
}
.headline2 .judul a {
     color: #333;
}
.headline2 .judul a:hover {
     color: #f60;
}


.icon-banner a {
     font-weight: bold;
     color: #FF7500;
}
.icon-banner img {
     height: 100px;
}



@media (max-width: 768px){
     .headline {width: 95vw;display: block; margin: 10px auto;}
     .headline1 div {height: 50vh;}

     .informasiberanda-container {grid-template-columns:1fr;}
     .newsletter li {
          margin-bottom: 5px;
     }
     .icon-banner {
          display: grid;
          grid-template-columns: 1fr 1fr 1fr;
          align-content: center;
          justify-content: center;
     }
     .icon-banner-wrapper {
          margin-left:10px;
          margin-right:10px;
     }
}
@media (min-width: 768px)
{
     .headline {width: 50vw;}
     .headline1 div {height: 50vh;}
     .headline .judul a {
          font-size: 30px;
     }
     .informasiberanda-container {grid-template-columns:1fr 1fr 1fr;}
     .newsletter {
          display: flex;
     }
     .layout-2 {grid-template-columns: 3fr 2fr;}

     .panel-tambahan  {
          width: 100vw;
          height: 80px;
          background: #048944;
          border-bottom: #FF7500 solid 3px;
          box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
          position: absolute;
          top:0px;
          left: 0px;
          z-index: 1;
     }
     .panel-tambahan-container {
          height: 200px;
     }

     .icon-banner-container {
          position: absolute;
          top: 20px;
          left:0;
          z-index: 2;
          display: flex;
          width: 100vw;
     }
     .icon-banner {
          display: flex;
          justify-content: flex-end;

     }
     .icon-banner-wrapper {
          margin-left:10px;
          margin-right:10px;
     }

}
@media (min-width: 992px)
{
     .icon-banner-wrapper {
          margin-right: auto;
          margin-left: auto;
          width: 1170px;
          position: relative;
     }
}