a { -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; }
a:hover,
a:focus 	{ color: #00deff; text-decoration: underline; -webkit-transition: all .1s ease; -moz-transition: all .1s ease; -o-transition: all .1s ease; transition: all .1s ease; }


body    { min-width: 768px; }
p br    { display: block; }

#sizer          { min-width: 728px; background-attachment: fixed; }
.grid           { width: 680px; padding: 3em 24px; }

.header .grid   { padding-bottom: 3em; }

#branding   { float: left; width: 200px; background: none; padding: 0; }

#logo 	    { float: left; display: inline; position: relative; margin: 0 0 0 -120px; background-position: 68px 0; }
#logo a     { width: 320px; }

#tagline	{ float: left; clear: left; width: 200px; text-align: left; }

#main-nav       { float: right; margin-right: -15px; padding: .5em 0 0; }
#main-nav li	{ float: left; display: inline; width: auto; margin: 0; }
#main-nav li#home-link { display: inline; }
#main-nav li a  { 
    background: none; 
    font: 600 12px/18px 'proxima-nova-1', 'proxima-nova-2', 'Helvetica Neue', Arial, sans-serif;    
    -webkit-border-radius: 15px; -moz-border-radius: 15px; -o-border-radius: 15px; border-radius: 15px;
}

#content h1             { font: 500 45px/60px 'proxima-nova-1', 'proxima-nova-2', 'Helvetica Neue', Arial, sans-serif; letter-spacing: -1px; text-align: center; }           
.wf-active #content h1  { font-weight: 600; font-size: 48px; }
#content #page-intro p  { font: 500 32px/48px 'proxima-nova-1', 'proxima-nova-2', 'Helvetica Neue', Arial, sans-serif; }
.wf-active #content #page-intro p  { font-weight: 600; }


#content .col       { float: left; width: 47.05%; }
#content .col-left  { margin-right: 40px; }

#content  .left-col 		{ float: left; clear: both; width: 35.29%; } 
#content  .left-col img 	{ float: right; }
#content  .right-col        { float: right; width: 58.82%; }

.footer .grid { text-align: center; }


#featured-projects ul       { overflow: visible; }

#featured-projects .png     { position: relative; z-index: 20; }
#featured-projects .png img { float: left; position: relative; z-index: 21; margin-left: -20px; }

#featured-projects .item-1      { float: left; width: 100%; }
#featured-projects .item-2      { float: left; clear: both; }
#featured-projects .item-3      { float: right; }
#featured-projects img          { min-width: 0; max-width: none; }

#body-about #about          { float: left; width: 100%; }
#body-about #partners,
#body-about #testimonials   { float: left; clear: both; width: 100%; }
#mtz 		{ float: left; display: inline; width: 240px; margin: 0 0 0 -280px; position: relative; }

#body-services #responsibilities-distribution   { padding: .75em 40px 1px; }
#body-services #responsibilities-distribution h2 { text-align: center; }
#body-services .graph tr    { display: table-row; }
#body-services .graph th,
#body-services .graph td    { width: 41.17%; display: table-cell; }
#body-services .graph td    { padding: 0 0 0 20px; }
#body-services .graph th    { text-align: right; padding-right: 20px; font-weight: normal; }
#body-services .graph th a:hover,
#body-services .graph th a:focus    { color: #00deff; }




#content ul.projects        { float: left; width: 720px; margin-top: -42px; position: relative; min-height: 0 !important; }
#content ul.projects li     { position: absolute; width: 200px; }
#content ul.projects li img { min-width: 0; }

#content ul.projects li .project-no {
    display: block;
    position: absolute; width: 30px; height: 30px; top: -15px; right: -15px; color: #0f1c2e; 
    background: url(i/icons/more-plus.png); text-indent: -9999px; overflow: hidden; -webkit-transition: all .1s ease; -moz-transition: all .1s ease; -o-transition: all .1s ease; transition: all .1s ease; 
    opacity: 0;
}
#content ul.projects li a:hover .project-no { 
    opacity: 1; 
    -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease;
}




#body-project .project-image-top img { min-width: 0; max-width: none !important; }

#body-project .project-desc           { float: left; width: 58.82%; margin: 0; }
#body-project .project-meta           { float: right; clear: none; width: 35.29%; }

