/*#place_input, #place_input:focus { 
   font-size: 2.5em; 
   background-color: #cdcdcd; 
   color: #222222; 
   border: none;
   outline: none;

   width: 100%; 
   margin-top: 2%; 
   font-size: 2.5em;
   text-align: center; 
   background:transparent;opacity: 0.6;
}*/

@font-face {
  font-family: "Graphik-Black";
  src: url('/fonts/Graphik-Black.otf'); 
}
@font-face {
  font-family: "Graphik";
  src: url('/fonts/Graphik-Regular.otf'); 
}
@font-face {
  font-family: "Graphik-Medium";
  src: url('/fonts/Graphik-Medium.otf'); 
}
@font-face {
  font-family: "Graphik-Semibold";
  src: url('/fonts/Graphik-Semibold.otf'); 
}

.mybtn:hover, .mybtn:focus, .mybtn:active, .mybtn.active, .open .dropdown-toggle.mybtn {
  /*background-color: #555555;*/
    background-color: #aaaaaa;
}

.mybtn
{
  background-color: white;
  color:black;
}

* {
  
   font-family: "Graphik";
  /* overflow: hidden ! important ;
    /*outline: none;*/ 
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: black;
}
::-moz-placeholder { /* Firefox 19+ */
  color: black;
}
:-ms-input-placeholder { /* IE 10+ */
  color: black;
}
:-moz-placeholder { /* Firefox 18- */
  color: black;
}
/*
input[type="text"]{
background-color:transparent !important;
text-decoration: none;
border-bottom: 1px solid black;
 
}*/
.icon{
  display:inline-block; /* chrome-fix */
  background:transparent;
  order: none;
  outline: none;
  border: none;
  fill:none;

  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.iconBlack {
  stroke:black; 
}

.iconBlack:hover { 
  /*fill:black;*/
  stroke:white;
}

.iconShare {
  fill:black;
/*  padding:1%;
  margin:1%;*/
}

.iconShare:hover {
  fill:#fff;
  /*border:0.1px;*/
  opacity:1.0;
}

.closeCross{
  stroke:#999;
  position: absolute;
  right:30px;
  top:30px;
}
 
.closeCross:hover{
  stroke:white;
}

.crossSvg{  
  width:2.8vw;
}

.popup-div {
  z-index: 4000;
  position: absolute;
  top: 0;
  
  margin: 0;
  padding: 0;
  list-style: none;

     
 
    /*overflow: auto;*/
   
  /*   width: 200px;
    height: 300px; */
  /*overflow: auto;*/
}
p{
margin: 0 0 0;
}
.scorllContent{
  
 margin:auto;
 font-size:4rem;
  margin:15vh 35px 5vh 35px;    
    /*transform: translateY(-250px);*/
  overflow-y: auto ! important ;
    /*background: #222;*/
 
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition: all 0.4s ease 0s;
  -ms-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;

}
.scorllContent p{
  font-size: 4.0rem;
  padding-left: 20vw;
  padding-right: 20vw;
  font-family: "Graphik";
  color:white;
  margin-bottom: 0px;
  letter-spacing: 2px;
}
.scorllContent  br {
  display: block;
  content: " ";
  height:3.0rem;
 }
/* the scrollbar area itself */
.scorllContent::-webkit-scrollbar {
  width: 12px;
 
}
.popTitle{
  font-size: 4.4rem ! important;
}
 .scorllContent a{
   color:white;
   font-family: "Graphik";
   text-decoration: underline;
 }
 
.scorllContent::-webkit-scrollbar-track {
    
  border:6px solid transparent;
  
  background-clip: content-box;  
}
 
.scorllContent::-webkit-scrollbar-thumb {
   
  background-color:  grey;
  border: 4px solid transparent;  
  background-clip: content-box;      
}

.scorllContent:hover::-webkit-scrollbar-thumb {
  background-color: white;
    
}

#input_form{
font-family: "Graphik-Black";
 
width:100%;
z-index: 100;
align:center;
position: fixed; 
text-align: center;
vertical-align: middle;
background-color: none; 
color: black; 
border: none;
outline: none;
margin-top:21vh;
margin-right:0;
font-size:4.0vw;
 
}
 

#place_input, #place_input:focus{ 
  width:100%;
  border: none;
  outline: none;
  text-align: center;  
  border-bottom:2px solid black;
  background-color: transparent; 
  text-decoration: none;
  border-radius:0px;

}

