header, footer {
    background-color: white; /*lightgray;*/
    /*border: 1px solid black;*/
    padding: 0px;
    min-height: 3rem;
    min-width:430px;
}
footer{
  margin:1rem;
}

/*header h1{
  color: #b2282d;
  font-size: 24px;
}*/

.main-container {
    padding: 10px 40px 40px 10px;
    margin-top:10px;

}
.existing-buttons a{
  text-decoration: none;
}
.existing-buttons h1{
    color: #b2282d;
    font-size:1.75rem;
    font-weight: bold;
    margin: 0 0 2rem 0;
    padding: 0;
    text-transform: uppercase;
}
.existing-buttons button{
    background-color: #4f5858;
    border: 0;
    color: #fff;
    padding: 0 1rem;
    text-transform: uppercase;
    /*margin-right:0.5rem;*/
    white-space: nowrap;
}
.existing-buttons .strong{
  background-color: #b2282d !important;
}
.existing-buttons .medium{
    font-size: 0.8rem !important;/*1rem*/
    height:  2rem !important;/*2.5rem*/
    line-height: 1rem !important; /*1rem*/
    min-width: 7rem;
}
.sticky-top {
    position:sticky;
    padding: 10px 10px;
    top:0;
    z-index:1020;
}

.results-container {
    min-width: 45vw;
    max-width: 600px;
}

#results-section {
    /*max-height: calc(100vh - 20px);*/
    min-height: 200px;
    width:100%;
}
.image-display h2{ /*.summary h2, */
  color:#b2282d;
  font-weight:bold;
  font-size:1.1rem;
  min-height:16px;
  margin-top:5px;
}


.clampSelection .table > thead tr{
  color:#b2282d;
  font-weight:bold;
  font-size:1.15rem;/*1.25*/
}


#results-section .table{
  width:80%;
}
#results-section .table tr{
 font-size:14px !important;
}
.table caption, .image-display h4{
  font-size:12px;
  font-weight:bold;
}
.image-display img{
  /*max-width:100%;
  height:85%;*/
  max-width:100%;
  min-height:315px;
  height:95%;
  box-shadow:  0 1px 2px rgba(0,0,0,0.07),
               0 2px 4px rgba(0,0,0,0.07),
               0 4px 8px rgba(0,0,0,0.07),
               0 8px 16px rgba(0,0,0,0.07),
               0 16px 32px rgba(0,0,0,0.07),
               0 32px 64px rgba(0,0,0,0.07);

}
.gripper-page .image-display img{
  box-shadow: rgb(50 50 93 / 25%) 0px 12px 2px -32px, rgb(0 0 0 / 30%) 0px 32px 32px -35px, rgb(10 37 64 / 35%) 0px -2px 6px 10px inset;
}

.panel {
    padding: 10px;
    border: 1px solid black;
    border-radius: 5px;
    background-color: #eeeeee;
    /*overflow-y:scroll;*/
}

.tab-heading {
    padding: 0px 0 0 10px;
    text-decoration: underline;
    font-weight: bold;
}

.question {
    padding: 10px 0px;
}

.question h3 , .clampSelection h3 {
    padding: 0px 0px 10px 20px;/*10px*/
    font-weight:bold;
    font-size:1.2rem;
}
.question h2{

  font-weight:bold;
  font-size:1.2rem;
  color:#B2282D;
  text-underline-offset: 3px;
  text-overline-offset: 3px;
  text-decoration: overline underline lightgray 5px ;



}

.question > .row {
    margin: 0 0 0 0px;
    font-weight: bold;
    white-space: nowrap;
}
.escapement-page .question > .row, .tool-changer-page .question > .row , .slides-page .question > .row {
  white-space: normal;
}
.input-button {
    border: 1px solid black;
    color: black;
    border-radius: 0;
    min-width:200px;
}

.input-button:hover {
    background-color: #ffb3b5;
    border: 1px solid black;
}

.btn-check:focus+.input-button, .input-button:focus{
    box-shadow:none !important;
    outline:0px !important;
}

.btn-check:active+.input-button, .btn-check:checked+.input-button, .input-button.active, .input-button.dropdown-toggle.show, .input-button:active {
    background-color: #B2282D;
    border: 1px solid black;
    color: white;
}
.form-label{
  font-weight: bold;
}
.form-control{
  margin-bottom:1rem;
}
.form-select{
  margin-bottom:1rem;
}

.nextPrev .btn{
  margin-bottom:0px;
  margin-right:1rem;
  font-size:0.9rem;
  white-space: nowrap;
}

.stepper{
  margin-left:0rem;
  margin-right:2rem;
  margin-bottom:2rem;
}
#step-3 .subquestion span, #upressure{

  font-size:0.8em;
  margin-left:0.5rem;
  margin-right:0.5rem;
  color:gray;
  align-self: center;
}

#compareBtn{
  padding:0.282rem 0.375rem ;
  max-height:2rem;
}
#preferedClamp, #option1, #option2{
  font-size:1.2rem;
  font-weight: normal;
  color:gray;
  text-decoration:underline;
  white-space: nowrap;
}
.submessage{
  white-space: nowrap;
}
.prevBtn,.nextBtn{
  min-width:7rem;
}

.question .submessage , .clampSelection .submessage{
  padding:0px 10px 10px 0px;/*10px*/
}
.question .submessage img, .clampSelection .submessage img{
  max-width:1.5rem;
  max-height:1.5rem;
}

