/*
    Base.css

    The base level CSS file for 320 and up, from which all screen sizes are built upon.
    Author: Graham Smith (http://thingie.co.uk)
    
    Built, in part, with HTML5 Boilerplate (http://html5boilerplate.com)
*/

/* Reset - The * selected isn't slow like it used to be. */

* {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
    
        -moz-box-sizing: border-box;
     -webkit-box-sizing: border-box;
             box-sizing: border-box;
}

article, aside, footer, header, nav, section { display: block }

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

/* Indicate that 'label' will shift focus to the associated form element */
label { cursor: pointer; }

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

button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }

input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }

textarea { overflow: auto; vertical-align: top; resize: vertical; }

/* Tables  */

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }

/* Chrome Frame Prompt  */

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

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

/*
 * 1. Correct text resizing oddly in IE6/7 when body font-size is set using em units
 * 2. Prevent iOS text size adjust on device orientation change, without disabling user zoom: h5bp.com/g
 */

html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

html, button, input, select, textarea { font-family: 'helvetica neue', Tahoma, sans-serif; color: #222; }

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

ul, ol { list-style: none; }

/*
    Red: #920052
    Grey: #939598
*/

/* Global */

h1, h2, h3 { color: #920052 }

a   { color: #920052 }
em  { color: #920052; font-weight: 600; font-style: normal; }

/* Header */

.top-bar,
.bottom-bar         { background-color: #A8AAAC; height: 10px; }

.page-header        { position: relative; max-width: 960px; margin: 0 auto; }
.page-header .logo  { display: block; background: url('../img/logo.png') no-repeat 0 0; width: 227px; height: 100px }
.page-header span   { display: block; color: #666; font-size: 120%; font-weight: 300; line-height: 1; text-transform: uppercase; text-align: center; margin-bottom: 10px }
.social-links       { position: absolute; right: 0; top: 20px }
.social-links li    { float: left; margin-left: 5px }

.social-links a         { display: block; background: url('../img/social_sprite.png') no-repeat 0 0; width: 32px; height: 32px }
.social-links .twitter  { background-position: 0 0 }
.social-links .facebook { background-position: -32px 0 }
.social-links .linkedin { background-position: -64px 0 }

.social-links .twitter:hover  { background-position: 0 -32px }
.social-links .facebook:hover { background-position: -32px -32px }
.social-links .linkedin:hover { background-position: -64px -32px }

.banner { display: none }

/* Navigation */

.primary-navigation     { background-color: #920052 }
.primary-navigation ul  { max-width: 960px; margin: 0 auto }
.primary-navigation li  { border-bottom: 1px solid #7f0248; text-align: center }
.primary-navigation a   { display: block; color: #fff; font-size: 80%; text-decoration: none; width: 100%; padding: 5px 0 }
.primary-navigation a:hover,
.primary-navigation a.current { color: #939598 }

/* Content */

.main-content       { font-size: 80% }

.ihatetimvandamme   { max-width: 960px; margin: 0 auto; }

.primary-content,
.secondary-content  { padding: 20px 10px }

.primary-content h1 { font-size: 150%; color: #313533 }
.primary-content h2 { font-size: 125%; margin: 25px 0 10px 0 }
.primary-content p  { margin-bottom: 10px }

.intro { font-size: 120%; }

.our-services h3 { text-transform: uppercase; }

.contact-us h1      { margin-bottom: 10px }
.contact-us div     { margin-bottom: 10px }
.contact-us span    { color: #920052 }

/* Secondary Content */

.secondary-content      { background-color: #F1F1F2; border-top: 1px dashed #9d9d9e }
.secondary-content h1   { font-size: 110%; color: #313533; text-transform: uppercase; }

.contact-details .phone span { color: #920052; font-weight: 600 }

.contact-form,
.latest-news        { background-color: #fff; padding: 10px; margin-bottom: 30px; border-radius: 10px }

.contact-form form  { margin-top: 10px }
.contact-form label { display: block; font-size: 90% }
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form textarea { display: block; background-color: #F1F1F2; border: 1px solid #e6e6e6; width: 100%; padding: 4px 2px; margin-bottom: 10px }
.contact-form textarea { height: 60px }
.contact-form input[type="submit"] { background-color: #920052; color: #fff; font-size: 90%; padding: 5px 10px; border-radius: 3px }

.error  { color: red }

.latest-news ul     { font-size: 85%; margin: 10px 0 0 20px; list-style: disc }
.latest-news li     { margin: 5px 0 }
.latest-news li a   { float: right }

.twitter-feed { background: url('../img/tweets.png') no-repeat 0 0; min-height: 32px; padding-left: 45px }

/* Footer */

.page-footer        { background-color: #920052; color: #fff; padding: 20px 10px }
.page-footer p      { max-width: 960px; margin: 0 auto; font-size: 70% }
.page-footer p + p  { margin-top: 5px }
.page-footer a      { color: #fff }


/* ==|== non-semantic helper classes ========================================
   Please define your styles before this section.
   ========================================================================== */

/* For image replacement */
.ir { border: 0; font: 0/0 a; text-shadow: none; color: transparent; background-color: transparent; }

/* 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; }

/* Contain floats: h5bp.com/q */
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }



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

@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */
  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; }
  
 .top-bar, .bottom-bar, .social-links, .primary-navigation, .banner { display: none }
}