#input_form button.icon{
  vertical-align: middle;
  text-align:left;
  border: none;
  background: transparent;
  margin-top: 0px;
  margin-left: 0px;
  color: #11ff11;
  opacity: 1;
  
  -webkit-transition: all .55s ease;
  -moz-transition: all .55s ease;
  -ms-transition: all .55s ease;
  -o-transition: all .55s ease;
  transition: all .55s ease;
}

#adjust_form {
font-family: "Graphik";
width:100%;
z-index: 100;
position: fixed;  
text-align:center;
vertical-align: middle;
background-color: transparent; 
/*background-color: white;  */
padding:1% 2% 1% 2%;

border: none;
outline: none;
opacity: 0.8;
margin:auto;
bottom:1vh;

height:200px;
min-height: 200px;
font-size: 2.0rem; 
}

#adjust_form a{
color:black;
padding-left:0px !important;
padding-right:0px;
margin: auto ;
text-decoration: none;
font-size:1.5rem;
}
.buttonClass{
   padding-left:4px;
   padding-right:15px;
   padding-top:120px;
  font-size: 1.5rem; 
  font-family: "Graphik";
 
}

.shareClass{
  padding-left:15px;
  padding-right:5px;
  padding-top:60px;
 
}

.mainButton{
  width:90%;
  height:30px;
  left:0%;
  background: transparent;
  color:black;
  border: 2px solid;
  border-radius: 2vw;
  outline:none;

}
.adjust-width{
 width:80%;
 padding-left: 10%;
 
}

 
.mainButton:hover{
   color:white;
  
}

.shpButton{
  height:40px;
  font-size: 1.5rem;
  width:60%;
  left:0%;
  color:white;
  border-radius: 2vw;
    -webkit-transition: all .55s ease;
  -moz-transition: all .55s ease;
  -ms-transition: all .55s ease;
  -o-transition: all .55s ease;
  transition: all .55s ease;
 
}
.shpButton:hover{
    color:#777777;
    /*background:black;*/
}
#goSvg{
    width:18%; 
    position: absolute;
    top:30%;  
    left: -10px;
}
#faq-toggle {
    z-index: 2000;
    position: fixed;
    top: 0;
    right: 0;
    padding-right:35px;
    padding-top:30px;
    padding-left: 0px;
    fill:black;
    stroke:none;
}

#faq-toggle :hover { 
   fill:white;
}

#about-toggle {
    z-index: 2000;
    position: fixed;
    top: 0;
    left: 0;
    padding-right:25px;
    padding-top:35px;
    padding-left:45px;
    fill:black;
}

#about-toggle :hover { 
   fill:white;
}

#about-toggleSvg{
  width:5.5vmax;
}
#faq-toggleSvg{
  width:1.3vmax;
}
.inputCol{
  padding-left:15px;padding-right:15px;

}
input[type="radio"] {
    display:none;

}
input[type="radio"] + label {
    
    font-family:Arial, sans-serif;
    font-size:14px;
}
input[type="radio"] + label span {
    display:inline-block;
    width:25px;
    height:25px;
    margin:8px auto 8px auto;
    vertical-align:middle;
    cursor:pointer;
    
}

input[type="radio"] + label span {
     background-color:transparent;
     fill:black;
     fill-opacity:0.2;
}

input[type="radio"]:checked + label span{
     fill:black;
     fill-opacity:1.0;
}

input[type="radio"] + label span,
input[type="radio"]:checked + label span {
  -webkit-transition:background-color 0.4s linear;
  -o-transition:background-color 0.4s linear;
  -moz-transition:background-color 0.4s linear;
  transition:background-color 0.4s linear;
}
input[type="radio"]+ label span :hover  {
  fill:white;
 
  -webkit-transition:background-color 0.4s linear;
  -o-transition:background-color 0.4s linear;
  -moz-transition:background-color 0.4s linear;
  transition:background-color 0.4s linear;
}

#twiiterShareSvg{
width:1.9vmax;
max-width:35px;
}
#fbShareSvg{
width:1.9vmax;
max-width:35px;
}

