/*
Theme Name: BootstrapWP
Theme URI: http://bootstrapwp.rachelbaker.me
Author: Rachel Baker
Author URI: http://www.rachelbaker.me
Description: A semantic HTML/CSS framework base theme for WordPress Developers ported from Twitter Bootstrap
Version: .87
=======
License: GNU General Public License
License URI: license.txt

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/********************************************************

Comfortable with LESS?  Check out the /less folder where the bootstrapwp.less file is the master complier

////////   IMPORTANT!  Make custom edits/changes in the less/bswp-custom.less file
////////   to safely retain the ability to update the less files with future
////////   versions of Bootstrap or BootstrapWP

-------------------------------------------------- */

p {
	font-family:'Helvetica Nueve', Helvetica, sans-serif;
	margin-bottom:20px;
	font-size:15px;
	line-height:1.4em;
}

h1, h2, h3, h4 {
	font-family:museo-slab,"Helvetica Neue",Helvetica,Arial,sans-serif;
}

h3.popover-title {
	font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;	
}

.masthead {
	padding:30px 0 30px;
}

.masthead h1 {
	font-size:50px;
	margin-bottom:20px;
}

.masthead h2 {
	margin-bottom:25px;
	font-size:25px;
	font-weight:normal;
}

.aligncenter {
	text-align:center;
}

.white-panel {
	background-color:white;
	padding:10px 0px;
}

.white-panel p {
	color:black;
	font-size:20px;
}

.rounded-corners-large {
	border-radius: 10px;
}

.gray {
	padding: 22px 0 17px;
	background-color: #f5f5f5;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}

/* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
 


.float-up {
   // opacity:0;  /* make things invisible upon start */
    -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
    -moz-animation:fadeIn ease-in 1;
    animation:fadeIn ease-in 1;
 
    -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
    -moz-animation-fill-mode:forwards;
    animation-fill-mode:forwards;
 
    -webkit-animation-duration:1s;
    -moz-animation-duration:1s;
    animation-duration:1s;
    background:none !important;
}


/* 
.float-up.one {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
animation-delay: 0.7s;
}
 
.float-up.two {
-webkit-animation-delay: 1.2s;
-moz-animation-delay:1.2s;
animation-delay: 1.2s;
}
 
.float-up.three {
-webkit-animation-delay: 1.6s;
-moz-animation-delay: 1.6s;
animation-delay: 1.6s;
}

.float-up.four {
-webkit-animation-delay: 2.2s;
-moz-animation-delay: 2.2s;
animation-delay: 2.2s;
}

*/

.float-up {
	background-color:white;
	padding:0px 0px 10px;
	min-height:210px;
	box-shadow: 0px 0px -5px black;
}

@media (max-width:760px) {
	.float-up {
		margin-top:10px !important;
		margin-left:15px;
		margin-right:15px;
		width:auto;
	}
}

.float-up p {
	color:#333;
	text-shadow:none;
	font-size:15px;
	margin-bottom:10px;
	text-align:left;
	padding:0px 20px;
	font-family:'Helvetica Nueve', Helvetica, sans-serif;
}

.float-up h3 {
	margin: 20px 0px 15px;
	font-weight: 300;
	font-size: 20px;
	padding: 10px 20px;
	text-align: left;
	line-height: 1em;
	text-shadow: none;
	position:relative;
	z-index:4;
	background-color:white;
	min-width:100px;
	display:inline;
	float:left;
	background-color:white;
	color:#333;
	box-shadow:0px 0px 20px -5px #333;
}

li {
	list-style:none;
}

.godown {
	margin-top:20px;
}

.jumbotron {
	background:none !important;
	background-image:none !important;
	background:url('img/woodbkg.jpg') !important;
	background-position: top center;
	margin-top:28px;
	filter:none;
}

@media (max-width:979px) {
	.jumbotron {
			margin-top:0px;
		}
		.navbar-fixed-top {
			margin-bottom:0px;
		}
}

.jumbotron:after {
	background-image:none !important;
	background:none !important;
}

@media (min-width:960px) {

	body.admin-bar .navbar-fixed-top {
		margin-top:28px;

	}

	body.admin-bar .jumbotron {
		margin-top:40px;
	}
}

.jumbotron a {
	color: #333;
}

.jumbotron a:hover {
	color:black;
	text-decoration:none;
}

.facebook {
	padding:0px 5px;
	display:inline;
}

.twittershare {
	padding:0px 5px;	
	display:inline;
}

.twitterfollow {
	padding:1px 5px 0px;
	display:inline;
}

h2 {
	padding-bottom: 9px;
	margin: 20px 0 15px;
	border-bottom: 1px solid #eee;
}

.masthead h2 {
	border-bottom:none;
	margin-bottom:15px;
}

.aligncenter {
	text-align:center !important;
}

.spacer {
	width:100%;
	height:10px;
}

li#menu-item-9 a:before {
	content: <i class="icon-lightbulb"></i>;
}

input[type="radio"] {
	margin-left:5px;
}
input[type="file"] {
	line-height:15px;
}

.masthead h1, .masthead h2 {
	padding-left:15px;
	padding-right:15px;
}

#process, #servicearea, #contact, #services, #about, #clientstories {
	padding-top:60px;
}

h2.contact {
	border-top:1px solid #eee;
	padding:15px;
}

/* FLIPPING */
/* entire container, keeps perspective */
.flip-container {

}

.flipper {
	position:relative;
}

.flip-container .front {
	position:absolute;
	top:0px;
	left:0px;
	z-index:2;
	opacity:1;  /* make things invisible upon start */
    -webkit-transition: opacity 0.5s ease-in-out;
    -moz-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
}

.flip-container .front:hover {
	opacity:0; 
}

.flip-container .back {
	position:absolute;
	top:0px;
	left:0px;
	z-index:1;
}

.flip-container img {
	border-radius:12px;
}

.picturebutton {
	position:relative;
	z-index:5;
	font-size:15px !important;
	padding:10px 15px !important;
	margin-top:205px;
	font-weight:bold;
	
}

@media (max-width:1200px) {
	.picturebutton {
		margin-top:170px;
	}
}

@media (max-width:1000px) {
	.picturebutton {
		margin-top:130px !important;
	}
}

hr {
	clear:both;
}

img.alignleft {
	margin-right:15px;
	margin-bottom:20px;
}

@media (max-width:480px) {
	a.brand {
		font-size:15px !important;
	}
}

p.quote {
	position: relative;
	padding: 10px 15px 15px;
	border: 5px solid #ccc;
	background: #fff;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	background-color:#ebebeb;
}

p.quote:after {
	content: "";
	position: absolute;
	bottom: -13px;
	left: 47px;
	border-width: 13px 13px 0;
	border-style: solid;
	border-color: #ebebeb transparent;
	display: block;
	width: 0;
}

p.quote:before {
	content: "";
	position: absolute;
	bottom: -20px;
	left: 40px;
	border-width: 20px 20px 0;
	border-style: solid;
	border-color: #ccc transparent;
	display: block;
	width: 0;
}

p.afterquote {
	padding-left: 46px;
	font-weight: bold;
	font-style: italic;
}