Difference between revisions of "Template:TokyoTech/css/main"

 
(25 intermediate revisions by the same user not shown)
Line 30: Line 30:
 
/* End extract */
 
/* End extract */
 
html,body{font-family:Verdana,sans-serif;font-size:15px;line-height:1.5}html{overflow-x:hidden}
 
html,body{font-family:Verdana,sans-serif;font-size:15px;line-height:1.5}html{overflow-x:hidden}
h1{font-size:36px}h2{font-size:30px}h3{font-size:24px}h4{font-size:20px}h5{font-size:18px}h6{font-size:16px}.w3-serif{font-family:serif}
+
h1{font-size:32px}h2{font-size:28px}h3{font-size:26px}h4{font-size:24px}h5{font-size:20px}h6{font-size:16px}.w3-serif{font-family:serif}
h1,h2,h3,h4,h5,h6{font-family:"Segoe UI",Arial,sans-serif;font-weight:400;margin:10px 0}.w3-wide{letter-spacing:4px}
+
h1,h2,h3,h4,h5,h6{font-family:"Segoe UI",Arial,sans-serif;font-weight:400;margin:10px 0;line-height: 150%}.w3-wide{letter-spacing:4px}
 
hr{border:0;border-top:1px solid #eee;margin:20px 0}
 
hr{border:0;border-top:1px solid #eee;margin:20px 0}
 
.w3-image{max-width:100%;height:auto}img{margin-bottom:-5px}a{color:inherit}
 
.w3-image{max-width:100%;height:auto}img{margin-bottom:-5px}a{color:inherit}
Line 234: Line 234:
 
   width: 800px;
 
   width: 800px;
 
   height: 500px;
 
   height: 500px;
   float: left;
+
   float: center;
 
   position: relative;
 
   position: relative;
 
}
 
}
Line 270: Line 270:
  
 
.photo-show img {  
 
.photo-show img {  
     animation: show 10s infinite;
+
     animation: show 16s infinite;
     -webkit-animation: show 10s infinite;
+
     -webkit-animation: show 16s infinite;
     border-radius: 50%;
+
     border-radius: 100%;
 
     height: auto;
 
     height: auto;
 
     max-width: 100%;
 
     max-width: 100%;
Line 308: Line 308:
  
 
.photo-show img:nth-of-type(3) {
 
.photo-show img:nth-of-type(3) {
     animation-delay: 100s;
+
     animation-delay: 8s;
     -webkit-animation-delay: 100s;
+
     -webkit-animation-delay: 4s;
 
}
 
}
  
 +
.photo-show img:nth-of-type(4) {
 +
    animation-delay: 12s;
 +
    -webkit-animation-delay: 6s;
 +
}
 +
 +
.photo-show img:nth-of-type(5) {
 +
    animation-delay: 16s;
 +
    -webkit-animation-delay: 8s;
 +
}
 +
 +
.photo-show img:nth-of-type(6) {
 +
    animation-delay: 20s;
 +
    -webkit-animation-delay: 10s;
 +
}
 +
 +
.photo-show img:nth-of-type(7) {
 +
    animation-delay: 24s;
 +
    -webkit-animation-delay: 12s;
 +
}
 +
 +
.photo-show img:nth-of-type(8) {
 +
    animation-delay: 28s;
 +
    -webkit-animation-delay: 14s;
 +
}
 +
 +
.photo-show img:nth-of-type(9) {
 +
    animation-delay: 32s;
 +
    -webkit-animation-delay: 16s;
 +
}
 +
 +
.photo-show img:nth-of-type(10) {
 +
    animation-delay: 36s;
 +
    -webkit-animation-delay: 18s;
 +
}
 +
 +
.photo-show img:nth-of-type(12) {
 +
    animation-delay: 40s;
 +
    -webkit-animation-delay: 20s;
 +
}
 +
 +
.photo-show img:nth-of-type(13) {
 +
    animation-delay: 44s;
 +
    -webkit-animation-delay: 22s;
 +
}
 +
 +
.photo-show img:nth-of-type(14) {
 +
    animation-delay: 48s;
 +
    -webkit-animation-delay: 24s;
 +
}
 +
 +
.photo-show img:nth-of-type(15) {
 +
    animation-delay: 52s;
 +
    -webkit-animation-delay: 26s;
 +
}
 +
 +
.photo-show img:nth-of-type(16) {
 +
    animation-delay: 56s;
 +
    -webkit-animation-delay: 28s;
 +
}
 +
 +
.photo-show img:nth-of-type(17) {
 +
    animation-delay: 60s;
 +
    -webkit-animation-delay: 30s;
 +
}
 +
 +
.photo-show img:nth-of-type(18) {
 +
    animation-delay: 64s;
 +
    -webkit-animation-delay: 32s;
 +
}
 +
 +
.photo-show img:nth-of-type(19) {
 +
    animation-delay: 68s;
 +
    -webkit-animation-delay: 34s;
 +
}
 +
 +
.photo-show img:nth-of-type(20) {
 +
    animation-delay: 72s;
 +
    -webkit-animation-delay: 36s;
 +
}
 +
 +
.photo-show img:nth-of-type(21) {
 +
    animation-delay: 76s;
 +
    -webkit-animation-delay: 38s;
 +
}
 +
 +
.photo-show img:nth-of-type(22) {
 +
    animation-delay: 80s;
 +
    -webkit-animation-delay: 40s;
 +
}
  
 
/*マウスが画像に重なった際、動きを止めて四角くする*/
 
/*マウスが画像に重なった際、動きを止めて四角くする*/
Line 325: Line 414:
 
     border-radius: 0;
 
     border-radius: 0;
 
}
 
}
 +
 +
 +
.scale img {
 +
    -moz-transition: -moz-transform 0.5s linear;
 +
    -webkit-transition: -webkit-transform 0.5s linear;
 +
    -o-transition: -o-transform 0.5s linear;
 +
    -ms-transition: -ms-transform 0.5s linear;
 +
    transition: transform 0.5s linear;
 +
}
 +
.scale img:hover {
 +
    -webkit-transform: scale();
 +
    -moz-transform: scale(1.2);
 +
    -o-transform: scale(1.2);
 +
    -ms-transform: scale(1.2);
 +
    transform: scale(1.2);
 +
}
 +
 +
#loader-bg {
 +
  display: none;
 +
  position: fixed;
 +
  width: 100%;
 +
  height: 100%;
 +
  top: 0px;
 +
  left: 0px;
 +
  background: #fff;
 +
  z-index: 1;
 +
}
 +
#loader {
 +
  display: none;
 +
  position: fixed;
 +
  top: 50%;
 +
  left: 50%;
 +
  width: 300px;
 +
  height: 300px;
 +
  margin-top:-200px;
 +
  margin-left:-200px
 +
  text-align: center;
 +
  color: #333333;
 +
  z-index: 2;
 +
}
 +
 +
 
</style>
 
</style>
  
 
</html>
 
</html>

Latest revision as of 11:44, 1 November 2017