body {font-family: Helvetica, Arial, sans-serif; background: #1f1f1f; padding: 0; margin: 0; color: #fff; line-height: 1.4;}

/* Typo */
h1 { font-size: 36px; color: #fff; font-weight: normal;}
h2 { font-size: 26px; color: #fff; font-weight: normal;}
h3 { font-size: 16px; color: #fff; font-weight: normal;}
h4 { font-size: 14px; color: #fff; font-weight: normal;}
h5 { font-size: 12px; color: #fff; font-weight: normal;}
h6 { font-size: 11px; color: #fff; font-weight: normal;}

hgroup h3, hgroup h3 a { color: #9aa8ad !important; }
hgroup h1, hgroup h1 a { color: #51add3 !important; }
h3 a { text-decoration: underline; }
h1, h2, h3, h4, h5, h6 { line-height: 0.5em; margin: 0px; }

a {color: #2a708e; text-decoration: none;}
a img {border: 0;}
a:visited { color: #104258; }
a:active { background: #eaf7fc; }
a:hover { color: #0c1e2f; }

hr {border-bottom: 0px; border-left: 0px; border-right: 0px; border-top: 1px dotted #d9d9d9;}

.floatleft {float: left;}
.floatright {float: right;}

/* Template */
header {width: 100%; margin: 0px auto; padding: 0px; display: block; background:url(../Images/nav-bg.png) top left repeat-x; position: fixed; z-index: 10000;}
header li a {outline: none;}
nav {width: 980px; margin: 0px auto; overflow: hidden; font-size: 2.0em; font-weight: bold; display: block;}
nav ul {padding: 0 0 0 40px; margin: 0;}
nav ul li {list-style: none; float: left;}
nav a {font-family: Helvetica, Arial, sans-serif; font-size: 18px; font-weight: normal; text-decoration: underline; color: #fff !important; display: block; padding: 13px 30px 15px 0px;}
nav a:hover {color: #fff; text-decoration: none; background: transparent;}
nav .twitter {padding: 2px 0px 0px 80px; float:right; visibility: hidden;}	
nav .twitter a {background:url(../Images/twitter.png) left no-repeat; padding-left: 40px;padding-top:33px; font-size: 14px; }	

#content {width: 980px; margin: 0px auto; padding: 80px 0px; display: block;}

.main {display: table; width: 980px; height: auto; }

.services {display: table; width: 960px; height: auto;padding: 30px 0px 20px 20px; background-color: #2a2a2a; background-image: url(../Images/services-bg.png); background-repeat: repeat-x; background-position: bottom; -webkit-border-top-left-radius: 6px; -webkit-border-top-right-radius: 6px; -moz-border-radius-topleft: 6px; -moz-border-radius-topright: 6px; border-top-left-radius: 6px; border-top-right-radius: 6px; box-shadow: 0px 0px 20px 0px #000,0px 40px 20px 0px #000;}
.services ul {padding: 5px 0 20px 0; margin: 0;}
.services ul li {list-style: none; float: left; width: 420px; padding: 0px 30px 0px 0px;}
.services .net {background-image: url(../Images/net.png); background-repeat: no-repeat; background-position: bottom; width: 400px; height: 300px;}
.services .apple {background-image: url(../Images/apple.png); background-repeat: no-repeat; background-position: bottom; width: 400px; height: 300px;}

.cicle {display: block; width: 900px; height: auto; padding: 20px 40px 40px 40px; background-color: #2a2a2a;}
.cicle ul {padding: 20px 0 20px 0; margin: 0;}
.cicle ul li {list-style: none; float: left; font-size: 14px; padding: 5px 20px 5px 0px}

.benefits {display: block; width: 900px; height: 170px; padding: 30px 40px 20px 40px; margin-top: 40px; background:url(../Images/benefits-bg.png) no-repeat;}
.benefits ul.points {padding: 20px 0; margin: 0;}
.benefits ul.points li {list-style: none; float: left; height: 57px; padding: 0px 30px 0px 70px; width: 200px; background:url(../Images/123.png) no-repeat;}
.benefits ul.points li.one {background-position: 0px 0px;}
.benefits ul.points li.two {background-position: 2px -57px;}
.benefits ul.points li.three {background-position: 0px -114px;}

.contact {padding: 50px 40px 60px 40px; width: 450px; height: 400px; display: block;}
.contact-email, .contact-subject{ position: relative; top: 20px; background:url(../Images/contact-input.png) no-repeat top left; border:none; color:#fff; font-family:Georgia,serif; font-size: 18px; height: 24px; left:0; padding:8px 11px 10px; width:360px;}
.contact-subject {position: relative; top: 40px;}
.contact-message {position: relative; top: 60px; resize: none; background:url(../Images/contact-area.png) no-repeat top left; border:none; color:#fff; font-family:Georgia,serif; font-size:18px; height:200px; padding:8px 11px 10px; width:540px;}
.contact-captcha {position: relative; top: 70px; color:#787878; height:22px; line-height:20px;}
.contact-captcha strong{ color:#fff; font-weight:normal;}
.contact-captcha input{ background:url(../Images/contact-number.png) no-repeat top left; vertical-align:middle; border:none; color:#fff; font-size:12px; height:16px; margin-left:2px; padding:3px 5px; width:62px;}
.contact-captcha .change{ background: none; background-color: #242527; color:#fff; font-size:12px; width:70px; height: auto; border: 1px solid #646466}
.contact-captcha img{vertical-align:middle;}
.contact-submit{ position: relative; top: 80px; background:url(../Images/send-btn.png) no-repeat top left; width: 145px; height: 37px; border: 0px; cursor: pointer}
.contact-submit:hover { background-position: 0px -37px; cursor: pointer}

.contact-info {padding: 60px 40px 60px 40px; width: 450px; height: 100px; display: block; color: #ffffff;}
.contact-info ul {padding: 20px 0 20px 0; margin: 0;}
.contact-info ul li {list-style: none; font-size: 14px; padding: 5px 20px 5px 0px; vertical-align:middle;}
.contact-info ul li img {vertical-align:middle;}

footer {width: 100%; display: block; background: #292929; height: 80px; text-align: center; padding: 0px; margin: 0px; box-shadow: 0px 0px 20px 0px #000;}
footer .copy {width: 900px; margin: 0px auto; padding: 30px 0px 0px 0px; font-size: 14px; font-weight: normal; text-align: left; color: #c1c1c1; vertical-align: middle;}
footer .copy .twitter{padding: 2px 0px 0px 160px; list-style-type: none; display: inline; visibility: hidden;}
footer .copy .twitter a {background:url(../Images/twitter-small.png) left no-repeat; padding-left: 24px; font-size: 14px; visibility: hidden;}
footer .copy .partners{padding: 2px 0px 0px 50px; list-style-type: none; display: inline;}
footer .copy .partners a{color: #c1c1c1;}
.loadBar {padding: 2px 5px; background-color: #eeeeee; font: bold 14px Arial; color: #333333; margin-left: 5px; position:fixed; display:none;}

#notifier {position: absolute;width: 350px; z-index: 20000}
#notifier SPAN.message {color: #000}
#notifier SPAN.error {color: #C30}
.msg {padding: 2px 5px; background-color: #eeeeee; font: bold 14px Arial; color: #333333; margin-left: 5px;}
.partners {display: block; height: auto; padding: 20px 40px 40px 40px;}
.partner {padding: 10px 0px 0px 0px; display:block;}
.partner a {color: #2A708E;}

.portfolio {display: block; width: 900px; height: auto; padding: 0px 40px 40px 40px; background-color: #2a2a2a; box-shadow: 0px 20px 20px -20px #000, 20px 0px 20px -20px #000, -20px 0px 20px -20px #000, -20px 20px 20px -20px #000, 20px 20px 20px -20px #000;}

.portfolio .image-frame{
    overflow-x: auto;
    /*width: 1000px;*/
    background-color: #292929;
}

.portfolio .image-list{
    /*width: 1475px;*/
    white-space: nowrap;
    display: block;
}

.portfolio .image-list .image-item {
    display: inline;
}

.image-item img {
    margin: 10px 13px 10px 4px;
    border: 1px solid #fff;
    -webkit-box-shadow: 0 3px 5px rgba(0,0,0,.3);
}

.portfolio h2 {
    line-height: 1em !important;
    margin: 20px 0 0 0;
}

.bottom-shift {
    margin-bottom: 37px;
}

.portfolio h2 {
    text-align: center;

    /*-webkit-margin-before: 0.83em !important;
    -webkit-margin-after: 0.0em !important;
    -webkit-margin-start: 140px;
    -webkit-margin-end: 0px;*/
    margin-left: 140px;
    margin-top:0.83em !important;
}

h2 img {
    vertical-align: middle;
    float:right;
    top:-10px;
    position:relative;
}

/* Custom scrollbars for Chrome */
::-webkit-scrollbar { width: 5px; height: 5px;}
::-webkit-scrollbar-button {  background-color: #666; }
::-webkit-scrollbar-track {  background-color: #999;}
::-webkit-scrollbar-track-piece { background-color: #292929;}
::-webkit-scrollbar-thumb { height: 50px; background-color: #444; border-radius: 3px;}
::-webkit-scrollbar-corner { background-color: #999;}
::-webkit-resizer { background-color: #666;}


