h1, h2, h3{font-size:30px;}
sup{font-size:14px;}
.sticky.fixed{background:white;top: 40px;border-top: 1px solid #d2d2d2;}
.list-elite{text-align: left;font-size:18px;padding-bottom:20px;}
.list-elite li{padding:5px;list-style-type: none;}
.list-elite li:nth-child(odd) {background: white;}
.list-elite li:nth-child(even) {background: #eaeaea;}
.hero_banner .tagline h1{font-size:45px;}
.hero_banner .tagline p{display:inline-block;margin-left:30px;}
/*Page Title*/
.page_title { float: left; font-size: 20px; line-height: 25px; color: #000000; padding-top: 23px;}
.hero_banner h1, .ready_to_impress h2, .security h2, .secure_pcs_info a, .adaptable_design h2, a.blue_btn, .accessories_tab h2{color:white;}
.modal-content{text-align:right;}
/*Page Title*/
noindex .container{max-width:1280px;}
/*navigation css Start */
.breadcrumbs{display:none;}
.box_section{background:#0d0a05;}
.fixed {position: fixed; width: 100%; z-index: 999}
.links {padding: 0; display: table; width: 100%; max-width: 350px; margin: 0 auto; text-align: center;}
.links > li {line-height: 0; display: table-cell; vertical-align: middle; position: relative;}
.links > li > a { display: block; padding: 23px 8px; text-align: center; text-decoration: none; line-height: 25px; font-size: 16px; white-space: nowrap; color: #000000;
  opacity: 0.6;}
.links > li > a.active,.links > li > a.active span {opacity: 1;}
.links > li > a span {white-space: normal; display: inline-block; vertical-align: middle; max-width: 100%; position: relative;}
.links > li > a > span:after {content: ''; display: block; height: 2px; width: 100%; left: 0; position: absolute; right: 0; bottom: -7px; margin: 0 auto; background: #ffffff; -webkit-transition: all .3s ease; transition: all .3s ease;}
.links > li > a.active > span:after {background: #006ba7;}
/*navigation css End */

.modal-dialog{max-width:1000px;min-width:300px;width:50%;}
/*Blue Background Button*/
.blue_btn { font-size: 16px; line-height: 41px; letter-spacing: 0.3px; color: #f8f8f8; background: #0171ad; height: 40px; padding: 0px 25px; display: inline-block;}
/*Blue Background Button*/

 
/* Hero Banner CSS*/
.hero_banner {width: 100%; float: left; background: url("../images/img_elite_dragonfly_module01_hero_desktop.jpg") no-repeat center top ; background-size: cover; height: 540px; position: relative;}

/*Tagline CSS*/
.tagline {width: 100%; text-align: center; color: #fff; padding: 154px 0 0 0; text-shadow: 0 3px 20px rgba(0, 0, 0, 0.08);}
.tagline p {padding: 32px 0 0 0;}
.tagline p:last-child {padding: 19px 0 0 0;}
/*Tagline CSS*/

/*Container*/
.hero_banner .container {height: 100%;}
/*Container*/

/*Sign up Section CSS*/
.hero_banner .sign_up { width: 100%; position: absolute; bottom: 20px; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); background-color: #f7f7f7; text-align: center;
  height: 60px; display: table; z-index: 1;}
.hero_banner .sign_up p {display: table-cell; vertical-align: middle;}
.hero_banner .sign_up .cta { font-size: 16px; line-height: 38px; letter-spacing: 0.3px; color: #0171ad; background: #ffffff; height: 38px; padding: 0px 25px; display: inline-block; border: 2px solid #0171ad; margin-left: 19px;}
.hero_banner .sign_up .cta:hover {color: #ffffff; background: #0171ad;}
.X {width: 16px; height: 16px; object-fit: contain; position: absolute; right: 29px; top:17px;}
/*Sign up Section CSS*/

/* Hero Banner CSS*/

/*incredibly light Sections CSS*/
.incredibly_light{float: left; width: 100%; background: url("../images/module02_background_desktop.jpg") no-repeat center top ; background-size: cover; height: 480px; display: table;}
.incredibly_light .product{width:60%; display: table-cell; vertical-align: middle; }
.incredibly_light_info{text-align: center; display: table-cell; vertical-align: middle; padding-right:160px;}
.incredibly_light_info h3{color: #000000; padding-bottom: 7px;}
/*incredibly light Sections CSS*/


/*Ready to impress Section CSS*/
.ready_to_impress{float: left; width: 100%; background: url("../images/module03_background_desktop.jpg") no-repeat center top ; background-size: cover; height: 540px;}
.ready_to_impress .wrap_info{max-width: 534px; margin:69px auto 0 auto; text-align: center; color: #fff; font-size: 20px; line-height: 28px;}
.ready_to_impress .wrap_info h2{padding-bottom: 11px;}
/*Ready to impress Section CSS*/

/*Features Section CSS*/
.features{float: left; width: 100%; position: relative; margin-top: -50px;}
.features .container{max-width: 942px;}
.features .wrap_info{width: 33.33%; text-align: center; float: left;  background: #fff; padding-bottom: 20px;}
.features .wrap_info h4{padding: 28px 0 28px 0;}
.features .wrap_info p{padding: 11px 0 0 0; min-height: 48px;}

.business_title{width: 660px; margin: 0 auto; text-align: center;}
.business_title h3 {color: #000; padding: 33px 0px 12px 0px;}


.features .video{float: left; width: 100%; overflow: hidden; margin: 32px 0px 34px 0px; }
.features .video .container{max-width: 1218px}
.features .video .videoWrapper {position: relative; padding-top: 40%;  background: #fff;}
.features .video .videoWrapper video {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #fff;} 



.business_sub_title{max-width:716px; width: 100%; margin: 0 auto 54px auto; text-align: center; font-size:22px; line-height: 28px; }
/*Features Section CSS*/


/*Work with peace of mind Section CSS*/
.work_with{float: left;	width: 100%; display: table; table-layout: fixed; background: url("../images/module05_workwithpeaceofmind_desktop.jpg") no-repeat center top ; background-size: cover; height: 540px;}
.work_with h2{display: table-cell; vertical-align: middle; text-align: center;}
/*Work with peace of mind Section CSS*/

.box_section{float: left; width: 100%; padding: 55px 0px;}

/*Privacy Camera Section CSS*/
.privacy_camera{float: left; width: 33.3333%; background: url("../images/hpprivacycamera_desktop.jpg") no-repeat center top ; background-size: cover; height: 418px; text-align: center; position: relative;}
.privacy_camera .info{position: absolute; bottom:32px; padding: 0px 30px; color: #fff;  text-align: center; left: 0; right: 0;}
.privacy_camera .info h4{color: #fff; padding: 0px 0px 4px 0px;}
.privacy_camera .info p{padding: 0px 16%; font-size: 14px; line-height: 20px; height: 40px;}
/*Privacy Camera Section*/

/*Integrated privacy screen Section CSS*/
.integrated_privacy_screen{float: left;  width: 33.3333%; background: url("../images/integratedprivacyscreen_desktop.jpg") no-repeat center top ; background-size: cover; height: 418px; text-align: center; position: relative;}
.integrated_privacy_screen .info{position: absolute; bottom:32px; padding: 0px 30px; color: #000; text-align: center; left: 0; right: 0;}
.integrated_privacy_screen .info h4{color: #000; padding: 0px 0px 4px 0px;}
.integrated_privacy_screen .info p{font-size: 14px; line-height: 20px; height: 40px;}
/*Integrated privacy screen Section CSS*/


/*Integrated privacy screen Section CSS*/
.multi_factor{float: left;  width: 33.3333%; background: url("../images/hpmultifactorauthenticategen_desktop.jpg") no-repeat center top ; background-size: cover; height: 418px; text-align: center; position: relative;}
.multi_factor .info{position: absolute; bottom:32px; padding: 0px 30px; color: #fff; text-align: center; left: 0; right: 0;}
.multi_factor .info h4{color: #fff; padding: 0px 0px 4px 0px;}
.multi_factor .info p{font-size: 14px; line-height: 20px; height: 40px;}
/*Integrated privacy screen Section CSS*/


/*World’s most secure PCs8 CSS*/
.secure_pcs{float: left; width: 100%; background: #f7f7f7; padding: 64px 0px; display: table; table-layout: fixed;}
.secure_pcs .secure_pcs_img{width: 49%; display: table-cell; vertical-align: middle;}
.secure_pcs .secure_pcs_info{width:51%;  display: table-cell; vertical-align: middle; text-align: center;}
.secure_pcs .secure_pcs_info .wrap_info{max-width:360px; width: 100%; margin: 0 auto;}

.secure_pcs .secure_pcs_info .wrap_info h3{color: #000; padding: 0px 0px 8px 0px;}
.secure_pcs .secure_pcs_info .wrap_info p{padding-bottom: 31px;}
/*World’s most secure PCs8 CSS*/


/*Exploded view Section CSS*/
.exploded_view{float: left; width: 100%; padding: 50px 0px;}
.exploded_view .exploded_view_image{width:49%; float: left;}
.exploded_view .exploded_view_tab{width:20%; float: left;}
.exploded_view .exploded_view_content{width:26%; float: right; font-size: 20px; line-height: 26px; color: #000;}


.exploded_view_tabs {overflow: hidden; width: 100%;margin: 0;padding:40px 0 0 0 !important; list-style: none; }
.exploded_view_tabs li {display: block !important; }
.exploded_view_tabs a {position: relative; background: #ffffff; display:block; text-decoration: none; color:rgba(0,0,0,0.5); font-size:16px; line-height: 22px; width:100%; }
.exploded_view_tabs .slick-slide{width: 100% !important; display: block !important; padding: 7px 0px 33px 0px; border-top: 2px solid #fff; }
.exploded_view_tabs .slick-slide.slick-current{ border-top: 2px solid #808080;}
.exploded_view_tabs .slick-slide.slick-current a{ color:rgba(0,0,0,1);}

.exploded_view_slider .slick-slide .display_pen{padding-top:29px !important;}
.exploded_view_slider .slick-slide .chassis{padding-top:90px !important;}
.exploded_view_slider .slick-slide .keyboard{padding-top:154px!important;}
.exploded_view_slider .slick-slide .processor{padding-top:216px !important;}
.exploded_view_slider .slick-slide .antenna{padding-top:283px !important;}




/*Exploded view Section CSS*/

/*Popup Section CSS*/
.modal-body {padding: 50px 50px 100px 50px;}
.modal-body .col-md-4.col-sm-4{padding:30px 47px; }
.modal-body .row:first-child{border-bottom: 1px solid #f2f2f2;}
.modal-body h4{padding-bottom: 9px;}
.modal-body .heading_h{height: 100px;}
.modal-body .row .blue_btn{background: #fff; color:#0171ad; border: 2px solid #0171ad; line-height: 38px}
/*Popup Section CSS*/


/*Adaptable design Section CSS*/
.adaptable_design{width:100%; float: left; background: #0d1424; padding: 54px 0px;}
.adaptable_design .wrap_text{max-width: 400px; width: 100%; text-align: center; color: #fff; margin: 0 auto 60px auto;}
.adaptable_design .wrap_text h2{padding-bottom: 7px;}


.adaptable_design_carousel {color: #ffffff;	padding:9px 0px 0; margin-top: -6px !important;}
.adaptable_design_carousel .slide {opacity: 0.6; cursor: pointer; position: relative;}
.adaptable_design_carousel .slide:after{content:""; border-top: 4px solid #0d1424; border-bottom-right-radius:5px; width: 100%; position: absolute; left: 0; top:0px; z-index: 999;}
.adaptable_design_carousel .slick-slide.slick-current.slick-active .slide,.cadaptable_design_carousel .slick-slide .slide:hover {opacity: 1;}

.adaptable_design_carousel .slick-slide.slick-current.slick-active .slide:after {border-color:#0071ad;  }
.adaptable_design_carousel .slide p {font-size: 16px; line-height: 22px;}
.adaptable_design_carousel .slide p:last-child{padding-top: 11px;}
.adaptable_design_carousel .slide img {margin: 16px 0px 17px 0px;}
.adaptable_design_carousel .slide p span {font-size: 20px; line-height:28px; color: #ffffff; }
/*Adaptable design Section CSS*/


/*HP Premier Care Solutions CSS*/
.care_solutions{float: left; width: 100%; background: #ffffff; padding: 64px 0px; display: table; table-layout: fixed;}
.care_solutions .care_solutions_img{width: 49%; display: table-cell; vertical-align: middle;}
.care_solutions .care_solutions_info{width:51%;  display: table-cell; vertical-align: middle; text-align: center;}
.care_solutions .care_solutions_info .wrap_info{width:75%; margin: 0 auto;}

.care_solutions .care_solutions_info .wrap_info h3{color: #000; padding: 0px 0px 8px 0px;}
.care_solutions .care_solutions_info .wrap_info p{padding-bottom: 31px;}

/*HP Premier Care Solutions CSS*/


/* Accessorize your experience Section CSS */
.accessories_tab{float: left; width: 100%; background: #0d1424; padding: 70px 0px 80px 0px;}
.accessories_tab h2{text-align: center;}

.accessories_tab .tab_main{max-width:1134px; float: left; width: 100%;}


#tabs {overflow: hidden; width: 100%;margin: 0;padding:52px 0 0 0; list-style: none; }
#tabs li {float: left; margin:0; width: 33.333333%;}
#tabs a {position: relative;background: #ffffff; float: left;	text-decoration: none; color:rgba(0,0,0,0.5); font-size:20px; line-height: 28px; width:100%; text-align: center; padding: 16px 0px;  }
#tabs a:hover, #tabs a:hover::after, #tabs a:focus, #tabs a:focus::after {background: #d5f3ff;color: #000;}
#tabs a:focus {outline: 0;}
#tabs #current a {background: #d5f3ff;  color: #000;}
#content {padding: 0px;position: relative;  display: table; width: 100%;}
#content .wrap_text{ position: absolute; top:27%; right: -60px; display: table !important; z-index: 1; max-width: 428px; width: 100%; box-shadow: 0 0 26px 0 rgba(0, 0, 0, 0.06); background: #ffffff; height: 182px;}
#content .wrap_text .dis{display: table-cell !important;  vertical-align: middle; padding-left: 50px;}
#content .wrap_text .dis p{padding-top: 7px;}
/* Accessorize your experience Section CSS */


/*Accessories Slider Section CSS*/
.accessories_slider{float: left; width: 100%; background: #f3f3f3;}
.accessories_slider .container{max-width: 1050px;}
 
.accessories_slider .slick-slide{margin:70px 15px;}
.accessories_slider .slide-item {background: #ffffff; padding: 5px 5px 29px 5px; box-shadow: 0 8px 12px 0px #b2b2b2; position: relative; }
.accessories_slider .slide-item .img {position: relative; padding-bottom: 25px;}
.accessories_slider .slide-item .img .title {background: #fff; padding: 10px 8px 10px 11px; position: absolute; color: #0073b2; pointer-events: none; z-index: 2; font-size: 20px; line-height: 28px; }
 

.accessories_slider .slide-item p{padding:0px 15px 0px 15px;}
.accessories_slider .slide-item ul{padding:24px 0px 23px 32px; margin: 0px;}
.accessories_slider .slide-item .price .blue_btn{margin-top: 9px; width: 110px; text-align: center; padding: 0px;}
.content-wrap p:first-child{min-height: 48px;}
.content-wrap ul{min-height: 150px;}
/*.price{position: absolute; bottom: 30px;}*/

/*Accessories Slider Section CSS*/

/*Bottom Sign up CSS*/
.stay_up {width: 100%; float: left; background: #0096d6; text-align: center; height: 262px; display: table;}
.stay_up h3 {display: table-cell; vertical-align: middle;}
.stay_up h3 span {display: block; padding-top: 26px;}

.stay_up .blue_btn{background: #fff; color: #0171ad;}

/*Bottom Sign up CSS*/


/*Footer CSS*/
footer {width: 100%; float: left; background: #e8e8e8; padding: 37px 0px;}
footer ol {margin: 0px; padding: 0px 0px 0px 20px;}
footer ol li { font-size: 12px; letter-spacing: 0.3px; color: #000000; line-height: 16px;}
footer ol li a {color: #000000; text-decoration: none;}
/*Footer CSS*/
.care_solutions_img.mobile_image{display: none; }

/*Mobile Menu Css*/
.mobile_btn {display: none; z-index:999; font-size:34px; margin-top: 18px;}
.mobile_btn a {text-decoration:none;}
.btn-open:after {color:#0096d6;	content:"\f0c9"; font-family:"FontAwesome"; transition-property:all .2s linear 0s;	-moz-transition:all .2s linear 0s; -webkit-transition:all .2s linear 0s; -o-transition:all .2s linear 0s; border-radius:0px;}
.btn-open:hover:after {color:#000;}
.btn-close:after {color:#0096d6; content:"\f00d"; font-family:"FontAwesome"; transition-property:all .2s linear 0s;-moz-transition:all .2s linear 0s; -webkit-transition:all .2s linear 0s; -o-transition:all .2s linear 0s;}
.btn-close:hover:after {color: #ec1c24;}

.toggle_menu {display:none; position:absolute; top:60px; width:100%; background:#fff; overflow:auto; z-index:99; right:0; border-top: 1px solid #e9e9e9;
-moz-box-shadow: 0 5px 10px rgba(0,0,0,.5);
-webkit-box-shadow: 0 5px 10px rgba(0,0,0,.5);
box-shadow: 0 5px 10px rgba(0,0,0,.5);}
.toggle_menu ul li{float: left; width: 100%; text-align: left;}
.toggle_menu ul li a{border-right: 0px; padding: 15px 20px; float: left; width: 100%;  border-top: 1px solid #e9e9e9 !important;}

.slick-next.slick-arrow.slick-disabled,.slick-prev.slick-arrow.slick-disabled{opacity: 0.5;}
/*Responsive CSS*/

.adaptable_design_slider img{width:100%;}

 @media only screen and (max-width:1024px){
	 .hero_banner .sign_up{width: 97%;}
	 	 .exploded_view_tabs .slick-slide{padding-bottom:25px;}

}

 @media only screen and (max-width:1024px) and (min-width:721px) {
	.acc_slider .slick-prev{left: 15px;}
	.acc_slider .slick-next{right:15px;}
	#content .wrap_text{top:18%; right: 0;}

	.hero_banner .sign_up{width: 96%;}
	.incredibly_light_info{padding-right: 0px;}
	.incredibly_light{height: 350px;}
	 
	 .exploded_view .exploded_view_content{font-size: 16px;}
	 .exploded_view_tabs .slick-slide{padding-bottom: 15px;}
		.exploded_view_tabs{padding: 0px !important;}
		.exploded_view_slider .slick-slide .display_pen{padding-top:0!important;}
		.exploded_view_slider .slick-slide .chassis{padding-top:0!important;}
		.exploded_view_slider .slick-slide .keyboard{padding-top:0!important;}
		.exploded_view_slider .slick-slide .processor{padding-top:0!important;}
		.exploded_view_slider .slick-slide .antenna{padding-top:0!important;}
	 
}



@media only screen and (max-width:767px) and (min-width:320px) {
	.mobile_btn {display: block; float: right;}
	.desktop_menu{display: none;}
	/*nav{height: 62px;}*/
	.blue_btn.pull-right{display: none;}
	.page_title{padding-top: 18px;}
	
	.links {max-width: 100%;}
	.toggle_menu p{text-align: center; padding-bottom: 15px;}
	.close {right: 0; top: 0; background: #0171ad !important; padding: 3px !important; font-size: 0px; }
	
	.modal-body .col-md-4.col-sm-4{border-bottom: 1px solid #f2f2f2;  padding-left: 0px; padding-right: 0px;}
	.modal-body .heading_h{height: auto;}
	.modal-body .col-md-4.col-sm-4:last-child{border: 0px;}
	.modal-body {padding-top: 50px; padding-bottom: 50px;}
	.close{position: fixed;}
/*	#myModal .modal-content {   height:70vh; overflow:hidden; overflow-y:scroll;}*/

	
}

@media only screen and (max-width:720px) and (min-width:320px) {
	
		.exploded_view_tabs .slick-slide{border-bottom: 2px solid #fff; border-top: 0px; padding: 0px 0px 10px 0px; margin-bottom: 28px;}
		.exploded_view_tabs .slick-slide.slick-current{border-bottom: 2px solid #7f7f7f;  border-top: 0px;}
		.exploded_view_tabs .slick-slide{display: inline !important; width:auto!important; margin-right:30px;}
		.exploded_view_tabs .slick-slide:last-child{margin: 0px;}
		.exploded_view .exploded_view_image,.exploded_view .exploded_view_tab,.exploded_view .exploded_view_content{width: 100%;}
		.exploded_view_slider .slick-slide .display_pen{padding-top:0!important;}
		.exploded_view_slider .slick-slide .chassis{padding-top:0!important;}
		.exploded_view_slider .slick-slide .keyboard{padding-top:0!important;}
		.exploded_view_slider .slick-slide .processor{padding-top:0!important;}
		.exploded_view_slider .slick-slide .antenna{padding-top:0!important;}

	
	.hero_banner{background:#09101d url("../images/img_elite_dragonfly_module01_hero_mobile.jpg") no-repeat; height: 463px;}
	
  	.container {max-width: 92%; padding: 0px;}
	.hero_banner .sign_up{bottom: -25px; position: relative;}
	
	.incredibly_light .product,.secure_pcs .secure_pcs_img,.secure_pcs .secure_pcs_info,.care_solutions .care_solutions_info{display: table; width: 100%;}
	.incredibly_light{background: #f3f3f3; padding-bottom: 141px;}
	.incredibly_light_info{display: inherit; width:70%; padding: 0px; margin: 0 auto;}
	
	.ready_to_impress .wrap_info{max-width: 309px;}
	.features .wrap_info{width: 100%;}
	.business_title{width: 75%; padding-top:50px;}
	.business_sub_title{max-width: 65%;}
	
	.privacy_camera,.integrated_privacy_screen,.multi_factor{width: 100%; height: 680px;}
	
	
	.privacy_camera{background: url("../images/hpprivacycamera_mobile.jpg") no-repeat center top ; background-size: cover;}
	.multi_factor{ background: url("../images/hpmultifactorauthenticategen_mobile.jpg") no-repeat center top ; background-size: cover;}
	.integrated_privacy_screen{background: url("../images/integratedprivacyscreen_mobile.jpg") no-repeat center top ; background-size: cover; margin: 10px 0px;}
	
	
	.secure_pcs .secure_pcs_info {padding-top: 40px;}
	.adaptable_design .container:last-child{}
	
	
	.care_solutions_img.mobile_image{display: block; width: 100%;}
	.care_solutions_img.desktop_image{display: none; }
	.care_solutions_info{padding-top: 45px;}
	
	#content .wrap_text {position: relative; max-width:60%; left: 50%; margin-left: -30%; height: 180px; top: -29px;}
	#tabs a{font-size: 18px; line-height: 24px; padding: 16px 0px;}
	#content .wrap_text .dis{padding-left: 11.7%;}
	
	.acc_slider .slick-prev{left: 15px;}
	.acc_slider .slick-next{right:15px;}
	
	.tagline p{padding-top: 28px;}
	.tagline p:last-child{padding-top: 13px;}
	
	.ready_to_impress{background: url("../images/readytoimpress_background_mobile.jpg") no-repeat center top; background-size: cover; height: 810px;}
	.features .container{max-width: 92%;}
	
	.features .video .container{max-width: 92%;}
	
	.work_with { background: url("../images/workwithpeaceofmind_mobile.jpg") no-repeat center top; background-size: cover; height: 495px;}
	
	.incredibly_light .product{padding-top: 50px;}
			
}

@media only screen and (max-width:640px) and (min-width:320px) {
	#content .wrap_text {max-width:80%; left: 50%; margin-left: -40%; }
	.business_sub_title {max-width: 80%;}

	.hero_banner .sign_up p span{display: block; padding-top: 8px;}
	.hero_banner .sign_up {padding: 10px 0px;}
	.X{bottom: 27px; top: inherit;}
	.stay_up h3{padding: 0px 15px;}
  .price{bottom: 20px;}
	
	}