/*
Theme Name: Colourstop
Theme URI: http://www.colourstop.com.au
Author: Jess Paroz
Author URI: http://www.jessparoz.com/
Description: Custom made website template for ColourStop
Version: 1.0
Text Domain: ColourStop

*/

body {
  padding-top: 130px;
  padding-bottom: 20px;
}
h1, h2,h3,h4,h5,h6, p, .navbar, .thumbnail .caption {
	font-family: "PT Sans", sans-serif;
}
img {
	width: 100%;
	height: auto;
}
.red {
	color: #e02f28;
}
.admin-bar .navbar-fixed-top {
	margin-top: 30px;
	overflow: visible;
}
header {
  overflow: hidden;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  -webkit-transition: height 0.3s;
  -moz-transition: height 0.3s;
  -ms-transition: height 0.3s;
  -o-transition: height 0.3s;
  transition: height 0.3s; 
}
.navbar {
	background: #fefefe;
	border: none;
	box-shadow: 5px 3px 10px rgba(0,0,0,0.26);
	-webkit-box-shadow: 5px 3px 10px rgba(0,0,0,0.26);
	-moz-box-shadow: 5px 3px 10px rgba(0,0,0,0.26);
	padding-top: 10px;
}

.navbar-nav>li>a {
	-webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

.navbar-inverse .navbar-nav>li>a:hover, .navbar-inverse .navbar-nav>li>a:focus {
	color: #f7941d;
	background-color: transparent;
	border-bottom: 3px solid #f7941d;
}
.navbar-inverse .navbar-nav>li>a {
	color: #2a2c75;
}
.logo {
	width: 100%;
	-webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s; }
}

.sub-menu li {
	margin-bottom: 10px;
	list-style: none;
}

.sub-menu li:last-child {
	margin-bottom: 0;
}

.sub-menu a  {
	color: #999;
	text-decoration: none;
}

.sub-menu a:hover  {
	color: #fff;	
}	

.current-menu-item > a, .current-menu-parent > a {
	background: #000;	
}
.current-menu-parent li a {
	background: inherit;
}
.current-menu-parent .current-menu-item a {
	color: #fff;
	font-weight: bold;
}
.navbar-nav>li.dropdown:hover>.dropdown-menu {
	display: block
}
.bg-image {
	background: url('../colourstop/images/colourstop-building.jpg') no-repeat top;
	height: 800px;
}
.image-wrapper {
  display: inline-block;
  /* change the default display type to inline-block */
  overflow: hidden;
}
img.grow {
  -webkit-transition: all 1s ease;
  /* Safari and Chrome */
  -moz-transition: all 1s ease;
  /* Firefox */
  -ms-transition: all 1s ease;
  /* IE 9 */
  -o-transition: all 1s ease;
  /* Opera */
  transition: all 1s ease;
}
img.grow:hover {
  -webkit-transform: scale(1.25);
  /* Safari and Chrome */
  -moz-transform: scale(1.25);
  /* Firefox */
  -ms-transform: scale(1.25);
  /* IE 9 */
  -o-transform: scale(1.25);
  /* Opera */
  transform: scale(1.25);
}
.call-out {
	background: rgba(255,255,255,0.95);
	text-align: center;
}
.tagline {
	text-align: center;
	margin: 70px 0;
}
.thumbnail {
	padding: 0px;
	margin-bottom: 90px;
	border: none;
	border-radius: 0;
}
.thumbnail .caption {
	color: #fff;
	font-size: 22px;
	margin-top: -5px;
}
.thumbnail .caption.red{
	background: #e02f28;
}
.thumbnail .caption.orange{
	background: #f7941d;
}
.thumbnail .caption.blue{
	background: #2a2c75;
}



footer {
	margin-top: 20px;
}
img.distributor-logo {
	height: 65px;
	margin: 15px;
	width: auto;
}
.paint-background {
	background: url('../colourstop/images/paint-stroke.png') no-repeat bottom;
	background-size: contain;
	padding-bottom: 35px;
	margin-bottom: 30px;
}
footer .thumbnail .caption {
	font-size: 14px;
	padding: 5px;
	text-align: center;
}


@media (max-width: 767px) {
	body {
		padding: 0;
	}
	.navbar-fixed-top, .navbar-fixed-bottom {
		position: relative;
	}
	.navbar-collapse {
		width: 100%;
	}
	.navbar {
		padding: 0;
		margin: 0;
		box-shadow: none;
		margin-bottom: 20px;
	}
	.call-out {
		background: rgba(255,255,255,0.85);
		margin-top: 120px;
		border-radius: 0%;
		padding: 60px 50px;
	}

}
@media (min-width: 768px) and (max-width: 991px) {
	body {
		padding-top: 90px;
	}
	.navbar-nav>li>a {
		font-size: 16px;
		padding: 15px 15px 25px 15px;
	}
	.navbar-collapse {
		margin-top: 20px;
	}
	.navbar-inverse .navbar-nav>li>a:hover, .navbar-inverse .navbar-nav>li>a:focus {
		padding-bottom: 22px;
	}
	.call-out {
		margin-top: 120px;
		border-radius: 100%;
		height: 605px;
		padding: 60px 70px;
	}
	.call-out h1 {
		margin-top: -30px;
	}


}
@media (min-width: 992px) and (max-width: 1199px) {
	body {
		padding-top: 110px;
	}
	header.smaller .logo {
    	width: 58%;
	}
	.navbar {
		padding-top: 13px;
	}
	.navbar-nav>li>a {
		font-size: 20px;
		padding: 52px 25px 35px 25px;
	}
	.navbar-inverse .navbar-nav>li>a:hover, .navbar-inverse .navbar-nav>li>a:focus {
		padding-bottom: 32px;
	}
	header.smaller .navbar-nav>li>a{
		font-size: 16px;
		padding: 20px;
	}
	header.smaller.navbar-inverse .navbar-nav>li>a:hover, header.smaller.navbar-inverse .navbar-nav>li>a:focus {
		padding-bottom: 17px;
	}
	.call-out {
		margin-top: 120px;
		border-radius: 100%;
		height: 485px;
		padding: 20px 70px;
	}
	.call-out h1 {
		margin: -15px 0 15px;
	}
	

}
@media (min-width: 1200px) {
	header.smaller .logo {
    	width: 47%;
	}
	.navbar-nav>li>a {
		font-size: 22px;
		padding: 65px 25px 40px 25px;
	}
	.navbar-inverse .navbar-nav>li>a:hover, .navbar-inverse .navbar-nav>li>a:focus {
		padding-bottom: 37px;
	}
	header.smaller .navbar-nav>li>a{
		font-size: 16px;
		padding: 20px;
	}
	header.smaller.navbar-inverse .navbar-nav>li>a:hover, header.smaller.navbar-inverse .navbar-nav>li>a:focus {
		padding-bottom: 17px;
	}
		
	.call-out {
		margin-top: 120px;
		border-radius: 100%;
		height: 585px;
		padding: 60px 50px;
	}
	.call-out h1 {
		margin-top: -30px;
	}
}