master

.body {
  font-size: 16px;
  color: #3f3f3f !important;
  
}

#holder {
  padding: 0px;
  width: 100%;
}

#division {
  font-size: 16px;
  color: #3f3f3f;
  display: inline-block;
}

#frame {
  width: 100%;
  font-family: Oswald;
}

#top {
  margin: 1vw auto 1vw auto;
  width: 1230px;
  padding: 0px 16px 0 16px;
  padding: 0px;
}

.navbar {
  margin-bottom: 0px;
}


#myNavbar ul li a{
  font-size: 185%;
  padding: 0px 13px 0px 12px;
  margin: 24.5px 0 24.5px 0;
  color: #747474;
  letter-spacing: 1px;
}

.navborder {
  border-right: 1px solid #d9d9d9;
}

#myNavbar ul li a:hover{
  color: #3f3f3f;
}

.activeNav {
  color: #3f3f3f !important;
}

#contactNav {
  padding-right: 0px !important;
}

#navContainer {
  padding: 0px;
}

.navbar-toggle {
  transform: scale(1.3,1.3);
}

#navigator {
  border: none;
  background: #FFFFFF;
  padding: 0px;
}

#hamburger {
  display: inline-block;
}

.navbar-brand {
  padding: 0px !important;
}

#logo {
  margin-left: 16px;
}

#footer {
  width: 100%;
  background: #3f3f3f;
  margin: 0px;
}

#footerContent {
  text-align: center;
  padding: 32px 0px 32px 0px;
}

#footerCopyright {
  margin-top: 16px;
}

#footerCopyright p {
  color: #E1E1E1;
  padding: 0px 8px 0px 8px;
  display: inline;
}

#companyName {
  border-right: solid 1px;
}

#footerLinks {
  width: 100%;
  font-size: 100%
  margin: 0px;
  color: #d9d9d9;
}

#footerLinks li {
  display: inline;
  padding: 0 8px 0 8px;
  border-right: solid 1px #E1E1E1;
}

#footerLinks:first-child {
  padding-left: 0px;
}

#footerLinks a {
  color: #E1E1E1;
  text-decoration: none;
}

#bottomContact {
  border: none !important;
}

#vehicles {
  width: 100%;
  margin: 0px;
  margin-bottom: 1.3vw;
}

#middleContent {
  margin: 0;
  padding-top: 1.3vw;
  padding-bottom: 1.3vw;
}

