/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Responsive (ref only)
- Quick spacing rules
- Typography
- Header
- Introduction
- Project page
- Buttons & Lightbox
- Map

*/


/* Responsive (ref only)
–––––––––––––––––––––––––––––––––––––––––––––––––– 

	/* Larger than phablet */
	@media (min-width: 550px) {
	}

	/* Larger than tablet */
	@media (min-width: 750px) {
	}

	/* Larger desktop screens */
	@media (min-width: 1200px) {
	}

html, body {    overflow-x: hidden;}


/* Quick spacing rules
	-------------------------------------------------- */
	.mt-1 { margin-top:1rem; }
	.mt-2 { margin-top:2rem; }
	.mt-4 { margin-top:4rem; }
	.mt-6 { margin-top:6rem; }
	.mt-8 { margin-top:8rem; }
	.mt-10 { margin-top:10rem; }
	.mt-12 { margin-top:12rem; }
	.mt-14 { margin-top:14rem; }
	.mt-16 { margin-top:16rem; }
	.mt-18 { margin-top:18rem; }
	.mt-20 { margin-top:20rem; }
	.mt-25 { margin-top:25rem; }
	.mt-30 { margin-top:30rem; }
	.mt-35 { margin-top:35rem; }
	.mt-40 { margin-top:40rem; }

	.mb-1 { margin-bottom:1rem; }
	.mb-2 { margin-bottom:2rem; }
	.mb-4 { margin-bottom:4rem; }
	.mb-6 { margin-bottom:6rem; }
	.mb-8 { margin-bottom:8rem; }
	.mb-10 { margin-bottom:10rem; }
	.mb-12 { margin-bottom:12rem; }
	.mb-14 { margin-bottom:14rem; }
	.mb-16 { margin-bottom:16rem; }
	.mb-18 { margin-bottom:18rem; }

	.pt-1 { padding-top:1rem; }
	.pt-2 { padding-top:2rem; }
	.pt-4 { padding-top:4rem; }
	.pt-6 { padding-top:6rem; }
	.pt-8 { padding-top:8rem; }
	.pt-10 { padding-top:10rem; }
	.pt-12 { padding-top:12rem; }
	.pt-14 { padding-top:14rem; }
	.pt-16 { padding-top:16rem; }
	.pt-18 { padding-top:18rem; }

	.pr-tiny {padding-right: 0.3rem;}
	.pr-1 { padding-right: 1rem; }
	.pr-2 { padding-right: 2rem; }
	.pr-4 { padding-right: 4rem; }
	.pr-6 { padding-right: 6rem; }
	.pr-8 { padding-right: 8rem; }
	.pr-10 { padding-right: 10rem; }
	.pr-12 { padding-right: 12rem; }
	.pr-14 { padding-right: 14rem; }
	.pr-16 { padding-right: 16rem; }
	.pr-18 { padding-right: 18rem; }
	.pr-10p { padding-right: 10% }
	.pr-15p { padding-right: 15% }
	.pr-20p { padding-right: 20% }
	.pr-30p { padding-right: 30% }

	.pl-tiny {padding-left: 0.3rem;}
	.pl-2 { padding-left: 2rem; }
	.pl-4 { padding-left: 4rem; }
	.pl-6 { padding-left: 6rem; }
	.pl-8 { padding-left: 8rem; }
	.pl-10 { padding-left: 10rem; }
	.pl-12 { padding-left: 12rem; }
	.pl-14 { padding-left: 14rem; }
	.pl-16 { padding-left: 16rem; }
	.pl-18 { padding-left: 18rem; }
	.pl-4p { padding-left: 4% }
	.pl-10p { padding-left: 10% }
	.pl-20p { padding-left: 20% }
	.pl-30p { padding-left: 30% }

	.mob-only, .mid-only, .big-only { display: none; }
	.mob-center { display: block; margin-right: auto; margin-left: auto; }
	 { display: none; }

	  /* Tablet/midsized only rules (Smaller than desktop 1200px) */
	  @media (max-width: 1200px) {
	    .tab-pt-4   { padding-top: 4rem; }

	    .mid-mb-4  { margin-bottom: 4rem;}

	    .mid-mt-2 { margin-top:2rem; }
	    .mid-mt-4 { margin-top:4rem; }
	    .mid-mt-6 { margin-top:6rem; }
	    .mid-mt-8 { margin-top:8rem; }
	    .mid-mt-10 { margin-top:10rem; }
	    .mid-mt-10 { margin-top: 10rem; }
	    .mid-mt-15 { margin-top: 15rem; }
	    .mid-mt-20 { margin-top: 20rem; }

	    .mid-only { display: block; }
	    .mid-hide { display: none; }
	  }


	  /* Mobile only rules (Smaller than desktop 750px) */
	  @media (max-width: 750px) {
	    .mob-float-none {float:none;}

	    .mob-pl-0 { padding-left: 0; }
	    .mob-pr-0 { padding-right: 0; }
	    .mob-pt-0 { padding-top: 0; }

	    .mob-mt-0 { margin-top: 0; }
	    .mob-mt-1 { margin-top: 1rem; }
	    .mob-mt-2 { margin-top: 2rem; }
	    .mob-mt-4 { margin-top: 4rem; }
	    .mob-mt-6 { margin-top: 6rem; }
	    .mob-mt-8 { margin-top: 8rem; }
	    
	    .mob-mb-0 { margin-bottom: 0; }
	    .mob-mb-2 { margin-bottom:2rem; }
	    .mob-mb-3 { margin-bottom:3rem; }
	    .mob-mb-4 { margin-bottom:4rem; }

	    .mob-pt-4 { padding-top: 4rem; }

	    .mob-hide, .mid-hide { display: none; }
	    .mob-only { display: block; }
	  }
	  /* Largest screens only rules (Larger than desktop 1200px) */
	  @media (min-width: 1200px) {
	    .big-only { display: block; }
	  }


