Difference between revisions of "Template:TU Darmstadt/CSS"

 
(350 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
 
<style>
 
<style>
 +
svg > text > tspan > a{
 +
color:#d4043bff;
 +
}
 +
/*object > #svgFlow > image{
 +
opacity:0.5;
 +
pointer-events:all;
 +
}
 +
object > #svgFlow > image:hover{
 +
opacity:1;
 +
pointer-events:all;
 +
cursor:pointer;
 +
}*/
 +
/* austesten und später sortieren */
 +
/*#one .post-it p{
 +
font-size:1em;
 +
}*/
 +
#HQ_page table td{
 +
padding: 0.5em;
 +
}
 +
#HQ_page table.ref td{
 +
padding: 2px;
 +
}
 +
summary{
 +
font-size:1em;
 +
font-weight:700;
 +
color:#005ba8;
 +
outline: none !important;
 +
margin: 0.5em 0;
 +
}
 +
.submenuV{
 +
font-size:1em;
 +
margin:0.5em 0;
 +
backgroundcolor:#777;
 +
color:#ffffff !important;
 +
}
 +
.nav-proj-drop{
 +
font-size:0.8em;
 +
}
 +
.nav-proj-drop li a{
 +
color:#edf1f5 !important;
 +
}
 +
.nav-proj-drop li a:hover{
 +
backgroundcolor:#edf1f5 !important;
 +
}
 +
.nav-proj-drop li{
 +
line-height:1.5em;
 +
}
 +
.icons{
 +
width: 100%;
 +
display: inline-block;
 +
}
 +
.icons a.header-icon{
 +
border-bottom:0;
 +
}
 +
.icons ul{
 +
/*padding: 0 10% 0 10%;*/
 +
list-style: none;
 +
display: inline-block;
 +
}
 +
ul.icons li{
 +
padding:0;
 +
margin-right:1em;
 +
}
 +
ul.icons li:last-child{
 +
padding:0;
 +
margin-right:0;
 +
}
 +
.icons li{
 +
display: inline-block;
 +
width:15%;
 +
}
 +
.header-icon img{
 +
width: 100%;
 +
height: auto;
 +
/*padding: 0 5% 0 5%;*/
 +
}
 +
span.image.avatar img{
 +
width:100%;
 +
}
 +
.container figure{
 +
font-size:10pt;
 +
}
 +
.container figcaption{
 +
font-size:10pt;
 +
line-height: 1.5em;
 +
text-align: left;
 +
margin-top: 0.75em;
 +
}
 +
.info-follow{
 +
padding-top:0.75em;
 +
}
 +
#bodyContent h2{
 +
margin-bottom: 0.2em;
 +
}
 +
#HQ_page p{
 +
font-size: 12pt;
 +
}
 +
.post-it{
 +
background:#e4f1fe;
 +
padding:15px;
 +
color: #000;
 +
width:100%;
  
 +
-moz-transform: rotate(0deg);
 +
-webkit-transform: rotate(0deg);
 +
-o-transform: rotate(0deg);
 +
-ms-transform: rotate(0deg);
 +
transform: rotate(0deg);
 +
 +
box-shadow: 0px 4px 6px #333;
 +
-moz-box-shadow: 0px 4px 6px #333;
 +
-webkit-box-shadow: 0px 4px 6px #333;
 +
}
 +
 +
.container h1{
 +
  padding: 1.25em 0 0.05em 0;
 +
}
 +
.container h4{
 +
  padding: 1em 0 0.05em 0;
 +
}
 +
.nav-follow{
 +
  /*padding: 0.85em 0;*/
 +
  padding: 0em 0;
 +
  text-align: -webkit-match-parent;
 +
 
 +
}
 +
.nav-drop_b{
 +
  display: none;
 +
}
 +
.nav-drop{
 +
  display: none;
 +
}
 +
.info-drop{
 +
  display: none;
 +
  padding-bottom: 0.75em;
 +
}
 +
