body { font-size: 10.5pt; line-height: 1.75em; font-family: Verdana, sans-serif, Arial; color: #000000; margin:0 auto; padding:0; } html { overflow-y: scroll; } .container { width: 100%; margin-top: 69px; margin-bottom: 55px; display: inline-block; } header { color: black; border-bottom: 1px solid #ccc!important; margin-bottom: 40px; overflow: hidden; display: block; margin:auto; } header img { max-width: 100%; width:100%; height: auto; animation: animations linear 50s infinite; } #content { display: inline-block; width:100%; } .section { padding: 0 6px; margin: 6px 0; float: left; width: 100%; text-align: center; overflow: auto; } .box_full { padding: 0 6px; margin: 6px 0; float: left; width: 100%; #height:400px; } .box { padding: 0 6px; margin: 6px 0; float: left; width: 49.99999%; } .box img { width: 100%; max-width: 400px; } .box_tree { padding: 0 6px; margin: 6px 0; float: left; width: 33.33333%; } .box_tree img { width: 100%; max-width: 400px; } chart { display: block; } .desc { padding: 15px; text-align: center; } text.highcharts-credits { display: none; } * { box-sizing: border-box; } table { border-collapse: collapse; width: 100%; empty-cells: hide; } table, td, th { border: 1px solid black; } th { height: 50px; } tr.color td{ background-color: lightgray; } footer { padding: 1em; color: white; background-color: #333; clear: left; text-align: center; position: fixed; z-index:1; left: 0; bottom: 0; width: 100%; } @keyframes animations { 0% {filter: hue-rotate(0deg);} 50% {filter: hue-rotate(180deg);} 100% {filter: hue-rotate(360deg);} } @media screen and (max-width: 1000px) { .box_tree { width: 100%; } } @media screen and (max-width: 800px) { .box { width: 100%; } .box_tree { width: 100%; } header img { max-width: initial; width:auto; height:120px; margin: 0 -250px; } footer { left: auto; bottom: auto; position: static; z-index:0; } .container { margin-bottom: 0px; } } smiley { font-size: 30px; line-height: 36px; width: 150px; display: inline-block; text-align: right; position: relative; } smiley::before { content: ''; display: inline-block; width: 36px; height: 36px; vertical-align: top; position: absolute; left: 0; } .positive { color: #5C5; } .positive::before { background: url(/images/positive.png); } .neutral { color: #555; } .neutral::before { background: url(/images/neutral.png); } .negative { color: #C55; } .negative::before { background: url(/images/negative.png); } input[type="checkbox"] { display: none; } input:checked + b { background: #DDF; } input + b { width: 70px; display: inline-block; color: #333; background: #eee; margin: 0 10px 10px 0; line-height: 30px; cursor: pointer; } header img, input + b { animation: animations linear 50s infinite; } iframe { display:block; width:100%; min-height:200px; max-width:1000px; float:none; margin:auto;" } .tooltip { display: inline-block; border-bottom: 1px dotted black; } .tooltip .tooltiptext { visibility: hidden; width: 200px; background-color: black; color: #fff; text-align: center; border-radius: 6px; padding: 5px 0; /* Position the tooltip */ position: absolute; z-index: 2; } .tooltip:hover .tooltiptext { visibility: visible; }