/*************************MODAL**********************************/
.modal-dialog-scrollable .modal-content {
  max-height:80vh
}
.modal-body{
  background-color: #ffffff;/*#F4A7A3;*/
  padding-top:0;
}
.modal-body .table > thead tr{
  font-size:1rem;
  color:#B2282D/*#ff2e31;*/

}
.modal-body .table-bordered tbody tr th{
  font-size:0.9rem;
  border-width:2.4px;
}
.modal-body .table-bordered tbody tr td {
  font-size:1rem;
  text-align:center;
}
.modal-header,.modal-footer{
  background-color:lightgrey;/*#ffc6c6;*/
  font-weight:bolder;
  font-size:2rem;
  color:#B2282D;
}
.close-btn{
  box-shadow: 0px 1px 0px 0px #cf866c;
	background:linear-gradient(to bottom, #d0451b 5%, #B2282D 100%);/*bc3315*/
	background-color:#d0451b;
	border-radius:3px;
	border:1px solid #942911;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
  padding:0.28rem 0.32rem;
  font-size:0.977rem;
	text-decoration:none;
  margin-bottom:0.625rem;
}
.close{
  border:0;
  background-color: lightgrey;
}
.close img{
  width:2.5rem;
  height:2.5rem;
}
/*#table{
  border:0.5rem solid  #fbc4ab;
}*/
.modal-body .table-bordered{
    border:0.15rem solid lightgrey;
    margin-top:1rem;
  }
.modal-body  .table-bordered > thead > tr > th{
    border:0.15rem solid lightgrey;
}
.modal-body  .table-bordered > tbody > tr > td{
    border:0.15rem solid lightgrey;
}

#step-5{
  height:100vh;
  width:100vw;
}

/*******************************************************/
.tooltip-inner
{
    text-align: left;
    background:lightgrey;
    color:#b4282d;
    -webkit-box-shadow: 2px 2px 6px #b8b8b8;
    padding:0.5rem;
    border:0.1rem solid #b4282d;
    border-radius:5%;
    font-weight: bold;
    font-size:0.8rem;
    opacity: 1 !important;
}

.tooltip.bs-tooltip-right .tooltip-arrow::before {
    border-right-color: #b4282d !important;
}
.tooltip.bs-tooltip-left .tooltip-arrow::before {
    border-left-color: #b4282d !important;
}
.tooltip.bs-tooltip-bottom .tooltip-arrow::before {
    border-bottom-color: #b4282d!important;
}
.tooltip.bs-tooltip-top .tooltip-arrow::before {
    border-top-color: #b4282d!important;
}


