/*
Theme Name:     OM-BoilerplateChild-2
Theme URI:      https://omuk.com/
Description:    Child theme of Boilerplate compiled for OMUK
Author:         Oliver Wieland
Author URI:     https://owmc.co.uk/
Template:       boilerplate
Version:        0.2.3
*/

/** START HTML5 Boilerplate CSS **/

/*! normalize.css v1.0.1 | MIT License | git.io/normalize */

/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */

/*
 * Corrects `block` display not defined in IE 6/7/8/9 and Firefox 3.
 */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
summary {
    display: block;clear:both;
}

/*
 * Corrects `inline-block` display not defined in IE 6/7/8/9 and Firefox 3.
 */

audio,
canvas,
video {
    display: inline-block;
    *display: inline;
    *zoom: 1;
}

/*
 * Prevents modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */

audio:not([controls]) {
    display: none;
    height: 0;
}

/*
 * Addresses styling for `hidden` attribute not present in IE 7/8/9, Firefox 3,
 * and Safari 4.
 * Known issue: no IE 6 support.
 */

[hidden] {
    display: none;
}

/* ==========================================================================
   Base
   ========================================================================== */

/*
 * 1. Corrects text resizing oddly in IE 6/7 when body `font-size` is set using
 *    `em` units.
 * 2. Prevents iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */

html {
    font-size: 100%; /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
    -ms-text-size-adjust: 100%; /* 2 */
}
footerlinks
/*
 * Addresses `font-family` inconsistency between `textarea` and other form
 * elements.
 */

html,
button,
input,
select,
textarea {
    font-family: sans-serif;
}

/*
 * Addresses margins handled incorrectly in IE 6/7.
 */

body {
    margin: 0;
}

/* ==========================================================================
   Links
   ========================================================================== */

/*
 * Addresses `outline` inconsistency between Chrome and other browsers.
 */

a:focus {
    outline: 0;
}

/*
 * Improves readability when focused and also mouse hovered in all browsers.
 */

a:active,
a:hover {
    outline: 0;
}

/* ==========================================================================
   Typography
   ========================================================================== */

/*
 * Addresses font sizes and margins set differently in IE 6/7.
 * Addresses font sizes within `section` and `article` in Firefox 4+, Safari 5,
 * and Chrome.
 */

h1 {
    margin: 0;   
}

h2 {
    margin: 0;
}

h3 {
    margin: 0;
}

h4 {
    margin: 0;
}

h5 {
    margin: 0;
}

h6 {
    margin: 0;
}

/*
 * Addresses styling not present in IE 7/8/9, Safari 5, and Chrome.
 */

abbr[title] {
    border-bottom: 1px dotted;
}

/*
 * Addresses style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome.
 */

b,
strong {
    font-weight: bold;
}

blockquote {
    margin: 1em 40px;
}

/*
 * Addresses styling not present in Safari 5 and Chrome.
 */

dfn {
    font-style: italic;
}

/*
 * Addresses styling not present in IE 6/7/8/9.
 */

mark {
    background: #ff0;
    color: #000;
}

/*
 * Addresses margins set differently in IE 6/7.
 */

p,
pre {
    margin:  0 0 1em;
}

/*
 * Corrects font family set oddly in IE 6, Safari 4/5, and Chrome.
 */

code,
kbd,
pre,
samp {
    font-family: monospace, serif;
    _font-family: 'courier new', monospace;
    font-size: 1em;
}

/*
 * Improves readability of pre-formatted text in all browsers.
 */

