@import url(http://fonts.googleapis.com/css?family=roboto);
@import url(https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css);

@font-face {
	font-family: 'icomoon';
	src:url('../fonts/icomoon/icomoon.eot');
	src:url('../fonts/icomoon/icomoon.eot?#iefix') format('embedded-opentype'),
		url('../fonts/icomoon/icomoon.woff') format('woff'),
		url('../fonts/icomoon/icomoon.ttf') format('truetype'),
		url('../fonts/icomoon/icomoon.svg#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

body {
  background: #212121;
  font-size: 22px;
  line-height: 32px;
  color: #ffffff;
  margin: 0;
  padding: 0;
  word-wrap: break-word !important;
  font-family: 'roboto', sans-serif;
}

h1 {
  font-size: 60px;
  text-align: center;
  color: #FFF;
}

h3 {
  font-size: 30px;
  line-height: 34px;
  color: #FFF;
}

h3 a { color: #FFF; }

a { color: #FFF; }

h1 {
  margin-top: 100px;
  text-align: center;
  font-size: 60px;
  line-height: 70px;
  font-family: 'roboto', sans-serif;
}

#container {
  margin: 0 auto;
  max-width: 890px;
}

p { text-align:left; }
 .toggle, [id^=drop] {
 display: none;
}

nav {
  margin: 0;
  padding: 0;
  background-color:#17A589;
}


nav:after {
  content: "";
  display: table;
  clear: both;
}

nav ul {
  float:left;
  margin: 0;
  list-style: none;
  position: relative;
}

nav ul li {
  margin: 0px;
  display: inline-block;
  float: left;
  background-color: #17A589;
  padding-top:1%;
  padding-bottom:1%;
  
}

.menu a:hover{
    text-decoration:none;
    color:#0B5345;
}

nav li a {
  display: block;
  padding: 0 20px;
  color: #FFF;
  font-size: 16px;
  line-height: 20px;
  text-decoration: none;
}
nav li:hover { background-color: #2ECC71;color:#0B5345;z-index:999999;  }
nav ul li ul li:hover { background: #2ECC71;color:#0B5345;z-index:999999; }
nav ul li ul li a{
    padding-top:1%;
    padding-bottom:1%;


}
.active{
  background-color: #2ECC71;  
}

.active a{
 color:#0B5345;
}


nav ul ul {
  display: none;
  position: absolute;
  top: 41px;
  z-index:999999; 
  width:150px;
}

nav ul li:hover > ul { display: inherit;z-index:999999;  }

nav ul ul li {
  width: 300px;
  float: none;
  display: list-item;
  position: relative;
  padding-top:1%;
  padding-bottom:1%;
}

nav ul ul ul li {
  position: relative;
  top: -60px;
  left: 170px;
  z-index:999999; 
    padding-top:1%;
  padding-bottom:1%;
}

li > a:after { content: ' '; }

li > a:only-child:after { content: ''; }

.mobilemenu{

    display:none;
}

.desktopmenu{

    display:block;
}

/* Media Queries
--------------------------------------------- */

@media all and (max-width : 768px) {

.mobilemenu{

    display:block;
}

.desktopmenu{

    display:none;
}

#logo {
  display: block;
  padding: 0;
  width: 100%;
  text-align: center;
  float: none;
}

nav { margin: 0; }

.toggle + a,
 .menu { display: none; }

.toggle {
  display: block;
  background-color: #254441;
  padding: 0 20px;
  color: #FFF;
  font-size: 20px;
  line-height: 60px;
  text-decoration: none;
  border: none;
}

.toggle:hover { background-color: #000000; }

[id^=drop]:checked + ul { display: block; }

nav ul li {
  display: block;
  width: 100%;
}

nav ul ul .toggle,
 nav ul ul a { padding: 0 40px; }

nav ul ul ul a { padding: 0 80px; }

nav a:hover,
 nav ul ul ul a { background-color: #000000; }

nav ul li ul li .toggle,
 nav ul ul a { background-color: #212121; }

nav ul ul {
  float: none;
  position: static;
  color: #ffffff;
}

nav ul ul li:hover > ul,
nav ul li:hover > ul { display: none; }

nav ul ul li {
  display: block;
  width: 100%;
}

nav ul ul ul li { position: static;

}
}

@media all and (max-width : 330px) {

nav ul li {
  display: block;
  width: 94%;
}

.mobilemenu{

    display:block;
}

.desktopmenu{

    display:none;
}

}



		a {
			color: #09f;
		}
		a:hover {
			text-decoration: none;
		}
		#back_to_camera {
			background: rgba(255,255,255,.9);
			clear: both;
			display: block;
			height: 40px;
			line-height: 40px;
			padding: 20px;
			position: relative;
			z-index: -1;
		}
		.fluid_container {
			bottom: 0;
			height: 400px;
			left: 0;
			position:relative;
			right: 0;
			top:0;
            
			z-index: 0;
		}
		#camera_wrap_4 {
			bottom: 0;
			height: 400px;
			left: 0;
			margin-bottom: 0!important;
			position:relative ;
			right: 0;
			top: 0;

		}
		.camera_bar {
			z-index: 2;
		}
		.camera_thumbs {
			margin-top: -100px;
			position: relative;
			z-index: 1;
		}
		.camera_thumbs_cont {
			border-radius: 0;
			-moz-border-radius: 0;
			-webkit-border-radius: 0;
		}
		.camera_overlayer {
			opacity: .1;
		}


        .productlist{
            height:400px;
            background-color:rgba(255, 255, 255, 0.15);

            

        }

        .bu1{
            padding-top:5%;
            margin-left:5%;


        }

        button{
            margin-left:2%;

        }


        .singleproduct {

            border:1px solid #fff;
            align-content:center;
           padding-bottom:2%;

        }

        .singleproduct:hover{
          
            border:1px solid #000;
        }

        .singleproduct p{
            text-align:center;
            padding-top:4%;

        }

.singleproduct:hover button{

    background-color:darkgreen;
    color:#fff;

}





.heading span.wthree-line {
    position: absolute;
    background: #ffb500;
    height: 3px;
	margin-left:3%;
    width: 65px;
    margin-top:3.5%;
    top:75.5%; 
}
span.wthree-left {
	left: 40%;
}
span.wthree-right {
    left: 49%;
}
i.fa.fa-ellipsis-h {
    position: absolute;
    left: 49.4%;
    top: ;
       margin-top:3.5%;
    font-size: 2em;
	color:#046d32;
} 



h3.agileits-title {
    color: #046d32;
    text-transform: uppercase;
    font-weight: 600;	
    font-size: 40px; 
    font-family: 'Signika', sans-serif; 
    padding-bottom: 10px;
}
.agile-title {
    position: absolute;
}
.text-center {
	text-align: center;
}

.catlist p{

    text-align:left;
    padding-left:20%;

}

.footer{
background-color:#212F3D;
padding-bottom:3%;


}

.footer li{

    padding-top:1%;
    padding-bottom:1%;
  
}

.footer a{
    color:#fff;

}

.footer h4{
        color:#fff;
}

.footer a:hover{
    color:MediumSeaGreen;

}

.footer .button {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
}


#vertical-ticker{
	height:400px;
	overflow:hidden;
	margin:0; padding:0;
	-webkit-box-shadow:0 1px 3px rgba(0,0,0, .4);
    cursor:pointer;
}

	#vertical-ticker li{
		padding:15px 20px;
		display:block;
		background:#efefef;
		color:#333;
		border-bottom:1px solid #85e085;
		font-family: Helvetica Neue, times, serif;
	}

    #vertical-ticker h4{
       color:darkcyan;

   } 


   #vertical-ticker li:hover{color:#fff;
  background-color:darkcyan;
   }
   
   #vertical-ticker li:hover h4{
       color:#fff;

   }
   
   #vertical-ticker2{
	height:400px;
	overflow:hidden;
	margin:0; padding:0;
	-webkit-box-shadow:0 1px 3px rgba(0,0,0, .4);
}

	#vertical-ticker2 li{
		padding:15px 20px;
		display:block;
		background:#efefef;
		color:#333;
		border-bottom:1px solid #85e085;
		font-family: Helvetica Neue, times, serif;
	}

    #vertical-ticker2 h4{
       color:darkcyan;

   } 


   #vertical-ticker2 li:hover{color:#fff;
  background-color:darkcyan;
   }
   
   #vertical-ticker2 li:hover h4{
       color:#fff;

   } 
   
   
   
   
   
   
   
    


   .snip1268 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative;
  float:inherit;
  overflow: hidden;
  padding-left:5%;
 padding-right:5%;

  width:200px;
  color: #333333;
  text-align: center;
  background-color: #ffffff;
}

   productlist li{
         padding-left: 5%;
         padding-right:5%;
    border: solid 1px #fff;


   }



