.container {
    padding: 20px;
}

img {
    max-width: 100%;
    height: auto;
}	

*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

body { margin: 0;
 }

.columnsContainer { position: relative; margin: .5em; }

.leftColumn, .rightColumn {  padding: 1.25em; }

.leftColumn { margin-bottom: .5em; }


/* MEDIA QUERIES */
@media screen and (min-width: 47.5em ) {
  .leftColumn { margin-right: 40em; }

	.rightColumn { position: absolute; top: 0; right: 0; width: 55em; }   
}


@media screen and (max-width: 480px)

{

.divider { display: none; }

}
#back-top {
  position: fixed;
  bottom:20px;
  right: 2%;
  z-index: 100; }

.navbar { margin-bottom: 0 }

.image-wrapper { position: relative; width: 100%; } 
.image-wrapper p { position: absolute; left: 400px; top: 280px; padding: 20px; border: 1px solid #FFFFFF; width: 600px; height: 200px; color: #000000; margin: 5px;text-align: center;}
  
/* MEDIA QUERIES */
@media screen and (min-width: 47.5em ) {

.slideanim {visibility:hidden;}
.slide {
    /* The name of the animation */
    animation-name: slide;
    -webkit-animation-name: slide; 
    /* The duration of the animation */
    animation-duration: 1s; 
    -webkit-animation-duration: 1s;
    /* Make the element visible */
    visibility: visible; 
}

/* Go from 0% to 100% opacity (see-through) and specify the percentage from when to slide in the element along the Y-axis */
@keyframes slide {
    0% {
        opacity: 0;
        -webkit-transform: translateY(70%);
    } 
    100% {
        opacity: 1;
        -webkit-transform: translateY(0%);
    } 
}
@-webkit-keyframes slide {
    0% {
        opacity: 0;
        -webkit-transform: translateY(70%);
    } 
    100% {
        opacity: 1;
        -webkit-transform: translateY(0%);
    }
}
hr{
    padding: 0px;
  }

.Column { position: relative; margin: .5em; }

.left, .right {  padding: 1.25em; }

.left { margin-bottom: .5em; }


/* MEDIA QUERIES */
@media screen and (min-width: 47.5em ) {
  .left { margin-right: 40em; }

	.right { position: absolute; top: 0; right: 0; width: 55em; }   
} 

.gallery-grid {
	clear: both;
  background: orange;
  display: block;
  float: left;
  width: 100%;
  padding: 8px;
}
.gallery-grid.columns {
	margin-right: 0;
}
.one-third {
  box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.3);
  width: -ms-calc(33.3333% - 16px);
  width: -moz-calc(33.3333% - 16px);
  width: -webkit-calc(33.3333% - 16px);
  width: calc(33.3333% - 16px);
  margin: 8px;
  height: auto;
  position: relative;
  float: left;
}
.one-third:last-of-type {
  margin-right: 0;
}
.gallery-grid img {
  width: 100%;
  height: auto;
  position: relative;
  float: left;
}
.gallery-grid a {
  display: block;
}
.screen {
	background-color: rgba(0,0,0,0.5);
	left: 0;
	top: 0;
	border-radius: 0;
	height: 100%;
	width: 100%;
	position: absolute;
	opacity: 0;
	z-index: 1000;
  -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
          transition: all 0.3s ease-in-out;
}
.screen:hover {
  opacity: 1
}
.title {
  color: #fff;
  font-family: arial, helvetica, sans-serif;
  font-weight: bold;
  -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
      -o-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
          transition: all 0.3s ease-in-out;
  margin-left: -30px;
}
.screen:hover .title {
  margin-left: 0;
}

.screen.fade-in .title {
  margin-left: 0;
}
.screen.fade-in:hover {
}
.cta {
	clear: both;
	font-weight: bold;
	font-family: arial,helvetica, sans-serif;
	display: block;
	font-size: 2em;
}

.slideanim {visibility:hidden;}
.slide {
    /* The name of the animation */
    animation-name: slide;
    -webkit-animation-name: slide; 
    /* The duration of the animation */
    animation-duration: 1s; 
    -webkit-animation-duration: 1s;
    /* Make the element visible */
    visibility: visible; 
}