pre {
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/*
 * Addresses CSS quotes not supported in IE 6/7.
 */

q {
    quotes: none;
}

/*
 * Addresses `quotes` property not supported in Safari 4.
 */

q:before,
q:after {
    content: '';
    content: none;
}

/*
 * Addresses inconsistent and variable font size in all browsers.
 */

small {
    font-size: 80%;
}

/*
 * Prevents `sub` and `sup` affecting `line-height` in all browsers.
 */

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

/* ==========================================================================
   Lists
   ========================================================================== */

/*
 * Addresses margins set differently in IE 6/7.
 */

dl,
menu,
ol,
ul {
    margin: 1em 0;
}

li {list-style:none;}

dd {
    margin: 0 0 0 40px;
}

/*
 * Addresses paddings set differently in IE 6/7.
 */

menu,
ol,
ul {
    padding: 0;
}

/*
 * Corrects list images handled incorrectly in IE 7.
 */

nav ul,
nav ol {
    list-style: none;
    list-style-image: none;
}

/* ==========================================================================
   Embedded content
   ========================================================================== */

/*
 * 1. Removes border when inside `a` element in IE 6/7/8/9 and Firefox 3.
 * 2. Improves image quality when scaled in IE 7.
 */

img {
    border: 0; /* 1 */
    -ms-interpolation-mode: bicubic; /* 2 */
}

/*
 * Corrects overflow displayed oddly in IE 9.
 */

svg:not(:root) {
    overflow: hidden;
}

/* ==========================================================================
   Figures
   ========================================================================== */

/*
 * Addresses margin not present in IE 6/7/8/9, Safari 5, and Opera 11.
 */

figure {
    margin: 0;
}

/* ==========================================================================
   Forms
   ========================================================================== */

/*
 * Corrects margin displayed oddly in IE 6/7.
 */

form {
    margin: 0;
}

/*
 * Define consistent border, margin, and padding.
 */

fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

/*
 * 1. Corrects color not being inherited in IE 6/7/8/9.
 * 2. Corrects text not wrapping in Firefox 3.
 * 3. Corrects alignment displayed oddly in IE 6/7.
 */

legend {
    border: 0; /* 1 */
    padding: 0;
    white-space: normal; /* 2 */
    *margin-left: -7px; /* 3 */
}

/*
 * 1. Corrects font size not being inherited in all browsers.
 * 2. Addresses margins set differently in IE 6/7, Firefox 3+, Safari 5,
 *    and Chrome.
 * 3. Improves appearance and consistency in all browsers.
 */

button,
input,
select,
textarea {
    font-size: 100%; /* 1 */
    margin: 0; /* 2 */
    vertical-align: baseline; /* 3 */
    *vertical-align: middle; /* 3 */
}

/*
 * Addresses Firefox 3+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */

button,
input {
    line-height: normal;
}

/*
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Corrects inability to style clickable `input` types in iOS.
 * 3. Improves usability and consistency of cursor style between image-type
 *    `input` and others.
 * 4. Removes inner spacing in IE 7 without affecting normal text inputs.
 *    Known issue: inner spacing remains in IE 6.
 */

button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button; /* 2 */
    cursor: pointer; /* 3 */
    *overflow: visible;  /* 4 */
}

/*
 * Re-set default cursor for disabled elements.
 */

button[disabled],
input[disabled] {
    cursor: default;
}

/*
 * 1. Addresses box sizing set to content-box in IE 8/9.
 * 2. Removes excess padding in IE 8/9.
 * 3. Removes excess padding in IE 7.
 *    Known issue: excess padding remains in IE 6.
 */

input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
    *height: 13px; /* 3 */
    *width: 13px; /* 3 */
}

/*
 * 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */

input[type="search"] {
    -webkit-appearance: textfield; /* 1 */
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box; /* 2 */
    box-sizing: content-box;
}

/*
 * Removes inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/*
 * Removes inner padding and border in Firefox 3+.
 */

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/*
 * 1. Removes default vertical scrollbar in IE 6/7/8/9.
 * 2. Improves readability and alignment in all browsers.
 */

textarea {
    overflow: auto; /* 1 */
    vertical-align: top; /* 2 */
}

/* ==========================================================================
   Tables
   ========================================================================== */

/*
 * Remove most spacing between table cells.
 */

table {
    border-collapse: collapse;
    border-spacing: 0;
}


/*! main.css  */
/*
 * HTML5 Boilerplate
 *
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

body {
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection declarations have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images and the bottom of their containers: h5bp.com/i/440
 */

