/* Presto Styles for Grahams HiFi 2021 

https://www.prestoav.com

Grahams corp colours
Dark Blue: #021934
Darker Blue : rgb(1,13,26)
Yellow Gold: #d3af62

*/

/* Change Bootstrap to 1199 breakpoint */



/* Useful */
.pad20 {padding: 20px;}
.marTop0 {margin-top: 0 !important;}
.marTop10 {margin-top: 10px !important;}
.marTop20 {margin-top: 20px !important;}
.marTop30 {margin-top: 30px !important;}
.marTop40 {margin-top: 40px !important;}
.marTop50 {margin-top: 50px !important;}
.marBot0 {margin-bottom: 0px !important;}
.marBot10 {margin-bottom: 10px !important;}
.marBot20 {margin-bottom: 20px !important;}
.marBot30 {margin-bottom: 30px !important;}
.marBot40 {margin-bottom: 40px !important;}
.marBot50 {margin-bottom: 50px !important;}
.padTop0 {padding-top:0px !important;}
.padTop10 {padding-top:10px !important;}
.padTop20 {padding-top: 20px !important;}
.padTop30 {padding-top: 30px !important;}
.padTop40 {padding-top: 40px !important;}
.padTop50 {padding-top: 50px !important;}
.padBot0 {padding-bottom:0px !important;}
.padBot10 {padding-bottom:10px !important;}
.padBot20 {padding-bottom:20px !important;}
.padBot30 {padding-bottom:30px !important;}
.padBot40 {padding-bottom:40px !important;}
.padBot50 {padding-bottom:50px !important;}
.centered {text-align:center !important;}
.max33pc {max-width: 33%;}
.img100 {width: 100% !important;}
.hidden {display: none !important;}
.noFloat {float: none !important;}
@media (max-width: 750px) {
	.notMobile {display: none !important;}
	.mobileCentered {text-align:center;}
}
.zi10 {z-index:10;}
.blackText {color: #000 !important;}
.grey-text {color: #888;}
.gold-text {color: #d3af62;}
.dosis-font {font-family: 'Dosis',Arial, Helvetica, sans-serif;}
.fw300 {font-weight: 300;}

// Centre Columns in Boostrap 3.x - Use as additional class on containing row
.centeredColumns {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

ul.inline-list {
	display: inline-block;
}

/* Max image size from WYSIWYG editor */
p img {
    max-width: 100%;
}

/* Misc Typography */

p a {
	text-decoration: underline;
}

.de_light a.btn-line:hover {
	color: #021934;
}

/* Videos */

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}

.post-content .videoWrapper {
	margin-left: 80px;
}

.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

a.imageHover img:hover {
	opacity: 0.7;
}

/* Header */
header, header.smaller:not(.header-bottom):not(.side-header):not(.force-header-mobile),header.header-mobile {
	background-color: #020c19;
}

.logo {
	max-width: 180px;
}

#subheader.centralised-header h1 {
	float: none;
	width: 100%;
	text-align: center;
	padding-right: 0px;
	margin-right: 0px;
}

#subheader.centralised-header .separator span {
	margin-top: 0px;
}

/* Header Spacer */
#content {padding-top: 80px;}

/* Sections */
#section-about, #section-portfolio {
	background-color: rgb(1,13,26);
}

#filters a:hover {
	color: #fff;
}

#mainmenu > li > a.btn-custom {
	line-height: normal !important;
	padding:  10px 20px !important;
	margin-top:  auto !important;
}

#mainmenu > li > a.btn-custom:hover {
	color: #fff;
}

header.smaller #mainmenu > li.contact-button {
	// padding-top: 0px;
}

#mainmenu > li.button-item {
	padding-top: 23px;
}

header.smaller #mainmenu > li.button-item {
	padding-top: 18px;
}

@media (min-width:993px) {
	#mainmenu.dotted-separator > li.no-dot a {
		padding-left: 20px;
		padding-right: 20px;
		margin-right: 0px;
	}
}

@media (min-width:993px) and (max-width: 1199px)  {
	.header-container {
		max-width: 100% !important;
	}
	
	#mainmenu li a:after {
		margin-left: 10px;
	}
	
	#mainmenu.dotted-separator > li.no-dot a {
		padding-left: 10px;
		padding-right: 10px;
	}
	
	#mainmenu {
		padding-left: 20px !important;
	}
}

#mainmenu.dotted-separator > li.no-dot > a:after, #mainmenu.dotted-separator > li a.btn-custom:after {
	content:  "";
	width: 0px;
}

@media only screen and (max-width: 992px) {	
	header.header-mobile #mainmenu li.button-item {
		border-bottom:  0px;
	}	
}

#subheader {
	position: relative;
	z-index: 1;
}

#content.dark-body-content {
	padding: 50px 0px;
	background-color: rgb(1,13,26);
}

#content.dark-body-content h3 {
	font-size:  1.8em;
}

/* Testimonials */
.de_testi blockquote:before {
	background: none;
	color: #d3af62;
}

@media (max-width:767px) {
	.separator span:before, .separator span:after {
	    width: 150px;
	}
}

/* Footer */
footer {
	background-color: #020c19;
}

.logo-small {
	max-width: 200px;
}

@media (max-width:990px) {
	.subfooter {
		text-align: center;
	}
	.footerSocials {
		float: none;
		display: block;
		margin-top: 10px;
	}
	.social-icons {
		display: block;
		text-align: center;
	}
}

