:root {
--default-margin: 2em;
--default-font-size: 1.1em;
}
html, body {
color: #333;
text-align: left;
line-height: 1.8em;
font-family: "Adelphe Floreal", "Rubik", "Palanquin SemiBold", "Trebuchet MS", "Helvetica Neue",Helvetica,Optima,sans-serif;
margin: 4em;
margin-top: 0.5em;
margin-bottom: 0.5em;
box-sizing: border-box;
font-size: var(--default-font-size);
min-height: 100vh;
display: flex;
flex-direction: column;
justify-content: flex-start;
font-weight: 300;
background-color: #hehehe;
}
@media (max-width: 800px) {
html, body {
margin: 0.25em;
}
}
pre, textarea {tab-size: 4;}
.dark {
color: #FFF;
background: #444;
}
div, section {
margin: 0;
padding: 0;
border: 0;
}
a {
color: #006600;
text-decoration: none;
}
.dark a {
color: #00FF00 !important;
text-decoration: none;
}
a.pltsm_link {
}
a:link { text-decoration: none; }
a:visited { text-decoration: none; }
a:active {
color: #900;
text-decoration: underline;
}
a:hover { text-decoration: underline; }
th {
color: #333;
font-weight: 300;
text-align: left;
line-height: 1.2em;
padding: 0.5em;
}
iframe {
max-width: 80%;
min-height: 70vh;
border: 0;
}
hr {
border: none;
text-align: center;
color: #ccc;
page-break-after: always;
margin-bottom: 4em;
}
/*form { margin: var(--default-margin); }*/
#pltsm-login-form {
width: 300px;
margin-right:auto;
margin-left:auto;
margin-top: 200px;
}
#pltsm-login-title {
margin-right:auto;
margin-left:auto;
width: 100%;
text-align: center;
font-weight: bolder;
margin-bottom: var(--default-margin);
}
#pltsm-login-user {
width: 100%;
margin-bottom: var(--default-margin);
height: 30px;
border-bottom: 1px lightgrey;
border-top-style: hidden;
border-right-style: hidden;
border-left-style: hidden;
border-bottom-style: solid;
outline: none;
}
#pltsm-login-password {
width: 100%;
margin-bottom: var(--default-margin);
height: 30px;
border-bottom: 1px lightgrey;
border-top-style: hidden;
border-right-style: hidden;
border-left-style: hidden;
border-bottom-style: solid;
outline: none;
}
#pltsm-login-submit {
width: 100%;
height: 25px;
border-radius: 25px;
border : none;
background: #aaeeaa;
}
hr:after {
content: "* * *";
letter-spacing: 0.5em;
}
pre {
font-size: var(--default-font-size);
font-weight: 300;
margin: var(--default-margin);
}
code {
font-family : monospace;
}
.vimeo {
border: 0;
width: 100%;
height: 56.25%;
}
::selection {
background: #ccc;
color: #0066ff;
}
p {
argin-bottom: 1em;
page-break-inside: avoid;
}
ul {
list-style-type: none;
margin: calc( var(--default-margin) * 2);
margin-top: 0;
padding: 0;
}
#header {
order: 1;
}
#header a{
text-decoration: underline;
}
#header h3{
margin:1.5em;
margin-bottom: 0;
margin-top: 0;
}
#content {
order: 2;
margin-bottom: auto;
}
#footer {
order: 3;
margin-top: auto;
}
nav a { }
nav a:active {
color: #900;
text-decoration: none;
}
nav a:hover {
color: @link;
background-color: #ccc;
text-decoration: none;
}
p > img {
max-width: 80%;
}
video {
width: 100%;
}
audio {
width: calc( 100% - var(--default-margin) - var(--default-margin));
margin: var(--default-margin);
}
.center {
display: block;
margin-right: auto;
margin-left: auto;
}
.fill {
width: 100%;
max-height: 800px;
overflow: hidden;
}
.blue { background-color: #CCF; }
.pltsm-search-input {
float: right;
width: 70px;
outline: none;
}
.pltsm-search-input:focus {
float: right;
width: 200px;
-webkit-transition: width 0.25s ease-in-out;
-moz-transition: width 0.25s ease-in-out;
-o-transition: width 0.25s ease-in-out;
transition: width 0.25s ease-in-out;
}
blink, .blink { animation: blinker 1s infinite; }
@keyframes blinker {
10% { opacity: 0;}
90% { opacity: 1;}
}
.vibrate {
animation: vibrator 0.5s infinite;
display: inline-block;
}
@keyframes vibrator {
0% { transform: translate(1.2px, 0.2px); }
10% { transform: translate(-0.2px, -0.2px); }
20% { transform: translate(-0.2px, 0px); }
30% { transform: translate(0.2px, 0.2px); }
40% { transform: translate(0.2px, -0.2px); }
50% { transform: translate(-0.2px, 0.2px); }
60% { transform: translate(-0.2px, 0.2px); }
70% { transform: translate(0.2px, 0.2px); }
80% { transform: translate(-0.2px, -0.2px); }
90% { transform: translate(0.2px, 0.2px); }
100% { transform: translate(0.2px, -0.2px); }
}
.spin {
display: inline-block;
-webkit-animation:spiner 4s linear infinite;
-moz-animation:spiner 4s linear infinite;
animation:spiner 4s linear infinite;
)
@-moz-keyframes spiner { 100% { -moz-transform: rotate(360deg); }}
@-webkit-keyframes spiner { 100% { -webkit-transform: rotate(360deg); }}
@keyframes spiner { 100% { transform:rotate(360deg); }}