*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
body{
	background-color: #f1f2f6;
}
.WelcomeTxt{
	font-weight: bold;
	font-size: 15px;
	color: crimson;
}
.NameTxt{
	font-weight: bold;
	font-size: 20px;
	color: indigo;
}
.VideoSection{
		display: none;
	}
	.vd1{
		width: 100%;
		height: 70vh;
		object-fit: fill;
		border: 2px solid #000;
		margin: 5px;
		padding: 5px;
	}
/* .....................................navbar */
.navbar-brand{
	width: 170px;
	height: 70px;
	padding: 0px;
	margin: 0px;
}
/* navbar */
.full-screen-menu{
	padding: 0px;
	margin: 7px;
	cursor: pointer;
}
/* menu */
.overlay {
  height: 0%;
  width: 100%;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
  overflow-y: hidden;
  transition: 0.5s;
}

.overlay-content {
  position: relative;
  top: 25%;
  width: 100%;
  text-align: center;
  margin-top: 30px;
}

.overlay a {
  padding: 8px;
  text-decoration: none;
  font-size: 36px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.overlay a:hover, .overlay a:focus {
  color: #f1f1f1;
}

.overlay .closebtn {
  position: absolute;
  top: 13px;
  right: 45px;
  font-size: 20px;
}

@media screen and (max-height: 450px) {
  .overlay {overflow-y: auto;}
  .overlay a {font-size: 20px}
  .overlay .closebtn {
  font-size: 40px;
  top: 15px;
  right: 35px;
  }
}/* menu */

/* menu Topics */
.Topics a{
	width: 100%;
	color: gray;
	font-size: 60px;
	position: relative;
	display: flex;
	float: left;
}
/* menu Topics */
/* menu Sites */
.Sites a{
	position: relative;
	display: flex;
	float: right;
	width: 100%;
	color: yellow;
	font-size: 20px;
}
/* menu Sites */
.menu-head1{
	color: gray;
	position: relative;
  	top: 25%;
  	width: 100%;
}
.span-hr1{
	width: 60px;
	height: 3px;
	background-color: gray;
	position: absolute;
  	top: 24%;
  	left: 70px;
}

.menu-head2{
	color: gray;
	position: relative;
  	top: 25%;
  	width: 100%;
}
.span-hr2{
	width: 60px;
	height: 3px;
	background-color: gray;
	position: absolute;
  	top: 24%;
  	left: 60px;
}/* menu Sites */

/* .......................................navbar */


/* .......................................video-one */

/* .video-one{
	width: 100%;
  	height: 300px;
	object-fit: fill;
	border: 2px solid;
	box-sizing: border-box;
	padding: 0px!important;
	margin: 0px!important;
} */
#header {
  width: 95vw;
 /*  height: 50vh; */
  box-sizing: border-box;
  position: relative;
  left: 0px!important;
}
.video-one{
/*   margin: 30px; */
  width: 100%;
  height: 50vh;
  object-fit: fill;
/*  padding: 5px;*/
}

/* ......................................video-one */
.img-overlay{
	position: absolute;
	top: 230px;
	left: 100px;
}
.t-name{
	color: #000;
	border-left: 10px solid yellow;
  	height: 70px;
}
.t-name1{
	color: #fff;
	border-left: 10px solid yellow;
  	height: 70px;
}
.t-txt{
	padding: 30px;
	font-size: 60px;
}/* ......................................video-one */

/* .......................................second-nav */
.sec-nav{
/* 	text-align: center; */
	margin-top: 5px;
	margin-bottom: 10px;

}
.second-nav a{
	display: inline;
	padding: 10px;
	font-size: 15px;
	color: #000;
	font-weight: bold;

	
}/* .......................................second-nav */
.card-img-top{
	width: 100%;
	height: 44vh;
}
.img-overlay-txt{
	position: absolute;
	top: 50%;
	width: 100%;
}
.main-head{
	font-weight: bold;
	font-size: 30px;
	width: 100%;
}
.t-head{
	font-size: 20px;
}
.readbtn{
		color: #fff;
}
.readbtn:hover{
	text-decoration: none;
	border: none;
	color:#000;
	letter-spacing: 3px;
	transition: ease-out 1.5s;
}

.card-img{
	width: 100%;
	height: 400px;
}
/* ........................................... */
.c-tag{
	position: absolute;
	top: 20%;
}

