/*/ ====== UI Patterns ====== /*/
/*/ Media Queries /*/
/*/ Colours /*/
/*/ Images /*/
/*/ Typography /*/
@font-face { font-family: 'callunaregular'; src: url("fonts/calluna/calluna-regular.eot"); src: url("fonts/calluna/calluna-regular.eot?#iefix") format("embedded-opentype"), url("fonts/calluna/calluna-regular.woff") format("woff"), url("fonts/calluna/calluna-regular.ttf") format("truetype"), url("fonts/calluna/calluna-regular.svg#callunaregular") format("svg"); font-weight: normal; font-style: normal; }

@font-face { font-family: 'latoregular'; src: url("fonts/lato/lato-reg.eot"); src: url("fonts/lato/lato-reg.eot?#iefix") format("embedded-opentype"), url("fonts/lato/lato-reg.woff") format("woff"), url("fonts/lato/lato-reg.ttf") format("truetype"), url("fonts/lato/lato-reg.svg#latoregular") format("svg"); font-weight: normal; font-style: normal; }

@font-face { font-family: 'latolight'; src: url("fonts/lato/lato-lig.eot"); src: url("fonts/lato/lato-lig.eot?#iefix") format("embedded-opentype"), url("fonts/lato/lato-lig.woff") format("woff"), url("fonts/lato/lato-lig.ttf") format("truetype"), url("fonts/lato/lato-lig.svg#latolight") format("svg"); font-weight: normal; font-style: normal; }

@font-face { font-family: 'latobold'; src: url("fonts/lato/lato-bol.eot"); src: url("fonts/lato/lato-bol.eot?#iefix") format("embedded-opentype"), url("fonts/lato/lato-bol.woff") format("woff"), url("fonts/lato/lato-bol.ttf") format("truetype"), url("fonts/lato/lato-bol.svg#latobold") format("svg"); font-weight: normal; font-style: normal; }

.smallcaps { font-size: 70%; position: relative; }

h1 { font-size: 64px; color: black; font-weight: normal; font-family: 'latolight', arial, sans-serif; line-height: 64px; }
h1 b { font-family: 'latoregular', arial, sans-serif; font-weight: normal; }

h2 { font-size: 40px; color: black; font-weight: normal; font-family: 'latolight', arial, sans-serif; line-height: 40px; text-align: center; }
h2 b { font-family: 'latoregular', arial, sans-serif; font-weight: normal; }

h3 { font-size: 20px; color: black; font-weight: normal; font-family: 'latoregular', arial, sans-serif; line-height: 20px; }
h3 b { font-family: 'latobold', arial, sans-serif; font-weight: normal; }

