/*
Theme Name: Comedy Lounge (blackbird9)
Theme URI: http://blackbird9.net.au/wordpress/themes/comedylounge
Author: blackbird9
Author URI: http://blackbird9.net.au/
Description: Custom WordPress theme for Comedy Lounge. Built on the Bootstrap framework to be responsive.
Version: 1.0
Text Domain: comedyloungeb9
*/

/*	Based on Bootstrap
/*	Responsive breakpoints at
/*	xs  <576px
/*	sm   576px
/*	md   768px
/*	lg   992px
/*	xl  >1200px
*/




/* - - - - - - - - - - - -
/*	FONTS
/* - - - - - - - - - - - - */


h1, h2, h3, h4, h5, h6
{
	font-family: Oswald, Impact, serif;
}

body, p
{
	font-family: Roboto, Helvetica, sans-serif;
}

h1
{
	color: #ffcd07;
	text-transform: uppercase;
	font-size: 3em;
	margin-bottom: 1em;
}

h2, h3, h4
{
	margin-top: 1.5em;
	margin-bottom: 1em;
}

h1 + h2
{
	margin-top: -1em;
}

h3 + h4, h4 + h3,
.well h3:first-of-type,
.half h3:first-of-type,
.half h4:first-of-type,
.third h3:first-of-type,
.third h4:first-of-type,
.sidebar h3:first-of-type,
.sidebar h4:first-of-type
{
	margin-top: 0;
}

h3
{
}

a, a:hover
{
	color: #ffcd07;
}




/* - - - - - - - - - - - -
/*	BUTTONS
/* - - - - - - - - - - - - */


.btn
{
	border: none;
	width: 100%;
}

aside .btn:not(.btn-block)
{
	width: 50%;
	float: left;
}

.btn span.glyphicon
{
	margin-left: 0.5em;
}

@media (max-width: 480px)
{
	.third .btn:not(.btn-block) span.glyphicon
	{
		display: none;
	}
}

@media (min-width: 768px) and (max-width: 992px)
{
	.third .btn:not(.btn-block) span.glyphicon
	{
		display: none;
	}
}

.btn-primary
{
	background-color: #ffcd07;
	color: black;
}

.btn-primary:hover
{
	background-color: white;
	color: black;
}

.btn-info
{
	background-color: #333333;
	color: #ffcd07;
}

.btn-info:hover
{
	background-color: black;
	color: #ffcd07;
}

.btn-default
{
	background-color: transparent;
	color: #ffcd07;
	border: #ffcd07 1px solid;
}

.btn-default:hover
{
	background-color: black;
	border-color: black;
	color: #ffcd07;
}

.btn.btn-block, .content .btn.btn-block, .event .btn.btn-block, .content .event .btn.btn-block
{
	width: 100%;
}




/* - - - - - - - - - - - -
/*	HEADER
/* - - - - - - - - - - - - */


header
{
	background-color: #ffcd07;
	position: relative;
	text-align: center;
}

header #logo
{
	position: relative;
	text-align: center;
}

header #logo img
{
	border: 0;
	width: 100%;
	height: auto;
	max-width: 16em;
	margin: 0;
}

header #tagline
{
	text-align: center;
	font-size: 3em;
	font-weight: normal;
	color: black;
	line-height: 90%;
	margin-bottom: 0.25em;
}

@media (min-width: 768px)
{
	header #tagline
	{
		text-align: right;
		padding-top: 3em;
	}
}

@media (min-width: 992px)
{
	header #logo
	{
		width: auto;
		background-color: #ffcd07;
		position: absolute;
		top: -1em;
		z-index: 50;
		-webkit-border-radius: 1em;
		-moz-border-radius: 1em;
		border-radius: 1em;
	}
	header #tagline
	{
		padding-top: 1em;
	}
}




/* - - - - - - - - - - - -
/*	MAIN MENU
/* - - - - - - - - - - - - */


#menu
{
	background-color: black;
	position: relative;
}

.navbar-inverse
{
	background-color: black;
	color: #ffcd07;
}

.navbar-inverse ul
{
	background-color: rgba(0,0,0,0.75);
}

.navbar-inverse li.divider
{
	background-color: #444444;
}

.navbar-inverse .navbar-nav li a
{
	color: #ffcd07;
}

.navbar-inverse .navbar-nav ul li a:hover
{
	background-color: #666666;
	color: #ffcd07;
}

.navbar-inverse .navbar-nav li.active a
{
	background-color: #444444;
}

.dropdown-menu > li > a
{
	padding: 0.5em 1em;
}




