forked from Botanical/BotanJS
108 lines
2.4 KiB
CSS
108 lines
2.4 KiB
CSS
html, body { height: 100%; }
|
|
|
|
html { background-color: #222; }
|
|
|
|
body {
|
|
background-color: #F0F0F0;
|
|
font-family: custom-sans;
|
|
}
|
|
|
|
pre { font-family: monospace; }
|
|
|
|
::selection {
|
|
color: white;
|
|
background: purple;
|
|
}
|
|
::-moz-selection {
|
|
color: white;
|
|
background: purple;
|
|
}
|
|
|
|
p { padding: 0.5em; }
|
|
|
|
a {
|
|
color: #333;
|
|
text-decoration: none;
|
|
}
|
|
|
|
a:hover { text-decoration: underline; }
|
|
|
|
h1, h2, h3, h4, .h1, .h2, .h3, .h4 { font-family: custom-serif; }
|
|
h1, .h1 { font-size: 2.5em; }
|
|
h2, .h2 { font-size: 2em; }
|
|
h3, .h3 { font-size: 1.5em; }
|
|
h4, .h4 { font-size: 1em; }
|
|
h5, .h5 { font-size: 0.8em; }
|
|
h6, .h6 { font-size: 0.5em; }
|
|
|
|
.clearfix {
|
|
clear: both;
|
|
padding: 0 !important;
|
|
margin: 0 !important;
|
|
}
|
|
|
|
.begin-wrapper {
|
|
position: relative;
|
|
|
|
min-height: 100%;
|
|
background-color: #EBEAEF;
|
|
|
|
overflow: hidden;
|
|
}
|
|
|
|
.mbody {
|
|
position: relative;
|
|
width: 100%;
|
|
}
|
|
|
|
.main-column {
|
|
width: 85%;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.right { text-align: right; }
|
|
.panel { padding: 1.2em; }
|
|
|
|
/* transition properties */
|
|
div#header, div#mbody, div#contact, div#horizon {
|
|
|
|
-webkit-transition: all 500ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
|
|
-moz-transition: all 500ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
|
|
-ms-transition: all 500ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
|
|
-o-transition: all 500ms cubic-bezier(0.770, 0.000, 0.175, 1.000);
|
|
transition: all 500ms cubic-bezier(0.770, 0.000, 0.175, 1.000); /* easeInOutQuart */
|
|
|
|
-webkit-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
|
|
-moz-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
|
|
-ms-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
|
|
-o-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
|
|
transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); /* easeInOutQuart */
|
|
}
|
|
|
|
@keyframes spin {
|
|
0% { transform: rotate( 0deg ); }
|
|
25% { transform: rotate( 90deg ); }
|
|
50% { transform: rotate( 180deg ); }
|
|
75% { transform: rotate( 270deg ); }
|
|
100% { transform: rotate( 360deg ); }
|
|
}
|
|
|
|
@keyframes aspin {
|
|
0% { transform: rotate( 0deg ); }
|
|
25% { transform: rotate( -90deg ); }
|
|
50% { transform: rotate( -180deg ); }
|
|
75% { transform: rotate( -270deg ); }
|
|
100% { transform: rotate( -360deg ); }
|
|
}
|
|
|
|
.spin {
|
|
animation-duration: 60s;
|
|
animation-timing-function: linear;
|
|
animation-iteration-count: infinite;
|
|
animation-name: aspin;
|
|
}
|
|
|
|
.cw { animation-name: spin; }
|
|
|
|
/* end transition properties */
|