*{margin:0;padding:0;overflow-wrap:break-word}.project-name *{margin:0;padding:0;border:0 none;position:relative;outline:none}h1.project-name > a{text-decoration:none;color:#fff;z-index:1;transition:2.6s ease-in-out 1.0s;text-shadow:2px 2px 2px #000}h1.project-name > a:hover{color:#000;transition:.6s ease-in .52s;text-shadow:2px 1px 5px #fff}h1.project-name > a:before{content:"";position:absolute;width:100%;height:3px;bottom:0;left:0;background-image:linear-gradient(120deg, #ecff7f, #db4cff);visibility:hidden;border-radius:5px;transform:scaleX(0);transition:.55s linear;transition-delay:.8s}h1.project-name > a:hover:before,h1.project-name > a:focus:before{visibility:visible;transform:scaleX(1);transition-delay:.1s}.project-name > a:before{background:rgba(0,0,0,0);box-shadow:0 0 10px 2px #52ffd7}.project-name a:after{opacity:.95;transform:scalex(1)}.project-name:hover > a:after{opacity:.15;transform:scalex(1)}.project-name > a:after{content:"";position:absolute;width:100%;height:7px;border:1px solid #000;bottom:-2px;left:0;background:#fff;border-radius:5px;opacity:0;transform:scalex(0);transition:3s;transition-delay:1.1s}.project-name:hover > a:after{transition:.5s}.page-header h2~a:visited{color:#bbf5ff}.page-header h2~a:hover{color:#fff;text-shadow:1px 1px 2px #000}#mySidenav a:visited{color:#93fff0}#mySidenav a,.page-header a.btn{overflow:hidden;white-space:nowrap}.navbar{text-align:center;list-style:none;margin:0;padding:0;height:100%}.navbar li{display:inline-block;height:80px;margin:0 25px;position:relative;overflow:hidden}.navbar li::after{content:"";width:25px;height:25px;background:#fff;display:block;position:absolute;left:50%;transform:translateX(-50%) rotate(-45deg) translateY(8px);opacity:0;transition:all 170ms ease-in-out;-webkit-transition:all 170ms ease-in-out}.navbar li:hover::after{transform:rotate(-45deg) translateY(-18px);opacity:1}.navbar li a{color:#fff;font-family:sans-serif;text-transform:uppercase;text-decoration:none;display:block;height:80px;line-height:80px}.wrapper.navbar-wrapper{width:100%;height:auto;position:fixed;top:40px;left:50%;z-index:9;transform:translateX(-50%) translateY(-50%);background:rgba(0, 0, 0, 0.7);height:80px}span.w3-opennav{background-color:rgba(97, 97, 97, 0.32);position:fixed;z-index:30}ul.section.table-of-contents{position:fixed;bottom:0}.section.scrollspy{padding-top:90px;font-weight:bold}button.us,button.ger{height:24px;width:32px;margin:3px}button.us img,button.ger img{margin:1px;padding:1px;border:0px solid;vertical-align:baseline}span.language{position:absolute;margin:auto;margin-top:10px;left:initial;right:10px;width:80px;z-index:20}.w3-sidenav{z-index:30}.w3-sidenav .version{position:fixed;background:#000;width:100%}.w3-sidenav p{padding-top:64px}.site-header ul.navbar,.site-header .wrapper.navbar-wrapper{z-index:10;padding:0;margin:0;max-width:100%}footer.site-footer{text-align:center}.main-content p{margin-bottom:5px}#topcontrol{transition:.4s ease-in-out}.table-of-contents a{padding-left:5px}@media (min-width: 800px){#topcontrol{left:75%;margin:auto;width:60px}.page-content,.main-content{padding:0 6rem}}@media (min-width: 600px){.page-header{padding-top:100px}span.language{left:450px;right:0;margin-top:25px;position:fixed}.page-content,.main-content{padding:1rem 3rem}hr ~ h3{padding-top:100px !important;margin-top:-100px !important}}@media (max-width: 800px){.table-of-contents li{padding:0px 0;font-size:.8em;margin:0}}@media (max-width: 700px){.table-of-contents .col-2{display:none}span.language button.us{position:fixed;right:50px}span.language button.ger{position:fixed;right:13px}}@media (max-width: 350px){.page-header a.btn{font-size:.7em}}.page-content:first-child > h1 > a,.main-content > .post > .post-content > h1 > a:first-child{display:none}.table-of-contents{margin-bottom:100px;bottom:0;background-color:#fdfdfdc7;border-radius:20px}.page-header a.btn{text-shadow:2px 2px 4px #000000;letter-spacing:2px;text-transform:lowercase}.main-content h3#version{margin-bottom:10px;margin-left:30px;margin-bottom:10px}.version.section.table-of-contents{position:fixed}a{color:#0081ce}a:visited{color:#00baf3}a:hover{color:#30d0ab}a:focus{color:#ff489c}#main{background-image:url(//trevelopment.com/mazda-1600.png);background-repeat:no-repeat;background-position:center;background-attachment:fixed;background-size:50%}.wrapper.main-content{background-color:rgba(255, 255, 255, 0.72);border-radius:20px;color:#000}.wrapper.main-content{background-color:rgba(253,253,253,.85);transition-delay:1.1s}.main-content h1{color:#350000}.main-content h2{color:#007d2d;margin-top:0rem;margin-bottom:2rem}.main-content h3{color:#155d93}.main-content h4{color:#0b0046;margin-bottom:0}.main-content h5{color:#003e33;margin-bottom:0.5rem;font-size:20px;font-weight:400;margin-top:1.5rem}.main-content h6{color:#000}.main-content h4 ~ hr{margin-top:0.2em}.main-content .warnings h5{margin-top:.5rem}.main-content a{color:#142392;text-decoration:underline}.main-content a:hover{color:#b94e00;text-decoration:none;padding-left:2px}li{margin-left:1rem}ul li{list-style-type:square}ul li ul li{margin-left:1rem;list-style-type:circle}strong{color:#000;font-weight:600}h1 small{font-size:.6em;text-shadow:2px 1px 2px #b6b5c7;color:#20274c}

ul li {
    list-style-type: square;
}
li.w3-dropdown-hover:hover {
    overflow: visible;
    top: -35px;
}
.moar + .w3-dropdown-content {
	width:260px;
}
.moar + .w3-bar-block .w3-bar-item {
    padding: 2px 24px;
	border-bottom: 1px dashed #330000;
}
.wrapper.main-content.FAQ {
    max-width: 1200px;
}
p strong {
    font-size: 20px;
}
.FAQ.main-content code {
    padding: 2px 5px;
    font-family: Menlo, Courier, monospace;
    font-size: 1.2rem;
    color: #00ff45;
    background-color: #404040;
    border-radius: 0.43rem;
}
.tip {
	font-weight:400;
	font-size:1.1rem;
}
.copy-msg+ul li {
    list-style: none;
    margin-left: 0px;
}
.copy-msg+ul li pre{
    line-height:1;
}
.copy-msg+ul li pre input[type=text]{
    background-color: transparent;
    border: none;
    border-bottom: 1px dashed grey;
    border-radius: 0;
    outline: none;
    height: 2rem;
    width: 100%;
    font-size: 1rem;
    margin: 0 0 5px 0;
    padding: 0;
    box-shadow: none;
}
.copy-msg+ul li pre input[type=text]:focus{
    border-bottom:1px solid white;
}
.copy-msg+ul li pre input[type=text]::selection{
    background:#ff00e0;
    color:#00ff7d;
}
.one-liners input[type=text]{
    width: 60px;
    text-align: center;
    cursor: pointer;
}
.one-liners .copied-msg{
  margin: -10px -30px!important;
  position: absolute;
  width: 150px;
}
.post-content img {
    max-height: 300px;
}
[id*=aio-code] code {
    background: black;
    color: #00ffa3;
}
/* The snackbar - position it at the bottom and in the middle of the screen */
#snackbar {
    visibility: hidden; /* Hidden by default. Visible on click */
    min-width: 250px; /* Set a default minimum width */
    margin-left: -125px; /* Divide value of min-width by 2 */
    background-color: #333; /* Black background color */
    color: #fff; /* White text color */
    text-align: center; /* Centered text */
    border-radius: 2px; /* Rounded borders */
    padding: 16px; /* Padding */
    position: fixed; /* Sit on top of the screen */
    z-index: 1; /* Add a z-index if needed */
    left: 50%; /* Center the snackbar */
    bottom: 30px; /* 30px from the bottom */
}

/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
    visibility: visible; /* Show the snackbar */

/* Add animation: Take 0.5 seconds to fade in and out the snackbar. 
However, delay the fade out process for 2.5 seconds */
    -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
    animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
    from {bottom: 0; opacity: 0;} 
    to {bottom: 30px; opacity: 1;}
}

@keyframes fadein {
    from {bottom: 0; opacity: 0;}
    to {bottom: 30px; opacity: 1;}
}

@-webkit-keyframes fadeout {
    from {bottom: 30px; opacity: 1;} 
    to {bottom: 0; opacity: 0;}
}

@keyframes fadeout {
    from {bottom: 30px; opacity: 1;}
    to {bottom: 0; opacity: 0;}
}