/*
THEME:				Baby Barracuda
AUTHOR:				Liam Wright
DATE:					18/11/14
DESC:					Baby Barracuda is a child them of the Barracuda. In this stylesheet
						you will find all the regualr changeable CSS styles / divs we use
						on a daily basis.  

CONTENTS OF THIS STYLESHEET:

1AA						Main Color Changes
2AA						font styles
3AA						hightlight area code
4AA						Any Addtional Styling

*/

/* -------------------------------------- 1AA Main Color Changes  -------------------------------------- */

/*change color of top bar links on meduim and small devices*/
.nav-container .top-bar-section > ul > li > a,
.top-bar-section ul li,
.top-bar-section .dropdown li:not(.has-form):not(.active)>a:not(.button) {
	background: #339966;
	color: white;
}
.top-bar-section .dropdown li:not(.has-form):not(.active):hover > a:not(.button){
	color: #666;
	background: white;
}

/*change moblie navigation hamber and title colour color*/
.top-bar .toggle-topbar.menu-icon a span::after { box-shadow: 0 0px 0 1px silver, 0 7px 0 1px silver, 0 14px 0 1px silver; }
.top-bar .toggle-topbar.menu-icon a span{color: silver;}

/*change hover effect color on the top bar links on desktop site*/
@media only screen and (min-width: 64.063em) { 

.nav-container .top-bar-section > ul > li > a:hover, 
.nav-container .top-bar-section > ul > li > a.active{
	box-shadow: inset 0 0 0 3px #33cccc;
	color: #33cccc;
}

/*change text color of top bar links on desktop site*/
.nav-container .top-bar-section > ul > li > a{
	color: #33cccc;
}
}

/*change in text link color, main heading color and contact footer header */
.l-sub-banner .sub-banner-container a,
.l-sub-banner .sub-banner-container h2,
.body a,
.l-footer-columns .contact-set .contact-set-title,
.l-main #page-title{
	color: #339966;
}

.l-contact-social .contact p a {
	color: #33CCCC;
}

/*change Main Carousel text and button color */
.l-banner .carousel-content-element, 
.l-banner .carousel-content-element h2,
.l-banner .carousel-content-element p,
.l-banner .carousel-item-link a.button {
color: white;
border-color: white;
}

/*change hover effect on Carousel button*/
.l-banner .carousel-item-link a.button:hover{
	background:#339966;
}

/*change social link background color, buttons & breadcrumb background */
.breadcrumbs,
.button.secondary,
.form-submit,
.l-contact-social .social_links .block-social-media a.social-link{
	background:#33CCCC;
	border-color: #33CCCC;
}

/*change hover effect on buttons*/
.button.secondary:hover,
.form-submit:hover{
	background:none;
	color: #000;
	border-color: #339966;
}

/*change color of icons on social links */
.l-contact-social .social_links .block-social-media a.social-link .fa{
	color: #1d1d1d;
}

/*change color of icons on social links hover effect */
.l-contact-social .social_links .block-social-media a.social-link:hover .fa{
	color: #1d1d1d;
}
/*change color of sub banner overlay */
.l-sub-banner .sub-banner-item .sub-banner-item-inner p {
	color: black;
}

/* -------------------------------------- 2AA font styles ------------------------------------- */
/*if you want to change these please just add you font family in front of the current ones so there is a roll back if your font is not available*/

/*heading font family*/
h1,
h2,
h3,
h4,
h5,
h6,
.l-footer-columns .contact-set .contact-set-title{
	font-family: 'Quicksand', "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
	color: #FFF;
}
/*other text font family*/
p{
	font-family: 'Open Sans', "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
	font-style: normal;
	line-height: 1.75rem;
}

/* -------------------------------------- 3AA hightlight area code ------------------------------------- */

/*change styles of highlight content area*/
.l-highlight-content{
	/*set background-image to none or replace with another image to remove default background.*/
	/*background-image: none;*/
	background-color: whitesmoke;
	height:295px;	/*needed for flexbox centering to work in IE (don't worry min-height overwrites height as long as it is larger)*/
	min-height: 300px;
}

/*increase height on desktop*/
@media only screen and (min-width: 64.063em) { 
	.l-highlight-content{
	height:395px;	/*needed for flexbox centering to work in IE (don't worry min-height overwrites height as long as it is larger)*/
	min-height: 400px;
}
}

/*change text colour of highlight content area*/
.l-highlight-content p, 
.l-highlight-content h1, 
.l-highlight-content h2, 
.l-highlight-content h3, 
.l-highlight-content h4, 
.l-highlight-content h5, 
.l-highlight-content h6,
.l-highlight-content .testimonial-item,
.l-highlight-content .form-item{
	color: white;
}
.l-main .panel {
	background-color: #f2f2f2;
}

/* -------------------------------------- 4AA Any Addtional Styling ----------------------------------------- */

/* Main body styles / you can change the background here */
body {
	/* Set background-image to none if not required and remove the background size option */
	background-image: url('images/tile.png');
	background-color: #212121;
	background-size: initial;
	background-position: top;
	background-repeat: repeat;
	color: #FFF;
}
.contact-page-item.panel .contact-set--email-address {
	word-wrap: break-word;
}

.top-bar {
	background-color: transparent;
}
.l-sub-banner.row h2 {
	color: #339966;
	font-weight: 900;
	text-align: center;
	font-size: 36px;
	margin-bottom: 70px;
	font-family: 'Open Sans', "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
}
.l-footer-columns .contact-set .contact-set-title {
    color: #339966;
}
.l-main #page-title {
	font-weight: 900;
}
.top-bar-section li:not(.has-form) a:not(.button):hover {
    background-color: transparent;
    background: transparent;
}
.top-bar .name h1 a {
    color: #3cc;
}
.l-footer .footer_rightcolumn .block-poweredby .poweredby--ems > a {
    font: 300 normal 0.938rem 'Bariol',sans-serif;
}
.l-footer .footer_rightcolumn .block-poweredby .poweredby--ems > a.poweredby-link {
    font-weight: 600;
}
@media only screen and (min-width: 40.063em) {
	.l-header {
	    margin: 10px auto;
	    padding: 0px 20px;
	}
}
/*Add any addtional styling rules you may need here. Happy Styling ^_^ */