.snip1268::after {
  border-radius: 5px;
  position: absolute;
  z-index:999999;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  opacity: 0;
 
}

.productlist.snip1268:hover {
  -webkit-transform: scale(1.0, 1.0);
  transform: scale(1.0, 1.0);
}


.snip1268:hover::after {
    opacity: 1;
}


.productlist .snip1268:hover{
     border: solid 1px #CCC;
    -moz-box-shadow: 1px 1px 5px #fff;
    -webkit-box-shadow: 1px 1px 5px #fff;
        box-shadow: 1px 1px 5px #fff;
             
         
}

.snip1268 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;
}



.snip1268 .image {
  position: relative;
}
.snip1268 img {
  max-width: 100%;
  align-content:center;
  -webkit-transition: opacity 0.35s;
  transition: opacity 0.35s;
}



.snip1268 .icons,
.snip1268 .add-to-cart {
  position: absolute;
  left: 20px;
  right: 20px;
  opacity: 0;
}
.snip1268 .icons {
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
  top: 20px;
  display: flex;
  justify-content: space-between;
}
.snip1268 .icons a {
  width: 32.5%;
  background: #ffffff;
}
.snip1268 .icons a:hover {
  background: #000000;
}
.snip1268 .icons a:hover i {
  color: #ffffff;
  opacity: 1;
}
.snip1268 .icons i {
  line-height: 46px;
  font-size: 20px;
  color: #000000;
  text-align: center;
  opacity: 0.7;
  margin: 0;
}
.snip1268 .add-to-cart {
  position: absolute;
  bottom: 20px;
  -webkit-transform: translateY(100%);
  transform: translateY(100%);
  font-size: 1em;
  color: #fff;
  margin-left:4%;
  line-height: 46px;
  letter-spacing: 1.5px;
  background-color: #239B56;
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
}
.snip1268 .add-to-cart2 {
  position: absolute;
  bottom: 20px;
  -webkit-transform: translateY(0);
  transform: translateY(0);
  font-size: 0.8em;
  color: #fff;
  margin-left:4%;
  line-height: 46px;
  letter-spacing: 1.5px;
  background-color: #239B56;
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
}



