.area{
background:#000024;
background:-webkit-linear-gradient(to left, #FFF, #000024);
width:100%;
z-index:0;
}

.circles{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
overflow:hidden;
}

.circles li{
position:absolute;
display:block;
list-style:none;
width:20px;
height:20px;
overflow:hidden;
word-wrap:anywhere;
}

.circles li:nth-child(1){
left:25%;
width:80px;
height:80px;
animation-delay:0s;
}


.circles li:nth-child(2){
left:10%;
width:20px;
height:20px;
animation-delay:2s;
animation-duration:12s;
}

.circles li:nth-child(3){
left:70%;
width:20px;
height:20px;
animation-delay:4s;
}

.circles li:nth-child(4){
left:40%;
width:60px;
height:60px;
animation-delay:0s;
animation-duration:18s;
}

.circles li:nth-child(5){
left:65%;
width:20px;
height:20px;
animation-delay:0s;
}

.circles li:nth-child(6){
left:75%;
width:110px;
height:110px;
animation-delay:3s;
}

.circles li:nth-child(7){
left:35%;
width:150px;
height:150px;
animation-delay:7s;
}

.circles li:nth-child(8){
left:50%;
width:25px;
height:25px;
animation-delay:15s;
animation-duration:45s;
}

.circles li:nth-child(9){
left:20%;
width:15px;
height:15px;
animation-delay:2s;
animation-duration:35s;
}

.circles li:nth-child(10){
left:85%;
width:150px;
height:150px;
animation-delay:0s;
animation-duration:11s;
}



@keyframes animate {

0%{
transform:translateY(0) rotate(0deg);
opacity:1;
border-radius:0;
}

100%{
transform:translateY(-1000px) rotate(720deg);
opacity:0;
border-radius:100%;
}

}



#site-header{
margin-bottom:50px;
-webkit-user-select:none;
-ms-user-select:none;
user-select:none;
}

#site-header .logo{
padding:10px;
}

#site-header .logo-text{
display:inline-block;
top:-1px;
position:relative;
margin:0 20px;
}

#site-header .logo-svg{
display:inline-block;
}

#site-header .logo-style{
height:30pt;
top:-4px;
position:relative;
}

#site-header .logo .logo_subtext{
display:inline-block;
}

#light-switch{
top:11px;
right:0;
position:absolute;
font-size:1.4em;
cursor:pointer;
}


.sudo-user-bar{
margin-top:-50px;
margin-bottom:50px;
padding:10px 0;
}

.sudo-user-bar .links{
float:right;
}

.sudo-user-bar .links a{
font-weight:bold;
}


.system-messages{
margin:-50px 0 50px;
padding:10px;
-webkit-user-select:none;
-ms-user-select:none;
user-select:none;
}


*{
margin:0;
padding:0;
}

body{
height:100vh;
}

.content {
width:100%;
margin-top:-50px;
margin-bottom:-50px;
padding:50px 0 50px 0;
}

.content-wrapper{
position:relative;
max-width:768px;
margin:0 auto;
}

.col2{
max-width:49%;
display:inline-block;
vertical-align:top;
}

.center{
text-align:center;
}

#site-footer{
padding:20px 0 20px 0;
-webkit-user-select:none;
-ms-user-select:none;
user-select:none;
}

#site-footer .logo{
padding:10px;
}

#site-footer .logo-text{
display:inline-block;
top:5px;
position:relative;
margin:0 10px;
}

#site-footer .logo-svg{
display:inline-block;
}

#site-footer .logo-style{
height:30pt;
margin:-5px 0 10px 0;
position:relative;
}

#site-footer .logo .logo_subtext{
display:inline-block;
}



.tooltip{
position:relative;
}


.tooltip .tooltip-text {
visibility:hidden;
width:150px;
padding:5px 0;
position:absolute;
z-index:1;
}


