body
{
    padding:0;
    margin:0;
    /*font-size:0.8em;*/
    font-family:'Istok Web', Arial, Helvetica, sans-serif;
    background:#F5F5F5;
    line-height:1.4em;
}
h2, h3, h4
{
    margin:0;
    padding:20px 0 20px 0;
    font-family: 'Comfortaa';
    color:#1F7298;
    font-size:1.8em;
    font-weight:normal;
}
h3
{
    font-size:1.5em;
    padding:10px 0 2px;
}
h4
{
    font-size:1.2em;
    padding:10px 0 0;
    color:#65620A;
}
.shell
{
    margin:0 auto;
    width:1000px;
    position:relative;
}
#header
{
    background:#f5f5f5;
    height:56px;
    border-bottom:solid 4px #E4DD23;
    position:relative;
    z-index:5000;
    -moz-box-shadow: 0 0 5px 5px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0 0 5px 5px rgba(0,0,0,0.3);
    box-shadow:0 0 5px 5px rgba(0,0,0,0.3);
    /*text-align:center;*/
}
#header #underline
{
    height:4px;
    width:110px;
    position:absolute;
    bottom:1px;
    z-index:2002;
    background:#1F7298;
    display:none;
}
#logo
{
    width:148px;
    height:37px;
    position:absolute;
    top:10px;
    left:10px;
}
#logo img{border:none;}
#navigation{height:56px;padding:0;display:inline-block;}
#navigation ul{margin:0 0 0 250px;padding:0;}
#navigation li{margin:0;padding:0;list-style:none;display:inline-block;float:left;}
#navigation li a{height:36px;padding:20px 20px 0 20px;display:inline-block;font-family:'Comfortaa';letter-spacing:1px;font-weight:normal;font-size:12px;text-transform:uppercase;color:#000;text-decoration:none;white-space:nowrap;}
#navigation li a:hover{color:#1F7298;}
#navigation li a.active{color:#1F7298;background:#fff;border-right:solid 1px #ccc;border-left:solid 1px #ccc;padding-right:19px;padding-left:19px;}
#midshell{background:#fff;float:left;width:100%;overflow:hidden;-moz-box-shadow:0 -5px 5px 0 rgba(0,0,0,0.3);-webkit-box-shadow:0 -5px 5px 0 rgba(0,0,0,0.3);box-shadow:0 -5px 5px 0 rgba(0,0,0,0.3);}
#mid{position:relative;right:50%;background:#F5F5F5;float:left;width:100%;border-right:solid 1px #ccc;/*margin-left:-100px;*/}
#leftcol{float:left;width:50%;min-height:150px;position:relative;left:50%;}
#rightcol{float:left;width:50%;min-height:210px;position:relative;left:50%;}
#leftcol .content{padding:0 20px 40px 10px;margin-left:auto;width:420px;}
#leftcol h2{text-align:right;}
#rightcol .content{padding:0 10px 40px 20px;width:420px;}
#mid.skinny{margin-left:-200px;}
#mid.skinny #leftcol .content{width:220px;}
#mid #rightcol.thick .content{padding:0 10px 0 20px;width:620px;}
#footer{background:#f5f5f5;height:96px;border-top:solid 4px #E4DD23;clear:both;padding:20px 10px;position:relative;z-index:2002;-moz-box-shadow:0 -5px 5px rgba(0,0,0,0.3);-webkit-box-shadow:0 -5px 5px rgba(0,0,0,0.3);box-shadow:0 -5px 5px rgba(0,0,0,0.3);}