/******************************************************************************/
/******************************************************************************/
.action-button {
	box-shadow: 0px 1px 0px 0px #cf866c;
	background:linear-gradient(to bottom, #d0451b 5%, #B2282D 100%);/*bc3315*/
	background-color:#d0451b;
	border-radius:3px;
	border:1px solid #942911;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
  padding:0.28rem 0.32rem;
  font-size:0.977rem;
	text-decoration:none;
  margin-bottom:0.625rem;
}
.action-button:hover {
	background:linear-gradient(to bottom, #bc3315 5%, #d0451b 100%);
	background-color:#bc3315;
}
.action-button:active {
	position:relative;
	top:1px;
}

.steps-form {
    position:relative;
    display: table;
    width: 100%;

}
.steps-form .steps-row {
    display: table-row;
}
.steps-form .steps-row:before {
    --widthA: 3.5rem;
    bottom: calc(var(--widthA) + 0.49vw);
    position: absolute;
    content: " ";
    width: 100%;
    height: 3px;
    background-color:#B2282D;
    z-index:-1;
   }
.steps-form .steps-row .steps-step {
    display: table-cell;
    text-align: center;
 }
.steps-form .steps-row .steps-step p {
    margin-top: 0.3rem;
    --offset: 0.15vw;
    font-size:calc(0.6rem + var(--offset) * 2 - 1px);
    white-space:nowrap;
    font-weight:bold;
  }

/*.steps-form .steps-row .steps-step button["disabled"] {
   opacity:5 !important;

 }*/

.steps-form .steps-row .steps-step .btn-circle , .steps-form .steps-row .steps-step .btn-circle-dark, .steps-form .steps-row .steps-step .btn-indigo,   .steps-form .steps-row .steps-step .error{
    --widthB: 0.6vw;
    border:3px solid #B2282D;
    padding:1.2rem 0.8rem;
    line-height: 1.428571429px;
    width:3rem;
    height:3rem;
    border-radius:100px;
    margin-top: 0;
    background-color:#B2282D;
    color:white;
    /*pointer-events: none;*/
  }
  .steps-form .steps-row .steps-step .error{
    background-color:gray!important;
  }

  .steps-form .steps-row .steps-step .btn-circle-dark{
      background-color:#ffffff;
      border-color:#B2282D;/*#9a9a9a*/
      pointer-events: none;
      color:#B2282D;
    }
    .steps-form .steps-row .steps-step .btn-indigo{
        background-color:#940000;
        border-color:#940000;
        color:white;
      }




/******************************************************************************/
/******************************************************************************/
.clampSelection{
  padding-left:0.8rem;
}
.selectionResults .table  > thead > tr > th{
    font-size:1.1rem;
    padding-top:0;
}

.selectionResults .table  > thead > tr > th .form-check{
  float:right;
}
.selectionResults .table   > tbody > tr{
  font-size:13px;/*0.875rem*/
  line-height:0.3rem;
}
.selectionResults .action-button{
  padding:0.28rem 0.32rem;
  font-size:0.977rem;

}
.selectionResults .table   > tbody > tr >td{
  text-align:right;
}

#err{
  color:#B2282D;
  font-size:1rem;
  margin-left:0.3rem;
  white-space: nowrap;
  vertical-align:super;
}
#error{
  width:30px;
  height:30px;
  margin-right:0.3rem;
  vertical-align:sub;
}
.help-text{
  border:2 solid #b4282d;
  object-fit:scale-down;
  box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px;

}
/***************************************************/


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

  #nextBtn0{
    margin-top:41rem;
  }
  .tool-changer-page #nextBtn0{
      margin-top:10.3rem;
  }
  #prevBtn0,#nextBtn1{
    margin-top:41rem;
  }
  #prevBtn1,#nextBtn2{
    margin-top:17.5rem;
  }
  #prevBtn2,#nextBtn3{
    margin-top:27.7rem;
  }
  .rotaries-page #prevBtn2, .rotaries-page #nextBtn3{
    margin-top:1rem;
  }
  .slides-page #prevBtn2, .slides-page #nextBtn3,.tool-changer-page #prevBtn2, .tool-changer-page #nextBtn3{
    margin-top:1rem;
  }

  .tool-changer-page #prevBtn3{
    margin-top:20rem;
  }
  .rotaries-page #prevBtn3{
    margin-top:31rem;
  }
  .tool-changer-page #prevBtn1,.tool-changer-page #nextBtn2 {
      margin-top:20rem;
  }

  #prevBtn3,#prevBtn4,#nextBtn4{
    margin-top:28rem;
  }
  .tool-changer #nextBtn4{
    margin-top:0;
  }
  .slides-page #prevBtn3{
    margin-top:30rem;
  }
  .gripper-page #nextBtn0{
    margin-top:8rem;
  }
  .rotaries-page #nextBtn0{
    margin-top:19rem;/*1*/
  }
  .slides-page #nextBtn0{
    margin-top:10rem;
  }
  .escapement-page #nextBtn0{
    margin-top:1rem;
  }
  .gripper-page #prevBtn0, .gripper-page #nextBtn1{
  /*, .rotaries-page #prevBtn0, .rotaries-page #nextBtn1{*/
    margin-top:8rem;
  }
  .rotaries-page #prevBtn0,.rotaries-page #nextBtn1{
    margin-top:0;
  }
  .slides-page #prevBtn0,.slides-page #nextBtn1, .escapement-page #prevBtn0,.escapement-page #nextBtn1, .tool-changer-page #prevBtn0,.tool-changer-page #nextBtn1{
    margin-top:0;
  }
  .gripper-page #step-0 .attribute label, .rotaries-page #step-0 .attribute label, .slides-page #step-0 .attribute label{
    white-space: nowrap;
  }

  .gripper-page #prevBtn1,.gripper-page #nextBtn2, .rotaries-page #prevBtn1,.rotaries-page #nextBtn2{
    margin-top:0;
  }
  .slides-page #prevBtn1,.slides-page #nextBtn2, .escapement-page #prevBtn1,.escapement-page #nextBtn2{
    margin-top:0;
  }
  .gripper-page #step-1 .attribute label, .rotaries-page #step-1 .attribute label,.slides-page #step-1 .attribute label{
    min-height:4rem;
  }
  /*.rotaries-page #step-2 .attribute label{
    min-height:2rem;
  }*/
  .slides-page #step-2 .attribute label{
    min-height:1rem;
  }
  .escapement-page #step-0 .attribute label{
    min-height:1.2rem;
  }
  .rotaries-page #step-1 .imageb label, .slides-page #step-1 .imageb label{
    white-space:nowrap;
    margin-bottom:0;
    min-height:2rem;
  }
  /*.rotaries-page #step-1 .image-button img{
    width:150px;
    height:150px;
    margin-top:1rem;
  }*/
  .rotaries-page #step-1 .image-button p{
    line-height:0.9rem ;
    white-space:nowrap;
    font-size:1rem;/*0.7*/
    padding:0.2rem;
   }
   .escapement-page #step-2 .lineHeightMin{
     line-height:0.95rem;
   }
   .escapement-page #step-2 .lineHeightMax{
     line-height:1.9rem;
   }
   .tool-changer-page .attribute label{
     min-height:1rem;
     margin-bottom:0;
   }

  /* .rotaries-page .modal-dialog-scrollable .modal-body {
     height:23rem;
   }*/

}
@media only screen and (min-width:1200px) and (max-width:1399px){
  #step-4 .madjust{
    margin-top:883px;
  }
  #step-4 .madjust2{
    margin-top:702px;
  }
  #step-2 .offset{
    --hA: 17.2rem;
    height: calc(var(--hA) + 0.1rem);
  }
  #step-0 .offset{
    --hA: 12.15rem;
    height: calc(var(--hA) + 0.1rem);
  }
  #step-1 .offset{
    --hA: 22.3rem;
    height: calc(var(--hA) + 0.1rem);
  }
  #step-3 .offset{
    --hA: 4.5rem;
    height: calc(var(--hA) + 0.1rem);
  }
  #step-4 .madjust3{
    margin-top:723px;/*190*/
  }
  .slides-page #prevBtn3{
    margin-top:10rem;
  }
  .gripper-page #step-0 .attribute label, .rotaries-page #step-0 .attribute label{
    white-space: wrap;
  }

   .rotaries-page #step-1 .attribute label{
    min-height:3.5rem;
  }
  /*.gripper-page #prevBtn0,.gripper-page #nextBtn1{
    margin-top:18rem;
  }*/

  .rotaries-page #step-1 .imageb label{
    white-space:nowrap;
    margin-bottom:0;
    min-height:2rem;
  }
  /*.rotaries-page #step-1 .image-button img{
    --varA:67px;/*75*/
  /*  width:calc(var(--varA) + 6vw);
    height:calc(var(--varA) + 6vw);*/
  /*}*/

  .rotaries-page #step-1 .image-button p{
    line-height:0.7rem ;/*0.9*/
    white-space:normal;/*nowrap*/
    font-size:0.7rem;
   }


  .rotaries-page #step-2 .dropdown>label, .rotaries-page #step-2 .dropdown > .input-group{
     max-width:90vw;
     white-space:normal;
   }
   .tool-changer-page #nextBtn0{
       margin-top:4rem;
   }
   .tool-changer-page .attribute label{
     min-height:1rem;
   }
   .tool-changer-page #prevBtn3{
     margin-top:20rem;
   }
   .slides-page #prevBtn3{
     margin-top:30rem;
   }
   .rotaries-page #prevBtn3{
     margin-top:31rem;
   }
   .rotaries-page #nextBtn0{
     margin-top:19rem;/*1*/
   }
   .rotaries-page #step-1 .image-button p{
     line-height:0.9rem ;
     white-space:nowrap;
     font-size:1rem;/*0.7*/
     padding:0.2rem;
    }
  /*  .rotaries-page .modal-dialog-scrollable .modal-body {
      height:23rem;
    }*/

}
@media only screen and (min-width:992px) and (max-width:1199px){
  .selectionResults .table  > tbody > tr{
      line-height:normal;
  }

  #step-2 .offset{
    --hA: 17.2rem;
    height: calc(var(--hA) + 0.1rem);
  }
  .question h2{
    white-space:normal;
    text-decoration:none;
  }
  #step-1 .offset{
    --hA: 22.3rem;
    height: calc(var(--hA) + 0.1rem);
  }
  #step-0 .offset{
    --hA: 12.15rem;
    height: calc(var(--hA) + 0.1rem);
  }
  #step-3 .offset{
    --hA: 1.1rem;
    height: calc(var(--hA) + 0.1rem);
  }
  .gripper-page #step-0 .attribute label, .rotaries-page #step-0 .attribute label{
    white-space: nowrap;
  }
  .rotaries-page #step-1 .attribute label{
    min-height:4rem;
    width:auto;
  }
  .rotaries-page #step-2 .attribute label{
    min-height:2rem;
    width:auto;
  }
  .rotaries-page #step-1 .image-button button {
    padding:0.4rem;
    white-space: normal;
    line-height:1rem ;
  }
  .rotaries-page #step-1 .imageb label{
    white-space:nowrap;
    margin-bottom:0;
    min-height:2rem;
  }
  .rotaries-page #step-1 .circularQ .form-label{
    min-height:0.5rem !important;
  }
  .rotaries-page #step-2 .dropdown > label, .rotaries-page #step-2 .dropdown >.input-group{
    max-width:100vw;
    white-space:normal;
  }
  .slides-page #prevBtn3, .escapement-page #prevBtn3, .tool-changer-page #prevBtn3{
    margin-top:10rem;
  }
  .escapement-page #step-0 .attribute label{
    min-height:1.5rem;
  }
  .tool-changer-page #nextBtn0{
      margin-top:4rem;
  }
  .tool-changer-page #prevBtn3{
    margin-top:20rem;
  }
  .slides-page #prevBtn3{
    margin-top:30rem;
  }
  .rotaries-page #nextBtn0{
    margin-top:14rem;/*1*/
  }
  /*.rotaries-page .modal-dialog-scrollable .modal-body {
    height:23rem;
  }*/
  .rotaries-page #prevBtn3{
    margin-top:30rem;
  }
  #agact,#agJawsNo{
    padding-left:0;
  }


}
@media only screen and (min-width:1138px) and (max-width:1199px){
  #step-4 .madjust{
    margin-top:739px;/*190*/
  }
  #step-4 .madjust2{
    margin-top:380px;
  }
  #step-4 .madjust3{
    margin-top:400px;/*190*/
  }
  #prevBtn2,#nextBtn3{
    margin-top:-0.8rem;
  }
  .gripper-page #step-0 .attribute label{
    white-space: normal;
    min-height:1.5rem;/*2*/
  }
  .rotaries-page #step-0{
      min-height:0rem;
      white-space: normal;
  }
  .gripper-page #prevBtn0, .gripper-page #nextBtn1{
    margin-top:15rem;
  }
  .rotaries-page .image-button p{
    font-size:10px;
  }
  /*.rotaries-page #step-1 .imageb label{
    white-space:nowrap;
    margin-bottom:0;
    min-height:2rem;
  }*/
  /*.rotaries-page #step-1 .image-button button {
    padding:0.5rem;
    white-space: normal;
    min-width:calc(var(--varB) + 5vw);
  }
  .rotaries-page #step-1 .image-button p{
    line-height:0.8rem ;
   }

  .rotaries-page #step-1 .image-button img{
    --varA:75px;
    width:calc(var(--varA) + 1vw);
    height:calc(var(--varA) + 1vw);
  }*/
  .rotaries-page #step-1 .circularQ .form-control{
    margin-bottom:0.5rem;
  }
  .rotaries-page #step-2 .dropdown > label, .rotaries-page #step-2 .dropdown > .input-group{
    max-width:90vw;
    white-space:normal;
  }
  .tool-changer-page #prevBtn3{
    margin-top:20rem;
  }
  .rotaries-page #step-1 .image-button p{
    line-height:0.7rem ;/*0.9*/
    white-space:normal;/*nowrap*/
    font-size:1rem;
   }
   .rotaries-page #step-1 .input-container button{
     border:2px solid black !important;
   }
   .rotaries-page #step-1 .input-container button:nth-child(2){
     border-top-style:none !important;
     border-bottom-style:none !important;
   }
   .rotaries-page #step-1 .input-container button:nth-child(3){
     border-bottom-style:none !important;
   }

}
@media only screen and (min-width:992px) and (max-width:1137px){
  #step-4 .madjust{
    margin-top:750px;/*190*/
  }
  #step-4 .madjust2{
    margin-top:279px;
  }
  #step-4 .madjust3{
    margin-top:313px;/*190*/
  }
  #prevBtn2,#nextBtn3{
    margin-top:-0.5rem;
  }
  .gripper-page #step-0 .attribute label{
    white-space: normal;
    min-height:1.5rem;
    line-height:normal;
  }
  .rotaries-page #step-0 .attribute label{
    white-space: nowrap;
  }
  .gripper-page #step-1 .attribute label{
    white-space: normal;
  }
  .rotaries-page #step-1 .attribute label{
    white-space: normal;
  }
  /*.gripper-page #prevBtn0, .gripper-page #nextBtn1{
    margin-top:15rem;
  }*/

  .rotaries-page #step-2 .dropdown > label, .rotaries-page #step-2 .dropdown > .input-group{
    max-width:90vw;
    white-space:normal;
  }
  .tool-changer-page .attribute label{
    line-height:normal;
  }
  .tool-changer-page #prevBtn3{
    margin-top:20rem;
  }
  .rotaries-page #step-1 .image-button p{
    line-height:0.7rem ;/*0.9*/
    white-space:normal;/*nowrap*/
    font-size:1rem;
   }
   .rotaries-page #step-1 .input-container button{
     border:2px solid black !important;
   }

   .rotaries-page #step-1 .input-container button:nth-child(2){
     border-top-style:none !important;
     border-bottom-style:none !important;
   }
   .rotaries-page #step-1 .input-container button:nth-child(3){
     border-bottom-style:none !important;
   }

}

