/*
Theme Name: The HTML5 Reset Theme
Theme URI: http://html5reset.org
Description: A style-free theme to get you started on an HTML5-based Wordpress theme of your own.
Author: Monkey Do!
Author URI: http://monkeydo.biz
Version: 1
*/

/*
    HTML5 Reset Wordpress Theme :: style.css
    ----------------------------------------------------------
    We have learned much from/been inspired by/taken code where offered from:
    
    Eric Meyer                  :: http://ericmeyer.com
    HTML5 Doctor                :: http://html5doctor.com
    and the HTML5 Boilerplate   :: http://html5boilerplate.com
    
    Special thanks: The Wordpress theme owes its start to an empty theme authored
        by Chris Coyier & Jeff Starr: http://digwp.com
    
-------------------------------------------------------------------------------*/

/* Let's default this puppy out
-------------------------------------------------------------------------------*/

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

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

/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites, like, say for Google Maps custom placemarkers.
   There has been a report of problems with standard Google maps as well, but we haven't been able to duplicate or diagnose the issue. */
img,
object,
embed {max-width: 100%;}

/* force a vertical scrollbar to prevent a jumpy page */
html {overflow-y: scroll; overflow-x:hidden; margin-top: 0 !important; }

/* we use a lot of ULs that aren't bulleted.
    don't forget to restore the bullets within content. */
ul {list-style: none;}

blockquote, q {quotes: none;}

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

a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; text-decoration:none;}

del {text-decoration: line-through;}

abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}

/* tables still need cellspacing="0" in the markup */
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

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

input, select {vertical-align: middle;}

pre {
    white-space: pre; /* CSS2 */
    white-space: pre-wrap; /* CSS 2.1 */
    white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
    word-wrap: break-word; /* IE */
}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}

select, input, textarea {font: 99% sans-serif;}

table {font-size: inherit; font: 100%;}
 
/* Accessible focus treatment
    people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {outline: none;}

small {font-size: 85%;}

strong, th {font-weight: bold;}

td, td img {vertical-align: top;}

/* Make sure sup and sub don't screw with your line-heights
    gist.github.com/413930 */
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}

/* standardize any monospaced elements */
pre, code, kbd, samp {font-family: monospace, sans-serif;}

/* hand cursor on clickable elements */
.clickable,
label,
input[type=button],
input[type=submit],
button {cursor: pointer;}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {margin: 0;}

/* make buttons play nice in IE */
button {width: auto; overflow: visible;}
 
/* scale images in IE7 more attractively */
.ie7 img {-ms-interpolation-mode: bicubic;}

/* prevent BG image flicker upon hover */
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}

/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

em { font-style: italic; }

/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

/* new Linux- and Windows-friendly sans-serif font stack: http://mky.be/fontstack */
body {font: 13px Helmet, Freesans, sans-serif;}

/* using local fonts? make sure to read up on Paul Irish's
    Bulletproof @font-face syntax: http://mky.be/font-face/bulletproof/ */