.snip1268 .add-to-cart:hover {
  color: #ffffff;
}
.snip1268 figcaption {
  padding: 20px 20px 30px;
}
.snip1268 h4,
.snip1268 p {
  margin: 0;
  text-align: center;
  padding-left:10%;
}
.snip1268 h4 {
  margin-bottom: 10px;
  font-weight: 700;
}
.snip1268 p {
  margin-bottom: 15px;
  font-size: 0.85em;
  font-weight: 500;
  padding-left:15%;
}
.snip1268 .price {
  font-size: 1.3em;
  opacity: 0.5;
  font-weight: 700;
  text-align: center;
  padding-left:10%;
}
.snip1268:hover img,
.snip1268.hover img {
  opacity: 0.8;
}
.snip1268:hover .icons,
.snip1268.hover .icons,
.snip1268:hover .add-to-cart,
.snip1268.hover .add-to-cart {
  -webkit-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
}

.content {
  position: relative;
  margin: auto;
  overflow: hidden;
}

.content .content-overlay {
  background: rgba(0,0,0,0.7);
  position: absolute;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  opacity: 0;
  -webkit-transition: all 0.4s ease-in-out 0s;
  -moz-transition: all 0.4s ease-in-out 0s;
  transition: all 0.4s ease-in-out 0s;
}

.content:hover .content-overlay{
  opacity: 1;
}

.content-image{
  width: 100%;
}

.content-details {
  position: absolute;
  text-align: center;
  width: 100%;
  top: 50%;
  left: 50%;
  opacity: 0;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}

.content:hover .content-details{
  top: 50%;
  left: 50%;
  opacity: 1;
}

.content-details h3{
  color: #fff;
  font-weight: 500;
  letter-spacing: 0.15em;
  margin-bottom: 0.5em;
  text-transform: uppercase;
}

.content-details p{
  color: #fff;
  font-size: 0.8em;
}

.fadeIn-bottom{
  top: 80%;
}

.fadeIn-top{
  top: 20%;
}

.fadeIn-left{
  left: 20%;
}

.fadeIn-right{
  left: 80%;
}



.catname p a{
text-decoration:none;
color:#fff;
font-size:16px;

}

.catname p a:hover{
    color:#0B5345  ;

}