@media only screen and (max-width:991px){
  .steps-form .steps-row .steps-step p {
    white-space:normal;
  }
  .steps-form .steps-row:before {
      --widthA: 3.5rem;
      bottom: calc(var(--widthA) + 0.49vw);
  }
  #modalTable{
    min-width:200px;
  }

  .modal-body .table-bordered thead tr > th{
    font-size:0.6rem;
  }
 .modal-body .table-bordered tbody tr > th{
   font-size:0.6rem;
   line-height:normal;
 }
 .modal-body .table-bordered tbody tr > td{
   font-size:0.7rem;
   line-height:normal;
 }

 .selectionResults .table tbody tr > th{
   line-height:1rem;
 }
 .selectionResults .table tbody tr > td{
   line-height:1rem;
 }
 #step-4 .madjust{
   margin-top:10px;
 }
 #step-4 .madjust2{
   margin-top:10px;
 }
 .existing-buttons h1{
   font-size:1.2rem;
 }
 .results-container{
   min-width:430px;
 }

.rotaries-page #step-1 .attribute label,.rotaries-page #step-2 .attribute label{
   min-height:2rem;
 }
 .rotaries-page #step-1 .imageb label{
   white-space:nowrap;
 }

 .rotaries-page #step-1 .image-button button{
   padding:0.3rem;
   line-height:0.75rem ;
   white-space:normal;
 }

 .rotaries-page #step-1 .image-button p,.rotaries-page #step-2 .image-button p{
   margin-bottom:1rem;/*0.5*/
   white-space:nowrap;
 }
 .rotaries-page #step-2 .dropdown>label, .rotaries-page #step-2 .dropdown>.input-group{
   max-width:90vw;
   white-space:normal;
 }
 .escapement-page #step-2 .lineHeightMax{
   line-height:2.05rem;
 }
 .tool-changer-page #step-0 .lineHeightMin{
   line-height:0.95rem;
   margin-bottom:0.3rem;
 }
 .tool-changer-page #step-0 .lineHeightMax{
   line-height:1rem;
 }
 .slides-page #step-2 .attribute-range-container .form-label{
   line-height:0.75rem;
 }
 /*.slides-page .modal-content{
   max-height:50.5% !important;
 }*/

 .rotaries-page #step-1 .input-container button:nth-child(3){
   border-top:2px solid black !important;
   border-right:2px solid black !important;
   border-left-style:none !important;
 }
