body, html {
  height: 100%;
  margin: 0;
  font: 400 15px/1.8 "Lato", sans-serif;
  color: #92a0a0;
}
a, a:hover, a:visited {
	color: #92a0a0; 
}
.container {
	display: block;
	max-width: 2000px;
	margin: 0 auto;
	padding: 0 0;
	
}
.flex-center {
  display: flex;
  justify-content: center;
}
.social-obd{
	padding: 1%;
}


.bgimg-1, .bgimg-2, .bgimg-3, .bgimg-4, .bgimg-5, .testimonial-background {
  position: relative;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}



.bgimg-1 {
  background-image: url("../images/img_parallax4.jpg");
  min-height: 100%;
}

.bgimg-2 {
  background-image: url("../images/img_parallax1.jpg");
  min-height: 400px;
}

.bgimg-4 {
  background-image: url("../images/img_parallax3.jpg");
  min-height: 1000px;
}

.bgimg-5 {
  background-image: url("../images/img_parallax5.jpg");
  min-height: 100%;
}


/* Turn off parallax scrolling for tablets and phones */

@media only screen and (max-device-width: 1024px) {
    .bgimg-1, .bgimg-2, .bgimg-3 .bgimg-4 .bgimg-5{
        background-attachment: scroll;
    }
}

@media only screen and (max-device-width: 900px) {
	.bgimg-2, .bgimg-4 {display: none;}
}




/* testimonials */

.testimonial-background{	
	background-image: url("../images/portfolio/portfolio-3.jpg");
	opacity: 0.74;
}
#testimonials {	
	margin: 0 10%;
}
.testimonial-background h2 {
	font-size: 2em;
	color: #ffffff;
	opacity: 1;
	
}
.testimonial-container {
	background-color: rgba(127,125,125,0.38);  
	width: 50%; 
	margin:auto; 
	text-align: center;
}
@media only screen and (max-width: 900px) {
	.testimonial-container{
		width: 90%;
	}
}
.testimonial-quotes{
	color: #ffffff;
	margin: 10%;
	z-index: 30000;
	opacity: 1;
}


	 
/*  testimonial ENDS **
**   captions on parallax photos here */

.caption {
  position: absolute;
  left: 0;
  top: 37%;
  width: 100%;
  text-align: center;
  color: #000;
}
.caption-footer {
  position: absolute;
  left: 0;
  top: 55%;
  width: 100%;
  text-align: center;
  color: #f2eeeb;
}
.caption-thankyou {
  position: absolute;
  left: 0;
  top: 70%;
  width: 100%;
  text-align: center;
  color: #000;
}

/* Main image arrow down */
i {
  border: solid #f2eeeb;
	border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 7px;
}
.arrow-down {
	position: absolute;
	top: 90%;
	left:50%;
    -webkit-transform: rotate(45deg);
	transform: rotate(45deg);	
}


.caption span.border {
  background-color: transparent;
  color: #fff;
  padding: 18px;
  font-size: 25px;
  letter-spacing: 10px;
}

.caption-thankyou span.border {
  background-color: transparent;
  color: #fff;
  padding: 18px;
  font: 1.5em "Lato", sans-serif;

}

.caption span.copyright {
  background-color: transparent;
  color: #f2eeeb;
  padding: 18px;
  font-size: 1em;
}
.caption span.copyright a, a:hover, a:visited{
	color:#f2eeeb;
}

h1 {
  letter-spacing: 5px;
  text-transform: uppercase;
  font: 3em "Lato", sans-serif;
  color: #92a0a0;
}
h2 {
	font: 2em "Lato", sans-serif;
	color: #92a0a0;
}
h3 {
  letter-spacing: 1px;
  font: 20px "Lato", sans-serif;
  color: #92a0a0;
}

.about-image {
	float: left;
	width: 50%;
	Padding: 0;
	margin: 0 0;
}
.about-image img {
	width: 100%;
}
.about-text {
	float: left;
	width: 48%;
	Padding: 1% 1% 0 1%;
	margin:  0;
}

.contact-text {
	float: left;
	width: 38%;
	Padding: 3% 1% 0 4%;
	margin:  0;
}
.contact-image {
	float: right;
	width: 50%;
	Padding: 0;
	margin: 0 0;
}
.contact-image img {
	width: 100%;
}
.contact-stamp {
	float: right;
	margin: 0 1% 0 2%;
}
.contact-message {
	margin: 0 0 0 8%;
	font-size: 1.25em;
	
}

@media only screen and (max-width: 900px) {
	.contact-message{
		margin: 0 0 0 6%;
		font-size: 1.1em;
	}
}

/* about us media */



@media only screen and (max-width: 900px) {
     .about-text, .contact-text {
        float: none;
		width: 90%;
		margin: 3% auto;
		padding: 4% 1%;
    }
	.about-image, .contact-image{
		float: none;
		display:block;
		width:100%;
		margin: 0 auto 0 auto;
		padding:0 0 0 0;
	}
}


/*  NAVIGATION   ****  NAVIGATION  ****  */

