/*homeStyle.css*/
body{
  /*background: linear-gradient(#E0F7FA 15%, #CCFFBB 40%);
  background: linear-gradient(#E0F7FA 10%, #FFFBE8 40%, #F7D6EC 80%);*/
  background: linear-gradient(#F7D6EC, #E0F7FA);
}
#home{
  background-image: url(homeHero.jpg);
  background-attachment: fixed;
  /*width: 100%;
  position: relative;*/
  text-align: left;
  height:100vh;
}

/*#home > img, header{
  top: 0;
  left:0;
  margin:0;
  position: absolute;
  /*min-height: 100vh;*/
/*}*/
#myNameimg{
  /*width:40%;
  height:30%;
  padding:.5em 0 1em 0;
  padding:.5rem 0 1rem 0;*/
  top: 0;
  left:0;
  margin:0;
  /*position: absolute;*/
  height:30%;
  width:50%;
  -webkit-filter: drop-shadow(5px 5px 10px);
  filter: drop-shadow(5px 5px 5px #222);
}
#motto{
  display: none;
}
.projects_division{
  position:relative;
}
#projects_division, #contact_division, #about_division{
  clear: left;
  line-height: 1.5em;
  line-height: 1.5rem;
  font-weight: 300;
}
#about_division{
  background-image: url(homeHero.jpg);
  background-attachment: fixed;
}
/*.homeContainer, .pjtContainer, #credoSubDiv, #skillsSubDiv, #academicSubDiv, .contactContainer{*/
.pjtContainer, #credoSubDiv, #skillsSubDiv, #academicSubDiv, .contactContainer{
  /*margin:2em 8em 1em 8em;
  margin:2rem 8rem 1rem 8rem;*/
  margin:2vw 8vw 1vw 8vw;
}
.homeContainer{
  padding: 2vw 8vw 1vw 8vw;
}
#credoSubDiv, #skillsSubDiv, #academicSubDiv{
  margin-top: 0;
}
#home, #academicSubDiv, #skillsSubDiv, #credoSubDiv, .contactContainer{
  display: inline-block;
}
#about_division h3, #academicSubDiv h3, #skillsSubDiv h3{
  clear:left;
}
#credoSubDiv p{
  font-size: 1.25em;
  font-size: 1.25rem;
  line-height: 2em;
  line-height: 2rem;
}
#academicSubDiv h4{
  margin:.5em 0;
  margin:.5rem 0;
}
.bestAt {
  font-size: 1.25em;
  font-size: 1.25rem;
  padding-bottom: 2em;
  padding-bottom: 2rem;
}
.bestAt p{
  /*line-height: 2em;
  line-height: 2rem;*/
  line-height: 2;
  padding-top: 1em;
  padding-top: 1rem;
  /*padding-right: 5em;
  padding-right: 5rem;*/
  text-align: justify;
}
#bestAtWeb{
  display:block;
}
#bestAtMobile{
  display:none;
}
.viewResumeButton{
  /*margin: 2em 0;
  margin: 2rem 0;*/
  margin: 2vw 0;
  padding: .5em 2em;
  padding: .5rem 2rem;
  cursor: pointer;
  position:relative;
}

/*animation parameters start*/
/*.myName, .socialNWIcons a,.bestAt h3, .bestAt p{
animation: fadeInDown 1s;
animation-name: fadeInDown;
animation-duration: .50s;
animation-timing-function: linear;
animation-direction: alternate;
animation-delay: 0s;
-webkit-animation: fadeInDown 1s;
-webkit-animation-duration: .50s;
-webkit-animation-timing-function: linear;
-webkit-animation-direction: alternate;
-webkit-animation-delay: 0s;
-webkit-animation: flipInY 1s;
animation: flipInY 1s;
}*/