/* .rotaries-page .modal-dialog-scrollable .modal-body {
   height:23rem;
 }*/

}

@media only screen and (min-width:720px) and (max-width:990px){
  .tool-changer-page #step-0 .lineHeightMax{
    margin-bottom:0.7rem;
  }
  .tool-changer-page #step-0 .lineHeightMax{
    margin-bottom:0.3rem;
  }
  .tool-changer-page #step-1 #aAirunit{
     line-height:0.4rem;
     min-height:1.5rem;
     /*margin-bottom:0!important;
     margin-top:1rem!important;*/
  }
  .rotaries-page #step-0 .attribute label {
    line-height:normal;
  }
  .rotaries-page #step-1 .input-container button:nth-child(3){
    border-top:2px solid black !important;
    border-right:2px solid black !important;
    border-left-style:none !important;
  }
  /*.rotaries-page #step-1 .input-container button:nth-child(3){
    border-bottom-style:none !important;
  }*/

}
@media only screen and (min-width:768px) and (max-width:880px){
  .rotaries-page #step-1 .input-container button:nth-child(3){
    border-top-style:none !important;
    border-right-style:none !important;
    border-left:2px solid black !important;
  }

}
@media only screen and (min-width:720px) and (max-width:767px){
  .rotaries-page #step-1 .input-container button:nth-child(1){
    border-right-style:none !important;
    border-bottom-style:none !important;
  }
  .rotaries-page #step-1 .input-container button:nth-child(2){
    border-top:2px solid black !important;
    border-right:2px solid black !important;
  }
  .rotaries-page #step-1 .input-container button:nth-child(3){
    border-right:none !important;
    border-left:2px solid black !important;
  }
  .gripper-page #step-0 .attribute label{
    min-height:1rem;
    line-height:0.9rem;
  }
}
@media only screen and (min-width:564px) and (max-width:719px){
  .tool-changer-page #step-0 .lineHeightMax{
    margin-bottom:0.6rem;
  }
  .tool-changer-page #step-0 .lineHeightMax{
    margin-bottom:0.7rem;
  }
  .slides-page #step-2 .attribute-range-container .form-label{
    line-height:normal;
  }
  .rotaries-page #step-0 .attribute label {
    line-height:0.9rem;
  }
  .rotaries-page #step-0 #aract{
    margin-top:0.6rem!important;
  }
  .rotaries-page #step-1 .input-container button:nth-child(2){
    border-left:2px solid black !important;
  }
  .rotaries-page #step-1 .input-container button:nth-child(3){
    border-left:2px solid black !important;
  }
  .gripper-page #step-0 .attribute label{
    min-height:1rem;
    line-height:0.9rem;
  }

}

@media only screen and (max-width:563px){
  .steps-form .steps-row .steps-step p {
      margin-top: 0.3rem;
      --offset: 0.15vw;
      font-size:calc(0.50rem + var(--offset) * 2 - 1px);/*0.47rem*/
      white-space:normal;
      font-weight:bold;
      text-align:center;
    }
    .slides .steps-form .steps-row .steps-step p, .escapement .steps-form .steps-row .steps-step p, .toolChangers .steps-form .steps-row .steps-step p  {
        --offset: 0.3vw;
        font-size:calc(0.50rem + var(--offset) * 2 - 1px);/*0.47rem*/
      }
    .steps-form .steps-row .steps-step {
      max-width:0.02px;
    }
    .steps-form .steps-row:before {
        --widthA: 4rem;
        bottom: calc(var(--widthA) + 0.49vw);
    }
    .rotaries   .steps-form .steps-row:before {
          --widthA: 4.3rem;
          bottom: calc(var(--widthA) + 0.49vw);
     }
     .slides  .steps-form .steps-row:before, .toolChangers .steps-form .steps-row:before {
           --widthA: 3.4rem;
           bottom: calc(var(--widthA) + 0.49vw);
      }
    .escapement .steps-form .steps-row:before{
            --widthA: 4.3rem;
            bottom: calc(var(--widthA) + 0.49vw);
      }
    .toolChangers .steps-form .steps-row:before {
      --widthA: 4.4rem;
      bottom: calc(var(--widthA) + 0.49vw);
     }
    .gripper-page #step-0 .attribute label{
      min-height:1rem;
      line-height:0.9rem;
    }

    .rotaries-page #step-0 .attribute label{
      min-height:4rem;
    }
    /*.gripper-page #step-1 .attribute label,gripper-page #step-2 .attribute label{
      min-height:7rem;
    }*/
   .rotaries .steps-form .steps-row .steps-step p {
      --offset: 0.15vw;
      font-size:calc(0.75rem + var(--offset) * 2 - 3.40px);
    }
    .rotaries-page #step-1 .image-button p,.rotaries-page #step-2 .image-button p{
      white-space:normal;
    }
    .rotaries-page #step-2 .dropdown>label, .rotaries-page #step-2 .dropdown>.input-group{
      max-width:90vw;
      white-space:normal;
    }
    #avcaPneumatic{
      margin-top:0.5rem;
    }

    .tool-changer-page #step-0 .lineHeightMin{
      line-height:0.95rem;
      margin-bottom:0.4rem;
    }
    .tool-changer-page #step-0 .lineHeightMax{
      margin-bottom:0.3rem;
    }
    .slides-page #step-2 .attribute-range-container .form-label{
      line-height:normal;
    }
    .rotaries-page #step-0 .attribute label {
      line-height:1rem;
      min-height:1.6rem;
    }
    .rotaries-page #step-0 #aract{
      margin-top:0.6rem!important;
    }
    .rotaries-page #step-1 .input-container button:nth-child(2){
      border-left:2px solid black !important;
      border-bottom-style:none !important;
      border-top-style:none !important;
    }
    .rotaries-page #step-1 .input-container button:nth-child(3){
      border-right:2px solid black !important;
      border-left:2px solid black !important;
    }

    #agact, #agtype, #apressure{
      margin-top:0.9rem;
    }


}

