@charset "utf-8";
/*----------intial declartaion of css----------*/
* { padding: 0; margin: 0; list-style: none; }
* { margin: 0; padding: 0; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, select, input, option { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; }
html { -webkit-text-size-adjust: none; }
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary { display: block; }
audio, canvas, video { display: inline-block; }
audio:not([controls]) { display: none; height: 0; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word }
q { quotes: none }
q:before, q:after { content: ''; content: none }
small { font-size: 80% }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline }
sup { top: -0.5em; }
sub { bottom: -0.25em }
nav ul, nav ol { list-style: none; list-style-image: none; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; }
textarea { overflow: auto; vertical-align: top }
table { border-collapse: collapse; border-spacing: 0 }
button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: none; cursor: pointer; }
/* remember to define focus styles! */
:focus { outline: 0; }
ol, ul { list-style: none; }
/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
table { border: 0 none; border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }
img { border: 0 none; max-width: 100%; }
/* End hide from IE Mac */ .none { display: none; } /* End Clearfix */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block }
.clear { clear: both; }
img { max-width: 100%; }
.cf:before, .cf:after { content: ""; display: table }
.cf:after { clear: both; }
.cf { *zoom:1;}
/*-- default table stle --*/


table { border-collapse: collapse;  width: 100%;}
th,td{border: 0; padding: 15px 15px;}
th{background: #ccc; color: #000; }
td{ background: #e3e2e2; color: #000;}

.table-scroll , .resp-table{margin: 30px 0;}

/*- --*/




a { color: #ee5698; outline: none; cursor: pointer; text-decoration: none; transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out;}
a:hover, a:focus{color: #222222;}
h1,h2,h3,h4,h5,h6{margin-top: 0; font-family: "Arial Black",sans-serif; color: #222222; line-height: 1; font-weight: 900; text-transform: none;}
h1 { font-size: 90px; margin-bottom: 20px; font-weight: 900; line-height: 1; }
h2 { font-size: 30px; margin-bottom: 20px; }
.heading-style h2{font-size: 62px; line-height: 1.043;}
h3 { font-size: 20px; margin-bottom: 20px; text-transform: uppercase; line-height: 1.8; }
.heading-style h3{color: #ef3d86;}
h4 { font-size: 24px; margin-bottom: 20px;line-height: 1.8;  font-weight: 300; font-family: "Arial",sans-serif;}
.heading-style h4{font-weight: 400;  font-size: 30px; letter-spacing: 3px; font-family: "Arial",sans-serif;}
.heading-style h4 sup{font-size: 12px;}
.heading-style h4 b{font-weight: 900; font-family: "Arial Black",sans-serif;}
h5 { font-size: 14px; margin-bottom: 20px; font-family: "Arial",sans-serif;}
body { margin: 0; padding: 0; font-family: "questa-sans",sans-serif; font-variant-numeric:lining-nums; font-size: 20px; line-height: 1.8;  color: #222222; }
p {margin: 0 0 15px;}

p a{text-decoration: underline;}
p a sup{text-decoration: none;}
p .btn{text-decoration: none;}
.main { max-width: 1290px; width: 100%; margin: 0 auto; padding: 0 15px;}
.btn{ padding: 12px 15px; min-width: 343px;   font-family: "questa-sans",sans-serif; font-variant-numeric:lining-nums; font-size: 22px; color: #fff; background: #ee5698;  border: 1px solid #fff; border-radius: 10px;display: inline-block; text-transform: uppercase;     letter-spacing: 0.5px; transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out;}
.btn:hover , .btn:focus{background: #fff; color: #ee5698; border-color: #fff;}
.secondary-btn{background: transparent; color: #fff; border-color: #fff;}
.secondary-btn:hover , .secondary-btn:focus{color: #222222; border-color: #fff; background: #fff;}


/*-- header sec --*/



.header-main{position: fixed; left: 0; right: 0; top: 0; z-index: 99;}
.header-sec{background: #fff; padding: 16px 0 0;}

.logo{width: 223px; float: left; display: block;}
.logo:hover ,.logo:focus{opacity: 0.6;}
.logo img{width: 100%; display: block;}

/*-- menu sec --*/


.menu-sec{float: right; padding: 15px 0 0; }

.menu-sec ul{padding: 0; margin: 0; list-style: none;}

.menu li{position: relative;}
.menu li a{font-family: "Arial Black",sans-serif; font-weight: 900; color: #3b3b3b; font-size: 14px;}

.menu > li{float: left; margin-left: 46px; padding-bottom:28px; line-height: 1;}
.menu > li > a{text-transform: uppercase; padding-bottom: 27px; }
.menu > li:hover > a , .menu > li:focus > a , .menu > li.scroll-active > a  , .menu > li.active > a{color: #ee5698;}
.menu > li.get-code-nav > a{color: #ee5698;}
.menu > li.get-code-nav:hover > a , .menu > li.get-code-nav:focus > a{color: #3b3b3b;}
.menu ul li a{background: #ee5698; color: #fff; display: block; padding: 10px 15px;}
.menu ul li:hover > a , .menu ul li:focus > a{background: #fff; color: #ee5698;}
.menu ul{min-width: 190px;}
.sb-menu{position: absolute; left: 0;right: 0; top: 100%; display: none;}
.sb-menu ul{left: 100%; right: auto; top: 0;}
.menu li:hover > .sb-menu , .menu:focus > .sb-menu{display: block;}


/*-- banner sec --*/

.banner-sec{ padding: 127px 0 50px; min-height: 560px; background-size: cover; background-position: center center; background-repeat: no-repeat; display: block; position: relative; text-align: center;}
.banner-sec:before{position: absolute; content: ""; left: 0; right: 0; top: 0; bottom: 0; height: 100%; width: 100%; background: rgba(34,34,34,0.65);}


.banner-content{position: relative; z-index: 1;}
.banner-content h1{color: #fff;     line-height: 0.6;}
.banner-content h1 span{font-size: 52px; font-weight: 400; font-family: "Arial",sans-serif;}
.banner-content h1 span b{font-weight: 900; font-family: "Arial Black",sans-serif;}
.banner-content h1 sup{font-size: 28px; }
.banner-btn {    padding: 103px 0 0;}
.banner-btn ul{padding: 0; list-style: none; margin: 0 -15px;}
.banner-btn ul li{display: inline-block; vertical-align: middle; margin-left: -4px; padding: 0 15px;}
.banner-btn .btn{}
.banner-btn .btn.secondary-btn{}


/*-- what-viizzii-sec --*/

.what-viizzii-sec{ min-height: 555px; background-attachment: fixed; background-position: center center; background-repeat: no-repeat; background-size: cover; position: relative; color: #fff;}

.what-viizzii-row{margin: 0 -15px;}
.what-viizzii-content{float: right; width: 49%; padding: 44px 15px; text-align: center;}
.what-viizzii-content h4{text-align: center;  padding-bottom: 5px; margin-bottom: 74px; font-weight:400; color: #fff; letter-spacing: 3px; position: relative;}
.what-viizzii-content h4:before {    content: "";  position: absolute;  border-bottom: 1px solid #fff;    bottom: 0;    left: 0;    right: 0;    max-width: 398px;    margin: 0 auto;}
.what-viizzii-content h4 b{font-weight: 900;}
.what-viizzii-content h4 sup{font-size: 12px;}
.what-viizzii-content h2{font-weight: 400; color: #fff;     margin-bottom: 17px; font-family: "Arial",sans-serif;}
.what-viizzii-content h2 b{font-weight: 900;}
.what-viizzii-content h2 sup{font-size: 14px;     top: -1.7em;}
.what-viizzii-content p{}
.parallax {    background-attachment: fixed;    background-size: cover;    background-position: 50% 0;    background-repeat: no-repeat;}
.what-viizzii-sec .main{position: relative; min-height: inherit;}
.what-viizzii-object{      position: absolute;    left: -136px;    top: 0;    bottom: 0;    width: 71%;    background-size: cover;    background-position: center 21%;    background-repeat: no-repeat;    display: block;}

/*-- features-sec --*/

.features-sec{ padding: 54px 0 22px;
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(215,215,215,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%,rgba(215,215,215,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%,rgba(215,215,215,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#d7d7d7',GradientType=0 ); /* IE6-9 */}

.features-container{max-width: 1115px; margin: 0 auto; display: block; width: 100%;}

.features-row{margin: 0 -15px;}
.features-content{padding: 3px 15px 0 48px; width: 50%; float: left;}
.features-content h4{position: relative; letter-spacing: 4px; padding-bottom: 5px; border-bottom: 1px solid #222222; font-weight: 400; margin: 0 0 67px;}
.features-content h4 b{font-weight: 900; font-family: "Arial Black",sans-serif;}
.features-content h2{font-weight: 400; margin: 0 0 29px; font-family: "Arial",sans-serif;}
.features-content h2 b{font-weight: 900; font-family: "Arial Black",sans-serif;}
.features-content h3{color: #000000; margin: 0;}
.features-content p{}

.custom-list ul{padding: 10px 0 0;margin: 0; list-style: none;}
.custom-list ul li{color: #d02a72;font-size: 18px; line-height: 1; position: relative; padding-left: 20px; display: block;     letter-spacing: 1.3px;    margin: 0 0 10px; text-transform: uppercase;}
.custom-list ul li:before{ position: absolute; content: "»"; left: 0; top: 0;}


.features-img{    width: 47%;    float: right;    padding: 0 15px;}
.mobile-features-content.features-content{display: none;}


/*-- app-sec --*/

.app-sec{    padding: 57px 0 90px;}

.app-heading{text-align: center;     max-width: 1045px;    margin: 0 auto;}
.app-heading h4{border-bottom: 1px solid #222222; padding-bottom: 5px; margin-bottom: 64px;}
.app-heading h4 sup{}
.app-heading h4 b{}

.app-overview-row{margin: 0 -15px;}
.app-overview-content{width: 41.5%; float: right; padding: 0 115px 0 15px;}
.change-it-up{text-align: center;}
.change-it-up h2{font-weight: 400; margin: 0 0 17px;  font-family: "Arial",sans-serif;}
.change-it-up h2 b{font-weight: 900; font-family: "Arial Black",sans-serif;}
.change-it-up p{}
.change-it-up p a{color: #222222; text-decoration: none; border-bottom: 1px solid #222;}
.change-it-up p a:hover , .change-it-up p a:focus{color: #ee5698; border-color: #ee5698;}
.app-store{padding: 18px 0 0;}
.app-store ul{padding: 0; margin: 0 -5px;list-style: none;}
.app-store ul li{width: 50%; float: left; padding: 0 5px; margin-bottom: 10px;}
.app-store ul li:nth-child(2n+1){clear: both;}
.app-store img{width: auto; display: block; }
.app-store a{display: block;}
.app-store a:hover , .app-store a:focus{opacity: 0.5;}

/*-- app sec --*/


.icon-list-col{width: 51%; float: left; text-align: center; padding: 8px 15px;}
.icon-list-col h3{font-weight: 400; letter-spacing: 3px; font-family: "Arial",sans-serif;}

.icon-list ul{padding: 35px 0 0; margin: 0; list-style: none;     display: flex;    flex-direction: row;    flex-wrap: wrap;}
.icon-list ul li{width: 33.333%; float: left; padding: 0 15px; text-align: center; border-right: 1px solid #cccccc; flex-grow: 1;}
.icon-list ul li:last-child{border:0;}
.icon-col{ padding: 7px 5px;}
.icon-link{margin-bottom: 10px; display: block;}
.icon-link:hover , .icon-link:focus{opacity: 0.5;}
.icon-link img{display: block; margin: 0 auto;}
.icon-col h5{line-height: 1.5; margin: 0 0 5px;}


/*-- get-started-sec --*/

.get-started-sec{background: #141414; color: #fff; padding: 49px 0 0;  }

.get-started-row{margin: 0 -15px;}
.get-started-col{width: 50%; display: inline-block; vertical-align: top; margin-left: -4px; padding: 44px 15px 0 129px;}
.get-started-col h2{color: #fff; font-weight: 400; margin: 0 0 40px; font-family: "Arial",sans-serif;}
.get-started-col h2 b{font-weight: 900; font-family: "Arial Black",sans-serif;}
.get-started-col h3{color: #ee2a7b; margin: 0 0 2px;}
.get-started-col p{margin: 0 0 18px;}
.get-started-col p a{text-decoration: none;     border-bottom: 1px solid #ee5698;}
.get-started-col p a:hover , .get-started-col p a:focus{color: #fff; border-color: #fff;}
.get-started-img{padding: 0 15px; width: 50%; display: inline-block; vertical-align: bottom; margin-left: -4px;}
.get-started-img img{display: block;}


/*-- gallery-sec --*/

.gallery-sec{padding: 4px 0 0;}
.gallery-list{}
.gallery-list-col{float: left; width: 25%; padding: 0 1px; margin-bottom: 4px; display: block;}
.gallery-list-col:nth-child(4n+1){clear: both;}

.gallery-img{display: block; padding-bottom: 100%; background-size: cover; background-position: center center; background-repeat: no-repeat; display:block; position: relative;}
.gallery-img img{display: none !important;}
.gallery-img iframe{position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 100%; display: block; border: 0; margin: 0;padding: 0; }


.mfp-with-zoom .mfp-container,
.mfp-with-zoom.mfp-bg {
	opacity: 0;
	-webkit-backface-visibility: hidden;
	/* ideally, transition speed should match zoom duration */
	-webkit-transition: all 0.3s ease-out; 
	-moz-transition: all 0.3s ease-out; 
	-o-transition: all 0.3s ease-out; 
	transition: all 0.3s ease-out;
}

.mfp-with-zoom.mfp-ready .mfp-container {
		opacity: 1;
}
.mfp-with-zoom.mfp-ready.mfp-bg {
		opacity: 0.8;
}

.mfp-with-zoom.mfp-removing .mfp-container, 
.mfp-with-zoom.mfp-removing.mfp-bg {
	opacity: 0;
}

button.slick-arrow{ font-size: 0;  position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -moz-transform: translateY(-50%);width: 35px; height: 35px; line-height: 35px; background: #020202; color: #fff; border-radius: 50%; display: block; border: 0; text-align: center;  z-index: 2;}

button.slick-arrow:hover , button.slick-arrow:focus{background: #020202; color: #fff; opacity: 0.7; border: 0;}

button.slick-prev{left: 5px;}
button.slick-next{right: 5px;}
button.slick-arrow:before{ font-family: FontAwesome; font-size: 20px;}
button.slick-prev:before{content: "\f053";     right: 2px;    position: relative;    top: 1px;}
button.slick-next:before{content: "\f054";     left: 2px;    position: relative;    top: 1px;}

/*-- faq sec --*/




.accordion-content p{}
.accordion > li {    padding: 0 0 13px;}

.accordion{padding: 0; margin: 0; list-style: none;}


.faq-sec{padding: 70px 0 53px;}
.faq-container{max-width: 1045px; margin: 0 auto; width: 100%;  }
.faq-sec h2{ letter-spacing: 3px; font-weight: 400; text-transform: none; border-bottom: 1px solid #222222; padding-bottom: 14px; text-align: center; font-family: "Arial",sans-serif;}
.faq-sec h2 b{font-weight: 900; font-family: "Arial Black",sans-serif;}

.faq-row{margin: 0 -15px; padding: 40px 0 0; }
.faq-col{float: left; width: 50%; padding: 0 15px;}
.faq-col:nth-child(2n+1){clear: both;}
.accordion-title{display: block; font-weight: 900;     font-family: "Arial Black",sans-serif; color: #ef4088; font-size: 20px; text-transform: uppercase; cursor: auto;}
.accordion-title:hover , .accordion-title:focus{color: #ef4088;}


/*-- something-new-sec --*/

.something-new-sec{padding: 103px 0 110px; text-align: center; color: #fff;}

.something-new-content{}
.something-new-content h2{font-weight: 400; color: #fff; display: inline-block; vertical-align: middle; margin: 0; padding: 0 15px 0 0; font-family: "Arial",sans-serif;}
.something-new-content h2 b{font-weight: 900; font-family: "Arial Black",sans-serif;}

.btn.get-code-btn{ display: inline-block; vertical-align: middle; font-size: 22px;  line-height: 1; padding: 20px 15px;min-width: 343px; text-transform: uppercase;}

.btn.get-code-btn:hover ,.btn.get-code-btn:focus{}

/*-- foo-sec --*/

.foo-sec{ padding: 79px 0 0; background: #222222; color: #a5a5a5; text-align: center; position: relative;}

.foo-logo{width: 311px; margin: 0 auto; display: block; margin-bottom: 65px;}
.foo-logo img{display: block; width: 100%;}

.social-icn{}
.social-icn ul{padding: 0; margin: 0; list-style: none;}
.social-icn ul li{display: inline-block; vertical-align: middle; padding: 0 10px; margin-left: -4px;}
.social-icn a{width: 90px; height: 90px; line-height: 90px;  display: block; background: #4d4d4d; color: #fff; border-radius: 50%; font-size: 42px;}
.social-icn a:hover , .social-icn a:focus{color: #222; background: #fba126;}


.foo-disc{color: #a5a5a5; font-family: "Arial",sans-serif; padding: 56px 0 11px; font-weight: 400;}
.foo-disc p{font-size: 18px; color: #a5a5a5; }
.foo-disc p b{font-weight: 900;}
.foo-disc p sup{font-size: 12px;}

.back-top{background:url(../images/back-top.png);background-size: 100%;background-position: center center; background-repeat: no-repeat; width: 120px;height: 120px; display: block; position: fixed; right: 30px; bottom: 20px; border-radius: 50%;}


/*-- get code page --*/



.get-code-banner{ padding: 109px 0 25px; min-height: 560px; background-size: cover; background-position: center center; background-repeat: no-repeat; display: block; position: relative; text-align: center;}
.get-code-banner:before{position: absolute; content: ""; left: 0; right: 0; top: 0; bottom: 0; height: 100%; width: 100%; background: rgba(34,34,34,0.65);}
.get-code-content{position: relative; z-index: 1;}
.get-code-content h1{color: #fff; font-weight: 900; margin: 0 0 26px;}
.get-code-content > h2{color: #fff;font-weight: 400; display: inline-block; border-bottom: 1px solid #fff; padding-bottom: 14px; letter-spacing: 3px;  margin: 0 0 34px; font-family: "Arial",sans-serif;}
.get-code-content > h2 b{font-weight: 900; font-family: "Arial Black",sans-serif;}
.get-code-content > h2 sup{font-size: 12px;}


.get-code-form{max-width: 714px; margin: 0 auto; width: 100%; display: block;}
.getcode-form-col{height: 64px; position: relative;}
input.getcode-form-field{display: block; width: 100%; height: 100%; display: block; border: 0; border-radius: 10px;  color: #747474; font-size: 20px; font-family: "questa-sans",sans-serif;  font-style: italic; margin: 0; padding: 0 180px 0 15px; display: block;}


input:-moz-placeholder{color: #747474; opacity: 1; }
input::-moz-placeholder{color: #747474;  opacity: 1;}
input::-webkit-input-placeholder {color: #747474;  opacity: 1;}
input:-ms-input-placeholder {color: #747474;  opacity: 1;}

button.btn.submit-btn{position: absolute; right: 0; top: 0; bottom: 0; height: 100%; min-width: inherit; border-radius: 0 10px 10px 0; padding: 0 33px; min-width: 174px;}

button.btn.submit-btn:hover , button.btn.submit-btn:focus{background: #222222; color: #fff;}


.code-row{text-align: center; padding: 38px 0 0; }
.qr-code-content{}
.qr-code-img{display: inline-block; vertical-align: top; width: 25%;     text-align: right;    padding: 15px 8px 0 0;}

.qr-code-content.heading-style{display: inline-block; vertical-align: top; color: #fff; padding-left: 20px; width: 43%;text-align: left;}

.qr-code-content.heading-style h2{color: #fff; font-weight: 400; margin: 0; font-family: "Arial",sans-serif;}
.qr-code-content.heading-style p{}
.qr-code-content.heading-style p a{}
.qr-code-content.heading-style p a:hover , .qr-code-content.heading-style p a:focus{color: #fff;}
.qr-code-content.heading-style p a sup{}



/*-- sticky header --*/

.sticky .header-sec{box-shadow: 0 0px 11px 1px rgba(0,0,0,0.5);}




.mfp-fade.mfp-bg {
	opacity: 0;
	-webkit-transition: all 0.15s ease-out; 
	-moz-transition: all 0.15s ease-out; 
	transition: all 0.15s ease-out;
}
.mfp-fade.mfp-bg.mfp-ready {
	opacity: 0.8;
}
.mfp-fade.mfp-bg.mfp-removing {
	opacity: 0;
}

.mfp-fade.mfp-wrap .mfp-content {
	opacity: 0;
	-webkit-transition: all 0.15s ease-out; 
	-moz-transition: all 0.15s ease-out; 
	transition: all 0.15s ease-out;
}
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
	opacity: 1;
}
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
	opacity: 0;
}



.back-top{opacity: 0; visibility: hidden;}
.back-top.scrollup{opacity: 1; visibility: visible; z-index: 9;}