Difference between revisions of "Template:Kyoto"

 
(66 intermediate revisions by 3 users not shown)
Line 117: Line 117:
 
background-color:#dddddd;  
 
background-color:#dddddd;  
 
text-align:left;
 
text-align:left;
−
font-family:Tahoma, Geneva, sans-serif;  
+
font-family:Tahoma, Geneva, Segoe UI, sans-serif;  
 
overflow-y: auto;
 
overflow-y: auto;
 
overflow-x: hidden;
 
overflow-x: hidden;
Line 225: Line 225:
 
float:left;  
 
float:left;  
 
background-color:black;  
 
background-color:black;  
−
font-family:Tahoma, Geneva, sans-serif;  
+
font-family:Tahoma, Geneva, Segoe ui,sans-serif;  
 
}
 
}
 +
 +
 +
        .box27 {
 +
                margin-top: 0;margin-left: 0;
 +
                margin-right: 0;margin-bottom: 0;;
 +
                background: #25B6CA;
 +
                padding: 0px 5px 5px 5px;
 +
 
 +
}
 +
 
 +
        .box27 .box-title {
 +
                position: relative;
 +
                display: inline-block;
 +
                top: 8px;
 +
                margin-left:10%;
 +
                padding: 8px 15px ;
 +
                height: 25px;
 +
                line-height: 25px;
 +
                vertical-align: middle;
 +
                font-size: 240%;
 +
                color: #ffffff;
 +
                font-weight: bold;
 +
}
 +
 +
        .box27 p {
 +
                margin: 0;
 +
                padding: 5px 0px 0px;
 +
}
 +
  
  
Line 242: Line 271:
 
