@font-face {
  font-family: 'Conv_geometrialight';
  src: url('fonts/geometrialight.eot');
  src: local('☺'), url('fonts/geometrialight.woff') format('woff'), url('fonts/geometrialight.ttf') format('truetype'), url('fonts/geometrialight.svg') format('svg');
  font-weight: normal;
  font-style: normal;
  }
  
  
  body {
  font-family: 'Conv_geometrialight';
  background-color:#e8e8e8;
  margin: auto;
  text-align: center;
  }
  
  
  h1 {
  font-size: 180%;
  display:inline-block;
  border-bottom: 1px solid black;
  padding-bottom: 4px;
  margin-bottom: 0.2em;
  margin-top: 1.2em;
  }
  
  h2 {
  font-size: 120%;
  }
  
  .portrait{
  margin: 30px;
  width: 250px;
  
  }
  
   .circles {
   width: 170px;
    }
  
  
  .download  {
  background-image: url(assets/button-01.svg);
  background-repeat: no-repeat;
  background-position:center;
  margin: 30px;
  padding: 20px;
  font-size: 1.4em;
  }
  
  .download a  {
  color: #fff;
  text-decoration: none;
  }
  
  #skills {
  margin-top: 50px;
  padding-top: 20px;
  background-color: #FFF;
  width: 100%;
  height: 14em;
  }
  
  #skills div {
  float: left;
  width: 33%;
  }
  
  
  #footer {
  margin: 2em;
  font-size: 1.2em;
  }
	
  #footer a {
  color: #000000;
  text-decoration: underline;
  font-weight: bold;
  }
  

 #text {

  margin: 60px !important;
  
  }


@media screen and (max-width : 600px)  {

	
  #skills {
  height: auto;
  padding-bottom: 0.4em;
  }
  
	
 #skills div {
  float: none;
  width: 100%;
  }
  
 .portrait{
  margin: 15px;
  width: 65%;
  }
  
  h1 {
  margin-top: 0.9em;
  }
  
  .circles {
  width: 60%;
    }
	

  
}