/* reset */
* { margin: 0; padding: 0; outline: 0; }

body, html { height: 100%; }

body {
    font-size: 13px;
    line-height: 22px;
    font-family: 'rockwellregular', Georgia, serif;
    color: #707070;
    background: url(images/body.png);
    min-width: 860px;

}

a { color: #b40201; text-decoration: none; cursor: pointer; }
a:hover { text-decoration: none; }
a img { border: 0; }

img { vertical-align:middle; }

h1,h2,h3,h4 { font-weight:normal; font-family: 'rockwellbold'; -webkit-backface-visibility:hidden }
h1 { font-size:50px; line-height:54px; text-transform:uppercase; color:#4b5f6d; }
h1 span { font-size:20px; display:block; line-height:32px;  }
h2 { font-size:40px; line-height:40px; text-transform:uppercase; color:#4b5f6d; margin-bottom:15px; }
h3 { font-size:22px; line-height:22px; text-transform:uppercase; color:#4b5f6d; }
h4 { font-size:24px; line-height:25px; color:#b40201; margin-bottom:12px;  }
h1 strong, h2 strong, h3 strong { color:#b40201; text-shadow:0 1px 0 #fff }

strong { font-weight:normal; font-family: 'rockwellbold'; }

input, textarea, select { font-size: 14px; font-family: 'rockwellregular', }
textarea { overflow: auto; }

p { margin-bottom:20px; }
p a { text-decoration:underline; }
p a:hover { text-decoration:none; }

ul { list-style:none outside none; }

/* helpers */
.clearfix { *zoom:1 }
.clearfix:after { clear:both; display:table; content:''; }
.notext { font-size: 0; line-height: 0; text-indent: -4000px; }
.left, .alignleft { float: left; display: inline; }
.right, .alignright { float: right; display: inline; }
.text-big { font-size:16px; }
.text-large { font-size:18px; line-height:24px; }
.text-large p { margin-bottom:20px; }

/* blocks */
.shell { width:826px; position:relative; margin:0 auto; }
.page-header { position:relative; z-index: 1; background:url(images/header.png); overflow:hidden }
.header-wrap { background:url(images/header-wrap.png) no-repeat center bottom ; padding-bottom:30px; }
.page-main { position:relative; z-index: 5; background:url(images/main.png) repeat-x 0 0; position:relative; margin-top:-20px;  }  
.page-footer { background:url(images/footer.png); font-family: Georgia, serif; font-size:12px; text-shadow:0 1px 0 rgba(255,255,255,0.5) }
.footer-top { background:url(images/footer-t.png) repeat-x 0 -30px; padding:52px 0 51px; }
.footer-bottom { background:url(images/footer-b.png); border-top:1px solid #cdcdcd; box-shadow: inset 0 1px 1px #fff; color:#000; padding:26px 0 44px;   }

/* elements */
.brand { float:left; background:url(images/brand.png); width:380px; height:169px; font-size: 0; line-height: 0; text-indent: -4000px;  }
.brand {
	-webkit-transform:translate(0,-400px);
	transform:translate(0,-400px);
	transition-property: transform;
	transition-duration: 500ms;
	transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.275); /* easeOutBack */
	transition-delay: 0;
}
.loaded .brand:hover {
	transform:scale(1.1,1.1);
	-webkit-transform:scale(1.1,1.1);;
}
.loaded .brand { transform:translate(0,0); -webkit-transform:translate(0,0);  }
.footer-brand { float:right; background:url(images/footer-brand.png); width:206px; height:67px; font-size: 0; line-height: 0; text-indent: -4000px;  }

.bullet li { padding-left:15px; background:url(images/bullet.png) no-repeat 0 6px; line-height:20px; padding-bottom:10px; }

.btn-big { display:block; background:url(images/contact-btn.png); width:370px; height:83px; font-size:24px; font-family: 'rockwellbold'; position:relative; text-align:center; line-height:70px; z-index: 2; }
.btn-big { transition:top 100ms linear }
.btn-big:after { position:absolute; width:118px; height:55px; top:5px; left:125px; background:url(images/btn-overlay.png); content:'';  }
.btn-big:hover {
	top:2px;  
}

.navigation { padding:7px 0 35px; }

.main-nav { float:right; padding:6px 0 0 0; }
.main-nav li { float:left; padding:0 0 0 10px;  }
.main-nav a { display:block; position:relative; height:114px; font-family: "Trebuchet MS", Helvetica, sans-serif; color:#464646; text-transform:uppercase; font-size:15px; font-weight:bold; font-weight:900;  }
.main-nav a {
	transform:translate(0,-400px);
	-webkit-transform:translate(0,-400px);
	transition-property: transform;
	transition-duration: 500ms;
	transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.275); /* easeOutBack */
	transition-delay: 300ms;
}
.main-nav li:nth-child(1) a { transition-delay: 300ms; }
.main-nav li:nth-child(2) a { transition-delay: 400ms; }
.main-nav li:nth-child(3) a { transition-delay: 500ms; }
.main-nav li:nth-child(4) a { transition-delay: 600ms; }

.main-nav .icon { display:block; height:90px; }
.main-nav .icon {
	transition: translate 100ms cubic-bezier(0.175, 0.885, 0.320, 1.275); /* easeOutBack */
	transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.275); /* easeOutBack */
}
.main-nav .icon-home { width:87px; background:url(images/icon-home.png); }
.main-nav .icon-about { width:84px; background:url(images/icon-about.png); }
.main-nav .icon-services { width:89px; background:url(images/icon-services.png); }
.main-nav .icon-contact { width:93px; background:url(images/icon-contact.png); }
.main-nav .txt { position:absolute; width:100%; left:0; bottom:0; text-align:center; }
.main-nav .current span { color:#b40201; }
.main-nav a:hover .icon {
	transform:rotate(7deg);
	-webkit-transform:rotate(7deg); 
}
.loaded .main-nav a {
	transform:translate(0,0);
	-webkit-transform:translate(0,0);
}

.footer-links { float:left; width:200px; padding-right:75px;  }
.footer-links li { padding: 0 0 8px 15px; }
.footer-links li a { color:#464646;  }

.footer-menu { padding:22px 0 54px; }
.footer-menu li { border-left:1px solid #000; display:inline-block; padding:0 15px; line-height:12px; height:12px; box-shadow: inset 1px 0 0 rgba(255,255,255,0.5); *display:inline;  }
.footer-menu a { color:#000; }

.copy { margin:0; font-size:11px;  }
.copy a { color:#000;  }

.page-heading .shell { padding:25px 0 92px; }
.page-heading h1 { padding-left:10px;  }

.home-heading .shell { padding-top:0;  }
.home-heading h1 {  font-family: 'rockwellregular'; font-size:60px; line-height:78px; }
.home-heading h1 strong,
.home-heading h1 span { font-size:15px; line-height:18px; font-family: 'rockwellregular';  }

.pagenav-bar { padding:22px 0 29px; text-transform:uppercase; }
.pagenav-bar a { color:#486271; }
.pagenav-bar a.back { background:url(images/back-hand.png) no-repeat 0 center; padding-left:12px;  }

.article h4 { margin-top:33px;  }

h2.section-title { margin:0; padding:50px 0 22px; font-size:40px; }
h3.section-title { padding:15px 0;  }

.content-section { padding:36px 0 26px; background:url(images/section-divider.png) repeat-x 0 0;  }
.content-section { *zoom:1 }
.content-section:after { clear:both; display:table; content:'' }
.content-section:first-child { background: transparent;  }
.content-section .more { margin-bottom:0; text-transform:uppercase; font-size:14px; font-family: 'rockwellbold'; }
.content-section .more a { text-decoration:none; padding-right:10px; background:url(images/more-arrow.png) no-repeat right center;  }
.content-section h2 { margin-top:32px; overflow:hidden; }
.content-section img.alignright { margin-left:28px; }
.content-section img.alignleft { margin-right:28px; }

.cta-section h3 { font-size:29px; line-height:30px; margin-top:14px; }
.cta-section h3 strong { font-size:35px;  }

.contact-section { font-size:18px; line-height:30px; }
.contact-section p { margin-bottom:30px }
.contact-section .address { color:#b40201;  }
.contact-section .address .label { color:#4b5f6d; text-transform:uppercase; }

.profile-box { float:left; width:158px; margin: 0 58px 40px; font-size:18px; line-height:20px; color:#4b5f6d; text-align:center;  }
.profile-box .image {  width:169px; height:176px; background:url(images/team-circle.png); width:158px; height:158px; padding:0 0 18px 11px; margin: 0 0 12px -11px;  }
.profile-box p { margin:0; }
.profile-box .specialty { color:#b40201; text-transform:uppercase; font-size:16px; margin-bottom:10px;  }
.profile-box .contact-links a { display:inline-block; height:16px; width:18px; background:url(images/socials.png) no-repeat; }
.profile-box .contact-links a.ml { background-position:0 0; width:19px; }
.profile-box .contact-links a.ml:hover { background-position:0 bottom; }
.profile-box .contact-links a.fb { background-position:-21px 0; }
.profile-box .contact-links a.fb:hover { background-position:-21px bottom; }
.profile-box .contact-links a.tw { background-position:-40px 0; }
.profile-box .contact-links a.tw:hover { background-position:-40px bottom; }
.profile-box .contact-links a.gp { background-position:-60px 0; }
.profile-box .contact-links a.gp:hover { background-position:-60px bottom; }

.service-links {  }
.service-links .col { float:left; width:262px; margin-left:20px; }
.service-links .col:first-child { margin-left:0; }
.service-links ul { margin-bottom:30px;  }
.service-links ul li { font-size:14px; }
.service-links ul a { color:#4b5f6d; text-transform:uppercase; }
.service-links ul a:hover { color:#b40201; text-decoration:underline;  }
.service-links .more a { font-family: 'rockwellregular'; text-decoration:underline; }
.service-links .more a:hover { text-decoration:none; }

.map { float:right; padding:5px; background-color:#dbdbdb; border:1px solid #bfbfbf; } 
.map iframe { vertical-align:middle;  }

.contact-form { }
.contact-form .form-row { padding-bottom:17px;  *zoom:1 }
.contact-form .form-row:after { content:''; clear:both; display:table; }
.contact-form .two-thirds { float:left; width:480px; }
.contact-form .one-third { float:right; width:314px; }
.contact-form label { display:block; font-size:12px; color:#4b5f6d; text-transform:uppercase;  }
.contact-form .field { background-image: url(images/field.png); background-position:0 bottom; background-color:transparent;   border:0; color:#b40201; font-family: 'rockwellitalic'; height:16px; width:100%; padding:12px 0; }
.contact-form textarea.field { height:130px; line-height:40px; background-position: 0 0; padding:0;  }
.contact-form .field.edited { font-family: 'rockwellregular'; }
.contact-form .submit { width:114px; height:54px;  background:url(images/submit.png); border:0; cursor:pointer; font-size:16px; color:#b40201; font-family: 'rockwellbold'; line-height:34px; padding-bottom:20px; display:block; position:relative; transition: top 100ms linear }
.contact-form .submit:hover { top:2px; }

.seen-in { text-align:right; padding:10px 0 5px;  }
.seen-in h3 { line-height:40px; font-size:22px;  }
.seen-in img { float:right;  }

.home-section h2 { margin:20px 0 10px;  }
.home-section h3 { margin-bottom:26px;  }
.home-section p { text-align:justify;  }
.home-section ul.bullet { width:230px; color:#4b5f6d;  }
.home-section ul.alignright { margin-left:18px; }
.home-section ul.alignleft { margin-right:18px;  }
.home-section .entry { position:relative; overflow:hidden }

.awards-section { padding:40px 0 30px;  }
.awards-section h3 { margin:30px 0 10px; }
.awards-section p { font-size:12px; line-height:15px;   }
.awards { width:530px;  }
.awards img {max-width:100%;   }

/* warlock */
.warlock { position:absolute; right:4px; bottom:-400px;  background:url(images/wlock-body.png); width:460px; height:350px; transform: translate3d(0,0,0); transition: bottom 3s;  }
.warlock .hand-over { background:url(images/wlock-hand-over.png); position:absolute; width:100%; height:100%; z-index: 3;   }
.warlock .hand-under { background:url(images/wlock-hand-under.png); position:absolute; width:100%; height:100%; z-index: 1; }
.warlock .ball { background:url(images/browser-ball.png) no-repeat 0 0; z-index: 2; width:150px; height:150px; position:absolute; left:60px; top:104px;  }
.warlock .ball {
	border-radius:75px;
	box-shadow: 0 0 70px 20px #fff, inset 0 0 70px 20px #fff ;
	margin-left:75px; 
	margin-top:75px; 
	height:1px;
	width:1px;  
	background-size: 2400% 100% ;
	transition: height 2s ease 1s, width 2s ease 1s, margin 2s ease 1s, box-shadow 2s ease 3s;
}

/* hand over */
@-webkit-keyframes wlHO {
	0%   { left:-10px; top: 5px; }
	10%  { left: -8px; top: 6px; }
	20%  { left: -6px; top: 8px; }
	30%  { left: -4px; top: 9.1px; }
	40%  { left: -2px; top: 9.8px; }
	50%  { left:  0px; top: 10px; }
	60%  { left:  1px; top: 9.8px; }
	70%  { left:  2px; top: 9.1px; }
	80%  { left:  3px; top: 8px; }
	90%  { left:  4px; top: 6px; }
	100% { left:  5px; top: 5px; }
}

@keyframes wlHO {
	0%   { left:-10px; top: 5px; }
	10%  { left: -8px; top: 6px; }
	20%  { left: -6px; top: 8px; }
	30%  { left: -4px; top: 9.1px; }
	40%  { left: -2px; top: 9.8px; }
	50%  { left:  0px; top: 10px; }
	60%  { left:  1px; top: 9.8px; }
	70%  { left:  2px; top: 9.1px; }
	80%  { left:  3px; top: 8px; }
	90%  { left:  4px; top: 6px; }
	100% { left:  5px; top: 5px; }
}

/* hand under */
@-webkit-keyframes wlHU
{
	0%   { left: 10px; top: 5px; }
	10%  { left:  8px; top: 6px; }
	20%  { left:  6px; top: 8px; }
	30%  { left:  4px; top: 9.1px; }
	40%  { left:  2px; top: 9.8px; }
	50%  { left:  0px; top: 10px; }
	60%  { left: -2px; top: 9.8px; }
	70%  { left: -4px; top: 9.1px; }
	80%  { left: -6px; top: 8px; }
	90%  { left: -8px; top: 6px; }
	100% { left:-10px; top: 5px; }
}

@keyframes wlHU {
	0%   { left: 10px; top: 5px; }
	10%  { left:  8px; top: 6px; }
	20%  { left:  6px; top: 8px; }
	30%  { left:  4px; top: 9.1px; }
	40%  { left:  2px; top: 9.8px; }
	50%  { left:  0px; top: 10px; }
	60%  { left: -2px; top: 9.8px; }
	70%  { left: -4px; top: 9.1px; }
	80%  { left: -6px; top: 8px; }
	90%  { left: -8px; top: 6px; }
	100% { left:-10px; top: 5px; }
}

.loaded .warlock { bottom:-70px;  }


.loaded .warlock .ball {
	margin:0; 
	width:150px; height:150px;
	box-shadow: none;
}