h1{  
 
h1{  
 
                 font-size: 300%;
 
                 font-size: 300%;
−
                 font-family: serif, 'Times New Roman';
+
                 font-family: 'Segoe UI';
 
padding:35px 5px 15px 15px;  
 
padding:35px 5px 15px 15px;  
 
border-bottom: 0px;  
 
border-bottom: 0px;  
Line 251: Line 280:
 
         h2 {
 
         h2 {
 
                 font-size: 250%;
 
                 font-size: 250%;
−
                 font-family: serif, 'Times New Roman';
+
                 font-family: 'Segoe ui';
 
padding:5px 15px;  
 
padding:5px 15px;  
 
border-bottom: 0px;  
 
border-bottom: 0px;  
Line 263: Line 292:
 
h3 {
 
h3 {
 
                 font-size:300%;
 
                 font-size:300%;
−
                 font-family: serif, 'Times New Roman';
+
                 font-family: 'Segoe ui';
 
padding:5px 15px;  
 
padding:5px 15px;  
 
border-bottom:0px;  
 
border-bottom:0px;  
Line 273: Line 302:
 
         h4 {
 
         h4 {
 
                 font-size:200%;
 
                 font-size:200%;
−
                 font-family: serif, 'Times New Roman';
+
                 font-family: 'Segoe UI';
 
padding:5px 15px;  
 
padding:5px 15px;  
 
border-bottom:0px;  
 
border-bottom:0px;  
Line 285: Line 314:
 
                 margin-right:10%;
 
                 margin-right:10%;
 
                 font-size:200%;
 
                 font-size:200%;
−
                 font-family: serif, 'Times New Roman';
+
                 font-family: 'Segoe ui';
 
padding:5px 15px;
 
padding:5px 15px;
−
color: #78563d;   
+
color: #757575;   
 
                 text-align: left;
 
                 text-align: left;
 
                 line-height:60px;
 
                 line-height:60px;
−
                 border-bottom:1px solid #78563d;
+
                 border-bottom:4px solid #757575;
 
}
 
}
 
         h6 {
 
         h6 {
−
                 border-bottom:1px solid #78563d;
+
                 border-bottom:2px solid #606060;
 
                 margin-left:10%;  
 
                 margin-left:10%;  
 
                 margin-right:10%;   
 
                 margin-right:10%;   
 
                 font-size:150%;
 
                 font-size:150%;
−
                 font-family: serif, 'Times New Roman';
+
                 font-family: 'Segoe UI';
 
padding:5px 15px;  
 
padding:5px 15px;  
 
border-bottom:0px;  
 
border-bottom:0px;  
Line 308: Line 337:
 
/* font and text */
 
/* font and text */
 
p {
 
p {
−
                 color:#606060;
+
                 color:#757575;
 
                 margin-right:10%;
 
                 margin-right:10%;
 
                 margin-left:10%;
 
                 margin-left:10%;
−
                 font-family: serif, 'Times New Roman';
+
                 font-family: 'Segoe UI';
 
padding: 0px 15px;  
 
padding: 0px 15px;  
 
font-size: 140%;
 
font-size: 140%;
 
                 text-align: left;
 
                 text-align: left;
 
}
 
}
 +
          p.fig{
 +
                text-align:center;
 +
                margin-left:0 auto;
 +
                margin-right:0 auto;
 +
                font-family: 'Segoe UI';
 +
padding: 0px 15px;             
 +
}
 
/* Links */
 
/* Links */
−
a {    color:#78563d;
+
a {    color:#747474;
 
-ebkit-transition: all 0.4s ease;
 
-ebkit-transition: all 0.4s ease;
 
        -moz-transition: all 0.4s ease;  
 
        -moz-transition: all 0.4s ease;  
Line 329: Line 365:
 
text-decoration:underline;
 
text-decoration:underline;
 
}
 
}
 +
        a:link {color:#ffffff;
 +
        }
 +
        a:visited {color:#ffffff;
 +
        }
 +
        a:hover {color:#ffff00;
 +
        }
 +
        a:active {color:#ffffff;
 +
        }
 +
 +
  
 
         /* top banner list */
 
         /* top banner list */
Line 357: Line 403:
 
                 font-size:16px;
 
                 font-size:16px;
 
                 letter-spacing: normal;
 
                 letter-spacing: normal;
−
                 font-family: serif, 'Times New Roman';
+
                 font-family: serif, 'Segoe ui';
 
                 margin-bottom:0px;
 
                 margin-bottom:0px;
 
                 white-space:nowrap;
 
                 white-space:nowrap;
Line 392: Line 438:
 
         ul.nv ul li {
 
         ul.nv ul li {
 
                 width: 120%;             
 
                 width: 120%;             
−
                 border-top: 1px solid #ffffff;  
+
                 border-top: 2px solid #e0e0e0;
 +
                border-right:2px solid #e0e0e0;
 +
                border-left:2px solid #e0e0e0;
 +
                border-bottom: 0px solid #e0e0e0;
 
                 text-align : center;
 
                 text-align : center;
−
                 font-family: serif, 'Times New Roman';
+
                 font-family: serif, 'Segoe ui';
 
                 white-space:normal;
 
                 white-space:normal;
 
                 font-size:15px;
 
                 font-size:15px;
 
         }
 
         }
 
         ul.nv ul li a {
 
         ul.nv ul li a {
−
                 line-height: 1.8em;     
+
                 line-height: 2.3em;     
 
                 text-align: center;       
 
                 text-align: center;       
 
                 padding-left: 5px;     
 
                 padding-left: 5px;     
Line 406: Line 455:
 
         ul.nv ul li a:hover {
 
         ul.nv ul li a:hover {
 
                 background-color: #fffc7a;  
 
                 background-color: #fffc7a;  
 +
 
                 color: #000000;             
 
                 color: #000000;             
 
         }
 
         }
Line 481: Line 531:
 
padding: 10px 15px;
 
padding: 10px 15px;
 
}
 
}
−
 
+
        /* styling for title logo*/
 +
        .titlelogo {
 +
                width: 30%;
 +
                margin-bottom: 50px;
 +
                margin-top: 100px;
 +
                text-align:center;
 +
}
  
  
Line 556: Line 612:
 
#menu_content { display:block;}
 
#menu_content { display:block;}
 
.menu_button.direct_to_page {padding-left: 17px;}
 
.menu_button.direct_to_page {padding-left: 17px;}
−
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
  
 
}
 
}
  
 
/* IF THE SCREEN IS LESS THAN 800PX */
 
/* IF THE SCREEN IS LESS THAN 800PX */
−
@media only screen and (max-width: 100%) {
+
@media only screen and (max-width: 800px) {
  
 
  .igem_2018_menu_wrapper { width:100%; height: 15%; position:relative; left:0%;}
 
  .igem_2018_menu_wrapper { width:100%; height: 15%; position:relative; left:0%;}
Line 574: Line 630:
 
.menu_button.direct_to_page { padding-left: 36px; }
 
.menu_button.direct_to_page { padding-left: 36px; }
 
 
−
        <script>
 
−
var pc_width = 1080;
 
−
var device = (screen.width < 600 ? 'sp' : 'pc');
 
−
var view_mode = (device == 'pc' || document.cookie.indexOf('view_mode=pc') != -1 ? 'pc' : 'sp');
 
−
if (device == 'sp' && view_mode == 'pc') {
 
−
    document.getElementsByName('viewport')[0].setAttribute('content', 'width=' + pc_width + ',initial-scale=1');
 
−
}
 
  
−
$(function () {
+
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
−
    if (device == 'sp') {
+
−
        if (view_mode == 'pc') {
+
−
            $('.sp-mode').on('click', function () {
+
−
                var date = new Date();
+
−
                date.setTime(0);
+
−
                document.cookie = 'view_mode=;expires='+date.toGMTString();
+
−
                location.reload(false);
+
−
            }).show();
+
−
        } else {
+
−
            $('.pc-mode').on('click', function () {
+
−
                document.cookie = 'view_mode=pc';
+
−
                location.reload(false);
+
−
            }).show();
+
−
        }
+
−
    }
+
−
});
+
−
</script>
+
−
 
+
−
 
+
−
 
+
−
   
+
 
         }
 
         }
  
Line 631: Line 659:
  
 
<!-- This tells the browser that your page is responsive -->
 
<!-- This tells the browser that your page is responsive -->
−
<meta name="viewport" content="width=device-width, initial-scale=1.0" #contents {
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">  
−
width:100%;
+
−
}
+
−
#cont_left {
+
−
width:100%;
+
−
}
+
−
#cont_right {
+
−
width:100%;
+
−
}>
+
−
<script type="text/javascript">
+
−
var ua = navigator.userAgent;
+
−
if(ua.indexOf('iPhone') != -1 || ua.indexOf('Android') != -1){
+
−
//iPhone & Android
+
−
document.write('<link rel="stylesheet" href="style_mb.css">');
+
−
}else{
+
−
//PC
+
−
document.write('<link rel="stylesheet" href="style.css">');
+
−
}
+
−
<meta name="viewport" content="width=device-width, initial-scale=1.0">
+
−
</script>
+
  
 
</head>
 
</head>

Latest revision as of 19:18, 17 October 2018