.socialitem
{
    text-decoration:none;
    height:24px;
    width:33px;
    display:inline-block;
    float:left;
    background:url(img/social_sprite.png) no-repeat;
    overflow:hidden;
    padding:9px 0 0 0;
    color:#FFF;
    border:solid 4px #F5F5F5;
    -webkit-border-radius:33px;
    -moz-border-radius:33px;
    border-radius:33px;
}
.socialitem span{display:inline-block;width:130px;margin-left:35px;}
.socialitem.twitter{background-color:#39B9DC;background-position:0 0;}
.socialitem.facebook{background-color:#3E62B3;background-position:0 -33px;}
.socialitem.googleplus{background-color:#D0452A;background-position:0 -66px;}
.socialitem.erlme{background-color:#79D2D7;background-position:0 -99px;}
.copyright{color:#999;font-size:11px;display:inline-block;padding:12px;float:right;}
.menuitem
{
    font-family: 'Trebuchet MS';
    margin:0 -20px 0 0;
    padding:15px 20px 15px 15px;
    border-top:dotted 1px #CCC;
    clear:both;
    display:block;
    text-decoration:none;
    cursor:pointer;
    position:relative;
}
.menuitem:last-child
{
    border-bottom:dotted 1px #CCC;
}
.menuitem.hover
{
    background:url(img/itemhover_bg.png) repeat-y 500px 0;
}
.menuitem.active
{
    background:#FFF;
    border-left:dotted 1px #CCC;
    padding-left:14px;
    margin-right:-22px;
}
.menuitem h3
{
    font-size:1.3em;
    color:#000;
    display:block;
    margin:4px 0;
    padding:8px 0 0 0;
    font-weight:normal;
}
.menuitem h4
{
    color:#000;
    display:block;
    margin:2px 0;
    padding:0;
    font-size:1.1em;
    font-weight:normal;
}
.menuitem p
{
    font-size:.9em;
    color:#666666;
    margin:4px 0;
    padding:0;
}
.menuitem .photo
{
    float:left;
    margin-right:15px;
}
.menuitem .photo.border
{
    padding:4px;
    border:solid 1px #ccc;
    background:#fff;
}
.teammember
{
    min-height:145px;
}
.icon
{
    display:inline-block;
    height:16px;
    width:24px;
    padding:0;
    background:url(img/icon_sprite.png) no-repeat;
}
.icon.phone
{
    background-position:0 0;
    float:left;
}
.icon.email
{
    background-position:0 -16px;
    float:left;
}
.icon.quote
{
    background-position:0 -32px;
    float:left;
    margin-bottom:10px;
}
.quotecontainer
{
    width:0;
    overflow:hidden;
    white-space:nowrap;
}
.important
{
    font-family:Helvetica, sans-serif;
    font-weight:bold;
    text-transform:uppercase;
}
#clientlogos
{
    height:230px;
    overflow:hidden;
    margin:10px 0 0 0;
}
/* Contact Styles */
#contactform
{
    position:absolute;
    width:500px;
    height:240px;
    border:solid 1px #ccc;
    padding:20px;
    background:#f5f5f5;
    top:60px;
    left:50%;
    margin-left:-270px;
    -moz-box-shadow: 0 0 3px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 0 3px 3px rgba(0,0,0,0.2);
    box-shadow:0 0 3px 3px rgba(0,0,0,0.2);
    display:none;
    z-index:4000;
}
.textbox{
	font-family:Arial, Helvetica, sans-serif;
	background:#fff;
	color:#000;
	font-size:12px;
	margin:0 0 8px 0;
	padding:4px 6px;
	border:solid 1px #666666;
}
.watermark{
	color:#999;
}
.validate{
    position:relative;
    display:inline-block;
}
.validator{
	position:absolute;
	text-align:right;
	font-size:9px;
	text-transform:uppercase;
	color:#900;
	letter-spacing:1px;
	right:0;
    top:-15px;
    display:none;
}

/* Buttons */
.button
{
    background:#ebebeb url(img/btn_bg.jpg) repeat-x bottom;
    overflow:hidden;
    border:solid 1px #ccc;
    cursor:pointer;
    border-radius:3px;
    display:inline-block;
    white-space:nowrap;
}
.button:hover
{
    color:#000;
    -moz-box-shadow: 0 0 1px 1px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 0 1px 1px rgba(0,0,0,0.2);
    box-shadow:0 0 1px 1px rgba(0,0,0,0.2);
}
.button.disabled, .button.disabled:hover{
	background:#ebebeb;
	color:#ccc;
	border:solid 1px #ccc;
	cursor:default;
	-moz-box-shadow:none;
    -webkit-box-shadow:none;
    box-shadow:none;
}
.button .label{
	font-size:11px;
	font-weight:bold;
	text-decoration:none;
	color:#999;
	padding:5px 11px 0 12px;
    height:19px;
    background-position:right 0;
    background-repeat:no-repeat;
    display:inline-block;
}
.button:hover .label{
	color:#000;
}
.button.disabled:hover .label{
	color:#ccc;
}
.button.x, .button.more, .button.link
{
    position:absolute;
    top:20px;
    right:20px;
}
.button.link
{
    right:60px;
    display:none;
}
.button.x
{
    height:24px;
}
.button.x .label
{
    background-image:url(img/close_sprite.png);
}
.button.more .label
{
    background-image:url(img/more_sprite.png);
    padding:5px 24px 0 10px;
    height:19px;
}
.button.link .label
{
    padding:5px 10px 0 10px;
    height:19px;
}
.button:hover .label
{
    background-position:right -24px;
}
.invalid{
	border:solid 1px #900;
}
#countinfo{
	font-size:11px;
	padding-left:8px;
	color:#999;
}
#msg{}
#thanks,#error{display:none;position:absolute;top:0;left:50%;width:400px;color:#060;background:#CFC;padding:10px;border:solid 1px #060;margin:20px 0 4px -210px;text-align:center;}
#error{color:#900;background:#FFCECE;border:solid 1px #900;}
#contactform .smallbutton
{
    cursor:pointer;
}

/* Our Work */
.workitem, .workitem.big
{
    width:420px;
    height:171px;
    overflow:hidden;
    position:relative;
    border:solid 1px #ccc;
    margin-bottom:20px;
    background:#fff;
    left:0;
}
#workoverlay
{
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    z-index:1000;
    display:none;
    background:url(img/transparent_white.png);
}
.workitem.big
{
    -moz-box-shadow: 0 0 3px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 0 3px 3px rgba(0,0,0,0.2);
    box-shadow:0 0 3px 3px rgba(0,0,0,0.2);
    width:880px;
    height:431px;
    display:none;
    z-index:3000;
}
#rightcol .workitem
{
    background:#F5F5F5;
}
#rightcol .workitem.big
{
    right:50%;
    margin-right:-26px;
}
/*.workitem.active
{
    cursor:default;
}*/
.workitem.big .button.more
{
    display:none;
}
.workitem.big .button.link
{
    display:inline-block;
}
.workitem .heading
{
    margin-top:-71px;
    height:60px;
    border-bottom:solid 1px #ccc;
    padding:5px 10px 5px 20px;
    position:relative;
    overflow:hidden;
}
.workitem.big .heading
{
    margin-top:0 !Important;
}
.workitem h2
{
    margin:3px 0 0 0;
    padding:0;
    font-size:20px;
    color:#666666;
    text-align:left !Important;
}
.workitem h3
{
    margin:4px 0 0 0;
    padding:0;
    font-size:16px;
    color:#ACA815;
}
.workitem h4
{
    margin:3px 0 0 0;
    padding:0;
    font-size:11px;
    color:#999;
    font-family:Arial;
}
.workitem .description, .workitem .tags
{
    position:absolute;
    width:450px;
    top:-200px;
    left:250px;
    font-size:12px;
}
.workitem.big .description
{
    top:10px;
}
.workitem.big .tags
{
    top:45px;
    color:#999;
}
.workitem .thumb img
{
    width:100%;
}

/* No JS */
#nojs
{
    position:absolute;
    top:0;
    left:50%;
    margin-left:250px;
    width:200px;
    height:46px;
    padding:10px 10px 0;
    font-weight:bold;
    font-size:14px;
    color:#fff;
    background:#1F7298;
    z-index:9999;
    text-align:center;
}

/* Small Screens */
@media screen and (max-width: 767px) {
	h2, h3, h4{
		line-height:1.2em;
	}
	.shell{
		width:auto;
	}
	#underline{
		display:none !important;
	}
	#navigation{
		width:96% !important;
		position:static;
		background:url(img/mobile-menu-icon.png) no-repeat right center;
		background-size:40px 29px;
		margin-right:15px;
	}
	#navigation ul{
		display:none;
		position:relative;
		top:60px;
		margin-right:-15px;
		background:#D9D9D9;
		border-top:solid 1px #ccc;
		border-bottom:solid 1px #ccc;
		z-index:10000;
		margin-left:0;
	}
	#navigation ul li{
		display:block;
		float:none;
	}
	#navigation ul li a{
		float:none;
		display:block;
	}
	#navigation.active ul{
		display:block;
	}
	#midshell{
		float:none;
		width:auto;
	}
	#mid{
		right:auto;
		float:none;
		width:auto;
		border-right:none;
	}
	#mid.skinny{
		margin-left:0;
	}
	.menuitem{
		margin:0 -15px;
	}
	#leftcol{
		float:none;
		width:auto;
		left:auto;
	}
	#rightcol{
		float:none;
		width:auto;
		left:auto;
	}
	#leftcol .content{
		width:auto;
	}
	#rightcol .content{
		width:auto;
	}
	#mid.skinny{}
	#mid.skinny #leftcol .content{width:auto;}
	#mid #rightcol.thick .content{width:auto;}
	.workitem, .workitem.big{
		width:auto;
	}
	.workitem.big{
		position:fixed !important;
		left:0 !important;
		top:0 !important;
		right:0 !important;
		z-index:10000;
		height:auto;
	}
	.workitem .heading
	{
		margin-top:0 !important;
		height:auto;
	}
	.workitem.big .description, .workitem.big .tags{
		display:block;
		width:auto;
		position:static;
		padding:0 inherit 10px;
	}
	.photo{
		display:none;
	}
	.teammember{
		min-height:inherit;
	}
	.teammember .menuitem{
		padding:0 20px 0 15px;
	}
	.teammember h3, .teammember h4{
		display:inline-block;
		padding-right:10px;
	}
	.quotecontainer{
		display:none !important;
	}
	#contactform{
		width:auto;
		position:fixed;
		top:0;
		left:0;
		right:0;
		height:100%;
		margin:0;
		z-index:10000;
	}
	#comments{
		width:95% !important;
	}
	#thanks, #error{
		width:auto;
		left:0;
		margin:20px;
		top:40px;
	}
	.validate{
		width:100%;
		margin-top:5px;
	}
	.textbox{
		width:95% !important;
	}
}