@import url(https://fonts.googleapis.com/css?family=Jura&display=swap);
@import url(http://weloveiconfonts.com/api/?family=entypo);

html, body {
  height: 100%;
  font-family: 'Jura', sans-serif;
  scroll-behavior: smooth;
  overflow-x: hidden!important;
  width: 100%!important;
}

body {
  color: #333333;
}

img {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}

h1 {
  text-align: center;
  font-weight: 500!important;
  font-size: 2em;
  /*border-bottom: 2px solid #2ecc71;*/
  margin-bottom: 1em;
  color:white;
}

.ctxt {
  color:white;
}

@media only screen and (min-width: 600px) {
  .nodisplay {
    color:red!important;
  }
}

@media only screen and (max-width: 600px) {
  .nodisplay {
    display:none;
  }

}

.credits-text {
  font-size: 14px;
}



/* ---------------------------------------------------
    desktop/mobile optimization styles
----------------------------------------------------- */

.navspace {
  margin-top: 65px;
}

@media only screen and (max-width: 600px) {
  .desktopcontent {
    display:none;
  }
}

@media only screen and (min-width: 600px) {
  .mobilecontent {
    display:none;
  }

  html, body {
    overflow-x: hidden!important;
  }
  body {
    width: 100%;
  }
}

@media only screen and (max-width: 600px) {
  .wrapper section article {
    width: 80%;
  }
  .wrapper section:after {
    height: 100vh;
  }
}

.fill {
    display: flex;
    justify-content: center;
    overflow: hidden
}
.fill img {
    flex-shrink: 0;
    min-width: 100%;
    min-height: 100%
}

/*4K OPTIMIZATIONS*/

@media only screen and (min-width: 2100px) {
.container {
    max-width: 2500px;
}

.credits-text {
  font-size: 35px;
}

#sidebar ul li a {
  font-size: 1.7em;
}

.btn {
  font-size: 2rem;
}

.logo {
  width: 400px!important;
  top: 30px!important;
  right: 50px!important;
}

.navbar {
  padding: 25px 0px 25px 10px;
}
}

/* ---------------------------------------------------
    desktop parallax styling
----------------------------------------------------- */


/* ---------------------------------------------------
    desktop content styles
----------------------------------------------------- */
.scrollarrow {
  -webkit-animation: mover 1.7s infinite  alternate;
  animation: mover 1.7s infinite  alternate;
  color: white;
  position: absolute;
  left:50%;
  top:83vh;
}

@-webkit-keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-15px); }
}
@keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-15px); }
}

.hr1 {
  border: 2px solid #00477C;
  border-radius: 5px;
  margin-top: 30px;
  margin-bottom: 30px;
}



/*----------------------------------------------------
    titles
------------------------------------------------------*/
#work {
  font-weight:300;
  font-size: 3.5em;
  text-align: left;
  margin: 0 -10px 0 0;
  margin-left: 125px;
}

/*.textimageleft {
  margin-top: 10px;
}

.textimageright {
  margin-top: 60px;
}*/

.tripimage {
  height: 100%;
  width: 100%;
}

.space {
  height: 200px;
}

.smallspace{
  height: 80px;
}

.middletext {
  text-align: left;
}

.projectlist {
  background-color: #00477C;
  width: 100%;
}

.projectminiimage {
  height: 200px;
  width: 400px;
}

#projectlisttitle {
  font-weight: 300;
  font-size: 50px;
  text-align: left;
  padding-left:100px;
  color:white;
}

.projectnames p {
  color:white;
}

@media only screen and (min-width: 600px) {
  .prolo {
    text-align:left;
  }
}


.pastprojects {
  text-align: center;
}

.pastprojects:hover {
  text-align: center;
  text-decoration: underline;
  text-decoration-color: white;
}

#abouttitle {
  font-weight: 300;
  font-size: 50px;
  text-align: left;
  padding-left:100px;
  color:#999;
}

.homeabouttxt {
  margin-top: 60%;
  text-align: center;
  font-weight: 900;
}

.homeabouttxt:hover {
  color:#00477C;
}

.aboutimg {
  margin-bottom: 25px;
}

.contactbg {
  background-color: #00477C;
  margin-bottom: 15px;
}

#contacttitle {
  font-weight: 300;
  font-size: 50px;
  text-align: left;
  padding-left:100px;
  color:white;
}

.homecontact {
  margin-top: 20%;
}

.homecontact p {
  color:white;
}

.chevronright {
  color:white;
}

.chevronright:hover {
  -webkit-animation: mover2 1s infinite  alternate;
  animation: mover2 1s infinite  alternate;
}

@-webkit-keyframes mover2 {
    0% { transform: translateX(0); }
    100% { transform: translateX(15px); }
}
@keyframes mover2 {
    0% { transform: translateX(0); }
    100% { transform: translateX(15px); }
}

.maphome {
        position: relative;
        padding-bottom: 50%; // This is the aspect ratio
        height: 0;
        overflow: hidden;
        margin-bottom: 45px;
    }
.maphome iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 95% !important;
    height: 100% !important;
}
/* ---------------------------------------------------
    blue box text styles
----------------------------------------------------- */

.title {
  color:white;
  font-weight: 300;
  text-align: center;
}

.link {
  color:white;
  text-decoration: underline;
}

#deskmap {
  width: 100%;
  height: 500px;
}

/* -------------------------------------------------
   Animation
---------------------------------------------------- */
.fitimage {
  width: 100%;
  display: inline-block;
}


/* ---------------------------------------------------
    logo scaling for mobile/desktop
----------------------------------------------------- */

@media only screen and (min-width: 600px) {
  .logo {
    position:fixed;
    right:15px;
    top: 20px;
    width:220px;
  }
}

@media only screen and (max-width: 600px) {
  .logo {
    padding-right:20px;
    width:170px;
  }
}

/* ---------------------------------------------------
    Mobile styling
----------------------------------------------------- */
@media only screen and (max-width: 600px) {
  .overflow {
    overflow-x: hidden!important;
  }

  .row {
    overflow-x: hidden!important;
  }
}

.mTitle {
  color: #999;
  font-size: 3rem;
  margin-bottom: 26px;
}

.mSubtitle {
  color: #999;
  text-align: left;
  margin-left: 15px;
}

.mText {
  padding-left: 15px;
  padding-right: 15px;
  text-align: left;
}

.mProjectList {
  background-color: #00477C;
}

.mTitle2 {
  color:white;
  font-size: 3rem;
  margin-bottom: 1rem;
  margin-top: 1rem;
}

.prolo2 p {
  color: white;
  text-align: center;
}

.mAboutLink {
  text-align: center;
  text-decoration: underline;
  text-decoration-color: #999;
}

/* ---------------------------------------------------
    Site redo CSS
----------------------------------------------------- */
.col-0 {
  display: none;
}