html,
body,
div,
span,
p,
br,
table,
th,
tr,
td,
img,
code,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label{margin:0;border:0;padding:0;font-size:100%;font-weight:normal;}
html,
body{display:block;float:left;width:100%;height:auto;min-width:100%;min-height:100%;margin:0px;padding:0px;background:#fff;color:#333;}
body{font-family:sans-serif;-webkit-text-size-adjust:none;-webkit-font-smoothing:subpixel-antialiased;text-rendering:optimizeLegibility;}
h1,
h2,
h3,
h4,
h5,
h6{margin:0;padding:0;border:0;}
div{display:block;}
a{color:inherit;text-decoration:none;font-weight:bold;padding:0;margin:0;-webkit-transition:all 0.5s linear;transition:all 0.5s linear;}
a img{border:none;outline:none;}
a:hover{text-decoration:underline;}
ol,
ul{list-style:none;}
li{display:block;margin:0;padding:0;}
img{display:block;max-width:100%;height:auto;padding:0;margin:0;}
table{border-collapse:collapse;border-spacing:0;}
input,
button,
input:hover,
input:active,
input:focus,
button:hover,
button:active,
button:focus{outline:none;border:none;box-shadow:none;border-radius:0;-webkit-appearance:none;-moz-appearance:none;}
.text-hide{overflow:hidden;text-align:left;text-indent:-9999em;}
.table{width:100%;height:100%;display:table;overflow:hidden;}
.table-cell{display:table-cell;vertical-align:middle;margin:0;padding:0;}
.center-x{display:block;position:relative;float:none;overflow:hidden;zoom:1;text-align:left;}
.clearfloat:after{content:'';display:table;clear:both;}
.section{position:relative;}
.section:after{content:'';display:table;clear:both;}
.inner{margin:0 auto;position:relative;}
.inner:after{content:'';display:table;clear:both;}
.clearbreak{display:block;overflow:hidden;height:0;float:none;clear:both;}
.inline-block{display:inline-block;width:auto;float:none;clear:none;vertical-align:top;zoom:1;}
.ellipses{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.scroll-disabled{overflow:hidden;}
.float-left{float:left;}
.float-right{float:right;}
.float-none{float:none;}
.text-left{text-align:left;}
.text-right{text-align:right;}
.text-center{text-align:center;}
.text-justify{text-align:justify;}
.col{display:block;float:left;}
.full{width:100%;}
.half{width:50%;}
.one-third{width:33.333%;}
.two-thirds{width:66.666%;}
.one-quarter{width:25%;}
.three-quarters{width:75%;}
.one-fifth{width:20%;}
.two-fifths{width:40%;}
.three-fifths{width:60%;}
.four-fifths{width:80%;}
.video-hd{width:64%;}
.video-hd.aside{width:36%;}
.flickity-enabled{position:relative;}
.flickity-enabled:focus{outline:none;}
.flickity-viewport{overflow:hidden;position:relative;height:100%;}
.flickity-slider{position:absolute;width:100%;height:100%;}
.flickity-enabled.is-draggable{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}
.flickity-enabled.is-draggable .flickity-viewport{cursor:move;cursor:-webkit-grab;cursor:-moz-grab;cursor:grab;}
.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down{cursor:-webkit-grabbing;cursor:-moz-grabbing;cursor:grabbing;}
.flickity-prev-next-button{position:absolute;top:50%;width:44px;height:44px;border:none;border-radius:50%;background:white;background:rgba(255, 255, 255, 0.75);cursor:pointer;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);}
.flickity-prev-next-button:hover{background:white;}
.flickity-prev-next-button:focus{outline:none;box-shadow:0 0 0 5px #09F;}
.flickity-prev-next-button:active{filter:alpha(opacity=60);opacity:0.6;}
.flickity-prev-next-button.previous{left:10px;}
.flickity-prev-next-button.next{right:10px;}
.flickity-rtl .flickity-prev-next-button.previous{left:auto;right:10px;}
.flickity-rtl .flickity-prev-next-button.next{right:auto;left:10px;}
.flickity-prev-next-button:disabled{filter:alpha(opacity=30);opacity:0.3;cursor:auto;}
.flickity-prev-next-button svg{position:absolute;left:20%;top:20%;width:60%;height:60%;}
.flickity-prev-next-button .arrow{fill:#333;}
.flickity-prev-next-button.no-svg{color:#333;font-size:26px;}
.flickity-page-dots{position:absolute;width:100%;bottom:-25px;padding:0;margin:0;list-style:none;text-align:center;line-height:1;}
.flickity-rtl .flickity-page-dots{direction:rtl;}
.flickity-page-dots .dot{display:inline-block;width:10px;height:10px;margin:0 8px;background:#333;border-radius:50%;filter:alpha(opacity=25);opacity:0.25;cursor:pointer;}
.flickity-page-dots .dot.is-selected{filter:alpha(opacity=100);opacity:1;}
.times{font-family:Times, "Times New Roman", serif;}
@font-face{font-family:'Oswald';src:url('https://xpertlogix.co.uk/fonts/oswald-regular-webfont.eot');src:url('https://xpertlogix.co.uk/fonts/oswald-regular-webfont.eot?#iefix') format('embedded-opentype'), url('https://xpertlogix.co.uk/fonts/oswald-regular-webfont.woff') format('woff'), url('https://xpertlogix.co.uk/fonts/oswald-regular-webfont.ttf') format('truetype'), url('https://xpertlogix.co.uk/fonts/oswald-regular-webfont.svg#open_sansregular') format('svg');font-weight:normal;font-style:normal;}
html,
body{position:relative;margin:0px;padding:0px;width:100%;background:black;color:#eeeeee;font-size:12px;line-height:20px;font-family:sans-serif;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;text-size-adjust:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-font-smoothing:subpixel-antialiased;}
p,
h1,
h2,
h3,
h4{cursor:default;}
p{display:block;padding:0;font-size:100%;line-height:20px;}
p a{display:inline;text-decoration:none;font-weight:bold;}
p a:hover{text-decoration:underline;}
h1,
h2,
h3,
h4{display:block;font-size:28px;line-height:30px;font-weight:normal;text-decoration:none;text-transform:uppercase;font-style:normal;margin:0 0 20px;padding:0;font-family:'Oswald', Arial, Helvetica, sans-serif;}
h1 a,
h2 a,
h3 a,
h4 a{color:#eeeeee;font-weight:normal;text-decoration:none;}
h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover{color:#eeeeee;text-decoration:underline;}
svg{-webkit-backface-visibility:hidden;backface-visibility:hidden;}
iframe{display:block;float:left;width:100%;height:100%;border:none;padding:0px;margin:0px;overflow:hidden;}
.btn{display:inline-block;vertical-align:top;zoom:1;padding:10px 40px;margin:20px auto 0;font-size:16px;line-height:20px;font-weight:normal;text-decoration:none;text-transform:uppercase;font-family:'Oswald', Arial, Helvetica, sans-serif;color:#333333;background:transparent;border:solid 2px #333333;}
.btn.lowercase{text-transform:lowercase;}
.btn:hover{background:#333333;color:#a7cf3a;text-decoration:none;}
.preloader{display:block;position:fixed;top:0;left:0;width:100%;height:100%;z-index:999;overflow:hidden;background-color:#222;}
.preloader:before{display:block;content:'';width:30px;height:30px;position:absolute;top:50%;left:50%;margin-top:-15px;margin-left:-15px;background-image:url(images/preloader.gif);background-repeat:no-repeat;background-position:center;background-size:30px;opacity:0.5;}
@media only screen and (-webkit-min-device-pixel-ratio:1.5), only screen and (min-device-pixel-ratio:1.5){.preloader:before{background-image:url('images/preloader@2x.gif');}
}
#container,
#loader{float:none;clear:both;overflow:hidden;zoom:1;z-index:0;}
.inner:after{display:table;content:'';}
.row{float:left;width:100%;position:relative;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-backface-visibility:hidden;backface-visibility:hidden;}
.block{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;position:relative;-moz-box-sizing:border-box;box-sizing:border-box;float:left;-webkit-box-align:center;-webkit-align-items:center;-moz-box-align:center;-ms-flex-align:center;align-items:center;-webkit-backface-visibility:hidden;backface-visibility:hidden;}
.block .inner{display:inline-table;margin:auto;}
.block img{display:block;width:100%;margin:0 auto;}
.black{background-color:#111111;color:#999999;border-color:#999999;}
.black .btn{color:#666666;border-color:#666666;}
.black .btn:hover{color:#111111;background-color:#666666;}
.black .icon svg *{stroke:#999999;}
.blue{background-color:#161c25;color:#3c948b;border-color:#3c948b;}
.blue .btn{color:#3c948b;border-color:#3c948b;}
.blue .btn:hover{color:#161c25;background-color:#3c948b;}
.blue .icon svg *{stroke:#3c948b;}
.dark{background-color:#333333;color:#a7cf3a;border-color:#a7cf3a;}
.dark .btn{color:#a7cf3a;border-color:#a7cf3a;}
.dark .btn:hover{background-color:#a7cf3a;color:#333333;}
.dark .icon svg *{stroke:#a7cf3a;}
.gray{background-color:#666666;color:#eeeeee;border-color:#eeeeee;}
.gray .btn{color:#eeeeee;border-color:#eeeeee;}
.gray .btn:hover{color:#666666;background-color:#eeeeee;}
.gray .icon svg *{stroke:#eeeeee;}
.white{background-color:#eeeeee;color:#666666;border-color:#666666;}
.white .icon svg *{stroke:#666666;}
.white .btn{color:#666666;border-color:#666666;}
.white .btn:hover{background-color:#666666;color:#eeeeee;}
.yellow{background-color:#a7cf3a;color:#333333;border-color:#333333;}
.yellow .btn{color:#333333;border-color:#333333;}
.yellow .btn:hover{color:#a7cf3a;background-color:#333333;}
.yellow .icon svg *{stroke:#333333;}
.arrow{display:block;position:absolute;overflow:hidden;z-index:10;background:transparent;}
.arrow svg{position:absolute;width:80px;height:80px;}
.point-right,
.point-left{width:40px;height:80px;top:50%;margin-top:-40px;}
.point-down,
.point-up{width:80px;height:40px;left:50%;margin-left:-40px;}
.point-right{left:-10px;}
.point-right svg{left:-40px;}
.point-left{right:-10px;}
.point-left svg{left:0;}
.point-down{top:-10px;}
.point-down svg{top:-40px;left:0;}
.point-up{bottom:-10px;}
.point-up svg{top:0;left:0;}
.home{display:table;overflow:hidden;position:relative;width:100%;height:100%;background-color:#222;background-size:20px;color:#666666;-webkit-backface-visibility:hidden;backface-visibility:hidden;}
.home.ease{-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.home .inner{display:table-cell;vertical-align:middle;margin:0;padding:0;text-align:center;padding:40px;}
.home .pitch{display:block;position:relative;max-width:310px;margin:0 auto;}
.home .pitch:hover img{-webkit-transform:rotate(10deg) translateX(20px);-ms-transform:rotate(10deg) translateX(20px);transform:rotate(10deg) translateX(20px);}
.home h1{display:inline-block;zoom:1;vertical-align:top;color:#eeeeee;font-size:38px;line-height:40px;}
.home p{color:#999999;font-size:14px;}
.home .btn{border-color:#a7cf3a;color:#a7cf3a;}
.home .btn:hover{background-color:#a7cf3a;border-color:#a7cf3a;color:#222;}
.home .links{margin-top:20px;}
.home .links li{display:inline-block;width:auto;float:none;clear:none;vertical-align:top;zoom:1;cursor:default;}
.home .links li a{font-size:10px;text-transform:uppercase;text-decoration:none;border-left:solid 1px #666666;margin-left:5px;padding-left:5px;}
.home .links li a:hover{color:#a7cf3a;}
.home .links li:first-child a{border-left:none;margin-left:0;padding-left:0;}
.home .stub{display:block;position:absolute;width:150px;height:auto;top:60px;right:-65px;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;pointer-events:none;}
.home .keyboard{display:block;position:absolute;top:0;left:0;-webkit-transform:translate3d(5%, -50%, 0);transform:translate3d(5%, -50%, 0);}
#device{display:block;width:240px;height:120px;margin:0 auto 40px;}
#device *{stroke:#666666;stroke-width:6px;}
#sketch-arrow{display:block;position:absolute;top:90px;left:0;width:40px;height:80px;}
#sketch-arrow *{fill:#666666;}
@-webkit-keyframes scroll{0%{-webkit-transform:translateY(-10%);transform:translateY(-10%);}
50%{-webkit-transform:translateY(10%);transform:translateY(10%);}
100%{-webkit-transform:translateY(-10%);transform:translateY(-10%);}
}
@keyframes scroll{0%{-webkit-transform:translateY(-10%);transform:translateY(-10%);}
50%{-webkit-transform:translateY(10%);transform:translateY(10%);}
100%{-webkit-transform:translateY(-10%);transform:translateY(-10%);}
}
.scroll{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-name:scroll;animation-name:scroll;}
.xpert-logix{display:block;position:absolute;width:30px;height:30px;padding:20px;left:50%;bottom:20px;margin-left:-40px;}
.xpert-logix svg{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-name:scroll;animation-name:scroll;width:30px;height:30px;}
.xpert-logix svg *{fill:#666666;-webkit-transition:all 0.5s linear;transition:all 0.5s linear;}
.xpert-logix:hover svg *{fill:#a7cf3a;}
.row.about .row{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;flex-flow:row wrap;}
.hero,
.definition{width:50%;}
.hero{background-color:#eeeeee;padding:40px;}
.hero .inner{display:block;width:100%;float:none;overflow:hidden;zoom:1;position:relative;max-width:640px;margin:auto;}
.hero img{-webkit-transition:opacity 1s ease-in-out;transition:opacity 1s ease-in-out;}
.hero img.fade-out{position:absolute;top:0;left:0;}
.hero:hover .fade-out{opacity:0;}
@-webkit-keyframes fade{0%{opacity:1;}
20%{opacity:0;}
}
@keyframes fade{0%{opacity:1;}
20%{opacity:0;}
}
.hero .fade-loop{position:absolute;top:0;left:0;-webkit-animation-name:fade;animation-name:fade;-webkit-animation-duration:20s;animation-duration:20s;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-delay:4s;animation-delay:4s;}
.definition{padding:60px 80px;background-color:#a7cf3a;color:#333333;border-color:#333333;}
.definition .inner{max-width:540px;}
.definition .btn{color:#333333;border-color:#333333;}
.definition .btn:hover{color:#a7cf3a;background-color:#333333;}
.definition .icon svg *{stroke:#333333;}
.definition .arrow{width:40px;height:80px;top:50%;margin-top:-40px;left:-10px;}
.definition .arrow svg{left:-40px;}
.definition .arrow svg *{fill:#eeeeee;}
.definition h1 span{font-family:Times, "Times New Roman", serif;font-size:32px;text-transform:none;position:relative;top:-4px;}
.services .block{width:25%;text-align:center;}
.services .block .inner{margin:80px auto;padding:0 40px;}
.services .block .icon{display:block;width:200px;height:100px;margin:0 auto 30px;}
.services .block .icon svg{display:block;}
.services .block .arrow{width:40px;height:80px;top:50%;margin-top:-40px;left:-10px;}
.services .block .arrow svg{left:-40px;}
.code{background-color:#111111;color:#999999;border-color:#999999;}
.code .btn{color:#666666;border-color:#666666;}
.code .btn:hover{color:#111111;background-color:#666666;}
.code .icon svg *{stroke:#999999;}
.creative{background-color:#333333;color:#a7cf3a;border-color:#a7cf3a;}
.creative .btn{color:#a7cf3a;border-color:#a7cf3a;}
.creative .btn:hover{background-color:#a7cf3a;color:#333333;}
.creative .icon svg *{stroke:#a7cf3a;}
.creative .arrow svg *{fill:#111111;}
.strategy{background-color:#666666;color:#eeeeee;border-color:#eeeeee;}
.strategy .btn{color:#eeeeee;border-color:#eeeeee;}
.strategy .btn:hover{color:#666666;background-color:#eeeeee;}
.strategy .icon svg *{stroke:#eeeeee;}
.strategy .arrow svg *{fill:#333333;}
.support{background-color:#eeeeee;color:#666666;border-color:#666666;}
.support .icon svg *{stroke:#666666;}
.support .btn{color:#666666;border-color:#666666;}
.support .btn:hover{background-color:#666666;color:#eeeeee;}
.support .arrow svg *{fill:#666666;}
.awards,
.testimonials{width:50%;}
.awards .inner,
.testimonials .inner{display:block;float:none;width:100%;overflow:hidden;zoom:1;}
.awards{background:#222;padding:80px 40px;}
.awards svg{display:block;width:120px;height:80px;margin:20px auto;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.awards svg *{fill:#666;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.awards ul{max-width:600px;text-align:center;margin:auto;}
.awards ul li{display:block;float:left;width:33.333%;}
.awards ul li:hover svg{-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1);}
.awards ul li:hover svg *{fill:#999;}
.testimonials{background-color:#444;color:#ccc;padding:80px;}
.testimonials .inner{max-width:550px;}
.testimonials h1{margin-top:0;}
.testimonials h2{font-size:16px;text-align:left;margin:20px 0 0;}
.testimonials p{margin-bottom:0;}
.testimonials .flickity-slider li{width:100%;-moz-box-sizing:border-box;box-sizing:border-box;padding:0 10px;}
.testimonials .flickity-prev-next-button{display:none;}
.testimonials .flickity-page-dots{position:relative;bottom:auto;text-align:left;margin-top:40px;}
.testimonials .flickity-page-dots .dot{width:6px;height:6px;margin:0 10px;background:transparent;border:solid 2px #eeeeee;opacity:0.5;-webkit-transition:opacity 0.5s ease-in-out;transition:opacity 0.5s ease-in-out;}
.testimonials .flickity-page-dots .dot:hover{opacity:1;}
.testimonials .flickity-page-dots .dot.is-selected{background:#eeeeee;opacity:1;}
.bio{width:50%;background-color:#eeeeee;color:#666666;border-color:#666666;padding:80px 60px;}
.bio .icon svg *{stroke:#666666;}
.bio .btn{color:#666666;border-color:#666666;}
.bio .btn:hover{background-color:#666666;color:#eeeeee;}
.bio .inner{max-width:540px;}
.pic,
.chat{width:25%;}
.chat{background-color:#a7cf3a;color:#333333;border-color:#333333;text-align:center;padding:60px 40px;}
.chat .btn{color:#333333;border-color:#333333;}
.chat .btn:hover{color:#a7cf3a;background-color:#333333;}
.chat .icon svg *{stroke:#333333;}
.chat .icon{display:block;width:200px;height:100px;margin:0 auto 20px;}
.chat .icon svg{display:block;}
.pic{position:relative;overflow:hidden;background:#4875b4;}
.pic *{cursor:pointer;}
.pic a{display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:url(images/profile-ali-raza-2025.jpg);background-size:cover;background-position:center;}
.pic .icon{display:block;position:absolute;width:60px;height:60px;top:50%;left:50%;margin-top:-30px;margin-left:-30px;opacity:0;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;pointer-events:none;}
.pic .icon svg{width:60px;height:60px;}
.pic .icon svg *{fill:#fff;}
.pic:hover a{opacity:0.2;-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1);}
.pic:hover .icon{opacity:1;-webkit-transform:scale(1.5);-ms-transform:scale(1.5);transform:scale(1.5);}
.pic .arrow{width:40px;height:80px;top:50%;margin-top:-40px;left:-10px;}
.pic .arrow svg{left:-40px;}
.pic .arrow svg *{fill:#eeeeee;}
.thumbs{display:block;overflow:hidden;zoom:1;background-color:#333333;}
.thumbs *{cursor:pointer;}
.thumbs img{display:block;float:left;width:100%;position:relative;top:0;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.thumbs a{display:block;}
.thumbs .info{float:left;width:100%;position:absolute;top:100%;left:0;zoom:1;background:#a7cf3a;z-index:10;text-align:center;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.thumbs .info .inner{position:relative;color:#333333;padding:10px 15px;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;z-index:10;overflow:hidden;zoom:1;}
.thumbs .info h1,
.thumbs .info p{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.thumbs .info h1{font-size:22px;margin-bottom:0;}
.thumbs .info p{font-size:12px;text-transform:uppercase;}
.thumbs .info a{display:none;position:absolute;top:0;right:0;padding:10px;float:right;font-family:'Oswald', Arial, Helvetica, sans-serif;font-weight:normal;text-transform:uppercase;color:#eeeeee !important;}
.thumbs .info .arrow{display:block;bottom:auto;top:0;width:80px;height:40px;left:50%;margin-left:-40px;z-index:0;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.thumbs .info .arrow svg{left:0;}
.thumbs .info .arrow svg *{fill:#a7cf3a;}
.thumbs li{float:left;width:25%;position:relative;overflow:hidden;cursor:pointer;background-color:#000;-webkit-backface-visibility:hidden;backface-visibility:hidden;}
.thumbs li:hover .info .inner{background-color:#a7cf3a;color:#333333;}
.thumbs li:hover .info{-webkit-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%);-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.thumbs li:hover img,
.thumbs li:hover .arrow{-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px);-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.thumbs li:hover img{opacity:0.5;}
.thumbs .feat{width:50%;}
.thumbs .feat .info .inner{padding:20px 15px;}
.thumbs .feat:hover .arrow{-webkit-transform:translateY(-30px);-ms-transform:translateY(-30px);transform:translateY(-30px);}
.contact{background:#222;color:#666666;text-align:center;}
.contact .inner{margin:200px auto;padding:0 80px;max-width:440px;}
.contact .btn{text-transform:lowercase;letter-spacing:1px;padding:15px 0;margin:0 auto;width:220px;font-size:20px;line-height:20px;border-color:#a7cf3a;color:#a7cf3a;}
.contact .btn:hover{background-color:#a7cf3a;border-color:#a7cf3a;color:#222;}
.contact h1,
.contact p{margin-bottom:30px;}
.contact h1{color:#eeeeee;}
.contact p{color:#999999;}
.footer{background:#222;}
.footer:after{content:'';display:table;clear:both;}
.footer #xpert{float:left;width:80px;height:20px;margin:30px 10px 30px 30px;}
.footer #xpert *{fill:#666666;}
.footer .copyright{float:left;margin:30px auto;padding:0;color:#666666;font-size:10px;line-height:20px;cursor:default;margin-left:50px;}
.footer .top{display:block;float:right;width:80px;height:80px;overflow:hidden;position:relative;}
.footer .top svg{width:50px;height:50px;margin:15px;}
.footer .top svg *{-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;stroke:#666666;}
.footer .top:hover svg *{stroke:#a7cf3a;}
html #container,
html .footer{-webkit-transition:opacity 0.5s ease-in-out;transition:opacity 0.5s ease-in-out;}
html.nav-is-open{overflow:hidden;}
html.nav-is-open #container,
html.nav-is-open .footer{opacity:0.4;}
#overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;z-index:9;}
.nav-is-open #overlay{display:block;}
.logo{display:block;width:100px;padding:0;margin:0px 0px 0px 45px;overflow:hidden;text-indent:-999em;z-index:999;}
.logo svg{display:block;width:100px;height:80px;margin-left:20px;background-image:url(images/xllogo.png);}
.logo svg *{fill:#999999;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.logo:hover svg *{fill:#666666;}
.nav,
.nav li{display:block;float:left;position:relative;text-align:center;padding:0;margin:0;cursor:default;}
.nav .phone,
.nav .email{display:none;}
.nav{display:block;-moz-box-sizing:border-box;box-sizing:border-box;width:260px;height:100%;padding:0 20px;background:#eeeeee;position:fixed;right:-260px;z-index:9999;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.nav .scrollable{height:100%;overflow-y:scroll;}
.nav .scrollable .inner{padding:20px 0 40px;}
.nav-is-open .nav{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);}
.nav li{width:100%;}
.nav p{border-top:solid 1px #cccccc;}
.nav p a{display:block;padding:20px 0;color:#999999;font-size:14px;font-weight:normal;text-decoration:none;}
.nav p a:hover{color:#666666;}
.nav .links{margin-top:20px;}
.nav .links:after{content:'';display:table;clear:both;}
.nav .links a{font-family:'Oswald', Arial, Helvetica, sans-serif;display:block;color:#999999;font-size:14px;line-height:20px;padding:20px 15px;font-weight:normal;text-align:center;text-decoration:none;text-transform:uppercase;border-top:solid 1px #cccccc;}
.nav .links a:hover{color:#666666;}
.nav .social{text-align:center;padding:20px 0 0;border-top:solid 1px #cccccc;}
.nav .social li{display:inline-block;width:auto;float:none;clear:none;vertical-align:top;zoom:1;margin:0 5px;}
.nav .social li a{width:40px;height:40px;margin:0 auto;-moz-box-sizing:border-box;box-sizing:border-box;border:solid 1px #cccccc;}
.nav .social li a svg{width:16px;height:16px;margin:11px;}
.nav .social li a svg *{fill:#999999;}
.nav .social li a:hover svg *{fill:#eeeeee;}
.nav .phone a{text-indent:-9999em;background-position:center -640px;}
.nav .email a{text-indent:-9999em;background-position:center -700px;}
.navicon{display:block;position:absolute;top:0;left:-60px;width:60px;height:60px;text-indent:-9999em;cursor:pointer;z-index:999;opacity:0.5;-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.navicon:after{display:block;content:'';position:absolute;top:0;left:0;width:100%;height:100%;}
.navicon .inner{display:block;width:20px;height:20px;margin:20px;padding:0;position:relative;}
.navicon .bar{display:block;position:absolute;width:100%;height:4px;left:0;background:white;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.navicon .bar.top{top:0;}
.navicon .bar.mid{top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);}
.navicon .bar.btm{top:100%;-webkit-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%);}
.navicon:hover{opacity:1;}
.nav-is-open .navicon .bar.top{top:50%;-webkit-transform:translateY(-50%) rotate(45deg);-ms-transform:translateY(-50%) rotate(45deg);transform:translateY(-50%) rotate(45deg);}
.nav-is-open .navicon .bar.mid{-webkit-transform:translateX(10px);-ms-transform:translateX(10px);transform:translateX(10px);width:0;}
.nav-is-open .navicon .bar.btm{top:50%;-webkit-transform:translateY(-50%) rotate(-45deg);-ms-transform:translateY(-50%) rotate(-45deg);transform:translateY(-50%) rotate(-45deg);}
.social{display:block;margin:0;padding:0;}
.social li{display:block;float:left;width:auto;}
.social a{display:block;width:80px;height:80px;padding:0;margin:0;}
.header .social a{background-color:#333333;}
.social a svg{width:20px;height:20px;margin:30px;}
.social a svg *{fill:#eeeeee;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.social a.facebook:hover{background-color:#3b5998;border-color:#3b5998;}
.social a.twitter:hover{background-color:#00acee;border-color:#00acee;}
.social a.googleplus:hover{background-color:#dd4b39;border-color:#dd4b39;}
.social a.linkedin:hover{background-color:#4875b4;border-color:#4875b4;}
.contact .social{float:none;width:240px;margin:30px auto 0;overflow:hidden;zoom:1;text-align:center;}
.contact .social li{display:inline-block;float:none;margin:0 5px;}
.contact .social li a{width:40px;height:40px;padding:0;background:transparent;border:solid 2px #666666;}
.contact .social li a svg{margin:10px;}
.contact .social li a svg *{fill:#666666;}
.contact .social li a:hover svg *{fill:#eeeeee;}
.work-nav{display:block;float:left;width:100%;-moz-box-sizing:border-box;box-sizing:border-box;padding:5px;}
.spec .work-nav{margin-bottom:20px;padding:0;}
.work-nav ul{display:block;float:left;width:100%;}
.work-nav li{display:block;float:right;position:relative;}
.spec .work-nav li{width:auto;margin-bottom:0;right:-10px;}
.work-nav li.close{float:left;right:auto;width:20%;}
.spec .work-nav li.close{right:auto;left:-10px;}
.work-nav li.close a{background:#999999;color:#333333;}
.work-nav li.close a svg *{stroke:#333333;}
.work-nav li.prev{width:30%;}
.work-nav li.prev a{background:#333333;color:#999999;}
.work-nav li.prev a svg *{stroke:#999999;}
.work-nav li.next{width:50%;}
.work-nav li.next a{background:#a7cf3a;color:#333333;}
.work-nav li.next a svg *{stroke:#333333;}
.work-nav li.next svg,
.work-nav li.next span{float:right;}
.spec .work-nav li.close,
.spec .work-nav li.prev,
.spec .work-nav li.next{width:auto;}
.work-nav li.close a:hover,
.work-nav li.prev a:hover,
.work-nav li.next a:hover{background:#111111;color:#a7cf3a;}
.work-nav li.close a:hover svg *,
.work-nav li.prev a:hover svg *,
.work-nav li.next a:hover svg *{stroke:#a7cf3a;}
.work-nav li.close a.null,
.work-nav li.prev a.null,
.work-nav li.next a.null,
.work-nav li.close a.null:hover,
.work-nav li.prev a.null:hover,
.work-nav li.next a.null:hover{background-color:#555555;color:#666666;}
.work-nav li.close a.null svg *,
.work-nav li.prev a.null svg *,
.work-nav li.next a.null svg *,
.work-nav li.close a.null:hover svg *,
.work-nav li.prev a.null:hover svg *,
.work-nav li.next a.null:hover svg *{stroke:#666666;}
.spec .work-nav li.close a,
.spec .work-nav li.prev a,
.spec .work-nav li.next a{background:transparent;padding:0;}
.spec .work-nav li.close a svg *,
.spec .work-nav li.prev a svg *,
.spec .work-nav li.next a svg *{stroke:#eeeeee;}
.spec .work-nav li.close a span,
.spec .work-nav li.prev a span,
.spec .work-nav li.next a span{display:none;}
.spec .work-nav li.close a:hover,
.spec .work-nav li.prev a:hover,
.spec .work-nav li.next a:hover{background:transparent;}
.spec .work-nav li.close a:hover svg *,
.spec .work-nav li.prev a:hover svg *,
.spec .work-nav li.next a:hover svg *{stroke:#a7cf3a;}
.spec .work-nav li.close a.null,
.spec .work-nav li.prev a.null,
.spec .work-nav li.next a.null,
.spec .work-nav li.close a.null:hover,
.spec .work-nav li.prev a.null:hover,
.spec .work-nav li.next a.null:hover{background-color:transparent;color:#666666;}
.spec .work-nav li.close a.null svg *,
.spec .work-nav li.prev a.null svg *,
.spec .work-nav li.next a.null svg *,
.spec .work-nav li.close a.null:hover svg *,
.spec .work-nav li.prev a.null:hover svg *,
.spec .work-nav li.next a.null:hover svg *{stroke:#666666;}
.work-nav a{display:block;font-family:'Oswald', Arial, Helvetica, sans-serif;text-transform:uppercase;text-decoration:none;padding:10px;}
.work-nav a:after{content:'';display:table;clear:both;}
.work-nav a svg{display:block;float:left;width:50px;height:50px;}
.work-nav a svg *{stroke:#eeeeee;-webkit-transition:all 0.5s ease-in-out;transition:all 0.5s ease-in-out;}
.work-nav a span{display:block;line-height:50px;}
.work-nav a.null svg *,
.work-nav a.null:hover svg *{stroke:#666666;}
.spec{width:30%;height:100%;position:fixed;top:0;left:0;overflow-x:hidden;overflow-y:auto;background:#333333;}
.spec .inner{max-width:640px;margin:0 auto;padding:20px 40px 120px;}
.spec .btn{border-color:#a7cf3a;color:#a7cf3a;}
.spec .btn:hover{background-color:#a7cf3a;color:#333333;}
.spec h1,
.spec h2,
.spec h3{line-height:120%;}
.spec h1{color:#a7cf3a;}
.spec h2,
.spec h3{font-size:18px;}
.spec ul:after,
.spec li:after{content:'';display:table;clear:both;}
.spec li{margin-bottom:5px;}
.spec h3{float:left;width:40px;color:#999999;font-size:14px;line-height:20px;margin-bottom:0;}
.spec p{float:none;width:auto;clear:none;margin-left:50px;font-size:12px;line-height:20px;}
.showcase{width:70%;min-height:720px;float:right;background-color:#666666;-moz-box-sizing:border-box;box-sizing:border-box;padding:5px;}
.showcase img{display:block;float:left;width:50%;-moz-box-sizing:border-box;box-sizing:border-box;padding:5px;}
.showcase img.col-1-2{width:50%;}
.showcase img.col-1-3{width:33.333333%;}
.showcase img.col-1-4{width:25%;}
.showcase img.clearblock{width:100%;}
.showcase img.centered{float:none;width:100%;max-width:800px;margin:0 auto;padding:10px 0;}
.showcase p a{color:#a7cf3a;font-weight:normal;}
.showcase p a:hover{text-decoration:underline;}
.awwwards{display:block;width:70px;height:105px;position:absolute;z-index:10;top:40px;right:-1px;overflow:hidden;text-indent:-8000px;background-color:transparent !important;background-image:url(images/awwwards_honorable_black_right.png);background-repeat:no-repeat;background-position:0 0;}
@media only screen and (-Webkit-min-device-pixel-ratio:1.5), only screen and (-moz-min-device-pixel-ratio:1.5), only screen and (-o-min-device-pixel-ratio:3/2), only screen and (min-device-pixel-ratio:1.5){.awwwards{background-image:url(images/awwwards_honorable_black_right2x.png);background-size:70px 105px;}
}
@media only screen and (max-width:1240px){.bio{width:25%;padding:60px;}
.chat{width:50%;}
.services .block .inner{margin:60px auto;}
.thumbs li,
.thumbs li.feat{width:33.333%;}
.thumbs li .info .inner,
.thumbs li.feat .info .inner{padding:10px 15px;}
.thumbs li:hover .arrow,
.thumbs li.feat:hover .arrow{-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px);}
.contact .inner{margin:180px auto;}
.spec h1{font-size:22px;}
.spec h2{font-size:16px;}
}
@media only screen and (max-width:1140px){.definition{padding:60px 80px;}
.services .block{width:50%;}
.services .block .inner{margin:40px auto;padding:20px 40px;max-width:360px;}
.strategy .arrow{display:none;}
.awards{padding:60px 40px;}
.testimonials{padding:60px 80px;}
.bio,
.pic,
.chat{width:33.333%;}
.chat{padding:40px 20px;}
.work-nav .inner{padding:0 10px;}
.spec,
.showcase{float:left;width:100%;}
.spec{position:static;-moz-box-sizing:border-box;box-sizing:border-box;border:solid 5px #666;background-color:#333333;}
.spec .inner{margin:40px auto 60px;padding:0 40px;}
}
@media only screen and (max-width:1024px){a:hover,
a:active,
a:focus{color:#666666;}
.hero,
.definition{width:100%;height:auto !important;}
.definition{text-align:center;padding:60px 40px;}
.definition .arrow{width:80px;height:40px;left:50%;margin-left:-40px;margin-top:0;top:-10px;}
.definition .arrow svg{top:-40px;left:0;}
.awards,
.testimonials{width:100%;height:auto !important;}
.testimonials{padding:80px;}
.thumbs .feat .inner img{margin-bottom:90px;}
.thumbs .inner img{margin-bottom:70px;}
.thumbs .feat .inner a img,
.thumbs .inner a img{margin:0;}
.thumbs .info{position:relative;bottom:auto !important;z-index:0;top:auto;bottom:0;}
.thumbs .info .arrow{display:block;top:-20px;}
.thumbs li .arrow,
.thumbs li:hover .arrow,
.thumbs li.feat .arrow,
.thumbs li.feat:hover .arrow{top:-20px;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);}
.thumbs li img,
.thumbs li:hover img,
.thumbs li.feat img,
.thumbs li.feat:hover img{top:0;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);}
.thumbs li .info,
.thumbs li:hover .info,
.thumbs li.feat .info,
.thumbs li.feat:hover .info,
.thumbs li .arrow,
.thumbs li:hover .arrow,
.thumbs li.feat .arrow,
.thumbs li.feat:hover .arrow{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);}
}
@media only screen and (max-width:960px){.awwwards{top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);}
.bio{width:66.666%;height:auto !important;padding:80px;}
.chat{width:100%;height:auto !important;padding:60px 40px;}
.contact .inner{padding:0 40px;}
.thumbs .feat .inner img,
.thumbs .inner img{margin-bottom:70px;}
.thumbs li,
.thumbs li.feat{width:50%;}
.thumbs .feat .arrow,
.thumbs .feat:hover .arrow{top:-20px;}
.thumbs .feat .info .inner{padding:10px 15px;}
}
@media only screen and (max-width:840px){.header .social{display:none;}
.work-nav li.close,
.work-nav li.prev,
.work-nav li.next{width:33.333%;}
.spec .work-nav li.close,
.spec .work-nav li.prev,
.spec .work-nav li.next{width:auto;}
}
@media only screen and (max-width:800px){.showcase img.centered{padding:5px;}
.bio{padding:80px;}
.awwwards{display:none;}
}
@media only screen and (max-width:680px){h1,
h2,
h3,
h4{font-size:22px;}
.definition h1 span{font-size:26px;top:-2px;}
.bio,
.pic{width:50%;}
.bio{padding:60px;}
.testimonials{padding:60px 50px;}
}
@media only screen and (max-width:600px){.services .block{width:100%;height:auto !important;}
.services .block .arrow{display:block;width:80px;height:40px;left:50%;margin-left:-40px;margin-top:0;top:-10px;}
.services .block .arrow svg{top:-40px;left:0;}
.bio{padding:60px 40px;}
.thumbs{padding:0;}
.thumbs li,
.thumbs li.feat{width:100%;}
.showcase img{width:100%;}
.awards{padding:40px;}
.awards svg{width:90px;height:60px;}
.work-nav li.close{display:none;}
.spec .work-nav li.close{display:block;}
.work-nav li.prev,
.work-nav li.next{width:50%;}
.spec .work-nav li.prev,
.spec .work-nav li.next{width:auto;}
.spec .inner{margin:20px auto 40px;padding:0 20px;}
}
@media only screen and (max-width:520px){.home .pitch{max-width:240px;}
.home h1{font-size:28px;line-height:32px;padding:0 5px;margin-bottom:15px;}
.home p{font-size:12px;}
.home img{top:50px;right:-70px;}
.home .btn{margin-top:15px;}
.home #sketch-arrow{top:80px;left:-15px;}
#device{margin-bottom:25px;}
.xpert-logix{width:30px;height:30px;margin-left:-35px;bottom:10px;}
.xpert-logix svg{width:30px;height:30px;}
.hero{padding:40px 10px;}
.hero .centerV{max-width:360px;}
.bio,
.pic{width:100%;}
.bio{padding:60px 40px;}
.pic{height:300px;}
.pic a{opacity:0.2;-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1);}
.pic .icon{opacity:1;-webkit-transform:scale(1.5);-ms-transform:scale(1.5);transform:scale(1.5);}
.pic .arrow{width:80px;height:40px;left:50%;margin-left:-40px;margin-top:0;top:-10px;}
.pic .arrow svg{top:-40px;left:0;}
.awards{padding:40px 20px;}
.awards svg{width:75px;height:50px;}
.testimonials{padding:60px 30px;}
.testimonials h2{font-size:12px;}
.testimonials .flickity-page-dots{padding-left:5px;}
.testimonials .flickity-page-dots .dot{margin:0 5px;}
.showcase img.col-1-3{width:100%;}
.contact .inner{margin:100px auto;}
.footer #xpert{margin-left:20px;}
}
@media only screen and (max-width:320px){#device{width:200px;height:100px;}
}
@media only screen and (max-height:580px){.xpert-logix{position:relative;bottom:auto;left:auto;padding:0;margin:35px auto 0;}
}