#body-project .project-desc .png            { margin-bottom: 0 !important; }
#body-project .project-desc .png img        { width: 440px; margin: 0 0 0 -20px !important;  }

#body-project h1 { padding: 0 100px; }

#body-project .navigation .prev { margin: 0 !important; left: 20px; }
#body-project .navigation .next { margin: 0 !important; left: auto; right: 20px; }

#body-project .navigation .prev,
#body-project .navigation .next { 
    position: absolute; top: 40px; z-index: 1000;
    width: 80px; height: 80px; overflow: hidden; 
    -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease;
    -webkit-border-radius: 40px; -moz-border-radius: 40px; -o-border-radius: 40px; border-radius: 40px; 
}    

#body-project .navigation a { opacity: 0.2; -webkit-transition: none !important; }

#body-contact p.intro-text      { text-align: center; }
#contact-form                   { float: left; width: 100%; }
#contact-form fieldset          { padding: 1.5em 30px; width: 620px; }
#contact-form .col              { width: 290px; }
.checkbox-group                 { float: left; width: 120%; margin: 0 !important; }
.checkbox-group li              { }
.split-list li                  { float: left; display: inline; width: 320px; }
.checkbox-group li.full-width   { width: 100% !important; }

.input-text     { width: 280px; }

#name,
#decision-makers,
#content-manager,
#website        { width: 440px; }

textarea        { width: 614px; }

#button-fieldset { text-align: left; }
#button-fieldset .label-check { float: left; padding-top: 12px; }
#button-fieldset .input-image        { float: right; display: inline; }
#button-fieldset .input-image:active { position: relative; bottom: -1px; }

#content .error-message,
#content .thankyou-message { padding: 1.5em 30px; }
#content .error-message li { margin-left: 40px; }


.edit-link          { position: fixed; right: 0; bottom: 0; background: rgba(255,255,255,.25); }
.edit-link a        { display: block; padding: 10px 20px; }
.edit-link a:hover  { color: #d1ff00; }

@media only screen and (device-max-width: 1024px) {
    
    #sizer { background-attachment: normal; }
    #body-project .navigation .prev,
    #body-project .navigation .next,
    #body-project .navigation a,
    #body-project .navigation a:hover,
    #body-project .navigation a:focus,
    #body-project .navigation .prev a:hover,
    #body-project .navigation .prev a:focus,
    #body-project .navigation .next a:hover,
    #body-project .navigation .next a:focus { -webkit-transition: none !important; -webkit-transform: none !important; }
    
}

@media only screen and (min-width: 481px) and (max-width: 980px) {
    
    #logo { margin: 0 0 0 -75px; }
    #tagline { margin-left: 45px; }

}

@media only screen and (min-width: 981px) {
    
    #body-project .navigation .prev,
    #body-project .navigation .next { position: absolute; top: 320px; }
    
    #body-project .navigation .prev { left: -100px; }
    #body-project .navigation .next { right: -100px;  }
}


@media only screen and (min-width: 1025px) {
    
    #body-project .navigation .prev,
    #body-project .navigation .next { position: fixed; top: 50%; left: 50%; right: auto !important; }
    
    #body-project .navigation .prev { margin: 0 0 0 -480px !important; }
    #body-project .navigation .next { margin: 0 0 0 400px !important;  }
    
    #body-project .navigation a { -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; }

    #body-project .navigation a:hover,
    #body-project .navigation a:focus { opacity: 1.0; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; }

    #body-project .navigation .prev a { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); transform: rotate(360deg); }                                      
    #body-project .navigation .next a { -webkit-transform: rotate(-360deg); -moz-transform: rotate(-360deg); transform: rotate(-360deg); }

    #body-project .navigation .prev:hover,
    #body-project .navigation .next:hover {
        -webkit-transition: all .3s ease; -moz-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease;
        -webkit-box-shadow: 0 10px 20px rgba(0,0,0,.25); -moz-box-shadow: 0 10px 20px rgba(0,0,0,.25); -o-box-shadow: 0 10px 20px rgba(0,0,0,.25); box-shadow: 0 10px 20px rgba(0,0,0,.25); 
    }

    #body-project .navigation .prev a:hover { -webkit-transform: rotate(-360deg); -moz-transform: rotate(-360deg); transform: rotate(-360deg);  }                                      
    #body-project .navigation .next a:hover { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); transform: rotate(360deg);     }
    
    
}