.tooltip:hover .tooltip-text {
visibility:visible;
}html {color:#222;font-size:1em;line-height:1.4;}::-moz-selection {background:#b3d4fc;text-shadow:none;}::selection {background:#b3d4fc;text-shadow:none;}hr {display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0;}audio,canvas,iframe,img,svg,video {vertical-align:middle;}fieldset {border:0;margin:0;padding:0;}textarea {resize:vertical;}.hidden,[hidden] {display:none !important;}.sr-only {border:0;clip:rect(0, 0, 0, 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px;}.sr-only.focusable:active,.sr-only.focusable:focus {clip:auto;height:auto;margin:0;overflow:visible;position:static;white-space:inherit;width:auto;}.invisible {visibility:hidden;}.clearfix::before,.clearfix::after {content:" ";display:table;}.clearfix::after {clear:both;}@media only screen and (min-width:35em) {}@media print,(-webkit-min-device-pixel-ratio:1.25),(min-resolution:1.25dppx),(min-resolution:120dpi) {}@media print {*,*::before,*::after {background:#fff !important;color:#000 !important;box-shadow:none !important;text-shadow:none !important;}a,a:visited {text-decoration:underline;}a[href]::after {content:" (" attr(href) ")";}abbr[title]::after {content:" (" attr(title) ")";}a[href^="#"]::after,a[href^="javascript:"]::after {content:"";}pre {white-space:pre-wrap !important;}pre,blockquote {border:1px solid #999;page-break-inside:avoid;}thead {display:table-header-group;}tr,img {page-break-inside:avoid;}p,h2,h3 {orphans:3;widows:3;}h2,h3 {page-break-after:avoid;}}@media (max-width:480px){

body .yip_title{
font-size:1.1em;
}

body .body-content{
border-top:3px solid #00b468;
border-bottom:3px solid #00b468;
border-left:0;
border-right:0;
border-radius:0;
}

body .body-content .edit_bar{
right:2px;
border-radius:0;
}

body #standard_form .form_field input{
width:95%;
}

body #standard_form .form_field textarea{
width:95%;
}

body .body-content .report_bar{
right:10px;
border-radius:0;
}

body .col2{
max-width:100%;
display:block;
vertical-align:top;
}

}html {line-height:1.15; -webkit-text-size-adjust:100%; }body {margin:0;}main {display:block;}h1 {font-size:2em;margin:0.67em 0;}hr {box-sizing:content-box; height:0; overflow:visible; }pre {font-family:monospace, monospace; font-size:1em; }a {background-color:transparent;}abbr[title] {border-bottom:none; text-decoration:underline; text-decoration:underline dotted; }b,strong {font-weight:bolder;}code,kbd,samp {font-family:monospace, monospace; font-size:1em; }small {font-size:80%;}sub,sup {font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sub {bottom:-0.25em;}sup {top:-0.5em;}img {border-style:none;}button,input,optgroup,select,textarea {font-family:inherit; font-size:100%; line-height:1.15; margin:0; }button,input { overflow:visible;}button,select { text-transform:none;}button,[type="button"],[type="reset"],[type="submit"] {-webkit-appearance:button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {border-style:none;padding:0;}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring {outline:1px dotted ButtonText;}fieldset {padding:0.35em 0.75em 0.625em;}legend {box-sizing:border-box; color:inherit; display:table; max-width:100%; padding:0; white-space:normal; }progress {vertical-align:baseline;}textarea {overflow:auto;}[type="checkbox"],[type="radio"] {box-sizing:border-box; padding:0; }[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button {height:auto;}[type="search"] {-webkit-appearance:textfield; outline-offset:-2px; }[type="search"]::-webkit-search-decoration {-webkit-appearance:none;}::-webkit-file-upload-button {-webkit-appearance:button; font:inherit; }details {display:block;}summary {display:list-item;}template {display:none;}[hidden] {display:none;}

#standard-form{
text-align:left;
}

#standard-form h1{
margin:0.1em 0 0.9em;
padding-bottom:20px;
}

#standard-form .form_field{
margin:5px;
}

#standard-form .form_field label{
display:inline-block;
width:200px;
margin-top:15px;
}

#standard-form .form_field input{
display:inline-block;
width:97%;
padding:3px 5px;
}

#standard-form input[type="submit"]{
border:0;
padding:15px;
}

#standard-form .link_button_cancel{
padding:13px;
cursor:default;
}

#standard-form .link_button_delete{
padding:13px;
cursor:default;
float:left;
}

#standard-form .form_field textarea{
width:95%;
padding:10px;
margin-top:10px;
}

#standard-form .notes{
margin-right:10px;
}

#standard-form .button_wrapper{
margin-top:20px;
padding-top:20px;
}