/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */

	a:active, a:focus { outline-style: none; -moz-outline-style:none; text-decoration: none }
	::selection {color:#11C1A3;background:transparent;}
	::-moz-selection {color:#11C1A3;background:transparent;}
	h1, h2, h3, h4, #introduction th {
		font-family: 'Montserrat', sans-serif;
		font-weight: 700;
		color: white;
	}
		.eventblock h4 {
			text-transform: uppercase;
		}
		.register-btn h2 {
		    text-align: center;
		    margin: auto;
		    margin-bottom: 0;
		    border-bottom: 0.3rem solid white;
		    display: table;
		    padding-top: 0.9rem;
		}
		#project-info h3 {
			margin-bottom: 1.5rem;
			margin-top: 4rem;
		}
	p, h5, li, table.project-details {
		font-family: "PT Sans",sans-serif;
		color: white;
	}
		.project-overview p {
			margin-bottom: 1rem;
		}
	.event-offers li {
	    font-size: 1.2rem;
	    line-height: 1.4;
		letter-spacing: 0.15rem; 
	    list-style: none;
		margin-left: 2rem; 
	}
		/* Larger than tablet */
		@media (min-width: 750px) {
			.event-offers li {
				margin-left: 2rem; 
				font-size: 1.4rem;
				line-height: 1.8;
			}
		}
	.features li {
    	letter-spacing: 0.05rem;
		font-size: 1.1rem;
		line-height: 1.5;
	    list-style: none;
	}
	.event-info li {
	    list-style: none;
	    margin-bottom: 0;
	    line-height: 1.8;
	    font-size: 1.1rem;
	    letter-spacing: 0.08rem;
	}
	.event-info h4 {
		margin-bottom: 1rem;
	}
	.eventblock p {
		font-style: italic;
		margin-bottom: 0;
	}
	.columns a, a {text-decoration:none; opacity:1; color:#fff;	}
	.columns a:hover {	opacity:0.4;}
	table.project-details th {
	    font-weight: normal;
	    opacity: 0.7;
	    text-transform: uppercase;
	    font-size: 0.7rem;
	    letter-spacing: 0.15rem;
	}
	table.project-details th, table.project-details td {
	    border-bottom: 1px solid #505050;
	}
	.txt-center { text-align: center; }



/* Header */
	header#homepage{
		width:100%;
		height:auto;
		background-image:url(../images/toronto-desat.jpg);
		background-size:cover;
		background-repeat: no-repeat;
		background-attachment:fixed;
		background-position: center bottom;
		background-color:#E3173E;
		}
		header.eventpg, header.projectpg {background-image: none;}
		header.projectpg {background-color:transparent;}
	#header-inner{
		width:100%;
		background: -webkit-linear-gradient(rgba(227,23,62,0) 10%, rgba(227,23,62,1) 80%); /* For Safari 5.1 to 6.0 */
	 	background: -o-linear-gradient(rgba(227,23,62,0) 10%, rgba(227,23,62,1) 80%); /* For Opera 11.1 to 12.0 */
	    background: -moz-linear-gradient(rgba(227,23,62,0) 10%, rgba(227,23,62,1) 80%); /* For Firefox 3.6 to 15 */
	    background: linear-gradient(rgba(227,23,62,0) 10%, rgba(227,23,62,1) 80%); /* Standard syntax */
		}
		.eventpg#header-inner, .projectpg#header-inner {	background: #202020;}
	#builder-logos {
		margin:auto;
		width: 90%;
	}
	#builder-logos img{
		opacity: 0.4;
		width: 25%;
		display: block;
		float: left;
		margin-bottom: 0.6em;
		clear: none;
	}
	#project-logo {
		height: auto;
	}
	.eventblock	{
		text-align: center;
		height:auto;
    	padding: 3rem .5rem;
		margin-bottom: 2rem;
		box-shadow: inset 0 0 0 0.6rem #fff;
	    -webkit-transition: all 0.3s ease-out;
	    -moz-transition: all 0.3s ease-out;
	    transition: all 0.3s ease-out;
	}
	.eventblock:hover {
	    background-color: #FC5961;
	    box-shadow: none;
	    -webkit-transition: all 0.3s ease-out;
	    -moz-transition: all 0.3s ease-out;
	    transition: all 0.3s ease-out;
	}
	.titlecard {
		border-top: 0.6rem solid white;
		border-bottom: 0.3rem solid white;
		text-align: center;
	}