#main p{
 +
  line-height: 1.5em;
 +
}
 +
#one h3{
 +
  padding-top: 1em;
 +
}
 +
header.major p{
 +
  font-size: 1em;
 +
}
 +
#header > header{
 +
  padding: 1.5em 2% 0.75em 2%;
 +
}
 +
#nav{
 +
  font-size: 1em;
 +
}
 +
 +
a:hover{
 +
  color: #ffffff;
 +
  text-decoration: none;
 +
}
 +
 +
#header h1 a:hover {
 +
  text-decoration: none;
 +
  border-bottom: none;                                   
 +
}
 +
 +
/* igem seite bearbeiten */
 +
 +
#mw-content-text p{
 +
    margin: 0;
 +
}
 +
#top {
 +
    border: 0;
 +
}
 +
#firstHeading {
 +
    margin: 0;
 +
    padding: 0;
 +
    border: 0;
 +
}
 +
body{
 +
    margin: 0;
 +
}
 +
#content{
 +
    margin-top: 0px;
 +
    margin-right: 0px;
 +
    margin-left: 0px;
 +
    padding: 0;
 +
    border: 0;
 +
    width: 100%;
 +
    top: 0;
 +
}
 +
#content.mw-body{
 +
    margin: 0;
 +
    padding: 0;
 +
    border: 0;
 +
    height: 100%;
 +
    top: 0;
 +
}
 +
#content.mw-body body{
 +
    margin: 0;
 +
    padding: 0;
 +
    border: 0;
 +
    height: 100%;
 +
    top: 0;
 +
}
 +
#top_menu_under{
 +
    height: 16px;
 +
}
 +
#top_menu_14{
 +
    position: fixed;
 +
    width: 100%;
 +
    top: 0px;
 +
    left: 0px;
 +
    height: 18px;
 +
    border-bottom: 2px solid black;
 +
}
 +
#top_menu_14 body{
 +
    line-height: 1;
 +
}
 +
#top_menu_inside{
 +
    line-height: 1.5;
 +
    list-style-type: none;
 +
}
 +
#top_menu_inside a:link {
 +
    text-decoration: none;
 +
    border-bottom: none;
 +
}
 +
#top_menu_inside a:visited {
 +
    text-decoration: none;
 +
}
 +
#top_menu_inside a:hover {
 +
    text-decoration: underline;
 +
    color: white;
 +
}
 +
#top_menu_inside.submenu a:hover {
 +
    text-decoration: underline;
 +
    color: orange;
 +
}
 +
#top_menu_inside a:active {
 +
    text-decoration: underline;
 +
}
 +
#top_menu_inside ul{
 +
    vertical-align: top;
 +
    list-style-type: none;
 +
}
 +
#top_menu_inside{
 +
    vertical-align: top;
 +
}
 +
#user_item{
 +
    height: 16px;
 +
    line-height: 1;
 +
}
 +
#user_item.has_submenu{
 +
    vertical-align: top;
 +
    font-size: 12px;
 +
}
 +
#user_item a:link {
 +
    text-decoration: none;
 +
    border-bottom: none;
 +
}
 +
#user_item a:hover {
 +
    color: orange;
 +
}
 +
.submenu a:hover {
 +
    color: #orange;
 +
}
 +
.has_submenu a:hover{
 +
    color: orange;
 +
}
 +
#top_menu_inside #bars_item{
 +
    line-height: 1;
 +
    left: 935px;
 +
}
 +
#top_title{
 +
    height: 0px;
 +
    margin: 0;
 +
    display: none;
 +
}
 +
#sideMenu{
 +
    height: 0px;
 +
    margin: 0;
 +
    display: none;
 +
}
 +
/*#header{
 +
    width: 20%;
 +
}
 +
#wrapper{
 +
    padding-right: 20%;
 +
}*/
 
/* Reset */
 
/* Reset */
  
Line 10: Line 294:
 
font-size: 100%;
 
font-size: 100%;
 
