/*
 * Start Bootstrap - Full Width Pics (http://startbootstrap.com/)
 * Copyright 2013-2016 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE)
 */

body {
    background-image: url(../img/body-bg-paper.jpg);
    background-repeat: no-repeat;
    background-position: 0 auto;
    background-size:  auto 100%;
    font-family: 'Rock Salt',  'sans-serif';
    color:#000;
}

h1,h2,h3,h4,h5,h6{text-transform: uppercase; font-family: 'Passion One', 'sans-serif'; text-align: center;}

.img-center {
	margin: 0 auto;
}

ul li{list-style: none;}

section {
    padding: 75px 0;
}

.section-heading {
    margin: 30px 0;
    font-size: 4em;
}

.section-lead {
    margin: 30px 0;
}

.section-paragraph {
    margin: 30px 0;
}

footer {
    margin: 50px 0;
}

/* Lightbox */
/* http://alt-web.com/TUTORIALS/?id=bootstrap_simple_image_zoom  */
/**THE SAME CSS IS USED IN ALL 3 DEMOS**/
/**gallery margins**/

.thumbnail {
    display: block;
    padding: 10px;
    margin-bottom: 20px;
    line-height: 1.42857143;
    background-color: #eee;
    border: 1px solid #999;
    border-radius: 0px;
    -webkit-transition: border .2s ease-in-out;
    -o-transition: border .2s ease-in-out;
    transition: border .2s ease-in-out;
}

.gallery{
margin-left: 3vw;
margin-right:3vw;
}

.zoom {
-webkit-transition: all 0.35s ease-in-out;
-moz-transition: all 0.35s ease-in-out;
transition: all 0.35s ease-in-out;
cursor: -webkit-zoom-in;
cursor: -moz-zoom-in;
cursor: zoom-in;
}

.zoom:hover,
.zoom:active,
.zoom:focus {
/**adjust scale to desired size,
add browser prefixes**/
-ms-transform: scale(1.5);
-moz-transform: scale(1.5);
-webkit-transform: scale(1.5);
-o-transform: scale(1.5);
transform: scale(1.5);
position:relative;
z-index:100;
}

/**To keep upscaled images visible on mobile,
increase left & right margins a bit**/
@media only screen and (max-width: 768px) {
ul.gallery {
margin-left: 15vw;
margin-right: 15vw;
}

/**TIP: Easy escape for touch screens,
give gallery's parent container a cursor: pointer.**/
.DivName {cursor: pointer}
}

.gallery img{max-width: 100%;}

@media(max-width:768px) {
    section {
        padding-top: 25px;
        padding-bottom: 25px;
    }

    .section-heading {
        font-size: 2em;
    }
}

@media(min-width:768px) {
body{ margin-top: 250px;     font-size:2.16em;}

  h1{font-size:100px;}
  h2{font-size:75px;}

  .glyphicon{font-size:2.5em; vertical-align: middle;}

}

@media(max-width:468px){
  body{ margin-top: 0px;     font-size:1.8em;}

}