/* Box Model Hack */
* {
  box-sizing: border-box;
}

/* Clear fix hack */
.clearfix:after {
     content: ".";
     display: block;
     clear: both;
     visibility: hidden;
     line-height: 0;
     height: 0;
}

.clear {
	clear: both;
}
html {
     font-size: 62.5%;
}

/******************************************
/* BASE STYLES
/*******************************************/

body {
     margin: 1%;
}


/******************************************
/* LAYOUT
/*******************************************/
header, main, .right, .bottom {
     width: 10%;
     float: left;
}
header *, img {
     display: block;
}
main {
     width:59%;
}
.right {
     width: 30%;
}

.bottom {
     width: 100%;

}
* {
     font-family: "Source Sans Pro", "Helvetica", sans-serif;
}
h1 {
     font-weight: 900;
     font-size: 5rem;
     margin: 0;
}
h2 {
     font-weight: 900;
     font-size: 3rem;
     margin: 0;
}

p,a,label,span  {
     font-size: 2rem;
}


/******************************************
/* Header
/*******************************************/
header {
     padding: 10px;
}
nav * {
     list-style: none;
     text-decoration: none;
     margin: 0;
     padding: 0;
     color: #acacac;
}
nav > * {
     margin: 0 10%;
}
nav > ul > li {
     margin: 10px 0;
}
nav > img {
     width: 40%;
}
nav > a {
     font-size: 1.5rem;
}
nav > a:first-of-type {
     margin-top: 10px;
     margin-bottom: 5px;
     color: orange;
     font-weight: 800;
}
nav > form {
     margin-top: 20px;
}
nav i {
     font-size: 1.5rem;
}


/******************************************
/* Main
/*******************************************/
main span:first-of-type {
     color: #e6b15f;
     font-weight: 800;
     font-size: 1.5rem;
}
main .name, main span:last-of-type {
     display: block;
     font-size: 1.5rem;
     font-weight: bold;
     padding: 5px 0;
}
main p {
     color: #a6a6a6;
     padding: 0;
     margin: 0;
}
main img {
     width: 100%;
}
main span:last-of-type {
     padding-top: 2%;
     font-weight: 900;
     border-bottom: 0.5px solid #cfd7e1;
}



/******************************************
/* Right
/*******************************************/
.right > * {
     margin: 7%;
}
.right span {
     display: block;
     margin-top: 10px;
     font-size: 1.5rem;
     padding: 5px 0;
     border-bottom: 0.5px solid #abb3bd;
}
.right > section:last-of-type span {
     border-bottom: 0px solid #abb3bd;
}
.right > section:hover {
     color: rgba(66, 66, 66, 0.47);
}


/******************************************
/* Bottom
/*******************************************/
.bottom > section {
     float:left;
     width: 30%;
}
.bottom > section:first-of-type {
     width: 10%;
}
.bottom img {
     width: 100%;
}
.bottom section {
     padding: 2% 5% 2% 0;
     margin: 0;
}
.bottom p {
     margin: 0;
     color: #a6a6a6
}
.bottom span {
     display: block;
     font-size: 1.5rem;
     font-weight: 800;
}
.bottom span:last-of-type {
     color: #a6a6a6;
     font-weight: 700;
}
.bottom span:first-of-type {
     padding-top: 10px;
}


/******************************************
/* ADDITIONAL STYLES
/*******************************************/
@media screen and (max-width: 1200px){
     p,a,label,span  {
          font-size: 1.5rem;
     }
     h2 {
          font-size: 2rem;
     }
}