font: inherit;
 
font: inherit;
−
vertical-align: baseline;
+
/*vertical-align: baseline;*/
 
}
 
}
  
Line 1,566: Line 1,850:
 
text-decoration: none;
 
text-decoration: none;
 
}
 
}
−
 
+
                #header a:hover {
−
a:hover {
+
 
border-bottom-color: transparent;
 
border-bottom-color: transparent;
 
color: #d4043b !important;
 
color: #d4043b !important;
 
}
 
}
  
 +
.container a {
 +
border-bottom-color: transparent;
 +
color: #005ba8 !important;
 +
}
 +
         
 +
.container a:hover {
 +
border-bottom-color: transparent;
 +
color: #d4043b !important;
 +
}
 +
                .container a:active {
 +
border-bottom-color: transparent;
 +
color: #005ba8 !important;
 +
}
 
strong, b {
 
strong, b {
 
color: #777;
 
color: #777;
Line 1,609: Line 1,905:
  
 
h4 {
 
h4 {
−
font-size: 1.25em;
+
font-size: 1.5em;
 
line-height: 1.5em;
 
line-height: 1.5em;
 
}
 
}
  
 
h5 {
 
h5 {
−
font-size: 0.9em;
+
font-size: 1em;
 
line-height: 1.5em;
 
line-height: 1.5em;
 +
                margin-top:0.7em;
 +
                margin-bottom:0.3em;
 
}
 
}
  
Line 1,653: Line 1,951:
  
 
code {
 
code {
−
background: #555;
+
background: #ececec;
 
border-radius: 5px;
 
border-radius: 5px;
−
color: #fff;
+
color: #000;
 
font-family: "Source Code Pro", monospace;
 
font-family: "Source Code Pro", monospace;
 
font-size: 0.9em;
 
font-size: 0.9em;
Line 1,723: Line 2,021:
 
/*color: #4acaa8;*/
 
/*color: #4acaa8;*/
 
color: #d4043b;
 
color: #d4043b;
−
font-size: 3.5em;
+
font-size: 2em;
 
}
 
}
 +
 +
        header.major h2.projectTitle{
 +
        font-size:4.2em;
 +
        }
  
 
header.major h2 + p {
 
header.major h2 + p {
Line 1,732: Line 2,034:
 
margin-top: -0.75em;
 
margin-top: -0.75em;
 
}
 
}
 +
                header.major p{
 +
                        font-size: 1em;
 +
                }
  
 
/* Form */
 
/* Form */
Line 1,785: Line 2,090:
 
select:focus,
 
select:focus,
 
textarea:focus {
 
textarea:focus {
−
border-color: #d4043b;
+
border-color: #002d54;
 
}
 
}
  
Line 2,042: Line 2,347:
 
margin: 0 0 2.25em 0;
 
margin: 0 0 2.25em 0;
 
padding-left: 1em;
 
padding-left: 1em;
 +
}
 +
 +
#main ul {
 +
                font-size: 12pt;
 
}
 
}
  
Line 2,056: Line 2,365:
 
border-top: solid 2px #f4f4f4;
 
border-top: solid 2px #f4f4f4;
 
padding: 0.5em 0;
 
padding: 0.5em 0;
 +
                                font-size: 0.8em;
 
}
 
}
  
Line 2,196: Line 2,506:
 
-webkit-overflow-scrolling: touch;
 
-webkit-overflow-scrolling: touch;
 
overflow-x: auto;
 
overflow-x: auto;
 +
                /*font-size: 12pt;*/
 
}
 
}
  
Line 2,201: Line 2,512:
 
margin: 0 0 2.25em 0;
 
margin: 0 0 2.25em 0;
 
width: 100%;
 
width: 100%;
 +
                font-size: 12pt;
 +
}
 +
        table.ref {
 +
margin: 0 0 2.25em 0;
 +
width: 100%;
 +
                font-size: 8pt;
 
}
 
}
  
