/*
 Theme Name:   SemaphoreSA2
 Theme URI:    http://mkgd.net/sma/
 Description:  Semaphore Mainstreet Asc v2.0 
 Author URI:   http://mkgd.net	
Template: mkgd-master
Author: Michelle Koen Graphic Design
Colours used:
Blue: #29abe2
Green: #7ac943
Yellow: #fbb03b
DKBlue: #3367bc

*/

@import url(../mkgd-master/style.css);
@import url(http://fonts.googleapis.com/css?family=Josefin+Sans:400,700,400italic);

@media (max-width: 480px) {
.site-branding{
max-width: 320px;
overflow:hidden;
margin:0 auto;
}
}
.site-branding img{max-width:100%; height:auto;}

body{
	font-family: 'Josefin Sans', 'open Sans', sans-serif;
	margin-top:1ex;
	}


div#header-widgets{
	max-width:25%;
	float:right;
	}

#access{
	background:#29abe2;
	border-bottom:1px solid #3367bc;
	border-radius:0;
	-webkit-box-shadow: 0px 10px 5px 0px rgba(60,180,190,0.32);
-moz-box-shadow: 0px 10px 5px 0px rgba(60,180,190,0.32);
box-shadow: 0px 10px 5px 0px rgba(60,180,190,0.32);
margin-bottom:0;
z-index:999999;
}
#access .navbar-brand{display:none;}
#access ul{
	min-width:100%;
	text-transform:uppercase;
	font-weight:bold;
	}
#access ul ul{	
	text-transform:none;
	}
#access a {
	color:#fff;
	}
#access .icon-bar{
background:#fff;
}	
a:link,
#access a:hover, #access li.open > a {
	color:#29abe2;
	}
#breadcrumbs, .breadcrumb{
	background:none;
	margin-top:15px;
	}
#content{
	padding-right:0;
	}	
div#slideshow{
	min-height:200px;
	margin-top:15px;
	}
.entry-title, .post-title{
font-weight:bold;
}
.archive-thumb img, .alignleft img, article img, img{
max-width:100%;
height:auto;
}

section#secondary{
	border-right:10px solid #29abe2;
	margin-right:0;
	margin-top:0;
	padding-top:15px;
	padding-right:0;
	height:100%;
	bottom:0;
	right:0;
	}

#secondary aside{
	margin-left:14px;
	bottom-top:30px;
	background:none;
	border:none;
	}	
#big-sidebar-buttons li a{	
	font-size:1.5em;
	color:#111;
	border-bottom:4px solid #bdccd4;
	border-top:2px solid #29abe2;
	margin-top: 10px;
	margin-left:-50px;
	padding-left:50px;
	padding-bottom:0;
	font-weight:bold;
	}	



#secondary .widget-title{
	margin-bottom:1ex;
	text-transform:uppercase;
	font-weight:bold;
	margin-top:1em;

	}	
	
.angled:before, .angled {
    background-color: #29abe2;
    color:#fff;
    }
    widget-title, .angled, #big-sidebar-buttons{
        text-transform:uppercase;
        font-weight:bold;
}
	
.angled, li.nav-menu-search {
    margin:15px 0 0 55px;
    margin-left:-14px;
    padding:9px 0 0 13px;
    position: relative;
    height: 40px;
    color:#FFFFFF;
    z-index:1001;
    clear:right;
        box-sizing:border-box;

}
.angled{
	margin-bottom:1em;
	}

    
    	
.angled:before, li.nav-menu-search:before{
 content: '';
    height: 40px;
    width: 40px;
    position: absolute;
    top: 0;
    right: 0;
    left: auto;
    z-index:-1;
    transform: skewX(45deg);
    transform-origin: top;
    -webkit-transform: skewX(45deg);
    -webkit-transform-origin: 0 0;
    left: -40px;
}	

/* nav-menu-search menu item created in functions.php. Move it way over to the right */
.notresp.navbar .nav .nav-menu-search {
    float: right;
}
.notresp.navbar .nav {
    width: 100%;
}
li.nav-menu-search{
    float: right;
}
#access div{
	margin-right:0;
	padding-right:0;
	}
li.nav-menu-search, li.nav-menu-search:before{
background:#fff;
margin-top:0;
margin-left:0;
min-width:50px;
height:50px;
}

li.nav-menu-search:before{
left:-50px;
width:150px;
}

li.nav-menu-search,  li.nav-menu-search{
	position:absolute;
	right:0;
	top:0;
	z-index:999;
	clear:none;
	}

/*Stop the display of the Search button*/
.nav-menu-search .search-submit {
    display: none;
}
/* The "Search for" text is needed for screen readers, but we move it off screen, so we won't see it */
.nav-menu-search .search-form .screen-reader-text {
    position: absolute;
    left: -9999px;
    overflow: hidden;
}

/* Style the search input textbox */
.nav-menu-search .search-field {
    background: transparent;
    border: none;
    -webkit-box-shadow:    none;
    -moz-box-shadow:       none;
    box-shadow:            none;
    cursor: pointer;
    height: 26px;
    margin: 2px 0 2px 0;
    padding: 0 0 0 30px;
    position: relative;
    width: 10px;
}