img {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Chrome Frame prompt
   ========================================================================== */

.chromeframe {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

html {background-color:#000;overflow-y: scroll;}
html, body {width:100%;color:#999;height:100%;}
h1, h2, h3, #nav li, #navmob {text-transform:uppercase;font-family:'Armata','armataregular', sans-serif;font-weight:normal;}
p, h4, h5, h6, .entry-date, .searchform {font-family:'PT+Sans+Narrow', sans-serif;font-size:13px;line-height: 20px;font-weight:normal;}
a, a:hover, a:visited, a:active {text-decoration:none;color:#fff;}
@font-face {
    font-family: 'armataregular';font-weight: normal;font-style: normal;src: url('fonts/armata-regular-webfont.eot');
    src: url('fonts/armata-regular-webfont.eot?#iefix') format('embedded-opentype'),url('fonts/armata-regular-webfont.woff') format('woff'),url('fonts/armata-regular-webfont.ttf') format('truetype'),url('fonts/armata-regular-webfont.svg#armataregular') format('svg');
}

/* HEADER & NAV */
#header {width:100%;height:64px;position: absolute;  z-index: 110;background: rgba(0, 0, 0, 0.7);-webkit-box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.8);-moz-box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.8);box-shadow:  0 0 10px 2px rgba(0, 0, 0, 0.8);}
#omuk-logo-small {margin:0  42px ;height: 64px;float:left;}
#omuk-logo-small img {margin-top:12px;}
#omuk-logo-small img:hover {-webkit-box-shadow: 0 0 10px 0px rgba(255, 255, 255, 0.8);-moz-box-shadow: 0 0 10px 0px rgba(255, 255, 255, 0.8);box-shadow: 0 0 10px 0px rgba(255, 255, 255, 0.8);}
#nav {margin:0 42px 0 0;height:64px;float:right;font-size:16px;line-height:42px;}
#nav li {display: inline;list-style-type: none;padding-right: 20px;}
#nav li:hover {text-shadow: 0px 0px 1px #fff,0px 0px 20px rgba(255,255,255,0.8),0px 0px 10px rgba(255,255,255,0.8),0px 0px 5px rgba(255,255,255,0.7);}
#nav-social {float:right;margin:13px 0 20px;}
#nav-social a {margin:0 3px;}
.menu-header {float:left;}
#navmob{display:none;}
#mobmenuitems {display:none;}
/* UNIVERSALS */
.box-shadows {-webkit-box-shadow:  0 0 5px 2px rgba(0, 0, 0, 1);-moz-box-shadow:  0 0 5px 2px rgba(0, 0, 0, 1);box-shadow:  0 0 5px 2px rgba(0, 0, 0, 1);}
.transitions, .transitions a, .transitions img {-webkit-transition: all 0.3s;-moz-transition: all 0.3s;-ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s;}
#background {z-index:-1;position:fixed;top:0;left:0;width:100%;height:100%;}
#page-container {width:100%;min-height:95%;clear: both;position:relative;}
#page-container-2 {width:100%;min-height:95%;clear:both;overflow:hidden;}
.limit-width-master {width:100%;max-width:1600px;height:100%;margin:0 auto;}
#breadcrumbs {color:#fff;width: 92%;padding:32px 2%;margin:96px 2% 32px;float:left;background: rgba(0, 0, 0, 0.8);}
#breadcrumbs h1 {font-size:24px;line-height: 32px;float: left;}
#breadcrumbs h2 {font-size:24px;line-height: 32px;float:left;color:#444;}
#breadcrumbs h2:hover {color:#fff;}
#sidebar {float:left;color:#fff;width:25%;min-height:608px;padding:32px 2%;margin:96px 2% 32px;background:rgba(0, 0, 0, 0.7);}
#sidebar h1, #sidebar h2 {font-size:24px;line-height: 32px;}
#sidebar h3, #articles h2, #articles h3, #services h3, #studio h2 {font-size:20px;line-height: 28px;}
#sidebar .vid, #sidebar .simg {margin-bottom: 16px;}
#side-content {margin-top:16px;}
#side-content p a, #side-content p a:hover {text-decoration: underline;}
#sidebar p {margin:0;margin:0 0 16px;}
#sidebar ul {margin:0 0 16px;}
#articles {float:right;color:#fff;min-height:640px;width:65%;padding:0 0 16px;margin:96px 2% 32px 0;background:rgba(0, 0, 0, 0.7);}
#articles hr {margin-top:32px;clear:both;float: left;width: 100%;}
article, #cats {padding:32px 4% 0;}
article img {width:100%;height:auto;}
article p a, article p a:hover  {text-decoration: underline;}
.vid {position: relative; padding-bottom: 56.25%; /* 16:9 */  padding-top: 25px;height: 0;clear: both;}
.vid iframe {position:absolute;top:0;left:0;width:100%;height:100%;}
.zbPlayer {font-family:'Armata','armataregular' , sans-serif;font-size:16px;letter-spacing:0;font-weight:300 !important;text-transform:uppercase;}
/* HOME */
#leftcolumn {float:left;margin:128px 42px 0;width: 480px;}
#headline {margin: 0 ;color:#fff;font-size:36px;text-shadow: 0px 0px 2px #000,0px 0px 20px rgba(0,0,0,0.8),0px 0px 10px rgba(0,0,0,0.8),0px 0px 5px rgba(0,0,0,0.7);}
#strapline p {font-size: 18px;line-height: 24px;margin:18px 0;color:#fff;text-shadow: 0px 0px 2px #000,0px 0px 20px rgba(0,0,0,0.8),0px 0px 10px rgba(0,0,0,0.8),0px 0px 5px rgba(0,0,0,0.7);}
#slides {margin:0 0 32px;min-height: 120px;}
#slides li {display: none;}       
#quote {margin-top: 48px;}
#quote h3 {font-size:28px;line-height: 36px;text-transform: none;color:#fff;text-shadow: 0px 0px 2px #000,0px 0px 20px rgba(0,0,0,0.8),0px 0px 10px rgba(0,0,0,0.8),0px 0px 5px rgba(0,0,0,0.7);}
#quote p {font-size:20px;line-height: 24px;margin: 20px 0 0;color:#fff;text-shadow: 0px 0px 2px #000,0px 0px 20px rgba(0,0,0,0.8),0px 0px 10px rgba(0,0,0,0.8),0px 0px 5px rgba(0,0,0,0.7);}
#rightcolumn {float: right;margin:128px 2% 0;width: 399px;}
.tabbuttons {margin:0;list-style-type: none;text-align: left;margin: 0;}
.tabbuttons li a {outline:none;font-family:'Armata','armataregular' , sans-serif;font-size:13px;float:left;padding: 7px 16px;margin:0 5px 5px 0;color:#fff !important;border-radius: 2px 2px 0 0;background:rgba(0, 0, 0, 0.8);}
.tabbuttons li a:hover {text-shadow: 0px 0px 1px #fff,0px 0px 20px rgba(255,255,255,0.8),0px 0px 10px rgba(255,255,255,0.8),0px 0px 5px rgba(255,255,255,0.7);}
.intro {display: none;width:100%;color:#fff;overflow:hidden;float:right;background:rgba(0, 0, 0, 0.8);}
.intro-padder {padding: 4%;height: 94%;}
.intro h2 {font-size:16px;margin:0 0 16px;width:80%;} 
.intro h3 {font-size:13px;}
.intro p a {text-decoration: underline;}
.arrow-button {float:right;margin-top: -4px;float:right;}
#slides2 {width:100%;height:100%;margin:0;position:relative;}
.slider-image {width:100%;height:220px;margin-bottom:20px;display:block;}
.slidesjs-control, .slidesjs-container {height: 520px !important;}
.slidesjs-slide {height: 540px !important;}
.slidesjs-pagination {display: none;}
.slidesjs-play {display: none !important;}
.slidesjs-next, .slidesjs-previous {position:absolute;top:100px;z-index: 10;}
.slidesjs-next {right:5px;text-indent: -9999px;overflow: hidden;width:32px;height:32px;background: url('images/right-arrow-small.png');}
.slidesjs-previous {left:5px;text-indent: -9999px;overflow: hidden;width:32px;height:32px;background: url('images/left-arrow-small.png');}
.xoxo {overflow:auto;}
#cff {height: 500px;overflow-y: auto;}
#cff a {text-decoration: underline !important;}
.fbf_facebook_page_widget li {font-family:'PT+Sans+Narrow', sans-serif;font-size:13px;color:#fff;margin-bottom: 5px;}
/* NEWS */
#news-side-content {margin-top: 16px;}
#news-side-content h3 {font-size: 16px;line-height: 20px;clear: both;}
#news-side-content .sidebar-section {margin:16px 0 32px;float:left;width:100%;}
#news-side-content .sidebar-section p {margin-bottom: 0;}
.news-buttons a {float:left;background:#333;padding:8px 12px 6px;margin: 4px;font-size:13px;line-height: 20px;font-family:'Armata','armataregular', sans-serif;text-transform:uppercase;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.news-buttons a:hover {background:#444;}
.article-image {width:32%;float:right;}
.article-text {width:60%;float:left;margin-bottom:13px;}
.article-text iframe {width:100%;}
.entry-meta {margin-bottom: 13px;}
.meta-prep, .meta-sep, .author, #nav-above {display:none;}
.single .article-image {width:100%;height:auto;margin:0 0 16px;}
#nav-posts, #nav-below {padding: 16px 4% 0;float:left;}
#nav-posts a, #nav-below a {font-family:'PT+Sans+Narrow', sans-serif;font-size:13px;text-transform:uppercase;float:left;background:#333;margin: 0 8px 0 0;padding:8px 8px 4px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.nav-next, .nav-previous, .next, .prev {float:left;margin:0 8px 8px 0;}
/* SERVICES - WHAT WE DO */
.service-menu-tiem a {font-size:14px;line-height: 20px;font-family:'Armata','armataregular', sans-serif;font-weight:normal;width: 100%;}
.service-menu-tiem a:hover {text-shadow: 0px 0px 1px #fff,0px 0px 20px rgba(255,255,255,0.8),0px 0px 10px rgba(255,255,255,0.8),0px 0px 5px rgba(255,255,255,0.7);}
#services {position: relative;float:right;width:65%;margin:96px 2% 32px 0;} /*total=44%*/
.service-box {height:672px;width: 100%;color:#fff;position:relative;overflow:hidden;display: none;background:rgba(0, 0, 0, 0.7);}
.service-title {float:left;padding:32px 4% 20px;width: 92%}
.service-text {float:left;padding: 0 4% 0;width: 92%}
.service-text p {margin: 0 0 16px;}
.service-text a, .service-text a:hover {text-decoration: underline;}
.service-image-mob {display:none;}
.service-image-desktop img {width: 100%;}
.service-vid {margin: 0 4%;width: 92%;max-width: 640px;}
/* STUDIOS */
#studio {min-height:640px;float:right;color:#fff;width:65%;margin:96px 2% 32px 0;background:rgba(0, 0, 0, 0.7);}
.studio-box {overflow:hidden;margin:0 0 8px;padding:32px 4%; }
.gallery-item {float:left;margin:8px;}
.studios-gallery {margin:16px 0 ;}
.ps-active {position: relative;}
/* OUR WORK */
#featured-games {width:98%;margin:0 0 0 1%;float:left;}
.featured-game {width: 31.33%;height: 280px;float: left;margin: 0 1% 2%;position:relative;}
.featured-game:hover {text-shadow: 0px 0px 1px #fff,0px 0px 20px rgba(255,255,255,0.8),0px 0px 10px rgba(255,255,255,0.8),0px 0px 5px rgba(255,255,255,0.7);}
.game-name-holder {width:100%;height:64px;background:rgba(0, 0, 0, 0.9);bottom:0;position:absolute;}
.game-name {text-align:center;font-size:16px;color:#fff;width: 90%;padding:0 5%;position: relative;top: 50%;-webkit-transform: translateY(-50%);  -ms-transform: translateY(-50%);transform: translateY(-50%);}
#gameslist {width:92%;margin:8px 2% 32px;padding:2%;float:left;background:rgba(0, 0, 0, 0.8);}
.gameslist-item {width:48%;font-size:16px;color:#fff;float:left;padding:0 2% 8px 0;}
.work-item p a, .work-item p a:hover {text-decoration: underline;}
.work-side-image {width:100%;height:auto;margin-bottom:16px;}
.single-work #sidebar {margin-top: 0;min-height: 480px;}
.single-work #articles {margin-top: 0;min-height: 528px;}
/* TEAM */
.team-role {margin-bottom: 8px;}
.team-text {margin-bottom: 0;}
/* PRIVATE CONTENT */
.private-links {clear:both;margin-top:20px;float:left;width:100%;}
.private-link {padding: 8px 12px 6px;background:#333;margin:10px 0;display: block;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.private-link:hover {background:#222;}
.login-button {font-family:'Armata','armataregular', sans-serif;text-decoration: none !important;text-transform: uppercase;float:left;background:#333;padding: 8px 12px 6px;;border-radius: 5px;margin: 20px 0.25em;clear: both;}
.login-button:hover {background: #444;}
.single-privatecontent #sidebar {margin-top: 0;min-height: 480px;}
.single-privatecontent #articles {margin-top: 0;min-height: 528px;}
.private-videos, .private-audios {width:100%;float: left;margin-bottom: 20px;}
.video-container {float:left;margin:1%;width:48%;}
.audio-container {float:left;margin:1%;width:98%;}
video, audio {width:100%;height: auto;}
/* PAGE */
.page-template-default #sidebar h1 {display: none;}

/* FOOTER */
    footer {width:100%;height:1.4em;padding:0.33em 0;z-index: 1;}
    #footer {width:100%;color:#999;font-family:'PT+Sans+Narrow', sans-serif;font-size:0.6em;line-height:2em;letter-spacing:0;}
    #copyright {padding:0 1em 0 3em ;float:left;}
    #copyright a {color:#999 ;}







/***** TABLET MEDIA QUERIES *****/

@media only screen and (max-width:1080px) {
#sidebar h2, #sidebar h1, #breadcrumbs h2, #breadcrumbs h1 {font-size:20px;}
#sidebar h3 a {font-size:13px;margin-bottom:0.66em;letter-spacing:0em;color:#dddddd;text-transform:uppercase;}
#breadcrumbs {margin:84px 2% 20px;padding:20px 2%;}
#sidebar {margin:84px 0 0 2% ;padding:20px 2%;min-height:632px;}
.single-work #sidebar, .single-privatecontent #sidebar {min-height: 540px;}
.single-work #articles, .single-privatecontent #articles {min-height: 564px;}
#articles {margin:84px 2% 3em 0;}
article, #cats {padding:20px 4% 0;}
/* HOME */
#leftcolumn {margin:84px 0 0 42px;width: 340px;}
#headline {font-size:29px;}
#strapline p {font-size: 15px;line-height: 20px;margin:15px 0;}
#quote {margin-top:32px;}
#quote h3 {font-size:24px;line-height: 32px;}
#quote p {font-size:16px;line-height: 20px;}
#rightcolumn {margin:84px 2% 0 0;}
/* SERVICES */
#services {margin:84px 2% 3em 0;}
.service-title {padding:20px 4% 20px;}
/* STUDIO */
#studio {margin:84px 2% 3em 0;min-height: 652px}
.studio-box {padding:20px 4%; }
}
@media only screen and (min-width:920px) and (max-width:1080px) and (max-height:760px) and (orientation:landscape) { /* ipad landscape */
#background {-webkit-background-size: auto 750px !important; } 
#page-container {height:100%;}
.page-template-om-3-services #page-container-2 {height:100%} 
#sidebar {min-height: 530px;}
#articles {min-height:450px;}
.single-work #sidebar, .single-privatecontent #sidebar {padding:16px 2%;margin:0 2% 16px;min-height: 446px}
.single-work #articles, .single-privatecontent #articles {min-height: 462px;}
.page-template-om-3-services #sidebar, .page-template-om-9-privatecontent #sidebar {min-height: 530px;}
/* HOME */
.intro {height:532px;overflow:hidden;}
    #twitter-widget-0 {height:464px;}
/* SERVICES */
.service-box {height:570px;}
/* STUDIO */
.gallery-item {margin:1%;}
}
@media only screen and (max-width:1020px) {
#nav-social {display:none;}
}
@media only screen and (max-width:920px) {
#nav {display: none;}
#navmob {display:block;float:right;height:64px;margin-right:42px;}
#mobilemenulink {margin:16px 0 0;font-size:16px;line-height:42px;}
#mobmenuitems {height: 308px;width:100%;background:#222;}
#mobmenuitems .menu-header {width:100%;}
#mobmenuitems ul {margin:0;width:100%;}
#mobmenuitems li {height:42px;padding: 0 42px;border-top: 1px dotted #444;}
#mobmenuitems li a {width:100%;float:right;font-family:'Armata','armataregular',sans-serif;font-size:16px;line-height:42px;text-transform:uppercase;text-align:right;}
.contact #sidebar {background:none;}
.contact .box-shadows {-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;}
}
@media only screen and (max-width:840px) {
#breadcrumbs {margin:80px 2% 16px;padding:16px 2%;}
#sidebar {padding:16px 2%;margin:80px 2% 0;min-height: 0 !important;}
#sidebar, .single-work #sidebar {width:92%;padding: 16px 2%;}
.page-template-default #sidebar h1 {display: block;}
.page-template-default #sidebar img {display: none;}
.page-template-default #articles h1 {display: none;}
.page-template-om-2-news #sidebar, .single-post #sidebar {min-height: 0;}
.single-work #sidebar, .single-privatecontent #sidebar  {width:92%;padding: 16px 2%;margin:0 2% 16px;}
#sidebar h2 {font-size:20px;}
#articles {width:96%;margin:16px 2% ;}
article {padding:16px 2% 0;}
/* HOME */
#leftcolumn {margin:88px 4% 0;width: 92%;}
#quote h3 {color:#fff;font-size:22px;line-height: 30px;}
#quote p {margin: 8px 0 0 ;}
#rightcolumn{margin:0 2%;width: 96%;}
/* NEWS */
#nav-posts, #nav-below {padding: 16px 2% 0;}
.single #news-side-content {display:none;}
.article-text {width:64%;float:left;margin-bottom:13px;}
/* SERVICES */
#services {width:96%;margin:16px 2% ;}
.service-box {display:block;margin-bottom:16px;height:auto;min-height:208px;background:rgba(0, 0, 0, 0.8) !important;}
.service-title {padding:16px 2% 0;width: 62%;}
.service-text {padding:16px 2% 0;width: 62%;}
.service-image-mob {width:32%;height:auto;margin: 16px 2% 0 0;display:block;float: right;}
.service-image-desktop {display:none;}
/* STUDIO */
#studio {width:96%;margin:16px 2% 2.6em;background:rgba(0, 0, 0, 0.7);}
.studio-box {padding:16px 2% ;margin:0;}
.gallery-item {margin:4px;}
    #footer {font-size:11px;line-height:32px;}
    #copyright, #footerlinks {width:90%;padding:0 5% ;float:left;}
/* WORK */
.featured-game {width:48%;margin: 0 1% 2%;height: 200px;}
#gameslist {margin:0 2% 32px;}
}
/* ipad portrait */
@media only screen and (min-width:580px) and (max-width:840px) and (max-height:1280px) and (orientation:portrait) {
#background {-webkit-background-size: auto 980px !important; } 
/* HOME */
.slider-image {height:320px;}
.slidesjs-next, .slidesjs-previous {top:150px;}
    #twitter-widget-0 {height:336px;}
}





/***** MOBILE MEDIA QUERIES *****/

@media only screen and (max-width:760px) {
#omuk-logo-small {margin:0  16px;}
#navmob{margin-right:16px;}
#mobmenuitems li {padding: 0 16px;}
#breadcrumbs {width:90%;margin:80px 3% 16px;padding:16px 2%;}
#sidebar {width:90%;padding:  8px 2%;margin: 80px 3% 0;}
.single-work #sidebar, .single-privatecontent #sidebar {width:90%;padding: 8px 2%;margin:0 3% 16px;}
.page-template-om-2-news #sidebar, .single-post #sidebar {min-height: 0;}
#sidebar h3 {font-size:16px;}
#articles hr {margin-top:16px;}
article {margin:0 0 8px ;padding: 8px 2%;width:96%;}
article img {max-width:100%;height:auto;padding:0;}
article h2 {font-size:16px;}
#studio, #services, #articles {margin:16px 3%;width:94%;}
/* HOME */
#headline {font-size:26px;}
#quote h3 {font-size:20px;line-height: 28px;}
#quote p {font-size:13px;line-height: 16px;}
#rightcolumn {margin:0 3%;width: 94%;}
/* WORK */
#featured-games {width:94%;margin:0 3%;}
.featured-game {width:100%;margin:0 0 16px;height: 360px;}
#gameslist {width:90%;margin:0 3% 32px;}
.gameslist-item {width: 100%;margin: 0;}
}
@media only screen and (max-width:760px) and (max-height:520px) and (orientation:landscape) {
#background {-webkit-background-size: auto 525px !important;} 
}
@media only screen and (max-width:520px){
.tabbuttons li a {font-size:12px;}
.article-image {width:100%;margin:8px 0 13px;}
.article-text {width:100%;margin-bottom:16px;}
    #footer {font-size:0.6em;line-height:1em;}
/* HOME */
#leftcolumn {margin:88px 5% 0;width: 90%;}
/* SERVICES */
.service-menu-tiem {line-height: 20px !important;}
.service-title {width: 96%;padding:0.5em 2% 0}
.service-text {width: 96%;padding:0 2% 0.5em}
.service-image-mob {width: 96%;margin: 8px 2% 16px;}
    .video-container {float:left;margin:0 0 1% 0;width:100%;}
/* WORK */
.featured-game {height: 220px;}
/* STUDIO */
.gallery-item {margin:6px;}
.gallery-item img {width:132px;height: auto;}
}
@media only screen and (max-width:380px) and (max-height:520px) {
#background {-webkit-background-size: auto 480px !important;} 
/* WORK */
.featured-game {height: 180px;}
}












/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 100%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   Theses examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
       only screen and (min-resolution: 144dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow:none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}


/** END HTML5 Boilerplate CSS **/






/** START Starkers CSS **/

/* LAYOUT */
/* ----------------------------------------- */

/* These rather presentational classes are generated by WordPress, so it's useful to have some styles for them. Edit as you see fit. More info: http://codex.wordpress.org/CSS */
.aligncenter { display:block; margin:0 auto }
.alignleft { float:left }
.alignright { float:right }
.wp-caption { border:1px solid #666; text-align:center; background:#ccc; }

/* You might find the following useful */
/* div, ul, li { position:relative } This will save you having to declare each div / ul / li's position as 'relative' and allows you to absolutely position elements inside them
br.clear { clear:both; display:block; height:1px; margin:-1px 0 0 0 } /* Use this br class to clear your floated columns */
li#theme-switcher { background:#fff; border:10px solid red; padding:20px; position:fixed; top:0; right:0 } /* Use this if you have the Theme Switcher Reloaded plugin (http://themebot.com/webmaster-tools/1-wordpress-theme-switcher-reloaded) installed and want to make it nice and obvious */
*/
/* TYPOGRAPHY */
/* ----------------------------------------- */

h1, h2, h3, h4, h5, h6 { font-weight:bold } /* This helps to identify headings at the initial build stage, so I thought it'd be useful to have it */
.alert { background:red; color:white } /* 'alert' has a basic style, since it's useful to have it standing out for testing purposes.



/* Font stack options

	The following represents a list of font stacks, as recommended by Nathan Ford in
	http://unitinteractive.com/blog/2008/06/26/better-css-font-stacks/

	I've added inverted commas around the relevant family names to ensure compatibility.
	p = balanced for paragraphs or body copy
	t = balanced for headlines or titles

	- - - -

Arial, "Helvetica Neue", Helvetica, sans-serif - p, t

Baskerville, "Times New Roman", Times, serif - p
Baskerville, "Times, Times New Roman", serif - t

Cambria, Georgia, Times, "Times New Roman", serif - p, t
"Century Gothic", "Apple Gothic", sans-serif - p, t

Consolas, "Lucida Console", Monaco, monospace - p, t

"Copperplate Light", "Copperplate Gothic Light", serif - p, t

"Courier New", Courier, monospace - p, t

"Franklin Gothic Medium", "Arial Narrow Bold", Arial, sans-serif - p, t

Futura, "Century Gothic", "Apple Gothic", sans-serif - p, t

Garamond, "Hoefler Text", "Times New Roman", Times, serif - p
Garamond, "Hoefler Text", Palatino, "Palatino Linotype", serif - t

Geneva, "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif - p
Geneva, Verdana, "Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif - t

Georgia, Palatino, "Palatino Linotype", Times, "Times New Roman", serif - p
Georgia, Times, "Times New Roman", serif - t

GillSans, Calibri, Trebuchet, sans-serif - p
GillSans, Trebuchet, Calibri, sans-serif - t

"Helvetica Neue", Arial, Helvetica, sans-serif - p
Helvetica, "Helvetica Neue", Arial, sans-serif - t

Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif - p, t

"Lucida Sans", "Lucida Grande", "Lucida Sans Unicode", sans-serif - p, t

Palatino, "Palatino Linotype", Georgia, Times, "Times New Roman", serif - p
Palatino, "Palatino Linotype", "Hoefler Text", Times, "Times New Roman", serif - t

Tahoma, Geneva, Verdana - p
Tahoma, Verdana, Geneva - t

Times, "Times New Roman", Georgia, serif - p, t

Trebuchet, "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif - p
Trebuchet, Tahoma, Arial, sans-serif - t

Verdana, Geneva, Tahoma, sans-serif - p
Verdana, Tahoma, Geneva, sans-serif - t

*/

/** END Starkers CSS **/

/** START WordPress-Defined CSS Classes **/
.wp-caption-text{}
.gallery-caption{}
.bypostauthor{}
.sticky{}
/** Keep drop-downs working **/
#access li {
	float: left;
	position: relative;
}
#access ul ul {
	display: none;
	float: left;
	position: absolute;
	top: 3.333em;
	left: 0;
	z-index: 99999;
}
#access ul ul ul {
	left: 100%;
	top: 0;
}
#access ul li:hover > ul {
	display: block;
}
/** END WordPress-Defined CSS Classes **/