@charset "utf-8";

/* CSS Document */



/*play-hover*/

.video-play-button {

	position: relative;

	display: block;

	width: 100%;

	height: 60px;

	float: none;

	border: 6px solid #ffffff;

	border-radius: 50%;

	margin: 0 auto 10px;

}

.video-play-button:after {

	-webkit-transform: translateX(-50%) translateY(-50%);

	transform: translateX(-50%) translateY(-50%);

	display: block;

	width: 76px;

	height: 76px;

	background: rgba(162,144,97,0.60);

	border-radius: 50%;

	-webkit-animation: pulse-border 1500ms ease-out infinite;

	animation: pulse-border 1500ms ease-out infinite;

}

.video-play-button:before {

	-webkit-transform: translateX(-50%) translateY(-50%);

	transform: translateX(-50%) translateY(-50%);

	display: block;

	width: 60px;

	height: 60px;

	background: rgba(162,144,97,0.60);

	border-radius: 50%;

	-webkit-animation: pulse-border 1500ms ease-out infinite;

	animation: pulse-border 1500ms ease-out infinite;

}

.video-play-button:after, .video-play-button:before {

	content: "";

	position: absolute;

	z-index: 0;

	left: 50%;

	top: 50%;

	z-index: -9;

}

.video-play-button span {

	display: block;

	position: relative;

	z-index: 3;

	width: 0;

	height: 0;

	border-left: 20px solid #ffffff;

	border-top: 12px solid transparent;

	border-bottom: 12px solid transparent;

	margin: 12px 18px;

}



.testi-wrapp .video-play-button {

	position: relative;

	display: block;

	width: 44px;

	height: 44px;

	float: none;

	border: 2px solid #fff;

	border-radius: 50%;

	margin: 0 auto 0;

}

.testi-wrapp .video-play-button:after {

	-webkit-transform: translateX(-50%) translateY(-50%);

	transform: translateX(-50%) translateY(-50%);

	display: block;

	width: 54px;

	height: 54px;

	background: rgba(255,255,255,0.60);

	border-radius: 50%;

	-webkit-animation: pulse-border 1500ms ease-out infinite;

	animation: pulse-border 1500ms ease-out infinite;

}

.testi-wrapp .video-play-button:before {

	-webkit-transform: translateX(-50%) translateY(-50%);

	transform: translateX(-50%) translateY(-50%);

	display: block;

	width: 40px;

	height: 40px;

	background: rgba(255,255,255,0.60);

	border-radius: 50%;

	-webkit-animation: pulse-border 1500ms ease-out infinite;

	animation: pulse-border 1500ms ease-out infinite;

}

.testi-wrapp .video-play-button:after, .video-play-button:before {

	content: "";

	position: absolute;

	z-index: 0;

	left: 50%;

	top: 50%;

	z-index: -9;

}

.testi-wrapp .video-play-button span {

	display: block;

	position: relative;

	z-index: 3;

	width: 0;

	height: 0;

	border-left: 13px solid #fff;

	border-top: 13px solid transparent;

	border-bottom: 13px solid transparent;

	margin: 8px 16px;

}



 @-webkit-keyframes pulse-border {

 0% {

 -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);

 transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);

 opacity: 1;

}

 100% {

 -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);

 transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);

 opacity: 0;

}

}

 @keyframes pulse-border {

 0% {

 -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);

 transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);

 opacity: 1;

}

 100% {

 -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);

 transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);

 opacity: 0;

}

}

/*bounce-effect1*/

.bounce {

	width: 100%;

	float: none;

	-moz-animation: bounce 4s infinite;

	-webkit-animation: bounce 4s infinite;

	animation: bounce 4s infinite; 

	display: inline-block;

	margin: 0 auto 0;

}

/* Square-effect */

