html, body{
	width:100%;
	margin:0px;
	padding:0px;
  background: rgba(255,255,255,1);
}
 #container{
   width: 100%;
   height: auto;
   margin:0px;
   padding:0px:
 }
 #content{
   width: 100%;
   height: auto;
   margin:0px;
   padding:0px:
 }
 .logo{
   width:20%;
   float: left;
   margin-left: 40%;
   margin-right: 40%;
   margin-top: 300px;
 }
 h1.conutryListTitle{
   width: 20%;
   float: left;
   margin-left: 40%;
   font-family: 'Barlow Condensed', sans-serif;
   color: rgba(0,0,0,0.4);
   text-transform: uppercase;
   margin-bottom: 10px;
   margin-top:20px;
   text-align:center;
 }
 ul.countryList{
   width: 20%;
   float: left;
   padding:0px;
   margin:0px;
   margin-left: 40%;
   margin-right: 40%;
   margin-top: 10px;
   list-style: none;
 }

 ul li.countryListItem{
   width: 100%;
   text-align: center;
 }

 li.countryListItem a{
   width: 100%;
   text-align: center;
   text-decoration: none;
   text-transform: uppercase;
   font-size: 2em;
   font-family: 'Barlow Condensed', sans-serif;
   color: rgba(0,0,0,0.2);
   transition: 1s;
 }
 li.countryListItem a:hover {
   transition: 0.8s;
   color: rgba(0,0,0,0.8)
 }