/* - - - - - - - - - - - -
/*	HERO FEATURE IMAGE/SLIDER
/* - - - - - - - - - - - - */


#hero
{
	position: relative;
	/* height: 16em; */
	/* max-height: 16em; */
	color: #ffcd07;
	background-color: black;
}




/* - - - - - - - - - - - -
/*	MAIN PAGE
/* - - - - - - - - - - - - */


body
{
	background-color: #323232;
}

main
{
	position: relative;
	color: #eeeeee;
}

article
{
	position: relative;
	padding-top: 0;
	padding-bottom: 2em;
	margin-bottom: 3em;
	border-top: #ffcd07 4px solid;
	background-color: #444444;
	
	box-shadow: 0.5em 0 2em #111111;
	-moz-box-shadow: 0.5em 0 2em #111111;
	-webkit-box-shadow: 0.5em 0 2em #111111;
	/* For IE 8 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
	/* For IE 5.5 - 7 */
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}

article section,
article aside
{
	margin-top: 3em;
}

article aside section
{
	margin-top: 0;
}

article section:first-of-type
{
	margin-top: 0;
}

@media (min-width: 768px)
{
	main div.row article
	{
		top: -4em;
		padding-left: 1.5em;
		padding-right: 1.5em;
	}
}




/* - - - - - - - - - - - -
/*	IMAGES in main conent
/* - - - - - - - - - - - - */


.content img
{
	max-width: 100%;
	height: auto;
	margin: 1em 2em;
}

.content img.full
{
	margin: 1em 0 1.5em 0;
}

.content img.left
{
	margin-left: 0;
	float: left;
}

.content img.right
{
	margin-right: 0;
	float: right;
}

.content img.left,
.content img.right
{
	max-width: 48%;
}

.content p img
{
	margin-top: 0.5em;
}

.content iframe
{
	margin: 2em 0;
	max-width: 100%;
}

.content table img
{
	margin: 0;
	padding: 0;
}




/* - - - - - - - - - - - -
/*	COMMON PAGE SUPPORT ELEMENTS
/* - - - - - - - - - - - - */


table
{
	margin: auto; /* horizontal centre align */
}


p.date
{
	margin-top: 1.5em;
	color: #222222;
}

p.debug
{
	color: black;
	border-top: dotted 1px black;
	padding-top: 1em;
	margin-top: 2em;
}


.big
{
	font-size: 1.5em;
	margin: 1em 2em;
}

.big i.fa
{
	font-size: 2em;
	position: relative;
	bottom: -0.25em;
	margin-right: 0.5em;
}



.well
{
	background-color: #333333;
	border: none;
	width: 100%;
	margin-bottom: 2em;
}

.well h3
{
	margin-top: 0;
}

.contain .well.pull-right
{
	margin-right: 0;
}




.contain:after,
.clearbefore:before
{
	content: "";
	display: block;
	clear: both;
}

.half,
.third
{
	width: 100%;
	position: relative;
	margin-bottom: 1em;
}

@media (max-width: 575px)
{
	.half, .third
	{
		margin: 2em 0;
		padding: 1em 0;
	}
}

@media (min-width: 576px)
{
	.contain .half,
	.contain .btn.half,
	.flexhalfthird
	{
		float: left;
		width: 48%;
		margin-right: 4%;
	}
	.contain .half:nth-of-type(even)
	{
		margin-right: 0;
	}
	.contain .half:nth-child(-n+2)
	{
		margin-top: 0;
	}
	.contain .half.pull-right
	{
		float: right;
		margin-right: 0;
		margin-left: 4%;
	}
	.flexhalfthird.pull-right
	{
		margin-right: 0;
		margin-left: 2em;
	}
	.flexhalfthird.pull-left
	{
		margin-left: 0;
		margin-right: 2em;
	}
}

@media (min-width: 768px)
{
	.contain .third
	{
		float: left;
		width: 32%;
		margin-right: 2%;
	}
	.contain .third:nth-of-type(3n)
	{
		margin-right: 0;
	}
	.flexhalfthird
	{
		width: 30%;
	}
}

@media (min-width: 1200px)
{
	aside .sidebar.half
	{
		width: 100%;
		margin-right: 0;
	}
	aside.contain .third
	{
		width: 100%;
		margin-right: 0;
	}
}




dt
{
	margin-top: 0.5em;
}

dd,
dd a
{
	color: #ffcd07;
}




blockquote
{
	font-size: 100%;
	margin-bottom: 1.5em;
	border: none;
	padding: 0.5em 2em;
}