.side-img-txt{
	color: #fff;
	font-size: 40px;
	text-align: center;
	font-weight: bold;
}
.yellowbtn{
	position: absolute;
	top: 70%;
	left: 30%;
	padding: 10px;
	color: #000;
	letter-spacing: 3px;
	font-weight: bold;
	background-color: yellow;
}
.yellowbtn:hover{
	transition: ease-out 1.5s;
	text-decoration: none;
	color: #fff;
	background-color:#000;
	border: 1px solid #fff;
}
/* ................cards section............................. */
.cd-img{
	width: 100%;
	height: 250px;
}
.ctitle{
	font-size: 15px;
	letter-spacing:3px;

}
.ctitle:hover{
	color:#818181;
	cursor: pointer;
}
.cpara{
	color: #000;
	font-size: 20px;
	font-weight: bold;
}
.cbtn{
color: #000;
font-weight: bold;
}
.cbtn:hover{
	color: red;
	letter-spacing: 3px;
	transition: ease-in-out 1.5s;
	text-decoration: none;
}
.sctitle:hover{
	text-decoration: none;
}
/* ................cards section............................. */

/* ..............................container-1....................... */

/*...............................section-3......................... */

.pet-stories{
	text-align: center;
	padding: 15px;
}
/* vanilla-carousel*/
.vanilla-carousel{
	background-color: #000;
	color: #fff;
}/* vanilla-carousel */

/*...............................section-3......................... */
		 
	 /* BACK TO TOP */
	 #scroll {
		position:fixed;
		right:10px;
		bottom:10px;
		cursor:pointer;
		width:50px;
		height:50px;
		z-index: 999;
		background-color:#3498db;
		text-indent:-9999px;
		display:none;
		-webkit-border-radius:60px;
		-moz-border-radius:60px;
		border-radius:60px
	}
	#scroll span {
		position:absolute;
		top:50%;
		left:50%;
		margin-left:-8px;
		margin-top:-12px;
		height:0;
		width:0;
		border:8px solid transparent;
		border-bottom-color:#ffffff;
	}
	#scroll:hover {
		background-color:#e74c3c;
		opacity:1;filter:"alpha(opacity=100)";
		-ms-filter:"alpha(opacity=100)";
	}
/*...............................section-4......................... */
.pug-anchortag a{
text-decoration: none;
color: #fff;
}

.pug-img{
	width: 60%;
	height: 250px;
}
.pug-overlay{
	background-color: #000;
	width: 41.5%;
	position: absolute;
	left: 428px;
}
.pug-title{
font-size: 15px;
font-weight: bold;

}
.pug-txt{
font-size: 25px;
font-weight: bold;

}
.pug-btn{
	color: #fff;
}
.pug-btn:hover{
	color: yellow;
}
/* .pug-img{
	width: 200px;
} */



/*...............................slick slider......................... */

.center-img{
	width: 300px;
	height: 200px;
}







/* ..............................container-1....................... */


/* ...................FOOTER-1............................ */
.footer1-img{
	background-image: url("../img/whale.jpg");
	background-repeat: no-repeat;
	background-size: 100% 100%;
	height: 50vh;
}
.footer2-img{
	background-image: url("../img/TURTLEEE.jpg");
	background-repeat: no-repeat;
	background-size: 100% 100%;
	
	height: 50vh;
}

/* .............Footer-section..................... */
.footer-section{
	background-color: #000;
	width: 100%;
	height: 60%;
}
.f-margin{
	position: relative;
	top:30px;
	/* margin-top: 20px; */
}
.foot-h{
	color: #D7373A;
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 20px;
}
.a-txt a{
	color: #fff;
	padding: 5px;
	/* margin: 5px; */
	position: relative;
	display: block;
	font-size: 13px;

	/* text-decoration: none; */

}
.last-img{
	width: 7vw;
	padding: 5px;
}
.last-line span{
	color: #fff;
	padding: 5px;
}
/* .............Footer-section..................... */
.cardtt {
	font-weight: bold;
	font-size: 30px;
	letter-spacing: 5px;
	color: #1C0808;
	background-color: rgba(200,70,72,0.6);
	width: 180px;
}

.cardtt-1 {
	color: #fff;
	font-size: 20px;
	font-weight: bold;
}

.over-txt {
	position: absolute;
	top: 50%;
	padding: 10px;
}

.ft-txt-1 {
	font-size: 30px;
	text-align: center;
	
}