/**************************************************************/
.selectionResults .attribute-value, .selectionResults .attribute-value-hovered, .selectionResults .attribute-value-selected{
    width: 1em;
    height: 1em;
    margin-top: 0.25em;
    vertical-align: top;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border: 1px solid rgba(0,0,0,.25);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-print-color-adjust: exact;
    border-radius: 0.25em;
    float: left;
    margin-left: -1.5em
}
.selectionResults .attribute-value-selected{
  background-color:#B2282D;
}
.selectionResults .attribute-value-hovered{
  border-color: #B2282D;
}
/**************************Tooltips**********************************/
.withTooltip input:focus{
  box-shadow: #bfd1eb 0px 1px 5px 0px inset, #c7dbff 0px 1px 4px 0px inset,#a0c5fb 0px 1px 5px 0px inset,#c7dbff 0px 1px 4px 0px inset;

  /*border-color:#ced4da;*/
}
.withTooltip .input-group-prepend .btn {
  border:1px solid #ced4da;
  background-color:white;
  box-shadow:rgba(0, 0, 0, 0.08) 0px 1px 3px 0px, rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
  border-radius:3px;
}
.withTooltip img{
  max-width:1.1rem;
  max-height:1.1rem;
}

#pbar{
  max-width:5rem;
  text-align:center;
  height:1rem;
  align-self:center;
  border: 1px solid #ced4da;
  padding:8px 8px;
}
/************************Accordion ****************************************/

.accordion-item {
    background-color: #EEE;
    border: none;
    border-bottom: 1px solid rgba(0,0,0,.125);
}
.accordion-item:first-of-type {
    border-top: 1px solid rgba(0,0,0,.125);
}
.accordion-collapse {
    padding: 0 1.25rem;
}
.accordion-body {
    background-color: #EEE;
    padding: 0;
}
.accordion-header{
  color:#b2282d;
  font-weight:bold;
  font-size:1.1rem;
  min-height:16px;
}
.accordion-button, .accordion-button:not(.collapsed) {
    background-color: #EEE;
    color: #B2282D;
    font-weight: bold;
    outline: 0px !important;
    -webkit-appearance: none;
    box-shadow: none !important;
}
/****************************Fourt Accordian Header Styling*************************************/
.table .subheader{
  font-size:12px;
  color:#B2282D;
  /*white-space: nowrap;*/
}
#collapseFour .table,#collapseFive .table{
  width:100%;
  margin-top:12px;
}
#collapseFour .table > tbody,#collapseFive .table > tbody{
  border-color:#C0C0C0 !important;
}
#collapseFour .table > tbody  > tr > td,#collapseFive .table > tbody  > tr > td{
  font-size:14px;
  white-space: nowrap;
}
#cw , #ac , #lpb , #cf{
  white-space: normal !important;
}

.tool-changer-page #collapseThree .table > tbody  > tr > td > span:nth-child(2),#collapseFour .table > tbody  > tr > td > span:nth-child(2),#collapseFive .table > tbody  > tr > td > span:nth-child(2){
  font-size:0.8rem;
}
.tool-changer-page #collapseThree .border ,#collapseFour .border,#collapseFive .border{

 border:2px solid #C0C0C0 !important;

}
.tool-changer-page #collapseThree .table >thead>tr>th,#collapseFour .table >thead>tr>th,#collapseFive .table >thead>tr>th{
  background-color:	#E8E8E8;
}
.tool-changer-page #collapseThree .table >thead>tr,#collapseFour .table >thead>tr,#collapseFive .table >thead>tr{

  /* #1 */
  border: 2px solid #DCDCDC;
  border-right:5px solid #DCDCDC;
  border-left:5px solid #DCDCDC;

  /* #2 */
  padding: 2px;
  background: hsl(0, 0%, 20%);

  /* #3 */
  outline: 2px solid hsl(0, 0%, 60%);

  /* #4 AND INFINITY!!! (CSS3 only) */
  box-shadow:
      0 0 0 4px hsl(0, 0%, 80%),
      0 0 0 6px hsl(0, 0%, 90%);
}

#rcl{
  display:block;
  margin-bottom:0;
  color:black;
}
.upressure1{
  font-size:10px;
}
/******************************INTEGRATION PAGE STYLING******************************************/
.step img{
  /*--widthB: 0.6vw;*/
  width: 10vw;/*9.375rem*/
  margin-bottom:0.5rem;
}
.integrationPage h4{
  text-align:center;
  font-weight:bold;
  margin-bottom:2rem;
  font-size:2vw;
}
.integrationPage .steps-form > .steps-row > .steps-step > p{
  font-size:1.4vw;
  color:#818285;
  font-weight:bold;
  white-space: normal;
}
.integrationPage .steps-form .steps-row:before {
  display:none;

}
.integrationPage .steps-form .steps-row .steps-step .selected{
  color:#B22A2E;
 }

 .integrationPage .productType{
   display:table;
   text-align:center;
   margin:0 auto;
 }
 .integrationPage .productRow{
    display:table-cell;
    width: 10vw;
 }
 .integrationPage .productType img{
   width:15vw;
 }
 .integrationPage .productType h5{
   font-weight:normal;
   font-size:1.5vw;
 }
 #content{
   margin:0 auto;
 }
 #summaryTitle{
   color:gray;
   margin-left:1rem;
 }