@media ( max-width: 1450px)  {
  #adjust_form {
  bottom:1.5vh;
  height:18vh;
  min-height: 170px;
  font-size: 1.5rem; 
  }
  #input_form {
  font-size:5vw;
  }
  #goSvg{
    width:18%;    
  }

  .buttonClass{
   padding-left:10px;
   padding-right:5px;
   padding-top:120px;
   font-size: 1.5rem; 
 
  }
  .shareClass{
  padding-left:  5px;
  padding-right: 0px;
  padding-top:60px;
  }
 .mainButton{
    height:30px;
    width:100%;
    border-radius: 35px;
  }
  .shpButton{
    height:40px;
    width:70%;
  }
  #about-toggle {
    padding-top:30px;
    padding-left:30px;
 
  }
  #about-toggleSvg{
  width:7vmax;
  }
  #faq-toggle {
    padding-right:25px;
    padding-top:30px;
  
  }
  #faq-toggleSvg{
  width:1.5vmax;
  }
  #twiiterShareSvg{
  width:4vmax;
  max-width:28px;

  }
  #fbShareSvg{
  width:4vmax;
  max-width:28px;
  }
  .scorllContent p{
  font-size: 2.5rem;
  padding-left: 15vw;
  padding-right: 15vw;
 
  } 
  .scorllContent  br {
  display: block;
  content: " ";
  height:1.8rem;
 }
  .popTitle{
  font-size: 3.0rem ! important;
 
  }
}

@media ( max-width: 1024px)  {
  #adjust_form {
  bottom:1.5vh;
  height:18vh;
  min-height: 170px;
  font-size: 1.5rem; 
  }
  #input_form {
  font-size:4.8vw;
  }
  #goSvg{
    width:18%;    
      top:40%;   
  }
 
  .buttonClass{
   padding-left:10px;
   padding-right:5px;
   padding-top:120;
   font-size: 1.5rem; 
 
  }
  .shareClass{
  padding-left:  5px;
  padding-right: 0px;
  padding-top:60px;
  }
 .mainButton{
    height:30px;
    width:100%;
    border-radius: 35px;
  }
  .shpButton{
    height:40px;
    width:70%;
  }
  #about-toggle {
    padding-top:30px;
    padding-left:30px;
 
  }
  #about-toggleSvg{
  width:7vmax;
  }
  #faq-toggle {
    padding-right:25px;
    padding-top:30px;
  
  }
  #faq-toggleSvg{
  width:1.5vmax;
  }
  #twiiterShareSvg{
  width:4vmax;
  max-width:28px;

  }
  #fbShareSvg{
  width:4vmax;
  max-width:28px;
  }
  .scorllContent p{
  font-size: 2.5rem;
  padding-left: 15vw;
  padding-right: 15vw;
 
  } 
  .scorllContent  br {
  display: block;
  content: " ";
  height:1.8rem;
 }
  .popTitle{
  font-size: 3.0rem ! important;
 
  }
}

/*@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 2){

  #input_form {
  font-size:1vw;
  }

  .mainButton{
    height:30px;
    width:100%;
    border-radius: 35px;
  }
}*/


/*@media only screen 
and (min-device-width : 1024px) 
and (max-device-width : 1366px) {
 
}*/

@media only screen 

and (min-device-width : 1024px)
and( min-device-height : 1366px)
{
 
  #adjust_form {
   
    height:175px;
    bottom: 2vh;

  }
  .buttonClass{
   padding-left:10px;
   padding-right:5px;
   padding-top:120px;
   font-size: 1.5rem; 
 
  }
  .shareClass{
  padding-left:  5px;
  padding-right: 0px;
  padding-top:60px;
  }
 .mainButton{
    height:30px;
    width:100%;
    border-radius: 35px;
  }
  .shpButton{
    height:40px;
    width:70%;
  }

}

@media ( max-width: 768px) {
  #adjust_form {
  min-height: 180px;
  height: 20vmax;
  bottom: 0.1vh;
  }
  #input_form{
  font-size:4.5vmin;
  }
  #goSvg{
    width:20%; 
    
  }
  .buttonClass{
   padding-top:12vh;
   padding-bottom:8%;
  }
  .shareClass{
    padding-top:6vh;
    padding-left:0vw;
  }
  #about-toggle{
    padding-top:25px;
    padding-left:35px;
  }
  #about-toggleSvg{
  width:6vmax;
  }
  #faq-toggle{
    padding-top:25px;
    padding-right:30px;
  }
  .mainButton{
    height:30px;
    width:85%;
    border-radius: 35px;
  }
 .shpButton{
    height:40px;
    width:90%;
  }
  #twiiterShareSvg{
  width:4.5vmax;
  max-width:32px;

  }
  #fbShareSvg{
  width:4.5vmax;
  max-width:32px;
  }
  .scorllContent{
  font-size:3rem;
  margin:80px 35px 5vh 35px;    
  }
  .scorllContent p{
    font-size: 3.0rem;
    padding-left: 3vw;
    padding-right: 5vw;
 
  }
 .scorllContent  br {
  display: block;
  content: " ";
  height:2.0rem;
 }
  .popTitle{
    font-size: 3.2rem ! important;
  }
 .crossSvg{  
    width:30px;
  }
}
@media ( max-width: 736px) {
  #adjust_form {
  min-height: 175px;
  height: 22vmax;
  bottom: 0vh;
  }
  #adjust_form a{
  font-size: 1.3rem;
  }
  #input_form{
  font-size:6vw;
  }
  .buttonClass{
  padding-top:7%;
  }
  .shareClass{
    padding-top:5px;
    padding-left:4vw;

  }
  #goSvg{
    width:35%; 
    top:30%;  
  }
  .buttonClass{
    padding-top:5px;
    padding-bottom:23px;
    font-size: 1.3rem;
  }
  .shpButton{
    height:30px;
    width:50%;
  }
  #about-toggleSvg{
  width:8vmax;
  }
   
  .mainButton{
    height:30px;
    width:85%;
    border-radius: 35px;
  }
  #twiiterShareSvg{
  width:4.5vmax;
  max-width:35px;

  }
  #fbShareSvg{
  width:4.5vmax;
  max-width:35px;
  }
   .scorllContent p{
    font-size: 2.0rem;
 
 
  }