blockquote glyphicon
{
	font-size: 150%;
	margin-right: 0.25em;
}

blockquote cite
{
	color: #222222;
	font-weight: bold;
	font-style: normal;
	display: block;
	border-top: #222222 2px solid;
	padding: 0.5em 0 0 0;
	margin-top: 0.5em;
}

blockquote cite a
{
	color: #222222;
}

@media (max-width: 576px)
{
	padding-left: 0;
	padding-right: 0;
}




/* - - - - - - - - - - - -
/*	NEWS & EVENTS
/* - - - - - - - - - - - - */


.news
{
	min-height: 6em;
}

.event-list .event:last-of-type,
.post-list .news:last-of-type
{
	margin-bottom: 1em;
}

.info
{
	padding: 0.5em;
}

.info h4, .info h3
{
	margin-top: 0.2em;
	margin-bottom: 0.5em;
}

.featureimage
{
	max-width: 100%;
	height: 8em;
	background-image: url('images/placeholder-1280-720.png');
	margin: 0 0 2em 0;
}

.event .featureimage,
.news .featureimage,
.eventseries .featureimage
{
	margin: 0;
}

.venue .featureimage,
.eventseries .featureimage
{
	height: 12em;
	margin: 0 0 0.5em 0;
}

.venue
{
	padding: 0 0 0.5em 0;
}

.event .btn,
.news .btn
{
	width: 49%;
}

.event-list .event .btn-primary
/* .event-list to superscede aside .btn */
{
	float: right;
}

.event-list .event .btn-info
/* .event-list to superscede aside .btn */
{
	float: left;
}

@media (min-width: 568px)
{
	article .news .featureimage,
	article .event .featureimage
	{
		float: left;
		width: 35%;
		height: 12em;
		margin-right: 0;
	}
	article .news .info,
	article .event .info
	{
		float: right;
		width: 64%;
		padding-left: 1em;
		margin-left: 0;
	}
	.venue .featureimage,
	.eventseries .featureimage
	{
		height: 14em;
	}
}

@media (min-width: 480px) and (max-width: 767px)
{
	.news .featureimage
	{
		float: left;
		width: 49%;
		margin-right: 2%;
	}
}




/* - - - - - - - - - - - -
/*	CUSTOM PAGE CONTENT ELEMENTS
/* - - - - - - - - - - - - */


.comedian-list .comedian
{
	padding: 0.5em 0.5em 0.5em 6em;
	position: relative;
	min-height: 6em;
	margin-bottom: 1em;
}



.venue .info h3
{
	margin-bottom: 0.25em;
}

.venue .info h3 > h4
{
	margin-top: 0;
}

.comedian-list .headshot
{
	width: 5.1429em;
	height: 6em;
	margin: 0 1em 0 0;
	position: absolute;
	left: 0;
	top: 0;
}

.comedian-list h4
{
	margin-top: 0.3333em;
	margin-bottom: 0.5em;
}

@media (min-width: 576px)
{
	.comedian-list .comedian
	{
		min-height: 12em;
		padding: 2em 1em 0.5em 12em;
	}
	.comedian-list .headshot
	{
		width: 10.2857em;
		height: 12em;
	}
}

@media (min-width: 768px)
{
	.comedian-list .comedian
	{
		padding-top: 2em;
	}
}

.map
{
	width: 100%;
	height: 16em;
}


.social-media-links
{
	text-align: center;
}

.social-media-links a
{
	font-size: 3em;
	margin: 0 0.25em 0 0.25em;
	color: #999999;
}

.social-media-links a:hover
{
	color: #ffcd07;
}




/* - - - - - - - - - - - -
/*	SIDEBAR
/* - - - - - - - - - - - - */


aside
{
	position: relative;
	padding-left: 0 !important; /* removes Bootstrap column padding */
	padding-right: 0 !important; /* removes Bootstrap column padding */
	margin-bottom: 2em;
}

aside .sidebar
{
	width: 100%;
	background-color: #444444;
	padding: 1em;
}

aside .sidebar section:first-of-type
{
	margin-top: 0;
}

section.sidebar
{
	margin: 0 0 2em 0;
	padding: 0;
}

aside div.sidebar section.sidebar:first-of-type
{
	margin-top: 0;
}

aside div.sidebar section.sidebar:last-of-type
{
	margin-bottom: 0;
}




/* - - - - - - - - - - - -
/*	FORM
/* - - - - - - - - - - - - */

form
{
	margin: 2em 0 0 0;
}

aside form
{
	margin-top: 1em;
}