/***********************ROBOHAND*/
.gripper-page .attribute, .rotaries-page .attribute, .slides-page .attribute, .escapement-page .attribute, .tool-changer-page .attribute{
  margin-bottom:2rem;
  min-width:50%;
}

.gripper-page .subquestion span, .rotaries-page .subquestion span,.slides-page .subquestion span, .escapement-page .subquestion span, .tool-changer-page .subquestion span, .punit{
  font-size:0.9em;
  margin-left:0.5em;
  padding-top:0.5em;
}

.gripper-page .input-container, .rotaries-page .input-container, .slides-page .input-container, .escapement-page .input-container{
  margin-top:0.5rem;
  box-shadow:0 1px 2px rgba(0,0,0,0.07),
               0 2px 4px rgba(0,0,0,0.07),
               0 4px 8px rgba(0,0,0,0.07),
               0 8px 16px rgba(0,0,0,0.07),
               0 16px 32px rgba(0,0,0,0.07),
               0 32px 64px rgba(0,0,0,0.07);
  width:auto;/*10rem*/
}
.rotaries-page #step-0 .input-container{
  margin-top:0
}
.escapement-page .input-container, .escapement-page #step-3 .input-container{
  margin-top:0.5rem;
  box-shadow:0 1px 2px rgba(0,0,0,0.07),
               0 2px 4px rgba(0,0,0,0.07),
               0 4px 8px rgba(0,0,0,0.07),
               0 8px 16px rgba(0,0,0,0.07),
               0 16px 32px rgba(0,0,0,0.07),
               0 32px 64px rgba(0,0,0,0.07);
  width:6rem;
}
.rotaries-page #step-1 .input-container button{
  box-shadow:0 1px 2px rgba(0,0,0,0.07),
               0 2px 4px rgba(0,0,0,0.07),
               0 4px 8px rgba(0,0,0,0.07),
               0 8px 16px rgba(0,0,0,0.07),
               0 16px 32px rgba(0,0,0,0.07),
               0 32px 64px rgba(0,0,0,0.07);
  width:17rem;
  height:17rem;

}

.slides-page #step-1 .input-container, .escapement-page #step-1 .input-container, .tool-changer-page #step-1 .input-container,.rotaries-page #step-1 .input-container{
  box-shadow:none;
}
.gripper-page .input-container button,.rotaries-page .input-container button, .slides-page .input-container button, .escapement-page .input-container button, .tool-changer-page .input-container button{
  min-width:6.25rem ;
  font-size:0.875rem ;
  height: 2.5rem ;
  line-height: 2.5rem ;
  background-color:rgb(238,238,238);
  border:1.5px solid black;
  color: black;
  padding: 0 16px;
}
.escapement-page .input-container button{
  min-width:13.25rem;
}

.gripper-page .attribute label, .rotaries-page .attribute label, .slides-page .attribute label, .escapement-page .attribute label, .tool-changer-page .attribute label{
  white-space: normal;
  margin-top:0.4rem;
  font-size:0.9em;
  min-height:2rem;
  width:100%;
 }
.escapement-page .attribute label, .slides-page .attribute label,.gripper-page .attribute label{
    font-size:1em;
    min-height:1.5rem;
 }
.rotaries-page .attribute label{
  font-size:1em;
  min-height:1.5rem;
  line-height:normal;
}
 .tool-changer-page .attribute label{
   font-size:1em;
   min-height:1.5rem!important;
 }
 .escapement-page .attribute label{
   min-height:2rem;/*3*/
 }
 /*.tool-changer-page .attribute label{
   min-height:2.2rem;
 }*/

.rotaries-page #step-1 .input-container button:nth-of-type(3){
  border-right-style: none;
  border-top-style: none;
}
.rotaries-page #step-1 .input-container button:nth-of-type(4){
  border-top-style: none;
}
/*.gripper-page .input-container button:nth-of-type(2), .rotaries-page .input-container button:nth-of-type(2),*/
 .gripper-page .input-container button:nth-of-type(3){
  border-left-style: none;
}
/*.slides-page .input-container button:nth-of-type(2), .slides-page .input-container button:nth-of-type(3),.slides-page .input-container button:nth-of-type(5),.rotaries-page .input-container button:nth-of-type(4){
  border-left-style: none;
}*/
/*.gripper-page .input-container button:nth-of-type(1){
   border-right-style: none;
}*/

.gripper-page .question h3, .rotaries-page .question h3, .slides-page .question h3, .escapement-page .question h3, .tool-changer-page .question h3{
  padding: 0px 0px 0px 20px;
  margin-bottom:10px;/*30*/
}
.gripper-page .question h4, .rotaries-page .question h4, .slides-page .question h4, .escapement-page .question h4{
  padding: 0px 0px 10px 20px;
  font-weight: bold;
  font-size: 0.8em;
}
.escapement-page .question h4{
  font-size: 0.95em;
  padding-left:0.5rem;
}
.tool-changer-page .question h4{
  font-size: 1rem;
  font-weight: bold;
  margin-bottom:1rem;
}
.rotaries-page .question h4{
  font-size:1rem;
  padding:0;
  margin-bottom:1rem;
  margin-top:1.5rem;
}
.slides-page .question h4{
  font-size:1rem;
  padding:0;
  margin-bottom:1rem;
  margin-top:1.5rem;
}
 .gripper-page .input-container .cds-selected, .rotaries-page .input-container .cds-selected, .slides-page .input-container .cds-selected , .escapement-page .input-container .cds-selected, .tool-changer-page .input-container .cds-selected{
    background-color: #b2282d;
    color: #fff;
}
div.ui-tooltip {
    padding:0px;
    margin:0px;
    border:0px solid #b2282d;
    box-shadow: 10px 10px 40px gray;
}
.gripper-page .attribute-range-container,.slides-page .attribute-range-container, .escapement-page .attribute-range-container{
  margin-bottom:2rem;
}
.rotaries-page .attribute-range-container{
  margin-bottom:1rem;
}
.rotaries-page .attribute-range-container .form-label, .slides-page .attribute-range-container .form-label{
  white-space: normal;
  min-height:3rem;
}
.gripper-page .attribute-range-container .form-label{
  white-space:normal;
}

