﻿.eventBannerView { display:inline-block; width:100%; position:relative; color:#fff; background:#284861 url(../../Images/AMaterial/virtual-event.jpg) no-repeat center / auto 100%; padding:70px 15px 350px 15px; text-align:center; position:relative;}
.eventBannerView:after  { content:""; background:rgba(0,0,0,.5) url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABhJREFUeNpiYGBgePz//38GRhABAgABBgBFTAbfCBNE2AAAAABJRU5ErkJggg==); width:100%; height:100%; position:absolute; top:0; left:0; z-index:0;}
.eventBannerView > div.container { position:relative; z-index:1;}
.animation { width:600px; height:300px; display:inline-block; background:url(../../Images/AMaterial/virtual-event-frame.png) no-repeat center / 100%; position:absolute; left:calc(50% - 300px); bottom:0; z-index:2;}
.animation img { width:335px; height:221px; position:absolute; left:140px; top:31px;}

.pageTitle { margin:0; font-weight:300; font-size:48px; line-height:normal; color:#fff;}
.pageSubTitle { margin-top:0; margin-bottom:30px; font-weight:300; font-size:36px; line-height:normal; color:#fec42c;}
.virtualEventPageHeading { font-weight:300; font-size:42px; line-height:normal; color:#333;}
.pageDescription { margin-top:0; font-weight:300; font-size:20px; line-height:normal; color:#fff; text-align:center;}
.contactBtn { display:inline-block; padding:10px 20px; margin-top:15px; background:#ff0078; color:#fff; font-size:16px; text-transform:uppercase; border-radius:4px; border:2px solid #fff; outline:none;}
.createVirtualEvent { background:#ff8e17;}
.contactBtn:hover { box-shadow:0 0 0 50px rgba(0,0,0,.13) inset; color:#fff;}
.imgBG { background:url(../../Images/AMaterial/img-bg.png) no-repeat center / auto 100%; padding-top:20px; padding-bottom:20px;}

.coronaBox { width:100%; border-radius:5px; padding:20px 30px; padding-right:250px; margin-top:50px; margin-bottom:50px; background-image:linear-gradient(110deg,#ff008a,#ffc42c); position:relative;}
.coronaBox .coronaTitle { margin:0; font-weight:500; font-size:30px; line-height:normal; color:#fff; position:relative; z-index:1;}
.coronaBox .coronaDesc { margin:5px 0; font-weight:300; font-size:20px; line-height:normal; color:#fff; text-align:left; position:relative; z-index:1;}
.coronaBox .contactBtn { position:absolute; right:30px; top:50%; z-index:1; margin-top:-23px;}

.shape-bg { display:inline-block; width:100%; height:100%; position:absolute; top:0; left:0; z-index:0; overflow:hidden;}
.shape-bg span { display:inline-block; width:120px; height:120px; background:rgba(255,255,255,.1); position:absolute; border-radius:50%; z-index:1;}
.shape-bg .span-200 { width:200px; height:200px;}
.shape-bg .span-150 { width:150px; height:150px;}
.shape-bg .span-100 { width:100px; height:100px;}
.shape-bg .span-75 { width:75px; height:75px;}
.shape-bg .span-50 { width:50px; height:50px;}
.shape-bg :nth-child(1) { bottom:auto; left:-4%; background:rgba(255,255,255,.1);}
.shape-bg :nth-child(2) { top:10%; right:4%; background:rgba(255,255,255,.1)}
.shape-bg :nth-child(3) { top:82px; right:26.66666%; background:rgba(255,255,255,.3);}
.shape-bg :nth-child(4) { top:70px; right:10%; background:rgba(255,255,255,.15);}
.shape-bg :nth-child(5) { top:38%; right:auto; left:1%; background:rgba(255,255,255,.05);}
.shape-bg :nth-child(6) { top:44%; right:auto; left:10%; width:200px; height:200px; background:rgba(255,255,255,.15);}
.shape-bg :nth-child(7) { right:36%; bottom:50%; background:rgba(255,255,255,.04);}
.shape-bg :nth-child(8) { right:2%; bottom:70px; background:rgba(255,255,255,.2);}
.shape-bg :nth-child(9) { right:45%; bottom:15%; background:rgba(255,255,255,.1);}
.shape-bg :nth-child(10) { right:auto; bottom:1%; left:1%; background:rgba(255,255,255,.05);}

.servicesView { padding-bottom:60px;}
.serviceBox { height:75px; margin-top:15px; position:relative; color:#666;}
.serviceBox img { width:48px; height:48px; position:absolute; top:0;}
.serviceBox h5 { margin-top:0; margin-bottom:6px; font-weight:300; font-size:20px; color:#000;}
.serviceBox p { margin:0; font-size:14px;}
.serviceBox:nth-child(even) { padding-right:84px;}
.serviceBox:nth-child(even) img { right:15px;}
.serviceBox:nth-child(even),
.serviceBox:nth-child(even) p { text-align:right;}
.serviceBox:nth-child(odd) { padding-left:84px;}
.serviceBox:nth-child(odd) img { left:15px;}
.serviceBox:nth-child(odd),
.serviceBox:nth-child(odd) p { text-align:left;}

.successSetupView { background-color:rgba(0,0,0,.05); padding-top:30px; padding-bottom:60px;}
.keyBox { text-align:center; margin-top:15px;}
.keyBox img { width:72px;}
.keyBox h5 { margin:15px 0; font-size:18px; font-weight:500; color:#333;}
.keyBox p { font-size:16px; line-height:24px; font-weight:300; color:#68869c; text-align:center;}

.whatVirtualEventView { padding-top:30px; padding-bottom:60px;}
.whatVirtualEventDescription { font-size:16px; line-height:24px; font-weight:300; color:#68869c; text-align:center;}
.whatVirtualEventDescription strong { font-weight:500;}

.faqsView { background-color:rgba(0,0,0,.05); padding-top:30px; padding-bottom:60px;}
.faqIcon { background:url(../../Images/AMaterial/faq-icon.png) no-repeat center top; padding-top:130px; position:relative;}
.faqIcon:after { top:100%; content:" "; width:80px; height:4px; background:#e5c37f; position:absolute; z-index:1; left:50%; margin-left:-40px; margin-top:10px;}
.faq h6 { font-weight:400; font-size:20px; color:#000; text-align:left; margin-bottom:0;}
.faq p { font-size:16px; line-height:24px; font-weight:300; color:#68869c; text-align:left;}

.WhyEventcomboView { padding-top:30px;}
.WhyEventcomboView li { font-size:16px; font-weight:300; list-style:none; margin-bottom:15px; text-align:center;}


@media screen and (min-width:960px) and (max-width:1024px)
{
}
@media screen and (min-width:768px) and (max-width:960px)
{
}
@media screen and (min-width:0) and (max-width:767px)
{
  .eventBannerView { padding-bottom:200px; text-align:center;}
  .eventBannerView p { text-align:center;}
  .animation { width:300px; height:150px; left:calc(50% - 150px);}
  .animation img { width:170px; height:110px; left:70px; top:15px;}
  .pageTitle { font-size:40px;}
  .pageSubTitle { font-size:24px;}
  .virtualEventPageHeading { font-size:36px;}
  .resultBoxOuter { flex-flow:wrap;}
  .serviceBox { height:auto; margin-bottom:15px;}
  .coronaBox { padding-right:30px;}
  .coronaBox .contactBtn { position:relative; right:auto; top:auto; margin-top:23px;}
}