@import url(//fonts.googleapis.com/earlyaccess/notosanssc.css);

.jumbotron {
    margin-bottom: 0px;
    background-image: url(http://www.foodforthoughtcatering.ca/uploaded_images/Fotolia_4727411_M-735006.jpg);
    background-position: 0% 25%;
    background-size: cover;
    background-repeat: no-repeat;
    color: white;
    text-shadow: black 0.3em 0.3em 0.3em;
}

.slider img.resize{
    width: auto; /* you can use % */
    height: 400px;
    max-height: 400px;
}

.carousel-content {
  position: absolute;
  bottom: 75%;
  left: 5%;
  z-index: 20;
  color: white;
  text-shadow: 0 1px 5px rgba(0,0,0,.6);
}

.carousel-content {
  position: absolute;
  bottom: 75%;
  left: 5%;
  z-index: 20;
  color: white;
  text-shadow: 0 1px 5px rgba(0,0,0,.6);
}

.carousel-title {
  font-family: 'Muli', sans-serif;
  color: white;
  font-size: 4vw;
  text-shadow: rgb(3, 3, 3) 9px 0px 11px;
}

.carousel-subtitle {
  font-family: 'Source Sans Pro', sans-serif;
  color: white;
  font-size: 2vw;
  text-shadow: rgb(3, 3, 3) 9px 0px 11px;
}


#top-link-block.affix-top {
    position: absolute; /* allows it to "slide" up into view */
    bottom: -50px; /* negative of the offset - height of link element */
    right: 50px; /* padding from the right side of the window */
}
#top-link-block.affix {
    position: fixed; /* keeps it on the bottom once in view */
    bottom: 100px; /* height of link element */
    right: 50px; /* padding from the right side of the window */
}

#navbar {
  margin-bottom: 0px;
}

#mapoverlay {
   background:transparent;
   position:relative;
   width:100%;
   height:400px; /* your iframe height */
   top:400px;  /* your iframe height */
   margin-top:-400px;  /* your iframe height */
}

#map {
 height: 400px;
 width: 100%;
}

.navbar-header img{
    width: auto;
    height: 40px;
}

.slider {
  filter: brightness(50%);
  width: 100%;
}

.crop {
    /*
    width: auto;
    height: 50vw;
    overflow: hidden;
    */
}


.crop img {
  /*
  width: auto;
  height: auto;
  margin-top: -80px;
  margin-left: -80px;
  */
}


.footer-container {
  width: auto;
  max-width: 1020px;
  padding: 30px;
  margin-right: auto;
  margin-left: auto;
  font-size: 1em;
}

.footer-links {
  margin: 0;
  list-style: none;
}

.footer-links li {
  display: inline-block;
  line-height: 20px;
}

.footer-links li+li {
  margin-left: 20px;
}

.dropdown-menu {
  width: 300px;
  border-top:0px;
  margin: 10px;
  /*border-radius: 25px; */
  top: 20%;
  right: 20%;
}

.dropdown-menu .col-sm-12 {
  margin-bottom:7px;
}

.dropdown-menu:after {
  content: '';
  display: inline-block;
  border-left: 6px solid transparent;
}

.button-top {
	background: #528bff;
	color: #fff;
	width: 64px;
	height: 64px;
	line-height: 38px;
	border-radius: 100%;
}


.button-square {
	background: #528bff;
	color: #fff;
	position: relative;
	top: 50px;
	width: 64px;
	height: 64px;
	line-height: 38px;
	border-radius: 100%;
}

.message-form {
  margin: 20px;

}

/*
h1 span {
  font-size: 6vw; text-shadow: rgb(3, 3, 3) 9px 0px 11px;
  height: 300px;
  position: absolute;
  width: 4vw;
  left: 0;
  top: 0;
  transform-origin: bottom center;
}
*/

h1 span {
  font-size: 7vw; text-shadow: rgb(3, 3, 3) 9px 0px 11px;
  height: 30px;
  position: absolute;
  width: 3vw;
  left: 0;
  top: 0;
  transform-origin: bottom center;
  display: inline-block;
  position: relative;
  letter-spacing: -15px;
}

.tamma {
  font-family: 'Baloo Tamma';
}

.full-width {
    width: 100%;
}

.carousel-caption {
    position: absolute;
    top: 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    height: 100%;
}

.char1 { transform: rotate(370deg); color: #c44032; font-family: 'Baloo Tamma'}
.char2 { transform: rotate(382deg); color: #e36b23; font-family: 'Baloo Tamma'}
.char3 { transform: rotate(394deg); color: #e6c92e; font-family: 'Baloo Tamma'; top: -1px;}
.char4 { transform: rotate(380deg); color: #5da028; font-family: 'Baloo Tamma'; top: -7px;}
.char5 { transform: rotate(358deg); color: #4584be; font-family: 'Baloo Tamma'}
.char6 { transform: rotate(370deg); color: #c44032; font-family: 'Baloo Tamma'}
.char7 { transform: rotate(382deg); color: #e36b23; font-family: 'Baloo Tamma'; top: -7px;}
.char8 { transform: rotate(394deg); color: #e6c92e; font-family: 'Baloo Tamma'; top: -1px;}
.char9 { transform: rotate(406deg); color: #5da028; font-family: 'Baloo Tamma'}
