@import url('carousel.css');
@import url('form.css');

/**
 * PantheonStone.com site template stylesheet.
 *
 * Copyright 2014 by Anthony R. Taylor
 */

html {
	font-size: 16px;
}

* {
	box-sizing: border-box;
}

body {
	margin: 0;
	padding: 0;
	background: #fff;
	font-family: "Raleway", sans-serif;
	font-size: 14px;
	color: rgb(48,48,48);
}

h1, h2, h3, h4 {
	color: rgb(216,28,28);
	text-transform: uppercase;
	text-align: center;
	font-weight: 300;
}

h1 {
	font-size: 37px;
}

h2 {
	font-size: 30px;
}

h3 {
	font-size: 24px;
}

h4 {
	font-size: 18px;
}

a {
	text-decoration: none;
	color: rgb(216,28,28);

}

a:hover {text-decoration: underline;}

/* --- Navigation, Branding ------------------------------------------------ */


#brand-hdr {
	background: url('../images/bkg-title.jpg') top left;
}

#brand-main {
	display: table;
	margin-top: 0;
	margin-bottom: 0;
	padding-top: 20px;
	padding-bottom: 20px;
}

.nav-main {
	margin-top: 22px;
}
	/* a.item { text-transform: uppercase;} */
	.nav-item,
	.ui.dropdown .menu .item {
		text-transform: uppercase;
	}

	.main-nav-menu {
		text-align: center;
		height: 40px;
	}

.brand-nav {
	display: table-cell;
}

.brand-name {
	font-family: 'Caesar Dressing', cursive;
	font-family: 'Sansita One', cursive;
	font-size: 5em;
	color: rgba(0,0,0,1);
	text-align: center;
}

	.brand-name span {
	/*	font-family: 'Raleway', sans-serif;
		font-size: 1em;
		text-transform: uppercase;
		font-weight: 300; */
	}

.brand-column {
	display: table-cell;
	width: 108px;
}
	.brand-column img {
		width: 100%;
		vertical-align: middle;
	}


.ui.menu .item {
    padding: 0.83em 0.35em;
}

.ui.inverted.red.menu {
    background-color: rgb(178,32,42);
}

.ui.inverted.menu .dropdown .menu .item {
	color: white !important;
}
.ui.inverted.menu .dropdown .menu a.item:hover {
	background-color: rgba(255, 255, 255, 0.1);
}

/* --- Home page ----------------------------------------------------------- */

.home-rand-prods {
	width: 100%;
}

.home-prod-title {
	font-weight: 300;
	font-size: 16px;
	text-align: center;
	color: rgb(48,48,48);
}

#content,
#footer {
	padding-right: 20px;
	padding-left: 20px;
}

.title-bkg {
	background: url('../images/bkg-title.jpg') top left repeat-x;
	padding: 10px 0;
	border-bottom: 1px solid rgba(0,0,0,0.25);
}

.page-title {
	/*font-weight: 200;*/
	text-transform: uppercase;
	font-size: 37px;
	text-align: center;
}

#bodycopy,
#main {
	margin-top: 0;

}
	#bodycopy strong {
		color: #444;
	}

	#content #bodycopy > h2:first-child {
		margin-top: 1em;
	}

	#bodycopy .video {
		margin: 1em 0;
		background: #000;
		padding: 10px;
		padding-bottom: 3px;
		width: 640px;
	}


/* --- Products page ------------------------------------------------------- */

#products {
	display: table;
	width: 100%;
	animation: fadeInLoad 1s;
}
	.prod-row {
		display: table-row;
	}
	.product {
    display: inline-block;
    width: 20%;
    padding: 5px;
	}

	@keyframes fadeInLoad {
		from {
			opacity:0;
		}
		to {
			opacity:1;
		}
	}

/* --- Certification & Warranty page --------------------------------------- */

#warranty {
	margin-top: 2em;
}

/* --- Dealers page -------------------------------------------------------- */

.dealer {
	display: table;
	width: 100%
}
	.dealer-info {
		display: table-cell;
		width: 50%;
	}
	.dealer-map {
		display: table-cell;
		width: 50%;
		vertical-align: middle;
	}

	.dealer-panel {
		font-size: 1.25rem;
		line-height: 1.75rem;
	}
		.dealer-name {
			color: rgb(216,28,28);
			font-weight: 400;
			font-size: 1.5rem;
		}
		.dealer-addr p {
			margin-bottom: 0.5rem;
		}
		.dealer-map {
			border: 1px solid rgba(0,0,0,0.75);
		}

/* --- Contact page -------------------------------------------------------- */

.contact-form {
	width: 75%;
	margin: 0 auto;
}

footer {
	background: url('../images/bkg-title.jpg') top left;
}

	.img-column { height: 200px; }

	.footer {
		border-top: 1px solid rgba(0,0,0,.25);
	}

	.footer-text-menu {
		text-align: center;
	}

	.footer-copy a,
	.footer-docs a {
		color: rgba(0,0,0,0.75);
		border-bottom: 1px dotted rgba(0,0,0,0.75);
		font-size: 0.9rem;
	}
		.footer-copy a:hover,
		.footer-docs a:hover {
			color: rgb(216,28,28);
			border-bottom: 1px solid rgb(216,28,28);
			text-decoration: none;
		}

	.footer-title {
		text-align: center;
		color: rgb(216,28,28);
		text-transform: uppercase;
		font-size: 1.25rem;
		margin-bottom: 15px;
	}

	.footer-copy {
		clear: both;
		border: none;
		padding: 2em 0;
	}
		.footer-copy p {
			color: rgb(216,28,28);
			font-size: 0.75rem;
			text-align: center;
		}

		.footer-copy a {
			font-size: 0.75rem;
		}

/**
 * WireFatalError is a class that ProcessWire will use to output
 * fatal errors in the design, but only if debug mode is on, or if
 * you are logged in as a superuser.
 *
 */
.WireFatalError {
	background: #a30000;
	color: #fff;
	padding: 1em;
	position: relative;
	z-index: 9999;
}