main.css

*{margin:0}body{font-family:sans-serif;background-color:#eee;color:#222;background-image:url('images/bg.png')}div{margin-bottom:7.5%}hr{margin-bottom:15%;height:3px;background-color:black;border:none}#container{width:100%}#hamburger{position:fixed;top:25px;right:25px;height:125px;width:125px}#navContainer{position:fixed;background-color:lightgrey;opacity:0.9;height:135px;width:100%;top:0}#hamburger div{height:25px;width:125px;background:grey}#navigation ul{list-style-type:none;background-color:lightgrey;padding:0}#navigation ul li{width:100%;height:100px;font-size:3em;background-color:lightgrey;padding:1em}#navigation ul li a{text-decoration:none;color:black}#background{background:url('http://patterncooler.com/gen/index/w/simple_moroccan_tiles_pattern-1018.jpg');padding-top:15%;padding-bottom:7.5%}#logo-holder{width:100%;display:block;margin-bottom:10%}#logo{width:11em;height:11em;margin-left:auto;margin-right:auto;text-align:center;font-size:2em;background-color:#641BE3;color:#eee;border-radius:50%;margin-bottom:0}#logo h1{position:relative;top:35%;font-size:1.65em}#logo-holder #logo{width:10em;height:10em;font-size:1em;position:absolute;left:550px}#logo-holder #logo h1{top:40%}#faces{padding-top:1em;padding-bottom:1em;margin-bottom:2em;border-radius:7%}#faces img{padding-left:2%;padding-right:2%;width:20%;border-radius:7%}#intro{padding:0%,10%}#intro h1{font-size:4em;text-align:center}#intro p{font-size:3em;padding:8%;line-height:1.3em;word-spacing:0.4em}.hidden{display:none}.profile{width:90%;height:auto;margin-left:auto;margin-right:auto;border:solid maroon 1px;background:maroon;color:white}.profile p{padding:1em;font-size:2.5em}p{text-align:justify}.page-link{margin-bottom:8%;border-bottom:solid 1px black}.page-link a{text-decoration:none;color:#262626;font-size:3.2em}#carousel-container,#main-blog-container{width:80%;margin-left:auto;margin-right:auto;padding:5%;overflow:auto}#main-blog-container{width:95%;padding:0;margin-top:10%}#blog-h1{margin-bottom:8%;font-size:5em}.main-blog{width:40%;margin-left:5%;float:left;padding:10px;background-color:white}.mini-blog,.mini-project{width:100%;background-color:white;display:none}.mini-blog:nth-of-type(2),.mini-project:nth-of-type(2){display:block}.main-blog,.mini-blog,.mini-project{text-align:center;margin-bottom:10%;border:solid black 1px;box-shadow:15px 15px 10px rgba(10,10,10,0.5)}.carousel .left-arrow{width:5%;height:5%;content:url('https://cdn3.iconfinder.com/data/icons/arrows/16/arrow__chevron-big-circle-3-01-512.png')}.carousel .right-arrow{width:5%;height:5%;content:url('https://cdn3.iconfinder.com/data/icons/arrows/16/arrow__chevron-big-circle-4-01-512.png')}.main-blog .title,.mini-blog .title,.mini-project .title{font-size:4em;text-align:center;padding-bottom:1em}.main-blog .picture-background,.mini-blog .picture-background,.mini-project .picture-background{width:90%}.main-blog p,.mini-blog p,.mini-project p{padding:5%}.snippet-content{font-size:2em}.read-more{margin-left:auto;color:#e6e6e6;background-color:#262626;border-radius:7%;padding:1%}.main-profile h2{padding-bottom:5em}#profiles{clear:both}.profile-img{width:20%;float:left;border-radius:7%}.main-profile h3{float:left;padding-left:5%}.main-profile p{width:70%;float:left;padding-left:5%}.linkit{clear:left}@media screen and (min-width:1000px){#navContainer{position:absolute;top:0;left:0;opacity:1;height:auto;margin:0;background-color:#2f2f2f;opacity:0.9;padding:10px 0}#navigation{display:inline;background-color:#2f2f2f}#navigation ul{background-color:#2f2f2f;text-align:right}#navigation ul li{display:inline;font-size:2em;background-color:#2f2f2f;padding:0 20px}#navigation ul li a{text-decoration:none}#navigation ul li a{color:white;text-decoration:none}#hamburger{display:none}#background{margin-top:0;padding-top:0;height:90vh}#logo{position:absolute;top:75px;left:500px;height:10.5em;width:10.5em;font-size:1.6em;text-align:center}#logo h1{font-size:1.6em;position:relative;top:100px}#intro{position:absolute;top:250px;font-size:0.75em;color:white}#overlay{height:90%;background-color:black;margin-top:4.4%;padding-bottom:12.5%;opacity:0.5}#carousel-container{padding:0;display:inline-block;width:100%;font-size:0.5em}#blog-carousel{margin-left:5%;float:left;width:40%}#project-carousel{margin-right:5%;float:right;width:40%}.mini-blog .picture-background,.mini-project .picture-background{height:60%;width:60%}}