/* Future Facilities Built by Applecado Ltd with Muze Creative's Design 2015-11 */ body { scroll-behavior: smooth; background:#f4f7f9; color:#333333; font-family:'robotolight', Arial, sans-serif; font-style: normal; font-weight: 100; font-size:1em; margin:0; padding:0; overflow-x:hidden; letter-spacing:0.075em; } .body-wrapper { position:relative; top:0px; left:0px; z-index:2; width:100%; height:100%; overflow:hidden; background:#f4f7f9; } .site-wrapper { position:relative; top:0px; right:0px; z-index:3; width:100%; height:100%; overflow:hidden; background:#f4f7f9; box-shadow:rgba(0,0,0,0.3) 1px 0px 5px } .mobile-navigation { position:absolute; top:0px; right:0px; z-index:1; width:230px; overflow:hidden; background:#222b3c; } a { color:#6b787d; text-decoration:none; -webkit-transition:.2s; transition:.2s; } a:hover { color:#333333; text-decoration:underline; } a:hover img , a.fade:hover { opacity:0.65; filter: alpha(opacity = 65); zoom: 1; } a.white { color:#fff; text-decoration:none; } a.white:hover { color:#fff; text-decoration:underline; } a.cover-link { position:absolute; top:0px; left:0px; width:100%; height:100%; z-index:1000; } a.cover-link:hover { background:rgba(255,255,255,0.25); } p { font-size:18px; line-height:1.4em; margin:0 0 20px; padding:0; } p.small { font-size:16px; } p.smaller { font-size:14px; } p.intro { font-size:22px; } p.date { font-size:14px; } p.tiny { font-size:11px; color:#203254; } p.light { color:#203254; } img { vertical-align:middle; max-width:100%; } blockquote { background:#6a747c; color:#fff; font-size:26px; font-style:italic; margin:0 0 20px; padding:30px; line-height:1.4em; } strong { font-family:'robotobold', arial, sans-serif; font-weight:normal; } ul, ol { margin:0 0 20px 20px; padding:0 0 0 18px; font-size:18px; line-height:1.8em; list-style:none; } ul li, ol li { padding:0; margin:0; } ul li:before, ol li:before { content:" "; padding:0; margin:0; background:url(/assets/images/bullet.png) left center no-repeat; padding-left:16px; line-height:1em; } .large-text p, .large-text ul, .large-text ol { font-size:22px; } hr { width:162px; margin:0 0 25px; border:0; border-bottom:2px solid #60c369; height:1px; } .tcenter hr, hr.tcenter { margin:0 auto 25px; } hr.thin { margin-top:10px; margin-bottom:10px; } hr.small { width:80px; } hr.low { margin-bottom:20px; } hr.tall { margin-bottom:50px; } h1, p.h1, h1 a, p.h1 a { margin:0 0 20px 0; font-size:60px; line-height:1.2em; color:#231f20; text-decoration: none; text-transform:none; font-style:normal; font-family:'robotobold', arial, sans-serif; font-weight:normal; } h2, p.h2, h2 a, p.h2 a { margin:0 0 20px 0; font-size:36px; /*42px;*/ line-height:1.2em; color:#231f20; text-decoration: none; text-transform:none; font-style:normal; font-family:'robotobold', arial, sans-serif; font-weight:normal; } h2.small, p.h2.small, h2.small a, p.h2.small a { font-size:36px; text-transform:none; font-weight:400; } h3, p.h3, h3 a, p.h3 a { margin:0 0 20px 0; font-size:26px; line-height:1.2em; color:#231f20; text-decoration: none; /*text-transform:uppercase;*/ font-style:normal; font-family:'robotobold', arial, sans-serif; font-weight:normal; } h3.small, p.h3.small, h3.small a, p.h3.small a { font-size:26px; text-transform:none; font-family:'robotoregular', arial, sans-serif; font-weight:normal; } h4, p.h4, h4 a, p.h4 a { margin:0 0 20px 0; font-size:20px; line-height:1.3em; color:#231f20; text-decoration: none; text-transform:uppercase; font-style:normal; font-family:'robotobold', arial, sans-serif; font-weight:normal; } h5, p.h5, h5 a, p.h5 a { margin:0 0 10px 0; font-size:18px; line-height:1.3em; color:#231f20; text-decoration: none; text-transform:none; font-style:normal; font-weight:normal; } .bggd span { display:inline-block; width:40px; height:40px; background-position: left center; background-repeat:no-repeat; padding-right:5px; background-size:32px 32px; vertical-align:middle; margin-top:-3px; } .bggd.sol-6sigmadcx span { display:inline-block; width:40px; height:40px; background:url(/assets/images/icon-database.png) left center no-repeat; padding-right:5px; background-size:32px 32px; vertical-align:middle; margin-top:-3px; } .bggd.sol-6sigmaet span { display:inline-block; width:40px; height:40px; background:url(/assets/images/icon-plug.png) left center no-repeat; padding-right:5px; background-size:32px 32px; vertical-align:middle; margin-top:-3px; } .tright { text-align:right; } .tcenter { text-align:center; } .full-width { width:100%; } .shallow { margin-bottom:0 !important; } .semi-shallow { margin-bottom:15px !important; } .almost-shallow { margin-bottom:5px !important; } .tall { margin-bottom:50px !important; } .extra-top { margin-top:30px !important; } .tall-top { margin-top:50px !important; } .small-top-margin { margin-top:10px !important; } .not-desktop { display:none; } .v-align-container { position:relative; display:block; } .v-align { display:block; position:relative; top:50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .dull { color:#e1e1e5; } .padded-h { padding:0 70px; } img.thumb { border:2px solid #e1e1e5; } .fleft { float:left; } img.fleft { margin:0px 20px 5px 0; } .fright { float:right; } img.fright { margin:0px 0 5px 20px; } .outer { float:left; width:100%; overflow:hidden; margin:0; } .outer , .padded , .contained { *zoom: 1; margin-bottom:30px; } .padded:before , .outer:before , .contained:before { content: " "; display: table; } .padded:after , .outer:after , .contained:after { content: " "; display: table; clear: both; } .padded { margin-bottom:0; } .outer-container { padding:0; position:relative; z-index:10; } .contained.tall { margin-bottom:80px; } .contained.twenty { margin-bottom:20px; } /* - */ .button, form button { color:#333333; font-family:'robotolight', Arial, sans-serif; font-size:14px; display:inline-block; border:2px solid #333333; background:transparent; padding:5px 20px; margin:0; line-height:27px; cursor:pointer; text-decoration:none; text-transform:uppercase; border-radius:5px; } .button.dark, form button.dark { color:#231f20; border-color:#231f20; } .button.light, form button.light { color:#fff; border-color:#fff; background:#818591; } .button.white, form button.white { color:#666; border-color:#fff; background:#fff; } .button.clear, form button.clear { color:#333333; border-color:#333333; } .button.clear.light, form button.clear.light { color:#fff; border-color:#fff; background:transparent; } .button.large, form button.large { line-height:40px; font-size:20px; } .button:hover, form button:hover { color:#60c369; text-decoration:none !important; border-color:#60c369; } .button.dark:hover, form button.dark:hover { color:#60c369; border-color:#60c369; } /* { color:#da0404; border-color:#da0404; } */ .button.light:hover, form button.light:hover { color:#60c369; border-color:#60c369; background:#fff; } .button.white:hover, form button.white:hover { color:#60c369; border-color:#60c369; background:#fff; } .button.clear:hover, form button.clear:hover { color:#60c369; border-color:#60c369; } /* - */ .mobile-nav-toggle { display:none; position:absolute; right:0px; top:0px; font-size:2em; line-height:1em; width:40px; height:35px; padding-top:5px; } .mobile-nav-toggle span { width:86%; margin:0 7% 5px; background:#fff; height:6px; float:left; } .mobile-nav-toggle:hover { color:#fff; } .mobile-nav-toggle:hover span { background:rgba(255,255,255,0.5); } .mobile-sub-nav-toggle { display:none; font-size:2em; line-height:1em; width:40px; height:35px; padding-top:5px; margin:0 auto; } .mobile-sub-nav-toggle span { width:86%; margin:0 7% 5px; background:#636465; height:6px; float:left; } .mobile-sub-nav-toggle:hover { color:#636465; } .mobile-sub-nav-toggle:hover span { background:rgba(0,0,0,0.5); } .mobile-navigation hr { display:none; } .mobile-navigation ul { margin:0; padding:0; list-style:none; float:left; overflow:hidden; width:100%; } .mobile-navigation ul li { margin:0; padding:0; display:block; width:100%; position:relative; float:left; overflow:hidden; border-bottom:1px solid #203254; } .mobile-navigation ul li:before { display:none; } .mobile-navigation ul li ul { margin:0; padding:0; width:100%; border:0; } .mobile-navigation ul li.zipped > ul { display:none; } .mobile-navigation ul li.unzipped > ul { display:block; } .mobile-navigation ul li ul li { border:0; border-top:1px solid #203254; } .mobile-navigation ul li a { width:90%; float:left; padding:10px 6%; color:#fff; font-size:16px; line-height:26px; text-transform:uppercase; } .mobile-navigation ul li a:hover , .mobile-navigation ul li a.active { text-decoration:none; color:#60c369; } .mobile-navigation ul li a .sub, .mobile-navigation ul li a .rule { display:none; } .mobile-navigation ul li ul li a { width:85%; float:left; padding:10px 8% 10px 16%; font-size:14px; color:#b8bac1; } .mobile-navigation ul li ul li ul li a { width:80%; float:left; padding:10px 8% 10px 24%; font-size:14px; color:#b8bac1; } .mobile-navigation ul li ul li ul li ul li a { width:75%; float:left; padding:10px 8% 10px 32%; font-size:14px; color:#b8bac1; } .mobile-navigation ul li a.expander { position:absolute; top:0px; right:0px; z-index:10; background:none; height:40px; width:40px; padding:0; } .mobile-navigation ul li a.expander .c { background:rgba(255,255,255,0.2); width:30px; height:30px; border-radius:100%; position: absolute; top:5px; right:5px; z-index:10; padding:0; text-decoration:none; -webkit-transition:.4s; transition:.4s; } .mobile-navigation ul li a.expander:hover .c { background:rgba(255,255,255,0.4); } .mobile-navigation ul li a.expander .h { position:absolute; top:50%; left:50%; width:14px; height:2px; background:rgba(255,255,255,0.5); border:0; margin:-1px 0 0 -7px; } .mobile-navigation ul li a.expander .v { position:absolute; top:50%; left:50%; width:2px; height:14px; background:rgba(255,255,255,0.5); border:0; margin:-7px 0 0 -1px; -webkit-transition:.4s; transition:.4s; } .mobile-navigation ul li.unzipped > a.expander .v { height:2px; background:rgba(255,255,255,0); margin-top:-1px; } /* - */ .header-bg { position:absolute; top:0px; left:0px; width:100%; height:300px; z-index:10; background:url(/assets/photos/header-bg.jpg) center center no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } /* - */ .header { color:#fff; padding:20px 0; z-index:10000; position:fixed; top:0px; right:0px; width:100%; -webkit-transition: 0.4s linear; -moz-transition: 0.4s linear; -ms-transition: 0.4s linear; -o-transition: 0.4s linear; transition: 0.4s linear; } .header .logo-link { text-decoration:none; } .header .logo-full { height:100%; float:left; position:absolute; left:0px; top:0px; -webkit-transition: 0.4s linear; -moz-transition: 0.4s linear; -ms-transition: 0.4s linear; -o-transition: 0.4s linear; transition: 0.4s linear; } .header .navigation { margin:0; padding:0; text-align:right; list-style:none; line-height:70px; -webkit-transition: 0.4s linear; -moz-transition: 0.4s linear; -ms-transition: 0.4s linear; -o-transition: 0.4s linear; transition: 0.4s linear; } .header .navigation li { margin:0; padding:0; display:inline-block; position:relative; } .header .navigation li:before { display:none; } .header .navigation li a { color:#fff; margin:0 5px; padding:0 10px; display:inline-block; text-transform:uppercase; font-size:16px; position:relative; z-index:51; -webkit-transition:0s; transition:0s; } .header .navigation li a:hover , .header .navigation li:hover a { color:#fff; text-decoration:underline; } .header .navigation li a.active { color:#fff; text-decoration:underline; } .header .navigation li a .sub, .header .navigation li a .rule { display:none; } .header .navigation li ul { display:none; margin:0 auto; padding:5px 0; position:absolute; top:60px; left:50%; margin:0 0 0 -77px; min-width:154px; z-index:50; white-space:nowrap; background:#e1e1e5; text-align: center; } .header .navigation li ul:before { content:" "; position:absolute; top:-6px; left:50%; margin-left:-8px; width:16px; height:7px; background:url(/assets/images/nav-tick.png) left top no-repeat; z-index:70; } .header .navigation li ul li { margin:0; padding:0; display:block; text-decoration:center; } .header .navigation li:hover ul li a , .header .navigation li ul li a { color:#203254; text-transform:none; text-decoration:none; } .header .navigation li ul li a:hover { color:#203254; text-decoration:underline; } .header .navigation li:hover a { z-index:61; } .header .navigation li:hover ul { display:block; z-index:60; } .scrolled .header { background:rgba(32,50,84,0.9); padding:5px 0; } .scrolled .header .logo-full { /*max-height:40px; margin-top:2px;*/ } .scrolled .header .navigation { line-height:44px; } .scrolled .header .navigation li { } .scrolled .header .navigation li a { } .scrolled .header .navigation li ul { top:44px; } /* - */ .page-title { padding:115px 0 40px; } .page-title h1 { color:#fff; text-align:center; z-index:1000; position:relative; } .page-title hr { margin-bottom:0; } .page-title p { margin-top:30px; } .page-title img { margin-top:30px; } .home .page-title { margin-top:60px; } .home .page-title h1 { font-size:48px; margin-bottom:35px; } .home .page-title p { padding:0 150px; } /* - */ .content { background:#fff; padding:60px 0 40px; } /* - */ .footer { background:#fff; padding:50px 0; color:#333333; } .footer p.small { color:#203254; font-size:11px; margin:0; } .footer p.small a { color:#203254; } .footer a { color:#333333; } .footer a.eml { padding-left:40px; background:url(/assets/images/icon-email.png) left center no-repeat; line-height:20px; display:inline-block; } .footer a.ico { display:inline-block; margin-right:8px; } .footer ul.columised-nav { margin:0 0 0 40px; padding:0; list-style:none; display:inline-block; text-align:left; vertical-align:top; } .footer ul.columised-nav li { white-space:nowrap; line-height:1.2em; padding:4px 0; } .footer ul.columised-nav li:before { display:none; } .footer ul.columised-nav li.title { font-size:16px; text-transform:uppercase; font-family:'robotobold', arial, sans-serif; font-weight:normal; padding-bottom:10px; } .footer ul.columised-nav li a { font-size:14px; color:#333333; } /* - */ .info { } .info p { line-height:1.1em; } .info p.grey-title { font-size:28px; } .info p.grey-title-big { font-size:32px; font-family:'robotobold', arial, sans-serif; font-weight:normal; } .info p.large { font-size:64px; font-family:'robotobold', arial, sans-serif; font-weight:normal; } .info p.blue { color:#005bac; } /* - */ .team-member-container { margin-top:30px; float:left; width:100%; overflow:hidden; } .team-member-box { display:inline-block; width:255px; margin:20px 0 0 15px; } .team-member-box:nth-child(4n+1) { margin-left:0; } /* - */ .reseller-container { margin-top:30px; float:left; width:100%; overflow:hidden; } .reseller-box { display:inline-block; width:255px; margin:20px 0 0 15px; vertical-align:top; } .reseller-box:nth-child(4n+1) { margin-left:0; } /* - */ .logos { line-height:80px; } .logos img { margin:0 10px 20px; vertical-align:middle; } /* - */ .box { } .box.light-grey { background:#f4f7f9; } .box.dark { background:#203254; color:#fff; } .box.dark a { color:#fff; } .box.dark h1, .box.dark p.h1 { color:#fff; } .box.dark h2, .box.dark p.h2 { color:#fff; } .box.dark h3, .box.dark p.h3 { color:#fff; } .box.dark h4, .box.dark p.h4 { color:#fff; } .box.dark h5, .box.dark p.h5 { color:#fff; } .box .padded { } .box.solution { border-top:5px solid #fff; background-color:#203254; background-position:center top; background-repeat:no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .box.solution hr { border-color:#fff; } .box.home-cta { border-top:5px solid #fff; background-color:#203254; background-position:center top; background-repeat:no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; position:relative; } .box.home-cta hr { border-color:#fff; } .box.home-cta a.cover { position:absolute; top:0px; left:0px; width:100%; height:100%; } .box.home-cta a.cover:hover { background:rgba(255,255,255,0.25); } /* - */ .swipe { background:#ff0000; padding:70px 0 50px; } .swipe.slimmer { padding:50px 0 30px; } .swipe.slim { padding:30px 0; } .swipe.white { background:#fff; } .swipe.light-grey { background:#f4f7f9; } .swipe.green { background:#0c9e0c; color:#fff; } .swipe.green h2, .swipe.green p.h2 { color:#fff; } .swipe.dark { background:#203254; color:#fff; } .swipe.dark h2, .swipe.dark p.h2 { color:#fff; } .swipe.big-nav { background:#e1e1e5; color:#bdbdc4; padding:0; } .swipe.big-nav ul { list-style:none; margin:0; padding:0; text-align:center; } .swipe.big-nav ul li { display:inline-block; margin:0; padding:0; } .swipe.big-nav ul li:before { display:none; } .swipe.big-nav ul li a { display:inline-block; border-top:5px solid #60c369; width:250px; margin:0 8px; text-decoration:none; padding:5px 0 10px; color:#bdbdc4; } .swipe.big-nav ul li a span { display:block; } .swipe.big-nav ul li a span.title { font-size:22px; font-family:'robotobold', arial, sans-serif; font-weight:normal; margin:14px 0 10px 0; } .swipe.big-nav ul li a:hover , .swipe.big-nav ul li a.active { background:#203254; } .swipe.big-nav ul li a:hover span , .swipe.big-nav ul li a.active span { color:#fff; } .swipe.big-nav.solutions { } .swipe.big-nav.solutions ul { } .swipe.big-nav.solutions ul li { } .swipe.big-nav.solutions ul li:before { display:none; } .swipe.big-nav.solutions ul li a { width:340px; margin:0 8px; text-decoration:none; padding:5px 0 10px; color:#bdbdc4; } .swipe.big-nav.solutions ul li a span { } .swipe.big-nav.solutions ul li a span.sub { font-size:20px; } .swipe.big-nav.solutions ul li a span.title { font-size:36px; font-family:'robotobold', arial, sans-serif; font-weight:normal; margin:0 0 5px 0; } .swipe.big-nav.solutions ul li a span.rule { width:64px; border-top:2px solid #fff; margin:2px auto 13px; } .swipe.big-nav.solutions ul li a:hover , .swipe.big-nav.solutions ul li a.active { } .swipe.big-nav.solutions ul li a:hover span , .swipe.big-nav.solutions ul li a.active span { } /* - */ .testimonial-slider-wrap { margin:30px 0 0; padding:0; float:left; } .testimonial-slider { margin:0; padding:0; list-style:none; float:left; width:100%; overflow:hidden; } .testimonial-slider li { margin:0; padding:0; text-align:center; } .testimonial-slider li:before { display:none; } .testimonial-slider li p.quote { font-size:24px; color:#333333; } .testimonial-slider li p.credit { font-size:18px; color:#203254; } .testimonial-slider li p.credit strong { font-size:24px; color:#333333; } .bx-controls { width:100%; text-align:center; margin:10px 0; } .bx-controls .bx-pager-item { display:inline-block; } .bx-controls a { display:inline-block; overflow:hidden; width:15px; height:15px; text-indent:-10000px; background:url(/assets/images/slider-blobs.png) left top no-repeat; margin:0 2px; -webkit-transition:0s; transition:0s; } .bx-controls a:hover , .bx-controls a.active { background-position:left bottom; } /* - */ .solutions-sub { padding-top:0; } .solutions-sub .primary-image { margin-top:-100px; } /* - */ .screenshot-rotator { width:1064px; height:804px; display:block; margin:40px auto 0; position:relative; } .screenshot-rotator .overlay { width:1064px; height:804px; margin:0; padding:0; display:block; position:absolute; z-index:15; background:url(/assets/images/home-monitor-wrap.png) center top no-repeat; background-size:100%; } .screenshot-rotator .screenshot-wrap { width:978px; height:552px; margin:0; padding:0; list-style:none; z-index:14px; position:absolute; top:43px; left:43px; overflow:hidden; background:#535353; } .screenshot-rotator .screenshots { width:978px; height:552px; margin:0; padding:0; list-style:none; z-index:14px; position:absolute; top:0px; left:0px; overflow:hidden; } .screenshot-rotator .screenshots li:before { display:none; } .screenshot-rotator .screenshots li { width:100%; height:100%; position:absolute; top:0px; left:0px; background-position:center center; background-repeat:no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } /* - */ p.big-infobox { font-size:64px; line-height:52px; overflow:hidden; display:inline-block; font-family:'robotobold', arial, sans-serif; font-weight:normal; text-align:left; color:#203254; } p.big-infobox span.figure { float:left; } p.big-infobox span.title { float:left; font-size:26px; display:inline; font-weight:400; text-transform:uppercase; line-height:26px; } p.big-infobox span.title span { display:block; font-family:'robotoregular', arial, sans-serif; font-weight:normal; } /* - */ .sharing { } .sharing .stButton { vertical-align:middle; } .sharing .stButton span { background-position:center center !important; background-repeat: no-repeat !important; background-size:100% 100% !important; height:46px !important; width:46px !important; } .sharing .st_twitter_large .stButton span { background-image:url(/assets/images/ico/twitter.png) !important; } .sharing .st_facebook_large .stButton span { background-image:url(/assets/images/ico/facebook.png) !important; } .sharing .st_googleplus_large .stButton span { background-image:url(/assets/images/ico/googleplus.png) !important; } .sharing .st_linkedin_large .stButton span { background-image:url(/assets/images/ico/linkedin.png) !important; } /* - */ .pagination { text-align:center; } .pagination a { color:#333333; font-family:'robotolight', Arial, sans-serif; font-size:14px; display:inline-block; border:2px solid #333333; background:transparent; padding:5px 12px; margin:0; line-height:20px; cursor:pointer; text-decoration:none; text-transform:uppercase; border-radius:5px; } .pagination a.active { border-color:#aaa; color:#aaa; } /* - */ .video-thumb-faker { overflow:hidden; width:100%; height:auto; position:relative; } .video-thumb-faker img { position:relative; z-index:10; } .video-thumb-faker a.cover { position:absolute; top:0px; left:0px; z-index:12; width:100%; height:100%; overflow:hidden; background:rgba(255,255,255,0.15); } .video-thumb-faker a.cover:hover { background:rgba(255,255,255,0.5); } .video-thumb-faker .vid { position:absolute; top:0px; left:0px; z-index:11; width:100%; } .video-thumb-faker .video-container iframe , .video-thumb-faker .video-container object , .video-thumb-faker .video-container embed { top:-18%; } /* - */ p.h2.home-cta { line-height:80px; margin-bottom:0; font-size:38px; } p.h2.home-cta img { vertical-align:middle; line-height:80px; } /* - */ .home-anim { margin:30px auto 40px; position:relative; display:block; max-width:900px; } .home-anim .level { position:absolute; left:0px; top:0px; width:100%; z-index:100; max-width:900px; } .home-anim .level-1 { z-index:100; } .home-anim .level-2 { z-index:99; } .home-anim .level-3 { z-index:98; } .home-anim .level-4 { z-index:97; } .home-anim .level-5 { z-index:96; } .home-anim .level-6 { z-index:95; } .home-anim .level-7 { z-index:94; } .home-anim .level-8 { z-index:93; } .home-anim .level-9 { z-index:92; } .home-anim .level-10 { z-index:91; } .home-anim .level-11 { z-index:90; } .home-anim .level-12 { z-index:89; } .home-anim.beenInView .fadeIn.level-1 { -webkit-animation-delay: 0.25s; -moz-animation-delay: 0.25s; -ms-animation-delay: 0.25s; -o-animation-delay: 0.25s; animation-delay: 0.25s; } .home-anim.beenInView .fadeIn.level-2 { -webkit-animation-delay: 0.5s; -moz-animation-delay: 0.5s; -ms-animation-delay: 0.5s; -o-animation-delay: 0.5s; animation-delay: 0.5s; } .home-anim.beenInView .fadeIn.level-3 { -webkit-animation-delay: 0.75s; -moz-animation-delay: 0.75s; -ms-animation-delay: 0.75s; -o-animation-delay: 0.75s; animation-delay: 0.75s; } .home-anim.beenInView .fadeIn.level-4 { -webkit-animation-delay: 1.0s; -moz-animation-delay: 1.0s; -ms-animation-delay: 1.0s; -o-animation-delay: 1.0s; animation-delay: 1.0s; } .home-anim.beenInView .fadeIn.level-5 { -webkit-animation-delay: 1.25s; -moz-animation-delay: 1.25s; -ms-animation-delay: 1.25s; -o-animation-delay: 1.25s; animation-delay: 1.25s; } .home-anim.beenInView .fadeIn.level-6 { -webkit-animation-delay: 1.5s; -moz-animation-delay: 1.5s; -ms-animation-delay: 1.5s; -o-animation-delay: 1.5s; animation-delay: 1.5s; } .home-anim.beenInView .fadeIn.level-7 { -webkit-animation-delay: 1.75s; -moz-animation-delay: 1.75s; -ms-animation-delay: 1.75s; -o-animation-delay: 1.75s; animation-delay: 1.75s; } .home-anim.beenInView .fadeIn.level-8 { -webkit-animation-delay: 2.0s; -moz-animation-delay: 2.0s; -ms-animation-delay: 2.0s; -o-animation-delay: 2.0s; animation-delay: 2.0s; } .home-anim.beenInView .fadeIn.level-9 { -webkit-animation-delay: 2.25s; -moz-animation-delay: 2.25s; -ms-animation-delay: 2.25s; -o-animation-delay: 2.25s; animation-delay: 2.25s; } .home-anim.beenInView .fadeIn.level-10 { -webkit-animation-delay: 2.5s; -moz-animation-delay: 2.5s; -ms-animation-delay: 2.5s; -o-animation-delay: 2.5s; animation-delay: 2.5s; } .home-anim.beenInView .fadeIn.level-11 { -webkit-animation-delay: 2.75s; -moz-animation-delay: 2.75s; -ms-animation-delay: 2.75s; -o-animation-delay: 2.75s; animation-delay: 2.75s; } .home-anim.beenInView .fadeIn.level-12 { -webkit-animation-delay: 3.0s; -moz-animation-delay: 3.0s; -ms-animation-delay: 3.0s; -o-animation-delay: 3.0s; animation-delay: 3.0s; } /* - */ /* - */ /* - */ /* - */ /* - */ /* - */ /* - */ /* SMALL DESKTOP */ @media only screen and (min-width: 1036px) and (max-width: 1250px) { .padded-h { padding:0 30px; } .team-member-container { } .team-member-box { margin:20px 0 0 15px; } .team-member-box:nth-child(4n+1) { margin-left:15px; } .team-member-box:nth-child(3n+1) { margin-left:0; } .reseller-container { } .reseller-box { margin:20px 0 0 15px; } .reseller-box:nth-child(4n+1) { margin-left:15px; } .reseller-box:nth-child(3n+1) { margin-left:0; } .box .title-block { display:block; } .swipe.big-nav ul li a { width:220px; } .swipe.big-nav.solutions ul li a { width:306px; } /* - */ .screenshot-rotator , .screenshot-rotator .overlay { width:978px; height:739px; } .screenshot-rotator .screenshot-wrap { top:40px; left:40px; } .screenshot-rotator .screenshot-wrap , .screenshot-rotator .screenshots { width:898px; height:507px; } /* - */ .box.solution p.h2 { font-size:36px !important; } p.h2.home-cta { font-size:34px !important; } /* - */ } /* TABLET LANDSCAPE */ @media only screen and (min-width: 768px) and (max-width: 1035px) { .padded-h { padding:0; } h1, p.h1, h1 a, p.h1 a { font-size:50px; } h2, p.h2, h2 a, p.h2 a { font-size:42px; } h2.small, p.h2.small, h2.small a, p.h2.small a { font-size:36px; } h3, p.h3, h3 a, p.h3 a { font-size:26px; } h3.small, p.h3.small, h3.small a, p.h3.small a { font-size:26px; } h4, p.h4, h4 a, p.h4 a { font-size:20px; } h5, p.h5, h5 a, p.h5 a { font-size:18px; } p.smaller { font-size:12px; } .header .mobile-nav-toggle { display:block; } .header .nav-container { display:none; } .footer ul.columised-nav.about { display:none; } /* - */ .header .logo-full , .scrolled .header .logo-full { width:150px; height:auto !important; margin:0 !important; position:inherit; top:inherit; left:inherit; } /* - */ .info p.grey-title { font-size:24px; } .info p.grey-title-big { font-size:24px; } .info p.large { font-size:54px; } .box .title-block { display:block; } .swipe.big-nav ul li a { width:160px; } .swipe.big-nav.solutions ul li a { width:220px; } .swipe.big-nav.solutions ul li a span.title { font-size:28px; } .swipe.big-nav.solutions ul li a span.sub { font-size:18px; } /* - */ .screenshot-rotator , .screenshot-rotator .overlay { width:724px; height:547px; } .screenshot-rotator .screenshot-wrap { top:29px; left:30px; } .screenshot-rotator .screenshot-wrap , .screenshot-rotator .screenshots { width:665px; height:376px; } /* - */ p.big-infobox { font-size:50px; line-height:40px; } p.big-infobox span.title { font-size:20px; line-height:20px; } /* - */ .box.solution p.h2 { font-size:28px; } p.h2.home-cta { font-size:28px !important; } /* - */ h3.small, p.h3.small, h3.small a, p.h3.small a { font-size:22px; } /* - */ p.h2.home-cta { line-height:80px; margin-bottom:0;} p.h2.home-cta img { display:block; margin:0 auto; line-height:1em; margin-bottom:-16px; } } /* TABLET AND MOBILE */ @media only screen and (max-width: 767px) { .padded-h { padding:0; } .tab-full-width { width:100%; } .tab-tcenter { text-align:center; } .tab-tleft { text-align:left; } .tab-tright { text-align:right; } .not-desktop { display:inherit; } h1, p.h1, h1 a, p.h1 a { font-size:50px; } h2, p.h2, h2 a, p.h2 a { font-size:42px; } h2.small, p.h2.small, h2.small a, p.h2.small a { font-size:36px; } h3, p.h3, h3 a, p.h3 a { font-size:26px; } h3.small, p.h3.small, h3.small a, p.h3.small a { font-size:26px; } h4, p.h4, h4 a, p.h4 a { font-size:20px; } h5, p.h5, h5 a, p.h5 a { font-size:18px; } .header , .scrolled .header { margin:0; padding:10px 0 !important; position:fixed; top:0px; right:0px; width:100%; height:auto; background:#203254 !important; box-shadow:rgba(0,0,0,0.25) 0px 0px 3px; } .header .logo-full , .scrolled .header .logo-full { width:150px; height:auto !important; margin:0 !important; position:inherit; top:inherit; left:inherit; } .header-bg { height:200px; background-image:url(/assets/photos/header-bg-mobile.jpg); } .page-title { padding:90px 0 30px 0; } .header .mobile-nav-toggle { display:block; } .header .nav-container { display:none; } .team-member-box { margin-left:0; } .reseller-box { margin-left:0; } .footer , .footer .tright { text-align:center; } .footer .mob-padded-top { padding-top:20px; } .footer .mob-block { display:block; } .footer ul.columised-nav { width:100%; text-align:center; padding:0; margin:20px 0 10px 0; } /* - */ .swipe.big-nav { } .swipe.big-nav .mobile-sub-nav-toggle { display:block; margin:5px auto; } .swipe.big-nav ul { display:none; } .swipe.big-nav ul , .swipe.big-nav.solutions ul , .swipe.big-nav ul li , .swipe.big-nav.solutions ul li , .swipe.big-nav ul li a , .swipe.big-nav.solutions ul li a { width:100%; float:left; margin:0; padding:0; border:0; line-height:40px; } .swipe.big-nav ul li , .swipe.big-nav.solutions ul li { border-top:1px solid #bbb; } .swipe.big-nav ul li a { } .swipe.big-nav ul li a span.title { margin:0; line-height:40px; font-size:20px; } .swipe.big-nav ul li a:hover , .swipe.big-nav ul li a.active { background:none; color:#7b7f8c; } .swipe.big-nav ul li a:hover span.title { color:#7b7f8c; } .swipe.big-nav ul li a:hover span.sub { color:#7b7f8c; } /* - */ .v-align { position:inherit; top:inherit; -webkit-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%); } .screenshot-rotator { display:none; } /* - */ p.h2.home-cta { line-height:80px; margin-bottom:0;} p.h2.home-cta img { display:block; margin:0 auto; line-height:1em; margin-bottom:-16px; } /* - */ } /* MOBILE LANDSCAPE */ @media only screen and (min-width: 480px) and (max-width: 767px) { .not-tab { display:none; } .swipe { padding:50px 0 30px; } .logos img { width:28%; margin:0 2% 20px; } .home .page-title h1 { font-size:38px; } .home .page-title p { padding:0; } } /* MOBILE PORTRAIT */ @media only screen and (max-width: 479px) { .mob-full-width { width:100%; } .mob-tcenter { text-align:center; } .mob-tleft { text-align:left; } .mob-tright { text-align:right; } p.smaller { font-size:12px; } .home .page-title h1 { font-size:38px; } .home .page-title p { padding:0; } .not-mob { display:none; } p, ul, ol, ul li, ol li { font-size:16px; } p.intro { font-size:18px; } h1, p.h1, h1 a, p.h1 a { font-size:36px; } h2, p.h2, h2 a, p.h2 a { font-size:28px; } h3, p.h3, h3 a, p.h3 a { font-size:22px; } h4, p.h4, h4 a, p.h4 a { font-size:18px; } h5, p.h5, h5 a, p.h5 a { font-size:16px; } hr { width:120px; } .info p.grey-title { font-size:24px; } .info p.grey-title-big { font-size:24px; } .info p.large { font-size:54px; } .swipe { padding:40px 0 20px; } .footer .eml { font-size:14px; } .logos img { width:28%; margin:0 2% 20px; } }