/*.myName, .bestAt h3, .bestAt p, #myNameimg, #bestAtWeb, .pjtContainer, #contact_division{*/
/*.myName, .bestAt h3, .bestAt p, #myNameimg, #bestAtWeb{
  -webkit-animation-name: fadeInLeft;
  -moz-animation-name: fadeInLeft;
  -o-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 2s;
  -moz-animation-duration: 2s;
  -o-animation-duration: 2s;
  animation-duration: 2s;
}
#mainNav{
  -webkit-animation-name: fadeInDown;
    -moz-animation-name: fadeInDown;
    -o-animation-name: fadeInDown;
    animation-name: fadeInDown;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    -o-animation-duration: 2s;
    animation-duration: 2s;
}
.viewResumeButton{
  -webkit-animation-name: fadeInUp;
    -moz-animation-name: fadeInUp;
    -o-animation-name: fadeInUp;
    animation-name: fadeInUp;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    -o-animation-duration: 2s;
    animation-duration: 2s;
}*/
/*animation parameters end*/


h2{
  /*text-transform: uppercase;*/
  letter-spacing: 1px;
  padding:2em 2em 1em 8em;
  padding:2rem 2rem 1rem 8rem;
  font-size: 2em;
  font-size: 2rem;
}
#contact_division h2, #projects_division h2{
  text-transform: uppercase;
  padding: 0;
  padding: 2vw 2vw 1vw 8vw;
}
.projects_division{
  margin-top:2em;
  margin-top:2rem;
  overflow: hidden;
}
.pjtContainer{
  float:left;
}
.projectTile{
  width:50%;
  float:left;
}
.pjtdesc{
  /*padding: 0 10px;*/
  width:40%;
  float:right;
}
h3{
  /*font-size: 2vw;*/
  font-weight: 600;
  padding:1em 0 0 0;
  padding:1rem 0 0 0;
  /*line-height: 2em;
  line-height: 2rem;*/
}
.pjtdesc > p{
  padding:1em 0;
  padding:1rem 0;
  font-size: 1.25em;
  font-size: 1.25rem;
  line-height: 2em;
  line-height: 2rem;
}
.caseStudyButton{
  text-align: center;
  vertical-align: text-bottom;
  width:100%;
  background-color: #190654;
  color: white;
  font-weight: bold;
}

/*.testiTile{
/*max-width:23em;
max-width:23rem;
width:100%;
height:13em;
height:13rem;*/
/*float:left;
margin:.5em 1em .5em 0;
margin:.5rem 1rem .5rem 0;
background-color:#F7A940;
padding:1.5em;
padding:1.5rem;
-webkit-user-select: text;  /* Chrome all / Safari all */
/*  -moz-user-select: text;     /* Firefox all */
/*-ms-user-select: text;      /* IE 10+ */
/*  user-select: text;          /* Likely future */
/*  overflow: auto;
}
.testiTile img{
display:none;
}
.testiTile p{
font-size: 1.15em;
font-size: 1.15rem;
line-height: 2em;
line-height: 2rem;
}*/
#testiSubDiv{
  display: flex;
  padding-top: 4em;
  padding-top: 4rem;
  background: linear-gradient(#eaeaf5, #F7D6EC, #E0F7FA);
  background-image: url(homeHero.jpg);
  background-attachment: fixed;
}
#testiImage{
  width:50%;
  height:100vh;
  display:flex;!important
  margin:0;
}
#testiContent{
  width:50%;
}
#testiContent > h2{
  padding: 3em 2em 1em 4em;
  padding: 4rem 2rem 1rem 4rem;
  font-size: 1.5em;
  font-size: 1.5rem;
}
#testiContent div{
  /*height: 100vh;*/
  display: flex;
  flex-direction: column;
}
#testiContent div > p{
  font-size: 1.15em;
  font-size: 1.15rem;
  line-height: 2em;
  line-height: 2rem;
  padding: 4em;
  padding: 4rem;
}
#testiSubDiv > h3{
  display: none;
}
.displayImg{
  display: none;
}
#contact_division{
  background: #E0F7FA;
}
.contactContainer{
  /*margin-right:2em;
  margin-right:2rem;*/
  width: 100%;
}
.contactTile{
  text-align: center;
  max-width:20em;
  max-width:20rem;
  width:100%;
  height: 10em;
  height: 10rem;
  float: left;
  margin:1em;
  margin:1rem;
  margin-left:0;
  background-color:#38C1D2;
}
.contactTile > p{
  font-size: 1.25em;
  font-size: 1.25rem;

}
.contactText{
  -webkit-user-select: all;  /* Chrome all / Safari all */
  -moz-user-select: all;     /* Firefox all */
  -ms-user-select: all;      /* IE 10+ */
  user-select: all;          /* Likely future */
}
#testiContent4Mob{
  display: none;
}

