@import url(reset.css);

html {height:100%;}
body {font-family:'RobotoRegular', sans-serif;height:100%;}

.clear {clear:both;height:0;position:relative;}

header {height:75px;background:#141414;position:fixed;width:100%;z-index:1;}
header nav {position:absolute;width:50px;left:50%;margin-left:-25px;top:35px;height:40px;}
header nav a {display:block;width:15px;height:15px;border-radius:50%;}
header nav a.neo {float:left;background-color:#ff0000 !important;}
header nav a.kongres {float:right;background:#009ee0;}
header nav .pointer {width:15px;height:8px;background:url(../images/pointer.png) no-repeat;position:absolute;bottom:0;}
header nav .p-kongres {right:0;background:url(../images/pointer-kongres.png) no-repeat;}
header div#beta {width:30px;height:75px;background:url(../images/b.png) no-repeat;float:left;}
header #logo {float:left;display:block;}
#logo {width:150px;height:75px;background:url(../images/logo.png) 18px center no-repeat;}
#more {color:#fff;font-size:12px;float:right;font-family:'RobotoBold';margin-top:20px;padding-right:20px;padding-left:20px;border-left:1px solid #434343;}
#more span {display:block;font-family:'RobotoItalic';}
#more a {color:#fff;text-decoration:none;}
#more a:hover {text-decoration:underline;}
#more ul li {float:left;width:20px;height:15px;margin-left:10px;list-style:none;overflow:hidden;position:relative;}
#more ul li span {display:inline-block !important;width:11px;height:11px;border-radius:50%;cursor:pointer;}
#more ul li.dot-lb span {background:#ff0000;}
#more ul li.dot-pg span {background:#99cc00;}
#more ul li.dot-kon span {background:#009ee0;}
#more ul li p {position:absolute;top:-1px;left:15px;}
#more ul li a {color:#acacac;}
#more ul li a.active {text-decoration:underline;}

section#mobile {width:960px;margin:auto;position:relative;height:525px;}
section#mobile h2 {padding-top:135px;text-transform:uppercase;border-bottom:1px solid #ededed;padding-bottom:22px;display:inline-block;font-family:'RobotoBold', sans-serif;font-size:48px;}
section#mobile p {padding-top:17px;width:437px;font-size:12px;line-height:18px;}
section#mobile .smudges {width:657px;height:290px;background:url(../images/smudges-blue.png) no-repeat;position:absolute;right:-30px;top:210px;}
section#mobile .smudges-gray {width:960px;z-index:-2;position:absolute;height:185px;background:url(../images/smudges-gray.png) -284px 0 no-repeat;right:-30px;top:323px;}
section#mobile img {
    transform: scale(0.6);
    -moz-transform: scale(0.6);
    -webkit-transform: scale(0.6);
    -o-transform: scale(0.6);
    transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    position:absolute;
    top:114px;
    right:0px;
    z-index:-1;
}
section#mobile img.onhover {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}

section#design {width:960px;margin:auto;position:relative;height:493px;}
section#design img {
    -moz-transform:scale(0.8);
    -o-transform:scale(0.8);
    -webkit-transform:scale(0.8);
    transform:scale(0.8);
    transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    position:absolute;
    z-index:-1;
}
section#design img.onhover {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}

section#design .smudges {width:711px;height:165px;background:url(../images/smudges-red.png) no-repeat;position:absolute;left:-48px;top:160px;}
section#design .smudges-gray {width:960px;height:489px;background:url(../images/smudges-gray-2.png) -341px 0 no-repeat;position:absolute;z-index:-2;top:-243px;left:-150px;}
section#design h2 {padding-top:35px;text-transform:uppercase;border-bottom:1px solid #ededed;padding-bottom:22px;display:inline-block;font-family:'RobotoBold', sans-serif;font-size:48px;float:right;width:450px;line-height:30px;}
section#design h2 span {font-size:30px;text-transform:none;font-family:'RobotoLight';display:block;padding-top:5px;}
section#design h2 span strong {font-family:'RobotoBold';}
section#design p {padding-top:17px;width:437px;font-size:12px;line-height:18px;float:right;margin-right:13px;}

section#google {height:465px;width:960px;margin:auto;position:relative;}
section#google h2 {padding-top:120px;text-transform:uppercase;border-bottom:1px solid #ededed;padding-bottom:22px;display:inline-block;font-family:'RobotoBold', sans-serif;font-size:48px;float:left;width:357px;line-height:42px;}
section#google h2 span {font-family:'RobotoLight';}
section#google img {position:absolute;right:0;top:50px;}
section#google .smudges {width:769px;height:451px;background:url(../images/smudges-yellow.png) no-repeat;position:absolute;top:-43px;right:8px;}
section#google .smudges-gray {width:1035px;height:614px;background:url(../images/smudges-gray-3.png) no-repeat;position:absolute;z-index:-2;top:-371px;left:-156px;}
section#google p {padding-top:17px;width:360px;font-size:12px;line-height:18px;float:left;margin-right:13px;}

section#marketing {height:610px;position:relative;width:960px;margin:auto;}
section#marketing .smudges {width:769px;height:451px;background:url(../images/smudges-yellow-2.png) no-repeat;position:absolute;top:-135px;left:8px;}
section#marketing img {position:absolute;top:67px;z-index:-1;}
section#marketing h2 {padding-top:67px;text-transform:uppercase;border-bottom:1px solid #ededed;padding-bottom:22px;display:inline-block;font-family:'RobotoBold', sans-serif;font-size:48px;float:right;width:435px;line-height:42px;}
section#marketing h2 span {font-size:30px;font-family:'RobotoLight';line-height:29px;}
section#marketing p {padding-top:17px;width:421px;font-size:12px;line-height:18px;float:right;margin-right:13px;}

/* about */
div.about-outer {}
section#about-wrapper {width:960px;margin:auto;position:relative;padding-top:75px;}
section#about-wrapper .intro {position:relative;width:600px;margin:auto;font-family:'RobotoRegular';font-size:12px;padding-top:95px;padding-bottom:70px;border-bottom:1px solid #ededed;}
section#about-wrapper .intro h1 {font-size:50px;font-family:'RobotoBold';padding-bottom:10px;font-weight:300;padding-top:35px;}
section#about-wrapper .intro span {position:absolute;top:-20px;right:125px;font-size:230px;font-family:'RobotoBold';}
section#about-wrapper .intro p {padding-bottom:15px;line-height:16px;width:500px;}
section#about-wrapper .intro ul {list-style-position:inside;}

h2.areas {font-family:'RobotoBold';font-size:37px;text-transform:uppercase;width:543px;margin:auto;font-weight:300;padding-top:27px;}

section#areas {padding-top:50px;height:840px;position:relative;}
section#areas img {position:absolute;}
section#areas img.desktop {top:95px;left:30px;}
section#areas img.mobile {right:76px;top:84px;}
section#areas img.seo {top:390px;right:24px;}
section#areas img.marketing {bottom:78px;left:97px;}

#areas .area-item {}
#areas div.cloud {position:absolute;padding:10px 30px;background:#e7e7e7;border-radius:5px;top:0;left:0;}
.arrow-lb, .arrow-rb, .arrow-lt {position:absolute;}
.arrow-lb {width:35px;height:56px;background:url(../images/arrow-lb.png) no-repeat;}
.arrow-rb {width:39px;height:57px;background:url(../images/arrow-rb.png) no-repeat;bottom:-45px;left:40px;}
.arrow-lt {width:35px;height:55px;background:url(../images/arrow-lt.png) no-repeat;left:-19px;top:-45px;}

#areas div.cloud-monitor {top:60px;left:257px;}
#areas div.cloud-google {top:30px;left:620px;}
#areas div.cloud-marketing {top:805px;left:329px;}
#areas div.cloud-seo {top:444px;left:500px;}


h2.trust {margin-top:80px;padding-top:30px;padding-bottom:53px;text-transform:uppercase;font-weight:300;font-size:37px;text-align:center;width:445px;margin:auto;font-family:'RobotoBold';border-top:1px solid #ededed;}

section#trust table {padding-bottom:100px;width:960px;display:block;}
section#trust td {width:238px;border:2px solid #f2f2f2;height:131px;vertical-align:middle;text-align:center;}

footer {background:#f1f1f1;height:43px;width:100%;position:fixed;bottom:0;left:0;z-index:11;}
footer nav ul {float:right;margin-right:24px;}
footer nav ul li {float:left;padding-top:9px;font-size:12px;height:34px;}
footer nav ul li.last a {border:none;}
footer nav ul li a {display:block;border-right:1px solid #e0e0e0;height:24px;line-height:24px;padding:0 9px;color:#333;text-decoration:none;}
footer nav ul li:hover {background:#acacac;}
footer nav ul li a:hover {color:#fff;border-color:#acacac;}
footer nav ul li.active {background:#acacac;}
footer nav ul li a.active {color:#fff;border-color:#acacac;}

.cs-selector {height:265px;background:#141414;width:100%;position:relative;z-index:10;padding-bottom:43px;box-shadow:0px -10px 5px #aaa;}
.cs-selector .cs-see-more {width:314px;height:40px;margin:auto;position:relative;top:-20px;background:url(../images/cs-more-btn.png) no-repeat;}
.cs-selector ul {width:484px;margin:auto;list-style-type:none;}
.cs-selector ul li {float:left;width:241px;text-align:center;border-right:1px solid #040404;border-left:1px solid #101010;}
.cs-selector ul li.first {border-left-width:0;}
.cs-selector ul li.last {border-right-width:0;}

.contact {height:100%;}

#case {padding-top:75px;}
div#main {padding-top:75px;}

html.case-showcase article#main {height:100%;}
div#jms-slideshow {height:100% !important;}
div.jms-wrapper {height:100%;}

section#trust {padding:0 119px;}

.contact-body .con-details {position:absolute;z-index:1;top:90px;left:75px;width:525px;height:350px;background:url(../images/contact-bg.png);}
.contact-body .con-details .left {width:175px;float:left;padding:20px;}
.contact-body h1 {color:#fff;font-size:28px;font-family:'RobotoThin';}
.contact-body p {color:#fff;padding-top:30px;}
.contact-body p span {display:block;font-weight:700;padding-bottom:3px;}

.contact-body .right {color:#fff;float:left;width:310px;padding-top:20px;}
.contact-body form input[type=text] {display:block;width:230px;height:31px;background:#fff;float:left;border:none;padding:0 5px;font-family:Arial;}
.contact-body .input-item {padding-bottom:5px;}
.contact-body .icon-name {float:left;width:31px;height:31px;background:url(../images/icon-name.png) no-repeat;}
.contact-body .icon-env {float:left;width:31px;height:31px;background:url(../images/icon-env.png) 1px 0 no-repeat;}
.contact-body .icon-i {float:left;width:31px;height:31px;background:url(../images/icon-i.png) no-repeat;}
.contact-body .icon-pencil-2 {float:left;width:31px;height:31px;background:url(../images/icon-pencil-2.png) no-repeat;}
.contact-body textarea {padding:5px;float:left;width:230px;height:150px;border:none;margin:0;font-family:Arial;font-size:13px;}
.contact-body input[type=submit] {width:240px;height:33px;background:url(../images/submit-bg.png) no-repeat;border:none;margin-right:39px;float:right;cursor:pointer;}