@media (max-width: 900px) {
  #line {
    width: 75% !important;
  }
  
  h1 {
    font-size: 175% !important;
  }

  #blurb p{
    font-size: 110% !important;
  }
  
  .expanded {
    display: none !important;
  }
  
  .middlePics {
    width: 100% !important;
    height: initial !important;
    padding-top: 75% !important;
    margin: 1vw 0vw 1vw 0vw !important;
  }
  
  .middlePicText {
    position: static !important;
    padding: 5%;
  }
  
  .middleTitle {
    font-size: 6.5vw !important;
  }
  
  .arrow {
    height: 6vw !important;
  }

  .navbar-header {
    width: 100%;
    float: none;
    height: 89px!important;
    padding-left: 16px;
    padding-right: 0px;
  }
  
  #navigator {
    padding: 0!important;
  }
  
  .navbar-brand {
    padding: 0px !important;
  }
  
  #top {
    height: 89px !important;
    width: 100%;
  }
  
  #logo {
    padding-top: 5px !important;
  }

  .navbar-right {
    float: none !important;
  }
  .navbar-toggle {
    display: block;
    margin-top: 25px;
  }
  
  .navbar-collapse {
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    padding: 0px;
  }

  .navbar-fixed-top {
    top: 0;
  }

  .navbar-collapse.collapse {
    display: none!important;
    overflow: hidden;
  }

  .navbar-nav {
    float: none!important;
    max-width: 100%;
    margin-left: 10px;
  }

  .navbar-nav>li {
    float: none;
  }

  .navbar-nav>li>a {
    padding: 10px 0px 10px 20px !important;
    margin: 0px !important;
  }

  .collapse.in{
    padding: 0px 0px 10px 0px !important;
    display:block !important;
    width: 100%;
  }

  .bannerPic {
    height: 35vw !important;
  }
  
  .bannerText {
    font-size: 200% !important;
    color: #3F3F3F;
  }
  
  .productContent {
    margin-top: 16px !important;
  }
  
  .productDesc .productText h3 {
    font-size: 150% !important;
  }
  
  #products {
    margin: 0 0 16px 0;
  }
  
  #learnMore {
    font-size: 100% !important;
    padding: 3px !important;
  }
  
  #envelope {
    margin-top: 0px !important;
    font-size: 9vw !important;
  }
  
  #contactData {
    display: inline-block !important;
    margin: 0px !important;
  }

  #contactDataPage {
    display: inline-block !important;
    margin: 0px !important;
  }

  .contactInfo {
    display: inline-block !important;
  }

  .contactInfoPage {
    display: inline-block !important;
    margin: 0 0 16px 0 !important;
  } 
  
  #contactTitle {
    display: none !important;
  }
  
  .name {
    font-size: 3.5vw !important;
    font-weight: 900;
  }

  .contactName{
    font-size: 3.3vw !important;
    font-weight: bold;
  }
  
  #chungLie {
    margin: 0 1.5vw 0 1.5vw !important;
  }

  #chungLieContact {
    //margin-left: 4vw !important;
  }

  
  #contacts {
    margin: 2vw 1px 2vw 1px !important;
  }

  #contactSection {
    width: 100%;
  }
  
  .contactInfo p {
    font-size: 2.7vw !important;
  }

  .contactInfoPage p {
    font-size: 2.5vw !important;
  }
  
  .map {
    margin: auto !important;
    width: 98% !important;
    height: 74vw !important;
  }
  
  .contactMap {
    margin: auto !important;
    height: 74vw !important;
  }  

  .aboutText h3 {
    font-size: 200% !important;
  }

  #homeBannerText h3 {
    font-size: 9vw !important;
  }

  #footerCopyright p {
    display: block;
  }
  
  #footerContent {
    padding: 16px 0 16px 0;
  }
  
  #companyName {
    border: none;
  }
  
  .line {
    display: none;
  }

  #division {
    font-size: 12px;
  }

  #contactBlurb {
  	margin: 0px !important;
  	font-size: 200% !important;
  }
  .researchText h3 {
  	font-size: 150% !important; 
  }
}

@media (min-width: 900px) and (max-width: 1230px) {
  h1 {
    font-size: 4vw !important;
  }
  
  .middlePics:hover .middlePicText {
  top: 0px !important;
  }
  
  .middlePicText {
    top: 5.2vw!important;
  }
  
  .middlePics {
    width: 48vw !important;
    height: 36vw !important;
    margin: 1vw 0.5vw 0vw 0.5vw;
  }
  
  .middleTitle {
    font-size: 2.75vw !important;
  }
  
  .arrow {
    height: 2.75vw !important;
  }
  
  .expanded {
    font-size: 1.21vw !important;
    padding-top: 0.3vw !important;
  }
  
  #contactData {
    display: inline-block !important;
    margin: 0px !important;
  }

  #contactBlurb {
  	margin: 0px !important;
  }
  
  .contactInfo {
    display: inline-block !important;
    margin: 0 !important;
  }
  
  #chungLie {
    margin: 2vw !important;
  }

  
  #contactTitle {
    display: none !important;
  }
  
  #envelope {
    margin-top: 0px !important;
  }
  
  .map {
    margin: auto !important;
    width: 98% !important;
    height: 74vw !important;
  }
}

@media (max-width: 1230px){
  #navigator {
    padding: 0px 16px 0 16px;
  }
  
  #top {
    width: 100%;
  }

  .bannerPic {
    width: 100% !important;
  }

  #homeBannerText h3 {
    font-size: 450%;
    margin: 0px;
    line-height: 0.5;
    padding-top: 2vw;
    padding-bottom: 1.5vw;
  }

  .aboutContent {
    width: 100% !important;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 16px !important;
  }

  .aboutPic img {
    padding: 0px !important;
  }
  
  .aboutText {
    padding: 16px 16px 0 16px !important;
  }

  .productContent {
    width: 100% !important;
    margin-left: 0px;
    margin-right: 0px;
  }
  
  .productDesc {
    padding: 16px 16px 0px 16px !important;
  }

  .productPic img {
    padding: 0px !important;
  }
  
  .researchContent {
    width: 100% !important;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 16px !important;
  }

  .leftResearch {
    padding: 0px !important;
  	margin-top: 16px !important;
  }
  
  
  .leftResearch .researchText {
    padding: 16px 16px 0px 16px !important;

  }

  .researchDesc .researchText {
    padding: 0px 16px 16px 16px !important;
  }

  .contactContent {
    width: 100% !important;
  }

  #contact {
    width: 100% !important;
    padding-right: 16px !important;
    margin: 16px 0px 16px 0px !important;
  }
}