/*@media (max-width: 601px) {*/
@media (max-width: 768px) {
  /*h3{
  font-size: 5vw;
  }*/
  #home{
    margin: 0;
    /*width: 100%;*/
    min-height: 100vh;
    min-height: -webkit-fill-available;
  }
  #home > img, header{
    width:100%;
    height:100%;
    position: absolute;
  }
  .homeContainer{
    margin:4em 2em 0 2em;
    margin:4rem 2rem 0 2rem;

  }
  .homeContainer > .myName{
    display: none;
    padding: 0;
  }
  .homeContainer > #myNameimg{
    display:none;
  }
  .homeContainer > .socialNWIcons{
    margin: 2em 0;
    margin: 2rem 0;
    z-index:0;
  }
  #motto{
    display: block;
    /*font-size: 6vw;*/
    text-transform: uppercase;
    font-weight: bold;
  }
  .homeContainer > .bestAt{
    font-size: 1.5em;
    font-size: 1.5rem;
    margin: 2em 0;
    margin: 2rem 0;
  }
  .bestAt > #bestAtWeb{
    display:none;
  }
  .bestAt > #bestAtMobile{
    display:block;
    line-height: 2;
  }
  .bestAt > p{
    margin: 2em 0;
    margin: 2rem 0;
    padding: 0;
    font-size: 1.05em;
    font-size: 1.05rem;
    /*line-height: 2em;
    line-height: 2rem;*/
    line-height: 6vw;
  }
  .bestAt > h3{
    padding-right: 11em;
    padding-right: 11rem;
  }
  .bestAt .viewResumeButton{
    margin: 1em 0;
    margin: 1rem 0;
  }
  .caretDown{
    display: none;
  }
  #projects_division h2{
    margin:0;
    padding:0 0 2em 0;
    padding:0 0 2rem 0;
  }
  #projects_division, #about_division{
    margin: 0;
    margin:2em 2em 0 2em;
    margin:2rem 2rem 0 2rem;
  }
  .contactContainer{
    margin:0;
    padding: 0 2em;
    padding: 0 2rem;
    width:auto;
  }
  #contact_division h2{
    padding:0;
    padding:2em;
    padding:2rem;
    /*font-size: 2vw;
    line-height: 2vw;*/
  }
  .projectsSuperContainer > .pjtContainer{
    padding-bottom: 2em;
    padding-bottom: 2rem;
    margin: auto;
    /*width: 90%;*/
  }
  .pjtContainer> .projectTile{
    float: left;
    width: 100%;
  }
  /*.pjtContainer> .projectTile > h3{
  height:3.5em;
  height:3.5rem;
  }*/
  .pjtContainer> .pjtdesc{
    float: left;
    width: 100%;
  }
  .contactTile{
    max-width: 100%;
  }
  #testiSubDiv{
    display: none;
  }
  #testiSubDiv > h3{
    display: block;
  }
  #testiContent{
    width:100%;
  }
  #testiContent div > p{
    padding:0;
    padding:2em;
    padding:2rem;
  }
  #testiContent4Mob{
    background-image: url(homeHero.jpg);
    background-attachment: fixed;
    display: block;
    margin: 0 auto;
  }
  #testiContent4Mob h2{
    padding: 2em;
    padding: 2rem;
  }
  #testiContent4Mob p{
    /*padding:1em 0;
    padding:1rem 0;
    width: 90%;
    margin: auto;*/
    font-size: 1.25em;
    font-size: 1.25rem;
    line-height: 2em;
    line-height: 2rem;
  }
  #testiContent4Mob > div{
    padding: 2em;
    padding: 2rem;
  }

}
