#menu {
	display: none;
	position: absolute;
	width: 100%;
	height: 100%;
  z-index: 3;
}
#launchYoutube {
  position: absolute;
  bottom: 0%;
  position: absolute;
  width: 30%;
  height: 38%;
}
#line1, #line2 {
	position: relative;
	background-image: url(../assets/menu_x.png);
	background-repeat: no-repeat;
	background-size: contain;
	display: flex;
    width: 54%;
    flex-direction: column;
    flex-wrap: wrap;
    height: 5%;
    left: 0%;
    top: 20%;
  background-position: center;
}
#line2 {
	top: -15%;
}
#audio, #explore, #exploreAR, #exploreARSelect, #exploreARQR, #share {
	display: flex;
	width: 9%;
	height: 13%;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	position: absolute;
  cursor: pointer;
}
#audio {
	background-image: url(../assets/menu_audio.png);
	top: 39%;
	left: 38%;
}
#audioOff, #audioOffSelect {
	display: none;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	position: absolute;
	background-image: url(../assets/menu_audio_select.png);
	width: 9%;
	height: 13%;
	top: 39%;
	left: 38%;
  cursor: pointer;
}
#audioOff {
	background-image: url(../assets/menu_audio_off.png);
}
#explore {
	background-image: url(../assets/menu_explore.png);
	left: 45%;
	top: 32%;
}
#exploreSelect {
	background-image: url(../assets/menu_explore_select.png);
	display: none;
	width: 9%;
	height: 13%;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	position: absolute;
	left: 45%;
	top: 32%;
  cursor: pointer;
}
#exploreCh1 {
	background-image: url(../assets/menu_explore_ch1.png);
	display: none;
	width: 9%;
	height: 13%;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	position: absolute;
	left: 54%;
  top: 39%;
  cursor: pointer;
}
#exploreAR {
	background-image: url(../assets/menu_AR_dsktp.png);
	left: 45%;
	top: 46%;
  cursor: pointer;
}
#exploreARSelect {
	background-image: url(../assets/menu_AR_dsktp_select.png);
	left: 45%;
	top: 46%;
  display: none;
}
#exploreARQR {
  display: none;
  background-image: url(../assets/menu_QR_dsktp.png);
  left: 53%;
  top: 37%;
  width: 10%;
  height: 15%;
}
#share {
	background-image: url(../assets/menu_share.png);
	left: 38%;
	top: 53%;
  cursor: pointer;
}
#shareSelect {
	background-image: url(../assets/menu_share_select.png);
	left: 38%;
	top: 53%;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	position: absolute;
	display: none;
	width: 9%;
  height: 13%;
  cursor: pointer;
}
#mainMenu {
    background-image: url(../assets/Desktop_BG.png);
    background-size: cover;
    display: flex;
    width: 100%;
    height: 100%;
    position: absolute;
    background-position: center;
    justify-content: center;
}
#logo {
	  background-image: url(../assets/logo.png);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
    position: absolute;
    width: 22%;
    height: 14%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    top: 10%;
    z-index: 1;
  min-width: 250px;
}
#instructions_1, #instructions_2 {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
    position: absolute;
    width: 38%;
    height: 11%;
    top: 34%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url(../assets/menu_1.png);
    min-width: 400px;
}
#instructions_2 {
	background-image: url(../assets/menu_2.png);
	width: 45%;
  height: 11%;
  top: 64%;
}
#launchCTA {
	background-image: url(../assets/launch_cta.png);
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
    position: absolute;
    width: 67%;
    height: 6.2%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    top: 50%;
  max-width: 250px;
  cursor: pointer;
}
#launchCh1CTA, #launchCh2CTA, #launchCh3CTA {
	background-image: url(../assets/launch_cta_wht.png);
	top: 60%;
	display: none;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
    position: absolute;
    width: 20%;
    height: 6%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  cursor: pointer;
}
#logo2 {
	background-image: url(../assets/logo2.png);
	display: none;
	width: 11%;
    height: 3%;
    top: 5%;
    right: 5%;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	position: absolute;
  z-index: 4;
}
#nav {
	display: none;
	width: 70%;
    height: 5%;
    position: absolute;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: space-between;
    align-items: flex-end;
    justify-content: space-between;
    background-position: center;
    left: 15%;
    bottom: 3%;
    z-index: 5;
}
#bottomMenu {
	display: flex;
	width: 100%;
	height: 100%;
	justify-content: space-between;
}
#labels {
  display: none;
  width: 70%;
  bottom: 1%;
  justify-content: space-between;
  height: 1.5%;
  left: 15%;
  position: absolute;
}
#menuLabel, #centerLabel {
    position: absolute;
    display: flex;
    background-image: url(../assets/menu.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    width: 4%;
    height: 100%;
    right: 0%;
}
#menuLabel {
  height: 90%;
  bottom: 0%;
}
#centerLabel {
    background-image: url(../assets/center.png);
    width: 4%;
    height: 100%;
    left: 0%;
}
#menuBtn {
	background-image: url(../assets/menuBtn.png);
    display: flex;
    width: 4%;
    height: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    flex-wrap: wrap;
    align-content: space-around;
    justify-content: center;
  cursor: pointer;
}
#closeMenuBtn {
	background-image: url(../assets/menuBtnClose.png);
    width: 8%;
    height: 100%;
    right: 0%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: none;
    position: absolute;
  cursor: pointer;
}
#centerARBtn {
	background-image: url(../assets/menu_AR_center.png);
    width: 4%;
    height: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: flex;
  cursor: pointer;
}
#facebook, #linkedIn, #twitter {
	display: none;
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	position: absolute;
	width: 3.5%;
	height: 5%;
  cursor: pointer;
}
#facebook, #facebook2 {
	background-image: url(../assets/menu_facebook.png);
	left: -1%;
	top: 67%;
}
#linkedIn, #linkedIn2 {
	background-image: url(../assets/menu_linkedin.png);
	left: -10%;
	top: 61%;
}
#twitter, #twitter2 {
	background-image: url(../assets/menu_twitter.png);
	left: 16%;
	top: 68%;
}
#facebook2, #linkedIn2, #twitter2 {
  display: none;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  position: absolute;
  width: 14%;
  height: 27%;
  cursor: pointer;
}
#facebook2 {
  left: 100%;
  top: 43%;
}
#linkedIn2 {
  left: 84%;
  top: 28%;
}
#twitter2 {
  left: 100%;
  top: 76%;
}
#chapterMenu, #chapterMenu2, #chapterMenu3 {
	display: none;
	position: absolute;
	width: 20%;
    height: 18%;
    left: 40%;
    top: 20%;
    justify-content: center;
    z-index: 1;
  cursor: pointer;
}
#learn {
	background-image: url(../assets/learnMore.png);
	position: absolute;
	display: none;
	width: 20%;
    height: 41%;
    background-repeat: no-repeat;
    background-size: contain;
    right: 0%;
    bottom: 0%;
    transform: rotateY(90deg);
  cursor: pointer;
  background-position: center;
}
#learn3 {
  background-image: url(../assets/learnMore_ch3.png);
	position: absolute;
	display: none;
	width: 30%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: contain;
  cursor: pointer;
  background-position: center;
}
#replay, #replay2, #replay3 {
	background-image: url(../assets/replay.png);
	background-repeat: no-repeat;
	background-size: contain;
	display: none;
	position: absolute;
	width: 18%;
  height: 42%;
  left: 0%;
  bottom: 0%;
  cursor: pointer;
  transform: rotateY(90deg);
}
#share3 {
  background-image: url(../assets/share.png);
	background-repeat: no-repeat;
	background-size: contain;
	display: none;
	position: absolute;
	width: 18%;
  height: 42%;
  right: 0%;
  bottom: 0%;
  cursor: pointer;
  transform: rotateY(90deg);
  background-position: center;
  
}
#nextMenu, #nextMenu2 {
	background-image: url(../assets/next.png);
    position: absolute;
    width: 30%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: contain;
    display: none;
  cursor: pointer;
  background-position: center;
}
#fill {
    position: absolute;
    width: 30%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: contain;
    display: none;
  background-position: center;
}
#fillMenu {
	background-image: url(../assets/fill.png);
	position: absolute;
	background-repeat: no-repeat;
	background-size: contain;
	width: 23%;
    height: 100%;
  background-position: center;
}
#ch1 {
	background-image: url(../assets/menu_chapter_01.png);
	position: absolute;
	background-repeat: no-repeat;
	background-size: contain;
	display: none;
	width: 20%;
    height: 11%;
    top: 34%;
    left: 84%;
  cursor: pointer;
}
#ch2 {
	background-image: url(../assets/menu_chapter_02.png);
	position: absolute;
	background-repeat: no-repeat;
	background-size: contain;
	display: none;
	width: 20%;
    height: 8%;
    top: 48%;
  cursor: pointer;
    left: 82%;
}
#ch3 {
	background-image: url(../assets/menu_chapter_03.png);
	position: absolute;
	background-repeat: no-repeat;
	background-size: contain;
	display: none;
	width: 20%;
    height: 8%;
    top: 54%;
    left: 64%;
  cursor: pointer;
}
#chapters {
	background-image: url(../assets/bg_chapters.jpg);
	background-size: cover;
    display: none;
    width: 100%;
    height: 100%;
    position: absolute;
    background-position: center;
    justify-content: center;
}
#chapter1, #chapter2, #chapter3 {
	background-size: cover;
	display: none;
	width: 17%;
    background-size: contain;
    background-repeat: no-repeat;
    height: 30%;
    top: 25%;
    position: absolute;
}
#chapter1 {
	background-image: url(../assets/ch1_txt.png);
}
#chapter2 {
	background-image: url(../assets/ch2_txt.png);
}
#chapter3 {
	background-image: url(../assets/ch3_txt.png);
}
#backBtn {
	background-image: url(../assets/back.png);
	display: none;
	position: absolute;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	width: 4%;
  height: 4%;
  left: 26%;
  top: 25%;
  cursor: pointer;
  z-index: 1;
}
#deployMRV {
	display: none;
  width: 100%;
  height: 9%;
  position: absolute;
  bottom: 9%;
  cursor: pointer;
  justify-content: center;
}
#fillMRV {
    position: absolute;
    width: 5%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: contain;
    display: none;
    background-image: url(../assets/loader_mrv.gif);
}
#deploy {
	position: absolute;
	background-image: url(../assets/deploy.png);
	background-repeat: no-repeat;
	background-size: contain;
	width: 5%;
	height: 100%;
  cursor: pointer;
}
@media (max-width: 1200px) {
  #menu {
    width: 1200px;
    height: 700px;
    left: calc(50% - 600px);
    top: calc(50% - 350px);
  }
  #audio, #audioOffSelect, #audioOff, #explore, #exploreAR, #exploreARSelect, #exploreARQR, #share, #shareSelect, #exploreCh1 {
    width: 124px;
    height: 107px;
  }
  #audio, #audioOffSelect, #audioOff {
    top: 40%;
    left: 39%;
    width: 124px;
    height: 107px;
  }
  #explore, #exploreSelect {
    left: 48%;
    top: 32%;
    width: 124px;
    height: 107px;
  }
  #exploreAR, #exploreARSelect {
    left: 48%;
    top: 49%;
    width: 124px;
    height: 107px;
  }
  #exploreARQR {
    left: 57%;
    top: 37%;
    width: 134px;
    height: 125px;
  }
  #share, #shareSelect {
    top: 57%;
    left: 39%;
    width: 124px;
    height: 107px;
  }
  #exploreCh1 {
    left: 57%;
    top: 40%;
  }
  #ch1 {
    top: 36%;
  }
  #ch2 {
    top: 51%;
  }
  #ch3 {
    top: 58%;
  }
  #nav {
    height: 54px;
  }
  #centerARBtn {
    width: 45px;
  }
  #menuBtn {
    width: 45px;
  }
  #closeMenuBtn {
    width: 92px;
  }
  #deployMRV {
    height: 85px;
  }
  #fillMRV {
    width: 83px;
  }
  #deploy {
    width: 83px;
  }
  #chapterMenu, #chapterMenu2, #chapterMenu3 {
    width: 300px;
    height: 148px;
  }
}