.homeBanner {
  background-size: cover;
  width: 100%;
  height: 44vw;
  padding-top: 40%;
  background-position: center center;
  background-image: url("./images/martintek_home_loom.jpg");
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: -webkit-inline-flex;
  display: inline-flex;
  align-items: flex-end;
  padding-bottom: 4%;
}

.homeBanner a {
  width: 100%;
  text-decoration: none;
}

#homeBannerText {
  background: rgba(255,255,255,0.81);
  width: 100%;
  padding: 1.5% 1.5% 1.5% 4%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

#homeBannerText h3 {
  font-size: 450%;

  margin: 0px;
}


#weAre {
  color: #002A71;
  //color: #FFBE00;
}

#martintekBanner {
  color: #FFBE00;
  //color: #002A71;
}

.contentFrame {
  margin-top: 2.5vw;
  margin-bottom: 1vw;
  text-align: center !important;
  padding: 0px;
  margin-left: 0px;
  margin-right: 0px;
}

.line {
  width: 75%;
  border-top: solid 1px #D4D3D3;
  margin: auto;
}

#blurb {
  color: #3f3f3f;
}

h1 {
  font-size: 350%;
  margin: 1vw 0px 1vw 0px;
}

#blurb p {
  font-size: 150%;
  line-height: 150%;
  margin-top: 0.5vw;
  margin-bottom: 0.5vw;
  font-family: Droid Serif;
  //font-weight: bold;
}

.middlePics {
  width: 535px;
  height: 400px;
  margin: 1vw 0.5vw 0vw 0.5vw;
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: -webkit-inline-flex;
  display: inline-flex;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
  text-align: left;
  overflow: hidden;
}

.middlePics:hover .middlePicText {
  top: 0px;
}

#leftPic {
  background-image: url("./images/martintek_home_research.jpg");
  background-position: center bottom;
}

#midPic {
  
  background-image: url("./images/martintek_home_police.jpg");
  
}

#rightPic {
  background-image: url("./images/martintek_home_soldiers.jpg");
  background-position: center bottom;
}

.middlePicText {
  -webkit-align-self: flex-end;
  -ms-flex-item-align: end;
  align-self: flex-end;
  width: 100%;
  padding-left: 3%;
  border-radius: 1px;
  position: relative;
  top: 88px;
  transition: top 0.3s ease-in-out;
}

.middleTitle {
  font-size: 225%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 3% 0 2.1% 0;
}

#midText {
  background-color: rgba(255, 190, 0, 0.7);
  color: #002A71;
}

a {
  text-decoration: none !important;
}

#rightText {
  background-color: rgba(0, 47, 113, 0.7);
  color: #FFBE00;
  display: block;
}

#leftText {
  background-color: rgba(0, 47, 113, 0.7);
  color: #FFBE00;
  display: block;
}

.arrow {
  height: 250%;
  padding-left: 0.5vw;
}

.learnArrow {
  height: 16px;
  padding-left: 4px;
}

.expanded {
  padding-bottom: 3%;
  font-size: 125%;
  display: block;
  font-family: Droid Serif;
}

#bottom {
  background: url("./images/martintek_home_car.jpg");
  background-position: center center;
  background-size: cover;
  text-align: center;
}

#bottomBackground {
  background-color: rgba(255,255,255,0.65);
}

#bottomContent {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  -moz-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  margin: 0px;
  padding-top: 5vw;
  padding-bottom: 5.1vw;
  color: #3f3f3f;
}

#envelope {
  font-size: 500%;
  margin: 1vw;
}

.name, .contactName {
  font-size: 200%;
  margin: 0;
  font-weight: bold;
}

.contactInfo {
  text-align: left;
  font-family: Droid Serif
}

.contactInfoPage {
  font-family: Droid Serif;
  color: #3f3f3f;
  text-align: left;
}

#chungLie {
  margin: 2.5vw 0 2.5vw 0;
}