.btn-3 {
    background: #fcad26;
    color: #fff;
    padding: 25px 80px;
}
.btn-3:hover {
	background: #f29e0d;
}

.btn-3:active {
	background: #f58500;
	top: 2px;
}

.btn-3:before {
	position: absolute;
	height: 100%;
	left: 0;
	top: 0;
	line-height: 3;
	font-size: 140%;
	width: 60px;
}

.btn-3a {
	padding: 25px 60px 25px 120px;
}

.btn-3a:before {
	background: rgba(0,0,0,0.05);
}

.icon-cart:before {
	content: "\e007";
}

.join{

position:absolute;
	z-index:-999999;
}

.join1 h3{
padding-top:5%;	
color:#fff;	
padding-left:5%;
font-size:2.8em;

}

.join1{
	background-color:rgba(0, 153, 51,0.7);
	background-size:300px;
	height:300px;
	margin-top:-1.4%;
	z-index:9999999;
}

.join1 .button {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
	float:right;
	margin-right:10%;
 text-transform: uppercase;
}

.join2 h3{
padding-top:5%;	
color:#fff;	
padding-left:5%;
font-size:2.5em;

}

.join2{
	background-color:rgba(0, 153, 51,0.7);
	background-size:300px;
	height:300px;
	margin-top:-5.2%;
	z-index:9999999;
}

.join2 .button {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 14px;
	float:right;
    margin-top:8%;
	margin-right:10%;
 text-transform: uppercase;
}




.btn:after {
	content: '';
	position: absolute;
	z-index: -1;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

/* Pseudo elements for icons */
.btn:before,
.icon-heart:after,
.icon-star:after,
.icon-plus:after,
.icon-file:before {
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	position: relative;
	-webkit-font-smoothing: antialiased;
}

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #7DCEA0  ;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 0px;
}

.sidenav a {
    padding: 8px 8px 8px 20px;
    text-decoration: none;
    font-size: 16px;
    color: #818181;
    display: block;
    transition: 0.3s;
    color:#fff;
}

.sidenav .dropdown a{
     text-decoration: none;
}

.caret{
margin-top:-15%;

}


.sidenav a:hover {
    color: #f1f1f1;
}



.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
    margin-top:-4%;
    color:#fff;
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}


}
@media screen and (max-width: 640px){
    
    .mobilemenu{

    display:block; 
}

.desktopmenu{
    display:none;

}  
       
}

* {margin: 0; padding: 0;}
body {
    font-family: arial;
}
#accordianmenu {
    color:#fff;
    cursor:pointer;
    font-size: 16px;
    margin-left:-2.5%;
    
}
#accordianmenu p {
	padding-top:8px;
}
#accordianmenu p:hover {
    
}
#accordianmenu li {
	list-style-type: none;
}

#accordianmenu ul ul li {
	list-style-type: none;
     margin-left:-20%;
}


#accordianmenu ul ul li a {
	color: white;
	text-decoration: none;
	font-size: 14px;
	line-height: 20px;
	display: block;
    padding-left:35%;

   
}
#accordianmenu ul ul li:hover {
	background-color:#0B5345;
	color:white;
}
#accordianmenu ul ul {
	display: none;
}
#accordianmenu li.active ul {
	display: none;
}

.carousel-control.left, .carousel-control.right {
	background-image:none;
    margin-top:25%;
}

.carousel-control.left:hover{
    background-color:#117A65;
    color:#fff;

}

.carousel-control.right:hover{
    background-color:#117A65;
    color:#fff;

}

.img-responsive{
	width:100%;
	height:auto;
}

@media (min-width: 992px ) {
	.carousel-inner .active.left {
		left: -25%;
	}
	.carousel-inner .next {
		left:  25%;
	}
	.carousel-inner .prev {
		left: -25%;
	}
}

@media (min-width: 768px) and (max-width: 991px ) {
	.carousel-inner .active.left {
		left: -33.3%;
	}
	.carousel-inner .next {
		left:  33.3%;
	}
	.carousel-inner .prev {
		left: -33.3%;
	}
	.active > div:first-child {
		display:block;
	}
	.active > div:first-child + div {
		display:block;
	}
	.active > div:last-child {
		display:none;
	}
}

@media (max-width: 767px) {
	.carousel-inner .active.left {
		left: -100%;
	}
	.carousel-inner .next {
		left:  100%;
	}
	.carousel-inner .prev {
		left: -100%;
	}
	.active > div {
		display:none;
	}
	.active > div:first-child {
		display:block;
	}
}