/*	SHORTCODES
	================================================== */

/*	Boxes
	================================================== */

.content_box {
    background-color: #FCF8E3;
    border: 1px solid #FBEED5;
    clear: both;
    color: #C09853;
    margin-top: 20px;
    padding: 0 20px 20px;
    text-shadow: none;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

    .content_box a {
        color: #C09853 !important;
        border: none;
        font-weight: 700;
    }

    .content_box a:hover {    text-decoration: underline }

/* ===[ Green box ]=== */

.green_box {
    background-color: #DFF0D8;
    border-color: #D6E9C6;
    color: #468847;
}

    .green_box a {    color: #468847 !important }

/* ===[ Red box ]=== */

.red_box {
    background-color: #F2DEDE;
    border-color: #EED3D7;
    color: #B94A48;
}

    .red_box a {    color: #B94A48 !important }

/* ===[ Blue box ]=== */

.blue_box {
    background-color: #D9EDF7;
    border-color: #BCE8F1;
    color: #3A87AD;
}

    .blue_box a {    color: #3A87AD !important }

/*	Buttons
	================================================== */

.button_center {    text-align: center }

.button_large {		
	font-size: 13px;
	padding: 20px 60px;
}

/* ===[ Colours ]=== */

.button_white,
.button_white:visited {
    background-color: #FFF !important;
	border: none;
    color: #666 !important;
}

.button_white:hover,
.button_white:visited:hover {
    background-color: #DDD !important;
	border: none;
    color: #333 !important;
}

.button_black,
.button_black:visited {
	background-color: #222 !important;
	border: none;
	color: #FFF !important;
}

.button_black:hover,
.button_black:visited:hover {
    background-color: #000 !important;
	border: none;
	color: #FFF !important;
}

.button_red,
.button_red:visited {
    background-color: #CC0000 !important;
    border: none;
	color: #FFF !important;
}

.button_red:hover,
.button_red:visited:hover {
    background-color: #6A0000 !important;
	border: none;
	color: #FFF !important;
}

.button_light_red,
.button_light_red:visited {
    background-color: #FF0000 !important;
	border: none;
	color: #FFF !important;
}

.button_light_red:hover,
.button_light_red:visited:hover {
    background-color: #CC0000 !important;
	border: none;
	color: #FFF !important;
}

.button_blue,
.button_blue:visited {
    background-color: #003366 !important;
	border: none;
	color: #FFF !important;
}

.button_blue:hover,
.button_blue:visited:hover {
    background-color: #000033 !important;
    border: none;
	color: #FFF !important;
}

.button_light_blue,
.button_light_blue:visited {
    background-color: #0099CC !important;
    border: none;
	color: #FFF !important;
}

.button_light_blue:hover,
.button_light_blue:visited:hover {
    background-color: #006699 !important;
    border: none;
	color: #FFF !important;
}

.button_green,
.button_green:visited {
    background-color: #339900 !important;
    border: none;
	color: #FFF !important;
}

.button_green:hover,
.button_green:visited:hover {
    background-color: #336600 !important;
    border: none;
	color: #FFF !important;
}

.button_light_green,
.button_light_green:visited {
    background-color: #66CC00 !important;
	border: none;
	color: #FFF !important;
}

.button_light_green:hover,
.button_light_green:visited:hover {
    background-color: #669900 !important;
	border: none;
	color: #FFF !important;
}

.button_yellow,
.button_yellow:visited {
    background-color: #FFCC00 !important;
    border: none;
    color: #FF6600 !important;
}

.button_yellow:hover,
.button_yellow:visited:hover {
    background-color: #CC9900 !important;
    border: none;
    color: #FF6600 !important;
}

.button_light_yellow,
.button_light_yellow:visited {
    background-color: #FFFF66 !important;
    border: none;
    color: #FF9900 !important;
}

.button_light_yellow:hover,
.button_light_yellow:visited:hover {
    background-color: #FFCC66 !important;
    border: none;
    color: #FF9900 !important;
}

.button_purple,
.button_purple:visited {
    background-color: #330066 !important;
    border: none;
	color: #FFF !important;
}

.button_purple:hover,
.button_purple:visited:hover {
    background-color: #330033 !important;
    border: none;
	color: #FFF !important;
}

.button_light_purple,
.button_light_purple:visited {
    background-color: #663366 !important;
	border: none;
	color: #FFF !important;
}

.button_light_purple:hover,
.button_light_purple:visited:hover {
    background-color: #330066 !important;
    border: none;
	color: #FFF !important;
}

.button_pink,
.button_pink:visited {
    background-color: #CC3399 !important;
    border: none;
	color: #FFF !important;
}

.button_pink:hover,
.button_pink:visited:hover {
    background-color: #990066 !important;
    border: none;
	color: #FFF !important;
}

.button_light_pink,
.button_light_pink:visited {
    background-color: #FF6699 !important;
    border: none;
	color: #FFF !important;
}

.button_light_pink:hover,
.button_light_pink:visited:hover {
    background-color: #CC3399 !important;
    border: none;
	color: #FFF !important;
}

.button_orange,
.button_orange:visited {
    background-color: #FF6633 !important;
	border: none;
	color: #FFF !important;
}

.button_orange:hover,
.button_orange:visited:hover {
    background-color: #CC0000 !important;
    border: none;
	color: #FFF !important;
}

.button_light_orange,
.button_light_orange:visited {
    background-color: #FF9933 !important;
    border: none;
	color: #FFF !important;
}

.button_light_orange:hover,
.button_light_orange:visited:hover {
    background-color: #FF6633 !important;
	border: none;
	color: #FFF !important;
}


/*	Clearboth
	================================================== */

.clearboth {
    clear: both;
    display: block;
    font-size: 0;
    height: 0;
    line-height: 0;
    overflow: hidden;
    width: 100%;
}

/*	Columns
	================================================== */

.fourth,
.third,
.half,
.two-thirds {
    float: left;
    margin-right: 2%;
}

.end {    margin-right: 0 }

.fourth {    width: 23.5% }

.third {    width: 32% }

.half {    width: 49% }

.two-thirds {    width: 66% }


/*	Dividers
	================================================== */

hr,
.hr {
	border-bottom: 1px solid #222;
	margin: 40px 0 0;
}

hr:first-child,
.hr:first-child { margin-top: 20px; }

hr.thick {
	border-color: #222;
	border-width: 4px;
}


.top {
	font-size: 10px;
	line-height: 10px;
}

	.top a { color: #333 !important; }
	
	.top a:hover { color: #666 !important; }


/*	Google map
	================================================== */

.google-map {    margin: 20px 0 0 }

/*	Highlight
	================================================== */

.highlight {
    background-color: #FFFF00;
    color: #111;
    padding: 5px;
}

/*	Pagelist
	================================================== */

.pagelist-item h1,
.pagelist-item h2,
.pagelist-item h3,
.pagelist-item h4,
.pagelist-item h5,
.pagelist-item h6 {    margin: 20px 0 0 }
	
	.pagelist-item  .post-excerpt a { color: #FFF; }
	
		.pagelist-image a {
			border: none;
			background: none;
			display: block;
		}

			.pagelist-image img {
				height: auto;
				-moz-transition: all 0.25s ease-in-out;
				-ms-transition: all 0.25s ease-in-out;
				-o-transition: all 0.25s ease-in-out;
				-webkit-transition: all 0.25s ease-in-out;
				transition: all 0.25s ease-in-out;
				width: 100%;
			}


/*	PORTFOLIO
	================================================== */

.portfolio-list {
	display: inline-block;
	float: left;
	margin-top: 20px;
	min-height: 84px;
	overflow: hidden;
	position: relative;
}	

	.portfolio-list img {
		position: relative;
		-moz-transition: all 0.3s ease;
		-webkit-transition: all 0.3s ease;
		transition: all 0.3s ease;
		width: 100%;
		z-index: 0;
	}

	.portfolio-list:hover img {
		-webkit-transform: scale(1.1);
		-moz-transform: scale(1.1);
		-o-transform: scale(1.1);
		-ms-transform: scale(1.1);
		transform: scale(1.1);
	}

	.portfolio-list:hover .post-excerpt {
		-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
		filter: alpha(opacity=100);
		opacity: 1;
	}

		#panel .portfolio-list .post-excerpt h2,
		.portfolio-list .post-excerpt h2 {
			color: #FFF;
			font-size: 14px;
			margin: 60px 0 0;
			padding: 0 20px;
			text-align: center;
			-webkit-transition: all 0.3s ease-out;
			-moz-transition: all 0.3s ease-out;
			-o-transition: all 0.3s ease-out;
			transition: all 0.3s ease-out;
		}
		
		.portfolio-list:hover h2 { margin-top: 0; }
		
		.portfolio-list a {
			height: 100%;
			left: 0;
			overflow: hidden;
			position: absolute;
			text-indent: -999px;
			top: 0;
			width: 100%;
			z-index: 2;
		}
		

/*	Postlist
	================================================== */

.postlist {    margin: 20px 0 0 }

.postlist-post {
	margin: 5px 0;
	padding-top: 0;
    position: relative;
}

    .postlist-post span {    display: block }

.postlist-post-date {
    color: inherit;
    position: relative;
}

.postlist-post-title {    padding-left: 0 }


/*	Quotes
	================================================== */
	
blockquote.alignleft,
blockquote.alignright {
	box-sizing: border-box;
	padding: 0 20px;
	width: 49%;
}	

blockquote.alignleft { 
	float: left;	
	margin: 40px 2% 40px 0;	
}

blockquote.alignright { 
	float: right;
	margin: 40px 0 40px 2%; 
}


/*	Toggle content
	================================================== */

.toggle-content {
    background: #171717;
    border: 1px solid #222;
    clear: both;
    display: block;
    margin: 20px 0 0;
	text-shadow: none !important;
}

.toggle-content:hover { background: #222 }

.toggle-content + .toggle-content {
	border: 1px solid #222;
	margin: -1px 0 0; 
}

.toggle-content .expand-button {
    cursor: pointer;
    overflow: hidden;
}

.toggle-content .expand-button h4 {
	font-size: 14px;
	font-weight: 500;
    margin: 0;
    padding-left: 15px;
}

.toggle-content .expand-button ,
.toggle-content .expand-button.close { background: none; }

.toggle-content .expand-button h4:before {
	content: "+";	
	font-size: 12px;
	font-weight: 400;
	margin-right: 15px;
}
.toggle-content .expand-button.close h4:before{ content: "- "; }

.toggle-content .expand {
	color: #666;
    margin: 0;
    padding: 1px 40px 40px;
}

.toggle-content .expand {    display: none }

.no-js .toggle-content .expand {    display: block }


/*	HELPER CLASSES
	================================================== */

.vertically-centered-wrapper {
	display: table;
	height: 100%;
	margin: 0 auto;
	width: 100%;
}

	.vertically-centered-content {
		display: table-cell;
		text-align: center;
		vertical-align: middle;
	}
	
	
/* ===[ For image replacement ]=== */

.ir {
    display: block;
    border: 0;
    text-indent: -999em;
    overflow: hidden;
    background-color: transparent;
    background-repeat: no-repeat;
    text-align: left;
    direction: ltr;
}

    .ir br {    display: none }

/* ===[ 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 }