@font-face {
	font-family:'GeosansLight';
	src: url(../fonts/GeosansLight/GeosansLight.ttf) format('truetype');
}

body {
  font-family:GeosansLight, sans serif; font-size:14pt; font-weight:bold; color:#3C3C3C
}
#logo { margin:20pt 0 0 20pt; font-family:GeosansLight, sans serif; font-size:54px; font-weight:100; letter-spacing: -4px; color:#CCC;
}
/* Add this to your CSS file or inside a <style> tag */
#container .row {
  display: flex; /* make sure it's flex */
  align-items: flex-start;
}

.col-sm-3 ul {
  padding-left: 20px; /* less padding */
  list-style-type: none; /* maybe cleaner */
}

.col-sm-9 img {
  margin: 10px 10px 10px 10px; /* smaller margin */
  float: right; /* push images to the right within col */
  max-width: 100%; /* keep responsive */
  display: inline-block;
}

#container {position: absolute;
width:100%; 
height:50px;
	}


.text {position: absolute;
width:100%; 
height:50px; text-align:center;
	}

.flag1 {width:17%;
float:left;
    height:50px;
	margin:0 0 30px 0;
    background-color:#000000;
	
}
.flag2 {width:17%;
float:left;
    height:50px;
	margin:0 0 30px 0;
    background-color:#FAE7D0;
	}

.flag3 {width:16%;
float:left;
    height:50px;
	margin:0 0 30px 0;
    background-color:#000000;
	}

.flag4 {width:16%;
float:left;
    height:50px;
	margin:0 0 30px 0;
    background-color:#E8CDA8;
	}
.flag5 {width:17%;
float:left;
    height:50px;
	margin:0 0 30px 0;
    background-color:#000000;
	}

.flag6 {width:17%;
float:left;
    height:50px;
	margin:0 0 30px 0;
    background-color:#DFC183;

}
a { GeosansLight, sans serif; font-size:14pt; font-weight:300; color:#3C3C3C; text-decoration: none; }
a:hover { text-decoration: underline; color:#603}

ul li  {
	list-style-type: none;
	 }
	


/* CSS Document *