Line 2,219: Line 2,536:
 
table th {
 
table th {
 
color: #777;
 
color: #777;
−
font-size: 0.9em;
+
font-size: 12pt;
 
font-weight: 700;
 
font-weight: 700;
 
padding: 0 0.75em 0.75em 0.75em;
 
padding: 0 0.75em 0.75em 0.75em;
 
text-align: left;
 
text-align: left;
 
}
 
}
 +
                table.ref th {
 +
color: #777;
 +
font-size: 8pt;
 +
font-weight: 700;
 +
padding: 0 0.75em 0.75em 0.75em;
 +
text-align: left;
 +
}
 +
                table.ref td{
 +
                        padding: 2px;
 +
                }
  
 
table thead {
 
table thead {
Line 2,260: Line 2,587:
  
 
/* Button */
 
/* Button */
−
 
 
input[type="submit"],
 
input[type="submit"],
 
input[type="reset"],
 
input[type="reset"],
Line 2,273: Line 2,599:
 
-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
 
-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
 
transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
 
transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
−
background-color: #99b9d4;
+
background-color:#777;
 
border-radius: 5px;
 
border-radius: 5px;
 
border: 0;
 
border: 0;
Line 2,280: Line 2,606:
 
display: inline-block;
 
display: inline-block;
 
font-weight: 700;
 
font-weight: 700;
−
height: 2.75em;
+
height: 2em;
−
line-height: 2.75em;
+
line-height: 2em;
 
padding: 0 1.5em;
 
padding: 0 1.5em;
 
text-align: center;
 
text-align: center;
 
text-decoration: none;
 
text-decoration: none;
 
white-space: nowrap;
 
white-space: nowrap;
 +
                outline: none !important;
 
}
 
}
  
Line 2,292: Line 2,619:
 
input[type="button"]:hover,
 
input[type="button"]:hover,
 
.button:hover {
 
.button:hover {
−
background-color: #bbd6ed;
+
background-color: #005ba8;
 
color: #ffffff !important;
 
color: #ffffff !important;
 
}
 
}
Line 2,300: Line 2,627:
 
input[type="button"]:active,
 
input[type="button"]:active,
 
.button:active {
 
.button:active {
−
background-color: #bbd6ed;
+
background-color: #777;
 +
                        button:focus {outline:0;};
 +
                        outline: none !important;
 +
}
 +
                .button:visited {
 +
                        outline: none !important;
 
}
 
}
−
 
 
input[type="submit"].icon,
 
input[type="submit"].icon,
 
input[type="reset"].icon,
 
input[type="reset"].icon,
Line 2,344: Line 2,675:
 
input[type="button"].alt,
 
input[type="button"].alt,
 
.button.alt {
 
.button.alt {
−
background-color: transparent;
+
background-color: #777;
 
box-shadow: inset 0 0 0 2px #e4e4e4;
 
box-shadow: inset 0 0 0 2px #e4e4e4;
−
color: #777 !important;
+
color: #ffffff !important;
 
}
 
}
  
Line 2,383: Line 2,714:
 
input[type="button"].special:hover,
 
input[type="button"].special:hover,
 
.button.special:hover {
 
.button.special:hover {
−
background-color: #2a557a;
+
background-color: #d4043b;
 
}
 
}
  
Line 2,390: Line 2,721:
 
input[type="button"].special:active,
 
input[type="button"].special:active,
 
.button.special:active {
 
.button.special:active {
−
background-color: #2a557a;
+
background-color: #d4043b;
 
}
 
}
  
Line 2,465: Line 2,796:
 
text-align: center;
 
text-align: center;
 
top: 0;
 
top: 0;
−
width: 18em;
+
width: 20%;
 
right: 0;
 
right: 0;
 
}
 
}
Line 2,496: Line 2,827:
 
-ms-flex-shrink: 0;
 
-ms-flex-shrink: 0;
 
flex-shrink: 0;
 