/*/ Buttons /*/
/*/ Forms /*/
.fauxcheck, .fauxrad { border: 2px #ccc solid; height: 12px; width: 12px; display: inline-block; background-color: #fff; transition: background-color 0.3s; -webkit-transition: background-color 0.3s; cursor: pointer; }
.fauxcheck.active, .fauxrad.active { background-color: #ccc; }

input, textarea, select { outline: 0; -webkit-appearance: none; border-radius: 0; }

.clearfix:before, header:before, #what-we-do:before, #wrapper:before, .inner:before, .clearfix:after, header:after, #what-we-do:after, #wrapper:after, .inner:after { content: "\0020"; display: block; height: 0; overflow: hidden; }

.clearfix:after, header:after, #what-we-do:after, #wrapper:after, .inner:after { clear: both; }

/* Fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */
.clearfix, header, #what-we-do, #wrapper, .inner { zoom: 1; }

.minihr { width: 60px; margin: auto; border: 0px; height: 1px; background-color: #000; }

/*/ ====== Modules ====== /*/
/*/ Header /*/
header { width: 100%; display: block; padding-top: 40px; margin-bottom: 85px; }
header nav { display: block; width: 480px; height: 60px; float: right; }
header ul { display: block; float: left; list-style: none; margin: 0px; padding: 0px; }
header li { display: block; float: left; }
header li a { font-size: 16px; color: black; font-weight: normal; font-family: 'latoregular', arial, sans-serif; text-decoration: none; text-transform: uppercase; padding-top: 10px; margin-top: 10px; display: block; float: left; border-top: 3px #fff solid; margin-left: 16px; }
header li a b { font-family: 'latobold', arial, sans-serif; font-weight: normal; }
header li a.active { border-top: 3px #ffb547 solid; }
header li a:hover { border-top: 3px #ffb547 solid; }

#logo { float: left; }

/*/ Home /*/
#home { text-align: center; }

.intro { width: 70%; margin: auto; line-height: 160%; }

.getintouch { width: 180px; height: 48px; background-image: url("images/gitbutton.png"); border: 0px; margin-top: 30px; margin-bottom: 50px; text-indent: 140%; white-space: nowrap; overflow: hidden; background-color: #fff; }

/*/ Who we are /*/
#who-we-are { margin-bottom: 90px; }
#who-we-are .top { width: 100%; float: left; margin-bottom: 30px; }
#who-we-are .top p { text-align: left; width: 400px; float: right; margin-top: 30px; margin-right: 75px; }
#who-we-are p { text-align: center; width: 760px; margin: auto; line-height: 160%; }
#who-we-are hr { margin-top: 50px; }

.intropic { float: left; margin: 0px 0px 0px 200px; }

/*/ What we do /*/
#what-we-do { background-color: #ffb547; padding-top: 60px; }
#what-we-do p { font-size: 90%; }
#what-we-do ul { padding-left: 20px; }
#what-we-do li { font-size: 90%; }
#what-we-do h3 { text-shadow: rgba(255, 255, 255, 0.4) 0 1px 0; }
#what-we-do .row { height: 330px; }
#what-we-do .col-l, #what-we-do .col-c, #what-we-do .col-r { width: 30%; float: left; }
#what-we-do .col-l, #what-we-do .col-c { margin-right: 4.5%; }

/*/ Clients /*/
#clients { padding-top: 60px; padding-bottom: 98px; }
#clients .col-l, #clients .col-c, #clients .col-r { width: 30%; float: left; }
#clients .col-l, #clients .col-c { margin-right: 4.5%; }

.clientlogo { display: block; margin: auto; background-position: top left; }

.exit { width: 131px; height: 76px; background-image: url("images/exit.png"); }

.farsight { width: 234px; height: 58px; background-image: url("images/farsight.png"); }

.deanlester { width: 170px; height: 77px; background-image: url("images/deanlester.png"); }

/*/ Contact /*/
#contact { border-top: 3px #ffb547 solid; padding-top: 50px; padding-bottom: 50px; text-align: center; color: #fff; background-color: #10a697; background-image: url("images/swirly.png"); }
#contact h2 { color: #fff; }
#contact h3 { font-size: 20px; color: white; font-weight: normal; font-family: 'latolight', arial, sans-serif; margin-bottom: 0px; }
#contact h3 b { font-family: 'latoregular', arial, sans-serif; font-weight: normal; }
#contact hr { background-color: #fff; margin-top: 34px; }

.sendusanemail { display:block; margin:auto; width: 234px; height: 48px; background-image: url("images/sendemailbutton.png"); background-repeat: no-repeat; background-position: top left; border: 0px; background-color: transparent; text-indent: 140%; white-space: nowrap; overflow: hidden; }

/*/ Footer /*/
footer { width: 100%; border-top: 3px #ffb547 solid; padding: 25px 0; background-color: #2b2b2b; font-size: 16px; color: white; font-weight: normal; font-family: 'latolight', arial, sans-serif; }
footer b { font-family: 'latoregular', arial, sans-serif; font-weight: normal; }
footer .left { float: left; }
footer .right { float: right; }

/*/ ====== Layout ====== /*/
html { min-height: 100%; height: 100%; }

body { min-height: 100%; height: 100%; min-width: 200px; font-family: callunaregular, "georgia", serif; font-size: 16px; line-height: 20px; }

#wrapper { margin: auto; }

.inner { width: 940px; margin: auto; }

.tabmob { display: none !important; }

.mobonly { display: none !important; }

.hidden { display: none !important; }