.pagewrapper{overflow: hidden;}
.pagewrapper *{box-sizing: border-box;}
.pagewrapper .content-wrap{max-width:1280px;padding:90px 0;}
.block2 .content-wrap,.block3 .content-wrap,.faq .content-wrap{padding-top: 20px}
.act-btn{padding:12px 30px;background: #f0483e;color: #fff;}
.pop-inner .act-btn{padding:9px 10px;margin: 15px;font-size: 12px;}
h1,h2,h3{font-family: var(--zf-primary-bold);}
p.cta-wrap-associate{margin-bottom:0px}
.zw-product-header ,.banner {background-color: #DF55470D;}
.bnr-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } 
.bnr-inner > div { width: 50%; position: relative; } 
.bnr-left { padding-right: 80px;}
.sup-img1,.sup-img2,.sup-img3,.sup-img4,.sup-img5{opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}
.sup-img1 {position: absolute;left: 23%;max-width: 40px;top: 6%;z-index: -1;-webkit-animation: animinup1 1s ease 1;animation: animinup1 1s ease 1;}
.sup-img2 {position: absolute;left: 33%;max-width: 55px;top: 3%;z-index: -1;-webkit-animation: animinup2 1s ease 1;animation: animinup2 1s ease 1;-webkit-animation-delay: 1s;animation-delay: 1s}
.sup-img4 {position: absolute;left: 73%;max-width: 40px;top: 6%;z-index: -1;-webkit-animation: animinup3 1s ease 1;animation: animinup3 1s ease 1;-webkit-animation-delay: 2s;animation-delay: 2s}
.sup-img5 {position: absolute;left: 61%;max-width: 55px;top: 3%;z-index: -1;-webkit-animation: animinup4 1s ease 1;animation: animinup4 1s ease 1;-webkit-animation-delay: 3s;animation-delay: 3s}
.sup-img3 {position: absolute;left: 44%;max-width: 90px;top: -2%;z-index: -1;-webkit-animation: animinup5 1s ease 1;animation: animinup5 1s ease 1;-webkit-animation-delay: 4s;animation-delay: 4s}
.in-view .sup-img1{opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";}
.in-view .sup-img2{opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";-webkit-transition-delay: 1s;transition-delay: 1s}
.in-view .sup-img4{opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";-webkit-transition-delay: 2s;transition-delay: 2s}
.in-view .sup-img5{opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";-webkit-transition-delay: 3s;transition-delay: 3s}
.in-view .sup-img3{opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";-webkit-transition-delay: 4s;transition-delay: 4s}
@-webkit-keyframes animinup1{
	from{left:47%;top:25%;-webkit-transform: scale(1.3);transform: scale(1.3);}
	50%{left:47%;top:5%;-webkit-transform: scale(1.3);transform: scale(1.3);}
	65%{left:47%;top:5%;-webkit-transform: scale(1.3);transform: scale(1.3);}
	100%{left:23%;top:6%;-webkit-transform: scale(1);transform: scale(1);}
}
@keyframes animinup1{
	from{left:47%;top:25%;-webkit-transform: scale(1.3);transform: scale(1.3);}
	50%{left:47%;top:5%;-webkit-transform: scale(1.3);transform: scale(1.3);}
	65%{left:47%;top:5%;-webkit-transform: scale(1.3);transform: scale(1.3);}
	100%{left:23%;top:6%;-webkit-transform: scale(1);transform: scale(1);}
}
@-webkit-keyframes animinup2{
	from{left:47%;top:25%;}
	50%{left:47%;top:5%;}
	65%{left:47%;top:5%;}
	100%{left:33%;top:3%;}
}
@keyframes animinup2{
	from{left:47%;top:25%;}
	50%{left:47%;top:5%;}
	65%{left:47%;top:5%;}
	100%{left:33%;top:3%;}
}
@-webkit-keyframes animinup3{
	from{left:47%;top:25%;-webkit-transform: scale(1.3);transform: scale(1.3);}
	50%{left:47%;top:5%;-webkit-transform: scale(1.3);transform: scale(1.3);}
	65%{left:47%;top:5%;-webkit-transform: scale(1.3);transform: scale(1.3);}
	100%{left:73%;top:6%;-webkit-transform: scale(1);transform: scale(1);}
}
@keyframes animinup3{
	from{left:47%;top:25%;-webkit-transform: scale(1.3);transform: scale(1.3);}
	50%{left:47%;top:5%;-webkit-transform: scale(1.3);transform: scale(1.3);}
	65%{left:47%;top:5%;-webkit-transform: scale(1.3);transform: scale(1.3);}
	100%{left:73%;top:6%;-webkit-transform: scale(1);transform: scale(1);}
}
@-webkit-keyframes animinup4{
	from{left:47%;top:25%;}
	50%{left:47%;top:5%;}
	60%{left:47%;top:5%;}
	100%{left:61%;top:3%;}
}
@keyframes animinup4{
	from{left:47%;top:25%;}
	50%{left:47%;top:5%;}
	60%{left:47%;top:5%;}
	100%{left:61%;top:3%;}
}
@-webkit-keyframes animinup5{
	from{left:44%;top:20%;-webkit-transform: scale(.7);transform: scale(.7);}
	100%{left:44%;top:-2%;-webkit-transform: scale(1);transform: scale(1);}
}
@keyframes animinup5{
	from{left:44%;top:20%;-webkit-transform: scale(.7);transform: scale(.7);}
	100%{left:44%;top:-2%;-webkit-transform: scale(1);transform: scale(1);}
}

.block1 h2{text-align: center}
.tab-wrap{position: relative;}
.tab {text-align: center;margin: 50px auto 70px;position: relative;}
.tab a { display: inline-block; padding: 12px 50px; color: #000; font-family: var(--zf-primary-semibold); font-size: 20px; margin: 0 60px;opacity: .5;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";}
.tab a.active{opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";}
.flex-wrap {display: -webkit-box;display: -ms-flexbox;display: flex;}
.flex-wrap > div {width: 50%;}
.flex-wrap .acc-cont {width: 60%;}
.flex-wrap .acc-img {width: 40%;}
.acc-cont .flex-wrap > div {margin-bottom: 60px;padding: 0 100px 0 0;position: relative;}
.zicon:before {content: '';display: block;width: 50px;height: 50px;background-color: #fcf5f4;margin-bottom: 20px;border-radius: 5px}
.zicon:after { content: ''; display: block; width: 30px; height: 30px;margin-bottom: 20px; position: absolute; top: 12px; left: 9px; }
.data-loaded .zicon:after{background: url(/sites/zweb/images/creator/training/certification-training-sprite.png) no-repeat; background-size: 500px auto;}
.block1 .zicon2:after{background-position: -36px 1px}
.block1 .zicon3:after{background-position: -70px -1px;}
.block1 .zicon4:after{background-position: -106px -1px;}
.block1 .zicon5:after{background-position: -141px 0px;}
.block1 .zicon6:after{background-position: -176px 0px;}
.block1 .zicon7:after{background-position: -211px -1px;}
.block1 .zicon8:after{background-position: -246px -2px;}
.acc-org{display:none;}
span.active-ele {position: absolute;width: 10px;height: 10px;background: #d05e4e;border-radius: 10px;bottom: 0;-webkit-transition: all 800ms ease;transition: all 800ms ease;}

.block2 h2 {text-align: center;}
.certificates {margin-top: 60px;}
.flex-3-col .box {width: 33.33%;padding: 20px;margin: 0 30px;text-align: center;box-shadow: 0 0 20px 0px rgb(0 0 0 / 6%);border-radius: 5px;}
/*popup block*/
.box-inner {padding: 20px 20px 30px 20px;background: url(/sites/zweb/images/creator/training/certified-ribbon.png) no-repeat; background-size: 90%; background-position: center top;position: relative;}
.box-inner:after { content: ''; width: 97%; height: 97%; border: 3px solid #f4ddda; position: absolute; top: 6px; left: 3px; z-index: -1; }
.thumb-img img {max-width: 150px;-webkit-transition: all 500ms ease;transition: all 500ms ease;}
.box-inner:hover .thumb-img img{-webkit-transform: scale(1.1);transform: scale(1.1);}
.box h3 {font-size: 20px;margin-top: 20px;}
.pop-inner .flex-wrap img {width: 80px;}
a.popup-cta {color: #DF5547;display: inline-block;border: 1px solid #DF5547;text-transform: uppercase;font-size: 14px;padding: 8px 20px;font-family: var(--zf-primary-semibold);}
.thumb-img {margin-top: 30px;}
.box-popup { width: 50%; left: 0; right: 0; margin: auto; top: 0px; z-index: 2;max-width: 770px;visibility: hidden;opacity: 0;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";-webkit-transition: all 500ms ease;transition: all 500ms ease;position: fixed;max-height: 90%;overflow: scroll;}
.box-popup.active{top:50px;opacity: 1;-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";visibility: visible;}
.pop-inner {margin-top: 60px;position: relative;border-radius: 10px;background:#fff;padding: 40px 50px 50px 50px;overflow: auto;max-height:80%;z-index: 2; background: #fff; }
.popup-overlay { position: fixed; background: #000; top: 0; left: 0; width: 100%; height: 100%;z-index: 1; opacity: .7; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; }
.pop-inner img {width: 130px;}
.pop-inner .flex-wrap {max-width: 600px;margin: 0 auto;}
.pop-inner h3 {margin-top: 10px}
.pop-inner p {font-size: 15px;}
.pop-inner .flex-wrap > div {border: 1px solid #d3d3d3;border-radius: 5px;margin: 0 10px;padding: 20px;}
span.zclose {position: absolute;background: #000;width: 30px;height: 30px;border-radius: 50%;right: 10px;top: 70px;cursor: pointer;z-index: 3;}
.zclose:before,.zclose:after{content: '';position: absolute;height: 12px;width: 2px;background: #fff;top: 9px;}
.zclose:before {-webkit-transform: rotate(45deg);transform: rotate(45deg);left: 14px;}
.zclose:after {-webkit-transform: rotate(-45deg);transform: rotate(-45deg);right: 13px;}
.info {background-color: #fef6f5;color: #d05e4e;padding: 20px 20px 20px 20px;max-width: 600px;margin: 0 auto 20px;}
.soft-cta{text-decoration:underline;font-size:15px;}
.info p{margin-bottom: 10px}
.info p span{font-family: var(--zf-primary-semibold)}
/*popup block*/

/*FAQ*/
.faq h2{text-align: center;margin-bottom: 40px;}
.faq-wrap{max-width: 900px;margin:auto;}
.faq-item {border-bottom: 1px solid #d3d3d3;}
.faq-item:first-child .faq-ans{display:block;}
.faq-ans {display: none;padding-bottom: 10px;padding-left: 42px;}
.faq-item h4 {margin-bottom: 0;font-family: var(--zf-secondary-medium);padding: 20px 0px 20px 40px;cursor: pointer;position: relative;font-size: 20px;color:#000;}
.faq-item h4:hover{color:#555;}
.faq-item h4:before,.faq-item h4:after{content:'';position: absolute;background: #ea5154;}
.faq-item:hover h4:before,.faq-item:hover h4:after{background: #555;}
.faq-item h4:before{left:0px;top:35px;height: 2px;width:16px;}
.faq-item h4:after{left: 7px; width: 2px;top: 28px;height: 15px; }
.faq-item.active h4:after{ height: 0px; }

.block3{text-align: center}
.block3 .flex-wrap{max-width: 900px;margin:0 auto;}
.block3 .zicon:before{margin: 0 auto; background: url(/sites/zweb/images/creator/training/certification-training-sprite.png) no-repeat; background-size: 700px auto; background-position: -400px 0; height: 60px; width: 37px;display: inline-block;}
.block3 .zicon10:before {background-position: -443px 0;width: 15px;-webkit-transition: all 300ms ease;transition: all 300ms ease;}
.block3 .flex-item1:hover .zicon10:before{-webkit-transform: rotate(45deg);transform: rotate(45deg);}
.block3 .zicon11:before {background-position: -464px 0;width: 41px;position: relative;z-index: 1;}
.block3 .zicon12:before {background-position: -506px 0;width: 23px;-webkit-transition: all 300ms ease;transition: all 300ms ease;z-index: -1}
.block3 .flex-item2:hover .zicon12:before{-webkit-transform: translateX(-20px);transform: translateX(-20px)}
.block3 .flex-item2:hover .zicon11:after{top:-55px;}
.block3 .zicon:after{display:none;}
span.zicon.zicon10 {margin-left: -7px;}
span.zicon.zicon12 {margin-left: -14px;}
span.zicon.zicon11:after { position: absolute; content: ''; display: block; background: grey; top: -38px; height: 30px; margin: 0; left: 8px; width: 22px;-webkit-transition: all 300ms ease;transition: all 300ms ease;}
span.zicon.zicon11 {position: relative;}

.block3 .flex-wrap > div { padding: 50px; box-shadow: 0 0 14px 0 rgb(0 0 0 / 9%); margin: 30px; border-radius: 10px; }

@media all and (min-width:1200px){
	.inup1,.inup2,.inup3,.inup4,.inup5,.inup6{-webkit-transform: translateY(60px);transform: translateY(60px);-webkit-transition: all 1500ms ease;transition: all 1500ms ease;}
	.in-view .inup1,.in-view .inup2,.in-view .inup3,.in-view .inup4,.in-view .inup5,.in-view .inup6{-webkit-transform: translateY(0px);transform: translateY(0px);}
	.inup1{-webkit-transition-delay: 100ms;transition-delay: 100ms;}
	.inup2{-webkit-transition-delay: 300ms;transition-delay: 300ms;}
	.inup3{-webkit-transition-delay: 500ms;transition-delay: 500ms;}
	.inup4{-webkit-transition-delay: 700ms;transition-delay: 700ms;}
	.inup5{-webkit-transition-delay: 900ms;transition-delay: 900ms;}
	.inup6{-webkit-transition-delay: 1200ms;transition-delay: 1200ms;}
	.box-popup {width: 70%;}
.imgwrap img:first-child {max-width: 500px;margin: 40px auto 0;display: block;}
}

@media all and (min-width:992px) and (max-width:1199px){
	.block1 .content-wrap{padding-bottom: 30px}
	.bnr-left {padding-right: 50px;}
	.sup-img1,.sup-img4{max-width: 30px;}
	.sup-img2,.sup-img5{max-width: 45px;}
	.sup-img3{max-width: 70px;}
	.flex-3-col .box{margin: 0 15px;padding: 15px;}
	.thumb-img img{max-width: 130px;}
	.acc-cont .flex-wrap > div{padding: 0 60px 0 0;margin-bottom: 40px;}
	.certificates {margin-top: 40px;}
	.box-popup{width:70%;}
	.pop-inner{margin-top: 60px}
}

@media all and (min-width:768px) and (max-width:991px){
	.pagewrapper .content-wrap{padding: 60px 0;}
	.block1 .content-wrap,.faq .content-wrap{padding-bottom: 10px}
	.banner .content-wrap{padding-top: 30px}
	.bnr-inner{-ms-flex-flow: column;flex-flow: column;}
	.bnr-inner > div{width:90%;text-align: center;}
	.bnr-left{padding-right: 0px}
	.bnr-right{margin-top: 60px}
	.tab{margin: 30px auto 40px;}
	.tab a{margin: 0 30px;padding: 6px 0px;}
	.tab a.active{border-bottom: 1px solid #000;}
	span.active-ele{display: none}
	.acc-cont .flex-wrap > div{padding: 0 50px 0 0;margin-bottom: 30px;}
	.flex-3-col .box{width: 30.33%;padding: 10px;margin: 0px 10px;}
	.thumb-img img{max-width: 100px;}
	.acc-item > .flex-wrap{-webkit-box-align: center;-ms-flex-align: center;-ms-grid-row-align: center;align-items: center}
	.flex-wrap .acc-cont{width:70%;}
	.flex-wrap .acc-img{width:30%;}
	.box-popup{width:80%;}
	.pop-inner{margin-top: 60px}
	.faq-item h4{font-size: 18px}
}
@media all and (max-width:767px){
	.pagewrapper .content-wrap{padding: 60px 0;width:85%;max-width:420px}
	.block1 .content-wrap,.faq .content-wrap{padding-bottom: 10px}
	.block2 .content-wrap{padding-top: 30px;padding-bottom: 0px}
	.banner .content-wrap{padding-top: 30px}
	.faq h2{margin-bottom: 20px}
	.bnr-inner{-ms-flex-flow: column;flex-flow: column;}
	.bnr-inner > div{width:100%;text-align: center;}
	.bnr-left{padding-right: 0px}
	.bnr-right{margin-top: 60px}
	.sup-img1,.sup-img4{max-width: 15px;}
	.sup-img2,.sup-img5{max-width: 25px;}
	.sup-img3{max-width: 50px;}
	.tab{margin: 30px auto 40px;}
	.tab a{margin: 0 10px;padding: 6px 0px;font-size: 16px}
	.tab a.active{border-bottom: 1px solid #000;}
	.flex-wrap .acc-img,span.active-ele{display: none}
	.flex-wrap .acc-cont,.acc-cont .flex-wrap > div{width:100%;}
	.acc-cont > .flex-wrap{-ms-flex-flow: column;flex-flow: column;}
	.acc-cont .flex-wrap > div{padding:0px;margin-bottom: 30px}
	.certificates.flex-wrap {-ms-flex-flow: column;flex-flow: column;}
	.certificates.flex-wrap > div {width:100%;margin:0 0 30px 0;}
	.thumb-img img{max-width: 100px}
	.pop-inner{margin-top: 0px;padding: 20px 20px;}
	.box h3{margin-top: 10px}
	.pop-inner img{display: none}
	.box-popup{width:90%;}
	.pop-inner .flex-wrap,.block3 .flex-wrap{-ms-flex-flow: column;flex-flow: column;}
	.pop-inner .flex-wrap > div img{display: block;margin:0 auto;}
	.pop-inner .flex-wrap > div{width:80%;padding:20px;margin:0 auto 20px;}
	.pop-inner .act-btn{margin: 10px 0px;font-size: 12px;padding: 9px 10px;}
	span.zclose{right: 0px;top: 10px;background-color: #000;z-index: 3;}
	.zclose:before, .zclose:after{background-color: #fff;}
	.block3 .flex-wrap > div{width:100%;margin:0 0 30px 0;}
	.faq-item h4{font-size: 17px}
	.zicon:before{margin-bottom: 10px}
.cta-wrap-associate a:last-child{margin-left:5px}


}


/*ar starts*/
.i18n-ar .bnr-left{padding-right: 0px; padding-left: 80px}
.i18n-ar .block2 .box{text-align: center;}
.i18n-ar .block2 .box .thumb-img{text-align: center;}
.i18n-ar .block2 .box img, .i18n-ar .block2 .box a, .i18n-ar .block2 .box h3, .i18n-ar .block2 .box p{text-align: center;}
.i18n-ar .tab, .i18n-ar .tab a{text-align: center}
.i18n-ar .box-inner{text-align: center}
.i18n-ar .acc-cont .flex-wrap > div{padding: 0 0 0 100px}
.i18n-ar .block1 .zicon:after{right: 7px;}
.i18n-ar .faq h4{padding: 20px 40px 20px 0px}
.i18n-ar .faq-item h4:before{left: unset; right: 0px}
.i18n-ar .faq-item h4:after{left: unset; right: 7px}
.i18n-ar .faq-ans{padding-left: unset; padding-right: 42px}
.i18n-ar .block3, .i18n-ar .block3 h2, .i18n-ar .block3 .flex-item1, .i18n-ar .block3 .flex-item2, .i18n-ar .block3 h4{text-align: center}
.i18n-ar .block3 .zicon10:before{position: relative; right: -6px}
.i18n-ar .block3 .flex-item1:hover .zicon10:before{-webkit-transform: rotate(-45deg);transform: rotate(-45deg);}
.i18n-ar .block3 .zicon12:before{position: relative; right: -9px}
.i18n-ar .block3 .flex-item2:hover .zicon12:before{-webkit-transform: translateX(20px);transform: translateX(20px)}
.i18n-ar span.zicon.zicon11:after{left: -88px}

@media all and (min-width:992px) and (max-width:1199px){
        .i18n-ar .acc-cont .flex-wrap > div{padding: unset; margin: 0 60px 0 0}
        .i18n-ar .bnr-left{padding-left:50px}
}
@media all and (min-width:768px) and (max-width:991px){
        .i18n-ar .bnr-left{padding-left: 0px}
        .i18n-ar banner, .i18n-ar h1, .i18n-ar .bnr-left p{text-align: center}
        .i18n-ar .acc-cont .flex-wrap > div{padding: unset; margin: 0 50px 0 0 }

}
@media all and (max-width:767px){
        .i18n-ar .acc-cont .flex-wrap > div{padding: unset; margin: 0}
	.i18n-ar .bnr-left{padding-left: 0px}
        .i18n-ar banner, .i18n-ar h1, .i18n-ar .bnr-left p{text-align: center}
}
/*ar ends*/