Difference between revisions of "Template:Kyoto"

 
(126 intermediate revisions by 3 users not shown)
Line 90: Line 90:
  
 
<style>
 
<style>
−
 
  
  
Line 99: Line 98:
 
#home_logo, #sideMenu { display:none; }
 
#home_logo, #sideMenu { display:none; }
 
#sideMenu, #top_title, .patrollink  {display:none;}
 
#sideMenu, #top_title, .patrollink  {display:none;}
−
#content { width:100%; padding:0px; margin-left:0px;} #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
+
#content { width:100%; padding:0%; margin-left:0%;} #bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0%; }
  
 
#mw-content-text > p{
 
#mw-content-text > p{
Line 109: Line 108:
 
/* Wrapper for the menu */
 
/* Wrapper for the menu */
 
.igem_2018_menu_wrapper {  
 
.igem_2018_menu_wrapper {  
−
width: 20%;  
+
width: 10%;  
 
height:100vh;  
 
height:100vh;  
 
position:fixed;
 
position:fixed;
Line 118: 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 148: Line 147:
 
font-size: 12px;  
 
font-size: 12px;  
 
font-weight: bold;  
 
font-weight: bold;  
−
color: #5e5f5f;  
+
color: #25B6CA;  
 
cursor: pointer;
 
cursor: pointer;
 
}
 
}
Line 189: Line 188:
 
.current_page {  
 
.current_page {  
 
background-color:#7fc1f7  !important;
 
background-color:#7fc1f7  !important;
−
color:#5e5f5f !important;
+
color:#25B6CA !important 0926 Dou ga kakikaeta;
 
}
 
}
  
Line 198: Line 197:
 
padding: 10px 0px 10px 34px;  
 
padding: 10px 0px 10px 34px;  
 
float:left;
 
float:left;
−
background-color:#f2f2f2;  
+
background-color:#ffbe44b;  
 
border-bottom: 1px solid #d3d3d3;  
 
border-bottom: 1px solid #d3d3d3;  
 
font-size: 12px;  
 
font-size: 12px;  
−
color: #5e5f5f;  
+
color: #25B6CA;  
 
cursor: pointer;
 
cursor: pointer;
 
}
 
}
Line 226: 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;
 +
}
  
−
/********************************* HTML STYLING  *********************************/
 
−
        #BACKGROUND {
 
−
                background-image: url(https://static.igem.org/mediawiki/2018/d/d9/Back_gray.png);
 
−
                background-position: center center;
 
−
                background-repeat: no-repeat;
 
−
                background-attachment: fixed;
 
−
                background-size: cover;
 
−
        }
 
  
−
        #wrapper {
+
 
 +
/********************************* HTML STYLING  *********************************/
 +
              #wrapper {
 
                 width: 90%;
 
                 width: 90%;
 
                 margin: 0 auto;
 
                 margin: 0 auto;
Line 251: 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;  
−
color: #606060;
+
color: #757575;
 
                 text-align: center;
 
                 text-align: center;
 
                 line-height:120px;
 
                 line-height:120px;
 
         }
 
         }
 
         h2 {
 
         h2 {
−
                 font-size: 45px;
+
                 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;  
−
color:#606060;
+
color:#757575;
 
                 text-align: left;
 
                 text-align: left;
 
                 line-height:90px;
 
                 line-height:90px;
Line 272: 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;  
−
color: #606060;   
+
color: #757575;   
 
                 margin-right:10%;
 
                 margin-right:10%;
 
                 margin-left:10%;
 
                 margin-left:10%;
Line 281: Line 301:
 
}
 
}
 
         h4 {
 
         h4 {
−
                 font-size:30px;
+
                 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;  
−
color: #606060;   
+
color: #757575;   
 
                 text-align: left;
 
                 text-align: left;
 
                 line-height:60px;
 
                 line-height:60px;
Line 294: 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 317: 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 338: 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 */
 
         #header{
 
         #header{
−
                 background-color:#606060;
+
                 background-color:#25B6CA;
 
                 position:fixed;
 
                 position:fixed;
−
                 width:90%;
+
                 width:100%;
−
                 margin-left:5%;
+
                 margin-left:0%;
 
                 margin-right:0;
 
                 margin-right:0;
 
                 z-index:2;
 
                 z-index:2;
Line 351: Line 388:
 
                 position:fixed;
 
                 position:fixed;
 
                 width:100%;
 
                 width:100%;
−
                 min-height: 40px;
+
                 min-height: 60px;
 
                 position: relative;
 
                 position: relative;
 
                 font-size: 0px;
 
                 font-size: 0px;
Line 364: Line 401:
 
                 vertical-align: center;
 
                 vertical-align: center;
 
                 text-align: center;
 
                 text-align: center;
−
                 font-size:20px;
+
                 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 372: Line 409:
  
 
         ul.nv a {
 
         ul.nv a {
−
                 background-color: #606060;  
+
                 background-color: #25b6ca;  
 
                 color: white;               
 
                 color: white;               
 
                 line-height: 60px;         
 
                 line-height: 60px;         
Line 381: Line 418:
 
         }
 
         }
 
         ul.nv a:hover {
 
         ul.nv a:hover {
−
                 background-color: #aade29;  
+
                 background-color: #fffc7a;  
 
                 color: #000000;             
 
                 color: #000000;             
 
         }
 
         }
Line 390: Line 427:
 
        
 
        
 
         ul.nv ul{
 
         ul.nv ul{
−
                 width: 120%;
+
                 width: 100%;
 
                 display: none;
 
                 display: none;
 
                 margin: 0px;
 
                 margin: 0px;
Line 401: 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.5em;     
+
                 line-height: 2.3em;     
 
                 text-align: center;       
 
                 text-align: center;       
 
                 padding-left: 5px;     
 
                 padding-left: 5px;     
Line 414: Line 454:
 
         }
 
         }
 
         ul.nv ul li a:hover {
 
         ul.nv ul li a:hover {
−
                 background-color: #aade29;  
+
                 background-color: #fffc7a;  
 +
 
 
                 color: #000000;             
 
                 color: #000000;             
 
         }
 
         }
 
         #blank{
 
         #blank{
−
           margin-right:30%;
+
           margin-right:17%;
 
         }
 
         }
 
                
 
                
Line 490: 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 565: 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 */
Line 581: Line 629:
 
.menu_bottom_padding {display:none;}
 
.menu_bottom_padding {display:none;}
 
.menu_button.direct_to_page { padding-left: 36px; }
 
.menu_button.direct_to_page { padding-left: 36px; }
−
}
+
 +
 
 +
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
 +
        }
  
  
Line 597: Line 648:
 
             font-size: 140%;
 
             font-size: 140%;
 
         }
 
         }
 +
                         
 
</style>
 
</style>
  
Line 607: 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">  
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">  
  
 
</head>
 
</head>

Latest revision as of 19:18, 17 October 2018