
/****************************************************************************************************************
ATF
****************************************************************************************************************/

/* Logo */

.logo-line{fill:none;stroke:#4d4d4d;stroke-width:2.5;stroke-linecap:round;stroke-miterlimit:10;}

 
.shape-buy-button, .shape-watch-button {
  border: 2px solid rgba(77,77,77,1);
  color:#4d4d4d;
  background-color:transparent;
  font-family: "Uniform-Medium";
  font-size:0.9em;
  letter-spacing: .1em;
}

.shape-buy-button-white{
  background: linear-gradient(135deg,#ff5e57,#ff5e57,#ff5e57,#ffac46);
  margin-right:2px;
  font-family: "Uniform-Medium";
  color:#FFF;
  border: 2px solid rgba(255,255,255,1);
  border:none;
  transition: 1s;
  border-radius: 50px;
  background-size: 100%;
}

/* Top */

.tech-abt-top{
  background-color:#dadada;
  min-height:3vw;
}

/* Image */

.tech-abt-img{
  background-color:#dadada;
}

/* ABT Text */

.tech-title-column {
  background-color:#dadada;
  padding-bottom:3rem;
}

h1.tech-title {
  font-family: "Uniform";
  font-size:2.5rem;
  text-transform: uppercase;
  color:#4D4D4D;
}

h2.tech-title {
  font-family: "Uniform-Light";
  font-size:1.7rem;
  color:#4D4D4D;
}



@media screen and (max-width: 750px) {

  .tech-abt-top{
    min-height:13vw;
  }

  .tech-title-column {
    background-color:#dadada;
    padding-top:2rem;
    padding-bottom:3rem;
  }

  div.tech-abt-img{
    min-height:70vw;
    height:70vw;
    position:relative;
    overflow:hidden;
  }

  img.tech-abt-img{
    position:absolute;
    left:-25%;
     width:auto;
	   max-width:150%;
	   height:auto;
  }

  h1.tech-title {
    font-family: "Uniform-Light";
    font-size:2rem;
    color:#4D4D4D;
  }

  h2.tech-title {
    font-family: "Uniform-Light";
    font-size:1.3rem;
    color:#4D4D4D;
  }

  p{
    font-size:1em;
  }

}

@media screen and (max-width: 320px) {

  p {
    font-size:0.8em;
  }
  }

/****************************************************************************************************************
ROBOTIC ARM
****************************************************************************************************************/


/* Arm specs*/

#arm-specs-row{
  background-color:#dadada;
}

div.arm-specs {
  background-color :#dadada;
  font-family:"Uniform";
  padding-bottom:4rem;
}

h2.arm-specs{
  font-family: "Uniform-Light";
  text-transform: uppercase;
  /*color:#4D4D4D;*/
}

h4.arm-specs{
  font-family:"Uniform-Light";
}

p.arm-specs{
  padding-left:1rem;
  padding-right:1rem;
}

#orbit-icon, #ext-icon, #tilt-icon{
  width:100px;
  height:70px;
}

@media screen and (max-width: 1024px) {

  div.arm-specs {
    padding-bottom:2rem;
  }
  #arm-specs-row{
    padding-bottom: 2rem;
  }

}

/****************************************************************************************************************
SENSOR HEAD
****************************************************************************************************************/


h2.sensor-side {
 font-family: "Uniform-Light";
 color:#FFF;
}

h2.sensor-title{
  font-family: "Uniform-Light";
  color:#4d4d4d;
  padding-top:2rem;

}

p.sensor-specs{
  padding-left:1rem;
  padding-right:1rem;
}

#scanning, #camera, #speaker{
  width:80px;
  height:80px;
}

#sensor-side-row{
  background-color:#393939;
}

#sensor-specs-row{
  background-color:#FFF;

}

#sensor-annotations-mobile{
  display:none;
}

div.sensor-specs {
  background-color :#FFF;
  font-family:"Uniform";
  padding-bottom:4rem;
}

h2.sensor-specs{
  font-family: "Uniform-Light";
  text-transform: uppercase;
  /*color:#4D4D4D;*/
}

h4.sensor-specs{
  font-family:"Uniform-Light";
}

div.sensor-front{
  background-color:#393939;
}

div.sensor-note{
  position: absolute;
  top:0.7vw;
}

@media screen and (max-width: 1024px) {

  div.sensor-specs {
    padding-bottom:2rem;
  }

  #sensor-specs-row{
    padding-bottom: 2rem;
  }

  p.sensor-specs{
    padding-left:1rem;
    padding-right:1rem;
  }
}

@media screen and (max-width: 750px) {


  #sensor-annotations-mobile{
    display:inline;
  }

  #sensor-annotations{
    display:none;
  }

  div.sensor-note{
    position: absolute;
    top:10px;
  }


  div.sensor-side{
    min-height:82vw;
    height:82vw;
    position:relative;
    overflow:hidden;
  }

  #sensor-side-img{
    position:absolute;
    left:-25%;
    width:auto;
	  max-width:150%;
	  height:auto;
  }

  div.sensor-front{
    min-height:82vw;
    height:82vw;
    position:relative;
    overflow:hidden;
  }

  #sensor-front-img{
    position:absolute;
    left:-20%;
    width:auto;
	  max-width:140%;
	  height:auto;
  }

}