flex-shrink: 0;
−
padding: 3em;
+
padding: 1.5em 2% 0.75em 2%;
 
}
 
}
  
 
#header > header .avatar {
 
#header > header .avatar {
 
display: block;
 
display: block;
−
margin: 0 auto 2.25em auto;
+
margin: 0 auto 0.75em auto;
−
width: 8em;
+
width: 75%;
 
}
 
}
  
 
#header > header h1 {
 
#header > header h1 {
−
font-size: 1.75em;
+
font-size: 1.5em;
 
margin: 0;
 
margin: 0;
 
}
 
}
Line 2,524: Line 2,855:
 
bottom: 0;
 
bottom: 0;
 
left: 0;
 
left: 0;
−
padding: 2em;
+
padding: 2em 10%;
 
width: 100%;
 
width: 100%;
 
}
 
}
Line 2,557: Line 2,888:
 
}
 
}
  
−
#header > nav ul li a {
+
#header > nav ul .mainmenu li a {
 
-moz-transition: none;
 
-moz-transition: none;
 
-webkit-transition: none;
 
-webkit-transition: none;
Line 2,565: Line 2,896:
 
color: #ffffff !important;
 
color: #ffffff !important;
 
display: block;
 
display: block;
−
padding: 0.85em 0;
+
padding: 0.3em 0;
 
text-decoration: none;
 
text-decoration: none;
 
}
 
}
 
 
−
    #header > nav ul li a:hover {
+
    #header > nav ul .mainmenu li a:hover {
 
background: #fff;
 
background: #fff;
 
/*color: #4acaa8 !important;*/
 
/*color: #4acaa8 !important;*/
 
color: #d4043b !important;
 
color: #d4043b !important;
 +
                                                        text-decoration: none;                                   
 
}
 
}
  
−
#header > nav ul li a.active {
+
#header > nav ul .mainmenu li a.active {
 
background: #fff;
 
background: #fff;
 
/*color: #4acaa8 !important;*/
 
/*color: #4acaa8 !important;*/
 
color: #d4043b !important;
 
color: #d4043b !important;
 +
}
 +
 +
#header > nav ul .nav-proj-drop li a {
 +
-moz-transition: none;
 +
-webkit-transition: none;
 +
-ms-transition: none;
 +
transition: none;
 +
border: 0;
 +
color: #edf1f5 !important;
 +
display: block;
 +
padding: 0.3em 0;
 +
text-decoration: none;
 +
}
 +
 +
    #header > nav ul .nav-proj-drop li a:hover {
 +
background: #edf1f5;
 +
/*color: #4acaa8 !important;*/
 +
color: #005ba8 !important;
 +
                                                        text-decoration: none;                                   
 +
}
 +
 +
#header > nav ul .nav-proj-drop li a.active {
 +
background: #edf1f5;
 +
/*color: #4acaa8 !important;*/
 +
color: #005ba8 !important;
 
}
 
}
  
Line 2,589: Line 2,946:
 
#wrapper {
 
#wrapper {
 
background: #fff;
 
background: #fff;
−
padding-right: 18em;
+
padding-right: 20%;
 
}
 
}
  
Line 2,599: Line 2,956:
  
 
#main > section > .container {
 
#main > section > .container {
−
padding: 6em 0 4em 0;
+
padding: 6em 2em 4em 2em;
 
}
 
}
  
Line 2,609: Line 2,966:
  
 
#one:before {
 
#one:before {
−
background-image: url("../../images/banner.jpg");
+
/*background-image: url("https://static.igem.org/mediawiki/2017/9/92/Banner_prov.jpg");*/
 
background-position: top right;
 
background-position: top right;
 
background-repeat: no-repeat;
 
background-repeat: no-repeat;
Line 2,615: Line 2,972:
 
content: '';
 
content: '';
 
display: block;
 
display: block;
−
height: 15em;
+
/*height: 10em;*/
 
width: 100%;
 
width: 100%;
 
}
 
}
Line 2,626: Line 2,983:
 
