@media only screen and (min-width: 580px) {
  img.thumbnail {
    width: auto;
  }
}



html {
  /* killing 300ms touch delay in IE */
  -ms-touch-action: manipulation;
  touch-action: manipulation;
}

body {
  font-family: 'Oswald', sans-serif;
  background-color: #151c20;
  padding:0;
  margin:0;
 
}

h1 {
  font-family: 'Oswald', sans-serif;
  color: #fff;
  font-size: 4em;
  margin: 0;
}

#container {
  text-align: center;
  padding: 0 0 0 0;
  margin: 0 auto;
  margin-top: 0;
  /* 50 100 */
}

.main-img-container{

  background:#253037 url(../img/bgc.jpg) top right no-repeat;
  background-attachment: fixed;
  padding: 4rem 0;

}


 .blues{
  padding: 4rem 0;
  background:#253037 ;



  background: linear-gradient(
    to top,
    rgba(37,48,55, 0.6), 
    rgba(37,48,55, 0.2)
  ),url(../img/full/jpforweb.jpg) top right no-repeat fixed / cover;
  

 }



 .blues > * {
border: solid 5rem #fff ;

 }

.flex {
          display: flex;
          flex-wrap: wrap;
          justify-content: center;
	}

.gallery__item{
	width:0px;
	height:600px;
	background:#253037;
	margin:20px;
  border: 20px solid #253037;
transition:width 2s;
 
  max-width: 300px;
transition-timing-function: ease-out;

}


.gallery__item:hover {
  opacity:0.5;
  background-position: 0px -20px !important;
  transition: all .5s;
}




.gallery__item a{
	width:100%;
	height:100%;
	display:block;
}





#beet{

	background-image: url('../img/beet_re.jpg');
background-position: -130px -150px;;
}


#sheep2{

	background-image: url('../img/sheepsfsdfs-on-a-stick.jpg');
	background-position: -90px -60px;
}

#sheep3{

	background-image: url('../img/sheep-stacrfrfsfk-solo.jpg');
	background-position: 0px 0px;
}

#giraffe1{

	background-image: url('../img/onwards72rsfsdffry-4.jpg');
	background-position: 0px 0px;
}

#giraffe2{

	background-image: url('../img/coiuoiuoiuioumbo.jpg');
	background-position: 0px 0px;
}




img.gallery__itemThumb {
  border-color: #eee;
  border: 0.625em solid rgba( 255, 255, 255, .5);
  /* 10 */
  -webkit-box-shadow: 0 0 0.313em rgba( 0, 0, 0, .05);
  /* 5 */
  -moz-box-shadow: 0 0 0.313em rgba( 0, 0, 0, .05);
  /* 5 */
  box-shadow: 0 0 0.313em rgba( 0, 0, 0, .05);
  /* 5 */
  -webkit-transition: -webkit-box-shadow .3s ease, border-color .3s ease;
  -moz-transition: -moz-box-shadow .3s ease, border-color .3s ease;
  -ms-transition: -ms-box-shadow .3s ease, border-color .3s ease;
  -o-transition: -o-box-shadow .3s ease, border-color .3s ease;
  transition: box-shadow .3s ease, border-color .3s ease;
  width: 100%;
}

img.gallery__itemThumb:hover {
  border-color: #fff;
  -webkit-box-shadow: 0 0 1.938em rgba( 0, 0, 0, .25);
  /* 15 */
  -moz-box-shadow: 0 0 1.938em rgba( 0, 0, 0, .25);
  /* 15 */
  box-shadow: 0 0 1.938em rgba( 0, 0, 0, .25);
  /* 15 */
}

.contact_sentence {
  font-size: 2.3em;
  color: #7b848b;

}


footer>div>a>img {
  width: 70px;
}

footer .pinterest_link {
  display: none;
}



