CSS up
This commit is contained in:
parent
7c3c8eb86f
commit
cf8e32b858
1 changed files with 123 additions and 65 deletions
154
css/style.css
154
css/style.css
|
@ -1,78 +1,136 @@
|
|||
/*
|
||||
* GENERAL
|
||||
*/
|
||||
|
||||
body {
|
||||
background-color: #B2E0E0;
|
||||
margin: 0 0;
|
||||
}
|
||||
|
||||
#left_field {
|
||||
#page {
|
||||
position: relative;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
.social {
|
||||
position: absolute;
|
||||
width: 30%;
|
||||
top: 15%;
|
||||
left: 5%;
|
||||
bottom: 1em;
|
||||
margin-left: 0;
|
||||
right: 1em;
|
||||
}
|
||||
|
||||
#intro_blurb {
|
||||
text-align: justify;
|
||||
|
||||
.social ul {
|
||||
list-style: none;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
#right_field {
|
||||
position: absolute;
|
||||
width: 30%;
|
||||
left:65%;
|
||||
top: 15%;
|
||||
.social ul li {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.menu_contents {
|
||||
text-align: center;
|
||||
.social ul li a {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
#main {
|
||||
position: absolute;
|
||||
width: 40%;
|
||||
left: 30%;
|
||||
top: 5%;
|
||||
/*
|
||||
* PANELS
|
||||
*/
|
||||
|
||||
#panel-landing {
|
||||
/*text-align: center;*/
|
||||
height: 25vh;
|
||||
|
||||
background-color: #FFF;
|
||||
}
|
||||
|
||||
#main_title h1 {
|
||||
text-align: center;
|
||||
#panel-resume {
|
||||
background-color: #EF5350;
|
||||
}
|
||||
|
||||
#main_mugshot {
|
||||
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
|
||||
border-radius: 150px;
|
||||
-webkit-border-radius: 150px;
|
||||
-moz-border-radius: 150px;
|
||||
|
||||
background: url(../images/me.jpg) no-repeat;
|
||||
background-position: center;
|
||||
background-size: 300px 300px;
|
||||
|
||||
#panel-projects {
|
||||
background-color: #42A5F5;
|
||||
}
|
||||
|
||||
.menu_title {
|
||||
text-align: center;
|
||||
|
||||
#panel-intouch {
|
||||
background-color: #66BB6A;
|
||||
}
|
||||
|
||||
.menu_contents {}
|
||||
|
||||
.centered {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
/*
|
||||
* LANDING PANEL
|
||||
*/
|
||||
|
||||
#greet {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.social_icon:link {
|
||||
#landing-blurb {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#main-menu {
|
||||
margin-left:3em;
|
||||
}
|
||||
|
||||
#main-menu ul {
|
||||
list-style: none;
|
||||
margin-left:-2.3em;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
#main-menu ul li {
|
||||
display: inline;
|
||||
margin: 0 1em;
|
||||
}
|
||||
|
||||
#main-menu ul li a {
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.social_icon:visited {
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
#main-menu ul li a:hover {
|
||||
color: #ff0000;
|
||||
}
|
||||
|
||||
.invisible { display: none; }
|
||||
|
||||
/*
|
||||
* RESUME PANEL
|
||||
*/
|
||||
|
||||
#panel-resume .fp-tableCell {
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
#resume-skills {
|
||||
float:left;
|
||||
}
|
||||
|
||||
#resume-skills ul {
|
||||
list-style: none;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#resume-skills ul li {
|
||||
}
|
||||
|
||||
/*
|
||||
* MODIFIERS
|
||||
*/
|
||||
|
||||
.fs-5 { font-size: 3em; }
|
||||
.fs-1-3 { font-size: 1.3em; }
|
||||
|
||||
.bold { font-weight: bold; }
|
||||
|
||||
.pos-abs { position: absolute; }
|
||||
|
||||
.mt-z { margin-top: 0; }
|
||||
|
||||
.mb-z { margin-bottom: 0; }
|
||||
|
||||
.vcenter {
|
||||
top: 40vh;
|
||||
position: relative;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.red { color: #ff0000; }
|
Loading…
Reference in a new issue