@viewport{
    zoom: 1.0;
    width: extend-to-zoom;
}

@-ms-viewport{
    width: extend-to-zoom;
    zoom: 1.0;
}

.container {
	color: #63666f;
	font-family: Geneva, Verdana, Helvetica Neue, Tahoma, sans-serif;
    letter-spacing: 1px;
}

.navbar {
    margin-top: 1em;
}

a.navbar-brand h1 {
	color: #ddc909;
	font: 200 1.4em 'Josefin Sans', "Trebuchet MS", Verdana, Geneva, sans-serif;
	margin: 0em;
}

#main-content {
    margin: 5em 0;
}

.content {
    font-size: 0.9em;
    padding: 0 15px;
}

h1.location {
	font: 1.1em 'Open Sans', Helvetica Neue, Verdana, sans-serif;
    letter-spacing: 1px;    
}

h2.heading {
	color: #535867;
	font: 1.3em 'Open Sans', Helvetica Neue, Verdana, sans-serif;
    letter-spacing: 1px;
}

h2.dev-heading {
    padding-top: 2em;
}

a, a:hover {
    color: #2d3860;
    text-decoration: none;
}

a.nav-link {
	color: #747f83;
	font-family: 'Open Sans', Helvetica Neue, Verdana, sans-serif;
	letter-spacing: 1px;
}

.navbar-collapse  {
	vertical-align: bottom;
}

.header-ruler {
	margin-top: 0em;
}

.bio-img {
    max-height: 190px;
}

.column-img {
    max-width: 800px;
    padding: 0.5em;
}

img.image {
	max-width: 33.3%;
}

.thumb img {
    height: 200px;
    width: 200px;
    margin-bottom: 1em;
}

.thumb {
    margin-bottom: 2em;
}

.carousel-item {
    text-align: center;
}

.carousel-img {
    max-height: 88vh;
    max-width: 100%;
}

@media (max-width: 767px) { /* xs viewport */
	#main-content {
        margin-top: 2em;
    }

    .container {
        padding: 0 1em;
    }

    .column-img {
        max-width: 400px;
        padding: 0.5em 0;
    }

    h2.dev-heading {
        padding-top: 1em;
    }

    .navbar {
        padding: 0;
    }

    .portrait-img {
        max-height: 100vh;
        width: auto;
    }

    .bio-img {
        padding: 0;
    }

    .bio {
        margin-bottom: 0;
    }
}

@media (min-width: 768px) {
    .bio-img {
        margin-top: 2em;
    }

    .navbar {
        padding-right: 1rem;
    }

    .bio {
        margin-bottom: 5em;
    }

    .thumb {
        margin-bottom: 8em;
        max-height: 200px;
        max-width: 200px;
    }
}

@media (min-width: 991px) {
    .navbar {
        padding-right: 3em !important;
    }
}

.carousel-control-prev, .carousel-control-next {
    color: #535867;
    opacity: 0;
}

.carousel:hover  .carousel-control-prev, .carousel:hover .carousel-control-next {
    opacity: 0.1;
  }

  .carousel-control-prev-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%232d3860' viewBox='0 0 8 8'%3E%3Cpath d='M5.25 0l-4 4 4 4 1.5-1.5-2.5-2.5 2.5-2.5-1.5-1.5z'/%3E%3C/svg%3E") !important;
   }
   
   .carousel-control-next-icon {
     background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%232d3860' viewBox='0 0 8 8'%3E%3Cpath d='M2.75 0l-1.5 1.5 2.5 2.5-2.5 2.5 1.5 1.5 4-4-4-4z'/%3E%3C/svg%3E") !important;
   }

.modal-dialog {
      margin: 30px auto;
  }

.modal-body {
    position:relative;
    padding:0px;
}