.tool-changer-page .attribute-range-container .form-label{
  white-space: normal;
  min-height:3rem;
}
.slides-page .attribute-range-container .form-label{
  white-space: normal;
  min-height:1rem;
}
.rotaries-page .attribute-range-container .form-label{
  white-space: normal;
  min-height:1rem;
  line-height:normal;
}
.tool-changer-page .attribute-range-container .form-label{
  min-height:2rem;
}
.gripper-page #step-3 .input-container button{
    min-height: 3.4rem;
    line-height: normal;
    white-space: normal;
}
.rotaries-page #step-3 .input-container button, .slides-page #step-3 .input-container button, .escapement-page #step-3 .input-container button{
    min-height: 3.4rem;
    line-height: normal;
    white-space: normal;
}
.tool-changer-page #step-3  button {
    min-height: 3rem;
}
.tool-changer-page #step-3 #prevBtn3{
  min-height:2rem;
}
.gripper-page #step-3 h3{
  font-weight: bold;
  font-size: 1.2rem;
  padding:0;
 }
 .rotaries-page #step-3 h3, .slides-page #step-3 h3, .escapement-page #step-3 h3, .tool-changer-page #step-3 h3{
   font-weight: bold;
   font-size: 1.2rem;
   padding:0;
  }
 body {
   overflow-y: scroll !important;
 }
 .hidden{
   display:none;
 }
 .image-button img{
   height:15vw;
   margin-top:2vw;
 }
 .slides-page .image-button img,.tool-changer-page .image-button img{
   height:120px;
   width:120px;
   margin-top:0;
 }
 .rotaries-page .image-button img{
   height:220px;
   width:220px;
   margin-top:0.5rem;
 }
 .escapement-page .image-button img{
   height:200px;
   width:200px;
   margin-top:0;
 }
 .image-button p{
   margin-top:0.7rem;
   font-weight:bold;
   /*font-size:0.8rem;*/
   --offset: 0.15vw;
   font-size:calc(0.6rem + var(--offset) * 2 - 1px);
   margin-bottom:0;
   white-space:normal;
   line-height:2vw;
 }
 .rotaries-page .image-button{
   box-shadow:0 1px 2px rgba(0,0,0,0.07),
                0 2px 4px rgba(0,0,0,0.07),
                0 4px 8px rgba(0,0,0,0.07),
                0 8px 16px rgba(0,0,0,0.07),
                0 16px 32px rgba(0,0,0,0.07),
                0 32px 64px rgba(0,0,0,0.07);
 }
 .rotaries-page .image-button, .slides-page .image-button, .escapement-page .image-button, .tool-changer-page .image-button{
   margin-top:0.5rem;
   width:auto;
   height:auto;
 }

 .slides-page .image-button p, .tool-changer-page .image-button p, .rotaries-page .image-button p{
   line-height:1.2em;
   margin-top:0.3rem;/*0.7*/
   padding:0.3rem;
   font-size:1em;
 }
 .escapement-page .image-button p{
   margin-top:0;/*0.3*/
   line-height:2;
 }
 .rotaries-page .image-button button{
   width:auto ;
   height: auto ;
   background-color:#ffffff;
   border:2px solid black;/*1.5px*/
   padding: 0 0.6rem 0.1rem;
   min-width:5.2rem;

 }
 .slides-page .image-button button, .escapement-page .image-button button, .tool-changer-page .image-button button{
   box-shadow:0 1px 2px rgba(0,0,0,0.07),
                0 2px 4px rgba(0,0,0,0.07),
                0 4px 8px rgba(0,0,0,0.07),
                0 8px 16px rgba(0,0,0,0.07),
                0 16px 32px rgba(0,0,0,0.07),
                0 32px 64px rgba(0,0,0,0.07);
   width:12rem;
   height:12rem;
   background-color:#ffffff;
   padding: 0 0.1rem 0.1rem;
 }
 .escapement-page .image-button button{
   width:16rem;
   height:16rem;
   padding: 1.1rem 0 0;
 }

 .rotaries-page .image-button .cds-selected img, .slides-page .image-button .cds-selected img, .escapement-page .image-button .cds-selected img, .tool-changer-page .image-button .cds-selected img{
   border:2px solid black;

 }
  .rotaries-page .image-button label,.slides-page .image-button label, .escapement-page .image-button label, .tool-changer-page .image-button label{
    white-space:nowrap;;
    margin-top:0;
  }

  /*.rotaries-page #step-1 .circularQ .form-label{
    min-height:4rem;
  }*/
  .rotaries-page .dropdown > label, .slides-page .dropdown > label, .escapement-page .dropdown > label,.tool-changer-page .dropdown > label{
    margin-bottom:0.5rem;
    margin-top:0.5rem;
  }
  /***********************************************************/
  .tool-changer-page .input-container .attribute-value:hover{
    border:2.5px groove #696880/*#4E0707*/;
  }
  .incomplete{
    border-color:#b2282d;
  }
  #valid-unit-header-english, #valid-unit-header-metric{
    font-size:14px;

  }
  .cds-disabled{
    /*text-decoration:line-through;
    pointer-events:none;*/
    display:none;
  }
  .star{
    color:#b2282d;
    text-shadow: 1px 1px 1px 1px #696880;
    z-index:99999;
  }
  /*.slides-page .modal-content{
    max-height:60.5%
  }*/
  .cds-selected-row{
    background-color:#D0EAF5;
  }
  .highlighted{
    background-color:#D0EAF5;
    width:50%;
    margin-left:0.5rem;
  }
  .highlighted h3{
    margin: 0 !important;
    padding: 0 !important;
  }
  .highlighted h3>span{
    color:#b2282d;
  }