.create-tabs{
padding:10px 0 0 10px;
margin-top:-35px;
margin-bottom:35px;
}

.create-tabs ul li{
display:inline-block;
padding:10px;
border-bottom:0;

}



.edit-page-bar{
position:absolute;
top:0;
right:0;
width:120px;
padding:5px;
}

.edit-page-bar .btn{
display:inline-block;
}



#help table td{
padding:15px;
width:50%;
}

#help h3{
margin:30px 0 10px 0;
}



#toolbar{
padding:6px;
}

#toolbar .toolbar-btn{
display:inline-block;
padding:5px;
width:20px;
}

#toolbar .toolbar-btn:hover{
background-color:#00ff94;
}

.about .about_image{
width:49%;
display:inline-block;
vertical-align:top;
}

.about .about_image img{
height:200px;
width:200px;
filter:url(#wavy);
}

.about .about_text{
display:inline-block;
font-size:0.7em;
text-align:right;
width:49%;
}

.about .about_changelog{
margin-top:10px;
text-align:right;
overflow-y:scroll;
max-height:100px;
}

.about .about_changelog h4{
color:#00b468;
}

.about .about_changelog ul li{
font-size:0.8em;
margin-left:10px;
text-align:right;
}

#homepage-content{
max-width:768px;
margin:0 auto 50px;
padding:20px;
position:relative;
}

.homepage-create-button{
margin:30px 0 50px 0;
}

.homepage-create-button a{
display:block;
padding:10px;
width:91%;
margin:0 auto;
text-align:center;
}

.homepage-introduction{
padding:1em 0 1em 0;
}

.homepage-introduction article{
margin:1em 0 1em 0;
}

.homepage-introduction article ul{
list-style:none;
}


.circle-button{
display:inline-block;
transition:all 0.2s ease;
}

.circle-button:hover{
animation:circle-anim 0.3s ease forwards;
transition:all 0.4s ease;
}

.grow-container{
display:inline-block;
margin:1em;
}

@keyframes circle-anim{
0% {

}

90%{
padding:0.35em;
margin:-0.35em;
}

100%{
padding:0.25em;
margin:-0.25em;
}
}



.yip_title{
margin:0 auto 20px;
max-width:768px;
}

.body-content{
position:relative;
max-width:768px;
padding:20px;
margin:0 auto 50px;
}

.body-content li{
list-style:none;
}

.body-content .title{
margin-top:20px;
}

.body-content h1{
margin:0.1em 0 0.9em;
padding-bottom:20px;
}



.edit-bar{
position:absolute;
top:0;
right:0;
width:91px;
padding:5px;
}

.edit-bar .btn{
display:inline-block;
}



.report-bar{
position:absolute;
bottom:-22px;
right:-3px;
width:125px;
padding:5px;
}

.report-bar .btn{
display:inline-block;
}



.yip-content{
position:relative;
}

.yip-content p{
margin:10px 0 10px 0;
}

.yip-content code{
padding:15px;
display:block;
}
.yip-content img{
max-width:100%;
}

.yip-content ol li{
list-style-type:decimal;
margin-left:35px;
}

.yip-content ul li{
list-style-type:disc;
margin-left:35px;
}

.yip-content li{
margin-bottom:5px;
}

.yip-content table{
width:100%;
}

.yip-content table,td,th{
border-collapse:collapse;
padding:3px;
}

.yip-content blockquote{
padding:10px;
margin:10px;
}




.recent-item{
position:relative;
display:inline-block;
max-width:200px;
width:200px;
vertical-align:top;
padding:15px;
margin:0 5px 0 10px;
height:200px;
max-height:200px;
overflow:scroll;
}

.recent-item a {
display:block;
position:absolute;
z-index:1;
bottom:40%;
left:0;
}

.recent-item .background-image{
width:230px;
height:300px;
background-size:100%;
background-repeat:no-repeat;
position:absolute;
opacity:20%;
top:0;
left:0;
z-index:0;
}

.recent-item h4{
margin-bottom:10px;
}

.wrapper-404{
position:relative;
min-height:300px;
}
.wrapper-404 .img-404{
position:absolute;
display:block;
width:50%;
height:50%;
z-index:0;
top:0;
left:0;
}

.wrapper-404 .message{
position:relative;
z-index:1;
}

.wrapper-404 .img-404 img{
width:341px;
}