nav
{
	display: flex;
	justify-content: center;
	width:100%;
	background-color: rgba(202,202,202,0.35);
	padding: 1%;
	margin: 0 auto;
	position: fixed;
	top: 0;
	z-index: 1;
}

@media only screen and (min-width: 901px){
		nav{
		padding: 40px 40px 0 0;	
		}
	}

nav ul
{
padding: 0;
float: right;
list-style-type: none;
margin: 0 20px 0 0;
position: relative;
margin-bottom: 5px;
}
nav ul li
{
float: left;
padding: 0  10px 0 10px;
margin: 0;
line-height: 1em;
font-size: 1.2em;
	letter-spacing: 1.2px;
}
nav ul li a
{
	font: "Lato", sans-serif;
color: #f2eeeb;
float: right;
	text-shadow: 1px 1px 5px #888888;
}
nav ul li a:hover, a:visited{color: #f3f3f3;}

@media only screen and (max-width: 900px){
	nav {display: block; padding:0; margin:10px 0 0 0;width:160px;background:#f2eeeb; float: right; color: #92a0a0;} 
	nav ul{padding:10px;margin:0;width:100%;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
	nav ul li{width:100%;padding:5px 0}
	nav ul li a:visited {color: #92a0a0;text-shadow: 0px 0px 0px #888888;}
	nav ul li a {color: #92a0a0;text-shadow: 0px 0px 0px #888888;}
	nav ul li a:hover {color: #92a0a0;text-shadow: 0px 0px 0px #888888;}
	}



/*  Slimmenu css 

/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}

/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000;}
#colorbox{}
    #cboxContent{margin-top:20px;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{}
        #cboxTitle{position:absolute; top:-20px; left:0; color:#ccc;}
        #cboxCurrent{position:absolute; top:-20px; right:0px; color:#ccc;}
        #cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;}
        #cboxPrevious{position:absolute; top:50%; left:0px; margin-top:-32px; background:url(/images/controls.png) no-repeat top left; width:28px; height:65px; text-indent:-9999px;}
        #cboxPrevious.hover{background-position:bottom left;}
        #cboxNext{position:absolute; top:50%; right:0px; margin-top:-32px; background:url(/images/controls.png) no-repeat top right; width:28px; height:65px; text-indent:-9999px;}
        #cboxNext.hover{background-position:bottom right;}
        #cboxLoadingOverlay{}
        #cboxLoadingGraphic{background:url(/images/loading.gif) no-repeat center center;}
        #cboxClose{position:absolute; top:0px; right:8px; display:block; background:url(/images/controls.png) no-repeat top center; width:38px; height:19px; text-indent:-9999px;}
        #cboxClose.hover{background-position:bottom center;}
.menu-collapser
{position:relative; width:100%; height:38px; padding:0 8px; color:#92a0a0; font-size:14px; font-family:"Lato", sans-serif; font-weight:700; line-height:38px;  background-color: rgba(255,255,255,0.00);box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}
.collapse-button{position:absolute;right:8px;top:50%;width:40px;padding:7px 10px;color:#f5f5f5;font-size:14px;text-align:center;background-color: #92a0a0 ;border-radius:2px;cursor:pointer;transform:translate(0, -50%);-o-transform:translate(0, -50%);-ms-transform:translate(0, -50%);-moz-transform:translate(0, -50%);-webkit-transform:translate(0, -50%);box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}
.collapse-button:hover,
.collapse-button:focus{color:#FFF;background-color:#92a0a0}
.collapse-button .icon-bar{display:block;height:2px;width:18px;margin:2px 0;background-color:rgba(243,243,243,1.00);border-radius:1px}
ul.slimmenu{width:100%;margin:0;padding:0;list-style-type:none}
ul.slimmenu:before,ul.slimmenu:after{content:'';display:table}
ul.slimmenu:after{clear:both}ul.slimmenu.collapsed li{display:block;width:100%;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}
ul.slimmenu.collapsed li>ul{position:static;display:none}
ul.slimmenu.collapsed li a{display:block;border-bottom:1px solid rgba(0,0,0,0.075);box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}
ul.slimmenu.collapsed li .sub-toggle{height:40px}
ul.slimmenu li{position:relative;float:left;display:inline-block;background-color:#AAA}
ul.slimmenu li ul{margin:0;list-style-type:none}ul.slimmenu li ul li{background:#bbbbbb}
ul.slimmenu li>ul{position:absolute;left:0;top:100%;z-index:999;display:none;width:100%}
ul.slimmenu li>ul>li ul{position:absolute;left:100%;top:0;z-index:999;display:none;width:100%}
ul.slimmenu li a{display:block;padding:12px 64px 12px 16px;color:#333;font-size:16px;font-weight:400;transition:background-color 0.5s ease-out;-o-transition:background-color 0.5s ease-out;-moz-transition:background-color 0.5s ease-out;-webkit-transition:background-color 0.5s ease-out}
ul.slimmenu li a:hover{text-decoration:none;background-color:#999}
ul.slimmenu li .sub-toggle{background:none repeat scroll 0 0 rgba(0,0,0,0.075);position:absolute;right:0;top:0;z-index:999;width:48px;height:100%;text-align:center;cursor:pointer}
ul.slimmenu li .sub-toggle:before{content:'';display:inline-block;height:100%;margin-right:-0.25em;vertical-align:middle}
ul.slimmenu li .sub-toggle>i{display:inline-block;color:#333;font-size:18px;vertical-align:middle}
ul.slimmenu>li{border-left:1px solid #999}
ul.slimmenu>li:first-child,ul.slimmenu>li.has-submenu+li{border-left:0}




/*  portfolio  */
.portfolio-gallery {

  margin: 0 auto;	
  padding: 0;
}

/*flex  was developed for gallery but not used *****

.flexcontainer {
	max-width: 1400px;
	  margin: 0 auto;
    display: flex;
	flex-flow: row wrap;
   justify-content: center;
  }

.flexitem{
	flex:0 1 auto;
}
.flexitem img {
  display: block;
}
.flexitem {
  margin: 0;
}


@media screen and (min-width: 1000px) {
	
  .flexitem {
     max-width: calc(100% / 3);
  }
}

@media screen and (max-width: 999px) {
  .flexitem {
    max-width: calc(100% / 2);
  }
}

@media screen and (max-width: 599px) {
	.flexitem {
		max-width: 100%;
	}}
*/


/* portfolio Gallery slider */


.row > .column {
  padding: 0 0;
}

.row:after {
  content: "";
  display: table;
  clear: both;
}

.column {
  float: left;
  width: calc(100% / 3);
}
.column img {
	display: block;}

@media screen and (max-width: 999px) {
  .flexitem {
    width: calc(100% / 2);
  }
}

@media screen and (max-width: 599px) {
	.column {
		width: 100%;
	}}


/* The Modal (background) */
.modal {
  display: none;
  position: fixed;
  z-index: 1;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: black;
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: transparent;
  margin: auto;
  padding: 0;
  width: 90%;
  max-width: 1200px;
}

/* The Close Button */
.close {
  color: white;
  position: absolute;
  top: 10px;
  right: 25px;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

.mySlides {
  display: none;
}

.cursor {
  cursor: pointer
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: rgba(0, 0, 0, 0.8);
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

img {
  margin-bottom: -4px;
}

.caption-container {
  text-align: center;
  background-color: black;
  padding: 2px 16px;
  color: white;
}

img.hover-shadow {
  transition: 0.3s
}

.hover-shadow:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}

/* portfolio ends */




/*totop */
#toTop {
	display:none;
	text-decoration:none;
	position:fixed;
	bottom:10px;
	right:10px;
	overflow:hidden;
	width:51px;
	height:51px;
	border:none;
	text-indent:100%;
	background:url(../images/ui.totop.png) no-repeat left top;
}

#toTopHover {
	background:url(../images/ui.totop.png) no-repeat left -51px;
	width:51px;
	height:51px;
	display:block;
	overflow:hidden;
	float:left;
	opacity: 0;
	-moz-opacity: 0;
	filter:alpha(opacity=0);
}

#toTop:active, #toTop:focus {
	outline:none;
}


/* Form */

.contact-form{	
	margin:4% auto;
	width: 90%;
	padding: 5% 1%;
	background-color: #f2eeeb;
}
.title {
	width: 150px;
}

.theme_btn{
	margin: 1% auto;
	text-align: center;
	background-color: #92a0a0;
	color: #f2eeeb;
	width: 70% ;
	padding:1.5%;
}
.theme_btn:hover{
	background: #838080;
}

input, textarea{
	padding: 2%;
	margin: 1% 0;
	font: lato;
	font-size: 1em;
}
em {
	font-style: italic;
	font-size: 0.85em;
}



/* roll over graphics */
.social-roll-over a{
	display:block;
	width:30px;
	height:30px;
	background: url(../images/facebook-social-roll-over.png) no-repeat top left;
	z-index:5000;
}
.social-roll-over a:hover, .social-roll-over a:active {
	background-position: bottom left;
}

.social-roll-over-instagram a{
	display:block;
	width:30px;
	height:30px;
	background: url(../images/instagram-social-roll-over.png) no-repeat top left;
	z-index:5000;
}
.social-roll-over-instagram a:hover, .social-roll-over a:active {
	background-position: bottom left;
}


.social-roll-over-footer a{
	display:block;
	width:30px;
	height:30px;
	background: url(../images/facebook-social-roll-over-footer.png) no-repeat top left;
	z-index:5000;
}
.social-roll-over-footer a:hover, .social-roll-over a:active {
	background-position: bottom left;
}

.social-roll-over-instagram-footer a{
	display:block;
	width:30px;
	height:30px;
	background: url(../images/instagram-social-roll-over-footer.png) no-repeat top left;
	z-index:5000;
}
.social-roll-over-instagram-footer a:hover, .social-roll-over a:active {
	background-position: bottom left;
}


/*  *****  Footer  *****  */
.footer-links a, a:visited {
	color: #f2eeeb;

}
.footer-links a:hover {color: #92a0a0;}