/*!
 * Start Bootstrap - Modern Business HTML Template (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

/* Global Styles */

html,
body {
    height: 100%;
}

body {
    padding-top: 50px; /* Required padding for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */
  
}



h1{
	text-align: center;
}


.carousel-caption{
	/*margin-left: -27.25em;*/
	margin-left: auto;
	width: 100%;
	margin-right: -20%;
	background-color: /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ccffff+20,ccffff+50,ccffff+80,ffffff+100 */
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(left, #ffffff 0%, #ccffff 20%, #ccffff 50%, #ccffff 80%, #ffffff 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #ffffff 0%,#ccffff 20%,#ccffff 50%,#ccffff 80%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #ffffff 0%,#ccffff 20%,#ccffff 50%,#ccffff 80%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */;
	opacity: 0.7;
	padding-top: 1.5em;
	padding-bottom: 1.5em;
	position: absolute;
	bottom: 0;
	height: 20%;
	border-bottom: 1px solid gray;
}

h3{
	
	text-align: center;
	color: black;
	font-size: 125%;
}

/*nav img{
	
	/*float: left;*/
	margin-top: .5em;
	/*margin-right: 2.5em;*/
	margin-left: auto;
	height: 25%;
	width: 25%;
}*/



.navbar{
	background-color: #1a0d00;
	
}

.item{
 	text-align: middle;	
}

.button1{
	margin-top: 2.5em;
	text-align: center;
}

/*for product sample buttons on page*/
.button2{
	text-align: center;
	/*margin-top: 8em;*/
	margin-bottom: 1em;	
}

.button3{
	text-align: center;
	margin-bottom: 1em;		
}

.button4{
	text-align: center;
	/*margin-top: 8em;*/
	margin-bottom: 1em;	
}

/*.btn-default1{
	color:gray;
	font-size: 100%;
	border: 1px solid gray;	
}*/

/* Style the buttons*/
.btn-default1{
	background-color: #66ffff;
	color: white;
	width: 50%;	
	border: none;
}

.btn-default2{
	background-color: #66ffff;
	color: white;
	width: 50%;	
	border: none;
	font-size: 120%;
}

.btn-default2:hover{
	opacity: .6;
}

.btn-default1:hover{
	opacity: .6;
}

div.well{
	margin-bottom: 0;
}

/* For basic info on page*/
.panel-body{
	padding-bottom: 2.15em;
}
.panel-body2{
	text-align: center;
	padding-bottom: 2em;
}
.panel-body3{
	/*font-size: 120%;*/
	/*font-weight: bold;*/
	padding-bottom: 2em;
	padding-left: 1em;
	text-align: center;
	
}

.panel-body3{
 margin-top: 2em;	
}



div.col-md-4{
	text-align: center;	
}

.img-portfolio {
    margin-bottom: 30px;
}

.img-hover:hover {
    opacity: 0.8;
}

/* Home Page Carousel */



header.carousel {
    height: 50%;
    
}

header.carousel .item,
header.carousel .item.active,
header.carousel .carousel-inner {
    height: 100%;
   
}

header.carousel .fill {
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
    
}

div.col-sm-6:hover{
	border: 1px solid #b3ffff;	
	
}
/* 404 Page Styles */

.error-404 {
    font-size: 100px;
}

/* Pricing Page Styles */

.price {
    display: block;
    font-size: 50px;
    line-height: 50px;
}

.price sup {
    top: -20px;
    left: 2px;
    font-size: 20px;
}

.period {
    display: block;
    font-style: italic;
}



/* For the about
 * page
 */

div.row{
	padding-top: 1em;	
}