@media screen and (min-width: 1400px) {

  #sensor-annotations{
    position:absolute;
    width:1400px;
    height:800px;
    margin-left:auto;
    margin-right:auto;
    right:0;
    left:0;
  }

  div.sensor-note{
    position: absolute;
    top:0px;
  }

}


/****************************************************************************************************************
BASE
****************************************************************************************************************/

div.background-da{
  width:100%;
  background-color:#dadada;

}

div.base-top{
  background-color:#dadada;
}

div.base-specs {
  background-color :#dadada;
  font-family:"Uniform";
  padding-bottom:4rem;
}

h2.base-specs{
  font-family: "Uniform-Light";
  text-transform: uppercase;
  /*color:#4D4D4D;*/
}

h4.base-specs{
  font-family:"Uniform-Light";
}


p.base-specs{
  padding-left:1rem;
  padding-right:1rem;
}

h2.base-title{
  font-family: "Uniform-Light";
  color:#4d4d4d;
  padding-top:2rem;

}

#weight, #battery, #cord {
  width:70px;
  height:70px;
}

@media screen and (max-width: 1024px) {

  div.base-specs {
    padding-bottom:2rem;
  }
  #base-specs-row{
    padding-bottom: 2rem;
  }

}

/****************************************************************************************************************
MECH SPECS
****************************************************************************************************************/


div.mech-specs {
  background-color :#FFF;
  font-family:"Uniform";
  padding-top:4rem;
  padding-bottom:0rem;
}

h2.mech-title{
  font-family: "Uniform-Light";
  text-transform: uppercase;
  /*color:#4D4D4D;*/
}

@media screen and (max-width: 750px) {

  div.mech-specs {
    background-color :#FFF;
    font-family:"Uniform";
    padding-top:2rem;
    padding-bottom:0rem;
  }

}


/****************************************************************************************************************
FEET
****************************************************************************************************************/

div.feet{
  position:relative;
}

img.feet{
  z-index:10;
  position:relative;
}

#feet-background-left{
  position:absolute;
  background-color:#cbcbcb;
  width:50%;
  height:100%;
  left:0px;
  top:0px;
  z-index:3;

}

#feet-background-right{
  position:absolute;
  background-color:#dadada;
  width:50%;
  height:100%;
  right:0px;
  top:0px;
  z-index:3;
}

/****************************************************************************************************************
SUMMARY / GENERAL SPECS
****************************************************************************************************************/

h2.summary{
  text-transform: uppercase;
  font-family: "Uniform-Light";
  padding-top:3rem;
}

ul.no-bullets-tech {
    list-style-type: none;
    padding-top:0px;
    padding-left:20px;
    padding-bottom:80px;
    margin-bottom: 0rem;
}

li h4.tech-icon{
  font-family: "Uniform";
  padding-top:20px;
}

li {
  padding-top:30px;
}

li.general-specs svg{
    margin-right: 15px;
    float: left;
    height:70px;
    width:70px;
}

@media screen and (max-width: 1024px) {


  #general-specs-mobile{
    width: 50vw; /*can be in percentage also.*/
    height: auto;
    margin: 0 auto;
    position: relative;

  }
  ul.no-bullets-tech {
      list-style-type: none;
      padding: 0px 0px 0px 0px;
  }

  #general-specs-row {
    padding-bottom:50px;
  }

}

@media screen and (max-width: 700px) {

  img.tech-specs-above {
    position:absolute;
    max-width:700px;
    min-height:500px;
    margin-left:-350px;
    margin-top:0px;
}



  #general-specs-mobile{
    width: 80vw; /*can be in percentage also.*/
    height: auto;
    margin: 0 auto;
    position: relative;
  }

  ul.no-bullets-tech {
      list-style-type: none;
      padding: 0px 0px 0px 0px;
  }

  #general-specs-row {
    padding-bottom:50px;
  }

}

@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px)
and (orientation : portrait) {

  h1.tech-title {
    margin-bottom:0px;
  }

 }


/*Mecha*/

h2.mech-tech{
  font-family: "Uniform-Light";
  color:#4D4D4D;
  padding-left:7.2vw;
}

/****************************************************************************************************************
DISCLAIMER
****************************************************************************************************************/


div.disclaimer {
  font-family:"Uniform";
  padding-bottom:4rem;
}

h2.disclaimer{
  font-family: "Uniform-Light";
  padding-bottom: 1rem;
  text-transform: uppercase;
}

h4.disclaimer{
  font-family:"Uniform-Light";
}


p.disclaimer{
  padding-left:1rem;
  padding-right:1rem;
}
