Last active
September 2, 2015 15:07
-
-
Save Socratic1/58156d2a3545c7ed2c56 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
body { | |
position: relative; | |
height: 100%; | |
} | |
/* navbar */ | |
.projectName > a { | |
padding-left: 1.8em; | |
padding-top: .5em; | |
display: inline-block; | |
position: relative; | |
font-size: 1.5em; | |
text-transform: uppercase; | |
letter-spacing: 0.05em;text-decoration: none; | |
} | |
.nav { | |
float: right; | |
} | |
.navbar-inverse .navbar-nav > li > a { | |
color: #000; | |
} | |
.navbar-inverse .navbar-nav > li > a:hover, | |
.navbar-collapse .navbar-nav > li > a:focus { | |
color: #8e4600; /*Sets the text hover color on navbar*/ | |
} | |
.navbar-collapse .navbar-nav .active > a, | |
.navbar-collapse .navbar-nav > .active > a:hover, | |
.navbar-collapse .navbar-nav > .active > a:focus { | |
color: #8e4600; | |
background-color: #f39f4c; | |
} | |
.navbar-collapse a { | |
text-transform: uppercase; | |
letter-spacing: 0.05em; | |
padding-right: 1em; | |
transition: color 300ms; | |
-webkit-transition: color 300ms; | |
text-decoration: none; | |
} | |
.navbar { | |
background: -webkit-linear-gradient(left, rgba(0, 0, 0, .90) , rgba(241, 145, 50, .90)); /* For Safari 5.1 to 6.0 */ | |
background: -o-linear-gradient(right, rgba(0, 0, 0, .90) , rgba(241, 145, 50, .90)); /* For Opera 11.1 to 12.0 */ | |
background: -moz-linear-gradient(right, rgba(0, 0, 0, .90) , rgba(241, 145, 50, .90)); /* For Firefox 3.6 to 15 */ | |
background: linear-gradient(to right, rgba(0, 0, 0, .90) , rgba(241, 145, 50, .90)); /* Standard syntax */ | |
position: fixed; | |
width: 100%; | |
top: 0; | |
padding: ; | |
z-index: 1; | |
border-bottom: 0px; | |
} | |
/* carousel */ | |
#carousel { | |
padding-left: 0px; | |
padding-right: 0px; | |
} | |
.carousel-image { | |
height: 100%; | |
} | |
.carousel-caption h1 { | |
padding-bottom: 130px; | |
} | |
.carousel-caption p { | |
padding-bottom: 40px; | |
} | |
/* Info section at top */ | |
.tooltip .tooltip-inner { | |
background-color: #8e4600; | |
} | |
.tooltip.bottom .tooltip-arrow { | |
top: 0; | |
left: 50%; | |
margin-left: -5px; | |
border-bottom-color: #8e4600; | |
border-width: 0 5px 5px; | |
} | |
.tooltip.top .tooltip-arrow { | |
bottom: 0; | |
right: 50%; | |
margin-right: -5px; | |
border-top-color: #8e4600; | |
border-width: 5px 5px 0px; | |
} | |
/* About */ | |
.about-header { | |
padding-left: 12.7em; | |
padding-right: 9em; | |
} | |
.more-information { | |
text-align: left; | |
float: left; | |
display: inline-block; | |
} | |
/* CV Modal (see bottom of body); In ABOUT */ | |
.modal-button { | |
float: right; | |
display: inline-block; | |
margin-top: 100px; | |
} | |
.modal-backdrop.in { | |
z-index: -1; | |
} | |
.modal-body { | |
height: 500px; | |
} | |
#CV-modalframe { | |
padding: 10px; | |
width: 100%; | |
height: 100%; | |
} | |
.CV-close { | |
position: relative; | |
bottom: .84em; | |
} | |
/* ABOUT continued */ | |
#about-container { | |
width: 80%; | |
margin: 0 auto; | |
} | |
.about-image { | |
display: inline-block; | |
float: left; | |
padding-top: 8px; | |
} | |
.about-image > img { | |
height: auto; | |
width: auto; | |
max-width: 400px; | |
max-height: 400px; | |
} | |
.about-column { | |
display: inline-block; | |
width: 30%; | |
padding: 0 50px; | |
} | |
.about-intro { | |
float: left; | |
} | |
.about-skills { | |
display: inline-block; | |
float: right; | |
background-color: #5ad4c2; | |
color: #fff; | |
} | |
#about-skill-list { | |
margin-left: 40px; | |
} | |
.about-main-text { | |
clear: both; | |
padding-top: 60px; | |
} | |
.about-video { | |
width: 560px; | |
padding-top: 2em; | |
margin-left: auto; | |
margin-right: auto; | |
} | |
#about > .row { | |
margin-top: 2em; | |
} | |
#about th { | |
padding: .2em 0; | |
} | |
/* Contact */ | |
#contact-container { | |
width: 90%; | |
position: relative; | |
} | |
.contact-column { | |
margin-left: 5%; | |
} | |
.contact-intro { | |
position: relative; | |
} | |
.contact-intro p { | |
margin: .37%; | |
} | |
#contact-sentence-2 { | |
margin-left: 3em; | |
font-weight: bold; | |
font-style: italic; | |
} | |
#contact-sentence-3 { | |
margin-left: 6em; | |
} | |
.contact-info { | |
display: inline-block; | |
position: relative; | |
color: black; | |
background-color: #dddddd; | |
padding-left: 1.5em; | |
padding-right: 2.5em; | |
height: 742px; | |
} | |
.contact-email { | |
margin-top: 3.5em; | |
} | |
.address { | |
margin-top: 3.5em; | |
} | |
.pigeon { | |
margin-top: 7em; | |
} | |
.thanks { | |
position: absolute; | |
bottom: 2em; | |
} | |
@media (min-width: 1200px) { | |
.contact-image { | |
position: absolute; | |
top: 8em; | |
right: 0; | |
display: inline-block; | |
} | |
.contact-form { | |
margin-left: 3.8%; | |
}; | |
} | |
@media (max-width: 1199px) { | |
.contact-image { | |
display: none; | |
} | |
} | |
label { | |
margin-top: 15px; | |
} | |
.contact-button { | |
margin-top: 10px; | |
} | |
.btn:hover { | |
background-color: lightblue; | |
} | |
#character-count { | |
position: relative; | |
left: 40em; | |
display: inline-block; | |
margin-top: 0px; | |
} | |
.map { | |
width: 600px; | |
height: 410px; | |
margin-left: 741px; | |
position: relative; | |
top: 54em; | |
left: .31em; | |
} | |
#map-canvas { | |
transform: none !important; | |
} | |
/* Work */ | |
#work { | |
padding: 0; | |
} | |
#work > #work-parallax { | |
background-image: url("../img/parallax_image.jpg"); | |
background-attachment: fixed; | |
background-size: cover; | |
padding: 300px; | |
padding-top: 10px; | |
height: 100%; | |
width: 100%; | |
position: relative; | |
} | |
.work-image { | |
box-sizing: border-box; | |
border: 2px solid pink; | |
width: 200px; | |
height: 200px; | |
margin: 40px 0px; | |
display: inline-block; | |
position: relative; | |
} | |
.work-info { | |
display: inline-block; | |
color: #fff; | |
font-family: Futura; | |
text-transform: uppercase; | |
font-weight: 700; | |
letter-spacing: 0.5em; | |
line-height: 1.6; | |
position: absolute; | |
top: 15%; | |
left: 22%; | |
} | |
.work-proj-title { | |
font-weight: 100; | |
color: orange; | |
position: absolute; | |
} | |
#work > #Work1 { | |
background-image: url("../img/work1.jpg"); | |
background-attachment: fixed; | |
background-size: cover; | |
padding: 300px; | |
height: 920px; | |
width: 100%; | |
position: relative; | |
} | |
#work > #Work2 { | |
background-image: url("../img/work2.jpg"); | |
background-attachment: fixed; | |
background-size: cover; | |
padding: 300px; | |
padding-top: 100px; | |
height: 920px; | |
width: 100%; | |
position: relative; | |
} | |
/* FAQ */ | |
#faq { | |
height: 100%; | |
} | |
#faq-container { | |
width: 90%; | |
} | |
.panel > .panel-heading { | |
position: relative; | |
} | |
.panel > .panel-heading-1 { | |
background: #0D370D; | |
background-image: url("../img/faq-panel-1.jpg"); | |
background: linear-gradient(to right, rgba(13, 55, 13, .8), rgba(0, 0, 0, 0)), url("../img/faq-panel-1.jpg"),; | |
background: -moz-linear-gradient(right, rgba(13, 55, 13, .8), rgba(0, 0, 0, 0)), url("../img/faq-panel-1.jpg"),; | |
background: -o-linear-gradient(right, rgba(13, 55, 13, .8), rgba(0, 0, 0, 0)), url("../img/faq-panel-1.jpg"),; | |
background: -webkit-linear-gradient(left, rgba(13, 55, .8), rgba(0, 0, 0, 0)), url("../img/faq-panel-1.jpg"),; | |
} | |
.panel > .panel-heading-2 { | |
background: #0D370D; | |
background-image: url("../img/faq-panel-2.jpg"); | |
background: linear-gradient(to right, rgba(13, 55, 13, .8), rgba(0, 0, 0, 0)), url("../img/faq-panel-2.jpg"),; | |
background: -moz-linear-gradient(right, rgba(13, 55, 13, .8), rgba(0, 0, 0, 0)), url("../img/faq-panel-2.jpg"),; | |
background: -o-linear-gradient(right, rgba(13, 55, 13, .8), rgba(0, 0, 0, 0)), url("../img/faq-panel-2.jpg"),; | |
background: -webkit-linear-gradient(left, rgba(13, 55, .8), rgba(0, 0, 0, 0)), url("../img/faq-panel-2.jpg"),; | |
} | |
.panel > .panel-heading-3 { | |
background: #0D370D; | |
background-image: url("../img/faq-panel-3.jpg"); | |
background: linear-gradient(to right, rgba(13, 55, 13, .8), rgba(0, 0, 0, 0)), url("../img/faq-panel-3.jpg"),; | |
background: -moz-linear-gradient(right, rgba(13, 55, 13, .8), rgba(0, 0, 0, 0)), url("../img/faq-panel-3.jpg"),; | |
background: -o-linear-gradient(right, rgba(13, 55, 13, .8), rgba(0, 0, 0, 0)), url("../img/faq-panel-3.jpg"),; | |
background: -webkit-linear-gradient(left, rgba(13, 55, .8), rgba(0, 0, 0, 0)), url("../img/faq-panel-3.jpg"),; | |
} | |
.panel-body { | |
background-color: #dddddd; | |
} | |
/* footer */ | |
.footer { | |
padding-bottom: .5em; | |
} | |
.copyright { | |
display: inline-block; | |
padding-bottom: .5em; | |
} | |
.copyright > h6 { | |
margin: 0px; | |
padding: 0px; | |
position: absolute; | |
left: 1em; | |
} | |
.fb-like { | |
position: absolute !important; | |
width: 200px !important; | |
right: 3em; | |
display: inline-block; | |
} | |
.fblike { | |
width: 200px !important; | |
} | |
.twitter { | |
position: absolute; | |
right: 1em; | |
display: inline-block; | |
} | |
/* typography */ | |
.projectName > a { | |
color: white; | |
} | |
h1 { | |
color: #F19132; | |
font-size: 4em; | |
text-shadow: 2px 0 #603a14, 0 1px #603a14, 1px 0 #603a14, 0 -1px #603a14; | |
font-family: 'Lobster', Futura, Helvetica, Arial, cursive; | |
} | |
.carousel-caption > p { | |
color: #F19132; | |
font-size: 2em; | |
text-shadow: 1px 0 #603a14, 0 0px #603a14, 0px 0 #603a14, 0 -1px #603a14; | |
font-family: 'Roboto Condensed', sans-serif; | |
} | |
h2 { | |
text-align: center; | |
margin-bottom: 50px; | |
margin-top: 100px; | |
font-family: Oswald, Futura, Helvetica, Arial, sans-serif; | |
font-size: 2em; | |
font-weight: 100; | |
} | |
p { | |
font-family: Georgia, Cambria, serif; | |
font-size: 150%; | |
} | |
h3 { | |
font-family: Oswald, Futura, Helvetica, Arial, sans-serif; | |
} | |
#about h3 { | |
font-size: 3em; | |
font-weight: 100; | |
-webkit-margin-before: 0em; | |
} | |
#contact h3 { | |
font-size: 2em; | |
padding-left: 2.5em; | |
padding-top: .6em; | |
word-spacing: .4em; | |
} | |
#character-count { | |
font-size: 1em; | |
} | |
.panel-title { | |
color: white; | |
} | |
.panel-body { | |
font-style: italic; | |
font-family: Georgia, Cambria, serif; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment