body {
	/*background-color: blue;*/
    --layout: "mobile";
}

/* NAVIGATION BAR */

#mobile_navigation {
	display: inline-block;
	opacity: 1;
	width: 100%
}

#tablet_navigation {
	visibility: hidden;
	opacity: 0;
}

.navbar {
	width: 100%;
	/*height: 80px;*/
	text-align: center;
}

.nav-item {
	width: 100%;
	text-align: right;
	color: #FFFFFF;
}

.nav-link {
	width: 100%;
	text-align: right;
	
}

#logo_top_left {
	margin-top: -14px;
}


.topnav {
  overflow: hidden;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 9999;
}

.topnav-right {
  float: right;
  margin: 20px 40px 0px 0px;
}

.ATTIS-Logo-Full-1 {
  width: 53.8px;
  height: 40px;
  object-fit: contain;
  margin: 20px 0px 0px 10px;
  /*filter: invert(1);*/
}



/* page_00 */

/* PAGE 00 ======================================================= */
.page_00 {height: 90vh;} /* 70 */
.inner {display: inline-block; vertical-align: middle; opacity:0; position: absolute; top: 60%; left: 50%; transform: translate(-50%, -65%);}
.inner img {display: block; margin-left: auto; margin-right: auto; margin-top: 10px; transform: scale(0.5);}

#logo_text {
	margin-top: -40px;
	/*width: 200px;*/
color: #FFFFFF;
  font-family: Servetica-Medium;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  /*color: #364b5c;*/
}















h1 {
  font-size: 44px;
}

h3 {
  font-size: 20px;
}

h4 {
  font-size: 14px;
  line-height: 1.5;
}

.About {
  margin-left: 40px;
  margin-right: 40px;
}

.paragraph {
  margin-top: 60px;
	font-size: 14px;
  line-height: 24px;
}

.faq_table_div {
	display: none;
}

.faq_paragraph {
	display: block;
}




.faq_paragraph_text {
	font-family: MontserratMedium;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 24px;
  letter-spacing: normal;
  color: #222222;
  margin-left: 40px;
  margin-right: 40px;
}

/*.faq_paragraph {
	font-size: 14px;
  line-height: 24px;
}*/

/*.menubuttons {
  display: none;
}*/

/* PAGE 01 ======================================================= */
.page_01 {
	/*height: 400px;*/
	/*height: 38vh;*/
}



/* PAGE 02 ======================================================= */


.div_strapline {	
	font-family: MontserratExtraBold;
	font-size: 26px;
	font-weight: normal;
	font-stretch: normal;
	font-style: normal;
	line-height: normal;
	letter-spacing: normal;

	color: #364B5C; /* GREY */
	text-align: center;
	position: absolute;
    display: block;
	top: 5%;
	left: 5%;
	right: 5%;
	margin: auto;	
}













































.page_03 {
	padding-top: 28%;
}













.delivery_icon_label {
	margin-top: -5%;
	margin-bottom: 0%;
}









#sensors_row {
	/*padding-top: 20%;*/
}

.bullet_point_title {
	padding-top: 26%;
	/*padding-left: 5%;*/
}





#threejs_sub1, #threejs_sub2, #threejs_sub3, #threejs_sub4 {
	position: absolute;
	opacity: 0;
	display: none;
	transform: translate(-4%, -25%);
}

#threejs_sub1 {
}

#threejs_sub2 {
	transform: translate(-4%, -125%);
}

#threejs_sub3 {
	transform: translate(-4%, -245%);
}

#threejs_sub4 {
	transform: translate(-4%, -325%);
}



.menu_link {
	display: none;
}

#s_a_e {
	margin-top: -25%;
	font-size: 30px;
	/*font-size: 30px;*/
	/*font-size: 40px;*/
}

.sae_strapline {
	font-size: 18px;
	top: -10%;	
}

.page_02 {
	padding-bottom: 240px;
}


#sae_header_1, #sae_header_2, #sae_header_3 {
	position: absolute;
	/*left: 5%;*/
	margin: auto;
	z-index: 500;
	vertical-align: baseline;
	font-size: 30px;
	text-align: center;
	margin: auto;
	top: 90%;
}

.sae_subheader {
	font-size: 16px;
	top: 62%;
	width: 300px;
}


#sae_text_1, #sae_text_2, #sae_text_3 {
	position: absolute;
	left: 5%;
	right: 5%;
	margin: auto;
	z-index: 500;
	vertical-align: baseline;
	top: 118%;
	font-size: 16px;
	color: #394A59; /* GREY */
}





#bp_title_waterproof {top: 70%; left: 14%;}
#bp_title_lightweight {top: 70%; left: 14%;}
#bp_title_tough {top: 70%; left: 14%;}

.bullet_point_text {
  position: absolute;
  height: 71px;
  font-family: MontserratMedium;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #000000;
  text-align: left;
}

#bp_text_waterproof {top: 80%; left: 5%; width: 320px;}
#bp_text_lightweight {top: 80%; left: 5%; width: 320px;}
#bp_text_tough {top: 80%; left: 5%; width: 320px;}


.page_04 {
	margin-top: 100px;
}



.app_header {
	font-size: 30px;
	top: -20%;
	padding-bottom: 50px;
}

#phone_image_container {
	top: 14px;
}

#app_text_0 {
	/*left: -4%;*/
	top: 14%;
	width: 230px;
}





.app_strapline {
  margin-top: 200px;
  font-size: 16px;
  margin-left: -150px;
}

.metrics {
  top: 230px;
  margin-left: -150px;
}

.metric {
  margin-top: 2px;
  font-size: 12px;
}



.page_05 {
	margin-top: 270px;
}



.IconLabel {
  /*margin-bottom: 0px;
  width: 191px;
  height: 24px;
  font-size: 11px;
  margin-left: -14%;*/
}










.apple_esq_text {
  padding-top: 19%;
  /*padding-left: 5%;*/
  text-align: center;
  position: absolute;
  top: 0%;
  left: 0;
  right: 0;
  margin: auto;
  position: absolute;
  height: 71px;
  font-family: MontserratMedium;
  /*font-size: 2px;*/
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;

  color: #394A59; /* GREY */
  text-align: center;
}

/*#sae_header_2 {
	position: absolute;
	left: 5%;
	margin: auto;
	z-index: 500;
	vertical-align: baseline;
	top: 68%;
}*/















/*.mc_centre {
	width: 80%;
}*/




.div_strapline {
  top: 25%;
  font-size: 13px;
}

#progWave {
  transform: translate(0%, -80%);
}

.Stat {
  font-size: 12px;
}

.Value {
  font-size: 18px;
}

#stat_bounce {
  position: absolute;
  left: 18%;
  top: 50%;
}

#stat_rotation {
  position: absolute;
  left: 60%;
  top: 60%;
}

#stat_steps {
  position: absolute;
  left: 8%;
  top: 100%;
}

#sinewaveCanvas {
	position: absolute;
	left: 0%;
	top: 60%;
	width: 48%;
	height: auto;
	z-index: 0;
}










.text_stridesense {
  /*width: 600px;*/
  height: 60px;
  font-family: Servetica;
  font-size: 50px;
  font-weight: 900;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #000000;
  text-align: center;
}

.text_stridesense_strapline {
	/*width: 375px;*/
	margin-top: 15px;
  height: 16px;
  font-family: MontserratExtraBold;
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #000000;
  text-align: center;
}

.text_sense_analyse_excel {
  /*width: 600px;*/
  height: 29px;
  font-family: MontserratExtraBold;
  font-size: 24px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #000000;
  text-align: center;
}

.text_in_the_box {
  /*width: 600px;*/
  height: 29px;
  font-family: MontserratExtraBold;
  font-size: 24px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #000000;
  text-align: center;
}


/*.tableMobile {
	visibility: visible;
	display: block;
}*/

.in_the_box_table {
  padding-bottom: 50px;
}

/*.tableNormal {
	visibility: hidden;
	display: none;
	top: 15%;
	bottom: 25%;
}*/

.row {
  display: flex;
}

.column {
  flex: 15%;
  padding: 5px;
}

.row_text {
  /*display: flex;
  line-height: 14px;*/
}

/*.product_carousel {
	height: 80%;
}*/

#SS_app_Title {
	padding-bottom: 25px;
}

#metrics_section {
	padding-top: 25px;
}


.Icon-Labels {
  width: 191px;
  height: 44px;
  /*font-family: Montserrat;*/
  font-family: MontserratMedium;
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #000000;
  text-align: center;
	display: block;
	margin: auto;
}
.RuiningLegs {
  margin-top: 5vh;
  text-align: center;
  vertical-align: middle;
  color: #00ffff;
}

.text_stopwatch {
	margin-top: 10vh;
	height: 276px;
  font-family: Servetica;
  font-size: 100px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: rgba(0, 0, 0, 0.05);
	
}

.InTheBox {
	/*position: absolute;
	float:right;
    margin-right:100px;
    clear:both;	
	right: 120px;
	top: 52px;
    display: inline-block;
    width: 74px;
    height: 17px;
    font-family: Montserrat;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;*/
	display: none;
}

.TechSpecs {
	/*position: absolute;
	float:right;
    margin-right:100px;
    clear:both;	
	right: 240px;
	top: 52px;
    display: inline-block;
    width: 78px;
    height: 17px;
    font-family: Montserrat;
    font-size: 14px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: normal;
    letter-spacing: normal;
    color: #ffffff;*/
	display: none;
}