color: #c0c0c0;
 
color: #c0c0c0;
 
overflow: hidden;
 
overflow: hidden;
−
padding: 4em 0 2em 0;
+
padding: 0em 0 0em 0;
 +
 
 
}
 
}
 +
 +
        #footer p{
 +
                font-size:1em;
 +
        }
  
 
#footer .copyright {
 
#footer .copyright {
Line 2,662: Line 3,024:
 
font-size: 13pt;
 
font-size: 13pt;
 
}
 
}
 +
                        header.major h2.projectTitle{
 +
                        font-size:4.2em;
 +
                        }
  
 
/* Header */
 
/* Header */
  
 
#header {
 
#header {
−
width: 21em;
+
width: 20%;
 
}
 
}
  
 
#header > header {
 
#header > header {
−
padding: 2em;
+
padding: 1.5em 2% 0.75em 2%;
 
}
 
}
  
 
#header > footer {
 
#header > footer {
−
padding: 1.5em;
+
padding: 1.5em 10%;
 
}
 
}
  
Line 2,680: Line 3,045:
  
 
#wrapper {
 
#wrapper {
−
padding-right: 21em;
+
padding-right: 20%;
 
}
 
}
  
Line 2,700: Line 3,065:
 
font-size: 11pt;
 
font-size: 11pt;
 
}
 
}
 +
                        header.major h2.projectTitle{
 +
                        font-size:4.2em;
 +
                        }
  
 
/* Header */
 
/* Header */
  
 
#header {
 
#header {
−
width: 20em;
+
width: 20%;
 
}
 
}
  
Line 2,710: Line 3,078:
  
 
#wrapper {
 
#wrapper {
−
padding-right: 20em;
+
padding-right: 20%;
 
}
 
}
  
Line 2,732: Line 3,100:
 
font-size: 12pt;
 
font-size: 12pt;
 
}
 
}
 +
                        header.major h2.projectTitle{
 +
                        font-size:4em;
 +
                        }
  
 
/* Image */
 
/* Image */
Line 2,754: Line 3,125:
 
-ms-transition: -ms-transform 0.5s ease;
 
-ms-transition: -ms-transform 0.5s ease;
 
transition: transform 0.5s ease;
 
transition: transform 0.5s ease;
−
display: block;
+
/*display: block;*/
 
height: 100%;
 
height: 100%;
 
overflow-y: auto;
 
overflow-y: auto;
Line 2,788: Line 3,159:
 
-ms-transition: -ms-transform 0.5s ease;
 
-ms-transition: -ms-transform 0.5s ease;
 
transition: transform 0.5s ease;
 
transition: transform 0.5s ease;
−
padding: 44px 0 1px 0;
+
padding: 0 0 1px 0;
 
}
 
}
  
Line 2,813: Line 3,184:
 
position: fixed;
 
position: fixed;
 
top: 0;
 
top: 0;
 +
                                margin-top:18px;
 
width: 100%;
 
width: 100%;
 
z-index: 10001;
 
z-index: 10001;
Line 2,834: Line 3,206:
 
border: 0;
 
border: 0;
 
text-decoration: none;
 
text-decoration: none;
 +
                                                color: #fff !important;
 
}
 
}
  
Line 2,871: Line 3,244:
 
}
 
}
  
−
body.header-visible #wrapper, body.header-visible #titleBar {
+
/*body.header-visible #wrapper, body.header-visible #titleBar {
 
-moz-transform: translateX(-23em);
 
-moz-transform: translateX(-23em);
 
-webkit-transform: translateX(-23em);
 
-webkit-transform: translateX(-23em);
 
-ms-transform: translateX(-23em);
 
-ms-transform: translateX(-23em);
 
transform: translateX(-23em);
 
transform: translateX(-23em);
 +
}*/
 +
body.header-visible #wrapper {
 +
-moz-transform: translateX(-23em);
 +
-webkit-transform: translateX(-23em);
 +