.ft-img-txt-1{
	position: relative;
	top: 20%;
}

.ft-txt {
	font-size: 50px;
	padding: 10px;
	text-align: center;
	color: aqua;
}

.ft-input-box {
	width: 85%;
	padding: 10px;
	}

.small-img {
	width: 50%;
}
.ft-btn{
	padding: 10px;
	border: none;
	background-color: aqua;
	color: 000;
	font-weight: bold;
}
.ft-last-p{
	color: antiquewhite;
	font-size:20px;
	padding: 10px;
	text-align: center;
	
		
}
.cc-txt {
	font-size: 50px;
	text-align: center;
	padding: 10px;
}

/* .................. */
.f-txt{
	font-size: 45px;
	text-align: center;
	padding: 10px;
	color: #e74c3c;
	font-weight: bold;
}
.fp-txt{
	font-size: 20px;
	text-align: center;
	padding: 10px;
	color: #e74c3c;
	font-weight: bold;
}
.finput-box{
	width: 85%;
	padding: 10px;
}
.fbtn{
	padding: 10px;
	border: none;
	background-color: aqua;
	color: #000;
	font-weight: bold;
}

.flast-p{
	font-size: 15px;
	text-align: center;
	font-weight: bold;
	padding: 5px;
	color: gold;
}
/* load more div */
.myloadmore-div {
			/* background-color: #f6f6f6; */
			width:100%;
			/* margin: 20px auto; */
			/* font: normal 13px/100% sans-serif; */
			/* color: #444; */
		} 
		.myloadmore-div {
			
			display:none;
			padding: 10px;
			/* border-width: 0 1px 1px 0; */
			/* border-style: solid;
			border-color: #fff; */
			/* box-shadow: 0 1px 1px #ccc; */
			margin-bottom: 5px;
			/* background-color: #f1f1f1; */
		}
		/* .totop {
			position: fixed;
			bottom: 10px;
			right: 20px;
		}
		.totop a {
			display: none;
		}
		a, a:visited {
			color: #33739E;
			text-decoration: none;
			display: block;
			margin: 10px 0;
		}
		a:hover {
			text-decoration: none;
		} */
		#loadMoree {
			padding: 10px;
			width: 20%;
			text-align: center;
			background-color: #33739E;
			color: #fff;
			border-width: 0 1px 1px 0;
			border-style: solid;
			border-color: #fff;
			box-shadow: 0 1px 1px #ccc;
			transition: all 600ms ease-in-out;
			-webkit-transition: all 600ms ease-in-out;
			-moz-transition: all 600ms ease-in-out;
			-o-transition: all 600ms ease-in-out;
		}
		#loadMoree:hover {
			background-color: #fff;
			color: #33739E;
		}