.square-effect1 {

  background: #000;

  background: -moz-linear-gradient(-45deg, #000000 0%, #000000 25%, #69582c 50%, #8b794a 75%, #a29c8e 100%);

  background: -webkit-linear-gradient(-45deg, #000000 0%, #000000 25%, #69582c 50%, #8b794a 75%, #a29c8e 100%);

  background: linear-gradient(135deg, #000000 0%, #000000 25%, #69582c 50%, #3b331e 100%);

  /*background: linear-gradient(135deg, #000000 0%, #000000 25%, #69582c 50%, #8b794a 75%, #a29c8e 100%);*/

  background-size: 400% 400%;

  background-repeat: no-repeat;

  display: flex;

  position: relative;

  cursor: pointer;

  transition: .5s all;

}

.square-effect1 img {

	transition:transform 0.8s ease-in-out 0s;

}

.square-effect1 .square-img {

  width: 100%; 

  float: left;

  overflow: hidden;

  position: relative;

  mix-blend-mode: screen;

}

.square-effect1:hover .square-img img {

	transform:scale(1.08);

	transition:all 1.5s ease 0s;

}

.square-effect1:hover {

  background-position: 100% 100%;

}



/* circle-hover1 */

.circle-hover1 {

	cursor: pointer;

	position: relative;

}

.circle-hover1 .circle-img {

	width: 100%;

	height: 100%;



	position: absolute;

	z-index: 10;

	bottom: -40px;

	right: 0;

	opacity: 0;

	visibility: hidden;

	-webkit-transition-duration: 300ms;

	-o-transition-duration: 300ms;

	transition-duration: 300ms;

}

.circle-hover1:hover .circle-img {

	opacity: 1;

	visibility: visible;

	bottom: 0;

	right: 0;

}

.circle-hover1:hover .circle-img img {

	transform: none;

	transition: none;

}

/*map-color*/

.map-color {

	-webkit-filter: grayscale(100%);

	-moz-filter: grayscale(100%);

	-ms-filter: grayscale(100%);

	-o-filter: grayscale(100%);

	filter: grayscale(100%);

}



.circle-hover1 .circle-img, .circle-hover1 .circle-img:active{ -webkit-border-radius: 50%; -moz-border-radius:  50%; border-radius:  50%   ;}

.circle-hover1 .circle-img img, .circle-hover1 .circle-img img:active { -webkit-border-radius: 50%; -moz-border-radius:  50%; border-radius:  50%   ;}





/*effect-css*/
.hovereffect {
  width: 360px;
  height: 100%;
  float: left;
  overflow: hidden;
  position: relative;
  text-align: center;
  cursor: pointer;
  background:#a29062;
}

.hovereffect .overlay1 {
  position: absolute;
  overflow: hidden;
  width: 80%;
  left: 10%;
  bottom: 1%;
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: scale(0,1);
  -ms-transform: scale(0,1);
  transform: scale(0,1);
}

.hovereffect:hover .overlay1 {
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}

.hovereffect img {
  display: block;
  position: relative;
  -webkit-transition: all 0.35s;
  transition: all 0.35s;
}

.hovereffect:hover img {
	mix-blend-mode: multiply;
}

.hovereffect h3 {
  text-align: center;
  position: relative;
  font-size: 20px;
  background-color: transparent;
  color: #FFF;
  padding: 1em 0;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(0,-100%,0);
  transform: translate3d(0,-100%,0);
}

.hovereffect a, .hovereffect p {
  color: #FFF;
  padding: 1em 0;
  opacity: 0;
  filter: alpha(opacity=0);
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(0,100%,0);
  transform: translate3d(0,100%,0);
}

.hovereffect:hover a, .hovereffect:hover p, .hovereffect:hover h3 {
  opacity: 1;
  filter: alpha(opacity=100);
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}


/*Smartphone css*/

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



}



@media screen and (min-width:481px) and (max-width:600px) {



}



@media screen and (min-width:601px) and (max-width:767px) {



}



@media screen and (min-width:768px) and (max-width:900px) {



}



@media screen and (min-width:901px) and (max-width:1024px) {



}



@media screen and (min-width:1025px) and (max-width:1240px) {



}