:root {
	/* main color palette */
	--tan:#DFBBAE;
	--dark-tan:#D2A590;
	--dark-gray:#2A4250;
	--thistle:#ECD8D8;
	--light-gray:#8A8791;
}

html, body {
	height: 100%;
	width: 100%;
	font-family: 'Roboto', sans-serif;
	color: black;
	max-width: 100% !important;
}

/*main padding style applied to many divs*/
.padding {
	padding-bottom: 1.5rem;
}

/* navbar styles */
.navbar {
	background: var(--dark-gray);
	padding: 0.5rem;
}

.navbar-brand {
	font-family: 'Roboto Condensed', sans-serif;
	color: white;
	font-size: 1.6em;
}

a.nav-link {
	font-family: 'Roboto Condensed', sans-serif;
	color: white;
	font-size: 1.1em;
	margin-right: 1rem;
}

a.nav-link:hover {
	color: var(--light-gray);
}

.icon-bar {
	color: white;
}

.navbar-collapse {
	padding-left: 50vh;
}

/* section specific styles */
header {
	height: 100%;
	width: 100%;
	font-family: 'Roboto Condensed', sans-serif;
	padding-top: 10rem;
}

header h1 {
	font-size: 3.3em;
	font-weight: bold;
	color: var(--dark-gray);
}

#about {
	width: 80%;
	height: 100%;
	padding-top: 4rem;
	height: auto;
}

#about-me {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 2.5em;
}

#about button {
	margin-right: 0.5em;
	margin-bottom: 0.5em;
}

/* portrait found in about section */
.portrait-column {
	text-align: right;
}

#portrait {
	width: 16rem;
	height: auto;
	margin-top: 2rem;
}

#bar1 {
	height: 10%;
}

#skills {
	padding-top: 4rem;
	height: auto;
}

.skills-header hr {
	border-top: 2px solid ;
	color: var(--dark-gray);
	width: 90%;
	margin-bottom: 1rem;
}

.fa-code {
	color: var(--dark-tan);
}

.fa-laptop {
	color: var(--dark-tan);
}

.fa-aws {
	color: var(--dark-tan);
}

.fa-code, .fa-laptop, .fa-aws {
	font-size: 4em;
	margin: 1rem;
}

#my-skills {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 2.7em;
}

#skills-section i {
	font-size: 2em;
}

#skills-section h3 {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 1.6em;
	margin-bottom: .8rem;
}

#skills-section a {
	font-size: 1.1em;
}

#skills-section a:hover {
    color: var(--dark-tan);
}

#certifications {
	padding-top: 4rem;
}

.card-img-top {
	height: 50%;
	width: 50%;
	margin: auto auto auto auto;
}
		
#contact {
	height: 85%;
	padding-top: 3rem;
	margin-bottom: 4rem;
}

#contact h1 {
	font-family: 'Roboto Condensed', sans-serif;
}

/* form styles */
#form {
  position: relative;
  width: 60%;
  margin: .1rem auto 2rem auto;
}

input {
  font-size: 0.875em;
  width: 100%;
  height: 3em;
  padding: 0px 15px 0px 15px;
  
  background: transparent;
  outline: none;
  color: var(--dark-tan);
  
  border: solid 1px var(--thistle);
  border-bottom: none;
  
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}

input:hover {
  background: var(--thistle);
  color: var(--dark-tan);
}

textarea {
  width: 100%;
  max-width: 100%;
  height: 10em;
  max-height: 10em;
  padding: 15px;
  
  background: transparent;
  outline: none;
  
  color: var(--dark-tan);
  font-size: 0.875em;
  
  border: solid 1px var(--thistle);
  
  transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
}

textarea:hover {
  background: var(--thistle);
  color: var(--dark-tan);
}

#submit {
  width: 100%;
  
  margin: -8px 0px 0px 0px;
  
  font-size: 0.875em;
  color: var(--dark-gray);
  
  outline:none;
  cursor: pointer;
  
  border: solid 1px var(--thistle);
  border-top: none;
}

#submit:hover {
  color: var(--dark-tan);
}

#footer {
	height: 20%;
	font-family: 'Roboto Condensed', sans-serif;
	background-color: var(--dark-gray)
}

.social-icon {
color: var(--dark-gray);
}

ul.social-icons {
	list-style: none;
	padding-top: 1.7rem;
}
.social-icons li {
    display: inline;
}
.social-icons a {
    color: #fff;
    text-decoration: none;
}
.fa-facebook-f {
    padding:10px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: var(--dark-gray);
}
.fa-facebook-f:hover {
    background-color: #3d5b99;
}

.fa-linkedin-in {
    padding:10px 14px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: var(--dark-gray);
}
.fa-linkedin-in:hover {
    background-color: #0073a4;
}
.fa-google-plus-g {
    padding:10px 9px;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: var(--dark-gray);
}
.fa-google-plus-g:hover {
    background-color: #e25714;
}

.fa-bitbucket {
    padding:10px 9px;
	margin-right: 2rem;
    -o-transition:.5s;
    -ms-transition:.5s;
    -moz-transition:.5s;
    -webkit-transition:.5s;
    transition: .5s;
    background-color: var(--dark-gray);
}
.fa-bitbucket:hover {
    background-color: #205081;
}