/* W3.CSS 1.2 created by J.E.Refsnes for W3schools. Do not remove this line. */

/* Extract from normalize.css by Nicolas Gallagher and Jonathan Neal | MIT License | git.io/normalize */
html {-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}
body {margin:0;}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary {display:block;}
audio,canvas,video {display:inline-block;vertical-align:baseline;}
audio:not([controls]) {display:none;height:0;}
[hidden],template {display:none;}
a {-webkit-tap-highlight-color:transparent;background-color:transparent;}
a:active,a:hover {outline:0;}
abbr[title] {border-bottom:1px dotted;}
b,strong {font-weight:bold;}
dfn {font-style:italic;}
mark {background:#ff0;color:#000;}
small {font-size:80%;}
sub,sup {font-size:75%;line-height:0;position:relative;vertical-align:baseline;}
sup {top:-0.5em;}
sub {bottom:-0.25em;}
img {border:0;}
svg:not(:root) {overflow:hidden;}
figure {margin:1em 40px;}
hr {-moz-box-sizing:content-box;box-sizing:content-box;}
pre {overflow:auto;}
code,kbd,pre,samp {font-family:monospace,monospace;font-size:1em;}
button,input,optgroup,select,textarea {color:inherit;font:inherit;margin:0;}
button {overflow:visible;}
button,select {text-transform:none;}
button,html input[type=button],input[type=reset],input[type=submit] {-webkit-appearance:button;cursor:pointer;}
button[disabled],html input[disabled] {cursor:default;}
button::-moz-focus-inner,input::-moz-focus-inner {border:0;padding:0;}
input {line-height:normal;}
input[type=checkbox],input[type=radio] {box-sizing:border-box;padding:0;}
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button {height:auto;}
input[type=search] {box-sizing:content-box;-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;}
input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration {-webkit-appearance:none;}
fieldset {border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}
legend {border:0;padding:0;}
textarea {overflow:auto;}
optgroup {font-weight:bold;}
html {box-sizing:border-box;}
*,*:before,*:after {box-sizing:inherit;}
/* End extract from normalize.css */

html {font-family:Verdana,sans-serif;font-size:15px;line-height:1.5;font-weight:normal;}
h1,h2,h3,h4,h5,h6 {font-family:"Segoe UI",Tahoma,Verdana,sans-serif;font-weight:400;line-height:1;margin:20px 0;}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a {font-weight:inherit;}
h1 {font-size:36px}
h2 {font-size:30px}
h3 {font-size:24px}
h4 {font-size:20px}
h5 {font-size:18px}
h6 {font-size:16px}
hr {height:0;border:0;border-top:1px solid #eee;margin:16px 0;}
img {margin-bottom:-5px;}
/* TABLES */ 
table {border-collapse:collapse;border-spacing:0;width:100%;display:table;}
table,th,td {border:none;}
table.w3-bordered tr {border-bottom:1px solid #d0d0d0;}
table.w3-striped tbody tr:nth-child(odd) {background-color:#f2f2f2;}
table.w3-hoverable tbody tr {transition:background-color .25s ease;}
table.w3-hoverable tbody tr:hover {background-color:#f2f2f2;}
table.w3-centered tr th,table.w3-centered tr td {text-align:center;}
thead.w3-bordered {border-bottom:1px solid #d0d0d0;}
table.w3-table td,th {padding:6px 8px;display:table-cell;text-align:left;vertical-align:top;}
table.w3-table th:first-child,table.w3-table td:first-child {padding-left:16px;}
/* BUTTONS */
.w3-btn {
border:none;display:inline-block;outline:0;padding:8px 16px;vertical-align:middle;
text-decoration:none !important;color:#fff;background-color:#000;text-align:center;transition:.2s ease-out;cursor:pointer;}
.w3-btn.w3-disabled,.w3-btn-floating.w3-disabled,.w3-btn:disabled,.w3-btn-floating:disabled,.w3-btn-floating-large.w3-disabled,.w3-btn-floating-large:disabled {
background-color:#DFDFDF;box-shadow:none;color:#9F9F9F;cursor:not-allowed;}
.w3-btn.w3-disabled *,.w3-btn-floating.w3-disabled *,.w3-btn:disabled *,.w3-btn-floating:disabled * {pointer-events:none;}
.w3-btn.w3-disabled:hover,.w3-btn-floating.w3-disabled:hover,.w3-btn:disabled:hover,.w3-btn-floating:disabled:hover {
background-color:#DFDFDF !important;color:#9F9F9F !important;}
.w3-btn:hover,.w3-btn-floating:hover,.w3-btn-floating i:hover,.w3-btn-floating-large:hover,.w3-btn-floating-large i:hover {
opacity:0.7 !important;}
.w3-btn-floating,.w3-btn-floating-large {
display:inline-block;color:#fff;background-color:#000;position:relative;overflow:hidden;z-index:1;
width:40px;height:40px;line-height:40px;padding:0;border-radius:50%;transition:.3s;cursor:pointer;}
.w3-btn-floating-large {width:56px;height:56px;line-height:56px;}
.w3-btn-floating i,.w3-btn-floating-large i {
font-style:normal;width:inherit;display:inline-block;text-align:center;color:#fff;font-size:24px;position:relative;top:-1px}
.w3-btn-floating i.material-icons {font-size:30px;top:5px}
.w3-btn-floating-large i.material-icons {font-size:30px;top:9px}
.w3-btn-floating i.fa {top:3px}
.w3-btn-floating-large i.fa {top:4px}
.w3-btn-floating:before {border-radius:0;}
/* BADGES */
.w3-badge,.w3-tag {display:inline-block;padding-left:6px;padding-right:6px;font-weight:bold;text-align:center;}
.w3-badge {border-radius:12px;}
/* BLOCKQUOTE */
.w3-blockquote {margin:0;padding-left:16px;border-left:5px solid #ddd;font-style:italic;}
/* LISTS */
ul.w3-ul {list-style-type:none;padding:0;}
ul.w3-ul li {padding:6px 16px;border-bottom:1px solid #e0e0e0;}
ul.w3-ul li:last-child {border-bottom:none;}
/* IMAGES */
.w3-image {position:relative;}
.w3-image img {max-width:100%;height:auto;}
.w3-image .w3-title {position:absolute;bottom:8px;left:16px;color:#fff;font-size:20px;}
/* TOOLTIP */
.w3-tooltip .w3-text {display:none;}
.w3-tooltip:hover .w3-text {display:inline-block;}
/* NAVIGATION */
.w3-nav a,.w3-topnav a,.w3-sidenav a {text-decoration:none !important;color:inherit;}
/* TOPNAV */
.w3-topnav {padding:0;}
.w3-topnav a {
padding:0 8px;text-decoration:none !important;color:inherit;border-bottom:3px solid transparent;}
.w3-topnav a:first-child {padding: 0 8px 0 0;}
.w3-topnav a:hover {border-bottom:3px solid #fff;}
.w3-topnav i {font-size:20px;line-height:0;position:relative;bottom:-4px;}
.w3-topnav.w3-large i {font-size:24px;}
.w3-topnav.w3-xlarge i {font-size:28px;}
/* SIDENAV */
.w3-sidenav {height:100%;position:fixed;top:0;right:0;bottom:0;left:0;z-index:1;overflow:auto;}
.w3-opennav,.w3-closenav {color:inherit;}
.w3-opennav:hover,.w3-closenav:hover {cursor:pointer;opacity:0.8;}
.w3-sidenav a {display:block;padding:4px 16px;transition:.3s;}
.w3-sidenav a:hover,.w3-sidenav a:focus {background-color:#ccc;}
/* TAB */
.w3-tab div {display:none;}
.w3-tab div:target {display:block;}
/* MODAL */
.w3-modal {
display:none;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;
background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4);}
.w3-modal:target {display:table;position:absolute;overflow:scroll;z-index:1;}
.w3-modal-dialog {display:table-cell;vertical-align:middle;}
.w3-modal-dialog .w3-modal-content {
margin:auto;background-color:#f3f3f3;position:relative;padding:0;outline:0;border:1px #555 solid;width:600px;}
.w3-closebtn {text-decoration:none;float:right;font-size:24px;font-weight:bold;color:#fff;}
.w3-closebtn:hover,.w3-closebtn:focus {color:#000;text-decoration:none;cursor:pointer;}
/* FORMS */
.w3-group {position:relative;margin-top:30px;margin-bottom:30px;}
.w3-input,.w3-textarea {padding:10px;display:block;border:none;border-bottom:1px solid #808080;}
.w3-label {
position:absolute;top:0;left:0;color:#009688;
transition:0.2s ease all;-moz-transition:0.2s ease all;-webkit-transition:0.2s ease all;}
.w3-input:focus ~ .w3-label,.w3-input:valid ~ .w3-label,.w3-textarea:focus ~ .w3-label,.w3-textarea:valid ~ .w3-label {
top:-20px;font-size:14px;color:#888;}
.w3-checkbox {display:inline-block;line-height:24px;margin:8px 0;}
.w3-checkbox input[type=checkbox], .w3-checkbox input[type=radio] {display:none;}
.w3-checkbox input[type=checkbox]:checked + .w3-checkmark:before {background:#009688;}
.w3-checkbox input[type=checkbox]:checked + .w3-checkmark:after {opacity:1;}
.w3-checkbox input[type=radio]:checked + .w3-checkmark:before {background:#fff;}
.w3-checkbox input[type=radio]:checked + .w3-checkmark:after {opacity:1;background-color:#009688;}
.w3-checkmark:before {content:'';position:absolute;width:24px;height:24px;border:2px solid #009688;}
.w3-checkmark {position:relative;display:inline-block;vertical-align:top;cursor:pointer;width:24px;height:24px;}
.w3-checkmark:after 
{content:'';position:absolute;top:7px;left:6px;width:14px;height:8px;border:4px solid #fff;
border-top:none;border-right:none;
-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);
-o-transform:rotate(-45deg);transform:rotate(-45deg);}
.w3-checkbox input[type=radio] + .w3-checkmark:before {border-radius:50%;background-color:#fff;}
.w3-checkbox input[type=radio] + .w3-checkmark:after 
{content:'';position:absolute;top:6px;left:6px;width:12px;height:12px;border:0 solid #fff
;border-radius:50%;}
.w3-checkbox input[type=checkbox]:disabled + .w3-checkmark {opacity:0.3;cursor:default;}
.w3-checkbox input[type=radio]:disabled + .w3-checkmark {opacity:0.3;cursor:default;}
/* RESPONSIVE */
.w3-responsive {overflow-x:auto;}
.w3-row, w3-row-padding {margin:0;padding:0;}
.w3-row-margin {margin:8px;padding:0;}
.w3-row:after,.w3-row-padding:after,.w3-row-margin:after,.w3-container:after {content:"";display:table;clear:both;}
.w3-col,.w3-half,.w3-quarter,.w3-third {
float:left;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;width:100%;}
.w3-col.s1 {width: 8.33333%;}
.w3-col.s2 {width:16.66666%;}
.w3-col.s3 {width:24.99999%;}
.w3-col.s4 {width:33.33333%;}
.w3-col.s5 {width:41.66666%;}
.w3-col.s6 {width:49.99999%;}
.w3-col.s7 {width:58.33333%;}
.w3-col.s8 {width:66.66666%;}
.w3-col.s9 {width:74.99999%;}
.w3-col.s10{width:83.33333%;}
.w3-col.s11{width:91.66666%;}
.w3-col.s12,.w3-half,.w3-third,.w3-quarter {width:99.99999%;}
@media only screen and (min-width :601px) {
.w3-col.m1 {width:8.33333%;}
.w3-col.m2 {width:16.66666%;}
.w3-col.m3,.w3-quarter {width:24.99999%;}
.w3-col.m4,.w3-third {width:33.33333%;}
.w3-col.m5 {width:41.66666%;}
.w3-col.m6,.w3-half {width:49.99999%;}
.w3-col.m7 {width:58.33333%;}
.w3-col.m8 {width:66.66666%;}
.w3-col.m9 {width:74.99999%;}
.w3-col.m10{width:83.33333%;}
.w3-col.m11{width:91.66666%;}
.w3-col.m12 {width:99.99999%;}}
@media only screen and (min-width :993px) {
.w3-col.l1 {width: 8.33333%;}
.w3-col.l2 {width:16.66666%;}
.w3-col.l3,.w3-quarter {width:24.99999%;}
.w3-col.l4,.w3-third {width:33.33333%;}
.w3-col.l5 {width:41.66666%;}
.w3-col.l6,.w3-half {width:49.99999%;}
.w3-col.l7 {width:58.33333%;}
.w3-col.l8 {width:66.66666%;}
.w3-col.l9 {width:74.99999%;}
.w3-col.l10{width:83.33333%;}
.w3-col.l11{width:91.66666%;}
.w3-col.l12{width:99.99999%;}}
@media (max-width:570px) {.w3-modal-dialog .w3-modal-content {margin:50px 10px 10px 10px;width:auto !important;}}
@media (max-width:768px) {.w3-modal-dialog .w3-modal-content {width:500px;}}
@media (min-width:992px) {.w3-modal-dialog .w3-modal-content {width:900px;}}
@media screen and (max-width:630px) {.w3-topnav a {display:block;}.w3-topnav a:first-child {padding: 0 8px;}}	
@media screen and (max-width:629px) {.w3-topnav {text-align:center;}}
/* UTILITIES */
.w3-left {float:left !important;margin-right:16px !important;}
.w3-right {float:right !important;margin-left:16px !important;}
.w3-hide {display:none !important;}
.w3-show {display:block !important;}
.w3-tiny {font-size:10px !important;}
.w3-small {font-size:12px !important;}
.w3-medium {font-size:15px !important;}
.w3-large {font-size:20px !important;}
.w3-xlarge {font-size:24px !important;}
.material-icons {position:relative;top:3px;}
.w3-xxlarge {font-size:32px !important;}
.w3-xxxlarge {font-size:48px !important;}
.w3-jumbo {font-size:64px !important;}
.w3-left-align {text-align:left !important;}
.w3-right-align {text-align:right !important;}
.w3-center {text-align:center !important;}
.w3-left {float:left !important;}
.w3-right {float:right !important;}
.w3-circle {border-radius:50% !important;}
.w3-border-0 {border:0 !important;}
.w3-border {border:1px solid #ccc !important;}
.w3-border-top {border-top:1px solid #ccc !important;}
.w3-border-bottom {border-bottom:1px solid #ccc !important;}
.w3-border-left {border-left:1px solid #ccc !important;}
.w3-border-right {border-right:1px solid #ccc !important;}
.w3-margin-0 {margin:0 !important;}
.w3-margin-2 {margin:2px !important;}
.w3-margin-4 {margin:4px !important;}
.w3-margin-8 {margin:8px !important;}
.w3-margin-12 {margin:12px !important;}
.w3-margin-16 {margin:16px !important;}
.w3-margin-24 {margin:24px !important;}
.w3-margin-32 {margin:32px !important;}
.w3-margin-64 {margin:64px !important;}
.w3-margin {margin:16px !important;}
.w3-margin-top {margin-top:16px !important;}
.w3-margin-bottom {margin-bottom:16px !important;}
.w3-margin-left {margin-left:16px !important;}
.w3-margin-right {margin-right:16px !important;}
.w3-padding-0 {padding:0 !important;}
.w3-padding-4 {padding:4px 16px !important;}
.w3-padding-8, .w3-padding {padding:8px 16px !important;}
.w3-padding-12 {padding:12px 16px !important;}
.w3-padding-16 {padding:16px !important;}
.w3-padding-24 {padding:24px 16px !important;}
.w3-padding-32 {padding:32px 16px !important;}
.w3-padding-64 {padding:64px 16px !important;}
.w3-padding-jumbo {padding:64px !important;}
.w3-padding-top {padding-top:8px !important;}
.w3-padding-bottom {padding-bottom:8px !important;}
.w3-padding-left {padding-left:16px !important;}
.w3-padding-right {padding-right:16px !important;}
.w3-row-padding .w3-half,.w3-row-padding .w3-third,.w3-row-padding .w3-quarter,.w3-row-padding .w3-col {padding:1px 16px;}
/* CONTAINERS */
.w3-container {padding:1px 16px;}
.w3-example {background-color:#f2f2f2;padding:16px;}
.w3-code {font-family:Consolas,"courier new";font-size:16px;
width:auto;background-color:#fff;padding:8px 12px;border-left:4px solid #009688;word-wrap:break-word;}
/* CARDS */
.w3-card {border:1px solid #ccc;}
.w3-card-2, .w3-example {box-shadow:0 2px 4px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12) !important;}
.w3-card-4 {box-shadow:0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19) !important;}
.w3-card-8 {box-shadow:0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19) !important;}
.w3-card-12 {box-shadow:0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19) !important;}
.w3-card-16 {box-shadow:0 16px 24px 0 rgba(0,0,0,0.22),0 25px 55px 0 rgba(0,0,0,0.21) !important;}
.w3-card-24 {box-shadow:0 24px 24px 0 rgba(0,0,0,0.2),0 40px 77px 0 rgba(0,0,0,0.22) !important;}
.w3-row-margin .w3-card,.w3-row-margin .w3-card-2,.w3-row-margin .w3-card-4,.w3-row-margin .w3-card-8,
.w3-row-margin .w3-card-16,.w3-row-margin .w3-card-24 {margin:8px;}
/* ANIMATION */
.w3-animate-opacity {
-webkit-animation-name:opac;-webkit-animation-duration:4s;animation-name:opac;animation-duration:4s;}
@-webkit-keyframes opac {from {opacity:0;} to {opacity:1;}}
@keyframes opac {from {opacity:0;} to {opacity:1;}}
/* TOP */
.w3-animate-top {
position:relative;-webkit-animation-name:animatetop;-webkit-animation-duration:0.6s;animation-name:animatetop;animation-duration:0.6s;}
@-webkit-keyframes animatetop {from {top:-300px;opacity:0;} to {top:0;opacity:1;}}
@keyframes animatetop {from {top:-300px;opacity:0;} to {top:0;opacity:1;}}
/* LEFT */
.w3-animate-left {
-webkit-animation-name:animateleft;-webkit-animation-duration:0.6s;animation-name:animateleft;animation-duration:0.6s;}
@-webkit-keyframes animateleft {from {left:-300px;opacity:0;} to {left:0;opacity:0.9;}}
@keyframes animateleft {from {left:-300px;opacity:0;} to {left:0;opacity:0.9;}}
/* RIGHT */
.w3-animate-right {
-webkit-animation-name:animateright;-webkit-animation-duration:0.6s;animation-name:animateright;animation-duration:0.6s;}
@-webkit-keyframes animateright {from {right:-300px;opacity:0;} to {right:0;opacity:0.9;}}
@keyframes animateright {from {right:-300px;opacity:0;} to {right:0;opacity:0.9;}}
/* BOTTOM */
.w3-animate-bottom {
position:relative;-webkit-animation-name:animatebottom;-webkit-animation-duration:0.6s;animation-name:animatebottom;animation-duration:0.6s;}
@-webkit-keyframes animatebottom {from {bottom:-300px;opacity:0;} to {bottom:0px;opacity:1;}}
@keyframes animatebottom {from {bottom:-300px;opacity:0;} to {bottom:0;opacity:1;}}
/* COLORS */
.highCOM {color:green;}
.highELE {color:brown;}
.highATT {color:crimson;}
.highATT {color:red;}
.highVAL {color:mediumblue;}
.highGLB {color:#CC9900;}
.highLT,.highGT {color:blue;}
.red-l5 {color:#000 !important;background-color:#FFEBEE !important;}
.red-l4 {color:#000 !important;background-color:#FFCDD2 !important;}
.red-l3 {color:#000 !important;background-color:#EF9A9A !important;}
.red-l2 {color:#000 !important;background-color:#E57373 !important;}
.red-l1 {color:#fff !important;background-color:#EF5350 !important;}
.red-d1 {color:#fff !important;background-color:#E53935 !important;}
.red-d2 {color:#fff !important;background-color:#D32F2F !important;}
.red-d3 {color:#fff !important;background-color:#C62828 !important;}
.red-d4 {color:#fff !important;background-color:#B71C1C !important;}
.pink-l5 {color:#000 !important;background-color:#fce4ec !important;}
.pink-l4 {color:#000 !important;background-color:#f8bbd0 !important;}
.pink-l3 {color:#000 !important;background-color:#f48fb1 !important;}
.pink-l2 {color:#fff !important;background-color:#f06292 !important;}
.pink-l1 {color:#fff !important;background-color:#ec407a !important;}
.pink-d1 {color:#fff !important;background-color:#d81b60 !important;}
.pink-d2 {color:#fff !important;background-color:#c2185b !important;}
.pink-d3 {color:#fff !important;background-color:#ad1457 !important;}
.pink-d4 {color:#fff !important;background-color:#880e4f !important;}
.purple-l5 {color:#000 !important;background-color:#f3e5f5 !important;}
.purple-l4 {color:#000 !important;background-color:#e1bee7 !important;}
.purple-l3 {color:#000 !important;background-color:#ce93d8 !important;}
.purple-l2 {color:#fff !important;background-color:#ba68c8 !important;}
.purple-l1 {color:#fff !important;background-color:#ab47bc !important;}
.purple-d1 {color:#fff !important;background-color:#8e24aa !important;}
.purple-d2 {color:#fff !important;background-color:#7b1fa2 !important;}
.purple-d3 {color:#fff !important;background-color:#6a1b9a !important;}
.purple-d4 {color:#fff !important;background-color:#4a148c !important;}
.deep-purple-l5 {color:#000 !important;background-color:#ede7f6 !important;}
.deep-purple-l4 {color:#000 !important;background-color:#d1c4e9 !important;}
.deep-purple-l3 {color:#000 !important;background-color:#b39ddb !important;}
.deep-purple-l2 {color:#fff !important;background-color:#9575cd !important;}
.deep-purple-l1 {color:#fff !important;background-color:#7e57c2 !important;}
.deep-purple {color:#fff !important;background-color:#673ab7 !important;}
.deep-purple-d1 {color:#fff !important;background-color:#5e35b1 !important;}
.deep-purple-d2 {color:#fff !important;background-color:#512da8 !important;}
.deep-purple-d3 {color:#fff !important;background-color:#4527a0 !important;}
.deep-purple-d4 {color:#fff !important;background-color:#311b92 !important;}
.indigo-l5 {color:#000 !important;background-color:#e8eaf6 !important;}
.indigo-l4 {color:#000 !important;background-color:#c5cae9 !important;}
.indigo-l3 {color:#000 !important;background-color:#9fa8da !important;}
.indigo-l2 {color:#fff !important;background-color:#7986cb !important;}
.indigo-l1 {color:#fff !important;background-color:#5c6bc0 !important;}
.indigo-d1 {color:#fff !important;background-color:#3949ab !important;}
.indigo-d2 {color:#fff !important;background-color:#303f9f !important;}
.indigo-d3 {color:#fff !important;background-color:#283593 !important;}
.indigo-d4 {color:#fff !important;background-color:#1a237e !important;}
.blue-l5 {color:#000 !important;background-color:#E3F2FD !important;}
.blue-l4 {color:#000 !important;background-color:#BBDEFB !important;}
.blue-l3 {color:#000 !important;background-color:#90CAF9 !important;}
.blue-l2 {color:#000 !important;background-color:#64B5F6 !important;}
.blue-l1 {color:#fff !important;background-color:#42A5F5 !important;}
.blue-d1 {color:#fff !important;background-color:#1E88E5 !important;}
.blue-d2 {color:#fff !important;background-color:#1976D2 !important;}
.blue-d3 {color:#fff !important;background-color:#1565C0 !important;}
.blue-d4 {color:#fff !important;background-color:#0D47A1 !important;}
.light-blue-l5 {color:#000 !important;background-color:#e1f5fe !important;}
.light-blue-l4 {color:#000 !important;background-color:#b3e5fc !important;}
.light-blue-l3 {color:#000 !important;background-color:#81d4fa !important;}
.light-blue-l2 {color:#000 !important;background-color:#4fc3f7 !important;}
.light-blue-l1 {color:#000 !important;background-color:#29b6f6 !important;}
.light-blue-d1 {color:#fff !important;background-color:#039be5 !important;}
.light-blue-d2 {color:#fff !important;background-color:#0288d1 !important;}
.light-blue-d3 {color:#fff !important;background-color:#0277bd !important;}
.light-blue-d4 {color:#fff !important;background-color:#01579b !important;}
.cyan-l5 {color:#000 !important;background-color:#e0f7fa !important;}
.cyan-l4 {color:#000 !important;background-color:#b2ebf2 !important;}
.cyan-l3 {color:#000 !important;background-color:#80deea !important;}
.cyan-l2 {color:#000 !important;background-color:#4dd0e1 !important;}
.cyan-l1 {color:#000 !important;background-color:#26c6da !important;}
.cyan-d1 {color:#000 !important;background-color:#00acc1 !important;}
.cyan-d2 {color:#fff !important;background-color:#0097a7 !important;}
.cyan-d3 {color:#fff !important;background-color:#00838f !important;}
.cyan-d4 {color:#fff !important;background-color:#006064 !important;}
.teal-l5 {color:#000 !important;background-color:#e0f2f1 !important;}
.teal-l4 {color:#000 !important;background-color:#b2dfdb !important;}
.teal-l3 {color:#000 !important;background-color:#80cbc4 !important;}
.teal-l2 {color:#000 !important;background-color:#4db6ac !important;}
.teal-l1 {color:#000 !important;background-color:#26a69a !important;}
.teal-d1 {color:#fff !important;background-color:#00897b !important;}
.teal-d2 {color:#fff !important;background-color:#00796b !important;}
.teal-d3 {color:#fff !important;background-color:#00695c !important;}
.teal-d4 {color:#fff !important;background-color:#004d40 !important;}
.green-l5 {color:#000 !important;background-color:#E8F5E9 !important;}
.green-l4 {color:#000 !important;background-color:#C8E6C9 !important;}
.green-l3 {color:#000 !important;background-color:#A5D6A7 !important;}
.green-l2 {color:#000 !important;background-color:#81C784 !important;}
.green-l1 {color:#000 !important;background-color:#66BB6A !important;}
.green-d1 {color:#fff !important;background-color:#43A047 !important;}
.green-d2 {color:#fff !important;background-color:#388E3C !important;}
.green-d3 {color:#fff !important;background-color:#2E7D32 !important;}
.green-d4 {color:#fff !important;background-color:#1B5E20 !important;}
.light-green-l5 {color:#000 !important;background-color:#f1f8e9 !important;}
.light-green-l4 {color:#000 !important;background-color:#dcedc8 !important;}
.light-green-l3 {color:#000 !important;background-color:#c5e1a5 !important;}
.light-green-l2 {color:#000 !important;background-color:#aed581 !important;}
.light-green-l1 {color:#000 !important;background-color:#9ccc65 !important;}
.light-green {color:#000 !important;background-color:#8bc34a !important;}
.light-green-d1 {color:#000 !important;background-color:#7cb342 !important;}
.light-green-d2 {color:#fff !important;background-color:#689f38 !important;}
.light-green-d3 {color:#fff !important;background-color:#558b2f !important;}
.light-green-d4 {color:#fff !important;background-color:#33691e !important;}
.lime-l5 {color:#000 !important;background-color:#f9fbe7 !important;}
.lime-l4 {color:#000 !important;background-color:#f0f4c3 !important;}
.lime-l3 {color:#000 !important;background-color:#e6ee9c !important;}
.lime-l2 {color:#000 !important;background-color:#dce775 !important;}
.lime-l1 {color:#000 !important;background-color:#d4e157 !important;}
.lime-d1 {color:#000 !important;background-color:#c0ca33 !important;}
.lime-d2 {color:#000 !important;background-color:#afb42b !important;}
.lime-d3 {color:#000 !important;background-color:#9e9d24 !important;}
.lime-d4 {color:#fff !important;background-color:#827717 !important;}
.yellow-l5 {color:#000 !important;background-color:#fffde7 !important;}
.yellow-l4 {color:#000 !important;background-color:#fff9c4 !important;}
.yellow-l3 {color:#000 !important;background-color:#fff59d !important;}
.yellow-l2 {color:#000 !important;background-color:#fff176 !important;}
.yellow-l1 {color:#000 !important;background-color:#ffee58 !important;}
.yellow-d1 {color:#000 !important;background-color:#fdd835 !important;}
.yellow-d2 {color:#000 !important;background-color:#fbc02d !important;}
.yellow-d3 {color:#000 !important;background-color:#f9a825 !important;}
.yellow-d4 {color:#000 !important;background-color:#f57f17 !important;}
.amber-l5 {color:#000 !important;background-color:#fff8e1 !important;}
.amber-l4 {color:#000 !important;background-color:#ffecb3 !important;}
.amber-l3 {color:#000 !important;background-color:#ffe082 !important;}
.amber-l2 {color:#000 !important;background-color:#ffd54f !important;}
.amber-l1 {color:#000 !important;background-color:#ffca28 !important;}
.amber-d1 {color:#000 !important;background-color:#ffb300 !important;}
.amber-d2 {color:#000 !important;background-color:#ffa000 !important;}
.amber-d3 {color:#000 !important;background-color:#ff8f00 !important;}
.amber-d4 {color:#000 !important;background-color:#ff6f00 !important;}
.orange-l5 {color:#000 !important;background-color:#fff3e0 !important;}
.orange-l4 {color:#000 !important;background-color:#ffe0b2 !important;}
.orange-l3 {color:#000 !important;background-color:#ffcc80 !important;}
.orange-l2 {color:#000 !important;background-color:#ffb74d !important;}
.orange-l1 {color:#000 !important;background-color:#ffa726 !important;}
.orange-d1 {color:#000 !important;background-color:#fb8c00 !important;}
.orange-d2 {color:#000 !important;background-color:#f57c00 !important;}
.orange-d3 {color:#fff !important;background-color:#ef6c00 !important;}
.orange-d4 {color:#fff !important;background-color:#e65100 !important;}
.deep-orange-l5 {color:#000 !important;background-color:#fbe9e7 !important;}
.deep-orange-l4 {color:#000 !important;background-color:#ffccbc !important;}
.deep-orange-l3 {color:#000 !important;background-color:#ffab91 !important;}
.deep-orange-l2 {color:#000 !important;background-color:#ff8a65 !important;}
.deep-orange-l1 {color:#000 !important;background-color:#ff7043 !important;}
.deep-orange-d1 {color:#fff !important;background-color:#f4511e !important;}
.deep-orange-d2 {color:#fff !important;background-color:#e64a19 !important;}
.deep-orange-d3 {color:#fff !important;background-color:#d84315 !important;}
.deep-orange-d4 {color:#fff !important;background-color:#bf360c !important;}
.brown-l5 {color:#000 !important;background-color:#efebe9 !important;}
.brown-l4 {color:#000 !important;background-color:#d7ccc8 !important;}
.brown-l3 {color:#000 !important;background-color:#bcaaa4 !important;}
.brown-l2 {color:#fff !important;background-color:#a1887f !important;}
.brown-l1 {color:#fff !important;background-color:#8d6e63 !important;}
.brown-d1 {color:#fff !important;background-color:#6d4c41 !important;}
.brown-d2 {color:#fff !important;background-color:#5d4037 !important;}
.brown-d3 {color:#fff !important;background-color:#4e342e !important;}
.brown-d4 {color:#fff !important;background-color:#3e2723 !important;}
.blue-grey-l5 {color:#000 !important;background-color:#eceff1 !important;}
.blue-grey-l4 {color:#000 !important;background-color:#cfd8dc !important;}
.blue-grey-l3 {color:#000 !important;background-color:#b0bec5 !important;}
.blue-grey-l2 {color:#000 !important;background-color:#90a4ae !important;}
.blue-grey-l1 {color:#fff !important;background-color:#78909c !important;}
.blue-grey-d1 {color:#fff !important;background-color:#546e7a !important;}
.blue-grey-d2 {color:#fff !important;background-color:#455a64 !important;}
.blue-grey-d3 {color:#fff !important;background-color:#37474f !important;}
.blue-grey-d4 {color:#fff !important;background-color:#263238 !important;}
.grey-l5 {color:#000 !important;background-color:#fafafa !important;}
.grey-l4 {color:#000 !important;background-color:#f5f5f5 !important;}
.grey-l3 {color:#000 !important;background-color:#eeeeee !important;}
.grey-l2 {color:#000 !important;background-color:#e0e0e0 !important;}
.grey-l1 {color:#000 !important;background-color:#bdbdbd !important;}
.grey-d1 {color:#fff !important;background-color:#757575 !important;}
.grey-d2 {color:#fff !important;background-color:#616161 !important;}
.grey-d3 {color:#fff !important;background-color:#424242 !important;}
.grey-d4 {color:#fff !important;background-color:#212121 !important;}
.black-l5 {color:#fff !important;background-color:#555 !important;}
.black-l4 {color:#fff !important;background-color:#444 !important;}
.black-l3 {color:#fff !important;background-color:#333 !important;}
.black-l2 {color:#fff !important;background-color:#222 !important;}
.black-l1 {color:#fff !important;background-color:#111 !important;}
.red {color:#fff !important;background-color:#F44336 !important;}
.pink {color:#fff !important;background-color:#e91e63 !important;}
.purple {color:#fff !important;background-color:#9c27b0 !important;}
.deep-purple {color:#fff !important;background-color:#673ab7 !important;}
.indigo {color:#fff !important;background-color:#3f51b5 !important;}
.blue {color:#fff !important;background-color:#2196F3 !important;}
.light-blue {color:#000 !important;background-color:#03a9f4 !important;}
.cyan {color:#000 !important;background-color:#00bcd4 !important;}
.teal {color:#fff !important;background-color:#009688 !important;}
.green {color:#000 !important;background-color:#4CAF50 !important;}
.light-green {color:#000 !important;background-color:#8bc34a !important;}
.lime {color:#000 !important;background-color:#cddc39 !important;}
.yellow {color:#000 !important;background-color:#ffeb3b !important;}
.amber {color:#000 !important;background-color:#ffc107 !important;}
.orange {color:#000 !important;background-color:#ff9800 !important;}
.deep-orange {color:#fff !important;background-color:#ff5722 !important;}
.brown {color:#fff !important;background-color:#795548 !important;}
.blue-grey {color:#fff !important;background-color:#607d8b !important;}
.grey {color:#000 !important;background-color:#9e9e9e !important;}
.light-grey {color:#000 !important;background-color:#eeeeee !important;}
.black {color:#fff !important;background-color:#000 !important;}
.white {color:#000 !important;background-color:#fff !important;}
.w3-text-black,.text-black {color:#000 !important;}
.w3-text-white,.text-white {color:#fff !important;}
.w3-text-blue {color:#2196F3 !important;}
.w3-text-blue-grey {color:#607d8b !important;}
.w3-text-cyan {color:#0097a7 !important;}
.w3-text-dark-grey {color:#616161 !important;}
.w3-text-deep-orange {color:#ff5722 !important;}
.w3-text-deep-purple {color:#673ab7 !important;}
.w3-text-grey {color:#616161 !important;}
.w3-text-indigo {color:#1a237e !important;}
.w3-text-orange {color:#ff9800 !important;}
.w3-text-pink {color:#e91e63 !important;}
.w3-text-purple {color:#9c27b0 !important;}
.w3-text-red {color:#F44336 !important;}
.w3-text-teal {color:#009688 !important;}
.w3-text-yellow {color:#ffeb3b !important;}
.w3-text-light-blue {color:#03a9f4 !important;}
.w3-text-green {color:#4CAF50 !important;}
.w3-text-light-green {color:#8bc34a !important;}
.w3-text-amber {color:#ffc107 !important;}
.w3-text-brown {color:#795548 !important;}
.w3-text-light-blue {color:#03a9f4 !important;}



/*Banner*/
#header{background:url(sn-bilder/hintergrund3.jpg) no-repeat left top; height:150px;background-color: #c5d8e2;margin-top:0em; position: relative;}

#sn {color: white; position: absolute; bottom: 0px; left: 10px;}

@media all and (max-width:850px){
	.ueber{font-size: 0.70em;}
}
/* Navigation an größe anpassen */
@media all and (max-width:700px){
  body {font-size: 0.95em;}
}
@media all and (max-width:500px){
  body {font-size: 0.9em; margin-left: 0em; margin-top: 0em;}
  #sn {margin-left: 0.5em; font-size: 2em;}
}
@media all and (max-width:400px){
  body {font-size: 0.85em; margin-left: 0em; margin-top: 0em;}
  #sn {font-size: 1em;}
}

#logo{width:150px; height: 150px;}

.auswahl {
    font-weight: bold;
    padding: 1em;
    border: 1px black solid;
    margin: 2em;
    /* abgerundete Ecken */
    -moz-border-radius: 40px;
    -webkit-border-radius: 40px;
    border-radius: 40px;
    width: 255px;
    color: #2A2F42;
    }

.video {width: 90%;}
.video2 {width: 95%;}

.video70 {width: 40%;}

.LL {width: 100%;}
#clear {
  clear: both;
}

#feel {
  background-color: red;
  cursor: url("sn-bilder/schallkopf.cur"), crosshair;
  position: absolute;
  z-index: 1;
  height: 14%;
  width: 13%;
  top: 75%;
  left: 42%;
  opacity: 0;}

#rahmen{position: relative;}

.zvkbild{ width: 80%; cursor: url('sn-bilder/schallkopf.cur'), auto; position: relative;}
.bild{ width: 60%; cursor: url('sn-bilder/schallkopf.cur'), auto; position: relative;}
.bildperkussion{ width: 60%; cursor:grab; position: relative;}
.bildtheorie {width : 90%;}

.fast{background-color: red; cursor: url('sn-bilder/schallkopf.cur'), auto; opacity: 0; position: absolute; z-index: 1;}

#fast1 { height: 20%; width: 4.5%; top: 73%; left: 46%; transform: rotate(50deg); -ms-transform: rotate(50deg); /* IE 9 */ -webkit-transform: rotate(50deg); /* Chrome, Safari, Opera */}
#fast2 { height: 20%; width: 4.5%; top: 68%; left: 52%; transform: rotate(50deg); -ms-transform: rotate(50deg); /* IE 9 */ -webkit-transform: rotate(50deg); /* Chrome, Safari, Opera */}
#fast3 { height: 20%; width: 4.5%; top:70%; left: 47%; transform: rotate(140deg); -ms-transform: rotate(140deg); /* IE 9 */ -webkit-transform: rotate(140deg); /* Chrome, Safari, Opera */} 
#fast4 { height: 20%; width: 4.5%; top:68%; left: 39%; transform: rotate(140deg); -ms-transform: rotate(140deg); /* IE 9 */ -webkit-transform: rotate(140deg); /* Chrome, Safari, Opera */} 
#fast5 { height: 9%; width: 15%; top: 72%; left: 44%;}
#fast6 { height: 9%; width: 12%; top: 30%; left: 47%;}

.hintergrundbild {background:url(sn-bilder/fast-auswahl.jpg) 50% 50% no-repeat; background-size: cover; border: 2px solid black;}
.hintergrundpneu {background:url(sn-bilder/pneu-hintergrund.jpg) 50% 50% no-repeat; background-size: cover;}
.hintergrundpneu2 {background:url(sn-bilder/pneu-hintergrund2.jpg) 50% 50% no-repeat; background-size: cover;}

.g{color:#00bd00;}
.r{color:red;}

.perk { background-color: red; cursor: pointer; opacity: 0.3; position: absolute; z-index: 1; border: 2px solid black; border-bottom-left-radius: 30px; border-bottom-right-radius: 30px; border-top-left-radius: 30px; border-top-right-radius: 30px; height: 10%; width: 10%;}

#perk1 { top: 20%; left: 35%;}

#perk2 { top: 40%; left: 35%;}

#perk3 { top: 60%; left: 35%;}

#perk4 { top: 20%; left: 60%;}

#perk5 { top: 40%; left: 60%;} 

#perk6 { top: 60%; left: 60%;}

.pneu{ cursor: url("sn-bilder/schallkopf.cur"), crosshair; position: absolute; z-index: 1;}
.zvk{ cursor: url("sn-bilder/schallkopf.cur"), crosshair; position: absolute; z-index: 1; background-color: black; opacity: 0;}
.pneugesammt{position: absolute; z-index: 0; opacity: 0.5;}

#zvkl {cursor: url("sn-bilder/schallkopf.cur"); height: 15%; width: 7%; top: 23%; left: 53%;  border: 1px solid black; transform: rotate(65deg); -ms-transform: rotate(65deg);}
#zvkr {cursor: url("sn-bilder/schallkopf.cur"); height: 20%; width: 10%; top: 37%; left: 55%;  border: 1px solid black; transform: rotate(65deg); -ms-transform: rotate(65deg);}


#pneu1 { height: 23%; width: 14%; top: 19%; left: 33.5%;}
	
#pneu2 { height: 23%; width: 14%; top: 42%; left: 33.5%;}

#pneu3 { height: 23%; width: 8%; top: 28%; left: 25.5%; -ms-transform: skewY(-60deg); /* IE 9 */ -webkit-transform: skewY(-60deg); /* Safari */ transform: skewY(-60deg); /* Standard syntax */}
#pneu3text {-ms-transform: skewY(60deg); /* IE 9 */ -webkit-transform: skewY(60deg); /* Safari */ transform: skewY(60deg); /* Standard syntax */}

#pneu4 { height: 23%; width: 8%; top: 51%; left: 25.5%; -ms-transform: skewY(-60deg); /* IE 9 */ -webkit-transform: skewY(-60deg); /* Safari */ transform: skewY(-60deg); /* Standard syntax */}
#pneu4text {-ms-transform: skewY(60deg); /* IE 9 */ -webkit-transform: skewY(60deg); /* Safari */ transform: skewY(60deg); /* Standard syntax */}

#pneu5 { height: 23%; width: 14%; top: 19%; left: 54%;}

#pneu6 { height: 23%; width: 14%; top: 42%; left: 54%;}

#pneu7 { height: 23%; width: 8%; top: 28%; left: 68%; -ms-transform: skewY(60deg); /* IE 9 */ -webkit-transform: skewY(60deg); /* Safari */ transform: skewY(60deg); /* Standard syntax */}
#pneu7text {-ms-transform: skewY(-60deg); /* IE 9 */ -webkit-transform: skewY(-60deg); /* Safari */ transform: skewY(-60deg); /* Standard syntax */}

#pneu8 { height: 23%; width: 8%; top: 51%; left: 68%; -ms-transform: skewY(60deg); /* IE 9 */ -webkit-transform: skewY(60deg); /* Safari */ transform: skewY(60deg); /* Standard syntax */}
#pneu8text {-ms-transform: skewY(-60deg); /* IE 9 */ -webkit-transform: skewY(-60deg); /* Safari */ transform: skewY(-60deg); /* Standard syntax */}

.mmode {width: 70%;}

.ta {width: 90%;}