.carousel-caption2{
	/*margin-left: -27.25em;*/
	margin-left: auto;
	width: 100%;
	margin-right: -20%;
	background-color: /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ccffff+20,ccffff+50,ccffff+80,ffffff+100 */
	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(left, #ffffff 0%, #ccffff 20%, #ccffff 50%, #ccffff 80%, #ffffff 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #ffffff 0%,#ccffff 20%,#ccffff 50%,#ccffff 80%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #ffffff 0%,#ccffff 20%,#ccffff 50%,#ccffff 80%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */;
	opacity: 0.7;
	padding-top: 1em;
	padding-bottom: 1.5em;
	position: absolute;
	bottom: 0;
	height: 20%;
	border-bottom: 1px solid gray;
}

.carousel-caption2>h3{
	
	font-size: 200%;
	letter-spacing: 10px;
	font-weight: 100;
	color: #a6a6a6;
}


.row{
	background-image: url(Images/starburst.PNG);
}

.col-lg-12>h1{
	/*border-bottom: 1px solid #737373;*/
	
}
	
div.pictureHeading>img{
	float: right;
	width: 50%;
}

.pictureHeading{
	width: 100%;
	border-bottom: 1px solid #737373;
	margin-top: 5em;	
}

.ingredients{
		background-color: #ccffff;
		padding-bottom: 7em;
		padding-top: 2em;
		padding-left: 2em;
}

.ingredients>h3{
	text-decoration:underline;
	margin-bottom: 1em;	
}

.ingredients>p.key{
	/*text-transform: uppercase;*/
	/*font-weight: 600;*/
	/*font-size: 105%;*/
	color: #737373;	
	
}

.ingredients>h4{
	color: #737373;	
	margin-bottom: 1.5em;	
	font-size: 120%;
}

/*
 * 
 * Style for perks
 */
div.perks{
	background-color: #b3ffff;
	padding: 1em;
	letter-spacing: 1.5px;	
}




/* Styles for social
 * media
 * 
 * 
 */

/* Reset */
@import url(//codepen.io/chrisdothtml/pen/ojLzJK.css);
.social-buttons {
  height: 90px;
  margin: auto;
  font-size: 0;
  text-align: center;
  /*otherwise social media links stay at top*/
  position: inherit;
  border-bottom: 1px dotted gray;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  
}

.social-button {
  display: inline-block;
  background-color: #fff;
  width: 90px;
  height: 90px;
  line-height: 90px;
  margin: 0 10px;
  text-align: center;
  position: relative;
  overflow: hidden;
  opacity: .99;
  border-radius: 28%;
  box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.05);
  -webkit-transition: all 0.35s cubic-bezier(0.31, -0.105, 0.43, 1.59);
  transition: all 0.35s cubic-bezier(0.31, -0.105, 0.43, 1.59);
  
}
.social-button:before {
  content: '';
  background-color: #000;
  width: 120%;
  height: 120%;
  position: absolute;
  top: 90%;
  left: -110%;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  -webkit-transition: all 0.35s cubic-bezier(0.31, -0.105, 0.43, 1.59);
  transition: all 0.35s cubic-bezier(0.31, -0.105, 0.43, 1.59);
}
.social-button .fa {
  font-size: 38px;
  vertical-align: middle;
  -webkit-transform: scale(0.8);
          transform: scale(0.8);
  -webkit-transition: all 0.35s cubic-bezier(0.31, -0.105, 0.43, 1.59);
  transition: all 0.35s cubic-bezier(0.31, -0.105, 0.43, 1.59);
}
.social-button.facebook:before {
  background-color: #3B5998;
}
.social-button.facebook .fa {
  color: #3B5998;
}
.social-button.twitter:before {
  background-color: #3CF;
}
.social-button.twitter .fa {
  color: #3CF;
}
.social-button.google:before {
  background-color: #DC4A38;
}
.social-button.google .fa {
  color: #DC4A38;
}
.social-button.dribbble:before {
  background-color: #F26798;
}
.social-button.dribbble .fa {
  color: #F26798;
}
.social-button.skype:before {
  background-color: #00AFF0;
}
.social-button.skype .fa {
  color: #00AFF0;
}
.social-button:focus:before, .social-button:hover:before {
  top: -10%;
  left: -10%;
}
.social-button:focus .fa, .social-button:hover .fa {
  color: #fff;
  -webkit-transform: scale(1);
          transform: scale(1);
}


/*
 * 
 * Style for shopping cart in header
 * 
 */
div.shoppingCart{
	float:right;
}




/*
 * 
 * Application form
 * 
 */
a.app :hover{
	color: #66ffff;	
	text-decoration: none;
}
a.app{
	text-decoration: none;	
}

/*
 * 
 * 
 * Add to cart button
 */
h3.addToCart :hover{
	/*background-color: #4d4d4d;	*/
	color: #ccebff;
	transition: background-color 0.5s ease;
  	background-color: #4d4d4d;
}

.btn-lg{
	border: 1px solid  #4d4d4d;	
	color:  #4d4d4d;
	background-color: #ccebff;
	text-align: center;
}

.btn-lg:hover{
	transition: background-color 0.5s ease;
	color: #ccebff;
	opacity: .6;
	background-color: #4d4d4d;
	border: none;	
}

div.col-md-9{
	width: 50%;
}



/* Footer Styles */

footer img{
	margin-top: 1em;
	
}

footer p{
		
}

footer {
		
	text-align: center;
	padding-top: .15em;
	padding-bottom: .15em;
    margin: 50px 0;
    background-color: #1a0d00;
}

/* Responsive Styles */

@media(max-width:991px) {
    .customer-img,
    .img-related {
        margin-bottom: 30px;
    }
    .carousel-caption2>h3{
    	font-size: 120%;
    	
    }
     div.col-md-9{
    	width: 100%;
    	
    }
  .carousel-inner2{
  	width: 200%;
  }
  div.shoppingCart{
  	float: left;
  }
  
  
  
}

@media(max-width:767px) {
    .img-portfolio {
        margin-bottom: 15px;
    }

    header.carousel .carousel {
        height: 70%;
    }
     .carousel-caption2>h3{
    	font-size: 75%;
    	
    }
    div.col-md-9{
    	width: 100%;
    	
    }
    .carousel-inner2{
  	width: 225%;
  }
  div.shoppingCart{
  	float:none; 	
  	text-align: center;
  	width: 100px;
    
  }
  
   
}