-
Notifications
You must be signed in to change notification settings - Fork 0
/
styles.min.css
1 lines (1 loc) · 4.39 KB
/
styles.min.css
1
*{margin: 0;text-align: center;font-family: 'Noto Sans JP', sans-serif;}html{scroll-behavior: smooth;}p{font-size: 18px;}/*SPLASH*/.overlay{opacity: 0;z-index: 10;position: fixed;top: -999em;left: -999em;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;background: rgba(0, 0, 0, 0.8);-webkit-animation: splash 10s forwards;animation: splash 10s forwards;}@-webkit-keyframes splash{0%{opacity: 0;top: 0;left: 0}20%{opacity: 1;top: 0;left: 0}60%{opacity: 1;top: 0;left: 0}99%{top: 0;left: 0}100%{opacity: 0;top: -999em;left: -999em}}@-moz-keyframes splash{0%{opacity: 0;top: 0;left: 0}20%{opacity: 1;top: 0;left: 0}60%{opacity: 1;top: 0;left: 0}99%{top: 0;left: 0}100%{opacity: 0;top: -999em;left: -999em}}@-ms-keyframes splash{0%{opacity: 0;top: 0;left: 0}20%{opacity: 1;top: 0;left: 0}60%{opacity: 1;top: 0;left: 0}99%{top: 0;left: 0}100%{opacity: 0;top: -999em;left: -999em}}@-o-keyframes splash{0%{opacity: 0;top: 0;left: 0}20%{opacity: 1;top: 0;left: 0}60%{opacity: 1;top: 0;left: 0}99%{top: 0;left: 0}100%{opacity: 0;top: -999em;left: -999em}}@keyframes splash{0%{opacity: 0;top: 0;left: 0}20%{opacity: 1;top: 0;left: 0}60%{opacity: 1;top: 0;left: 0}99%{top: 0;left: 0}100%{opacity: 0;top: -999em;left: -999em}}/*ENDS*//*NAVBAR*/.topnav{overflow: hidden;background-color: #0c3330;}.topnav a{float: left;display: block;color: #f2f2f2;padding: 14px 16px;text-decoration: none;font-size: 17px;}.topnav a:hover{background-color: #ddd;color: black;}.topnav a.active{background-color: #327f8e;color: white;}.topnav .icon{display: none;}@media screen and (max-width: 650px){.topnav a:not(:first-child){display: none;}.topnav a.icon{float: right;display: block;}}@media screen and (max-width: 650px){.topnav.responsive{position: relative;}.topnav.responsive .icon{position: absolute;right: 0;top: 0;}.topnav.responsive a{float: none;display: block;text-align: left;}}/*ENDS*//*parallax effect*/.parallax{/* The image used */background-image: url('./img/parallax-0.jpeg');/* Full height */height: 100%;/* Create the parallax scrolling effect */background-attachment: fixed;background-position: bottom;background-repeat: no-repeat;background-size: cover;}/*HEADER*/.header{display: flex;justify-content: center;align-items: center;color: white;}/*ENDS*//*GALLERY*/.gallery{margin: 20px 10px;}.mySlides{display: none;}/* Slideshow container */.slideshow-container{max-width: 500px;position: relative;margin: auto;box-sizing: border-box;}.slideshow-container img{vertical-align: middle;}/* Caption text */.text{color: #f2f2f2;font-size: 15px;padding: 8px 12px;position: absolute;bottom: 8px;width: 100%;box-sizing: border-box;}/* Number text (1/3 etc) */.numbertext{color: #f2f2f2;font-size: 12px;padding: 8px 12px;position: absolute;top: 0;}/* The dots/bullets/indicators */.dot{height: 10px;width: 10px;margin: 0 2px;background-color: #ddd;border-radius: 50%;display: inline-block;transition: background-color 0.6s ease;}.live{background-color: #717171;}/* Fading animation */.fade{-webkit-animation-name: fade;-webkit-animation-duration: 1.5s;animation-name: fade;animation-duration: 1.5s;}@-webkit-keyframes fade{from{opacity: .4}to{opacity: 1}}@keyframes fade{from{opacity: .4}to{opacity: 1}}/*ENDS*//*ABOUT*/.about{color: white;padding: 10px 20px;}/*ENDS*//*DONATE*/.donate{height: auto;}.donate-box{height: auto;margin: 20px;padding: 50px;background-color: #327f8e;border-radius: 20px;display: flex;flex-direction: row;flex-wrap: wrap;align-items: center;justify-content: space-around;color: white;}.donate-box input[type=text]{background-color: #327f8e;color: white;font-weight: bold;border: none;font-size: 20px;width: 150px;}.donate-box button{background-color: #e01224;color: white;padding: 14px 20px;border: none;border-radius: 4px;cursor: pointer;font-weight: bold;}.donate-box button:hover{background-color: #df3b42;}.donate-box img{height: 200px;width: 200px;margin: 20px;}/*ENDS*//*FOOTER*/.footer{display: flex;flex-direction: row;flex-wrap: wrap;align-items: center;justify-content: space-around;background-color: #ddd;margin: 10px 20px;}.footer div{height: 180px;width: 400px;background-color: #0c3330;margin: 10px;/*padding: 20px;*/}.footer h2{padding: 10px;color: white;}.footer a{text-decoration: none;color: white;margin: 10px 5px;padding: 10px;border: 2px white solid;font-weight: bold;}.footer a:hover{color: grey;border: 2px grey solid;background-color: white;cursor: pointer;}.author{font-weight: bold;padding: 25px;color: white;}/*ENDS*/