#chungLieContact {
  margin: 3vw 0 3vw 0;
}

.contactInfo p {
  margin: 0px;
  font-size: 150%;
}

.contactInfoPage p {
  font-size: 150%;
  margin: 0px;
}

#contactTitle {
  margin: 0px;
  font-size: 450%;
}

#contactBlurb {
  margin: 0px 0px 16px 0px;
  font-size: 300%;
}

#contact {
  width: 1230px;
  margin: 36px auto 36px auto;
  padding-right: 0px;
}

.contactContent {
  width: 100%;
}

#contacts {
  display: inline-block;
}

#contactSection {
  display: inline-block;
}

.map {
  display: inline-block;
  width: 700px;
  height: 525px;
  margin-left: 2vw;
}

.contactMap {
  display: inline-block;
  width: 100%;
  height: 525px;
  margin-left: 36px;
}


iframe {
  height: 100%;
  width: 100%;
}

#contactData {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

#contactDataPage {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.banner {
  text-align: center;
  margin: 0;
}

.bannerPic{
  width: 1230px;
  height: 250px;
  display: -webkit-inline-box;
  display: -moz-inline-box;
  display: -ms-inline-flexbox;
  display: -webkit-inline-flex;
  display: inline-flex;
  background-size: cover;
  background-position: center center;
  vertical-align: top;
  text-align: left;
  align-items: flex-end;
}

.bannerText {
  background: rgba(255, 190, 0, 0.6);
  width: 100%;
  height: 30%;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: 300%;
  padding: 16px;
}

#productsBanner {
  background-image: url("./images/martintek_products_banner.jpg");
}

#researchBanner {
  background-image: url("./images/martintek_products_banner.jpg");
}

#aboutBanner {
  background-image: url("./images/martintek_about_banner2.jpg");
}

#researchBanner {
  background-image: url("./images/martintek_research_banner.jpg");
}

#contactBanner {
  background-image: url("./images/martintek_contact_banner.jpg");
}

#aboutSection {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  -moz-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin: 0 0 32px 0;
}

.aboutContent {
  width: 1230px;
  margin-top: 32px;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.aboutText {
  padding: 0px;
  color: #3F3F3F;
}

.about {
  padding: 0px;
}

.aboutPic img {
  width: 100%;
  padding-right: 32px;
}

.aboutText h3 {
  margin-top: 0px;
  font-size: 250%;
}

.aboutText p {
  font-family: Droid Serif;
  font-size: 100%;
}

#products {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  -moz-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin: 0 0 32px 0;
}

.productContent {
  width: 1230px;
  margin-top: 32px;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.productPic {
  padding: 0px;
}

.productPic img {
  padding: 0px 32px 0px 0px;
  width: 100%;
}

.products {
  padding: 0px;
}

.productText h3 {
  margin-top: 0px;
  font-size: 250%;
}

.productText p, .productText li {
  font-family: Droid Serif;
  //font-weight: bold;
  font-size: 100%;
}

.productDesc {
  color: #3f3f3f;
}

.bold {
  text-shadow: 0 0 black;
  font-weight: bold;
}

.arrow {
  height: 16px;
  margin-left: 4px;
}

#learnMore {
  display: inline-flex;
  height: 32px;
  align-items: center;
  font-size: 125%;
  color: #FFBE00;
  padding: 6px;
  background: #002A71;
  box-shadow: 1px 2px #0143B4;
  border-radius: 2px;
  margin-top: 5px;
}

.learnMoreButton {
  text-decoration: none !important;
  cursor: pointer;
}

#researchSection {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  -moz-flex-direction: column;
  flex-direction: column;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  margin: 0 0 36px 0;
}

.researchContent {
  width: 1230px;
  margin-top: 32px;
  -webkit-align-self: center;
  -ms-flex-item-align: center;
  align-self: center;
}

.researchText {
  padding: 0px 16px 16px 16px;
  color: #3F3F3F;
}

.research {
  padding: 0px;
}

.researchPic img {
  width: 100%;
}

.researchText h3 {
  margin-top: 0px;
  font-size: 250%;
}

.researchText p {
  font-family: Droid Serif;
  font-size: 100%;
}

.researchPic .researchText {
  padding: 16px 16px 16px 0px;
}

.researchDesc .researchText {
  padding: 0px 0px 16px 0px;
}

.leftResearch {
  padding-right: 36px;
}