
body {
    margin: 0;
    background-color: #CEC1AD;
}

/*
    #f2e9dc     bottom border for menu items
    #2e0014     bottom border for hovered menu items
    #c0bcb5     original very pale brown
    #462521     original dark brown header

    #F7F1E3     pointing (pale)
    #C0CDC2     teresa's green
    #786963     london clay (pale brown)
    #CEC1AD     stony ground
    #726454     salon drab (mid-dark brown)
    #494036     darker than salon drab
    #312B24     darker still
*/

body, select, input, textarea, p, td, a, button, li {
    color: #312B24;
    font-family: 'Source Sans Pro', Verdana, sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 28px;
    margin: 0;
    padding: 0;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'EB Garamond', sans-serif;
    margin: 0;
    padding: 0;
    color: #494036;
    background: none;
    text-transform: none;
}

#pagebox {
    background-color: #fff;
}

a {
    color: #312B24;
    text-decoration: none;
    border-bottom: 1px dashed #A85038;
    padding: 0;
    transition: border-color 0.25s ease-in-out, box-shadow 0.25s;
    -o-transition: border-color 0.25s ease-in-out, box-shadow 0.25s;
    -webkit-transition: border-color 0.25s ease-in, box-shadow 0.25s;
    -moz-transition: border-color 0.25s ease-in, box-shadow 0.25s;
}

    a:hover {
        color: #000;
        background-color: #C0CDC2;
        border-bottom: none;
        box-shadow: 6px 6px 6px 3px rgba(0,0,0,.5);
    }

input, select, textarea, button, a.button {
    padding:3px;
    margin:5px;
    border-radius:5px;
    border-color:#ccc;
    background-color:#fff;
    background-image:none;
}

    a.button {
        text-decoration:none;
        border:1px solid #ccc;
    }

    a.img {
        text-decoration: none;
        border: none;
    }

        a.img:hover {
        }

    input[type=submit], input[type=button] {
        cursor:pointer;
    }

    input[type=submit]:hover, input[type=button]:hover, input[type=text]:focus {
        background-color:#fffec2;
    }

    input[readonly] {
        color:#444;
        background-color:#eee;
    }

tr:hover {
    background-color:aliceblue;
}

label {
    display:block;
}

    label.follow {
        display:inline;
    }

p img { width:100%; }

p pencil { width:16px; }

td {
	vertical-align: top;
}

h1 {
	margin:20px 0 20px 0;
	font-size:24pt;
    font-weight:bold;
    text-align:center;
}

h2 {
    margin: 25px 0 25px 0;
    font-size: 22pt;
    padding: 5px 0 5px 0;
    /*border-bottom: 5px solid;
    background-image: linear-gradient(to right, #f2e9dc, #ffffff);
    border-image-slice: 1;
    border-image-source: linear-gradient(to right, #2e0014, #f2e9dc);*/
}

    h2 a {
		font-size:22pt;
	}

	h2.top-h {
		border-top:none;
	}

    h2.top-h a {
    }

h3 {
    margin: 5px 0 20px 0;
    font-size: 18pt;
}

h4 {
    font-size: 14pt;
}

p {
	margin-bottom: 12px;
}

    p.person {
        margin-top:20px;
        font-weight:bold;
        font-style:italic;
        margin-bottom:20px;
    }

div.diary-separator {
    height:3px;
    width:100%;
    background-color:#77aa67;
}

div.diary-date {
    padding: 5px;
    background-color: #b4fc95;
    border-radius: 5px;
    box-shadow: 5px 5px 5px #aaa; /* box-shadow color generally should be a little darker than that for the NON CSS3 capable browsers background-color */
    -moz-box-shadow: 5px 5px 5px #aaa;
    -webkit-box-shadow: 5px 5px 5px #aaa;
}

/* ------------------------------------------------------------------------------------------------------ */

#navbar { 
    margin:10px 5px 0; 
}

.ddsmoothmenu li {
    padding-bottom: 0!important;
}

.ddsmoothmenu li a {
    font-family: "Source Sans Pro";
    font-weight: 700;
    font-size: 14pt;
}

a.img {
    background: none;
}

a.img:hover {
    background: none!important;
}

img.menuimg {
    height:25px;
}

.icon-fa {
    color: #312B24;
}

/* ------------------------------------------------------------------------------------------------------ */

.floatleft { float:left; }

.floatright { float:right; }

.clear { clear:both; }

#homepanel { }

div.banner { width:180px; float:left; height:120px; border:1px solid #fff; }

#pagebox {
    min-height: 500px;
    padding-bottom: 20px;
}

#contents {
    padding: 0;
}

#pagebox li {
    padding-bottom: 10px;
}

.bordered {
    border: 1px solid #A85038;
    padding: 5px;
}

.within-bordered, no-pad {
    padding-top:0;
    margin-top:0;
}

#picturebar { display:none; }

h1.caption, h1.caption a {
    font-family: 'EB Garamond', sans-serif;
    font-size: 28pt;
    border: none;
    margin: 0;
    font-weight: bold;
    text-decoration: none;
    border: none;
    box-shadow: none;
    background: none;
    padding: 15px;
    color: #494036;
}

h1.caption {
    margin-right:5px;
}

h1.caption-break {
    font-size:12px;
    border:none;
    margin:0;
    text-align:right;
    padding:5px 5px 0;
    color:#000060;
    line-height:16px;
    display:none;
    text-decoration:none;
    border:none;
    box-shadow:none;
}

a.logo {
    border:none;
    box-shadow:none;
    background:none;
}

#headline {
    padding-bottom:25px; 
    /*border-bottom:3px solid #e6aa68;*/
}

#logo {
    height:80px;
    margin-left:5px;
}

.leftcol { 
    padding-right:15px;
}