.HamburgerMenu {
	
}

.HamburgerStripe {
	width: 24px;
  height: 2px;
  background-color: #158eda;
}

.Preorder_Menu_Button {
  width: 100px;
  height: 40px;
  /*right: 10px;*/
}
#attisNavbarLogo {
	/*filter: invert(1);*/
}


#preorder_title {
	/*font-family: MontserratExtraBold;*/
	font-size: 40px;
	font-weight: normal;
	font-stretch: normal;
	font-style: normal;
	line-height: normal;
	letter-spacing: normal;

	color: #394A59; /* GREY */
	text-align: left;
	position: absolute;
	top: 0%;
	left: 0;
	right: 0;
	margin: auto;
    left: 12%;
}

#preorder_text {
  margin-top: 60px;
}

#preorder_textb {
  margin-top: 90px;
 height: 5px;
}

#preorder_textc {
  margin-top: 140px;
 height: 5px;
}

#preorder_textd {
  margin-top: 200px;
 height: 5px;
}




#preorder_sizeguide {
  position: absolute;
  left: 64%;
  text-align: left;
  width: 290px;
  margin-top: 300px;
  font-family: MontserratMedium;
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #000000;
  left: 12%;
}

#preorder_btn {
 /* position: absolute;
  left: 64%;
  
  width: 137px;
  height: 41px;
  border-radius: 100px;
  background-color: #158eda;*/

  /*margin-top: 360px;*/
  /*top: 360px;*/
   /*left: 10%;*/
}



#order_alert {
	/*opacity: 0;
	display: none;
  position: absolute;*/
  /*left: 64%;*/
  /*top: 125%;*/
  text-align: left;
  width: 300px;
  /*height: 66px;*/
 /* font-family: Montserrat;*/
  font-family: MontserratMedium;
  /*font-size: 13px;*/
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  /*color: #FF0000;*/
  color: #EA7124; /* ORANGE */
  margin-left: 5%;
 /* margin-top: 430px;*/
}

/*.page_06 {
	padding-bottom: 500px;
	index-z: 400;
}*/


/*.page_06 {*/
  /*height: 500px;*/
/*}*/

.page_07 {
	/*margin-top: 100px;*/
	/*padding-bottom: 500px;*/
}

#mc_embed_signup {
	/*margin-top: 180px;*/
}

/*#po_box {
	padding-top: 225%;
}*/

#preorder_btn {
	margin-left: 25px;
}

#hello_text {
	margin-top: 5px;
}

.video_container {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 80%;
}

#youtube {

  width: 280px;
  height: 158px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}







.Xtra_Page_Title {
	font-size: 30px;
	/*margin-top: 5%;*/
}

.Profile_Title {
  font-size: 40px;
  text-align: center;
  padding-left: 75px;
}

.Xtra_Page_Subtitle {
    font-size: 20px;
}

.Xtra_Page_Paragraph {
  margin-left: 5%;
  margin-right: 5%;
  font-size: 14px;
}

#why_midimage {
	width: 80%;
}

#brand_ambasador_profile_pic {
	width: 40%;
}

.Xtra_Page_Paragraph_About {
	/*margin-left: 20px;
	margin-right: 20px;*/
	
	padding-left: 15px;
	padding-right: 15px;
}



.preorder_header {
  margin-left: 25px;
  margin-bottom: 15px;
}

.preorder_content {
  margin-left: 25px;
  margin-right: 25px;
  margin-bottom: 15px;
}

#preorder_dropdown {
  margin-left: 25px;
  margin-bottom: 15px;
}

/*#attis_logo_full {
	padding-bottom: 20px;
}*/

/* NAVIGATION BAR */






#sensor2 {
    /*left: 9%;*/
}



/* ======================= FOOTER ======================= */ 

.footer {font-size: 10px; display: none;}
#faq {display: none;}
#why {display: none;}

.knockout-text-container text {
    font-size: 120px;
}

#text_ready {
    /*transform: scaleY(50%);*/
    font-size: 142px;
}

#text_go {
    /*transform: scaleY(50%);*/
    font-size: 66px;
}



/*#video2 {
    height: 10%;
}*/

/*.ContactOurSalesTeam_Button {

	float: left;
	left: 50%;
    transform: translateX(25%);
  }*/

/* Mobile: centre the CTA button */
@media (max-width: 767px) {
    .ContactOurSalesTeam_Button {
      /*float: none;              
      display: block;           
      margin: 16px auto;       */ 
    }
  }




  #last_button {
    /*margin-top: 20vh;*/
/*margin-left: 50%;
margin-right: 50%*/
/*margin: 0 auto;
    float: left;*/

    top: 120%;
    -ms-transform: translate(0%, 0%);
    transform: translate(-50%, 250%);
  }