@import "navigation.css";
/*from custom tw*/
.content h2, .content-r h2, #g-intro h2, #g-features h2{
font-size: 34px;
font-weight:bold !important;
padding:12px 0;
line-height: 49px;
}
#bit p{margin-top:20px}
#product{margin-bottom:88px}
.content-l{
align-items: center;
text-align:left;
}
.content-r{align-items:baseline; text-align:center}
.content-l>.pic {
text-align: center;
padding:3%;
}
.content-l>.pic>img{
width:560px;
}
.content-l,.content-r{
padding:3% 9%;
justify-content: center;
}
.content{
padding:1% 4%;
font-size:18px;
}
.content-l .content{text-align:left}
/*only for solutions*/
.banner{
background:url(/images/ezdupe/webpage/Solution/Data-Duplicator_01.png) center center no-repeat;
padding:1vw 7.5%;/*13%*/
display:flex;
align-items:center;
justify-content:center;
color:#fff;
font-size:20px;
margin-top: -1px;
line-height:30px;
background-size:cover;
}
.banner h1{
font-size:42px;
font-weight:700 !important;
margin: 33px 0 10px;
}
.banner small {
background-color: #3e3a39;
padding: 13px 17px;
font-size:18px;
}
.nav-pills{
border-bottom:1px solid #000;
margin-top:50px;
padding:0 30px;
display:flex;
justify-content:space-between;
}
/*.nav-pills li:first-child > a{float:left;}
.nav-pills li:last-child > a{float:right;}*/
.content strong {
font-size: 24px;
}
#solution{
	padding:20px 9%;
	margin-top:7%;/*132*/
}
#bit .content-l {
    margin: 40px 6%;
	flex-direction:row-reverse;
    padding: 0;
}
hr{
width:100%;
background-color: #c7c8c9;
}
h4{
font-weight:bold !important;
}
#g-header{
padding:0;
}
.nav-pills > li > a{
border-radius:0 !important;
display:inline-block;
margin:auto;
background-color:#fff !important;
padding:8px 0 25px;
color:#595757 !important;
font-size:24px;
line-height:35px
}
.nav-pills a.active{
border-bottom:8px solid #06ffff;
}
.tab-content{
padding:0 5%;
}
.vcontainer {
position: relative;
width:100%;
height:0;
margin-top:3%;
padding-bottom: 56.25%;
}
iframe.videoembed {
position:absolute;
height:100%;
width:100%;
}
.product{
white-space:nowrap;
position:relative;
transition:all 0.5s;
}
.p-item{
height:500px;
display:flex;
flex-direction:column;
border-radius: 7%;
margin: 0.5vmin;
text-align:center;
box-shadow: 3px 6px 9px rgba(0,0,0,.3);
font-size:14px;
padding:2%;
padding-bottom:7%
}
.p-item:hover {
transform: scale(1.02);
transition: all 0.2s;
z-index:1;
}
.p-item .pic{
max-height:280px;
width:auto;
max-height:280px;
transform:translateY(-10px);
margin:20px auto
}
.text{
text-align:left;
padding:0 8%;
position:relative;
top:-6px
}
.text:before {
    background-color: #f9ec00;
    content: "";
    position: absolute;
    height: 5px;
    width: 80px;
    top: -20px;
    z-index: auto;
}
.owl-nav div{
	background:rgba(0,0,0,.2);
}
.owl-dots{
	bottom:0
}
.owl-dots .owl-dot.active{
	background-color:#5d6885
}
.owl-stage{
	padding:20px
}
.owl-stage-outer {
    padding-bottom: 3%;
}
.owl-dots .owl-dot{background:#d6d6d6}
.owl-nav .owl-prev, .owl-nav .owl-next{font-size:35px;display: flex;justify-content: center;
align-items: center;}
.owl-nav .owl-next{right:6vw !important}
.owl-nav div:hover{
background:#5d6885;
}
.owl-next.disabled, .owl-prev.disabled{
display:none;
}
.owl-item a {
color: #3e3a39;
}
.owl-carousel .owl-item img {
width:100%;/*auto*/
height:100%;
margin:auto;
}
#erase .owl-item img{height:auto}
a:hover{
text-decoration:none !important;
}
#forward, #previous{display:none}
/*media query*/
@media screen and (max-width:576px){
.banner h1{margin-top:16px}
.tab-content{padding:0}
.p-items{max-height:330px}
.owl-nav .owl-prev, .owl-nav .owl-next{display:none}
/*mobile modified*/
.content-l, .content-r{padding:12% 10%; text-align:left}
.content-l>.pic{padding:7%; margin-top:5.2%}
.banner small{padding:8px 10px}
.nav-pills{padding:0 17px !important; margin-top:30px}
.nav-pills > li > a{padding: 0 0 14px}
.nav-pills li:not(:first-child) > a {width: 74px;}
.nav-pills > li{padding:0;text-align:center}
.tab-content .content-l{padding:0 10%}
.content-r{padding-bottom:0}
.nav-pills a.active {
    border-width: 6px;
}
.tab-content{padding: 0 0 13.8%}
.tab-content .pic{padding:5% 1% 0 !important}
#bit .content-l{margin:0 6%}
#bit p{margin-top:10px}
#solution{padding:0 10% 0; margin-top:0}
.owl-stage{padding:0 0 30px}
.owl-dots{display:none;}
#product{margin-bottom:22px}
.p-item .pic{max-height:250px;height:250px;width:250px}
.p-item{padding-bottom: 18px;height:100%;font-size:12px}
.owl-carousel .owl-stage{display:flex}
.vcontainer{margin-top:10.6%}
.tab-content hr{margin-top:60px !important}
/*15px*/
.banner small, .content, .banner, .nav-pills > li > a, .content strong, #g-features h4{font-size:15px; line-height:22px}
/*18px*/
#bit h2, #indep h2, #intel h2{font-size:18px !important;margin:19px 0 8px;line-height:26px !important;font-weight:500}
#bit h2{margin-bottom:18px}
/*24px*/
#g-intro h2, .content-r h2, .content h2{font-size:24px; line-height:35px}
/*32px*/
.banner h1{
font-size:32px;line-height:46px}
#g-features h2{font-size:18px;line-height:24px}
}
@media screen and (min-width:768px){
#product{margin-left: 5%}	
}
@media screen and (max-width:991px){/*767*/
.banner{flex-direction:column-reverse;padding:60px 10% 0 !important}
#bit .content-l{flex-direction:column-reverse;}
}
@media screen and (min-width:768px) and (max-width:992px){
.banner h1{	font-size:2.5rem;}
.banner .pic{padding-top:10vw}
}
@media screen and (min-width:1080px){
.content-r .content{padding:0 3%}
}
@media screen and (min-width:1440px){
.content-r .content{padding:0 5%}
}