-ms-transform: translateX(-23em);
 +
transform: translateX(-23em);
 +
}
 +
body.header-visible #titleBar {
 +
/*-moz-transform: translateX(0);
 +
-webkit-transform: translateX(0);
 +
-ms-transform: translateX(0);
 +
transform: translateX(0);*/
 +
-moz-transform: translateX(-23em);
 +
-webkit-transform: translateX(-23em);
 +
-ms-transform: translateX(-23em);
 +
transform: translateX(-23em);
 +
                                display: block;
 +
                                top: 17px;
 +
                                position: fixed;
 +
                                margin-top: 1px;
 
}
 
}
  
Line 2,883: Line 3,276:
 
-ms-transform: translateX(0);
 
-ms-transform: translateX(0);
 
transform: translateX(0);
 
transform: translateX(0);
 +
display: block;
 +
width: 23em;
 +
                                -moz-transition: -moz-transform 0.5s ease;
 +
-webkit-transition: -webkit-transform 0.5s ease;
 +
-ms-transition: -ms-transform 0.5s ease;
 +
transition: transform 0.5s ease;
 
}
 
}
  
Line 2,900: Line 3,299:
 
display: none;
 
display: none;
 
}
 
}
 +
 +
                        header.major h2.projectTitle{
 +
                        font-size:3em;
 +
                        }
  
 
h2 {
 
h2 {
Line 2,930: Line 3,333:
  
 
header.major h2 {
 
header.major h2 {
−
font-size: 2.5em;
+
font-size: 1.75em;
 
}
 
}
  
 
header.major h2 + p {
 
header.major h2 + p {
−
font-size: 1.5em;
+
font-size: 1em;
 
}
 
}
  
Line 2,959: Line 3,362:
 
-ms-transform: translateX(17em);
 
-ms-transform: translateX(17em);
 
transform: translateX(17em);
 
transform: translateX(17em);
 +
                                -moz-transition: -moz-transform 0.5s ease;
 +
-webkit-transition: -webkit-transform 0.5s ease;
 +
-ms-transition: -ms-transform 0.5s ease;
 +
transition: transform 0.5s ease;
 
right: 0;
 
right: 0;
 +
                                /*display:block;*/
 
}
 
}
  
 
#header > header {
 
#header > header {
−
padding: 2em;
+
padding: 1.5em 2% 0.75em 2%;
 
}
 
}
  
 
#header > header .avatar {
 
#header > header .avatar {
−
margin: 0 auto 1.6875em auto;
+
margin: 0 auto 0.75em auto;
−
width: 6em;
+
width: 75%;
 
}
 
}
  
Line 2,980: Line 3,388:
  
 
#header > footer {
 
#header > footer {
−
padding: 1.5em;
+
padding: 1.5em 10%;
 
}
 
}
  
Line 3,025: Line 3,433:
 
}
 
}
  
−
body.header-visible #wrapper, body.header-visible #titleBar {
+
/*body.header-visible #wrapper, body.header-visible #titleBar {
 +
-moz-transform: translateX(-17em);
 +
-webkit-transform: translateX(-17em);
 +
-ms-transform: translateX(-17em);
 +
transform: translateX(-17em);
 +
}*/
 +
body.header-visible #wrapper{
 
-moz-transform: translateX(-17em);
 
-moz-transform: translateX(-17em);
 
-webkit-transform: translateX(-17em);
 
-webkit-transform: translateX(-17em);
Line 3,031: Line 3,445:
 
transform: translateX(-17em);
 
transform: translateX(-17em);
 
}
 
}
 +
body.header-visible #titleBar {
 +
/*-moz-transform: translateX(0);
 +
-webkit-transform: translateX(0);
 +
-ms-transform: translateX(0);
 +
transform: translateX(0);*/
 +
-moz-transform: translateX(-17em);
 +
-webkit-transform: translateX(-17em);
 +
-ms-transform: translateX(-17em);
 +
