/** GENERAL **/
/* For alingment debug purposes */
/*
* {
    border: 1px solid black;
}
*/


h1 {
  color: white;
  text-align: center;
}

p {
  font-size: 2em;
  color: white;
}
/** GENERAL **/



body {
  font-size: 16px;
  color: black;
  background-color: #567797;
  font-family: 'Indie Flower', cursive;
}

button {
  color: #567797;
}

/** HEADER **/
#header-nav {
  background-color: #e6ae9f;
  border-radius: 0;
  border: 0;
}

#logo-img {
  background: url('../images/creabybego-logo.png') no-repeat;
  width: 150px;
  height: 150px;
  background-size: 150px;
  margin: 10px 15px 10px 10px;
}
#logo-img:hover {
  opacity: .7;
}

/*
.navbar-brand {
  padding-top: 25px;
}
.navbar-brand h1 {  //Restaurant name 
  font-family: 'Indie Flower', cursive;
  color: brown;
  font-size: 5em;
  text-shadow: 2px -2px 0px #222;
  margin-top: 0;
  margin-bottom: 0;
  line-height: 2;
}
.navbar-brand a:hover, .navbar-brand a:focus {
  text-decoration: none;
}*/

#nav-list {
  margin-top: 10px;
}
#nav-list a {
  color: #951C49;
  text-align: center;
}
#nav-list a:hover {
  background: #E7E7E7;
}
#nav-list a span {
  font-size: 1.8em;
}

#phone {
  margin-top: 5px;
}
#phone a { /* Phone number */
  text-align: right;
  padding-bottom: 0;
}

.navbar-header button.navbar-toggle, .navbar-header .icon-bar {
  border: 1px solid #61122f;
}
.navbar-header button.navbar-toggle {
  clear: both;
  margin-top: -30px;
}
/* END HEADER */

/* CATEGORIES PAGE */
.category-tile { 
  position: relative;
  overflow: hidden;
  margin-top: 15px; /* the same as the padding of the cols, to be visually the same horizontally and vertically */
  margin-bottom: 15px; 
}
.category-tile span {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  text-align: center;
  font-size: 1.2em;
  /*text-transform: uppercase;*/
  background-color: #000;
  color: #fff;
  opacity: .8;
}
.category-tile:hover {
  box-shadow: 0 1px 5px 1px #cccccc;
  opacity: .8;
}

/*#menu-categories-title + div {
  margin-bottom: 50px;
}*/
/* END CATEGORIES PAGE */


  /* Footer */

.panel-footer a:hover{
 color: #337ab7; /* The color mustn't change to avoid differences with the icons coming from images */
 opacity: .7;
}
.panel-footer section {
  margin-bottom: 30px;
  text-align: center;
}
.panel-footer section:nth-child(3) {
  margin-bottom: 0; /* margin already exists on the whole row */
}
.panel-footer section hr {
  width: 50%;
}

#copyright {
  font-size: 1.5em;
  color: #567797;
}

.social-links {
    width: 100%; /* this will set nav full width of conatiner*/

  }
.social-links > li {
    display: inline-block; /* To erase the List Item Markers and to have horizontal list */
    vertical-align: middle;
    zoom: 1;
    text-align: center;
    margin-right: 20px;

}


.footer-social-links-inner {
  text-align: center;
}

  /* End Footer */





/********** Large devices only **********/
@media (min-width: 1200px) {

}

/********** Medium devices only **********/
@media (min-width: 992px) and (max-width: 1199px) {

}

/********** Small devices only **********/
@media (min-width: 768px) and (max-width: 991px) {

}

/********** Extra small devices only **********/
@media (max-width: 767px) {  
.social-links  {
   margin-left: -20px; /* to align the list in the center, check better solution*/
 }
.social-links > li {
    margin-right: 0px; /* override margin set for larger devices */

    width: 32%; /* To display three in a row */
}
}


/********** Super extra small devices Only :-) (e.g., iPhone 4) **********/
@media (max-width: 479px) {

  .footer-social-links-inner {
      text-align: left;
  }
 .social-links > li {
    margin-right: 0px;
    width: 100%; /* To display one in a row */
}
  .col-xxs-12 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    float: left;
    width: 100%;
  }
}