/*<link href="css.css" rel="stylesheet">*/
body {margin: 0;}

ul.topnav {list-style-type: none;margin: 0;padding: 0; overflow: hidden;
background-image: linear-gradient(to top, #09203f 0%, #537895 100%)!important;
   _background:#01395e url(img/assets/bg-shapes.svg) no-repeat 0% 50% / cover!important;
   font-weight: bold;
font-size: 18px;}

ul.topnav li {float: left;}

ul.topnav li a {
 display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  
   border-width: 1px;
}

ul.topnav li a:hover:not(.active) {background-image: -webkit-gradient(linear, left top, left bottom, from(#6f0235), to(#e50a70))!important;
  
  background-image: linear-gradient(to bottom, #6f0235 0%, orange 100%)!important;}

ul.topnav li a.active {background-color: green;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#6f0235), to(#e50a70))!important;
  background-image: linear-gradient(to bottom, #6f0235 0%, #e50a70 100%)!important;
}

ul.topnav li.right {float: right;}
ul li{
  
  float: left;
  width: 140px;
  font-size: 15px;
  margin-left:2px;
  margin-top: 3px;
}

@media screen and (max-width: 600px) {
  ul.topnav li.right, 
  ul.topnav li {float: none;}
}

.right {
  border: 2px solid yellow;
  border-radius: 20px;
  padding-left: 10px;
  padding: 0px;
   padding-right: 8px;
}


.col {
  float: left;
  width: 100%;
  padding: 0px;
}

.tete {
  display: grid;
  
  grid-template-columns: 1fr 1fr 1fr;
  

}