.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto
}
@media (min-width:768px) {
  .container {
    width: 98%
  }
}
@media (min-width:992px) {
  .container {
    width: 98%
  }
}
@media (min-width:1300px) {
  .container {
    width: 1280px
  }
}
.container-fluid {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto
}
.container-fluid > .navbar-collapse, .container-fluid > .navbar-header, .container > .navbar-collapse, .container > .navbar-header {
  margin-right: -15px;
  margin-left: -15px
}
@media (min-width:768px) {
  .container-fluid > .navbar-collapse, .container-fluid > .navbar-header, .container > .navbar-collapse, .container > .navbar-header {
    margin-right: 0;
    margin-left: 0
  }
}
@media (min-width:768px) {
  .navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand {
    margin-left: -15px
  }
}
.container .jumbotron, .container-fluid .jumbotron {
  padding-right: 15px;
  padding-left: 15px;
  border-radius: 6px
}
.jumbotron .container {
  max-width: 100%
}
@media screen and (min-width:768px) {
  .jumbotron {
    padding-top: 48px;
    padding-bottom: 48px
  }
  .container .jumbotron, .container-fluid .jumbotron {
    padding-right: 60px;
    padding-left: 60px
  }
  .jumbotron .h1, .jumbotron h1 {
    font-size: 63px
  }
}
.btn-group-vertical > .btn-group:after, .btn-group-vertical > .btn-group:before, .btn-toolbar:after, .btn-toolbar:before, .clearfix:after, .clearfix:before, .container-fluid:after, .container-fluid:before, .container:after, .container:before, .dl-horizontal dd:after, .dl-horizontal dd:before, .form-horizontal .form-group:after, .form-horizontal .form-group:before, .modal-footer:after, .modal-footer:before, .modal-header:after, .modal-header:before, .nav:after, .nav:before, .navbar-collapse:after, .navbar-collapse:before, .navbar-header:after, .navbar-header:before, .navbar:after, .navbar:before, .pager:after, .pager:before, .panel-body:after, .panel-body:before, .row:after, .row:before {
  display: table;
  content: " "
}
.btn-group-vertical > .btn-group:after, .btn-toolbar:after, .clearfix:after, .container-fluid:after, .container:after, .dl-horizontal dd:after, .form-horizontal .form-group:after, .modal-footer:after, .modal-header:after, .nav:after, .navbar-collapse:after, .navbar-header:after, .navbar:after, .pager:after, .panel-body:after, .row:after {
  clear: both
}
.nav-tabs > li {list-style:none;}
.content_img .left .info{padding: 30px 54px 29px 0;color: #000;vertical-align: middle;float: left; max-width: 500px; }
.nav-tabs > li.active > a, .nav-tabs > li > a:hover,.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {background-color: transparent; border: none; color: #000;}
.datatable .cusall  {float: left;}
 
	
*{padding: 0px; margin: 0px;outline:none;box-sizing:border-box;-webkit-box-sizing:border-box;-ms-box-sizing:border-box;-moz-box-sizing:border-box;}
.tco_info h1, .tco_info h2, .tco_info h3, .tco_info h4, .tco_info h5, .tco_info h6{  margin: 0px;}
.tco_info a:focus {outline: 0px auto -webkit-focus-ring-color;outline-offset: 0px;}
.tco_info a, .tco_info img {text-decoration: none;outline: none;}

 
.tco_info a:hover{-webkit-transition: all 0.5s;-moz-transition: all 0.5s;transition: all 0.5s;}
.tco_info img{ max-width: 100%; }
 

.btnPrimary{ display: inline-block;}
.btnPrimary a{color: #FFFFFF;background-color: #155dbb;border: 1px solid #2171ac;line-height: 31px;padding: 0 15px;font-size: 16px;display: block;border-radius: 0px;margin: 1px 0 0; -webkit-transition: all .3s ease;transition: all .3s ease;}
.btnPrimary a:hover{background-color: #047ad1;border-color: #047ad1;}
.slick-prev {left: 0px;background: url("https://www.hp.com/content/dam/sites/worldwide/apps/ise-tco-calculator/static/mockup/images/leftArrow.svg") no-repeat left top;height: 30px;width: 30px; }
.slick-next {right: 0px;background: url("https://www.hp.com/content/dam/sites/worldwide/apps/ise-tco-calculator/static/mockup/images/rightArrow.svg") no-repeat left top;height: 30px;width: 30px; }

.wrapper{ width: 100%;margin: auto;}
.section1{ float: left; width: 100%;  text-align: center; height: 2411px;  background:url("https://www.hp.com/content/dam/sites/worldwide/apps/ise-tco-calculator/static/mockup/images/section1.jpg") top center no-repeat; }
.section2{ float: left; width: 100%;  text-align: center; height: 2711px;  background:url("https://www.hp.com/content/dam/sites/worldwide/apps/ise-tco-calculator/static/mockup/images/section2.jpg") top center  no-repeat; }
.clickopt{ float: left; width: 100%;   }
.section1 img, .section2 img { display: none;}
 

/*Content Img*/
.content_img{width:100%; float:left;  position: relative;}
.content_img .left{background: #9090a3;vertical-align: middle; height: auto; min-height: 604px;padding: 0;}
.content_img .left .info{padding: 30px 20px 29px 0;color: #000;vertical-align: middle;float: left;max-width: 487px; }
.heacal{background: #0097d6;color: #000;vertical-align: middle; float: left ; width: 100%;}
.content_img .left h1{ padding: 30px 10px 29px 0;max-width: 487px;float: left; }
.content_img .left .info p{font-size: calc(17px + (32 - 18) * ((100vw - 300px) / (1920 - 300)));font-size: 28px;margin: 0 0 10px;}
.content_img .left .info a{margin-top: 30px;}
.content_img .right{background: url("https://www.hp.com/content/dam/sites/worldwide/apps/ise-tco-calculator/static/mockup/images/banner.jpg") no-repeat 50% 50% / cover; float: right;  }

.content_img .right img{display: none;}

.content_img .frontText{flex: 0 0 100%;max-width: 100%; width:100%}
.retset{position: static;}
.content_img .frontText2{flex: 0 0 100%;max-width: 100%; width:100%; min-height: 670px;position: absolute; right: 0; top: 0; width: calc(50% + 136px);}
/*Content Img*/

.btncta a{color: #fff;background: #000;text-align: center;padding: 0 29px; display: inline-block;  line-height: 32px;}
.btncta a:hover{background: #d9d9d9;color: #000;}

 
.wrap{ max-width:1180px; width: 100%; margin: auto; position: relative; }
.slideClick { float: left;width: 100%;}
.bgin{background: #9090a3;float: left;width: 100%;}
.centernav{max-width:1221px; width: 100%; margin: auto;}
 .nav-tabs{background: #9090a3;}
.nav-tabs > li{width: auto;text-align: left;margin: 0 !important;float: left;background: #e6e6e6;padding: 8px 0px;border-top: 3px solid transparent;}
.nav-tabs > li a{font-size: calc(20px + (24 - 20) * ((100vw - 300px) / (1920 - 300)));color: #000;border-left: 1px solid #9e9e9e;border-radius: 0;margin: 0;line-height: 25px;padding: 0px 40px; text-decoration: none;}
.nav-tabs > li.active > a, .nav-tabs > li > a:hover,.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover
{background-color: transparent; border: 1px solid transparent; border-left: 1px solid transparent;color: #000;}
.nav-tabs > li.active , .nav-tabs > li:hover  ,.nav-tabs > li.active  , .nav-tabs > li.active:focus, .nav-tabs > li.active:hover
{background-color: #ffffff;border: 0px solid #33aadd;color: #000;    border-top: 3px solid #09e32e;}
.nav-tabs > li:first-child > a{border-left: 1px solid transparent;}


.scrtabs-tab-container {  position: relative; }
.tab-content { float: left; width: 100%;}
.tab-content > .tab-pane { display: block; width: 100%; opacity: 0; visibility: hidden; overflow: hidden;height: 0;position: relative; z-index: -1;}
.tab-content > .active {display: block;opacity: 1; visibility: visible; overflow:visible; height: auto; z-index: 9;}
.nav > li > a:focus, .nav > li > a:hover {  text-decoration: none;  background: none;    border-color:0;}


.samehi{ height: 0;overflow: hidden; position: relative;  z-index: -1;}
.op1{opacity:  1;height: auto; z-index: 99;}
 
.nvidia_modal button.close {margin: 15px -20px 0 0;border: 0; background: none;}
.nvidia_modal button.close {position: absolute;z-index: 99;opacity: 1;right: 32px;border: 0; background: none;}
.close:focus, .close:hover{opacity: 1;}
.nvidia_modal .modal-body{padding: 0px;}
/* .nvidia_modal  .modal-content{  box-shadow:0 0;} */
.nvidia_modal .modal-dialog{padding: 0; max-width: 592px;}
.nvidia_modal button.close img{height: 37px;}

/*DataTable*/
.datatable{background: #ffffff; float:left; width:100%;padding: 33px 0px 32px 0px;color: #000;}
.datatable h2{padding: 0 0 34px;color: #000;}
.datatable .col-md-12 {position: relative;border: 1px solid #b0b0b0;padding: 10px 10px 10px 32px;min-height: 56px;margin: 0 0 0 -2px; }
.datatable .row{margin:0px;}
.datatable .col-lg-8,.datatable .col-lg-4 {padding:0px;}
.datatable strong{font-size: 24px;font-weight: inherit; line-height: 40px;}
.datatable .datatable_slider strong{ font-size: 20px;font-weight: inherit;  }
.datatable_slider_item .row:first-child strong{min-height: 16px; display:inline-block;}
.datatable_slider{ text-align: center;}
.datatable_slider img{ display: inline-block; max-width: 100%;}
.datatable_slider .slick-track{ float: left;}
.datatable_slider  img.tbmp2{position: absolute;top: 50%; transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-webkit-transform: translate(-50%, -50%);left: 50%;}
  
.datatable_slider .slick-next,.datatable_slider .slick-prev{ top: 44%;  }
.datatable p{margin: 0;padding: 5px 0 0;}
.col-xs-4 .row,.col-xs-8 .row{margin:0px;}
.datatable_slider_item p{margin: 0;}
.datatable_slider_item label {margin-right: 15px !important;margin-bottom: 0;cursor: pointer; font-weight: 400; }
.datatable_slider_item input {cursor: pointer; -webkit-appearance: none;-moz-appearance: none;appearance: none;border-radius: 50%;width: 24px;height: 24px;transition: 0.2s all linear;margin-right: 6px !important;position: relative;top: 4px;background: white;border: 1px solid #646464;}
.datatable_slider_item input:checked::before{border-radius: 50%;width: 11px;content: "";height: 11px;top: 5px;box-sizing: border-box;left: 6px;position: absolute;border: 0px solid #fff;background: black;}
.datatable_slider_item  input:checked {margin: 0;/* background: black; */box-sizing: border-box;/* border: 6px solid white; */}
.datatable_slider_item  button,.datatable_slider_item  legend {color: white;background-color: black;padding: 5px 10px;border-radius: 0;border: 0;font-size: 14px;}
.datatable_slider_item  button:hover,.datatable_slider_item  button:focus {color: #999;outline: 0px solid black;}
.datatable_slider_item .datatable_slider_item  button:active {background-color: white;color: black;outline: 1px solid black;}
.datatable_slider_item  input[type=file]:focus,  .datatable_slider_item input[type=checkbox]:focus,  .datatable_slider_item input[type=radio]:focus {outline: 0px auto -webkit-focus-ring-color;}
.datatable_slider_item input[type=checkbox],  .datatable_slider_item input[type=radio]{margin: 0;}                               
/*DataTable*/
.colblu{background: #212248;}
.grblu{background: #e5e6e5;}
.style1{background: #ddf5ff;}
.datatable .btncta a{font-size: calc(16px + (16 - 16) * ((100vw - 300px) / (1920 - 300))); padding: 0 16px; margin: 15px 0 0; line-height: 34px; text-decoration: none;}

.steo2{float:left; width:100%; margin: 0 0 40px;}
.headst{ float:left; width:100%;}
.headst h4{ padding: 33px 0 20px;}
.headst p{font-size: calc(18px + (24 - 18) * ((100vw - 300px) / (1920 - 300)));margin: 0 0 10px;}

.textcont{width: 100%; cursor: pointer; max-width: 525px;min-height: 292px;float: left;border: 1px solid #afafaf;margin: 12px 0 12px;display: flex;/* align-items: center; */}
.tophead{padding: 15px 0px 50px; position: relative;padding-bottom: 14px;   min-height: 102px;}
.listul{width: 60%;float: left;padding: 16px 20px 4px;}
.listul p{font-size: calc(18px + (20 - 17) * ((100vw - 300px) / (1920 - 300))); font-weight: 500;margin: 0 0 10px;}
.listul ul{list-style: disc;}
.listul ul li{width: 100%;float: left;font-size: 16px;margin: 0 0 0 12px;}
.imgstep1{float: left;width: 40%;  position: relative;   background: #e6e6e6;border-left: 1px solid #afafaf;}
.imgstep1 img{ position: absolute;   left: 50%;  top: 50%;   -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
 .listul ul li span {display: inline-block;background: #9090a3;padding: 2px 6px 4px;}
.stp2{margin: 22px 0 0; float: left; width: 100%;}
.stp2 a{ margin-right: 10px;  padding:0 16px; line-height: 34px; text-decoration: none;  }
.autoacr2 {padding: 0 0 0 0;border-left: 1px solid #121212;float: left;width: 100%;}
.tophead span{position: absolute;top: 18px;left: -28px;display: inline-block;padding: 4px 18px 3px;font-size: 19px;background: #e6e6e6;border: 1px solid #6b6b6b;}
.setdata2 .tophead {padding-left:  75px; }
.autoacr {width: 100%;height: 635px;overflow-y: auto;}

/* Works on Firefox */
* {scrollbar-width: thin;scrollbar-color: #e6e6e6 white;}
/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {width: 8px;}
*::-webkit-scrollbar-track {background: #e8e8e8;}
*::-webkit-scrollbar-thumb {background-color: #c6c6c6;border-radius: 20px;border: 3px solid #c6c6c6;}
.blue1{background: #9090a3;}

/* .probar h4{font-size: calc(20px + (28 - 20) * ((100vw - 300px) / (1920 - 300))); } */
.probar h4{ padding: 0px 0 37px 0px; }
 .inptext{padding: 0px 0;float: right;max-width: 28%;width: 100%;}
.inptext .form-control{border: 1px solid #d5d5d5;height: 40px;border-radius:0;/* background-color:#fff; */background-clip: initial;/* border: 0; */padding-right: 20px;font-size: 18px;text-align: left;}
.inptext select{-moz-appearance:none;-webkit-appearance:none;appearance:none;background-size: 15px !important;background: #e6e6e6 url("https://www.hp.com/content/dam/sites/worldwide/apps/ise-tco-calculator/static/mockup/images/Arrow-dark.svg") no-repeat left;background-position-x: 93% !important;}
.inptext select{-moz-appearance:none; -webkit-appearance:none; appearance:none;background: url("https://www.hp.com/content/dam/sites/worldwide/apps/ise-tco-calculator/static/mockup/images/Arrow-dark.svg") no-repeat left #e6e6e6;background-position-x: 96%;}
.probar .inputamount{width: 28%;float: right;}
.probar .inputamount input,.probar .inptext input{	top: -13px;	font-size: 18px;  border: solid 1px #c2c2c2; width: 100%;	padding: 0 3px 0 9px;	line-height: 40px;	background: #e6e6e6;	vertical-align: top; 	position: relative;}

.probar {width: 100%;float: left;padding: 34px 0 0px;}
.setsec h4{ float: left; padding: 0px 0 0;}
.probar.setsec {padding: 50px 0 6px 0px;}
.endtop{margin: 0 0 30px;}
.stp3{margin: 3px 0 50px; float: left; width: 100%;}

.probar input { width: 100%; float: left;}
span#rangeval,span#rangeval2, .probar span{border: solid 1px #c2c2c2; width: 28%;	padding: 0 3px 0 9px;	line-height: 40px;	background: #e6e6e6;	vertical-align: top;	margin: 2px 4px 4px 10px;	position: relative;	top: -10px;	font-size: 18px;float: right;}
.rangenu{float: left; width: 68%; color: #848484;font-size: 20px;}
.rangenu .numstart{ width: 50%; float: left; padding: 5px 5px;}
.rangenu .numend{ width: 50%;float: left; text-align: right;padding: 5px 5px;}
 

.steo3 {float: left;width: 100%;padding: 26px 0 40px  ;}
.steo3 .textcont{  max-width: 405px;min-height: 245px;cursor: auto;}
.steo3 .setdatain{border-right: 1px solid #121212;   }
.steo3 .setdatain, .steo3 .setdata{  margin: 22px 0 0;}

.steo3 .listul{width: 78%;padding-bottom: 14px;}
 
.steo3 .headst h4{padding: 0px 0 20px;}
.steo3 .tophead{ padding: 0px 0px 24px; min-height: initial; }
.steo3 .stp2{margin: 14px 0 37px;}

.nvidia_modal h4{background: #212248;font-size: calc(22px + (33 - 20) * ((100vw - 300px) / (1920 - 300)));padding: 15px 22px 22px;}

.frmno .form-row .customcss{padding: 4px 12px;}
.frmno .form-row .customcss .form-control{height: 32px;border-radius:0;background-color: #ffffff;background-clip: initial;border: 1px solid #424040;}
.frmno{display:inline-block;width:100%;padding: 21px 14px 0px;font-size: 16px;}
 
.deschk{display:inline-block;position:relative;padding-left:35px;margin-bottom:12px;cursor:pointer;font-size:22px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
.deschk input{position:absolute;opacity:0;cursor:pointer;height:0;width:0;}
.checkmark{position:absolute;top:0;left:0;height:25px;width:25px;background-color:#eee;}
.deschk:hover input ~ .checkmark{background-color:#ccc;}
.deschk input:checked ~ .checkmark{background-color:#2196F3;}
.checkmark:after{content:"";position:absolute;display:none;}
.deschk input:checked ~ .checkmark:after{display:none;}
.deschk .checkmark:after{left: 10px; top: 7px; ;width:5px;height:10px;border:solid white;border-width:0 3px 3px 0;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);}
span.ysb{display:inline-block;position: relative; top: 6px;padding-right: 8px;}
.form-check.cilfd{padding:0;}
.form-check.cilfd{ padding:0;margin: 0px 0px 1px;}
span.ysb.ysb2 {padding-left: 40px;display: block;position: absolute;top: 5px;color: #000;}
.stdb{color: #fff;background: #000;text-align: center;padding: 5px 29px 8px;margin: 21px 0 0;display: inline-block;font-size: calc(16px + (16 - 16) * ((100vw - 300px) / (1920 - 300)));}
.stdb:hover,.stdb:focus{background: #d9d9d9;color: #000;}
.checkbo{padding: 0 30px 26px;font-size: 16px;}
label.form-check-label {margin-right: 39px;}

.nvidia_modal2 h6{ padding: 13px 22px 15px; background-color: #6e6f88;font-size: calc(18px + (20 - 17) * ((100vw - 300px) / (1920 - 300)));}
.nvidia_modal2 .modal-dialog {padding: 0;max-width: 720px;}
.infodata{float: left;width: 100%;padding: 18px 0 14px 19px;background: #e7e7e7;min-height: 119px;}
.imgdetail{float: left;width: 30%;}
.Textetail{float: left;width: 70%;}
.Textetail h5{font-size: calc(18px + (20 - 17) * ((100vw - 300px) / (1920 - 300)));padding: 0 10px 0px 18px;}
.iconplus{float: left;text-align: center;width: 100%;background: #e7e7e7;font-size: 30px;padding: 0px 0 13px;}
.nvidia_modal2 p{ font-size: 16px;padding: 13px 22px 15px; }
.iconmi{text-align: center;width: 100%;font-size: 30px;position: relative;/* min-height: 371px; */}

.strow{align-items: center;display: flex;margin: 0;height: 100%;vertical-align: text-top;/* background: #e7e7e7; */}
.row.strow .col-md-5,.row.strow .col-md-2 {padding: 0;}
.row.strow .col-md-2 {background: #fff;height: 100%;/* min-height: 371px; */}

.addfix{ position: relative; float: left; width: 100%;padding: 35px 0 0;}
.addfix p{font-size: calc(16px + (18 - 16) * ((100vw - 300px) / (1920 - 300)));margin: 0 0 10px;}
.addfix p a{ color: #000;    text-decoration: underline;}
.addfix p a:hover{ color: rgb(20, 85, 228);   }
.addfix .stp2{ position: absolute; bottom: 10px; right: 0;width: auto;  margin: 0 0 0;}
.spends{padding-left: 46px;}

.prsetof{float: left; width: 100%; }
.prsetof p{padding:  0 0 0px 36px;position: relative;font-size: calc(18px + (20 - 17) * ((100vw - 300px) / (1920 - 300)));margin: 0 0 10px;}
.prsetof p::before{content: ""; position: absolute; left: 0; top: 0px; width: 20px; height: 18px; background-color: #212248;}
.prsetof p:nth-child(2):before{ background-color: #9090a3;}

.apexcharts-legend.apexcharts-align-left.apx-legend-position-top {width: 100% !important; display: none !important;}
div#app {float: left;width: 100%;}
.blue1 .listul ul li span{background: #fff;}
.autoacr2 .textcont{ float: right;}

.selectbl{ opacity: 0; background: #9090a3;position: absolute; bottom: 0px; left: 0; padding: 4px 12px 3px;font-size: calc(16px + (18 - 16) * ((100vw - 300px) / (1920 - 300))); font-weight: 500; }
.blue1 .selectbl{opacity: 1;}
 
/* .pdfset  button.close {  margin: -1px -20px 0 0;} */
.pdfset .modal-dialog{max-width: 992px;}
 
 .pdfset h2{background: #212248;font-size: calc(22px + (33 - 20) * ((100vw - 300px) / (1920 - 300)));padding: 15px 22px 12px;}
 .pdfset h3{ /*background: none;font-size: calc(20px + (30 - 20) * ((100vw - 300px) / (1920 - 300))); */padding:15px 22px 12px;}
 .pdfset h5{background: none;font-size: calc(18px + (30 - 20) * ((100vw - 300px) / (1920 - 300)));padding: 6px 22px 9px;}
 .pdfset h6{background: none;font-size: calc(18px + (25 - 20) * ((100vw - 300px) / (1920 - 300)));padding: 6px 22px 9px;}
 
 .pdfset ul {padding: 5px 22px 9px;margin-left: 36px;}
 .pdfset ul li{ font-size: 18px; padding:3px 0 3px; width: 100%;list-style: decimal;}
 .pdfset p{ font-size: 18px;  margin: 0; width: 100%;padding:0px 22px 12px;}
 .pdfset p span{ font-size: 17px;  font-style: italic;}
 .pdfset ul.cirblack li { list-style: disc;}
 .footnote{ display: inline-block; width: 100%; padding: 15px 0 10px;    border-top: 1px solid #0e0e0e;    margin-top: 16px;}
 .footnote p,.footnote ul li{ font-size: 15px;}
  .footnote ul li a{ color: #000;}
 .pdfset .modal-body{ background: #d3d3d3;}
 .pdfset .footnote ul { margin-left: 17px;}

 div#Productmo.fade.in , div#Productmo2.fade.in  , div#Productmo3.fade.in, div#Productmo4.fade.in  {opacity: 1;}
 .nvidia_modal .modal-dialog{ transform: translateY(-0px) !important;}
 .nvidia_modal {background: rgb(0 0 0 / 76%);}
 .nav-tabs > li a:focus, .nav-tabs > li a:hover { border-top: 0;border-bottom: 0; outline: none;}
.Hpvideo{display: none;height: 100%;position: fixed;top: 0;left: 0;z-index: 999;width: 100%;background-color: rgba(0,0,0,0.8);}
.overlay{ width: 100%; max-width: 660px; text-align: left; z-index: 9; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);    -webkit-transform: translate(-50%, -50%);    -moz-transform: translate(-50%, -50%);    -o-transform: translate(-50%, -50%);    -ms-transform: translate(-50%, -50%);}
.cancelBtn{position: absolute;right: 10px;height: 24px;cursor: pointer;top: 5px;}
.Hpvideo iframe{ min-height: 500px;}
img.cancelBtn {height: 46px;}
.scrtabs-tabs-movable-container .nav-tabs > li.active > a, .scrtabs-tabs-movable-container .nav-tabs > li > a:hover, .scrtabs-tabs-movable-container .nav-tabs > li.active > a, .scrtabs-tabs-movable-container .nav-tabs > li.active > a:focus, .scrtabs-tabs-movable-container .nav-tabs > li.active > a:hover{
border: 0px solid transparent;  border-left: 1px solid transparent;
}

@media screen and (max-width:1280px){
.section1,.section2{background: none;height: auto;}
.section1 img, .section2 img{ display: inline-block;}
.sectionMid .tab-content{    padding: 0 15px;}
.autoacr2{padding: 0;}
.autoacr2 .textcont{ float: right;}
.btncta{float: left ; width: 100%;}
.content_img .left h1,.content_img .left .info{margin: 0;padding: 20px 15px 20px 15px;}
*::-webkit-scrollbar {width: 5px;}
*::-webkit-scrollbar-track {background: #e8e8e8;}
*::-webkit-scrollbar-thumb {background-color: #c6c6c6;border-radius: 20px;border: 3px solid #c6c6c6;}
.textcont{max-width: 485px;}
.setdata2 .tophead {padding-left: 66px;  text-align: right;}
.content_img .frontText2{ width: calc(50% + -14px);}
}
@media screen and (max-width:1100px){
 .autoacr2{border: 0;}
 .scrtabs-tabs-movable-container { padding-left: 20px;}
 .setdata2 .tophead {   padding-left: 80px;}
 .setdata2::before{position: absolute; content: ""; height: 82%; left: 0; top: 91px; border-left: 1px solid #8d8989;}
 .tophead span{left: -41px;}
}

@media only screen and (max-width:992px) {
.slick-prev.slick-arrow.slick-disabled, .slick-next.slick-arrow.slick-disabled{opacity: 1 !important;}
.datatable_slider .slick-next, .datatable_slider .slick-prev {top: -27px;}
.datatable h2{ padding: 0 0 70px;}
.slick-prev{  left: auto;  right: 48px; background: url("https://www.hp.com/content/dam/sites/worldwide/apps/ise-tco-calculator/static/mockup/images/leftArrow.png") no-repeat left top;}
.slick-next{ width: 31px;background: url("https://www.hp.com/content/dam/sites/worldwide/apps/ise-tco-calculator/static/mockup/images/rightArrow.png") no-repeat left top;}
 
.content_img{display: block;}
.content_img .left{float: left ; height: auto;flex: 0 0 100%;max-width: 100%;}
.heacal br,.content_img .left .info br{display: none;}
.content_img .left h1,.content_img .left .info{max-width: 100%; padding: 20px 0px; float: left;}
.content_img .right{background: none; padding: 0;flex: 0 0 100%;max-width: 100%;}
.content_img .right img{display: inline-block;width: 100%;}
.datatable .col-md-12{padding: 10px 5px 10px 10px;}
.autoacr{height: auto;}
.mobilescr{/* width: 1500px; */display: flex;flex-wrap: nowrap;overflow-x: auto;}
.mobilescr .textcont{margin: 12px 07px 12px 0; flex: 0 0 auto;float: left;}
.mobilescr .tophead {padding: 15px 0px 29px;}
.setdata2 .tophead{ padding: 41px 0px 45px; text-align: center;}
.tophead span{position: static; text-align: center;margin: 18px 0 17px;}
.tophead{padding: 15px 0px 20px;    min-height: initial;}
.steo3 .tophead {padding: 0px 0px 24px;float: left;width: 100%;}
.spends{padding: 0 15px;}
.addfix .stp2{position: static; float: left; width: 100%;}
.addfix{padding: 17px 0 0;}
.steo3 .textcont {max-width: 480px;min-height: 210px;}
.steo3 .stp2 {margin: 14px 0 18px;}
.datatable .height_07{min-height: 78px;}
.setdata2::before{ display: none; content: ""; height: 82%; left: 0; top: 91px; border-left: 1px solid #8d8989;}
.nvidia_modal h4{ padding: 15px 42px 22px 16px;}
.nvidia_modal button.close {margin: 10px -32px 0 0;border: 0; background: none;}
.pdfset button.close {margin: 3px -28px 0 0;border: 0;background: none;}
.nvidia_modal button.close img {height: 31px;}

.centernav .row {display: block;}
.centernav .setdata{flex: 0 0 100%;max-width: 100%;}
.steo3 .setdatain, .steo3 .setdata { flex: 0 0 100%;max-width: 100%;}
.content_img .frontText2{ min-height: initial;    position: static;   padding: 0 0 21px !important;width: 100%;}
}
@media only screen and (max-width:767px) {
.strow{display: flex;}
.content_img .left h1{font-size: 30px;}
.content_img .left .info p{font-size: 22px;}
.main_block{width: 100%;}
.inptext{max-width: 100%; margin: 0 0 0;}
.inptext select{width: auto;}
.rangenu{font-size: 14px;      width: 100%;  display: inline-block; float: none;}
.inptext select,span#rangeval, span#rangeval2, .probar span{float: left;width: 179px; }
span#rangeval, span#rangeval2, .probar span{ margin: 18px 0px 4px 0px;}
.inptext select,span#rangeval, span#rangeval2,.inptext .form-control, .probar span{float: left;width: 173px;height: auto; padding: 0 10px 0; font-size: 15px; line-height: 31px;}
.probar .inputamount,.probar .inptext  {width: 173px;float: left;margin: 18px 0px 4px 0px;}
.probar .inputamount input,.probar .inptext input{ height: auto; padding: 0 10px 0; font-size: 15px; line-height: 31px;}
.Textetail{width: 100%;}
.infodata{padding: 7px 0 14px 7px;}
.Textetail h5{padding: 7px 12px 10px 9px;}
.imgdetail {text-align: center; width: 100%;    padding: 10px 0 0;}
.iconmi{padding: 0 15px;}
.steo3{padding: 9px 0 22px;}
.scrtabs-tabs-movable-container { padding-left: 0px;}
.setdata2 .tophead{ padding: 15px 0px 20px; text-align: center;}
.probar h4{font-size: 18px;padding: 0px 0 19px 0px;}
.probar.setsec {   padding: 18px 0 6px 0px;}
.probar h4{font-size: 17px;padding: 0px 0 19px 0px;width: 100%;}
/* section.datatable .col-sm-4{flex: 0 0 100%;max-width: 100%;} */
.cancelBtn{right: 10px;}
}
@media only screen and (max-width:740px){
 .datatable .cusall { float: left;flex: 0 0 50%; max-width: 50%;}
}
@media only screen and (max-width:640px){
.tophead span{ margin: 8px 0 17px;padding: 2px 15px 3px;font-size: 16px;}
.datatable .col-md-12{ min-height: 78px;}
.listul ul li{font-size: 15px;}
.listul{ padding: 12px 11px 10px;}
.textcont,.autoacr2 .textcont{float: left;}
.textcont{max-width: 320px;}
/* .mobilescr {width: 1100px;} */
.datatable .datatable_slider strong,.datatable strong{    font-size: 17px;}
.datatable .height_07 {min-height: 105px;}
.datatable .height_00 {min-height: 56px;}
.headst h4{font-size: 18px;}

.slider1_parent .main_block .slider_range{font-size: 16px;}
.headst p{font-size: 16px;}
.content_img .left .info p{font-size: 18px;}
.content_img .left h1{font-size: 24px;}
 
.content_img .left .info a { margin-top: 12px;}
.prsetof p{font-size: 16px;}
h2{font-size: 18px;}
.datatable .col-md-12{font-size: 16px;}
.rangenu{font-size: 14px; display: inline-block; float: none;}
.datatable .btncta a,.stp2 a{font-size: 14px;}

.nav-tabs > li a{padding: 0px 11px;font-size: 17px;line-height: 22px;}
.nav-tabs > li{padding: 4px 0px;}
.scrtabs-tabs-movable-container{padding-left: 13px;}
.scrtabs-tabs-fixed-container{margin: 0 0px !important;}
.scrtabs-tab-scroll-arrow-right,.scrtabs-tab-scroll-arrow-left{ display: none;}
.mobilescr .textcont{ margin: 1px 07px 12px 0;    min-height: 326px;}

}
@media only screen and (max-width:360px){
.nav-tabs > li a{padding:   0px 9px;font-size: 16px;line-height: 22px;}
.textcont{max-width: 270px;}
.listul ul li { font-size: 14px;}
.listul p{font-size: 15px;}
.setdata2 .tophead h4 { line-height: 22px;}
}


.headst p {line-height: calc(22px + (24 - 22) * ((100vw - 300px) / (1920 - 300)));}
*::-webkit-scrollbar {width: 12px; height: 12px; }
*::-webkit-scrollbar-track {background: #e8e8e8;}
	
/*	Main page CSS*/
*::-webkit-scrollbar-thumb {background-color: #c6c6c6; border-radius: 0px; border: 1px solid #c6c6c6;}
.clickopt > .heacal {background: #212248; }
.clickopt .heacal .container .xl {background: #212248; padding: 30px 0px;  color: #ffffff;}
.content_img .left {background: #e6e6e6;}
.content_img .left .info{color: #000000; padding-right: 60px;}
.content_img .left{min-height: 479px;}
.content_img .left .info .h3.tp50{padding-top: 35px; padding-bottom: 20px;}
.content_img .left .info .h3.tp50 img{margin-right: 25px; float: left;}
.content_img .left .info .btncta a:first-child{margin-right: 25px;}
	
/*Step 1 css*/
.bgin,.colblu,.nav-tabs{background: #212248; color: #ffffff}
.style1,.selectbl{ background: #9090a3;}
.datatable_slider_item.style1 label{color: #ffffff;}
.blue1,.blue1 .imgstep1{color: #000000; background: #e6e6e6;}
.selectbl{color: #ffffff; background: #212248;}
.nvidia_modal h4{background: #212248; color: #ffffff; padding-top: 25px;}
img.cancelBtn{height: 36px; top: 17px; margin-right: 10px;}
.nvidia_modal2 h6{ background: #6e6f88; color: #ffffff;}
.content_img .right{ background: url(https://www.hp.com/content/dam/sites/worldwide/apps/ise-tco-calculator/static/mockup/images/top-band.jpg); background-position: center top; background-repeat: no-repeat;}
.col-md-6.setdata .tophead h4{ padding: 6px 18px 7px; background: #e6e6e6;  border: 1px solid #6b6b6b; margin-right: 15px; position: relative;}
.col-md-6.setdata2 .tophead h4{ padding: 6px 18px 7px; background: #e6e6e6;  border: 1px solid #6b6b6b; margin: 0; position: relative;}
.tophead span{line-height: 34px; font-size: 24px; top: 15px;    background: #212248; color: #ffffff; border: 1px solid #212248;}
.setdata2 .tophead{padding-left: 57px;}	
 .col-md-6.setdata2 .tophead:before{left: 53%;}
 .seltop h4:before{content: ''; display: block; position: absolute; top: auto; bottom: -11px; left: 46%; width: 20px; height:20px; background: #e6e6e6; border-right:1px solid #6b6b6b;  border-bottom:1px solid #6b6b6b; -moz-transform:rotate(45deg);-webkit-transform:rotate(45deg); z-index: 1;}
.steo2 .headst h4 { padding: 20px 20px 0 20px;  background: #ffffff;  color: #000; border-bottom: 0px solid #000;}
.steo2 .headst h4.question { padding: 20px;  background: #999999;  color: #000; border-bottom: 1px solid #000;}
.steo2 .headst p {  background: #e6e6e6; padding: 20px; color: #000; border-bottom: 1px solid #000;}
.imgstep1 {background: #ffffff;}
#pagesSelected{font-size: 24px; padding: 7px; background: #e5e6e5;    border: 0;}	

.selepage h4{padding: 0 7px 0; background: #e5e6e5;}
.spends{background: #e6e6e6;padding-top: 29px;padding-bottom: 22px;}
.steo3 .setdatain { border-right: 0px solid #121212;}
.newsetData .headst p{font-size: 28px; line-height: 36px;}
.newsetData .stp2 a{ height: auto; padding: 0 18px;font-size: 26px; line-height: 52px;}
.newsetData p {padding: 86px 0 0;font-size: 30px; line-height: 35px;}
.chanColor .stp2 a{   background: transparent;   font-size: 18px;   color: #000; padding: 0 8px 0 24px; height: auto;  line-height: 32px; border: 1px solid black;}
span#spanSaving {font-size: 75px;padding: 33px 0 24px;display: block;width: 100%;}
.recalculate{height: 30px;}
.chanColor .stp2 a img.recalculate {  position: absolute; left: -17px;  height: 36px;  top: -2px;}
.chanColor .stp2 a:hover{background: #000000;    color: #fff;}
.newContent{max-width: 100%; width: 100%;}
.newContent .listul ul{ display: none;}
.newContent .textcont{ width: 100%; max-width: 100%;min-height: initial;display: flex;border: 0;}
.firsthead {/* max-width: 440px;  */ width: 100%; background: #6e6f88;color:#ffffff;}
.firsthead .listul { width: 100%; padding: 0;}
.firsthead .listul p{padding: 0;font-size: 26px;font-weight: 400;  line-height: 28px;  padding: 14px 16px 15px; margin: 0;}
.sectlist {max-width: 313px;width: 100%;background: #9b9bac; color:#ffffff; padding: 28px 23px 16px; align-items: center;display: flex;}
.newContent .imgstep1 img {height: 130px;}
.firsthead h2 {background: #212248;color:#ffffff;padding: 16px 16px 13px;font-size: 42px; line-height: 42px;}
.sectlist ul {margin-left: 15px;}
.sectlist ul li { font-size: 20px;  border-bottom: 1px solid #ffffff; margin: 0 0 9px;  padding: 0 0 8px;}
.newContent .imgstep1 { background: #e6e6e6; max-width: 313px; width: 100%; border: 0;}
.sectlist ul li:last-child{border: 0;}
.scroll-tco {bottom: 7px;right: 21px;cursor: pointer;position: fixed;transition: all .5s ease 0s;animation: mymove 2s infinite;/* border: 3px solid #000000; */border-radius: 100%;z-index: 9999; }
.scroll-tco a {font-size: 20px;line-height: 53px;color: #fff;background: #000000;padding: 0;text-align: center;line-height: 46px;display: inline-block;border-radius: 4%; text-decoration: none;margin: 3px;padding: 0 17px;}
.scroll-tco a:hover ,.scroll-tco a:focus {background: #5a5a5a;color: #fff;}
.addfix p a:hover {  color: rgb(0 150 214); background: transparent;}
.upin {-webkit-animation: uparrow 0.6s infinite alternate ease-in-out;margin-left: 6px;top: 6px;position: relative;}

@-webkit-keyframes uparrow {
  0% { -webkit-transform: translateY(0); opacity: 0.4 }
  100% { -webkit-transform: translateY(-0.4em); opacity: 0.9 }
}
.tophead {min-height:0px;}
.autoacr {height: 570px;}
.textcont {margin:12px 0 0px; max-width: 538px; min-height: 272px;}
.listul {padding:12px 24px 4px}
.prsetof p::before {background-color: #212248;}
.prsetof p:nth-child(2):before {background-color: #6e6f88;}



@media only screen and (max-width:1200px){
.firsthead h2{ font-size: 31px;line-height: 40px;}
#pagesSelected {font-size: 21px;}
span#spanSaving {font-size: 56px;}
.content_img .left .info .btncta a:first-child {margin-right: 3px;}
}

@media only screen and (max-width:992px){
.setdata2 .tophead{padding-left: 0px; width: 100%; display: inline-block;}
.col-md-6.setdata .tophead h4{width: 100%; display: inline-block;  padding-top: 8px; padding-bottom: 8px; text-align: center;}
.col-md-6.setdata .tophead:before{top: inherit; bottom: 12px; width: 15px; height: 15px; }
.steo2 .headst h4 {padding: 20px 0;}
.spends{ float: left;}
.chanColor .stp2 a{margin-left: 15px;}
.newsetData p{font-size: 22px; padding: 32px 0 0; line-height: 28px;}
span#spanSaveAmount,span#spanSaveCurrency {font-size: 38px;}
.newsetData .stp2 a{ font-size: 20px;line-height: 44px;}
span#spanSave{font-size: 24px; }
.firsthead .listul p{font-size: 24px;line-height: 27px;}
.firsthead h2{ font-size: 24px;line-height: 31px;}
.content_img .frontText2{background: none !important;}
.autoacr {height: auto;}
.scroll-tco a{padding: 0 10px; line-height: 36px;font-size: 18px;}
}

@media only screen and (max-width:767px){
.newContent .textcont{display: flex;flex-direction: column;}
div#divHighlightLaser .imgstep1{display: none;}
.newContent .imgstep1{text-align: center;    max-width: 100%;}
.newContent .imgstep1 img{ position: static;  -webkit-transform: translate(-0%, -0%);transform: translate(-0%, -0%);}
.content_img .left .info .h3.tp50{ max-width: 240px; padding-top: 20px;}
.content_img .left .info .h3.tp50 img{ width: 57px;height: auto; position: relative;bottom: 9px;}
.sectlist {max-width: 100%;}
}
@media only screen and (max-width:567px){
.tab-content h2 {font-size: 20px;}
.selepage {width: 100% !important;margin: 18px 0 0;}
#pagesSelected {font-size: 18px;}
.newsetData .stp2 a{ font-size: 18px;line-height: 40px;}
span#spanSave {font-size: 20px;}
.newsetData p {font-size: 20px;}
.firsthead h2{ font-size: 27px;line-height: 36px;}
.tophead span { line-height: 33px; padding: 4px 15px 0px; font-size: 23px;}
.listul {padding: 12px 11px 10px;}
.mobilescr .textcont{min-height: 290px;}
.sectlist ul li{font-size: 19px;}
.content_img .left .info{padding-right: 0;}
.btncta a{font-size: 16px; padding: 0 9px;}
.content_img .left .info .btncta a:first-child {margin-right: 0px;}
.content_img .left {min-height: initial;}
}
@media only screen and (max-width:360px){
.btncta a{font-size: 15px; padding: 0 7px;}
}
@media only screen and (min-width:1025px){
.firsthead {max-width: 42%;}
.sectlist,.newContent .imgstep1 {max-width: 29%;}
.setdata.spends{padding-right:36px;}
}
@media only screen and (min-width:768px) and (max-width:1024px){
.firsthead {max-width: 42%;}
.sectlist {max-width: 29%;}
.newContent .imgstep1 {max-width:29%;}
}