label
{
	font-weight: normal;
	width: 100%;
}

input,
textarea,
select
{
	margin: 0.25em 0;
	background-color: #333333;
	border: none;
	color: #ffcd07;
	padding: 0.5em;
	width: 100%;
}

input:hover,
textarea:hover,
select:hover
{
	background-color: black;
}

input:focus,
textarea:focus,
select:focus
{
	background-color: black;
	color: white;
}

input[type="checkbox"]
{
	width: 0.75em;
	height: 0.75em;
	margin-right: 0.5em;
	font-size: 100%;
}

input[type="submit"]
{
	margin-top: 1em;
	background-color: #ffcd07;
	color: black;
}

input[type="submit"]:hover
{
	background-color: white;
}

form.wpcf7 span.ajax-loader
{
	display: hidden;
}

@media (min-width: 576px)
{
	article input,
	article textarea,
	article select
	{
		width: 75%;
	}
}



/* - - - - - - - - - - - -
/*	PAGINATION
/* - - - - - - - - - - - - */


nav.pagination
{
	margin-top: 3em;
	display: block;
	text-align: center;
}

nav.pagination a
{
	display: inline-block;
	background-color: #333333;
	padding: 0.5em;
}

nav.pagination a:hover
{
	background-color: black;
	text-decoration: none;
}

nav.pagination span.current
{
	display: inline-block;
	background-color: black;
	padding: 0.5em;
}

nav.pagination span.glyphicon-circle-arrow-right
{
	margin-left: 0.5em;
}

nav.pagination span.glyphicon-circle-arrow-left
{
	margin-right: 0.5em;
}




/* - - - - - - - - - - - -
/*	FOOTER
/* - - - - - - - - - - - - */


footer
{
	background-color: black;
	position: relative;
	width: 100%;
	padding: 2em;
	color: #666666;
	min-height: 14em;
}

footer a
{
	color: #666666;
}

footer a:hover
{
	color: #ffcd07;
	text-decoration: none;
}

footer ul.menu
{
	list-style: none;
	padding-left: 0;
}

footer img.logo
{
	position: relative;
	width: 12em;
	margin: 0;
}

footer .legal
{
	margin: 2em 0;
}

footer .container
{
	position: relative;
}

@media (max-width: 576px)
{
	footer img.logo
	{
		left: 50%;
		margin-left: -6em;
	}
}

@media (min-width: 576px) and (max-width: 767px)
{
	footer img.logo
	{
		position: absolute;
		top: 0;
		right: 2em;
	}
}

@media (min-width: 768px) and (max-width: 1199px)
{
	footer .legal
	{
		margin-top: 4em;
	}
	footer img.logo
	{
		position: absolute;
		bottom: 0;
		right: 2em;
	}
}

@media (min-width: 1200px)
{
	footer img.logo
	{
		position: absolute;
		top: 0;
		right: 0;
	}
}




/* - - - - - - - - - - - -
/*	SHARED PROPERTIES
/* - - - - - - - - - - - - */


.bordertop
{
	border-top: #ffcd07 2px solid;
	position: relative;
	margin-bottom: 1em;
}

.bgcover,
.featureimage
{
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.bgtrap
{
	background-size: auto;
	background-repeat: no-repeat;
	background-position: center;
}

.hovertint:hover
{
	background-color: #555555;
}

.roundedcorners,
input,
textarea,
select,
article img
{
	border-radius: 0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
}

.roundedcorners-right,
nav.pagination :last-child
{
	border-top-right-radius: 0.5em;
	border-bottom-right-radius: 0.5em;
	-moz-border-top-right-radius: 0.5em;
	-moz-border-bottom-right-radius: 0.5em;
	-webkit-border-top-right-radius: 0.5em;
	-webkit-border-bottom-right-radius: 0.5em;
}

.roundedcorners-bottom
{
	border-bottom-left-radius: 0.5em;
	border-bottom-right-radius: 0.5em;
	-moz-border-bottom-left-radius: 0.5em;
	-moz-border-bottom-right-radius: 0.5em;
	-webkit-border-bottom-left-radius: 0.5em;
	-webkit-border-bottom-right-radius: 0.5em;
}

.roundedcorners-left,
nav.pagination :first-child
{
	border-top-left-radius: 0.5em;
	border-bottom-left-radius: 0.5em;
	-moz-border-top-left-radius: 0.5em;
	-moz-border-bottom-left-radius: 0.5em;
	-webkit-border-top-left-radius: 0.5em;
	-webkit-border-bottom-left-radius: 0.5em;
}