/* load more div */
/* .jssor */
.jssor-MainHeading{
	text-align: center;
	font-size: 50px;
	color: #e74c3c;
	font-weight: bold;
	padding: 30px;
}
.jssor-hr{
	width: 7%;
	height: 3px;
	margin-left: auto;
	margin-right: auto;
	background-color: yellow;
	padding: 3px;
	border: none;
}
.jssor-SubHeading{
	text-align: center;
	font-size: 30px;
	color: #3498db;
	font-weight: bold;
	padding: 10px;
}
.full-cont{
	background-color: #000;

}

  /*jssor slider loading skin spin css*/

        .jssorl-009-spin img {
            animation-name: jssorl-009-spin;
            animation-duration: 1.6s;
            animation-iteration-count: infinite;
            animation-timing-function: linear;
        }

        @keyframes jssorl-009-spin {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }

        /*jssor slider bullet skin 057 css*/
        .jssorb057 .i {position:absolute;cursor:pointer;}
        .jssorb057 .i .b {fill:none;stroke:#fff;stroke-width:2000;stroke-miterlimit:10;stroke-opacity:0.4;}
        .jssorb057 .i:hover .b {stroke-opacity:.7;}
        .jssorb057 .iav .b {stroke-opacity: 1;}
        .jssorb057 .i.idn {opacity:.3;}

        /*jssor slider arrow skin 073 css*/
        .jssora073 {display:block;position:absolute;cursor:pointer;}
        .jssora073 .a {fill:#ddd;fill-opacity:.7;stroke:#000;stroke-width:160;stroke-miterlimit:10;stroke-opacity:.7;}
        .jssora073:hover {opacity:.8;}
        .jssora073.jssora073dn {opacity:.4;}
		.jssora073.jssora073ds {opacity:.3;pointer-events:none;}

		
		/* ................................ 3d caro */
		.color-black{
			background-color: #000;
			
			
		}
		.pet-s{
			font-size: 50px;
			font-weight: bold;
			color: #000;
			text-align: center;
			text-transform: uppercase;
			padding: 10px;
		}
		
		.left1,.right1{
			background-color: royalblue;
			padding: 10px;
			cursor: pointer;
	}
	
		.left1:hover{
			background-color:tomato;
		}
		.right1:hover{
			background-color:tomato;
		}

	/* ................................................. */
	#cube-container {
		width: 240px;
		height: 240px;
		margin: 80px auto;
		perspective: 800px;			
	}
	
	#cube-container:before {
		content: '';
	  position: absolute; 
		top: 90px;
		left: 0;
		width: 100%; 
		height: 100%;	
		box-shadow: 0 0 75px 20px rgba(0, 0, 0, 0.1), inset 0 0 350px 350px rgba(0, 0, 0, 0.1);	
		transform: rotateX(95deg) translateZ(-80px) scale(1);	
		animation: rotateShadow 16s infinite;	
	}
	
	.cube {	
		height: 100%;
		width: 100%;
		position: relative;
		transform-style: preserve-3d;			
		transition: all 0.8s ease-in-out;		
		animation: rotate 16s infinite;	
	}
	
	.cube img {
		position: absolute;
		width: 240px;
		height: 240px;		
		backface-visibility: hidden;		
	}
	
	.cube img:nth-child(1) {
		transform: rotateY(0deg) translateZ(120px);
	}
	.cube img:nth-child(2) {
		transform: rotateY(90deg) translateZ(120px);
	}
	.cube img:nth-child(3) {
		transform: rotateY(-90deg) translateZ(120px);
	}
	.cube img:nth-child(4) {
		transform: rotateY(180deg) translateZ(120px);
	}
	
	@keyframes rotate {
		0% { transform: rotateY(0deg); }		
		25% { transform: rotateY(90deg); }		
		50% { transform: rotateY(180deg);}	
		75% {  transform: rotateY(270deg); }	
		100% { transform: rotateY(360deg); }
	}
	
	@keyframes rotateShadow {
		0% { transform:  rotateX(95deg) translateZ(-80px) scale(1) rotateZ(360deg); }		
		25% { transform:  rotateX(95deg) translateZ(-80px) scale(1) rotateZ(270deg); }		
		50% { transform:  rotateX(95deg) translateZ(-80px) scale(1) rotateZ(180deg);}	
		75% {  transform: rotateX(95deg) translateZ(-80px) scale(1)  rotateZ(90deg); }	
		100% { transform: rotateX(95deg) translateZ(-80px) scale(1)  rotateZ(0deg); }
	}
	
/* 
<!-- ............V I D E O S........................... -->

<!-- ...............G  A L L A R Y ................ --> */

.card {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  transition: transform 200ms ease-in-out;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.card:hover {
  box-shadow: rgba(2, 8, 20, 0.1) 0px 0.35em 1.175em,
    rgba(2, 8, 20, 0.08) 0px 0.175em 0.5em;
  transform: translateY(-3px) scale(1.1);
}

@media screen and (min-width: 600px) {
  .card-tall {
    grid-row: span 2 / auto;
  }

  .card-wide {
    grid-column: span 2 / auto;
  }

	.Gimg{
	transition: transform 200ms ease-in-out;
  	width: 100%;
  	height: 500px;
  	margin: 10px;
  	padding: 5px;
 }

 .Gimg:hover {
  box-shadow: rgba(2, 8, 20, 0.1) 0px 0.35em 1.175em,
    rgba(2, 8, 20, 0.08) 0px 0.175em 0.5em;
  transform: translateY(-3px) scale(1.1);
}
    .Gimg1{
  	width: 100%;
  	height: 245px;
  	margin: 5px;
  	padding: 5px;
 }
  .Gimg1:hover {
  box-shadow: rgba(2, 8, 20, 0.1) 0px 0.35em 1.175em,
    rgba(2, 8, 20, 0.08) 0px 0.175em 0.5em;
  transform: translateY(-3px) scale(1.1);
}
.AnimalGallery{
	display: none;
}
}