/* Introduction */
	#introduction img {
		width: 4rem;
	}
	#overlay{
	background-color:rgba(0,0,0,.9);
	width:100%;
	position:fixed;
	height:200%;
	left:0;
	top:0;
	z-index:9998;
	padding:3% 0;
	display:none;
	}
	#overlay img {border:none;}
	#close-overlay {
		position: absolute;
		padding:2.5em;
		top: 0;
		right: 1em;
		height: 30px;
		width:30px;
		z-index: 9999;
		cursor: pointer;
	}
	#introduction th {
		letter-spacing: 0.1rem; 
		border-bottom: none; 
    	padding: 0.25rem 0;
    }
    #introduction img { padding-right: 1rem; }


/* Project page */
	#project-intro img, #project-info img { max-width: 100%; }
	#project-intro {
	    background: linear-gradient(rgba(32,32,32,1) 50%, rgba(0,0,0,1) 100%); /* Standard syntax */
	}
	#event-cta {
	    background: linear-gradient(rgba(0,0,0,0.5) 0%, rgba(32,32,32,1) 50%); /* Standard syntax */
	}
	.event-offers li:before {
		content: '\f00c'; /* FontAwesome char code inside the '' */
		font-family: FontAwesome; /* FontAwesome or whatever */
		display: inline-block;
		width: 1.8rem; /* same as padding-left set on li */
		color: #bada55;
    	margin-left: -2rem;
	}
	.features li:before { 
		content: '\f067';
		font-family: FontAwesome; /* FontAwesome or whatever */
		display: inline-block;
		width: 1.5rem; /* same as padding-left set on li */
		color: white;
		opacity: 0.5;
		font-size: 1rem;
		margin-right: 0.4rem;
	}
	.project-overview i {
		width: 2rem;
		margin-right: .2rem; 
		vertical-align: 0;
		color: #FC5961;
	}
	.project-overview {
		padding-bottom: 2rem;
		border-bottom: .3rem solid white;
	}


/* Buttons & Lightbox */
	.register-btn {
	    width: 100%;
	    display: block;
	    max-width: 32rem;
    	padding-bottom: 1.25rem;
	    background-color: #FC5961;
	    color: #fff;
	    cursor: pointer;
    	border-radius: 0.4rem;
	    box-shadow: 0px 0.1rem 0.1rem rgba(0, 0, 0, 0.1), 0px 0.2rem 0.3rem rgba(0, 0, 0, 0.1), inset 0px -0.3rem 0px rgba(0,0,0,0.2);
	    -webkit-transition: all 0.3s;
	    -moz-transition: all 0.3s;
	    transition: all 0.3s;
	}
	a.register-btn:hover {
		opacity: 1;
		background-color: #E3173E;
		box-shadow: none;
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
	}
	.btn-center {
	    margin: auto;
	}
	.lum-gallery img{
		width: 100%;
	}


/* Map */
	.map-panel {
		height: 24rem;
		height: 40vh;
	}

	#event-cta img {
    display: inline-block;
    border-radius: 50%;
    height: 7rem;
		margin-right: 1rem;
	}
	#event-cta ul {
		display: inline-block;
	}