/*
Theme Name: html5 shell by mimoYmima.com
Theme URI: http://html5.mimoymima.com/
Description: a Framework for rapidly developing HTML5 based WordPress Themes
Version: 1.53
Author: Brent Lagerman
Author URI: http://mimoymima.com/
*/
/*
mYm6 - updated: June 13, 2012 - brent@mimoymima.com
--- Color References ---
link blue: #39C;
background: #XXXXXX;
*/
/*--------------------------------------------------------------------------------------------------*/
/* GENERAL STYLES - These defaults aren't site specific so you don't probably need to change them */
/* add your styles in the BASE STYLING section below */
/*--------------------------------------------------------------------------------------------------*/
/* Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) -- http://cssreset.com */ html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none;}blockquote:before, blockquote:after,q:before, q:after { content: ''; content: none;} table { border-collapse: collapse; border-spacing: 0; }
/*--- TEXT ---*/
/* Font stacks - some premade stacks you could use, by default we're using the sans stack in the 'base styling' section below */
.serif { font-family: Baskerville, Palatino, "Palatino Linotype", "Hoefler Text", "Times New Roman", times, serif; } /*cambria, cochin ??*/
.monospace { font-family: 'courier new', courier, Consolas, Menlo, Monaco, 'Lucida Console', 'Liberation Mono', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', monospace; }
.sans { font-family: 'Helvetica Neue', helvetica, sans-serif; }
/*--- CODE ---*/
code { background-color: #2A410B !important; font-family: 'Andale Mono', 'Lucida Console', "courier new", courier, monospace; background-color: #069; color: #FFF; padding: .5em; -moz-border-radius: 5px; -khtml-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
pre code { line-height: 130%; display: block; padding: 1em; margin: 2em 0; overflow: auto; }
pre { margin: 1em; }
/*--- FORMS ---*/
#search-form input[type='text'] { width: 10em; }
/*--- LISTS ---*/
/* .no-bullet: list without bullets */
.no-bullet { list-style-type: none; margin-bottom: 2em; }
.no-bullet li { margin-bottom: .5em; }
/* .bullet-list: nicer formatting for a bulleted list */
.bullet-list { margin: 1em 0 2em 0; line-height: 150%; }
.bullet-list li { margin: 0 2em 1em 2em; list-style-type: square; }
.bullet-list li ul { margin: .5em 0 1.5em 0; }
.bullet-list li ul li { list-style-type: circle; margin: 0 2em .5em 2em; }
/* .horiz-list: Used to put a list inline (horizontal) and get rid of the bullets */
.horiz-list ul { float: left; list-style-type: none; }
.horiz-list li { float: left; display: inline; }
.horiz-list li a { display: block; float: left; width: auto; }
/* .link-list */
.link-list li { list-style-type: none; }
li.link-list a, ul.link-list li a { display: block; background: url(./images/icon_link_arrow.png) 0px 8px no-repeat; padding-left: 20px; margin-left: 20px; }
/* .pdf-list */
.pdf-link { padding-left: 20px; margin-left: 5px; }
.pdf-list li { list-style-type: none; }
li.pdf-list a, ul.pdf-list li a { display: block; background: url(./images/icon_pdf_sm.png) 0 3px no-repeat; padding-left: 20px; margin-left: 20px; }
/*--- UTILITY ---*/
/* Clear Fixes - two methods, clear-fix is attached to the element you want to clear, .clear-all you can attach to a hr or br tag to clear the item before it as a last resort when you're in a hurry */
.clear-fix:before,
.clear-fix:after { content: ""; display: table; }
.clear-fix:after { clear: both; }
.clear-all { visibility: hidden; clear: both; margin: 0 !important; padding: 0 !important; font-size: 0; height: 1px; }
/* TODO: might try this one instead one day: http://nicolasgallagher.com/micro-clearfix-hack */
/* WordPress WYSIWYG alignment -- when you put in images that span the entire width of the content area remove the width and height */
img.aligncenter { max-width: 100%; display: block; margin: 5px auto; }
img.alignright { padding: 4px; margin: 0 0 2px 7px; display: inline; }
img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline; }
.alignright { float: right; }
.alignleft { float: left; }
/* Warnings */
.sys { text-align: left }
.warn {}
/*--- JQUERY RELATED --- */
/* PRELOADER: Relies on some js in the functions file and a div in the header (both commented out by default) */
/*.js div#preloader { position: fixed; left: 0; top: 0; z-index: 999; width: 100%; height: 100%; overflow: visible; background: #c0c0c0 url(./images/loading.gif) no-repeat center center; }*/
/* Show-Hide Content */
.make-link { color: #06F !important; text-decoration: none; margin-bottom: .5em; }
.make-link:hover, .make-link:focus, .make-link:active { cursor: pointer; color: #C60; text-decoration: underline; }
ul.hide { margin: 0 0 0 1em !important; padding: 0 !important; }
/* Adds 'Plus-Minus' sign to header */
.header-shown { background: url('./images/icon_link_plus_minus.png') no-repeat 0 -20px; height: 17px; }
.header-hidden { background: url('./images/icon_link_plus_minus.png') no-repeat 0px 3px; height: -14px; }
/* Indicators */
.indicator { position: absolute; z-index: 100; text-align: right; left: 0; }
.indicator a { width: 7em; background-color: #FF0; display: block; font-weight: bold; font-size: 12px !important; text-transform: uppercase; text-decoration: none; padding: .5em 1em; }
.indicator a:link, .indicator a:visited { color: black; }
.indicator a:hover, .indicator a:focus, .indicator a:active { color: black; background-color: #FFF; text-decoration: none; cursor: pointer; }
#js-ind { top: 20em; }
/* Hide these items when Javascript is active */
.js #js-ind, .js .hide { display: none; }
/*--------------------------------------------------------------------------------------------------*/
/* BASE STYLING: sytle 320px first and go up from there using media query areas below */
/*--------------------------------------------------------------------------------------------------*/
/*--- SITE WIDE ---*/
/* LOAD FONTS */
@font-face { font-family: 'Theorem'; src: url('./fonts/theorem-webfont.eot'); src: url('./fonts/theorem-webfont.eot?#iefix') format('embedded-opentype'), url('./fonts/theorem-webfont.woff') format('woff'), url('./fonts/theorem-webfont.ttf') format('truetype'), url('./fonts/theorem-webfont.svg#Theorem') format('svg'); font-weight: normal; font-style: normal; }
/* Set the background and font color for the html and body, if you don't have a different bkg for the body set both to be the same */
html { background: #FFF; color: #333; }
body { background: #FFF; color: #333; }
html, body { overflow-x: hidden;}
/* Sets font family, size, width, and margins for the page */
body { font-size: 15px; font-weight: 300; line-height: 150%; font-family: 'Arimo', sans-serif, helvetica, sans-serif; color: #823108 }
/* Headings */
h1, h2, h3, h4, h5, h6 { font-weight: 500; font-family:'Pacifico', cursive; }
h1 { color: #F05C23; font-size: 5em; }
h2 { font-size: 4em }
h3 { font-size: 2em; line-height: 2em; }
/* Links */
a:link, a:visited { color: #F05C23; text-decoration: underline; }
a:hover, a:active, a:focus { color: #F05C23; text-decoration: none; }
/* Hide these elements but keep them accessible */
.access-hide { position: absolute; left: -999em; }
/* page-wrapper */
#page-wrapper { }
/*--- HEADER ---*/
#site-header { width: 100%; background: url('./images/bkg-header.png') 0 0 repeat-x #F7F0DC; height: 269px;}
#head { width: 980px; background: url('./images/head.png') center 8px no-repeat; height: 280px; margin: 0 auto;}
hgroup { width: 100%; background: url('./images/border-header.png') 0 0 repeat-x; height: 260px; position: absolute; margin-top: -201px; }
#hands {background: url('./images/hands.png') center top no-repeat; margin: 0 auto; width: 980px; height: 268px; margin-top: -10px }
#logo { height: 259px; position: relative; top: -69px; left: -53px }
#site-header #site-title { text-indent: -9999px; }
#site-header #site-description { background: url('./images/bkg-description.png') 0 0 no-repeat; height: 128px; width: 200px; float: right; position: relative; top: -345px; }
h2#site-description { color: #139FAA; font-size: 24px; text-align: center; line-height: 1.3; padding-top: 35px; }
/* Nav */
#main-nav { float: right; position: relative; top: -178px; right: -157px; text-align: center; }
#main-nav a { font-size: 1.8em; text-decoration: none; display: inline-block; line-height: 1.4em; font-family:'Pacifico', cursive; }
/* Nav Links*/
#main-nav a:link, #main-nav a:visited { color: #F7F0DC }
#main-nav a:hover, #main-nav a:active, #main-nav a:focus { color: #F05C23;}
/* DownStates*/
#main-nav .current_page_item a { color: #F05C23 !important;}
/*--- CONTENT AREA ---*/
#content-wrapper { width: 100%; background-color: #F7F0DC; border-bottom: 7px solid #DDBF72; padding-bottom: 30px; }
#content { width: 980px; background-color: #F7F0DC; margin: 0 auto; padding-top: 40px}
#content em { font-family: baskerville, cambria, cochin, "Palatino Linotype", "Book Antiqua", Palatino, "Times New Roman", serif; }
#content header h1 { margin-bottom: 70px; }
#content h1 { margin: 0 0 100px 0; text-align: center}
#portfolio-home div.category-portfolio {display: inline-block;}
#portfolio-home { width: 100%; margin: 0 auto; display: inline-block }
#portfolio-home div.category-portfolio img {border: #A2AAA9 solid 10px; margin-bottom: 25px; margin-right: 25px; -webkit-box-shadow: 0 8px 6px -6px #666; -moz-box-shadow: 0 8px 6px -6px #666; box-shadow: 0 8px 6px -6px #666;}
#portfolio-home div.category-portfolio img:hover {border: #139FAA solid 10px;}
/* Page */
.page {}
/* Single */
.single {}
/* Comments using Intense Debate */
/*--- SIDEBAR ~ MAIN ---*/
#main-sidebar ul { list-style-position: inside; }
/*--- SIDEBAR ~ FOOTER ---*/
#footer-sidebar ul { list-style-position: inside; }
/*--- FOOTER ---*/
#footer-wrapper { width: 100%; background: url('./images/bkg-header.png') 0 0 repeat-x; border-top: 5px solid #F7F0DC; }
#footer { clear: both; background: url('./images/feet.png') top center no-repeat; width: 980px; margin: 0 auto; text-align: center}
/* Credit */
#footer #site-credits a { letter-spacing: 1px; }
#footer #copyright { font-family:'Pacifico', cursive; color: #076168; padding-top: 360px; font-size: 20px; margin-bottom: 90px; }
.body-width { width: 980px; margin: 0 auto; }
/*--------------------------------------------------------------------------------------------------*/
/* Specific Page Styles */
/*--------------------------------------------------------------------------------------------------*/
/*--- style the 503 page (coming soon page) you activate this template file in the maintenance mode plugin ---*/
.maintenance {}
/*--- home ---*/
#home #content {text-align: center; padding-bottom: 40px }
hr.fg-line { display: none }
ul.fg-thumbHolder { margin-left: -150px!important;}
a.fg-next, a.fg-previous { display:none }
a.view-all { background-color: #F05C23; padding: 15px; color: #fff !important; text-decoration: none !important; float: right; font-family:'Pacifico', cursive; font-size: 2em }
a.view-all:hover {background-color: #139FAA }
#contact-me { width: 100%; height: 350px; border-top: 5px solid #F7F0DC; border-bottom: 5px solid #DDBF72; background: #F05C23 url('./images/vintage-phone.png') center 135px no-repeat; padding-top: 70px; }
#contact-me header, #contact-me article { width: 980px; margin: 0 auto; }
#contact-me header h2 { color: #F7F0DC; font-size: 45px; text-align: center; margin-bottom: 70px }
#contact-me #call { float:left; background: url('./images/bkg-contact.png') 0 0 no-repeat; height: 175px; width: 320px; color: #823108; font-size: 20px; text-align: center;}
#contact-me #call h3, #contact-me #email h3 { font-size: 38px; margin: 45px 0 15px 0; line-height: 1em }
#contact-me #email { float: right; background: url('./images/bkg-contact.png') -330px 0 no-repeat; height: 175px; width: 320px; color: #823108; font-size: 20px; text-align: center;}
/*--- portfolio ---*/
#portfolio #content article { clear: both; min-height: 400px; border-bottom: 2px solid #DDBF72; margin-bottom: 40px }
#portfolio #content img { border: #139FAA solid 10px; margin-right: 20px }
.entry h2 { font-family: 'Theorem','Arimo', sans-serif, helvetica, sans-serif; text-transform: uppercase; font-size: 2em; margin: 0 0 20px 0; padding-top: 20px}
#portfolio div.entry{ text-align: left; line-height: 1.5em; }
#portfolio a.view-all { margin-top: 40px }
a.fg-image { border: none !important }
.fg-title { border: none !important }
.pagination a {background-color: #139FAA; color: #fff !important; text-decoration: none !important; float: right; font-family:'Pacifico', cursive; font-size: 1em; padding: 15px; }
.pagination a:hover {background-color: #F05C23; }
/*--- contact ---*/
#contact .entry h2 {text-transform: none; line-height: 1.2em }
#contact .entry h2 a { color: #823108; text-decoration: none; text-transform: none }
#contact .entry h2 a:hover { text-decoration: underline }
#contact div.connect { display: inline-block; width: 700px; margin: 0 auto; margin-bottom: 40px;}
#contact div.entry { margin-left: 150px }
/*---maintenance ---*/
#maintenance-plans form { margin-top: -40px; }
#maintenance-plans .col1 { float: left; margin-right: 100px }
/*--------------------------------------------------------------------------------------------------*/
/* 480 media query */
/*--------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 480px) and (max-width: 600px) {
/* For reference, delete later */
body:before { content: ""; left: 1em; position: absolute; top: 1em; z-index: 999; }
.row { width: 480px; }
/* add your styles here */
}
/*--------------------------------------------------------------------------------------------------*/
/* 600 media query */
/*--------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 600px) and (max-width: 750px) {
/* For reference, delete later */
body:before { content: ""; left: 1em; position: absolute; top: 1em; z-index: 999; }
.row { width: 600px; }
/* add your styles here */
}
/*--------------------------------------------------------------------------------------------------*/
/* 750 media query */
/*--------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 750px) and (max-width: 980px) {
/* For reference, delete later */
body:before { content: ""; left: 1em; position: absolute; top: 1em; z-index: 999; }
.row { width: 750px; }
/* add your styles here */
}
/*--------------------------------------------------------------------------------------------------*/
/* 980 media query */
/*--------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 980px) and (max-width: 1200px) {
/* For reference, delete later */
body:before { content: ""; left: 1em; position: absolute; top: 1em; z-index: 999; }
.row { width: 980px; }
/* add your styles here */
}
/*--------------------------------------------------------------------------------------------------*/
/* 1200 media query */
/*--------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 1200px) {
/* For reference, delete later */
body:before { }
.row { width: 1200px; }
/* add your styles here */
}