/*-- Global styles --*/

/* HTML5 tags */
header, section, footer, aside, nav, article, figure { display: block; margin:0; padding:0}

/*-- Fonts --*/

@font-face {
	font-family: 'ss-new';
	src:url('/fonts/ss-new.eot?8yxtlt');
	src:url('/fonts/ss-new.eot?#iefix8yxtlt') format('embedded-opentype'),
		url('/fonts/ss-new.woff?8yxtlt') format('woff'),
		url('/fonts/ss-new.ttf?8yxtlt') format('truetype'),
		url('/fonts/ss-new.svg?8yxtlt#ss-new') format('svg');
	font-weight: normal;
	font-style: normal;
}

[class^="new-"], [class*=" new-"] {
	font-family: 'ss-new';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.new-mail:before {
	content: "\e600";
}
.new-user:before {
	content: "\e601";
}
.new-comment:before {
	content: "\e602";
}
.new-brush:before {
	content: "\e603";
}
.new-arrow-down:before {
	content: "\e604";
}
.new-arrow-up:before {
	content: "\e605";
}


/*-- Header --*/

.phead {background: #eaeaea url(/images/bg-nav-top.jpg) repeat-x center 0; height: 54px; 

        /*border-bottom: 1px solid #b3b3b3;
         -moz-box-shadow: 0 3px 7px 0 #b3b3b3;
         -webkit-box-shadow: 0 3px 7px 0 #b3b3b3;
         box-shadow: 0 3px 7px 0 #b3b3b3;*/

}
.phead h1.logo {}
.phead h1.logo a {background: url(../images/logo-ss-v2.png) no-repeat 8px 0; padding: 0 0 26px 0; display: block; text-indent: -9999px; width: 140px;}
.phead div.logo a {background: url(../images/logo-ss-v2.png) no-repeat 8px 0; padding: 0 0 26px 0; display: block; text-indent: -9999px; width: 140px;}
.phead h1.logo a:hover {background: url(../images/logo-ss-v2.png) no-repeat 8px -47px; padding: 0 0 26px 0; display: block; text-indent: -9999px; width: 140px;}
.phead div.logo a:hover {background: url(../images/logo-ss-v2.png) no-repeat 8px -47px; padding: 0 0 26px 0; display: block; text-indent: -9999px; width: 140px;}


.phead nav {float: right; margin: -24px 0 0 0;}
.phead nav ul li {display: inline;}

.phead nav ul li {font-family: helvetica, sans-serif; font-size: 11px; font-weight: bold;}
.phead nav ul li a {text-decoration: none; color: #a8a8a8;}
.phead nav ul li a:hover {text-decoration: none; color: #7f7f7f;}

.phead nav ul li a.nav-me {background: url(/images/icon-me.png) no-repeat 2px 0; padding: 24px 5px 0 5px;}
.phead nav ul li a.nav-me:hover {background: url(/images/icon-me.png) no-repeat 2px -80px;}

.phead nav ul li a.nav-team {background: url(/images/icon-team.png) no-repeat 12px 0; padding: 24px 5px 0 5px; margin: 0 0 0 18px}
.phead nav ul li a.nav-team:hover {background: url(/images/icon-team.png) no-repeat 12px -82px;}

.phead nav ul li a.nav-blog {background: url(/images/icon-blog.png) no-repeat 6px 0; padding: 27px 5px 0 5px; margin: 0 0 0 18px}
.phead nav ul li a.nav-blog:hover {background: url(/images/icon-blog.png) no-repeat 6px -77px;}

.phead nav ul li a.nav-contact {background: url(/images/icon-contact.png) no-repeat 14px 0; padding: 22px 5px 0 5px; margin: 0 18px 0 0}
.phead nav ul li a.nav-contact:hover  {background: url(/images/icon-contact.png) no-repeat 14px -85px;}

.phead nav ul li a.nav-projects {background: url(/images/icon-projects.png) no-repeat 15px 0; padding: 22px 5px 0 5px; margin: 0 0 0 10px}
.phead nav ul li a.nav-projects:hover  {background: url(/images/icon-projects.png) no-repeat 15px -85px;}

.phead .inner {width: 960px; margin: 0 auto; position: relative; padding:10px 0 0 0; }

.sticky {position: fixed; top: 0; width: 100%; z-index: 100 }

/* Body */

article a {text-decoration: underline;}


/* Project footer */

section.proj-footer {background: repeat 0 0; text-align: left; margin: 40px 0 0 0; padding: 0 0 20px 0;}
section.proj-footer .inner {width: 960px; padding: 40px 0; margin: 0 auto;}

section.proj-footer .row {width: 960px;}
section.proj-footer .column, section.proj-footer .columns { float: left; min-height: 1px; padding: 0 0; position: relative; }

section.proj-footer ul li {float: left; padding: 0 35px 0 0;}

section.proj-footer p {font-size: 10px; text-transform: uppercase; height: 134px; width: 70px; padding: 80px 0 0 0; text-align: center;}

.contact-form {margin: 0 0 20px 0;}
.contact-form form {background: url(../images/bg-form.png) no-repeat 0 0; width: 328px; height: 140px; padding: 12px;}
.contact-form form input.txt {width: 224px; height: 24px; margin: 0 0 10px 0;}
.contact-form form textarea {width: 250px; height: 80px; }
.contact-form form input.sbmt {position: relative; top: 6px; left: 5px;}

.contact-form label {display: none;}
.contact-form .error {border: 2px solid red}
#response {font-family: "proxima-nova", helvetica, sans-serif; font-size: 14px; font-weight: bold; }
.contact-form input.txt, #cvform input.email, .contact-form textarea.msg {font-family: helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #999999; padding: 2px 0 0 4px;}


section.proj-footer .share-cntr {background: repeat 0 0; padding: 14px 14px 10px 14px; }

section.proj-footer .share-fb {float: left; width: 48px; overflow: hidden; margin-right: 14px;}
section.proj-footer .share-twit {float: left; width: 56px; overflow: hidden; margin-right: 14px;}
section.proj-footer .share-google {float: left; width: 32px; overflow: hidden; margin-right: 14px;}
section.proj-footer .share-pin {float: left; width: 46px; overflow: hidden; margin-right: 14px;}
section.proj-footer .share-linkedin {float: left; overflow: hidden;}

/*-- Footer --*/

footer {background-color: #eaeaea; position: relative; height: 54px;}
footer .inner {padding: 20px 0 0 0; width: 960px; margin: 0 auto;}

footer p.copy {font-family: helvetica, sans-serif; font-size: 14px; color: #b6b6b6; float: left; padding: 4px 0 0 8px;}

footer nav {float: right;}
footer nav ul li {float: left;}
footer nav ul li a {display: block; text-indent: -9999px;}

footer nav ul li a.instagram {background: url(../images/icon-instagram.png) no-repeat 0 0; width: 28px; padding: 0 0 4px 0;}
footer nav ul li a.twitter {background: url(../images/icon-twitter.png) no-repeat 0 0; width: 28px; margin: 0 0 0 10px; padding: 0 0 4px 0; }
footer nav ul li a.linkedin {background: url(../images/icon-linkedin.png) no-repeat 0 0; width: 28px; margin: 0 0 0 10px; padding: 0 0 4px 0;}
footer nav ul li a.pinterest {background: url(../images/icon-pinterest.png) no-repeat 0 0; width: 28px; margin: 0 0 0 10px; padding: 0 0 4px 0;}


/* New Proj Template */

.proj-tmp .row {width: 960px; max-width: 100%; margin: 0 auto;}

.proj-tmp .column { float: left; min-height: 1px; position: relative;}

.proj-tmp .col50 {width: 50%;}
.proj-tmp .col33 {width: 33.3333333333333%;}

.proj-tmp {
    text-align: center;
}

.proj-tmp img {
    max-width: 100%;
}

.proj-tmp .new-arrow-down, .proj-tmp .new-arrow-up {
    font-size: 30px;
    text-decoration: none;
}

.proj-tmp a.new-arrow-up {
    color: #242424;
}

.proj-tmp a.new-arrow-down {
    color: #ffffff;
}

.proj-tmp a.new-arrow-down:hover, .proj-tmp a.new-arrow-up:hover {
    color: #55d607;
}

.proj-tmp .nav-inpage {
    padding-bottom: 41px;
}

.proj-tmp .content .central-container {
    padding: 0 0 82px 0;
    margin: 0 auto;
}

.proj-tmp div.content img {
    background:#FFF url(../images/ajax-loader.gif) no-repeat center center;
}

.proj-tmp div.content .col50 .inner {
    padding: 0 10px;
}

.proj-tmp div.content img.loaded {
    background: none;
}

.proj-tmp .content .central-container img {
    max-width: 100%;
    height: auto;
}

.proj-tmp .content .row {
    padding: 0 0 82px 0;
}

.proj-tmp .top-container .divider {
    background: url('../images/proj-divider.png') no-repeat center top;
}

.proj-tmp .top-container {
   padding: 82px 0 62px;
   
   position: relative;
   background: black;
}

.proj-tmp .top-container h1 {
     font-family: "proxima-nova", helvetica, sans-serif; 
     color: #ffffff; 
     font-size: 38px; 
     font-weight: bold;
     text-transform: uppercase;
     letter-spacing: 12px;
     padding: 0 0 36px 0;
}

.proj-tmp .top-container h3 {
    font-family: "proxima-nova", helvetica, sans-serif; 
    color: #bdbdbd;
    padding: 60px 0 36px 0;
    font-weight: 100;
    font-style: italic;
}

.proj-tmp div.content {
    margin: 82px 0 0 0;
}



.proj-tmp .proj-fulldesc {
    text-align: left;
    padding: 82px 0;
    font-family: "proxima-nova", helvetica, sans-serif; 
    background-color: #242424;
    color: #9c9c9c;
}

.proj-tmp .proj-fulldesc .inner-l {
    padding-right: 41px;
    border-right: 1px solid #434343;
}

.proj-tmp .proj-fulldesc .inner-r {
    padding-left: 41px;
}

.proj-tmp .proj-fulldesc h2 {
    font-weight: 100;
    text-transform: uppercase;
    padding-bottom: 10px;
}

.proj-tmp .proj-fulldesc p {
    font-weight: 100;
    font-size: 18px;
    line-height: 32px;
    padding-bottom: 30px;
}

.proj-tmp .proj-fulldesc a {
    color: #c5c5c5;
    text-decoration: none;
    background-color: #4a4a4a;
    padding: 6px 10px;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.proj-tmp .proj-fulldesc a:hover {
    color: #ffffff;
    background-color: #55d607;
}

.proj-tmp .proj-fulldesc p.note {
    font-weight: 100;
    font-size: 13px;
    line-height: 21px;

    padding-bottom: 0;
}

.proj-tmp .proj-fulldesc ul {
    padding: 0 0 0 40px;
    margin: 0 0 30px 0;
    
}

.proj-tmp .proj-fulldesc ul li {
    font-weight: 100;
    list-style-type: disc;
    font-size: 18px;
    line-height: 32px;
}

.bethebrand .top-container {
    background: url('/images/header-btb.jpg') center center;
    background-size: cover;
}

.cilconsultants .top-container {
    background: url('/images/header-cil.jpg') center center;
    background-size: cover;
}

.goaldifference .top-container {
    background: url('/images/header-gd.jpg') center center;
    background-size: cover;
}

.healthcareapp .top-container {
    background: url('/images/header-ha.jpg') center center;
    background-size: cover;
}

.harmonic .top-container {
    background: url('/images/header-harm.png') center center;
    background-size: cover;
}

/*-- Device responsive --*/

@media screen and (max-width: 960px) {
    
    .phead .inner {width: 100%; margin: 0;}
    footer .inner {width: 100%; margin: 0;}
    .proj-tmp section .content {padding: 0 20px;}
    .proj-tmp .proj-fulldesc {padding: 82px 20px;}
    
    
}

@media screen and (max-width: 767px) {
  .proj-tmp .row { width: auto; min-width: 0; margin-left: 0; margin-right: 0; }
  .proj-tmp .column { width: auto !important; float: none; padding-bottom: 82px;}
  .proj-tmp .column + .column {padding-bottom: 0;}
  .proj-tmp .column:last-child { float: none; }
  [class*="column"] + [class*="column"]:last-child { float: none; }
  
  .proj-tmp .proj-fulldesc .column {padding-bottom: 0;}
  
  .proj-tmp .proj-fulldesc {padding: 30px 20px;}
  .proj-tmp .proj-fulldesc .inner-l, .proj-tmp .proj-fulldesc .inner-r {padding: 0;}
  .proj-tmp .proj-fulldesc .inner-l {padding-bottom: 40px; border: 0;}
    
}

@media screen and (max-width: 600px) {
    
    .phead h1.logo a {width: 44px;}
    .phead div.logo a {width: 44px;} 
    .phead h1.logo a:hover {width: 44px;}
    .phead div.logo a:hover {width: 44px;} 
    
    .proj-tmp .top-container h1 {
        font-size: 27px;
    }
    
    .proj-tmp .top-container h3 {
        font-size: 15px;
    }
    
    .proj-tmp .proj-fulldesc p, .proj-tmp .proj-fulldesc ul li {
        font-size: 15px;
        line-height: 23px;
    }
    
    .proj-tmp .proj-fulldesc h2 {
        font-size: 15px;
    }
    
}

@media screen and (max-width: 480px) {
    
    
}

@media screen and (max-width: 320px) {
    
}

.cleardiv {clear: both;}