.rightcol { 
    padding-left:0;
}

ul { 
    margin-left:-20px; 
}

.section ul {
    list-style:none;
}

.section li {
    margin-bottom:10px;
}

.section li:before {
    font-family:'FontAwesome';
    content:'\f046';
    margin:0 0.2em 0 -1.2em;
    color:#ff90d0;
}

img.highlight {

}

div.section {
    padding:0px 0px 20px 0px;
}

.altsection {
    background-color:#ddd;
}

div.blueslice {
    background-image:url('../images/furniture/blueslice.jpg');
    background-repeat:no-repeat;
    height:120px;
}

#slider
{
    padding:0;
	left:0px;
    margin:0px;
    /*width:890px;
    height:400px;*/
    z-index:20;
}

#xslider img {
    width:100%; 
    max-width:880px; 
    height:auto !important;
}

.nivoSlider { }

a.call-to-action {
    padding:10px;
    background:#ff90d0;
    color:#ffffff;
    text-decoration:none;
    border:none;
    margin:10px 0 10px 0;
    display:inline-block;
}

a.call-to-action:after {
    font-family:'FontAwesome';
    content: '\f138';
    margin-left:15px;
}

a.call-to-action:hover {
    background-color:#ff4cb4;
    text-decoration:none;
    border:none;
}

a.action-download:after {
    content:'\f019';
}

a.action-offsite:after {
    content:'\f08e';
}

td {
    vertical-align:top;
}

div.page {
    padding:0 10px 0 10px;
}

#fb-head {
    width: 280px;
}

#fb-feed {
    background: none;
    float: left;
    margin-bottom: 10px;
}

    #fb-feed > div {
        background: none;
    }

/* --- footer ---------------------------------------------------------------------------------------- */

footer {
    display: table-row;
    height: 0;
    background-color: #494036;
    width: 100%;
    color: #F7F1E3;
}

	footer a {
		color:#aaa;
		border:none;
		text-decoration:none;
        /*background-color:#444;*/
		display:block;
	}

	footer a:hover {
		color:#fff;
        background: none;
		border:none;
		text-decoration:none;
        box-shadow:none;
	}

    footer br { line-height:0; }

    footer h2 { background:none; padding-left:0; color:#ff90d0; }

    footer ul { list-style-type: none; }

#copyright {
	padding:5px;
	border-top:1px solid #888;
}

#copyright a {
	display:inline;
}

.mce-content-body { background-color:#fff; }

/*--- Grid system --------------------------------------------------------------------------------- */

html, body {
    height: 100%;
    width: 100%;
    margin: 0;
    display: table;
}

*,img,*:before, *:after {
    box-sizing: border-box;
}

.clearfix:after, .clear:after {
    content: "";
    display: table;
    clear: both;
}

.row {
  margin: 0;
}

#pagebox .row {
}

.row:last-child {
  margin-bottom: 0;
}

[class*="col-"] {
}

.nested {
    padding:0;
}

.mobile-narrow-show {
	display:block;
}

.normal-upcoming {
    display:block;
}

@media all and ( min-width: 800px ) {
    .col-2-3 {
        float: left;
        width: 66.66%;
    }
    .col-1-2 {
        float: left;
        width: 50%;
    }
    .col-1-3 {
        float: left;
        width: 33.33%;
    }
    .col-1-4 {
        float: left;
        width: 25%;
        min-width: 280px;
    }
    .col-1-5 {
        float: left;
        width: 20%;
    }
    .col-1-8 {
        float: left;
        width: 12.5%;
    }
}

@media all and ( min-width: 800px ) {
    .col-1-2-w {
        float: left;
        width: 50%;
    }
	.mobile-hide {
		display:block;
	}
	.mobile-show {
		display:none;
	}
	.mobile-narrow-hide {
		display:block;
	}
	.mobile-narrow-show {
		display:none;
	}
    .normal-upcoming {
        display:block;
    }
    .mobile-upcoming {
        display:none;
    }
}

@media all and ( max-width: 900px ) {
    h1.caption {
        font-size:14px;
        text-align:center;
    }
    div.caption { float:none; }
    h1.caption {
        text-align:center;
        padding-top:50px;
    }
    #headline {
        padding:0;
    }
    h1.caption-break {
        display:inline-block;
    }
}

@media all and ( max-width: 800px ) {
	.mobile-hide {
		display: none;
	}
	.mobile-hide {
		display: block;
	}
	.mobile-narrow-hide {
		display: none;
	}
	.mobile-narrow-show {
		display:block;
	}
    .normal-upcoming {
        display:none;
    }
    .mobile-upcoming {
        display:block;
    }
}

img.resizing {
    width: 100%;
    height:auto;
}

.contained {
    max-width:1000px;
    margin: auto;
    /*padding:0 5px 0 5px;*/
}

.not-contained {
    max-width:1380px;
    margin:0 auto;
    padding:0 5px 0 5px;
}

.wide {
    width:1600px;
    margin:0 auto;
    padding:0 5px 0 5px;
}

.half-contained {
    max-width:570px;
}

.full-size {
    width:100%;
}

.centered-3-4 {
    max-width:70%;
	margin-left:15%;
}

.max-3-4 {
    max-width:850px;
}

.centered, .centred, .centre, .center {
    text-align:center!important;
}

.middle {
    margin: 0 auto;
}

.left-align {
	text-align:left;
}

.right-align {
	text-align:right;
}

.left-side {
    float:right;
}

.float-left, .floatingleft {
    float:left;
    padding-right:10px;
}

.float-right, .floatingright {
    float:right;
}

/*--- debugging --------------------- */
/*

[class*="col-"] {
    border:1px dotted green;
}

.row {
    border:1px dotted blue;
}

*/