.de_light footer a {
	color: #ccc;
}

/* Typography */
ultra-big-white {
	font-family: "Open Sans", Helvetica, Arial, sans-serif;
}

/* Home Slider */

#section-slider ul li {
	// position:relative;
	z-index: 1;
}

.tp-caption, .tp-leftarrow, .tp-rightarrow {
	z-index: 10;
}
.homeSliderOverlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 5;
	background-color: rgba(1,13,26,0.7);
}

@media (max-width:990px) {
	.tp-caption {
		padding-left: 30px;
		padding-right: 30px;
	}
	.tparrows {
		display: none !important;
	}
	.tp-caption.ultra-big-white {
		font-size: 48px;
	}
}

/* Process tabs */
.de_tab.tab_steps .de_nav li span {
	color: #fff;
}

/* Portfolio */

@media (max-width:990px) {
	.project-name {
		font-size: 9px;
		padding-left: 15px;
		padding-right: 15px;
	}
	
}

/* Blog post */
.widget-latest-posts li {
	padding: 7px 0px;
}

.widget-latest-posts li i {
	color: #d3af62;
	display: inline-block;
	margin-right: 10px;
}

/* Page Blocks */
.pageBlockRow img {
	width: 100%;
	max-width: 100% !important;
}

h3.pageBlockHeading , h2.pageBlockHeading  {
	margin-bottom:  0px;
}

.headingBlock {
	margin-bottom: 40px;
}

section.odd, section.even {
	padding: 30px 0px;
}

@media (max-width:991px) {
	.pageBlockRow img {
		margin-bottom: 30px;
	}
	.pageBlockRow img:last-child {
		margin-bottom: 0px;
	}
}

@media (min-width:992px) {
	.pageBlockRow {
		margin-bottom:30px;
	}
}



/* Privacy Table */
.privacyTable {
	border-collapse: collapse;
	margin-bottom: 20px
}

.privacyTable th {
	background-color:#eee;
}

.privacyTable th, .privacyTable td {
	padding: 10px;
	border: 1px solid #999;
}

/* List Blocks */

.list-block {
	margin-bottom: 40px;
}

.list-block h3 a {
	color: #d3af62;
}

/* Sidebar */
.de_light #services-list li a {
	color:  #021934;
}

/* CTA */
a.btn-line.black:hover {
	color: #fff;
}

@media (max-width:767px) {
	.call-to-action [class*="col-"] {
		float: none;
		display: block;
		width: 100%;
		text-align: center !important;
	}
	
	.call-to-action [class*="col-"]:not(:last-child) {
		margin-bottom: 30px;
	}
}

/* Map */
.mapouter, .gmap_canvas {
	width:100% !important;
}

/* Cookie Agreeement Bar */
.clearfix {
	clear: both;
}

.eupopup-container {
	background-color: rgba(25, 25, 25, 0.9);
	color: #efefef;
	padding: 5px 20px;
	font-size: 12px;
	line-height: 1.2em;
	text-align: center;
	display: none;
	z-index: 9999999;
}

.eupopup-container-top,
.eupopup-container-fixedtop {
	position: absolute;
	top: 0; left: 0; right: 0;
}

.eupopup-container-fixedtop {
	position: fixed;
}

.eupopup-container-bottom {
	position: fixed;
	bottom: 0; left: 0; right: 0;
}

.eupopup-container-bottomleft {
	position: fixed;
	bottom: 10px;
	left: 10px;
	width: 300px;
}

.eupopup-container-bottomright {
	position: fixed;
	bottom: 10px;
	right: 10px;
	width: 300px;
}

.eupopup-closebutton {
	font-size: 16px;
	font-weight: 100;
	line-height: 1;
	color: #a2a2a2;
	filter: alpha(opacity=20);
	position: absolute;
	font-family: helvetica, arial, verdana, sans-serif;
	top: 0; right: 0;
	padding: 5px 10px;
}
.eupopup-closebutton:hover,
.eupopup-closebutton:active {
	color: #fff;
	text-decoration: none;
}

.eupopup-head {
	font-size: 1.2em;
	font-weight: bold;
	padding: 7px;
	color: #fff;
}

.eupopup-body {
	color: #a2a2a2;
}

.eupopup-buttons {
	padding: 7px 0 5px 0;
}

.eupopup-button_1 {
	color: #d3af62;
	font-weight: bold;
	font-size: 14px;
}

.eupopup-button_2 {
	color: #d3af62;
	font-weight: normal;
	font-size: 12px;
}

.eupopup-button {
	margin: 0 10px;
}

.eupopup-button:hover,
.eupopup-button:focus {
	text-decoration: underline;
	color: #d3af62;
}

body .eupopup-color-inverse {
	color: #000;
	background-color: rgba(255, 255, 255, 0.9);
}

body .eupopup-color-inverse .eupopup-head {
	color: #000;
}

body .eupopup-style-compact {
	text-align: left;
	padding: 8px 30px 7px 20px;
	line-height: 15px;
}

body .eupopup-style-compact .eupopup-head,
body .eupopup-style-compact .eupopup-body,
body .eupopup-style-compact .eupopup-buttons {
	display: inline;
	padding: 0;
	margin: 0;
}

body .eupopup-style-compact .eupopup-button {
	margin: 0 5px;
}
