/*============================================================ rest css ================================================================*/ @font-face { font-family: 'Aller'; src: url('../../install/css/fonts/aller/Aller-BoldItalic.eot'); src: url('../../install/css/fonts/aller/Aller-BoldItalic.eot?#iefix') format('embedded-opentype'), url('../../install/css/fonts/aller/Aller-BoldItalic.woff2') format('woff2'), url('../../install/css/fonts/aller/Aller-BoldItalic.woff') format('woff'), url('../../install/css/fonts/aller/Aller-BoldItalic.ttf') format('truetype'), url('../../install/css/fonts/aller/Aller-BoldItalic.svg#Aller-BoldItalic') format('svg'); font-weight: bold; font-style: italic; font-display: swap; } @font-face { font-family: 'Aller'; src: url('../../install/css/fonts/aller/Aller-Bold.eot'); src: url('../../install/css/fonts/aller/Aller-Bold.eot?#iefix') format('embedded-opentype'), url('../../install/css/fonts/aller/Aller-Bold.woff2') format('woff2'), url('../../install/css/fonts/aller/Aller-Bold.woff') format('woff'), url('../../install/css/fonts/aller/Aller-Bold.ttf') format('truetype'), url('../../install/css/fonts/aller/Aller-Bold.svg#Aller-Bold') format('svg'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Aller'; src: url('../../install/css/fonts/aller/Aller.eot'); src: url('../../install/css/fonts/aller/Aller.eot?#iefix') format('embedded-opentype'), url('../../install/css/fonts/aller/Aller.woff2') format('woff2'), url('../../install/css/fonts/aller/Aller.woff') format('woff'), url('../../install/css/fonts/aller/Aller.ttf') format('truetype'), url('../../install/css/fonts/aller/Aller.svg#Aller') format('svg'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Aller'; src: url('../../install/css/fonts/aller/Aller-Light.eot'); src: url('../../install/css/fonts/aller/Aller-Light.eot?#iefix') format('embedded-opentype'), url('../../install/css/fonts/aller/Aller-Light.woff2') format('woff2'), url('../../install/css/fonts/aller/Aller-Light.woff') format('woff'), url('../../install/css/fonts/aller/Aller-Light.ttf') format('truetype'), url('../../install/css/fonts/aller/Aller-Light.svg#Aller-Light') format('svg'); font-weight: 300; font-style: normal; font-display: swap; } .OpenSans { font-family: 'Open Sans'; } .Aller { font-family: 'Aller'; } .Nexa { font-family: 'Nexa'; } body { position: relative; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } a { margin: 0; padding: 0; font-size: 100%; background: transparent; } a:hover { text-decoration: inherit; } /* change colours to suit your needs */ ins { background-color: #ff9; color: #000; text-decoration: none; } /* change colours to suit your needs */ mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; } del { text-decoration: line-through; } abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; } table { border-collapse: collapse; border-spacing: 0; } /* change border colour to suit your needs */ hr { display: block; height: 1px; border: 0; border-top: 1px solid #cccccc; margin: 1em 0; padding: 0; } input, select { vertical-align: middle; } .mr-1 { margin-right: 1px; } .mr-2 { margin-right: 2px; } .mr-3 { margin-right: 3px; } .mr-4 { margin-right: 4px; } .mr-5 { margin-right: 5px; } img { margin: auto; display: block; } /*============================================================ rest css end ================================================================*/ /*============================================================ header ================================================================*/ .scrollToTop { z-index: 9; width: 50px; height: 50px; padding: 10px; text-align: center; border: 1px solid #53c4c8; background: #53c4c8; border-radius: 50%; font-weight: bold; text-decoration: none; position: fixed; bottom: 100px; right: 60px; color: #fff; transition: all .5s ease-in-out; line-height: 28px; display: none; } .scrollToTop:hover { text-decoration: none; color: #53c4c8; background: #fff; border: 1px solid #53c4c8; } .wrapper { height: 100% !important; height: 100%; margin: 0 auto; overflow: hidden; } .main { float: left; width: 100%; margin: 0 auto; } .main section { overflow: hidden; } .clear { clear: both; } .loginbx > a { color: #53c4c8; padding: 14px 16px; } .loginbx > a :hover { color: #7F58A4; } .bgindex-1 { background: url("../img/web/index-bg.png")no-repeat; width: 100%; height: 2421.9px; background-size: contain; } .box-dv { align-items: center; padding-right: 150px; } .leftimg-dv { width: 876px; height: 725px; height: 600px; } .left-imgpo1 { margin-top: 33px; padding-left: 20px; background: url("../img/web/Fast-track.svg")no-repeat; background-size: contain; } .left-imgpo2 { background: url("../img/web/men.svg")no-repeat; background-size: contain; } .left-imgpo3 { margin-top: 30px; padding-left: 20px; /*background: url("../img/web/dataimg.svg")no-repeat; background-size: contain;*/ } .left-imgpo4 { margin-top: 30px; padding-left: 20px; background: url("../img/web/data-cleansing.svg")no-repeat; background-size: contain; } .left-imgpo5 { margin-top: 30px; padding-left: 20px; background: url("../img/web/businesses.svg")no-repeat; background-size: contain; } .blck { display: block; font-size: 15pt; } .bg2-bx { margin-top: 403px; } .altb { width: 100%; height: 3134.8px; } .right-cnt-dv { width: 525px; } .text-page5 { margin-top: 300px; } .box1 .right-cnt-dv > h1, .box3 .right-cnt-dv > h1 { margin-top: 150px; text-align: right; font-size: 18pt; line-height: 33px; } .wit { color: #fff; } .box2 .right-cnt-dv > h1 { /*text-align: center;*/ font-size: 18pt; font-weight: bold; line-height: 25pt; text-align: left; } .pathbox { margin-top: 20px; } /*.right-cnt-dv .bgarow:before{ content:''; background:url("../img/web/hding-arow.png")no-repeat; width: 173px; height: 255px; display: block; position: absolute; top: 0; right:0;}*/ .box2 .right-cnt-dv > h1 > span { display: block; } .box1 .social-md { margin-top: 80px; } .box2 .social-md { margin-top: 200px; position: relative; left: 0; } /*.box2 .right-cnt-dv { padding-top: 100px; }*/ .box3 .social-md { margin-top: 80px; } .box3 .right-cnt-dv > h1 { font-family: 'Aller'; font-size: 17pt; color: #7f58a4; line-height: 25px; /*margin-top: 220px;*/ margin-top: 300px; } .box3 .small-para > p { color: #7f58a4; font-weight: 500; } .box3 .small-para > p > span { display: block; } .box3 .social-md > ul > li > a { color: #58595b; } .box3 .social-md > ul > li > a:hover { color: #7f58a4; } .right-cnt-dv > h1 { color: #fff200; font-family: 'Nexa'; font-weight: bold; letter-spacing: 1px; } .right-cnt-dv > h1 > span > span { color: #fff; } .small-para { text-align: right; float: right; margin-top: 40px; font-family: 'Aller'; } .small-para > p { color: #fff; font-size: 10pt; font-weight: 300; line-height: 20px; margin-bottom: 20px; letter-spacing: 0.75pt; } .small-para > h6 { color: #fff200; font-weight: bold; } .social-md > ul { float: right; } .social-md > ul > li > a { color: #fff; padding: 10px 10px; display: block; transition: all .5s ease-in-out; } .social-md > ul > li > a:hover { color: #ff9; } /*===index===*/ /*.all-bx { width: 100%; height: 1080px; }*/ /*.bg1-bx { background: url("../img/web/bg1.svg")no-repeat; background-size: contain; } .bg2-bx { background: url("../img/web/bg2.svg")no-repeat; background-size: contain; } .bg3-bx { background: url("../img/web/bg3.svg")no-repeat; background-size: contain; } .bg5-bx { background: url("../img/web/bg5.svg")no-repeat; background-size: contain; } .bg6-bx { background: url("../img/web/bg6.svg")no-repeat; background-size: contain; } .bg7-bx { background: url("../img/web/bg7.svg")no-repeat; background-size: contain; }*/ .bg-main1 { background: url("../img/web/bgall-main-1600.png")no-repeat; } .bg-main2 { background: url("../img/web/bg-main2-1600.png")no-repeat; } /*.page5 { margin-top: 200px; }*/ .page6 { margin-top: 200px; } .page7 { /*margin-top: 200px;*/ padding-bottom: 50px; } .pty-box { text-align: center; font-family: 'Nexa'; margin: 70px 0px; } .pty-box > h5 { color: #fbcb29; font-size: 30pt; margin-bottom: 10px; } .pty-box > span { color: #7f58a4; font-size: 12pt; font-weight: 600; } .box-learn { position: relative; } /*.box-learn:before{position:absolute; left:0; top:0; content:''; background:url("../img/web/left-bg.png")no-repeat; height:400px; width:460px;}*/ .learn-cnt ul li { width: 33%; font-family: 'Open Sans'; margin: 20px; } .learn-cnt ul li a, .learn-cnt ul li a img { transition: all .5s ease-in-out; } .learn-cnt ul li a:hover img { transform: scale(1.1); } .learn-cnt ul li a img { margin-bottom: 30px; } .learn-cnt ul li a h5 { color: #7f58a4; font-size: 11pt; font-weight: bold; text-align: center; margin-top: 30px; text-transform: uppercase; margin-bottom: 20px; } .learn-cnt ul li a p { color: #53c4c8; font-size: 13pt; text-align: center; line-height: 23px; margin-top: 7px; } .leftimg-lrn { width: 35%; } .learn-cnt { width: 65%; } .bg-bx4 .social-md > ul > li > a { color: #58595b; } .bg-bx4 .social-md > ul > li > a:hover { color: #7f58a4; } .bg-bx4 .social-md > ul { padding-right: 100px; } .text-page5 { text-align: right; font-family: 'Aller'; } .text-page5 > h2, .text-page5 > span { letter-spacing: 1px; margin-bottom: 10px; } .text-page5 > h2 { font-size: 15pt; color: #fff; font-weight: bold; } .text-page5 > span { color: #fbcb29; font-size: 20pt; font-weight: bold; display: block; } .text-page5 > p, .Flexibility_txt > p, .Flexibility_txt > span { font-size: 13pt; color: #fff; font-weight: 100; line-height: 25px; letter-spacing: 1px; margin-top: 30px; margin-bottom: 30px; } .Flexibility_txt > p { text-align: center; } .Flexibility_txt > span { font-size: 9px; text-align: center; display: block; } .Flexibility_txt > p > b { font-weight: 600; } .text-page5 > p > span { color: #fbcb29; } .bg5-bx .box1 .social-md { margin-top: 30px; } .text-page6 { font-family: 'Nexa'; } .text-page6 > p { font-size: 10pt; color: #7f58a4; text-align: center; display: block; line-height: 30px; } .clr1-page6 { color: #53c4c8; } .clr2-page6 { color: #fbcb29; } .text-page7 { font-family: 'Nexa'; text-align: center; padding: 40px 0px; font-weight: bold; } .text-page7 > h2, .text-page7 > span { display: block; margin-bottom: 10px; font-weight: bold; } .text-page7 > h2 { color: #fbcb29; font-size: 26pt; } .text-page7 > span { color: #fff; font-size: 12pt; } .contact-bx { width: 50%; margin: auto; } .bx-cntus1 { width: 50%; text-align: center; } .bdr-r { border-right: 1px solid #fff; } .bx-cntus1 > h2 { font-family: 'Nexa'; font-size: 11pt; color: #fff; font-weight: bold; letter-spacing: 1px; } .bx-cntus1 > p { font-family: 'Aller'; font-size: 12pt; color: #fff; font-weight: 300; padding: 20px 53px; line-height: 24px; letter-spacing: 1px; } .bx-cntus1 > a { font-family: 'Aller'; color: #fff; font-size: 8pt; background: #7f58a4; padding: 12px 22px; border-radius: 50px; display: inline-block; transition: all .5s ease-in-out; letter-spacing: 1px; } .bx-cntus1 > a:hover { background: #6b448f; color: #fff; } .c7img { width: 300px; margin: auto; margin-bottom: 20px; } .c7img img { max-height: 100%; max-width: 100%; } .ndbx { font-family: 'Nexa'; text-align: center; margin-top: 30px; display: block; font-size: 15px; font-weight: bold; letter-spacing: 1px; color: #fbcb29; } .ndbx > a { color: #fff; font-size: 11pt; border: 2px solid #7f58a4; padding: 8px 22px; border-radius: 50px; display: inline-block; transition: all .5s ease-in-out; letter-spacing: 1px; } .ndbx > a:hover { background: #6b448f; color: #fff; } /*============================================================ How Tracked Works ================================================================*/ .how-tracked-work-box > .d-flex { padding: 10px; } .box-left-work { background: #f2f2f2; padding: 20px; width: 400px; border-radius: 10px; box-shadow: 0px 2px 8px 0px #dbdde0; } .box-left-work > h1 { font-size: 16px; margin-bottom: 10px; color: #000; font-weight: bold; line-height: 25px; } .box-left-work > h1 > span { display: inline-block; } .box-left-work > h1 > span:first-child { color: #7f58a4; } .box-left-work > h1 > span:nth-child(2) { color: #5cbfc6; } .box-left-work > h1 > span:nth-child(3) { color: #ffc000; } .box-left-work > p { color: #404040; font-size: 12px; font-weight: bold; line-height: 20px; margin-bottom: 10px; text-align: inherit; /*text-align: justify;*/ } .box-left-work > p > span { display: inline-block; text-decoration: underline; } .arrow-line-all { width: 100%; height: 500px; } .bgarrow1 { background: url("../img/web/arrow1.svg")no-repeat; background-size: contain; margin-top: -23px; } .bgarrow2 { background: url("../img/web/arrow2.svg")no-repeat; background-size: contain; margin-top: -23px; } .bgarrow3 { background: url("../img/web/arrow3.svg")no-repeat; background-size: contain; margin-top: -23px; } .bgarrow4 { background: url("../img/web/arrow4.svg")no-repeat; background-size: contain; margin-top: -23px; } .arrow-line > h6 { padding-top: 160px; text-align: center; font-size: 32px; font-weight: bold; color: #404040; } .fst-box { width: 60%; margin: 5% auto auto auto; } .img-fst img { width: 358.62px; } .content-fst > h6 { font-weight: bold; margin-bottom: 20px; display: block; } .content-fst p { font-size: 13px; line-height: 23px; color: #000000; } /*============================================================ Our MIssion ================================================================*/ .top-img { width: 100%; height: 171.75px; } .bg-mission { background: url("../img/web/about-top.jpg")no-repeat; background-size: cover; } .about-bg { background: url("../img/web/sydney-harbour-bridge.jpg")no-repeat; background-size: cover; } .bg-why { background: url("../img/web/why-top.jpg")no-repeat; background-size: cover; height: 774.88px; background-position: center; } .toppara { width: 300px; padding: 10px; } .toppara > h1 { text-transform: uppercase; display: inline-block; background: #f4c35a; color: #2c0f0f; font-size: 11px; padding: 4px 7px; font-weight: bold; } .toppara > p { background: #fff; padding: 10px; font-size: 13px; font-weight: bold; line-height: 20px; } .toppara > p > span { text-decoration: underline; } .mission-para { margin-top: 20px; } .mission-para > h5 { text-align: center; font-size: 30px; font-weight: bold; margin-bottom: 10px; color: #7f58a4; display: block; } .mission-para > p { margin-bottom: 15px; display: block; font-size: 14px; line-height: 25px; padding: 0px 100px; } .mission-para > p > span { font-weight: bold; } .flagbx { margin-top: 20px; } .flagbx > ul { margin: auto; width: 100%; justify-content: center; } .flagbx > ul > li { position: relative; } .flagbx > ul > li > ul > li { position: relative; clear: both; } .img-left img, .img-right img { padding: 5px 0px; } .img-left, .allflg, .img-right { height: 90px; } .img-left img { float: right; margin-right: 10px; } .img-right img { float: left; margin-left: 10px; } .lineall { width: 5px; background: #7f58a4; margin: 0px 5px; } .allflg { position: relative; padding: 10px; width: 400px; } .autoscl { overflow-y: auto; max-height: 70px; } .autoscl::-webkit-scrollbar { -webkit-appearance: none; } .autoscl::-webkit-scrollbar:vertical { width: 11px; } .autoscl::-webkit-scrollbar:horizontal { height: 11px; } .autoscl::-webkit-scrollbar-thumb { border-radius: 8px; border: 2px solid white; /* should match background, can't be transparent */ background-color: rgba(0, 0, 0, .5); } .autoscl > p { color: #fff; font-size: 13px; line-height: 19px; } .leftbf:before, .rightbf:before { position: absolute; content: ''; top: 0; width: 0; height: 0; border-top: 45px solid transparent; border-bottom: 45px solid transparent; } .purple-c { background: #aa9bc6; } .purple-c:before { border-left: 70px solid #aa9bc6; } .orange-c { background: #ffc000; } .orange-c:before { border-right: 70px solid #ffc000; } .green-c { background: #6ab5ba; } .green-c:before { border-left: 70px solid #6ab5ba; } .face-c { background: #e7c1ab; } .face-c:before { border-right: 70px solid #e7c1ab; } /*============================================================ career ================================================================*/ .bdr-left { border-left: 8px dashed #ddd; border-bottom: 8px dashed #ddd; } .bdr-right { border-right: 8px dashed #ddd; border-bottom: 8px dashed #ddd; } .careerbx > h5 { color: #404040; font-weight: bold; text-align: center; font-size: 40px; padding: 40px 0px; display: block; } .careerbx > p { padding: 30px 80px 50px 80px; display: block; font-size: 15px; color: #2d2d2d; line-height: 25px; } .career-colum > ul { padding: 20px 0px; } .career-colum > ul > li { background: #f4f5f5; margin: 10px; width: 25%; padding: 20px; border-radius: 3px; box-shadow: 0px 2px 8px 0px #d8d9dc; } .career-colum > ul > li:hover img { transform: scale(1.1); } .career-colum > ul > li, .crimg img { transition: all .5s ease-in-out; } .cr-text > h6 { text-align: center; font-weight: bold; color: #000; display: block; margin: 10px; } .cr-text > p, .cr-text > span { color: #767171; font-weight: bold; font-size: 13px; display: block; text-align: center; line-height: 20px; padding: 0px 10px; } .cr-text > span { margin-bottom: 10px; } .cr-text .green, .green1 { color: #53c4c8; } .cr-text .orange, .orange1 { color: #ffc34d; } .purple { color: #7f58a4; text-decoration: underline; } .careerbx-content p { display: block; font-size: 20px; font-weight: bold; text-align: center; line-height: 27px; width: 80%; margin: auto; color: #000; padding: 100px 40px; } .box-position { padding: 50px 0px; width: 60%; margin: auto; } .box-position h5 { text-align: center; border: 2px solid #55c4c7; padding: 12px 0px; font-weight: bold; font-size: 20px; color: #353535; margin-bottom: 40px; } .box-position > ul > li { display: flex; flex-wrap: wrap; width: 100%; justify-content: space-between; background: #fff; padding: 30px; box-shadow: 0px 7px 8px 0px #e4e4e4; border-radius: 5px; margin-bottom: 20px; } .box-position > ul > li:last-child { margin-bottom: 0; } .posi-text h6, .posi-text span { font-weight: bold; display: block; } .posi-text h6 { font-size: 18px; color: #000; margin-bottom: 10px; } .posi-text span { color: #767171; font-size: 15px; } .btn-see { background: #7f58a4; display: inline-block; font-size: 16px; border-radius: 5px; color: #fff; font-weight: 600; width: 150px; text-align: center; line-height: 46px; transition: all .5s ease-in-out; } .btn-see:hover { background: #53c4c8; color: #fff; } .cloudbox { position: absolute; display: flex; align-items: center; left: 139px; } .cloud-txt { font-family: 'Nexa'; } .cloud-txt { margin-top: -60px; display: block; width: 250px; height: 250px; background: #7f58a4; border-radius: 50%; } .cloud-txt > p { font-size: 12pt; font-weight: 600; text-align: center; color: #fff; line-height: 22px; transform: translate(-50%,-50%); left: 50%; top: 50%; position: relative; padding: 30px; } .cloud-txt > p > span { display: block; } .cloud-txt > p > a { color: #f9ad8b; display: block; margin-top: 20px; } .join-pt > img { width: 100%; } .box-joifd { padding: 0 150px; } .whyjt { padding: 158px 0px 0px 0px; margin-bottom: 78px; } .whyjt > h5 { color: #7F58A4; text-align: center; display: block; font-size: 18pt; font-family: 'Nexa'; font-weight: bold; } .whyjt > p { color: #7F58A4; text-align: center; display: block; font-size: 10pt; font-family: 'Aller'; line-height: 22px; padding: 0px 20px; margin-top: 15px; } .joinleft { background: url("../img/web/line-join1.svg")no-repeat; background-size: 100%; margin-top: -300px; } .joinright { background: url("../img/web/line-joinr2.svg")no-repeat; background-size: 100%; } .box-mfr { justify-content: space-between; padding: 50px 0px 0px 0px; } .box-mfr > li { border: 3px solid #BCBEC0; padding: 20px; background: #fff; width: 212px; border-radius: 15px; position: relative; transition: all .5s ease-in-out; } .box-mfr > li:hover { box-shadow: 0px 7px 8px 0px #b4bfd8; } .box-mfr > li:hover .img-mfr img { transform: scale(1.2); } .img-mfr img { transition: all .5s ease-in-out; } /*.box-joifd1{ padding: 0 50px;} .box-mfr > li{ border: 3px solid #BCBEC0; padding: 10px 10px; background: #fff; width: 16%; border-radius: 15px; position: relative; margin: 0 5px; }*/ .img-mfr { margin-bottom: 20px; } .img-mfr > img { max-height: 100%; max-width: 100%; width: 80px; } .text-mfr > h6, .text-mfr > p { text-align: center; font-family: 'Aller'; color: #7F58A4; } .text-mfr > h6 { font-size: 11pt; font-weight: bold; margin-bottom: 15px; } .text-mfr > p { font-size: 9pt; line-height: 20px; font-weight: normal; } .cricle-top { position: absolute; top: -76px; left: 0; right: 0; margin: auto; content: ''; } .btmline .cricle-top { bottom: -76px; top: inherit; } .btmline .cricle-top span:before { top: -30px; } .cricle-top span { width: 40px; height: 40px; border: 5px solid #53c4c8; background: #fff; border-radius: 50%; display: block; margin: auto; } .cricle-top span:before { position: absolute; top: 41px; left: 0; border-left: 3px dashed #a5dee0; content: ''; width: 1px; height: 33px; margin: auto; right: 0; } .text-mfr > span { color: #53c4c8; font-size: 9pt; font-style: italic; display: block; text-align: center; margin-bottom: 15px; } .btmline .box-mfr { padding: 20px 0px 0px 0px; } .joinright { padding-top: 145px; } .btmline { position: relative; top: 36px; } .filebtm p { font-family: 'Nexa'; color: #7f58a4; font-size: 15pt; text-align: center; font-weight: bold; line-height: 26px; display: block; padding: 60px 0px 80px 0px; } .open-p { background: linear-gradient(to bottom, #cc9999 0%, #7f58a5 100%) fixed; padding: 50px 0px; } .op-box h4 { color: #fff; margin-bottom: 30px; text-align: center; text-transform: uppercase; font-family: 'Nexa'; font-weight: bold; font-size: 20pt; } .op-box ul { padding: 0px 40px; } .op-box ul li { border: 2px solid #fbcb29; overflow: hidden; margin-bottom: 20px; display: flex; justify-content: space-between; align-items: center; border-radius: 15px; background: linear-gradient(#ffffff, #bcbec0); } .op-box ul li:last-child { margin-bottom: 0; } .op-box ul li .cr-head { width: 79%; padding: 0px 20px; } .op-box ul li .cr-lrn a, .op-box ul li .cr-head h5 { font-family: 'Nexa'; } .op-box ul li .cr-lrn { width: 200px; } .op-box ul li .cr-lrn a { background: #fbcb29; display: block; padding: 27px 32px; font-size: 13pt; text-transform: uppercase; text-align: center; font-weight: bold; color: #7f58a4; transition: all .5s ease-in-out; } .op-box ul li .cr-lrn a:hover { background: #7f58a4; color: #fff; } .op-box ul li .cr-head h5 { color: #7f58a4; font-size: 13pt; text-transform: uppercase; font-weight: bold; } .op-box ul li .cr-head span { color: #7f58a4; font-size: 10pt; font-family: 'Aller'; } .jobpop .modal { background: rgb(92 66 156 / 50%); } .jobpop .modal-dialog { max-width: 100%; width: 55%; } .jobpop .modal-title { font-size: 18px; } .jobpop .modal-title span { font-weight: bold; } .job-content > h6 { display: block; background: #53c4c8; padding: 10px 10px; color: #fff; font-weight: 600; font-size: 15px; } .job-content > span { margin: 20px 0px 10px 0px; display: block; font-weight: 600; font-size: 14px; color: #272727; } .job-content > span > b { color: #7f58a4; font-weight: bold; } .job-content > span > p { font-size: 12px; line-height: 20px; font-weight: 500; color: #333232; } .job-content ul li, .job-content ul p, .job-content ul div { font-size: 12px; color: #404040; position: relative; display: block; padding: 8px 18px; } .job-content ul li:before, .job-content ul p:before, .job-content ul div:before { position: absolute; left: 0; top: 7px; content: '--'; } .jobpop .modal-footer { justify-content: center !important; } .apnow { display: inline-block; background: #fbcb29; text-align: center; padding: 18px 50px; color: #7f58a4; font-size: 16px; font-weight: 600; border-bottom: 5px solid #e4b824; transition: all .5S ease-in-out; } .apnow:hover { background: #7f58a4; border-bottom: 5px solid #6d4494; color: #fff; } .erbxs { display: block; font-size: 11px; color: #F44336; margin-top: 5px; } /*============================================================ Team ================================================================*/ .teambx ul li { width: 50%; display: flex; margin-bottom: 30px; border-bottom: 1px solid #ddd; padding-bottom: 30px; } .team-img { width: 229px; height: 229px; } .team-img, .team-img img { border-radius: 50%; } .team-img img { max-height: 100%; max-width: 100%; } .team-text { width: 260px; padding: 10px; } .team-text h3 { font-size: 24px; margin: 0; font-weight: bold; text-transform: capitalize; color: #404040; } .team-text span { font-weight: 700; font-size: 1rem; color: #7f58a4; margin: 20px 0 0; display: block; text-transform: capitalize; } .team-text p { font-size: 0.875rem; font-style: italic; margin: 20px 0 0; display: block; color: #808080; line-height: 24px; } .social-team a { color: #404040; display: block; border: 1px solid #ddd; padding: 8px; width: 35px; height: 35px; text-align: center; margin-top: 10px; transition: all .5s ease-in-out; margin-right: 10px; border-radius: 3px; } .social-team a:last-child { margin-right: 0; } .social-team a:hover { color: #fff; background: #7f58a4; } /*============================================================ Comprehensive ================================================================*/ .Comprehensive-box { background: url("../img/web/Comprehensive-bg.png")no-repeat; background-size: contain; height: 580px; } .commain { align-items: center; } .Comprehensive-left-img { width: 38%; margin-top: 71px; } .containbx { padding: 0 100px; } .Comprehensive-right { width: 47%; padding-left: 100px; } .Comprehensive-right > span { font-family: 'D-DIN Condensed'; font-weight: bold; font-size: 15pt; background: #53c4c8; color: #fff; padding: 5px 8px; display: inline-block; margin-bottom: 20px; } .Comprehensive-right > h1, .Comprehensive-right > p > Span { letter-spacing: 2px; } .Comprehensive-right > h1 { font-family: 'Nexa'; font-weight: bold; font-size: 19pt; color: #fff; margin-bottom: 30px; display: block; } .Comprehensive-right > p { font-family: 'Aller'; font-size: 10pt; color: #fff; font-weight: 300; line-height: 20px; } .Comprehensive-right > p > span { color: #FFF200; font-weight: bold; font-size: 14pt; display: block; line-height: 26px; margin-bottom: 20px; } .flxw { flex-wrap: wrap; } .box-po-logo { margin: 20px 0px; } .green-text { color: #53C4C8; } .purple-text { color: #7F58A4; } .takelogo > h2 { margin-bottom: 40px; font-family: 'Aller'; font-weight: bold; letter-spacing: 2px; font-size: 14pt; display: block; text-align: center; } .logotop { margin-top: 60px; } .wdc1 li { width: 16%; } .wdc2 li { width: 25%; } .insp { text-align: center; display: block; margin-top: 20px; color: #53c4c8; font-weight: 600; } .wdc2 li img { width: 60%; } .box-po-logo ul li img { max-height: 100%; } .logotop .box-po-logo { padding: 0px 250px; } .smtxt { margin: 30px 0px 50px 0px; color: #A7A9AC; font-size: 8pt; font-family: 'Aller'; font-weight: 300; display: block; text-align: center; } .bggradnt { background: linear-gradient(to bottom, #7f58a5 0%, #cc9999 154%); } .bggradnt1 { background: linear-gradient(to bottom, #cc9999 0%, #7f58a5 80%); } .bgtop { padding-top: 255px; margin-top: -312px; } .whitebox { background: #fff; border: 2px solid #ede8f3; padding: 50px 50px; border-radius: 10px; box-shadow: 11px 11px 0px -1px #7F58A4; z-index: 1; position: relative; } img { max-height: 100%; max-width: 100%; } .leading-text { width: 60%; } .leading-img { width: 40%; } .leading-in { width: 80%; margin: auto; } .leading-in > p { font-family: 'Aller'; font-size: 11pt; font-weight: bold; font-style: italic; color: #53C4C8; text-align: center; padding: 0 20px; line-height: 19px; margin-bottom: 20px; } .leading-in > span, .leading-in > h4 { font-family: 'Nexa'; text-align: center; display: block; } .leading-in > span { font-weight: 600; color: #939598; } .leading-in > h4 { font-weight: bold; color: #A7A9AC; font-size: 16pt; } .leading-in > h4 > span { color: #7f58a4; } .wtimg { margin: 50px 0px; } .whitebox .d-flex { align-items: center; } /*.any-top{margin-top: -34px;}*/ .equal-ca { position: relative; } .topeql-img > img { width: 100%; } .topeql-img { position: relative; } .mainbox-ca { padding-bottom: 50px; padding-top: 200px; } .wttop-left { position: relative; } /*.wttop-left:before { position: absolute; content: ''; right: 0; top: 5px; width: 39px; height: 100%; } .wht-ptr:before { background: url("../img/web/white-ptrn.svg")repeat; background-size: 100%; }*/ .headtxt > h4 { font-size: 16pt; letter-spacing: 1px; color: #fff; font-family: 'Nexa'; font-weight: bold; text-align: center; display: block; } .equal-ca2 .headtxt > h4 { color: #53C4C8; padding: 0px 100px; } .Analytics-Career-colum { background: #fff; border-radius: 20px; background-image: linear-gradient(#fff, #D6D7D9); margin: 20px 0px; } .pdbox-ac { width: 70%; margin: auto; } .headingul { align-items: center; position: relative; transition: all .5s ease-in-out; } .headingul > li { border-right: 1px solid #82AABD; padding: 10px 10px; width: 16%; display: flex; align-items: center; height: 80px; transition: all .5s ease-in-out; } .headingul > li > span { display: block; text-align: center; color: #808285; line-height: 17px; font-size: 9pt; font-family: 'Aller'; font-weight: bold; } .headingul > li > span > sup { font-size: 7pt; } .cksvg { fill: #53C4C8; } .allylow { fill: #FBCB29; transform: translate(0, 2px); opacity: 0; } .minussvg { fill: #53C4C8; } .closesvg { fill: #F04E4C; } .iconsv-all svg { width: 20px; height: 20px; } .iconsv-all { display: block; text-align: center; width: 100%; } .headingul > li:last-child { border-right: none; } .hovereft:hover { box-shadow: 0px 0px 10px #8d8a8a; background-image: linear-gradient(#ADDEE0, #53C4C8); } .hovereft:hover li { height: 100px; } .hovereft:hover:before, .hovereft:hover:after { opacity: 1; } .hovereft:hover li > span { color: #fff; font-size: 11pt; font-style: italic; } .hovereft:hover .cksvg, .hovereft:hover .minussvg, .hovereft:hover .closesvg { fill: #FFFFFF; } .hovereft:hover .iconsv-all svg { width: 25px; height: 25px; } .hovereft:hover .allylow { opacity: 1; } .hovereft:before, .hovereft:after { background-image: linear-gradient(#ADDEE0, #53C4C8); } .hovereft:before, .hovereft:after { position: absolute; content: ''; top: 0; bottom: 0; width: 20px; opacity: 0; } .hovereft:before { left: -20px; } .hovereft:after { right: -20px; } .technicians-box { margin: 50px 100px 0px 150px; background: rgba(128, 81, 179,0.3); padding: 40px 50px; border-radius: 10px; position: relative; } .textimg { position: absolute; left: -130px; top: 0; } .textimg img { width: 160px; } .technicians-box > p { font-size: 9pt; color: #fff; font-family: 'Aller'; font-weight: normal; margin-bottom: 20px; line-height: 16px; } .technicians-box > p:last-child { margin-bottom: 0; } .technicians-box:before { position: absolute; left: -26px; top: 20px; content: ''; width: 0; height: 0; border-top: 15px solid transparent; border-right: 30px solid #9d6ea4; border-bottom: 15px solid transparent; } .equal-ca1, .equal-ca2, .equal-ca3 { width: 100%; height: 100%; } .equal-ca1 { background: url("../img/web/curveline1.svg") no-repeat; background-size: 100%; } .equal-ca2 { background: url("../img/web/curveline2.svg") no-repeat; background-size: 100%; } .equal-ca3 { background: url("../img/web/curveline3.svg") no-repeat; background-size: 100%; } .equal-ca4 { background: url("../img/web/curveline4.svg") no-repeat; background-size: 100%; } .equal-ca5 { background: url("../img/web/curveline5.svg") no-repeat; background-size: 100%; } .tab-ca .nav-tabs .nav-item:first-child { opacity: 0; } .tab-ca { margin-top: 50px; z-index: 9; position: relative; } .tab-ca .nav-tabs { border-bottom: none; width: 100%; justify-content: space-between; flex-wrap: inherit; } .tab-ca .nav-tabs .nav-link { position: relative; font-family: 'Nexa'; letter-spacing: 2px; font-size: 13pt; font-weight: bold; display: flex; justify-content: center; align-items: center; margin-bottom: 0; border: none; padding: 0; background: #53C4C8; color: #fff; height: 127px; width: 100%; border-radius: inherit; text-align: center; } .tab-ca .nav-tabs .nav-item { width: 34%; } .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { font-size: 15pt; margin-top: -4px; background-image: linear-gradient(#53C4C8, #ADDEE0); box-shadow: 0px 0px 16px #b9b3b3; z-index: 2; -webkit-transition: all 200ms ease-in; -webkit-transform: scale(1.06); -ms-transition: all 200ms ease-in; -ms-transform: scale(1.06); -moz-transition: all 200ms ease-in; -moz-transform: scale(1.06); transition: all 200ms ease-in; transform: scale(1.06); } .trtop { font-size: 12pt; top: 10px; position: absolute; letter-spacing: 0; right: 14px; font-family: 'D-DIN Condensed'; font-weight: bold; text-transform: uppercase; } .listicon .d-flex { justify-content: space-between; } .listcloum > ul > li { transition: all .5s ease-in-out; width: 34%; position: relative; height: 60px; display: flex; align-items: center; border-right: 1px solid #82AABD; } .listcloum > ul > li > h5 { font-size: 10pt; color: #808285; letter-spacing: 1px; font-family: 'Aller'; font-weight: bold; } .listcloum > ul > li:last-child { border-right: none; } .listcloum > ul > li:first-child { text-align: left; padding-left: 75px; } .listcloum > ul > li .iconsv-all svg { width: 28px; height: 28px; } .listicon .listcloum:nth-child(odd) { background: #dbdcdd; } .listicon .listcloum:nth-child(even) { background: #f1f1f2; } .listicon { position: relative; top: 2px; } .listcloum { background: #fff; } .isicon { position: absolute; top: -7px; left: -9px; } .purplesv { fill: #7F58A4; transform: translate(0, 2px); } .listcloum { position: relative; transition: all .5s ease-in-out; } /*hover-icon*/ .listcloum:hover { box-shadow: 0px 0px 16px #b9b3b3; z-index: 2; -webkit-transition: all 200ms ease-in; -webkit-transform: scale(1); -ms-transition: all 200ms ease-in; -ms-transform: scale(1); -moz-transition: all 200ms ease-in; -moz-transform: scale(1); transition: all 200ms ease-in; transform: scale(1); } .listcloum:nth-child(odd) > ul > li { border-top: 3px solid #dbdcdd !important; border-bottom: 3px solid #dbdcdd !important; } .listcloum:nth-child(odd) > ul > li:first-child { border-left: 3px solid #dbdcdd !important; } .listcloum > ul:nth-child(odd) > li:last-child { border-right: 3px solid #dbdcdd !important; } .listcloum:nth-child(even) > ul > li { border-top: 3px solid #f1f1f2 !important; border-bottom: 3px solid #f1f1f2 !important; } .listcloum:nth-child(even) > ul > li:first-child { border-left: 3px solid #f1f1f2 !important; } .listcloum > ul:nth-child(even) > li:last-child { border-right: 3px solid #f1f1f2 !important; } .listcloum:hover > ul > li { border-top: 3px solid #7F58A4 !important; border-bottom: 3px solid #7F58A4 !important; background: #fff !important; } .listcloum:hover > ul > li:first-child { border-left: 3px solid #7F58A4 !important; } .listcloum:hover > ul > li:last-child { border-right: 3px solid #7F58A4 !important; } .listcloum:hover .popicon { opacity: 1; top: -20px; right: -140px; width: 350px; height: auto; overflow: initial; } /*icon-pop*/ .popicon { position: absolute; height: 0; overflow: hidden; opacity: 0; width: 0; z-index: 4; transition: all .5s ease-in-out; font-family: 'Aller'; background: #fff; border: 3px solid #ede8f3; padding: 20px; border-radius: 10px; box-shadow: 8px 8px 0px -1px #7F58A4; } .popicon:before { content: ""; position: absolute; top: 30px; left: -25px; z-index: 1; height: 60px; width: 30px; margin-top: -15px; background: linear-gradient(-45deg, white 17px, rgba(237,232,243,1) 17px, rgba(237,232,243,1) 21px, transparent 21px), linear-gradient(225deg, white 17px, rgba(237,232,243,1) 17px, rgba(237,232,243,1) 21px, transparent 21px); background-position: left 0px, right bottom; background-size: 100% 50%; background-repeat: no-repeat; } .popicon:after { content: ""; position: absolute; top: 30px; left: -25px; z-index: 1; height: 60px; width: 30px; margin-top: -14px; border-right: solid 5px white; border-top: solid 5px transparent; border-bottom: solid 5px transparent; } .popicon-content > h6 { font-size: 9pt; font-weight: bold; color: #53C4C8; margin-bottom: 5px; } .popicon-content > h6 > sup { font-size: 6pt; } .popicon-content > h2 { font-weight: bold; color: #7F58A4; text-transform: uppercase; margin-bottom: 15px; } .popicon-content > p, .popicon-content > h5 { font-weight: bold; line-height: 15px; } .popicon-content > p { color: #505152; margin-bottom: 20px; font-size: 8pt; } .popicon-content > h5 { color: #7F58A4; margin-bottom: 10px; font-size: 10pt; } .orngc { color: #f7b390; } .purplc { color: #6b448f; } .popicon-content > .bluet { color: #55c4c7; } .popicon-content .nrm-ft { font-weight: normal; } .popnav > li { position: relative; } .popnav > li > a { font-size: 8pt; color: #53C4C8 !important; font-weight: normal; padding: 5px 0px 5px 12px; transition: all .5s ease-in-out; display: block; line-height: 12px; } .popnav > li > a:hover { color: #7f58a4; } .popnav > li > a:before { font-family: 'FontAwesome'; position: absolute; left: 0; content: '\f101'; top: 5px; } .popnav { margin-bottom: 20px; } .popicon-content > span { color: #808285; font-size: 8pt; font-weight: bold; } .clogo { margin: 10px 0px 0px 0px; } .clogo > img { text-align: left; margin: inherit; } /*icon-pop-end*/ .boxspance1 { padding: 0px 80px 0 92px; margin-top: -40px; position: relative; } .cloudr:after, .tiles-images > ul:before, .tiles-images > ul:after { position: absolute; content: ''; } .cloudr:after { right: -52px; top: -98px; content: ''; background: url("../img/web/cloud-lg.svg")no-repeat; width: 250px; height: 153px; z-index: 1; background-size: 250px; } .tiles-images > ul:before { left: 46px; bottom: 76px; background: url("../img/web/cloud-sm1.svg")no-repeat; width: 150px; height: 86px; z-index: -1; } .tiles-images > ul:after { right: -67px; bottom: -40px; background: url("../img/web/cloud-sm.svg")no-repeat; width: 150px; height: 86px; z-index: 2; background-size: 150px; } .boxspance1 > .d-flex { align-items: center; z-index: 2; position: relative; } .tiles-text { width: 45%; } .tiles-images { width: 55%; } .tiles-lg > p, .tiles-sm > p { color: #fff; text-align: right; letter-spacing: 1px; } .tiles-lg > p { font-weight: bold; font-size: 16pt; font-family: 'Nexa'; line-height: 28px; } .tiles-lg > p > span, .tiles-sm > p > span { color: #FFF200; } .tiles-lg { margin-bottom: 40px; } .tiles-sm > p { font-family: 'Aller'; font-size: 9pt; line-height: 20px; font-weight: 300; } .tiles-sm > p > span > i { font-weight: 300; } .font-i { font-style: italic; } .tiles-images > ul { display: flex; flex-wrap: wrap; padding-left: 100px; position: relative; justify-content: center; } .tiles-images > ul > li { width: 28%; margin: 10px; } .tiles-images > ul > li, .tiles-images > ul > li img { transition: all .5s ease-in-out; } .tiles-images > ul > li:hover img { box-shadow: 0px 0px 20px #eaeaea; border-radius: 10px; z-index: 2; -webkit-transition: all 200ms ease-in; -webkit-transform: scale(1); -ms-transition: all 200ms ease-in; -ms-transform: scale(1.1); -moz-transition: all 200ms ease-in; -moz-transform: scale(1.1); transition: all 200ms ease-in; transform: scale(1.1); } .style_prevu_kit:hover { } .bottom-fx { margin-top: 50px; } .bottom-fx > p { font-size: 8pt; color: #fff; font-family: 'Aller'; font-weight: 300; letter-spacing: 1px; display: block; text-align: center; } .expert-main { padding-bottom: 140px; padding-top: 140px; position: relative; } .expert-bpx .d-flex .imgexpt { width: 40%; } .expert-bpx .d-flex .content-expt { width: 60%; padding-left: 100px; } .content-expt > h4 { color: #53C4C8; font-size: 15pt; font-family: 'Nexa'; font-weight: bold; } .content-expt > ul { margin-top: 50px; } .content-expt > ul > li { display: block; width: 100%; overflow: auto; margin-bottom: 20px; } .imgex-icon, .imgex-cnt { float: left; } .imgex-icon { width: 82px; margin-right: 30px; } .imgex-cnt { width: calc(100% - 180px); font-family: 'Aller'; margin-top: 10px; display: block; } .imgex-cnt > h5, .imgex-cnt > p { color: #7F58A4; display: block; } .imgex-cnt > h5 { color: #7F58A4; font-size: 12pt; display: block; margin-bottom: 5px; font-weight: bold; } .imgex-cnt > p { font-size: 10pt; font-weight: 300; line-height: 17px; } .ceoboxmain { padding: 50px 150px; } .ceotext > p { font-size: 15pt; color: #fff; letter-spacing: 2px; text-align: center; font-weight: bold; padding: 50px 70px; line-height: 24px; width: 80%; margin: auto; } .ceoslider { width: 70%; margin: auto; } .slider-text-ceo { margin: 20px; } .slider-text-ceo > img { width: 100%; margin-bottom: 20px; } .slider-text-ceo > h5 { text-align: left; font-weight: bold; font-size: 12pt; color: #fff; display: block; letter-spacing: 2px; margin-bottom: 10px; } .slider-text-ceo > h5 > span { display: block; margin-top: 5px; } .slider-text-ceo > span { text-align: left; display: block; color: #fff; font-size: 12px; margin-bottom: 5px; } .lstus > li { font-size: 9pt; color: #A7A9AC; list-style: disc inside; font-family: 'Aller'; margin-top: 5px; } .text_tr { text-transform: uppercase; } .slider-text-ceo > h5, .slider-text-ceo > span { padding-left: 10px; } .sliderbx-ceo .slick-prev:before, .sliderbx-ceo .slick-next:before { content: ''; position: absolute; top: 0; left: 0; width: 50px; height: 50px; opacity: 1 !important; } .sliderbx-ceo .slick-prev:before { background: url("../img/web/arrow-l.svg")no-repeat; background-size: 100%; } .sliderbx-ceo .slick-next:before { background: url("../img/web/arrow-r.svg")no-repeat; background-size: 100%; } .sliderbx-ceo .slick-prev, .sliderbx-ceo .slick-next { width: 63.52px; height: 60px; } .sliderbx-ceo .slick-prev { left: -65px; } .sliderbx-ceo .slick-next { right: -75px; } .ceo-bottom { border: 2px solid #FBCB29; padding: 30px 50px; border-radius: 20px; } .ceo-bottom > p { width: 80%; font-weight: bold; margin: auto; text-align: center; color: #fff; font-size: 11pt; color: #FBCB29; font-style: italic; font-family: 'Aller'; line-height: 25px; } .ceo-bottom > p > span { display: block; margin-top: 20px; color: #fff; font-family: 'Nexa'; font-weight: bold; font-style: normal; letter-spacing: 1px; } .pricetag-main { padding-top: 109px; position: relative; } .pctag > h5 { font-family: 'Nexa'; text-align: center; letter-spacing: 2px; display: block; font-size: 15pt; color: #53C4C8; font-weight: bold; } .pctag > h5 > span { text-transform: uppercase; color: #7f58a4; } .pricebox { padding: 50px 0 0px 0px; width: 60%; margin: auto; } .pricebox > p { color: #939598; font-size: 10pt; text-align: center; line-height: 20px; display: block; font-family: 'Aller'; font-weight: 300; } .pricebox > p > i { color: #7f58a4; } .proicebox { position: relative; justify-content: space-between; margin-top: 70px; background: linear-gradient(to bottom, #FFFFFF 0%, #D6D7D9 120%); border-radius: 20px; } .proicebox > li { width: 33.33%; border-right: 1px solid #82AABD; } .proicebox > li, .proicebox > li > a { transition: all .5s ease-in-out; } .proicebox > li > a { display: block; position: relative; } .proicebox > li:last-child { border-right: none; } .headbx { display: flex; flex-wrap: wrap; height: 120px; justify-content: center; align-items: center; border-right: 1px solid #53c4c8; background: #53c4c8; box-shadow: 0px 7px 8px 0px #b4bfd8; } .headbx > h4 { font-size: 14pt; color: #fff; font-family: 'Nexa'; font-weight: bold; letter-spacing: 1px; } .text-pc { height: 210px; display: flex; align-items: center; padding: 0px 40px; } .text-pc > p { color: #808285; font-family: 'Aller'; text-align: center; display: block; line-height: 20px; } .btmprice { font-family: 'Nexa'; flex-wrap: wrap; position: relative; height: 130px; display: flex; align-items: center; justify-content: center; padding: 10px 10px 20px 10px; } .btmprice > span { width: 100%; display: block; font-weight: bold; letter-spacing: 1px; text-align: center; font-size: 22pt; color: #53C4C8; } .btmprice > span > sub { font-size: 10pt; } .headbx > h4 > span { display: block; color: #fff; text-align: center; font-size: 13pt; margin-bottom: 10px; font-family: 'D-DIN Condensed'; } .zoombt .headbx { z-index: 4; position: relative; top: -6px; background: #7f58a4; -webkit-transition: all 200ms ease-in; -webkit-transform: scale(1.1); -ms-transition: all 200ms ease-in; -ms-transform: scale(1.1); -moz-transition: all 200ms ease-in; -moz-transform: scale(1.1); transition: all 200ms ease-in; transform: scale(1.1); } .zoombt { z-index: 1; } .zoombt .headbx > h4 { color: #FBCB29; font-size: 13pt; } .zoombt .btmprice { border: 2px solid #7f58a4; } .zoombt .btmprice > span { font-size: 30pt; color: #7F58A4; } .btmprice > span > h6, .zoombt .btmprice > span > h6 { color: #b9babb; font-weight: bold; font-size: 13pt; text-align: left; text-decoration: line-through; } .zoombt .btmprice > span > h6 { font-size: 21pt; } .smbtm { margin: 40px 0px 20px 0px; } .smbtm > p { font-size: 9pt; color: #A7A9AC; display: block; text-align: center; font-family: 'Aller'; } .btmbx > h6 { font-size: 15pt; background: #FBCB29; padding: 8px 10px; display: inline-block; position: absolute; bottom: -18px; color: #fff; font-family: 'D-DIN Condensed'; font-weight: bold; letter-spacing: 2px; right: 0; left: 0; margin: auto; width: 100px; text-align: center; } .daybox { justify-content: center; } .daycrl { width: 50%; } .wdb1 { width: 70%; margin: auto; } .daycrl > h5 { color: #7F58A4; margin-bottom: 30px; font-size: 13pt; font-family: 'Aller'; font-weight: bold; text-align: center; letter-spacing: 1px; } .daycrl > span { display: block; text-align: center; margin-top: 20px; font-weight: bold; color: #53C4C8; text-transform: uppercase; font-family: 'Nexa'; letter-spacing: 1px; font-size: 20pt; } .mtfooter { margin-top: -62px; padding: 150px 0px 0px 0px; } .leftfooter { padding-left: 50px; } .leftfooter > h5 { color: #fff; font-size: 15pt; font-family: 'Nexa'; font-weight: bold; letter-spacing: 2px; margin-bottom: 20px; } .leftfooter > p { color: #fff; font-size: 10pt; font-weight: 300; line-height: 20px; letter-spacing: 1px; } .leftfooter > p > span { color: #fbcb29; } .leftfooter > p, .leftfooter > ul { font-family: 'Aller'; } .leftfooter > ul { margin-top: 20px; padding-left: 50px; padding-right: 20px; } .leftfooter > ul > li { position: relative; color: #fff; font-size: 10pt; margin-bottom: 6px; font-weight: 300; padding-left: 20px; line-height: 18px; } .leftfooter > ul > li > svg { width: 10px; height: 10px; position: absolute; top: 3px; left: 0; } .ftylw { fill: #FBCB29; } .mtbtn { margin: 25px 0px 40px 0px; } .btn-footer > a { padding: 10px 10px; margin-right: 10px; border-radius: 12px; font-weight: 600; color: #fff; width: 130px; text-align: center; font-size: 11pt; letter-spacing: 1px; transition: all .5s ease-in-out; } .yellowbg { background: #FBCB29; border: 1px solid #FBCB29; } .yellowbg:hover { background: #fff; border: 1px solid #FBCB29; color: #fbcb29; } .greebg { background: #53C4C8; border: 1px solid #53C4C8; } .greebg:hover { background: #fff; border: 1px solid #53C4C8; color: #53C4C8; } .ftbotm { background: #7F58A4; padding-bottom: 40px; position: relative; margin-top: 150px; text-align: center; } .ftbotm:before { position: absolute; left: 0; right: 0; top: -32px; background: url("../img/web/top-f.svg")no-repeat; width: 297px; content: ''; margin: auto; height: 32.75px; } .ftbotm > a { display: inline-block; position: relative; font-family: 'Aller'; font-size: 19pt; text-transform: uppercase; color: #fff; letter-spacing: 1px; font-weight: bold; transition: all .5s ease-in-out; } .ftbotm > a:hover { color: #fbcb29; } .ftbotm > a > span:before, .ftbotm > a > span:after { position: absolute; content: ''; background: url("../img/web/ap-awr.svg")no-repeat; width: 13px; height: 13px; background-size: contain; } .toarw:before, .toarw:after { top: -10px; } .toarw:before { left: -11px; transform: rotate(45deg); } .toarw:after { right: -11px; transform: rotate(135deg); } .btmarw:before, .btmarw:after { bottom: -10px; } .btmarw:before { left: -11px; transform: rotate(-45deg); } .btmarw:after { right: -11px; transform: rotate(-135deg); } /*change*/ .imgleft1 { height: 750px; margin-top: 33px; padding-left: 20px; background: url("../img/web/Fast-track.svg")no-repeat; background-size: contain; } .imgleft2 { height: 730px; margin-top: -34px; padding-left: 20px; background: url("../img/web/men.svg")no-repeat; background-size: contain; background-position: right; } .leftimgall { width: 60%; z-index: 2; } .rightall-text { width: 40%; } .top1-main { padding-right: 150px; } .topall1 { margin-top: 300px; } .hdeign1, .hdeign2, .hdeign3 { color: #fff200; font-family: 'Nexa'; font-weight: bold; letter-spacing: 1px; text-align: right; font-size: 18pt; line-height: 33px; } .hdeign2 { font-size: 14pt; text-align: left; line-height: 22px; } .topall2 { padding-left: 150px; } .hdeign1, .small-para { padding-left: 150px; } .hdeign3 { font-size: 18pt; color: #97679f; text-align: left; } .topall3 { padding-top: 250px; padding-left: 100px; } .guidebx ul li .team-img, .guidebx ul li .team-img img { border-radius: 0%; } .guidebx ul li .team-text { background: #fff; text-align: center; padding: 20px; margin: -40px 15px 0; width: initial; position: relative; z-index: 1; border: 1px solid #ddd; } .guidebx ul { justify-content: space-between; } .guidebx ul li { display: block; width: 32%; padding: 30px 10px 0; border: none; } .guidebx ul li .team-img img { width: 100%; } .guidebx ul li .social-team { justify-content: center; } .guidebx ul li .team-img { width: initial; height: initial; } .expert-box { margin-top: 40px; } .expert-box p { color: #fff; font-size: 10pt; font-weight: 300; line-height: 20px; margin-bottom: 20px; letter-spacing: 0.75pt; text-align: right; } .bgarow { padding-top: 160px; } .box2 { align-items: inherit; } .box2 .right-cnt-dv { padding-top: inherit; } .box3 .right-cnt-dv > h1 { text-align: left; color: #55c4c7; font-size: 21pt; font-weight: bold; font-family: Nexa; line-height: 26pt; } .proces-para { margin-top: 20px; } .proces-para p { color: #7f58a4; line-height: 18pt; letter-spacing: 0.75pt; font-size: 11pt; text-align: left; } .proces-para p span { color: #fbcb29; font-weight: bold; } .box-dv { display: block; text-align: right; font-size: 10pt; margin-top: 30px; color: #6d6e71; } .d-for-data span, .cngbtd { display: block; text-align: right; font-size: 10pt; color: #6d6e71; } .cngbtd { text-align: center; } .proces-para p i { margin-top: 20px; display: block; color: #7f58a4; } .pathbox p { font-size: 10pt; color: white; letter-spacing: 0.75pt; line-height: 14pt; text-align: left; } .text-page5 > h2 { font-size: 27pt; font-family: 'Nexa'; font-weight: bold; text-align: left; letter-spacing: 0.75pt; } .text-page5 > h2 span { color: #fbcb29; } .img-boxes ul li { padding: 8px; } .img-boxes ul li a, .img-boxes ul li a img { transition: all .5s ease-in-out; } .img-boxes ul li:hover img { transform: scale(1.1); } .text-page6 h2 { color: #7f58a4; font-size: 24pt; font-weight: bold; text-align: center; margin-bottom: 15px; display: inline-block; text-align: center; } .text-page6 > p { font-family: 'Aller'; } .page8 { margin-top: 50px; } .bg8-bx { background: #7f58a4; padding: 50px 0; display: flex; justify-content: space-between; align-items: center; } .bg8-bx h2 { color: white; font-size: 25pt; font-weight: bold; font-family: Nexa; } .slider-main { text-align: center; width: 60%; } .slide-content { color: #fff; } .slide-content h3 { margin: 15px 0 10px; font-size: 14pt; font-weight: bold; color: white; } .slide-content h4 { margin-bottom: 10px; } .box-dv-lft { padding-left: 150px; } .slider-main.slick-prev:before, .slick-next:before { opacity: 1; } .slider-main .slick-prev:before, .slider-main .slick-next:before { content: ' '; background-image: url("../img/web/slider-arrow-right.svg"); background-repeat: no-repeat; background-repeat: no-repeat; height: 19px; width: 14px; display: block; margin: auto; transform: rotate(180deg); } .slider-main .slick-prev, .slider-main .slick-next { width: 40px; height: 40px; background: #d1d3d4; border-radius: 50%; } .slider-main .slick-prev, .slider-main .slick-next { top: 25%; } .slider-main .slick-prev:hover, .slider-main .slick-prev:focus, .slider-main .slick-next:hover, .slider-main .slick-next:focus { background: #d1d3d4; } .slider-main .slick-prev { left: 0; z-index: 9; } .slider-main .slick-next { right: 0; } .slider-main .slick-next:before { background-image: url("../img/web/slider-arrow-left.svg"); } .righthd { display: none; } .menubar { cursor: pointer; } .bar1, .bar2, .bar3 { width: 30px; height: 4px; background-color: #8057a5; margin: 5px 0; transition: 0.4s; } .change .bar1 { -webkit-transform: rotate(-45deg) translate(-9px, 6px); transform: rotate(-45deg) translate(-4px, 5px); } .change .bar2 { opacity: 0; } .change .bar3 { -webkit-transform: rotate(45deg) translate(-8px, -8px); transform: rotate(45deg) translate(-8px, -8px); } .nubcrl { display: none; } .main-shape { width: 80%; margin: auto; position: relative; } .fst-boxn { width: 60%; margin: auto; } .img-fstn { width: 300px; } .content-fst { width: calc(100% - 300px); } .img-fstn, .content-fst { float: left; } .fst-boxn .cricle-top { top: 97px; } .fst-boxn .cricle-top span { width: 50px; height: 50px; font-weight: bold; text-align: center; line-height: 37px; font-size: 18px; } .fst-boxn .cricle-top span:before { top: 46px; height: 50px; } .shph1 { text-align: center; font-size: 32px; font-weight: bold; color: #404040; position: absolute; left: 0; right: 0; top: 30px; } .odev-shape li { position: relative; } .odev-shape li:nth-child(odd), .odev-shape li:nth-child(even) { padding-top: 200px; width: 100%; height: 100%; } .odev-shape li:nth-child(odd) { background: url("../img/web/curve-th-1.svg") no-repeat; background-size: 100%; } .odev-shape li:nth-child(even) { background: url("../img/web/curve-th-2.svg") no-repeat; background-size: 100%; } /*.odev-shape li:nth-child(odd):before, .odev-shape li:nth-child(even):before { position: absolute; top: 220px; content: ''; height: 100%; width: 50px; } .odev-shape li:nth-child(odd):before { right: 0; background: url("../img/web/curve-th-left.svg")repeat-y; } .odev-shape li:nth-child(even):before { left: 0; background: url("../img/web/curve-th-left.svg")repeat-y; }*/ .gs-box { text-align: center; margin-bottom: 20px; border-bottom: 1px solid #ddd; padding-bottom: 10px; } .gs-box > h2 { display: block; font-weight: 600; margin-bottom: 10px; text-transform: uppercase; font-size: 16px; color: #4a4646; } .gs-box > span { border: 1px solid #ddd; margin: 5px; display: inline-flex; padding: 10px 18px; border-radius: 50px; } .gs-box > span > label { font-size: 13px; margin-left: 5px; color: #484646; } .twobox { display: flex; justify-content: space-between; } .twobox .log-form { width: 48%; } .er-login { font-size: 12px; } .flex-wrapper { display: flex; flex-flow: row nowrap; justify-content: center; } .single-chart { position: relative; text-align: center; width: 50%; justify-content: center; } .csd { position: absolute; left: 0; right: 0; } /*.circular-chart { display: block; margin: auto; width: 160px; }*/ .circle-bg { fill: none; stroke: #eee; stroke-width: 2.8; } .circle { fill: none; stroke-width: 2.5; stroke-linecap: round; animation: progress 1s ease-out forwards; } @keyframes progress { 0% { stroke-dasharray: 0 100; } } .circular-chart.orange .circle { } .percentage { fill: #8057a5; font-size: 11px; text-anchor: middle; font-weight: bold; } .pdbox { padding: 10px 100px; } .misstionbg { background: url("../img/web/ourmeet.png")no-repeat; width: 100%; height: 823.86px; background-size: contain; padding-top: 200px; } .mission-text { text-align: center; padding: 0px 300px; } .mission-text > h1 { color: #fff200; font-weight: bold; font-size: 21pt; display: block; margin-bottom: 5px; } .mission-text > span { font-style: italic; font-size: 11pt; font-weight: bold; color: #fff200; margin-bottom: 30px; display: block; } .mission-text > p { font-family: 'Aller'; line-height: 14px; color: #ffffff; font-size: 11px; margin-top: 20px; letter-spacing: 1px; } .box-wt { width: 70%; margin: -300px auto auto auto; } .shadowbr { box-shadow: 11px 11px 0px rgba(127, 88, 164, 0.5); } .boxstory { text-align: center; } .boxstory > h2 { color: #7f58a4; font-weight: bold; font-size: 15pt; margin-bottom: 10px; } .boxstory > p { color: #808285; text-align: center; display: block; padding: 0 100px; letter-spacing: 1px; line-height: 18px; } .boxstory > p, .boxstory > span { letter-spacing: 1px; font-size: 11pt; } .boxstory > span { color: #53c4c8; } .imgstory img { max-height: 100%; max-width: 100%; } .linemission { padding-top: 154px; } .linemission, .odev-shape1, .odev-shape1 li { position: relative; } .linemission:before { position: absolute; top: 0; width: 100%; height: 100%; left: 0; right: 0; content: ''; background: url("../img/web/mission-cv1.svg") no-repeat; background-size: 100%; } .odev-shape1 li:nth-child(odd), .odev-shape1 li:nth-child(even) { width: 100%; height: 213px; } .odev-shape1 li:nth-child(odd) { background: url("../img/web/mission-cv2.svg") no-repeat; background-size: 100%; } .odev-shape1 li:nth-child(even) { background: url("../img/web/mission-cv3.svg") no-repeat; background-size: 100%; } .odev-shape1 li:nth-child(odd):before, .odev-shape1 li:nth-child(even):before, .lastms:before { position: absolute; top: -30px; content: ''; width: 100px; height: 100px; background: url("../img/web/arrow-ms.svg")no-repeat; background-size: cover; } .odev-shape1 li:nth-child(odd):before, .lastms:before { left: -41px; } .odev-shape1 li:nth-child(even):before { right: -34px; transform: rotate(180deg); } .odev-shape1 li .pdord { padding: 0px 200px; position: relative; top: -20px; } .odev-shape1 li p { font-weight: bold; color: #a7a9ac; line-height: 27px; font-size: 11pt; text-align: center; letter-spacing: 1px; } .linemission1 { background: url("../img/web/mission-cv4.svg") no-repeat; background-size: 100%; height: 500px; } .lastms { padding: 0px 300px; position: relative; } .lastms > p { color: #f9ad8b; font-size: 23pt; margin-bottom: 80px; text-align: center; letter-spacing: 1px; line-height: 38px; } .lastms:before { top: 0; } .linemission1 .whitebox { width: 70%; margin: auto; } .imgsp { text-align: center; margin-top: -80px; } .imgsp > img, .res { max-height: 100%; max-width: 100%; } .imgsp > p { text-align: center; font-weight: bold; font-size: 11pt; color: #53c4c8; letter-spacing: 1px; line-height: 25px; margin-top: 15px; } .guidebg { background: url("../img/web/bgguide.svg")no-repeat; background-size: contain; height: 1053px; } .pdgdi { padding: 0px 50px; } .gdimg img, .imgal { max-height: 100%; max-width: 100%; } .guide-woman { display: flex; align-items: center; padding: 0px 100px; } .guidepd { padding: 25px 100px; } .gtxt > h1 { color: #fff200; font-size: 21pt; font-weight: bold; margin-bottom: 10px; } .gtxt > p { color: #fff; font-size: 10pt; letter-spacing: 1px; line-height: 20px; width: 80%; } .gtxt { position: relative; top: -50px; padding-left: 20px; } .guide-wt { margin-top: -160px; padding: 30px 50px; } .gdbox-g > h2 { color: #7f58a4; font-weight: bold; font-size: 14pt; text-align: center; display: block; } .clearfix:after { clear: both; content: ''; display: block; } .listguide { display: flex; justify-content: space-between; margin: 40px 0px; } .listguide > li { border-right: 2px solid #53c4c8; padding: 0px 20px; } .listguide > li:last-child { border-right: none; } .listguide > li > h5 { font-weight: bold; color: #53c4c8; font-size: 11pt; } .listguide > li > h5, .listguide > li > p { letter-spacing: 1px; text-align: center; margin-bottom: 10px; } .listguide > li > p { color: #808285; font-size: 9pt; line-height: 21px; } .btn-guide { text-align: center; display: block; } .btn-guide > a { background: #7f58a4; transition: all .5s ease-in-out; color: #fff; letter-spacing: 1px; border-radius: 50px; padding: 12px 46px; display: inline-block; font-size: 9pt; } .btn-guide > a:hover { background: #633093; } .guideuser { margin-top: 120px; } .guideuser > h2 { color: #7f58a4; font-size: 14pt; font-weight: bold; display: block; text-align: center; } .userguide { display: flex; justify-content: space-between; padding: 50px 120px; } .imggd-sv { width: 196px; height: 244px; } .gdtext-sv { width: 80%; } .trnglebx { background: #fff; border: 4px solid #ede8f3; box-shadow: 11px 11px 0px -1px #7F58A4; padding: 50px 50px; border-radius: 10px; z-index: 1; position: relative; position: relative; } .lftmgn { margin-left: 40px; } .rgtmgn { margin-right: 40px; } .trnglebx:before { border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; visibility: visible; } .trnglebx:before { top: 13px; width: 70px; height: 70px; } .trnglebx-sdw1:before { background: url("../img/web/arrowgd-left.svg")no-repeat; left: -41px; background-size: contain; } .trnglebx-sdw2:before { background: url("../img/web/arrowgd-left1.svg")no-repeat; right: -67px; background-size: contain; } .trnglebx > h3 { color: #53c4c8; font-size: 13pt; font-weight: bold; margin-bottom: 10px; } .trnglebx > h3, .trnglebx > span, .trnglebx > p { letter-spacing: 1px; display: block; } .trnglebx > span, .trnglebx > p { font-size: 9pt; } .trnglebx > span { color: #7f58a4; margin-bottom: 30px; } .trnglebx > p { color: #808285; line-height: 25px; } .btmbg { height: 55px; width: 100%; background: #7f58a4; } .clear { clear: both; } .clearfix:after { clear: both; content: ''; display: block; } .StartCourse-bg { background: url("../img/web/StartCourse-bg.svg")no-repeat; background-size: cover; height: 825px; } .stcourse-text { font-family: 'Aller'; margin-top: 150px; padding-right: 100px; } .stcourse-text > h1 { font-size: 14pt; color: #fff200; line-height: 26px; } .stcourse-text > h1, .stcourse-text > p { letter-spacing: 1px; margin-bottom: 20px; } .stcourse-text > p { font-weight: 300; font-size: 10pt; color: #fff; line-height: 20px; } .itlc { font-style: italic; } .stcourse-img { margin-top: 50px; } .ApplicationProcess-line { background: #7f58a4; position: relative; } .pror { position: relative; transition: all .5s ease-in-out; } .pror:before, .pror > h5:before { position: absolute; } .pror:before { right: 0; top: -14px; content: ''; background: #53c4c8; width: 100%; height: 64px; } .leftbf > h5:before { left: 0; } .rightbf > h5:before { right: 0; } .pror > h5:before { font-family: 'Nexa'; content: 'HOW TRACKED WORKS'; top: -41px; font-size: 14pt; color: #fff; background: #7f58a4; text-transform: uppercase; padding: 3px 10px; } .ap-two { display: flex; text-align: center; justify-content: space-between; height: 62px; align-items: center; font-family: 'Nexa'; } .ap-two > a, .ap-two > a > h5 { font-family: 'Nexa'; color: #9d80bb; font-size: 20pt; transition: all .5s ease-in-out; } .ap-two > a > h5 { font-weight: bold; } .pror > h5, .ap-two > a.pror h5 { color: #fff; font-size: 24pt; } .ap-two > a, .pror > h5 { font-weight: bold; letter-spacing: 1px; position: relative; display: inline-block; } .ap-two > a, .pror { width: 50%; padding: 12px 10px; transition: all .5s ease-in-out; } .bgtop-cr { width: 100%; height: 425px; background: url("../img/web/startcourse-l1.svg") no-repeat; background-size: 100%; position: relative; } .bgtop-cr:before { position: absolute; top: -80px; width: 100%; height: 100%; left: 0; right: 0; content: ''; background: url("../img/web/startcourse-line-r.svg") no-repeat; background-size: 100%; } .course-wt { position: relative; padding: 17px 50px; } .crstop { margin-top: -244px; } .nbr { position: absolute; transform: translate(-50%,-50%); top: 50%; } .rgt-nbr { right: -54px; } .rgt-nbl { left: 1px; } .nbr span { position: relative; font-family: 'Nexa'; background: #533193; color: #fff; font-weight: bold; width: 50px; height: 50px; border-radius: 50px; display: block; text-align: center; font-size: 20pt; line-height: 52px; } .tbcourse-box { display: flex; align-items: center; } .tbcourse_text { width: calc(100% - 200px); } .tbcourse-right { text-align: right; padding-right: 50px; } .tbcourse-left { text-align: left; padding-left: 50px; } .tbcourse_img { width: 200px; } .tbcourse_text, .tbcourse_img { float: left; } .tbcourse_text > h2 { font-size: 15pt; font-weight: bold; color: #7f58a4; margin-bottom: 10px; } .tbcourse_text > p { font-family: 'Aller'; font-size: 9pt; color: #808285; margin-bottom: 10px; line-height: 15px; } .tbcourse_text > p > span { color: #53c4c8; } .tbcourse_text > p > i { display: block; } .bgtop-cr1, .bgtop-cr2 { position: relative; margin-bottom: 50px; } .bgtop-cr1:before { position: absolute; width: 100%; height: 100%; left: 0; right: 0; content: ''; bottom: 50px; background: url("../img/web/startcourse-line-l.svg") no-repeat; background-size: 100%; } .nonebfr:before { display: none; } .ulrpt > ul > li { position: relative; margin-bottom: 84px; } .ulrpt > ul > li:last-child { margin-bottom: 0; } .ulrpt > ul > li:nth-child(odd):before, .ulrpt > ul > li:nth-child(even):before { position: absolute; width: 100%; height: 100%; left: 0; right: 0; content: ''; } .ulrpt > ul > li:nth-child(odd):before { bottom: 100px; background: url("../img/web/Put-skills-line1.svg") no-repeat; background-size: 100%; } .ulrpt > ul > li:nth-child(even):before { bottom: 130px; background: url("../img/web/Put-skills-line2.svg") no-repeat; background-size: 100%; } .boxcolor-course { display: inline-block; position: relative; margin-top: 20px; } .boxcolor-course > ul { padding: 0px 25px; } .boxcolor-course > ul > li > p { font-family: 'Aller'; font-size: 9pt; margin-bottom: 12px; display: block; color: #808285; } .boxcolor-course > ul > li > p > span { margin-right: 5px; display: inline-block; font-weight: bold; } .boxcolor-course > ul > li > p .cl1-cr { color: #7f58a4; } .boxcolor-course > ul > li > p .cl2-cr { color: #fbcb29; } .boxcolor-course > ul > li > p .cl3-cr { color: #53c4c8; } .boxcolor-course > ul > li > p .cl4-cr { color: #f9ad8b; } .arw-cors { display: flex; justify-content: space-between; position: relative; } .arw-cors span svg { width: 25px; height: 25px; } .sv2cu { transform: rotate(90deg); } .sv3cu { transform: rotate(-90deg); } .sv4cu { transform: rotate(180deg); } .clu1 { fill: #53C4C8; } .clu2 { fill: #f9ad8b; } .clu3 { fill: #fbcb29; } .clu4 { fill: #7f58a4; } .mgts { padding: 15px 0px; } .bgskill { background: url("../img/web/bgskill.svg")no-repeat; padding-bottom: 82px; background-size: cover; height: 100%; width: 100%; margin-top: 100px; } .hidetb { display: none; } .cnge-ap .bgtop-cr:before { background: url("../img/web/startcourse-line-l.svg") no-repeat; background-size: 100%; } .cnge-ap .bgtop-cr { background: none; height: auto; } .cnge-ap .bgskill { background-position: 0px 314px; padding-bottom: 0; } .ulrpt > ul > .whtbg-tw:nth-child(odd):before { bottom: 100px; background: url("../img/web/Put-skills-line-white.svg") no-repeat; background-size: 100%; } .lightbg { position: relative; margin-top: -62px; padding-top: 100px; } .lightbg:before { position: absolute; top: 0; content: ''; width: 100%; height: 100%; bottom: 0; background: url("../img/web/Put-skills-line-white1.svg") no-repeat; background-size: 100%; } .lgtbx, .fivec1, .fivebox { position: relative; } .lgtbx > h5 { position: relative; font-family: 'Nexa'; font-weight: bold; border-radius: 50%; display: block; text-align: center; font-size: 45pt; line-height: 121px; width: 120px; height: 120px; background: #fbcb29; color: #fff; } .fivec1 { padding: 108px 200px 182px 200px; background: url("../img/web/five-r.svg")no-repeat; background-position: right top; } .lgtbx > h5:before { position: absolute; right: 0; top: -68px; width: 56.25px; height: 100px; content: ''; background: url("../img/web/lgt.svg")no-repeat; } .fivec1 { padding-left: 200px; } .fivec2 { width: 50%; } .fivec1 .d-flex { align-items: center; } .text-lgt { padding-left: 30px; } .text-lgt h5 { font-family: 'Nexa'; color: #fff200; font-size: 15pt; font-weight: bold; display: block; margin-bottom: 15px; } .text-lgt p { color: #fff; font-size: 9pt; font-family: 'Aller'; margin-bottom: 15px; } /*.fivebox:before { position: absolute; top: -10px; left: -60px; content: ''; width: 100%; height: 381.27px; bottom: 0; background: url("../img/web/light-plug.svg") no-repeat; background-size: 100%; }*/ .topds { margin-top: -50px; } .nx_txt, .btnex { font-family: 'Nexa'; font-weight: bold; } .nx_txt { color: #fff; font-size: 17px; margin-bottom: 30px; } .btnex { display: block; } .btnex > a { background: #F9AD8B; color: #7F58A4; font-size: 16px; display: inline-block; padding: 12px 30px; border-radius: 50px; transition: all .5s ease-in-out; } .btnex > a:hover { background: #7F58A4; color: #fff; } .itl { max-height: 100%; max-width: 100%; text-align: left; margin: inherit; } .suptx { font-size: 8px; display: inline-block; } /*============================================================ Media Query ================================================================*/ @media only screen and (max-width: 640px) { .flagbx > ul { display: block !important; } .allflg { width: 100%; } .leftbf:before, .rightbf:before, .lineall { display: none; } .top-img { background-size: contain; } } @media only screen and (max-width: 768px) { .top1-main { padding-right: 0; } .leftimgall, .rightall-text { width: 100%; } .topall2 { padding-left: 0; } .imgleft1, .imgleft2 { padding-left: 0; height: 290px; margin-top: 0; background-position: center; } .topall1 { margin-top: 0; } .hdeign1, .small-para { padding-left: 0; } .small-para { margin-top: 20px; } .bg2-bx { margin-top: 0; } .imgleft3 { background: url("../img/web/date-a.svg")no-repeat; background-size: contain; height: 230px; margin-top: 20px; } .zindex { display: none; } .topall3 { padding-top: 0; padding-left: 0; } .pty-box { margin: 0px 0px; } .pty-box > h5 { font-size: 19pt; } .pty-box > span { font-size: 11pt; margin: 20px; display: block; } .wow { -webkit-animation-name: initial !important; animation-name: initial !important; } .learn-cnt ul { display: block !important; } .learn-cnt ul li { width: 100%; margin: 0; padding: 20px; } .learn-cnt { width: 100%; } .leftimg-lrn { display: none; } .box-dv { display: block !important; padding-right: 0; } .left-imgpo4 { padding-left: 0; } .leftimg-dv { width: 100%; height: 290px; } .text-page5 { margin-top: 0; } .right-cnt-dv { width: 100%; } .text-page5 > h2 { font-size: 16pt; } .text-page5 > p { font-size: 9pt; line-height: 19px; margin-top: 20px; } .page6 { margin-top: 50px; } .bg8-bx { padding: 20px 0; display: block; flex-wrap: wrap; } .box-dv-lft { padding-left: 0; } .bg8-bx h2 { font-size: 15pt; text-align: center; } .slider-main { width: 100%; } .text-page7 > h2 { font-size: 17pt; } .bx-cntus1, .contact-bx { width: 100%; } .bx-cntus1 { margin-bottom: 20px; } .contact-bx { display: block; flex-wrap: wrap; } .bdr-r { border-right: none; } .page7 { padding-bottom: 0px; } .ndbx > a { margin-top: 20px; } .scrollToTop { width: 30px; height: 30px; bottom: 42px; font-size: 12px; padding: 8px; line-height: 5px; right: 21px; } header { padding: 10px 10px; margin-top: 0px; box-shadow: 0px 7px 8px 0px #e2e2e2; } header .d-flex { display: block !important; } .menubar { display: block; } .logo { display: flex; justify-content: space-between; align-items: center; } .nvbx-top { position: fixed; right: -100%; top: 0; z-index: 9; bottom: 0; background: #fff; width: 250px; margin-top: 64px; overflow-y: auto; border: 1px solid #ddd; transition: all .5s ease-in-out; } .right0 { right: 0 !important; } .nvbx-top::-webkit-scrollbar { -webkit-appearance: none; } .nvbx-top::-webkit-scrollbar:vertical { width: 11px; } .nvbx-top::-webkit-scrollbar:horizontal { height: 11px; } .nvbx-top::-webkit-scrollbar-thumb { border-radius: 8px; border: 2px solid white; /* should match background, can't be transparent */ background-color: rgba(0, 0, 0, .5); } nav > ul > li > ul { position: relative; opacity: 1; height: auto; overflow: initial; transform: initial; width: 100%; } nav > ul > li { float: initial; } nav > ul > li > a { display: inline-block; position: relative; } .nonemd1 { display: none; } .righthd { display: flex; align-items: center; } .loginbx > a { background: #53c4c8; color: #fff; padding: 7px 12px; display: inline-flex; margin-right: 10px; font-size: 14px; border-radius: 2px; } /*===How-Tracked-Works====*/ .how-tracked-work-box > .d-flex { flex-wrap: wrap; margin-top: 10px; } .box-left-work > h1 { font-size: 13px; } .content-fst > h6 { font-size: 15px; } .content-fst p { font-size: 12px; } .odev-shape li:nth-child(odd), .odev-shape li:nth-child(even) { background: none; height: auto; padding-top: 0; margin-bottom: 0; margin-top: 50px; } .odev-shape li:nth-child(odd):before, .odev-shape li:nth-child(even):before { display: none; } .shph1 { font-size: 26px; position: relative; top: 0; } .fst-boxn .cricle-top { top: 0; position: relative; } .fst-boxn { width: 100%; } .img-fstn, .content-fst { float: initial; width: 100%; } .img-fstn { margin-bottom: 10px; } .toppara > p { font-size: 11px; } .mission-para > h5 { font-size: 22px; } .mission-para > p { font-size: 13px; padding: 10px; } .top-img { background-position: center; height: 218px; } .careerbx > h5 { padding: 20px 0px 0px 0px; font-size: 28px; } .teambx ul li { width: 100%; flex-wrap: wrap; } .team-img { display: block; margin: auto; } .team-text { width: 100%; text-align: center; } .team-text h3 { font-size: 22px; } .social-team { justify-content: center; } .box-joifd { padding: 10px; } .joinleft, .joinright { background: none; margin-top: 0; } .cloudbox { width: 300px; height: 200px; left: 0; position: relative; right: 0; margin: auto; margin-bottom: 20px; } .cloud-txt > p { font-size: 10pt; line-height: 17px; } .cloud-txt { margin-top: 0; width: 271px; } .whyjt { padding: 40px 0px 0px 0px; margin-bottom: 0; } .box-mfr { flex-wrap: wrap; padding: 0 !important; } .box-mfr > li { width: 100%; margin-bottom: 20px; } .cloud-txt { margin: auto; } .Comprehensive-box { background-size: cover; height: 100%; margin-bottom: 20px; padding-bottom: 20px; } .containbx { padding: 0px 10px; } .commain { flex-wrap: wrap; } .Comprehensive-right { width: 100%; padding-left: 0; } .Comprehensive-left-img { width: 100%; margin-top: 0; margin-bottom: 20px; } .Comprehensive-right > h1 { font-size: 15pt; margin-bottom: 20px; } .Comprehensive-right > p > span { font-size: 12pt; margin-bottom: 15px; } .takelogo > h2 { font-size: 12pt; } .wdc1 { flex-wrap: wrap; } .wdc1 li { width: 50%; border: 1px solid #ddd; } .logotop { margin-top: 40px; } .smtxt { margin: 10px; } .whitebox { padding: 10px; } .whitebox .d-flex { flex-wrap: wrap; } .leading-text, .leading-in, .leading-in1 { width: 100% !important; } .wtimg { margin: 20px 0px; } .leading-in > h4 { font-size: 13pt; margin-bottom: 20px; } .leading-img { width: 100%; } .equal-ca1, .equal-ca2, .equal-ca3, .equal-ca4, .equal-ca5 { background: none; } .mainbox-ca { padding-top: 80px; padding-bottom: 20px; } .equal-ca2 .mainbox-ca, .equal-ca3 .mainbox-ca { padding-top: 30px; } .pdbox-ac, .tiles-text, .tiles-images { width: 100%; } .headtxt > h4 { font-size: 14pt; } .technicians-box { margin: 50px 0px 0px 135px; padding: 20px; } .textimg img { width: 140px; } .equal-ca2 .headtxt > h4 { padding: 0px; } .srlbx { overflow: auto; } .tab-ca .nav-tabs { float: left; } .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { font-size: 13pt; } .tab-ca .nav-tabs .nav-link { font-size: 13pt; height: 100px; width: 100%; padding: 10px 20px; } .boxspance1 { padding: 0; margin-top: 0; } .boxspance1 > .d-flex, .expert-bpx .d-flex { flex-wrap: wrap; } .cloudr:after, .tiles-images > ul:before, .tiles-images > ul:after { display: none; } .tiles-images > ul { padding-left: 0; } .expert-main { padding-bottom: 0; padding-top: 20px; } .expert-bpx .d-flex .imgexpt { width: 100%; margin-bottom: 20px; } .expert-bpx .d-flex .content-expt { width: 100%; padding-left: 0; } .ceoboxmain { padding: 0; } .ceotext > p { font-size: 11pt; padding: 10px; line-height: 23px; } .pricetag-main { padding-top: 20px; } .pricebox { padding: 17px; width: 100%; margin: auto; } .proicebox { flex-wrap: wrap; } .proicebox > li { width: 100%; border-right: 1px solid #82AABD; padding-bottom: 40px; border-bottom: 5px solid #fff; } .text-pc { height: auto; padding: 50px 40px; } .wdb1 { width: 100%; } .mtfooter { padding: 100px 0px 0px 0px; overflow: hidden; } .ftbotm { margin-top: 100px; } .popicon { display: none; } .listcloum:hover .popicon { display: block; right: 0; } .box-po-logo { margin: 0 0px; } .sliderbx-ceo .slick-next { right: -57px; } .sliderbx-ceo .slick-prev { left: -48px; } .tiles-images > ul > li { width: 26%; } .ceo-bottom { padding: 20px; } .bggradnt { padding-bottom: 20px; } .daycrl > h5 { font-size: 11pt; } .daycrl > span { font-size: 16pt; } .Analytics-Career-colum, .tab-ca { width: 1000px; } .mtfooter { padding-bottom: 0; } .imgex-cnt { width: calc(100% - 130px); } .cricle-top { display: none; } .btmline { top: 0; } .joinright { padding-top: 0; } .filebtm p { font-size: 13pt; padding: 10px 0px 30px 0px; } .op-box h4 { font-size: 18pt; } .op-box ul { padding: 0px 20px; } .op-box ul li { flex-wrap: wrap; } .op-box ul li .cr-head, .op-box ul li .cr-lrn, .jobpop .modal-dialog { width: 100%; } .op-box ul li .cr-head { padding: 10px; text-align: center; } .op-box ul li .cr-lrn a { padding: 14px 32px; font-size: 12pt; } .whitebox1 { margin: 0 !important; } .cngdf { display: block !important; } .wtimg { margin: 20px 0px !important; } .cngdf .leading-in { padding: 0 !important; } .equal-ca1, .equal-ca4, .equal-ca5 { background: none !important; } .guidepd, .pdgdi { padding: 0; } .guide-wt { margin-top: 0; } .guidebg { background: none; height: auto; } .guide-woman { padding: 20px; background: linear-gradient(to bottom, #7f58a5 0%, #cc9999 154%); } .gtxt > p { width: 100%; font-size: 8pt; } .gtxt { top: 0; } .gtxt > h1 { font-size: 17pt; } .gdbox-g > h2 { font-size: 12pt; } .listguide { flex-wrap: wrap; } .listguide > li { border-right: none; border-bottom: 1px solid #53c4c8; margin-bottom: 10px; } .btn-guide > a { padding: 12px 17px; } .guideuser { margin-top: 60px; } .userguide { padding: 10px; flex-wrap: wrap; } .imggd-sv { margin: auto auto 50px auto; } .gdtext-sv { width: 100%; margin-bottom: 40px; } .trnglebx:before { top: -41px; left: 0; right: 0; } .trnglebx-sdw1:before { margin: auto; transform: rotate(90deg); } .userguide { margin-bottom: 20px; } .trnglebx-sdw2:before { bottom: -67px; top: initial !important; transform: rotate(90deg); margin: auto; } .trnglebx { padding: 20px; } } @media only screen and (max-width: 991px) { .linemission:before, .odev-shape1 li:nth-child(odd), .odev-shape1 li:nth-child(even), .odev-shape1 li:nth-child(odd):before, .odev-shape1 li:nth-child(even):before, .lastms:before { display: none; } .misstionbg { padding-top: 20px !important; } .neor { padding-top: 200px !important; } .daycrl { width: 100%; margin-top: 30px; } .pdbox, .lastms { padding: 0; } .misstionbg, .mission-text { padding: 20px !important; } .misstionbg { background: none; height: auto; background: linear-gradient(to bottom, #8463a9 0%, #90c8d2 154%); } .box-wt { width: 92%; margin: 20px auto; } .boxstory > p { padding: 0px; font-size: 9pt; } .imgsp > p { font-size: 9pt; } .odev-shape1 li .pdord { padding: 20px; top: 0; } .linemission { padding-top: 0; } .lastms > p { font-size: 15pt; line-height: 32px; padding: 10px; } .linemission1 { height: auto; background: none; margin-bottom: 100px; } .linemission1 .whitebox { width: 90%; } .StartCourse-bg { background: linear-gradient(to bottom, #7f58a5 0%, #cc9999 154%); height: auto; } .stcourse-text { margin-top: 15px; padding-right: 0; } .crstop { margin-top: 0; } .stcourse-img { margin-top: 10px; } .pror > h5, .ap-two > a > h5 { font-size: 11pt; } .pror > h5:before { font-size: 11pt; } .cnge-ap .bgtop-cr:before, .bgtop-cr:before { display: none; } .pror:before { display: block !important; } .ApplicationProcess-line { margin-top: 20px; margin-bottom: 80px; } .tbcourse-box { flex-wrap: wrap; } .tbcourse_img, .tbcourse-left, .tbcourse_text { width: 100%; } .tbcourse-left { padding-left: 0; } .tbcourse-line { margin-top: 30px; } .nbr { transform: initial; top: -26px; left: 0; right: 0; margin: auto; text-align: center; } .nbr span { display: inline-block; } .tbcourse-box { padding-top: 50px; } .ulrpt > ul > li:nth-child(odd):before, .ulrpt > ul > li:nth-child(even):before { display: none; } .lightbg:before { display: none; } .tbcourse-right { padding-right: 0; } .fivec1 { padding: 20px 20px 80px 20px; background: none; } .bgtop-cr { height: auto; margin-bottom: 50px; } } @media only screen and (min-width: 768px) and (max-width: 990px) { .odev-shape li:nth-child(odd), .odev-shape li:nth-child(even) { padding-top: 0 !important; } .fst-boxn .cricle-top { top: 1px !important; } .allflg { width: 280px; } } @media only screen and (min-width: 800px) and (max-width: 1000px) { .containbx { padding: 40px 10px !important; } .equal-ca1, .equal-ca2, .equal-ca3, .equal-ca4, .equal-ca5 { background: none !important; } .mainbox-ca { padding-top: 20px; } .tiles-images > ul { padding-left: 0; } .expert-bpx .d-flex { flex-wrap: wrap; } .expert-bpx .d-flex .imgexpt, .expert-bpx .d-flex .content-expt { width: 100% !important; } .expert-main { padding-bottom: 20px; padding-top: 40px; } .ceoboxmain { padding: 0 50px !important; } .wdb1 { width: 100%; } .mtfooter { padding: 50px 0px 0px 0px; } .ftbotm { margin-top: 30px; } .guide-woman { padding: 0px; } .guidepd { padding: 20px; } .guide-wt { margin-top: -100px; padding: 20px; } .gtxt { top: -22px; } .guideuser { margin-top: 50px; } .userguide { padding: 20px; } .gdtext-sv { width: 60%; } } @media only screen and (min-width: 800px) and (max-width: 1024px) { .guidepd { padding: 20px; } .guide-wt { margin-top: -100px; padding: 20px; } .gtxt { top: -22px; } .guideuser { margin-top: 50px; } .userguide { padding: 20px; } .gdtext-sv { width: 60%; } } @media only screen and (min-width: 990px) and (max-width: 1100px) { .whyjt { padding: 21px 0px 0px 0px; } .btmline { top: 20px; } .expert-main { padding-top: 75px; } .mtfooter { margin-top: -131px; padding: 200px 0px 0px 0px; } .odev-shape1 li:nth-child(odd), .odev-shape1 li:nth-child(even) { width: 100%; height: 164px; } .linemission { padding-top: 114px; } .odev-shape1 li:nth-child(odd):before, .lastms:before { left: -23px; } .odev-shape1 li:nth-child(even):before { right: -18px; } .odev-shape1 li:nth-child(odd):before, .odev-shape1 li:nth-child(even):before, .lastms:before { top: -42px; } .lastms { padding: 0px 100px; } .lastms > p { font-size: 20pt; margin-bottom: 48px; } .stcourse-text { padding-left: 50px; padding-right: 20px; } .ApplicationProcess-line { margin-top: 20px; } .bgtop-cr { height: 376px; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .top1-main { padding-right: 0; } .hdeign1, .small-para { padding-left: 0; } .leftimgall, .rightall-text { width: 50%; } .imgleft1, .imgleft2, .left-imgpo4, .leftimg-dv { height: 300px; } .topall1 { margin-top: 0; } .small-para { margin-top: 20px; } .bg2-bx { margin-top: 100px; } .topall2 { padding-left: 20px; } .leftimgall .zindex { width: 700px; height: 370px; } .topall3 { padding-top: 56px; padding-left: 77px; } .pty-box { margin: 10px 0px; } .page4 { margin-top: 0px; } .pty-box > h5 { font-size: 22pt; } .leftimg-lrn { width: 20%; } .learn-cnt { width: 80%; } .left-imgpo4 { margin-top: 0; padding-left: 0; } .box-dv { padding-right: 0; } .text-page5 { margin-top: 0; } .leftimg-dv, .right-cnt-dv { width: 50%; } .text-page5 > h2 { font-size: 19pt; } .page6 { margin-top: 50px; } .bg8-bx { padding: 20px; } .box-dv-lft { padding-left: 0; } .slider-main { width: 74%; } .bg8-bx h2 { font-size: 18pt; } .slide-content h3 { font-size: 12pt; } .text-page7 > h2 { font-size: 22pt; } .contact-bx { width: 100%; } .ndbx > a { margin-top: 20px; } nav > ul > li { margin: 8px 6px; } nav > ul > li > a { font-size: 11px; } header { padding: 10px 10px; margin-top: 0; } .box-left-work { width: 50%; } .box-right-work { width: 50%; } .fst-box { width: 70%; } .fst-boxn { width: 100%; } .content-fst { padding-right: 100px; } .shph1 { top: 6px; } .fst-boxn .cricle-top { top: 57px; } .odev-shape li:nth-child(odd), .odev-shape li:nth-child(even) { padding-top: 165px; } .cloudbox { left: 0; } .box-joifd { padding: 0 100px; } .guidebx ul li { width: 50%; } .containbx { padding: 0px 10px; } .Comprehensive-right { width: 50%; padding-left: 50px; } .Comprehensive-box { background-size: cover; height: 100%; } .pdbox-ac { width: 90%; margin: auto; } .Analytics-Career-colum, .tab-ca { width: 100%; } .popicon { display: none; } .listcloum:hover .popicon { display: block; right: 0; } .tiles-images > ul > li { width: 25%; } .cloudr:after { right: 0; } .equal-ca4 { background: url("../img/web/curveline4n2.svg") no-repeat; background-size: 100%; } .expert-bpx .d-flex .content-expt { padding-left: 50px; } .ceoboxmain { padding: 50px 50px; } .pricetag-main { padding-top: 73px; } .pctag > h5 { font-size: 12pt; } .equal-ca5 { background: url("../img/web/curveline5n2.svg") no-repeat; background-size: 100%; } .pricebox { width: 80%; } .pdbox { padding: 10px; } .mission-text { padding: 0px 200px; } .misstionbg { padding-top: 100px; } .box-wt { width: 90%; } } @media only screen and (max-width: 1024px) { .bg-main1, .bg-main2 { padding: 20px; background: linear-gradient(to bottom, #7f58a5 0%, #cc9999 100%) fixed; } /*.bg-main1:before { position: absolute; left: 0; right: 0; top: 0; bottom: 0; content: ''; background: url("../img/web/shadow-p.png")repeat; background-attachment: fixed; opacity: 0.4; }*/ .imgleft2 { background: url("../img/web/men2.svg")no-repeat; background-size: contain; } .hdeign1, .hdeign2, .hdeign3 { font-size: 11pt; line-height: 24px; } .small-para > p, .pathbox p { color: #fff; font-size: 8pt; } .proces-para p { color: #fff; font-size: 10pt; } .proces-para p i { color: #fff; } .d-for-data span { line-height: 20px; font-size: 9pt; color: #fff; margin-top: 20px; } .text-page6 h2 { color: #fff; font-size: 16pt; } .text-page6 > p { font-size: 9pt; color: #fff; line-height: 23px; } .bgbody { background-attachment: initial !important; } .log-form > label { font-size: 13px; line-height: 20px; } .twobox { flex-wrap: wrap; } .twobox .log-form { width: 100%; } .topds { margin-top: 0 !important; } } @media only screen and (min-width: 1024px) and (max-width: 1300px) { nav > ul > li { margin: 0px 2px; } .top1-main { padding-right: 20px; } .Comprehensive-right { width: 50%; } .Comprehensive-box { height: 100%; margin-bottom: 50px; } .Analytics-Career-colum, .tab-ca { width: 100%; } .pdbox-ac { width: 85%; } .equal-ca4 { background: url("../img/web/curveline4n3.svg") no-repeat; background-size: 100%; } .ceoboxmain { padding: 50px 100px; } .ceotext > p { width: 90%; } .equal-ca5 { background: url("../img/web/curveline5n3.svg") no-repeat; background-size: 100%; } .pctag > h5 { font-size: 13pt; } .pricetag-main { padding-top: 83px; } .pricebox { width: 80%; } .newtr { background: url("../img/web/curvelinen4-1.svg") no-repeat !important; background-size: cover !important; } } @media only screen and (min-width: 1024px) and (max-width: 1400px) { .cloudbox { left: 0; } } @media only screen and (min-width: 1200px)and (max-width: 1350px) { nav > ul > li > a { padding: 14px 15px; } .box-dv { padding-right: 100px; } .box1 .right-cnt-dv > h1, .box3 .right-cnt-dv > h1 { margin-top: 120px; } .box2 .social-md { left: 26px; } .box2 .right-cnt-dv > h1 { font-size: 16px; } .bx-cntus1 > p { padding: 20px 30px; } .fst-boxn { width: 70%; } .fst-boxn .cricle-top { top: 74px; } .zoombt .headbx > h4 { font-size: 12pt; } .headbx > h4 { font-size: 11pt; } } @media only screen and (min-width: 1350px)and (max-width: 1500px) { .box-dv { padding-right: 50px; } .top1-main { padding-right: 50px; } .topall3 { padding-top: 270px; } .mainbox-ca { padding-top: 151px; } .boxspance1 { margin-top: 0; } .expert-main { padding-top: 100px; } .ceoboxmain { padding: 50px 0px; } .hdeign1, .hdeign2, .hdeign3 { font-size: 16pt; } .pricetag-main { padding-top: 88px; } .pricebox { width: 80%; } .equal-ca4 { background: url("../img/web/curveline4n1.svg") no-repeat; background-size: 100%; } .equal-ca5 { background: url("../img/web/curveline5n1.svg") no-repeat; background-size: 100%; } .tiles-images > ul:before { bottom: 60px; } .Comprehensive-right { width: 50%; } .Comprehensive-box { height: 520px; } .cloudbox { left: 10px; } .newtr { background: url("../img/web/curvelinen4-2.svg") no-repeat !important; background-size: cover !important; } } @media only screen and (min-width: 1350px)and (max-width: 2000px) { .bx-cntus1 > p { padding: 20px 77px !important; } } @media only screen and (min-width: 1100px)and (max-width: 1500px) { .pdbox { padding: 10px 50px; } .linemission { padding-top: 131px; } .lastms { padding: 0px 200px; } .odev-shape1 li:nth-child(odd), .odev-shape1 li:nth-child(even) { height: 196px; } .hdeign1, .hdeign2, .hdeign3 { font-size: 15pt; } } @media only screen and (min-width: 1200px)and (max-width: 1290px) { .hdeign1, .small-para { padding-left: 50px; } .topall2 { padding-left: 100px; margin-top: 200px; } .zindex { width: 1300px !important; } .box-dv { padding-right: 50px !important; } .bx-cntus1 > p { padding: 20px 30px !important; } } @media only screen and (min-width: 1400px)and (max-width: 1500px) { .expert-main { padding-bottom: 230px; } .equal-ca5 { padding-bottom: 140px; } .cloud-txt { margin-top: -24px; } .cloudbox { left: 35px; } } @media only screen and (min-width: 1400px)and (max-width: 1600px) { .top1-main { padding-right: 108px; } } @media only screen and (min-width: 1600px)and (max-width: 5120px) { .bg-main1, .bg-main2 { background-size: 100%; } } @media only screen and (min-width: 1700px)and (max-width: 5120px) { .bg2-bx { margin-top: 600px; margin-bottom: 200px; } .cloudbox { left: 292px; } .fst-boxn .cricle-top { top: 123px; } .odev-shape li:nth-child(odd), .odev-shape li:nth-child(even) { padding-top: 235px; } .boxspance1 { margin-top: 0px; } .cngak .mainbox-ca { padding-top: 317px; } .cngak .pricetag-main { padding-top: 135px; } .cngak .equal-ca4 { background: url("../img/web/curveline4.svg") no-repeat; background-size: 100%; padding-bottom: 59px; } .odev-shape1 li .pdord { padding: 0px 400px; } .odev-shape1 li .pdord { top: 0; } .odev-shape1 li:nth-child(odd), .odev-shape1 li:nth-child(even) { height: 244px; } .imgsp > p { width: 70%; margin: 20px auto auto auto; } .lastms { padding: 0px 400px; } .lastms > p { margin-bottom: 150px; } .linemission { margin-bottom: 50px; } .Comprehensive-box { background-size: contain; } .bg-why { height: 925.88px; } } @media only screen and (min-width: 1700px)and (max-width: 2000px) { .Comprehensive-box { margin-bottom: 80px; } } @media only screen and (min-width: 768px) and (max-width: 1100px) { .bg-why { background-size: contain; height: 380px; } .cloud-txt, .joinleft { margin-top: 0; } .cloudbox { position: relative; justify-content: center; } .box-joifd { padding: 0; } .joinleft, .joinright { background: none; } .whyjt { padding: 20px; margin-bottom: 20px; } .cricle-top { display: none; } .joinright { padding-top: 0; } } @media only screen and (min-width: 1024px) and (max-width: 1100px) { .bg-why { height: 495px; } .box-mfr > li { width: 32%; } } @media only screen and (min-width: 1921px) and (max-width: 8000px) { body, .hdbx header { width: 1920px; margin: auto; } .sticky { width: 1920px; margin: auto; padding: 10px; } .logsec { width: 535px; } .takelogo > h2 { margin-top: 50px; } header { padding: 0; } .bgbody { background-size: contain; background-attachment: initial !important; align-items: baseline; } .imgleft1 { height: 950px; } } @media only screen and (min-width: 1921px) and (max-width: 8000px){ /*body, .hdbx header { width: 100%; margin: auto; }*/ } .checkbox { padding-left: 20px; } .checkbox label { display: inline-block; vertical-align: middle; position: relative; padding-left: 5px; } .checkbox label::before { content: ""; display: inline-block; position: absolute; width: 17px; height: 17px; left: 0; margin-left: -20px; border: 1px solid #cccccc; border-radius: 3px; background-color: #fff; -webkit-transition: border 0.15s ease-in-out, color 0.15s ease-in-out; -o-transition: border 0.15s ease-in-out, color 0.15s ease-in-out; transition: border 0.15s ease-in-out, color 0.15s ease-in-out; } .checkbox label::after { display: inline-block; position: absolute; width: 16px; height: 16px; left: 0; top: 0; margin-left: -20px; padding-left: 3px; padding-top: 1px; font-size: 11px; color: #555555; line-height: 1.4; } .checkbox input[type="checkbox"], .checkbox input[type="radio"] { opacity: 0; z-index: 1; cursor: pointer; } .checkbox input[type="checkbox"]:focus + label::before, .checkbox input[type="radio"]:focus + label::before { outline: thin dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } .checkbox input[type="checkbox"]:checked + label::after, .checkbox input[type="radio"]:checked + label::after { font-family: "FontAwesome"; content: "\f00c"; } .checkbox input[type="checkbox"]:indeterminate + label::after, .checkbox input[type="radio"]:indeterminate + label::after { display: block; content: ""; width: 10px; height: 3px; background-color: #555555; border-radius: 2px; margin-left: -16.5px; margin-top: 7px; } .checkbox input[type="checkbox"]:disabled, .checkbox input[type="radio"]:disabled { cursor: not-allowed; } .checkbox input[type="checkbox"]:disabled + label, .checkbox input[type="radio"]:disabled + label { opacity: 0.65; } .checkbox input[type="checkbox"]:disabled + label::before, .checkbox input[type="radio"]:disabled + label::before { background-color: #eeeeee; cursor: not-allowed; } .checkbox.checkbox-circle label::before { border-radius: 50%; } .checkbox.checkbox-inline { margin-top: 0; } .checkbox-primary input[type="checkbox"]:checked + label::before, .checkbox-primary input[type="radio"]:checked + label::before { background-color: #337ab7; border-color: #337ab7; } .checkbox-primary input[type="checkbox"]:checked + label::after, .checkbox-primary input[type="radio"]:checked + label::after { color: #fff; } .checkbox-danger input[type="checkbox"]:checked + label::before, .checkbox-danger input[type="radio"]:checked + label::before { background-color: #d9534f; border-color: #d9534f; } .checkbox-danger input[type="checkbox"]:checked + label::after, .checkbox-danger input[type="radio"]:checked + label::after { color: #fff; } .checkbox-info input[type="checkbox"]:checked + label::before, .checkbox-info input[type="radio"]:checked + label::before { background-color: #5bc0de; border-color: #5bc0de; } .checkbox-info input[type="checkbox"]:checked + label::after, .checkbox-info input[type="radio"]:checked + label::after { color: #fff; } .checkbox-warning input[type="checkbox"]:checked + label::before, .checkbox-warning input[type="radio"]:checked + label::before { background-color: #f0ad4e; border-color: #f0ad4e; } .checkbox-warning input[type="checkbox"]:checked + label::after, .checkbox-warning input[type="radio"]:checked + label::after { color: #fff; } .checkbox-success input[type="checkbox"]:checked + label::before, .checkbox-success input[type="radio"]:checked + label::before { background-color: #5cb85c; border-color: #5cb85c; } .checkbox-success input[type="checkbox"]:checked + label::after, .checkbox-success input[type="radio"]:checked + label::after { color: #fff; } .checkbox-primary input[type="checkbox"]:indeterminate + label::before, .checkbox-primary input[type="radio"]:indeterminate + label::before { background-color: #337ab7; border-color: #337ab7; } .checkbox-primary input[type="checkbox"]:indeterminate + label::after, .checkbox-primary input[type="radio"]:indeterminate + label::after { background-color: #fff; } .checkbox-danger input[type="checkbox"]:indeterminate + label::before, .checkbox-danger input[type="radio"]:indeterminate + label::before { background-color: #d9534f; border-color: #d9534f; } .checkbox-danger input[type="checkbox"]:indeterminate + label::after, .checkbox-danger input[type="radio"]:indeterminate + label::after { background-color: #fff; } .checkbox-info input[type="checkbox"]:indeterminate + label::before, .checkbox-info input[type="radio"]:indeterminate + label::before { background-color: #5bc0de; border-color: #5bc0de; } .checkbox-info input[type="checkbox"]:indeterminate + label::after, .checkbox-info input[type="radio"]:indeterminate + label::after { background-color: #fff; } .checkbox-warning input[type="checkbox"]:indeterminate + label::before, .checkbox-warning input[type="radio"]:indeterminate + label::before { background-color: #f0ad4e; border-color: #f0ad4e; } .checkbox-warning input[type="checkbox"]:indeterminate + label::after, .checkbox-warning input[type="radio"]:indeterminate + label::after { background-color: #fff; } .checkbox-success input[type="checkbox"]:indeterminate + label::before, .checkbox-success input[type="radio"]:indeterminate + label::before { background-color: #5cb85c; border-color: #5cb85c; } .checkbox-success input[type="checkbox"]:indeterminate + label::after, .checkbox-success input[type="radio"]:indeterminate + label::after { background-color: #fff; } .radio { padding-left: 20px; } .radio label { display: inline-block; vertical-align: middle; position: relative; padding-left: 5px; } .radio label::before { content: ""; display: inline-block; position: absolute; width: 17px; height: 17px; left: 0; margin-left: -20px; border: 1px solid #cccccc; border-radius: 50%; background-color: #fff; -webkit-transition: border 0.15s ease-in-out; -o-transition: border 0.15s ease-in-out; transition: border 0.15s ease-in-out; } .radio label::after { display: inline-block; position: absolute; content: " "; width: 11px; height: 11px; left: 3px; top: 3px; margin-left: -20px; border-radius: 50%; background-color: #555555; -webkit-transform: scale(0, 0); -ms-transform: scale(0, 0); -o-transform: scale(0, 0); transform: scale(0, 0); -webkit-transition: -webkit-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); -moz-transition: -moz-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); -o-transition: -o-transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); transition: transform 0.1s cubic-bezier(0.8, -0.33, 0.2, 1.33); } .radio input[type="radio"] { opacity: 0; z-index: 1; cursor: pointer; } .radio input[type="radio"]:focus + label::before { outline: thin dotted; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } .radio input[type="radio"]:checked + label::after { -webkit-transform: scale(1, 1); -ms-transform: scale(1, 1); -o-transform: scale(1, 1); transform: scale(1, 1); } .radio input[type="radio"]:disabled { cursor: not-allowed; } .radio input[type="radio"]:disabled + label { opacity: 0.65; } .radio input[type="radio"]:disabled + label::before { cursor: not-allowed; } .radio.radio-inline { margin-top: 0; } .radio-primary input[type="radio"] + label::after { background-color: #337ab7; } .radio-primary input[type="radio"]:checked + label::before { border-color: #337ab7; } .radio-primary input[type="radio"]:checked + label::after { background-color: #337ab7; } .radio-danger input[type="radio"] + label::after { background-color: #d9534f; } .radio-danger input[type="radio"]:checked + label::before { border-color: #d9534f; } .radio-danger input[type="radio"]:checked + label::after { background-color: #d9534f; } .radio-info input[type="radio"] + label::after { background-color: #5bc0de; } .radio-info input[type="radio"]:checked + label::before { border-color: #5bc0de; } .radio-info input[type="radio"]:checked + label::after { background-color: #5bc0de; } .radio-warning input[type="radio"] + label::after { background-color: #f0ad4e; } .radio-warning input[type="radio"]:checked + label::before { border-color: #f0ad4e; } .radio-warning input[type="radio"]:checked + label::after { background-color: #f0ad4e; } .radio-success input[type="radio"] + label::after { background-color: #5cb85c; } .radio-success input[type="radio"]:checked + label::before { border-color: #5cb85c; } .radio-success input[type="radio"]:checked + label::after { background-color: #5cb85c; } input[type="checkbox"].styled:checked + label:after, input[type="radio"].styled:checked + label:after { font-family: 'FontAwesome'; content: "\f00c"; } input[type="checkbox"] .styled:checked + label::before, input[type="radio"] .styled:checked + label::before { color: #fff; } input[type="checkbox"] .styled:checked + label::after, input[type="radio"] .styled:checked + label::after { color: #fff; } @charset "UTF-8"; .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); transform: translateY(-15px); } } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px); } } .bounce { -webkit-animation-name: bounce; animation-name: bounce; } @-webkit-keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } @keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } .flash { -webkit-animation-name: flash; animation-name: flash; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes pulse { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .pulse { -webkit-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes shake { 0%, 100% { -webkit-transform: translateX(0); transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translateX(-10px); transform: translateX(-10px); } 20%, 40%, 60%, 80% { -webkit-transform: translateX(10px); transform: translateX(10px); } } @keyframes shake { 0%, 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 20%, 40%, 60%, 80% { -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px); } } .shake { -webkit-animation-name: shake; animation-name: shake; } @-webkit-keyframes swing { 20% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes swing { 20% { -webkit-transform: rotate(15deg); -ms-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); -ms-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); -ms-transform: rotate(-5deg); transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } } .swing { -webkit-transform-origin: top center; -ms-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing; } @-webkit-keyframes tada { 0% { -webkit-transform: scale(1); transform: scale(1); } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% { -webkit-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } @keyframes tada { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); -ms-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); -ms-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); -ms-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% { -webkit-transform: scale(1) rotate(0); -ms-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } .tada { -webkit-animation-name: tada; animation-name: tada; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble { 0% { -webkit-transform: translateX(0%); transform: translateX(0%); } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg); } 30% { -webkit-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg); } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg); } 60% { -webkit-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg); } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg); } 100% { -webkit-transform: translateX(0%); transform: translateX(0%); } } @keyframes wobble { 0% { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); -ms-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg); } 30% { -webkit-transform: translateX(20%) rotate(3deg); -ms-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg); } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); -ms-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg); } 60% { -webkit-transform: translateX(10%) rotate(2deg); -ms-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg); } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); -ms-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg); } 100% { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } } .wobble { -webkit-animation-name: wobble; animation-name: wobble; } @-webkit-keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05); } 70% { -webkit-transform: scale(.9); transform: scale(.9); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(.3); -ms-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } 70% { -webkit-transform: scale(.9); -ms-transform: scale(.9); transform: scale(.9); } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); transform: translateX(10px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); -ms-transform: translateX(-30px); transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); transform: translateY(10px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceOut { 0% { -webkit-transform: scale(1); transform: scale(1); } 25% { -webkit-transform: scale(.95); transform: scale(.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); } } @keyframes bounceOut { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 25% { -webkit-transform: scale(.95); -ms-transform: scale(.95); transform: scale(.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(.3); -ms-transform: scale(.3); transform: scale(.3); } } .bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } } @keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px); } } @keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } } @keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px); } } @keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px); } } @keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } } @keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } .animated.flip { -webkit-backface-visibility: visible; -ms-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: flip; animation-name: flip; } @-webkit-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } @keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); -ms-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); -ms-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } .flipInX { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInX; animation-name: flipInX; } @-webkit-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); transform: perspective(400px) rotateY(-10deg); } 70% { -webkit-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); } 100% { -webkit-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } } @keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); -ms-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); -ms-transform: perspective(400px) rotateY(-10deg); transform: perspective(400px) rotateY(-10deg); } 70% { -webkit-transform: perspective(400px) rotateY(10deg); -ms-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); } 100% { -webkit-transform: perspective(400px) rotateY(0deg); -ms-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } } .flipInY { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInY; animation-name: flipInY; } @-webkit-keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } } @keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } } .flipOutX { -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; } @-webkit-keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } } @keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); -ms-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateY(90deg); -ms-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } } .flipOutY { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipOutY; animation-name: flipOutY; } @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); -ms-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); -ms-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } .lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } @-webkit-keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } } @keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } } .lightSpeedOut { -webkit-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateIn { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); -ms-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); -ms-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes slideInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes slideInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown; } @-webkit-keyframes slideInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes slideInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft; } @-webkit-keyframes slideInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes slideInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; } @-webkit-keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft; } @-webkit-keyframes slideOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes slideOutRight { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight; } @-webkit-keyframes slideOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes slideOutUp { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp; } @-webkit-keyframes hinge { 0% { -webkit-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } @keyframes hinge { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); -ms-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); -ms-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); -ms-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } .hinge { -webkit-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } @keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); -ms-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } .rollIn { -webkit-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } @keyframes rollOut { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); -ms-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } .rollOut { -webkit-animation-name: rollOut; animation-name: rollOut; } .jnotify-container{position:fixed;top:0;left:0;width:100%;z-index:100000}.jnotify-container .jnotify-notification{position:relative}.jnotify-container .jnotify-notification .jnotify-background{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#e3f0db;filter:alpha(opacity=90);-moz-opacity:.9;opacity:.9;z-index:1}.jnotify-container .jnotify-notification a.jnotify-close,.jnotify-container .jnotify-notification a.jnotify-close:focus,.jnotify-container .jnotify-notification a.jnotify-close:hover,.jnotify-container .jnotify-notification a.jnotify-close:link,.jnotify-container .jnotify-notification a.jnotify-close:visited{position:absolute;top:2px;right:5px;padding:0 5px;font:700 1.4em Arial,Helvetica,sans-serif;line-height:1em;color:#567b1b;text-decoration:none;z-index:3;cursor:pointer}.jnotify-container .jnotify-notification .jnotify-message{position:relative;z-index:2;padding:20px;text-align:center;color:#567b1b;font:700 1.4em Arial,Helvetica,sans-serif;line-height:1.2em}.jnotify-container .jnotify-notification .jnotify-message *{font-size:1em}.jnotify-container .jnotify-notification-error .jnotify-background{background-color:#d79eac}.jnotify-container .jnotify-notification-error .jnotify-close,.jnotify-container .jnotify-notification-error .jnotify-message{color:#a72947!important}.jnotify-container .jnotify-notification-warning .jnotify-background{background-color:#fff7d1}.jnotify-container .jnotify-notification-warning .jnotify-close,.jnotify-container .jnotify-notification-warning .jnotify-message{color:#c2a928!important} /*@ sourceURL=/css/notify.css */ .notify{position:fixed;top:10px;left:10px;-moz-box-sizing:border-box;box-sizing:border-box;width:350px}.notify-bottom-right,.notify-top-right{left:auto;right:10px}.notify-bottom-center,.notify-top-center{left:50%;margin-left:-175px}.notify-bottom-center,.notify-bottom-left,.notify-bottom-right{top:auto;bottom:10px}@media (max-width:479px){.notify{left:10px;right:10px;width:auto;margin:0}}.notify-message{position:relative;cursor:pointer}.notify .alert-default{background:#fff;border:1px solid #e5e5e5}