/* Expand the search box when you click it */
.nav-menu-search .search-field:active,
.nav-menu-search .search-field:focus {
    color: #5a5a5a;
    /* change the colour above if you are working with a dark navbar background */
    border: 2px solid #fff;
    cursor: text;
    outline: 0;
    margin: 0;
    width:250px;
     -webkit-transition: width 400ms ease;
    -moz-transition:    width 400ms ease;
    -o-transition:      width 400ms ease;
    transition:         width 400ms ease;
}

/* Add a magnifying glass background */
.nav-menu-search .search-form:before {
	font-family: 'Glyphicons Halflings';
    content:"\e003";
    position: absolute; /* this is the key to put it visually inside the search field */
    font-size: 19px;
    font-weight: normal;
    padding-top: 5px; /* tune this vertical alignment inside the search field, as needed */
    padding-left: 5px; /* tune this horizontal alignment inside the search field, as needed */
    color:#29abe2;

}



/*coloured sections */

/*BUSINESS GUIDE */

.tax-business-type #secondary, .page-business-guide #secondary, .page-business-type #secondary{border-color:#CF5378;}
.tax-business-type .angled, .tax-business-type .angled:before, .business-guide .dropdown-menu, .page-business-guide .angled:before, .page-business-guide .angled, .page-business-type .angled, .page-business-type .angled:before {background-color:#CF5378;}
header#masthead li.business-guide ul.dropdown-menu li > a:hover{ background: #f183a5;}

/*Our community*/
 .category-competitions-surveys #secondary,
.category-development-news #secondary, .category-latest-news #secondary {border-color:#FEAE17;}

.latest-news .dropdown-menu {
    background: #FEAE17;
}

header#masthead li.latest-news a:hover {
    color: #FEAE17;
}

header#masthead li.latest-news ul.dropdown-menu li > a:hover {
    background-color: #FC3;
}

/*What's on*/
.parent-whats-on #secondary, #secondary.whats-sidebar,
.whats-on .dropdown-menu, .page-parent-whats-on #secondary {
    background: #CD66FF;
}

header#masthead li.whats-on a:hover {
    color: #CD66FF;
}

header#masthead li.whats-on ul.dropdown-menu li > a:hover {
    background: #d996fa;
    ;
}

/*History*/
.parent-history #secondary, .page-history #secondary{border-color:#7D4FD9;}

.history .dropdown-menu, .page-parent-history .angled, .page-parent-history .angled:before {
    background: #7D4FD9;
}

header#masthead li.history a:hover {
    color: #7D4FD9;
}

header#masthead li.history ul.dropdown-menu li > a:hover {
    background: #b190f3;
}

/*Our community*/

.parent-our-community #secondary,
.page-parent-our-community #secondary {
   border-color: #FF6602;
   }
.page-parent-our-community .angled, .page-parent-our-community .angled:before, .our-community .dropdown-menu
{
    background: #FF6602;
}

header#masthead li.our-community a:hover {
    color: #FD6804;
}

header#masthead li.our-community ul.dropdown-menu li > a:hover {
    background-color: #FC3;
}

/*visitor info*/
.visitor-information #secondary, .page-parent-visitor-information #secondary, .visitor-information #secondary{border-color:#4deb98;}
.visitor-information .dropdown-menu,
.page-parent-visitor-information .angled, .page-parent-visitor-information .angled:before {
    background: #4deb98;
}


header#masthead li.visitor-information a:hover {
    color: #4deb98;
}

header#masthead li.visitor-information ul.dropdown-menu li > a:hover {
    background-color: #A6CD32;
}

/*about us*/
.about-us #secondary, .page-parent-about-us #secondary{
border-color:#67B0FF;
}
.about-us .dropdown-menu, .page-parent-about-us .angled, .page-parent-about-us .angled:before {
    background: #67B0FF;
}

header#masthead li.about-us a:hover {
    color: #67B0FF;
}

header#masthead li.about-us ul.dropdown-menu li > a:hover {
    background: navy;
}


header#masthead li.links a:hover {
    color: #00B0D9;
}

header#masthead li.links ul.dropdown-menu li > a:hover {
    background: #f183a5;
}

/**********************
HEADER
**********************/
header#masthead li.business-guide li a:hover,
header#masthead li.whats-on li a:hover,
header#masthead li.history li a:hover,
header#masthead li.visitor-information li a:hover,
header#masthead li.our-community li a:hover,
header#masthead li.about-us li a:hover,
header#masthead li.links li a:hover
{
    color: #FFF;
}

/* CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
  height: 300px;
  margin-bottom: 0px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel .item {
  height: 300px;
  background-color: #d9e021;
}
.carousel-inner > .item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 300px;
}
.carousel-inner .item .carousel-caption{
	text-shadow: 0 2px 5px #000;
	}

.carousel H1 a{
	color:#FFF;
	font-weight:900;
	font-size:130%;
	}