body{background-color: #030714;color: #fff;font-family: Verdana, Geneva, sans-serif;}
a{color: #fff; font-size: 1.5ex;}
header, footer{text-align: center;}
.title{margin: auto; margin-bottom: 1rem; font-size: 1em; max-width: 70rem;}
header img { width: max-content;}
.benefits{ display: flex; flex-wrap: wrap; gap: 1ex; align-items: center; justify-content: center;}
.benefits ul{max-width: 20rem;}
.benefits img{width: 100%; max-width:470px; height: min-content;}
video{width: 100%; max-width: 640px; height: auto;}
h1 img{width: 100%; max-width: 590px; height: auto;}
.track{display: flex; margin: 1rem 0;}
.track img {float: left; margin-right: 1rem;}
.track ul {width: fit-content;}
.track li{line-height: 3rem; }
.track p{ max-width: 20rem;}
.netimg{background-color: #FFC457; padding: 5px; 
	-moz-border-radius: 10px; -webkit-border-radius: 10px; -khtml-border-radius: 10px; border-radius: 10px; 
	width: 100%; max-width: 367px; height: auto;}
.stockitweb{text-align: justify; max-width: 60rem; margin: auto;}
.bullet li{list-style-type: circle;}
.network img{float: right;}
.network{max-width: 50%;}
.track-network{display: flex; flex-wrap: wrap; justify-content: space-around; clear: both;}
.infor{position: relative; display: list-item; border-bottom: 1px dotted wheat;}
.infor::before{
    content: attr(data-text); position: absolute; width: max-content;
    top: 50%; transform: translateY(-25%); line-height: normal;
    left: 100%; margin-left: 15px; padding: 5px; border-radius: 5px; background: blue; display: none;
}
.infor::after{ content: ""; position: absolute; left:100%; margin-left: -5px; display: none;
    top:50%; border:10px solid #000; border-color: transparent blue transparent transparent; }
.infor:hover::before, .infor:hover::after{display: block;}