.scorllContent  br {
  display: block;
  content: " ";
  height:1.5rem;
 }
 .adjust-width{
 width:90%;
 padding-left: 5%;
 
}
.adjust-width{
 width:90%;
 padding-left: 5%;
 
}
} 

@media ( max-width: 414px) {
  #adjust_form {
  min-height: 200px;
  bottom: 2vmax;
  height: 25vmax;
  }

  #shapeways-wrapper p{

  font-size: 1.5rem;
  }

  #input_form{
  font-size:5.6vmin;
  margin-top:14vh;
  }
  .buttonClass{
      padding-top:5px;
      padding-bottom:30px;
  }
  .shareClass{
     padding-top:4%;
     padding-left:2.5vw;
     padding-right:10px;
  }
  .mainButton{
      height:30px;
      width:95%;
      border-radius: 24px;
  }
  #goSvg{
    width:35%; 
    top:25%;
  }
  #about-toggleSvg{
  width:8vmax;
  }
  #about-toggle {
    padding-left:25px;
    padding-top:20px;
  
  }
  #faq-toggle {
    padding-right:20px;
    padding-top:20px;
  
  }
 
  input[type="radio"] + label span {
 
    width:30px;
    height:30px;
    margin:8px auto 8px auto;
  
  }
  #twiiterShareSvg{
  width:4.5vmax;
  max-width:40px;
 
  }
  #fbShareSvg{
  width:4.5vmax;
  max-width:40px;

  }

  .scorllContent{
  
  margin:80px 20px 5vh 20px;    
  }
  .scorllContent p{
    
    padding-left: 3vw;
    padding-right: 10vw;
 
  }

  .popTitle{
    font-size: 2.4rem ! important;
  }
  .closeCross{
  right:20px;
  top:20px;
  }
  .crossSvg{  
    width:30px;
  }
  .shpButton{
    width:100%;
  font-size: 1.2rem;
  }

  .adjust-width{
  width:85%;
  padding-left: 15%;
 
  }
} 

@media ( max-width: 360px) {
  #adjust_form {
 
  bottom: 1vmax;
 
  }

  #shapeways-wrapper p{

     font-size: 1.5rem;
  }
  
  #input_form{
  font-size:6vmin;
  }
  #goSvg{
    width:15%; 
    top:-15px;
    left:-30px;
  }
/*  .inputCol{
  padding-left:5px;
  padding-right:5px;
  }*/
  .buttonClass{
      padding-top:11%;
      padding-bottom:23%;
       font-size:3.4vmin;
  }
  .shareClass{
     padding-top:6%;
     padding-left:5px;
  }

  .shpButton{
    width:100%;
    font-size: 1.2rem;
   }

  .adjust-width{
    width:85%;
    padding-left: 15%;
  }

} 

#verticalScale  {
    padding-left:auto;
    padding-right:auto;
    height:100px;
    width:2.2px;
    border:none;
    background-color:rgba(0,0,1,0.2);
    margin:20px auto 0 auto;
}

#verticalScale .ui-widget-header{
  background-image:none;
  background-color:black;
  border-radius: 15px;
  
 }

#verticalScale .ui-slider-handle {
    background: black;
    width:16px;
    height:16px;
    border-radius: 16px;
    left: -7.0px;
    border:black;
    outline: none;
   
}
 
input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; }  
input:focus::-moz-placeholder { color:transparent; }  
input:focus:-ms-input-placeholder { color:transparent; }