transform: translateX(-17em);
 +
                                display: block;
 +
                                top: 17px;
 +
                                position: fixed;
 +
                                margin-top: 1px;
 +
}
 +
 +
                        body.header-visible #header{
 +
width: 17em;
 +
                                display:block;
 +
                                -moz-transition: -moz-transform 0.5s ease;
 +
-webkit-transition: -webkit-transform 0.5s ease;
 +
-ms-transition: -ms-transform 0.5s ease;
 +
transition: transform 0.5s ease;
 +
                        }
  
 
}
 
}
Line 3,047: Line 3,484:
 
font-size: 12pt;
 
font-size: 12pt;
 
}
 
}
 +
 +
                        header.major h2.projectTitle{
 +
                        font-size:2.5em;
 +
                        }
  
 
/* List */
 
/* List */
Line 3,094: Line 3,535:
 
.button {
 
.button {
 
padding: 0;
 
padding: 0;
 +
                                button:focus {outline:0;};
 +
}
 +
 +
                /* Header */
 +
 +
#header {
 +
width: 12em;
 +
-moz-transform: translateX(12em);
 +
-webkit-transform: translateX(12em);
 +
-ms-transform: translateX(12em);
 +
transform: translateX(12em);
 +
                                -moz-transition: -moz-transform 0.5s ease;
 +
-webkit-transition: -webkit-transform 0.5s ease;
 +
-ms-transition: -ms-transform 0.5s ease;
 +
transition: transform 0.5s ease;
 +
right: 0;
 +
                                /*display:block;*/
 +
}
 +
 +
#header > header {
 +
padding: 1.5em 2% 0.75em 2%;
 +
}
 +
 +
#header > header .avatar {
 +
margin: 0 auto 0.75em auto;
 +
width: 75%;
 +
}
 +
 +
#header > header h1 {
 +
font-size: 1.5em;
 +
}
 +
 +
#header > header p {
 +
margin: 1em 0 0 0;
 +
}
 +
 +
#header > footer {
 +
padding: 1.5em 10%;
 +
}
 +
 +
                /* Off-Canvas Navigation */
 +
 +
#titleBar .toggle {
 +
height: 4em;
 +
width: 6em;
 +
}
 +
 +
#titleBar .toggle:before {
 +
font-size: 14px;
 +
width: 44px;
 +
}
 +
 +
/*body.header-visible #wrapper, body.header-visible #titleBar {
 +
-moz-transform: translateX(-12em);
 +
-webkit-transform: translateX(-12em);
 +
-ms-transform: translateX(-12em);
 +
transform: translateX(-12em);
 +
}*/
 +
body.header-visible #wrapper{
 +
-moz-transform: translateX(-12em);
 +
-webkit-transform: translateX(-12em);
 +
-ms-transform: translateX(-12em);
 +
transform: translateX(-12em);
 +
}
 +
                        body.header-visible #header{
 +
-moz-transform: translateX(0);
 +
-webkit-transform: translateX(0);
 +
-ms-transform: translateX(0);
 +
transform: translateX(0);
 +
                                -moz-transition: -moz-transform 0.5s ease;
 +
-webkit-transition: -webkit-transform 0.5s ease;
 +
-ms-transition: -ms-transform 0.5s ease;
 +
transition: transform 0.5s ease;
 +
                                display: block;
 +
width: 12em;
 +
}
 +
body.header-visible #titleBar {
 +
/*-moz-transform: translateX(0);
 +
-webkit-transform: translateX(0);
 +
-ms-transform: translateX(0);
 +
transform: translateX(0);*/
 +
-moz-transform: translateX(-12em);
 +
-webkit-transform: translateX(-12em);
 +
-ms-transform: translateX(-12em);
 +
transform: translateX(-12em);
 +
                                display: block;
 +
                                top: 17px;
 +
                                position: fixed;
 +
                                margin-top: 1px;
 
}
 
}
  

Latest revision as of 22:08, 31 October 2017