#container .sm {
  display: none; 

}
.sm img {
  padding: 0;
  background-color: transparent !important;
  width:35px;

}




 .sm {
  text-align: center !important;
  padding-top: 30px;

}

  .m-lightbox__slide .sm{
		display:flex;
  }
  
  li .sm {
    text-align: center !important;
    padding-top: 30px;
    /* background: #45a245; */
    position: absolute;
    bottom: 1.5em;
    left: 50%;
    transform: translateX(-50%);
    display: none;
  }
  
  li .sm img {
    width: 35px;
  }
  
  
  @media only screen and (min-width: 780px) {
    li .sm {     
      bottom: -1.5em;
     
    }

    #contact_sentence {
      font-size: 5.3em;    
  }


  }





@media only screen and (min-width: 1024px) {
  .m-lightbox__slide img {
    padding: 30px;
    background-color: #fff;
    box-sizing: content-box;
  }
  ul#printingterms li {
    display: inline;
  }
}

@media only screen and (min-width: 1500px) {
  .m-lightbox__slide img {
    padding: 40px;
    background-color: #fff;
  }
}

#printingterms {
  padding-top: 2em;
  list-style-type: square;
}

ul#printingterms li {
  display: block;
}



@media only screen and (min-width: 1410px) {
 
  .box{
    flex-wrap: nowrap
    }
  
}



/* ---------------   lightbox ------------------  */

.m-lightbox {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background: rgba(255, 255, 255, 0.8);
  z-index: 1;
  opacity: 0;
  -webkit-transform: scale(0.8);
  transform: scale(0.8);
  -webkit-transition: opacity 0.3s ease-out, -webkit-transform 0.3s ease-out;
  transition: opacity 0.3s ease-out, -webkit-transform 0.3s ease-out;
  transition: opacity 0.3s ease-out, transform 0.3s ease-out;
  transition: opacity 0.3s ease-out, transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
  pointer-events: none;
}

.m-lightbox.is-active {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
  z-index: 101;
  pointer-events: auto;
}

.m-lightbox__slider {
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100vw;
  height: 100vh;
}

.m-lightbox__slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.m-lightbox__slide img {
  display: block;
  max-width: calc(100vw - 2em);
  max-height: 90vh;
  opacity: 0;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease;
}

@media (min-width: 768px) {
  .m-lightbox__slide img {
    max-width: calc(100vw - 116px);
    max-height: 90vh;
  }
}

.m-lightbox__slide.is-loaded.is-active img {
  opacity: 1;
}

.m-lightbox__slide.is-loaded.is-active .spinner {
  display: none;
}

.m-lightbox button {
  position: absolute;
  margin: 0;
  padding: 0;
  z-index: 102;
  background: transparent;
  border: none;
  cursor: pointer;
}

.m-lightbox__close {
  top: 1em;
  right: 1em;
}

.m-lightbox__nextPrev {
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  visibility: hidden;
  opacity: 0;
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  -webkit-transition: opacity 0.3s ease-out, -webkit-transform 0.3s ease-out;
  transition: opacity 0.3s ease-out, -webkit-transform 0.3s ease-out;
  transition: opacity 0.3s ease-out, transform 0.3s ease-out;
  transition: opacity 0.3s ease-out, transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
}

.m-lightbox__nextPrev.is-active {
  visibility: hidden;
  -webkit-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}

@media (min-width: 1024px) {
  .m-lightbox__nextPrev.is-active {
    visibility: visible;
  }
}

.m-lightbox__nextPrev svg {
  display: block;
  width: 100%;
  height: auto;
}

.m-lightbox__nextPrev--next {
  right: 1em;
}

.m-lightbox__nextPrev--prev {
  left: 1em;
}

.m-lightbox__nextPrev:hover {
  cursor: pointer;
}

.m-lightbox__counter {
  position: absolute;
  bottom: 1em;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  color: #333;
  font-weight: 700;
  display: none;
}

.spinner {
  width: 40px;
  height: 40px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
}

.spinner::before, .spinner::after {
  content: '';
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #333;
  opacity: 0.6;
  position: absolute;
  top: 0;
  left: 0;
  -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
  animation: sk-bounce 2.0s infinite ease-in-out;
}

.spinner::after {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

@-webkit-keyframes sk-bounce {
  0%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes sk-bounce {
  0%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  50% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}