/* we like off-black for text */
body, select, input, textarea {color: #333;}

a {color: #3b3b3b;}
a:hover {color: #3b3b3b;}

/* Custom text-selection colors (remove any text shadows: twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #fcd700; color: #fff; text-shadow: none;}
::selection {background: #fcd700; color: #fff; text-shadow: none;}

/*  j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #fcd700;}

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}



/* And here begins the Wordpress fun.
-------------------------------------------------------------------------------*/
html { height: auto; min-height: 100%; background: transparent url(images/bg.jpg) repeat; margin-top: 0px !important; }
body { background: transparent url(images/header-bg.png) repeat-x; margin:0; width:100%; height:100%; min-height:100%;
font-family: 'Satisfy', cursive; font-size:13px; text-align: left; color:#3b3b3b; }
#page-wrap {width: 1028px; position:relative; margin:auto;}
/* Header */
#header h1 a { margin:10px 0 0 0; float:left; display:block; width: 217px; height:72px; text-indent:-12345px; background: transparent url(images/logo.png) no-repeat; position:relative; z-index:100; }
#header { position:relative; height: 109px;}
.coffee-trace { position:absolute; right:0px; top:0px; width:182px; height:182px; background:transparent url('images/coffee-trace.png'); }
#header .etiquette { display:block; text-indent:-12345px; width:344px; height:151px; position:absolute; top:0; left: 132px; background: transparent url(images/etiquette.png) no-repeat;  z-index:90; }
#header .nav { display:block; text-indent:-12345px; width:273px; height:79px; position:absolute; top: 12px; right: 300px; background: transparent url(images/menu.png) no-repeat;}
#header .menu { display:block;  width:273px; height:79px; position:absolute; top: 8px; right: 0; }
#header .menu a { color:#3b3b3b;  font-size:180%; font-weight:normal;  padding-bottom: 5px;}
#header .menu a:hover { background: transparent url(images/pointilles.png) repeat-x bottom left;}
#header .menu li { float: left; width: 90px; margin-bottom: 16px;}
#header .menu li#menu-item-28,
#header .menu li#menu-item-22 { width: 113px; }
#header .menu li#menu-item-21 { width: 63px; }
#header .menu li#menu-item-20 { width: 68px; }
#header .subscribe-link {
    position: absolute;
    top: 0;
    left: 560px;
}


/* Footer */
#footer { position:relative; clear:both; margin:55px 0 0 0; background: transparent url(images/pointilles.png) repeat-x top left; height:130px; }
#footer .copyright,
#footer .press-kit,
#footer .email,
#footer .tel { color:#3b3b3b; font-size:153%; }
#footer a{ color:#3b3b3b; }
#footer .copyright,
#footer .press-kit { padding:20px 0 0 0; }
#footer .email,
#footer .tel { position:absolute; right: 0;}
#footer .email { display:block; height:35px; top:20px; padding:5px 0 0 60px; background: transparent url(images/mail.png) no-repeat;}
#footer .tel { top: 62px;  height: 43px; padding:15px 0 0 60px; background: transparent url(images/tel.png) no-repeat;}
#footer .press-kit a { text-decoration: underline; }

#bd { margin: 30px 0 0 0; position:relative; }
.home #bd { margin-top:60px; height: 495px; }
#bd .intro-text { width:530px; margin:auto; text-align:center; }
#bd .intro-text h2 {color:#244260; font-size:178%; text-shadow: 1px 1px 1px #ddd; line-height:37px;}
#bd .corde { width:2080px; height:509px; position:absolute; top: -75px; left:-495px; background: transparent url(images/corde3.png) no-repeat; }
.img-corde { display:none; }
#bd a.view-gallery,
#bd .view-instagram { position:absolute; top: 400px; right:0; z-index:100;  font-size:153.9%; background: transparent url(images/purple-arrow.png) no-repeat right; padding: 2px 33px 0 0; }
#bd .view-instagram {
    top: 445px;
}
#bd .static-page { position:relative; margin:0 0 50px 0; overflow:hidden; }
#bd .static-page h2,
.testimonials h2 { font-size: 210%; background: transparent url(images/trace.png) no-repeat 0 7px; padding:0 0 40px 20px; }
#bd .static-page .about-text { font-size: 146.5%;
line-height: 32px;
float: right;
width: 497px;
height: 1064px;
padding: 17px 64px 50px 30px;
background: transparent url(images/bg-paper-line.png) no-repeat; color:#000; }
#bd .static-page .about-text p { margin:0 0 13px 0; }

#bd article.default p { font-size:143%; }

img.bio {float:right;}

.contact-page .content { font-size: 174%; }
.contact-page div.wpcf7 { margin:30px 0 0 0; width:680px; height:230px; float:left; position:relative;}
.contact-page div.wpcf7 span.your-message,
.contact-page div.wpcf7 span.your-message textarea { font-size: 14px;display:block; width:220px; height:140px; padding: 5px; background:transparent; border:none; resize:none;}
.contact-page div.wpcf7 span.your-message { background: transparent url(images/form/message.png) no-repeat; border:1px solid #666; }
.contact-page div.wpcf7 span.your-name,
.contact-page div.wpcf7 span.your-email,
.contact-page div.wpcf7 span.your-name input,
.contact-page div.wpcf7 span.your-email input { display:block; width: 186px; background: transparent; border:none;  }
.contact-page div.wpcf7 span.your-name input,
.contact-page div.wpcf7 span.your-email input { background: transparent url(images/form/text.png) no-repeat bottom left; padding:0 0 5px; }
.contact-page div.wpcf7 div.submit input { width:110px; height:34px; display:block; text-indent:-12345px; text-transform:capitalize; background: transparent url(images/form/send.png) no-repeat; border:none;}
.contact-page div.wpcf7 label { font-size:100%; }
.contact-page div.wpcf7 div.message { margin:0 0 0 5px; }
.contact-page div.wpcf7 div.name,
.contact-page div.wpcf7 div.email { float: right; clear: right; margin-right: 225px;}
.contact-page div.wpcf7 div.email { margin-top: 20px; }
.contact-page div.wpcf7 div.name input,
.contact-page div.wpcf7 div.email input { height:20px; font-size:14px;}
.contact-page div.wpcf7 div.name { margin-top: 30px; }
.contact-page div.wpcf7 div.submit { float:right; margin-top: 10px; margin-right: 225px;}

.contact-page .wpcf7-not-valid-tip-no-ajax { color:#9e1818; font-size:75%; }
.contact-page .wpcf7-mail-sent-ok { border:none; }
.contact-page .wpcf7-validation-errors { display:none; }
.contact-page .alternatives { margin: 35px 0 0 650px; }
.contact-page .alternatives ul { margin:20px 0 0 0; }
.contact-page .alternatives ul li,
.contact-page .alternatives ul li a { color:#5c2041; }
.contact-page .alternatives ul li { padding:0 0 0 55px; line-height:50px; }
.contact-page .alternatives .facebook { background: transparent url(images/icons/facebook.png) no-repeat left; }
.contact-page .alternatives .twitter { background: transparent url(images/icons/twitter.png) no-repeat left; }
.contact-page .alternatives .email { background: transparent url(images/icons/mail.png) no-repeat left; }
.contact-page .alternatives .tel { background: transparent url(images/icons/phone.png) no-repeat left; }

textarea { overflow: auto; }

/** Testimonials */
.testimonials {
    padding: 30px 0 0;
    background: url("images/pointilles.png") repeat-x scroll left top rgba(0, 0, 0, 0);
}
.testimonials h2 {
    display: inline-block;
    *display: inline;
    zoom: 1;
}
.testimonials li {
    margin: 0 0 30px;
}
.testimonials li:after {
    background: url("images/pointilles.png") repeat-x scroll center bottom rgba(0, 0, 0, 0);
    content: "";
    display: block;
    height: 5px;
    width: 20%;
    margin: auto;
}
.js .testimonials li:after {
    content: none;
}
.blockquote {
    font-size: 175%;
    padding: 0 0 30px;
}
.blockquote .author {
    color: #244260;
    text-shadow: 1px 1px 1px #DDDDDD;
}
.blockquote .quote {
    font-family: Garamond,Georgia,times,serif;
    line-height: 1.6em;
    color: #000;
    font-size: 100%;
}
.blockquote .quo {
    padding: 0 10px;
}
/**
 * Gallery
 */
 
#right-container { width:180px; float:right; margin:0 0 0; }
#thumbnail-container { height:280px; }
#thumbnail-container { width: 165px; clear: both; margin: 0 0 10px; }
#thumbnail-container .viewport { width: 150px; height: 280px; overflow: hidden; position: relative; }
#thumbnail-container .overview { list-style: none; position: absolute; left: 0; top: 0; }
#thumbnail-container .thumb .end,
#thumbnail-container .thumb { background-color: #d1a1ca; }
#thumbnail-container .scrollbar { position: relative; float: right; width: 15px; }
#thumbnail-container .track { background-color: #f5d8fd; height: 100%; width:13px; position: relative; padding: 0 1px; }
#thumbnail-container .thumb { height: 20px; width: 13px; cursor: pointer; overflow: hidden; position: absolute; top: 0; }
#thumbnail-container .thumb .end { overflow: hidden; height: 5px; width: 13px; }
#thumbnail-container .disable{ display: none; }
#main-images { margin:5px 0 0 0; width:835px; height: 400px;}
.ngg-gallery-thumbnail-box { float:left; width:62px; height:62px; overflow:hidden; margin:0 5px 7px 0; }
.gallery-image { position:relative; /*float:left; width:316px; height:437px;*/  text-align:center; margin:0 0 0 0; }
/*.landscape { width:406px; height:357px; margin:0 20px 0 0; }*/
.gallery-image img { /*border:1px solid #95876f;*/ }
.landscape img {  }
.arrows { position:relative; height:70px; }
.alone { float:none; margin:0 0 0 230px; }
#thumbnail-container .alone {  width: 128px; margin:0; height: 60px; overflow:hidden; }
#right-container .prev, #right-container  .next { cursor:pointer; position:absolute; width:33px; height:auto; top:0; padding:28px 0 0; font-size: 161.6%; color:#5b5243; }
#right-container  .prev { background:transparent url(images/prev.png) no-repeat top left; left:2px; }
#right-container  .next { background:transparent url(images/next.png) no-repeat top right; left:94px; text-align:right; }


/**
 * Catering
 */

.blog-listings .main-content {
    -moz-box-shadow: 3px 3px 4px #000;
    -webkit-box-shadow: 3px 3px 4px #000;
    box-shadow: 3px 3px 18px #888;
}
.catering .content > *,
.catering .intro {
    font-size:153.9%;
}
.catering .content ul,
.catering .content li {
    list-style: disc;
}
.catering .content p { margin:30px 0 0 0; }
img.aligncenter {
    display: block;
    margin: auto;
}
.catering .content h3 {
    font-size: 170%;
    margin: 0 0 20px;
    color: #244260;
    font-size: 178%;
    text-shadow: 1px 1px 1px #DDD;
    line-height: 37px;
}
#sidebar.sidebar-catering li {
    font-size: 161%;
}
/**
 * Friends
 */
.friends .intro { font-size:170%; margin:0 0 20px; color:#244260; font-size:178%; text-shadow: 1px 1px 1px #ddd; line-height:37px;}
.friends h3 { font-size:170%; color:#5c2041; }
.friends .friend { float:left; width: 264px; margin: 20px 0 0 50px;}
.friends .desc { font-family: arial, sans; color:#000; height:55px; }
.friends .img { position:relative; width:264px; height:238px; background:transparent url(images/friends-picbg.png) no-repeat top left; }
.friends img { position:absolute; top:15px; left:17px; }
.friends a { float:right; font-size:160%; padding:0 30px 0 0; background:transparent url(images/purple-arrow-mini.png) no-repeat right;}


#under-construction { display:none; position:absolute; top:0; right:0; /*width:297px; height:348px; background: transparent url(images/construction.png) no-repeat;*/}

/** Blog */
.blog-listings h1{ font-size: 210%; background: transparent url(images/trace.png) no-repeat 0 7px;padding: 0 0 40px 20px; }
.blog-post .main-content,
.blog-listings .main-content { padding:15px; background:transparent url(images/blog-bg.png); overflow:hidden; }
.blog-listings h2,
#sidebar h2,
#sidebar h3.widget-title { font-size: 180%;
margin: 0 0 20px;
color: #244260;
font-size: 178%;
text-shadow: 1px 1px 1px #DDD;
line-height: 37px; }
.blog-listings h2,
#sidebar h2,
#sidebar h3.widget-title,
#bd .catering h2 {
    background:none;
}
.blog-listings h2 { margin-bottom:5px; font-size: 235%; }
.blog-listings h2 a,
.blog-listings a.more { color: #244260; }
.blog-listings a.more { font-size: 131%; text-shadow: 1px 1px 1px #DDD;  font-family: 'Satisfy', cursive;}
.blog-listings .meta { font-size:131%; margin:0 0 10px; }
.blog-listings .comments-link { display:block; }

.lang-item { display:inline; }

.entry ul,
.entry ol {
    margin-left: 20px;
    padding-left: 20px;
}
.post .entry h1,
.entry h2,
.entry h3,
.entry h4 {
    font-family: 'Satisfy',cursive;
    display: block;
    margin: 0 0 20px;
    padding: 0 0 20px;
}
.post .entry h1 {
    background: none;
    font-size: 185%;
}
.entry h2 {
    font-size: 163%;
}
.entry h3 {
    font-size: 145%;
}
.entry h4 {
    font-size: 131%;
}
.entry  ul li {
    list-style: disc;
    margin-bottom: 10px;
}
.entry  ol li {
    list-style: decimal;
    margin-bottom: 10px;
}


/** General wordpress */
.alignleft { float:left; }
.alignright { float:right; }
.aligncenter { text-align:center;}
.post {position:relative; margin:0 0 50px 0; overflow:hidden;}
.post h1 { font-size: 235%; background: transparent url(images/trace.png) no-repeat -5px bottom; padding:0 0 40px 20px; }
.post h1 { padding-left:0; }
.post .entry p { margin-bottom:1.2em; }
/*.blog-listings .entry p { margin-bottom:5px; }*/
.entry { color: #000; font-size:141.5%; font-family: Garamond, Georgia, times, serif; line-height:1.6em; }
.entry hr {display: block; height: 43px; border: 0 !important; margin: 1em auto; padding: 0; background: transparent url(images/separator.png) no-repeat center; width:100%; }
.entry a {}
.entry a:hover {}

.entry-content { font-size:153.9%; }
.entry-content a {}
.entry-content a:hover {}
.entry img {
    margin: 0.2em 0;
    max-width: 742px;
    background-color: white;
    padding: 3px;
    border: 1px solid #DDD;
    display: block;
}
#meta {}
.postmetadata {}

.pager .next a, .pager .previous a { font-size: 131%; color: #244260; text-shadow: 1px 1px 1px #DDDDDD; }
.pager .next { float: right; }
.pager .previous { float: left; }
.pager { position: relative; overflow: hidden; clear: both; }

#sidebar { float:right; width:175px; }
#sidebar h2,
#sidebar h3.widget-title { padding:0; margin:0; background: transparent url(images/trace.png) no-repeat -5px 7px;padding: 0 0 20px 5px;}
#sidebar ul { margin:0 0 40px 0; }
#sidebar ul li { font-size:123.1%; }
.main-content { width: 750px; }

#sidebar .wpinstagram { margin-bottom: 40px !important; }

.navgation {}
.next-posts {}
.prev-posts {}

#searchform {}
#s {}
#searchsubmt {}

.subscribe label { font-size:123.1%; }
.subscribe input#s2email { padding:5px; width:140px; }
.subscribe .s2_message { font-size:123.1%; }

h2#comments,
#respond > h2 { font-size: 180%;background:none;
margin: 0 0 20px;
color: #244260;
font-size: 178%;
text-shadow: 1px 1px 1px #DDD;
line-height: 37px; }
ol.commentlist {list-style: none; margin:0 0 40px; }
ol.commentlist li { overflow:hidden; }
ol.commentlist li.alt {}
ol.commentlist li.bypostauthor {}
ol.commentlist li.byuser {}
ol.commentlist li.comment-author-admin {}
ol.commentlist li.comment {border-bottom: 1px dotted #244260; padding: 10px;}
ol.commentlist li.comment div.comment-author { font-size:153.1%; }
ol.commentlist li.comment div.comment-body p { font-size:123.1%; }
ol.commentlist li.comment div.vcard {}
ol.commentlist li.comment div.vcard cite.fn {font-style: normal;}
ol.commentlist li.comment div.vcard cite.fn a.url {}
ol.commentlist li.comment div.vcard img.avatar {float:right; margin: 0 0 10px 10px;}
ol.commentlist li.comment div.vcard img.avatar-32 {}
ol.commentlist li.comment div.vcard img.photo {}
ol.commentlist li.comment div.vcard span.says {}
ol.commentlist li.comment div.commentmetadata {}
ol.commentlist li.comment div.comment-meta {color: #244260;font-size:123.1%;}
ol.commentlist li.comment div.comment-meta a {color: #244260;}
ol.commentlist li.comment p {}
ol.commentlist li.comment ul {}
ol.commentlist li.comment div.reply {}
ol.commentlist li.comment div.reply a {font-weight: bold;}
ol.commentlist li.comment .says { display:none; }
.comment-edit-link { display:none; }
ol.commentlist li.comment ul.children {list-style: none; margin: 10px 0 0;}
ol.commentlist li.comment ul.children li {}
ol.commentlist li.comment ul.children li.alt {}
ol.commentlist li.comment ul.children li.bypostauthor {}
ol.commentlist li.comment ul.children li.byuser {}

ol.commentlist li.comment ul.children li.comment {}
ol.commentlist li.comment ul.children li.comment-author-admin {}
ol.commentlist li.comment ul.children li.depth-2 {border-left: 5px solid #555; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-3 {border-left: 5px solid #999; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-4 {border-left: 5px solid #bbb; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-5 {}
ol.commentlist li.comment ul.children li.odd {}
ol.commentlist li.parent {border-left: 5px solid #111;}
ol.commentlist li.thread-alt {}
ol.commentlist li.thread-even {}
ol.commentlist li.thread-odd {}

#respond div.inp-comment,
#respond div.inp-comment textarea { font-size: 14px;display:block; width:500px; height:140px; padding: 5px; background:transparent; border:none; resize:none;}
#respond div.inp-comment { height: 150px;float:right; width: 500px; background: transparent url(images/form/bg-textarea.png); border:1px solid #666; }
#respond div > input { display:block; width: 186px; background: transparent; border:none;  }
#respond div > input { background: transparent url(images/form/text.png) no-repeat bottom left; padding:0 0 5px; }
#respond div.submit input { width:110px; height:34px; display:block; text-indent:-12345px; text-transform:capitalize; background: transparent url(images/form/send.png) no-repeat; border:none;}
#respond label { font-size:131%; display:block; }
#respond div.inp-comment { margin:0 0 0 5px; }
#respond div.inp-email,
#respond div.inp-website { margin-top: 20px; }
#respond div.inp-author input,
#respond div.inp-email input { height:20px; font-size:14px;}
#respond div.inp-name { margin-top: 30px; }
#respond div.submit { clear: both; float:right; margin-top: 10px; }


/* Print styles!
-------------------------------------------------------------------------------*/
@media print {



}


/* Media queries!
-------------------------------------------------------------------------------*/

/* Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {
    #page-wrap { width:95%; }
    #bd .corde { display:none; }
.img-corde { display:block; position:absolute; top:240px; left:0;}
.main-content {
width: 70%;
}

}

@media all and (orientation: portrait) {
    
}

@media all and (orientation: landscape) {
    
}