@charset "utf-8";
/* CSS Document */


footer {
	background-color: #0c0c0c;
	transition: background-color 0.3s ease;
	width: 100%;
	min-height: 143px;
	margin-top: 0px;
	overscroll-behavior: none;
	}

 #pants {
	max-width: 100em;
	margin-right: auto;
	margin-left: auto;
	position: relative;
	top: 0px;
	}	

	.left-foot, .mid-foot, .right-foot {
	float: left;
	padding: 0px;
	width: 39%;
	position: relative;
	}

	.mid-foot {
	width: 12%;
	padding-left: 2%;
	}

#logo-shoe {
	padding: 50px 0 0 5%;
	position: relative;
	top: 0px;
	}
	#logo-shoe :hover{
	opacity: 0.9;
	transition-duration: 500ms;
	}

#go-up {
	width: 100%;
	}
	#go-up img {
	width: : 40px;
	height: auto;
	padding: 30px 0px 10px 0px;
	position: relative;
	left: 43%;
	transition-duration: 1000ms;
	}
	#go-up :hover {
	filter: drop-shadow(0px 0px 2px #111) brightness(110%) hue-rotate(30deg);
	transition-duration: 1500ms;
	}

.toes {
	float: right;
	padding: 50px 5% 0 0;
	}

	.toes li {
	display: inline-block;
	}

	.toes li a {
	display: inline-block;
	text-decoration: none;
	color: #ddd;
	padding-left: 10px;
	font-size: 15px;
	}

.toes-2 {
	float: right;
	padding: 55px 3% 0 0;
	}

	.toes-2 li {
	display: inline-block;
	}

	.toes-2 li a {
	display: inline-block;
	text-decoration: none;
	color: #ddd;
	padding-left: 20px;
	font-size: 25px;
	}	

	#pinky {
	padding-left: 30px;
	}
footer:hover {
	background-color: #280c28;
}

.orb {
  position: relative;
  z-index: auto;
  height: 3px;
  background: linear-gradient(141deg, #48ded4 0%, #a026bf 51%, #e82c75 75%);
}

.orb-1 {
  position: relative;
  z-index: auto;
  height: 1px;
  background: linear-gradient(141deg, #48ded4 0%, #a026bf 81%, #e82c75 95%);
}

.plate {
	width: 50px;
	height: 3px;
	background-color: #1cbdf0;
	background-color: #f61a8c;
	margin: 22px 0px;
}

/*----------------video hero--------------*/
.video-hero {
  position: relative;
  width: 100%;
  height: 100vh; /* full screen height */
  overflow: hidden;
}

.video-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: translate(-50%, -50%);
}

.video-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4); /* dark overlay for readability */
}

.video-content {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #fff;
  padding: 0 20px;
}

.video-content h1 {
  font-size: 4rem;
  letter-spacing: 0.1em;
  margin-bottom: 10px;
  animation: fadeUp 1s ease-out forwards;
}

.video-content p {
  font-size: 1.2rem;
  opacity: 0;
  animation: fadeUp 1.2s ease-out forwards;
  animation-delay: 0.3s;
}

/* simple text animation */
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ------------------- Contacts------------------------------- */

.ikigai {
	/* The image used */
	/*background-image: url("../images/ice-picture-2.jpg");*/
	background-image: url("../images/v6_header1.jpg");
	/* Set a specific height */
	min-height: 398px; 
	background-position: center -0px;

	/* Create parallax scrolling effect */
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-size: 1024px;
	background-color: #ccc;
	padding: 0px;
	margin: 0px;
	z-index: -10;
	}

 /* Personal remarks background*/
.ctulhu {
	margin: 20px 0px;
	background-color: #fbfbfb;
	padding: 10px 30px 25px 35px;
	}

/*	.last-call {
	border-radius: 0px 0px 30px 30px;
	border-style: dotted none none none;
	filter: drop-shadow(0px 2px 0px #eee);
	}

	.first-call {
	border-radius: 40px 40px 0px 0px;
	border-style: none none dotted none;
	filter: drop-shadow(0px 2px 0px #eee);
	}
*/
	.ctulhu h3{
	padding: 15px 0px;
	font-size: 20px;
	font-weight: 400;
	}

	.ctulhu p{
	font-size: 14px;
	}

@media (min-device-width: 993px) 
{

/* vision x- tablet only, y - desktop only, z - none	*/
.show-x {
	display: none;
	}
.ahow-y {
	display: initial;
	}	
.show-z {
	display: none;	
}
}
	

/*-----------------------collapsible button ------------------*/

.collapsible {
  background-color: #FFFFFF;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  outline: none;
	color: #4f4f4f;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
	letter-spacing: 0em;
	padding-bottom: 20px;	  
}

.active, .collapsible:hover {
  background-color: #f5f5f5;
}

.content {
  padding: 0 0px;
  display: none;
  overflow: hidden;
  background-color: #ffffff;
}
/*-----------------------END collapsible button ------------------*/


	.row-20{
	display: inline-block;
	margin: 0 auto 0 auto;
	}

	/* portfolio-thumbnails */
	.thumbs img, .thumbl img {
	filter: none;
	}
	.thumbs :hover, .thumbl :hover {
	filter: none;
	}


.thumbs, .thumbl {
	padding: 6px;
}

.thumbs img, .thumbl img{
	filter: none;
	transition-duration: 400ms;
	border-radius: 1%;		
	/*border-radius: 100% 0 100% 0;	*/
	transition-timing-function: ease-in;
	transition-delay: 100ms;
	}

	.thumbs:hover{
	filter: brightness(110%); 
	transition-duration: 400ms;
	border-radius: 0%;
	transition-delay: 00ms;
	transition-timing-function: ease-in-out;
	transition-delay: 100ms;
	}
	/* white images only */
	.thumbl:hover{
	/*filter: drop-shadow(0px -2px 15px #fff) brightness(102%); */	
	filter: brightness(102%); 
	transition-duration: 400ms;
	border-radius: 0 0 0px 0;	
	transition-timing-function: ease-in-out;
	transition-delay: 100ms;
	}


.ar img{
	width: 13px; height: 13px;
	/*display: inline; */
	display: none;
	margin: 14px 8px 0px 2px;
	}

	.ar img :hover{
	}

	.ar h3 {
	font-size: 18px;
	font-weight: 600;
	color: #333;
	padding: 0px 0 0 5px;
	margin: 8px 8px 0px 0px;
	}

	.ar h3::after {
	content: '';
	display: block;
	width: 30px;
	height: 2px;
	background-color: #1cbdf0;
	margin: 5px 0px 8px 0;
	}

.col {
	float: left;
	padding: 0px 0;
	}
	.col-lg {
	width: 33.3%;
	}
	.col-lg img {
	width: 100%;
	height: auto;
	display: block;
	}

/* x- tablet only, y - desktop only, z - none	*/
.col-x {
	display: none;
	}
.col-y {
	display: initial;
	}	
.col-z {
	display: none;	
	}	

/*----------------------------------------------Tablet View---------------------------------------------------*/
/*@media only handheld and (max-width: 768px) { */
 @media (max-device-width: 992px) 
/*@media (min-width: 581px) and (max-width: 768px)*/
{


/* x- tablet only, y - desktop only, z - none	*/
	.show-x {
	display: initial;	
	}

	.show-y {
	display: none;
	}


	.col-md {
	width: 50%;
	float: right;
	}


/* x- tablet only, y - desktop only, z - none	*/
	.col-x {
	display: initial;	
	}

	.col-y {
	display: none;
	}




}




/* ------------------------------------------------Mobile view--------------------------------------------*/
/* 480 recommended, 570 - min-browser wight @media (max-width: 570px) { */
@media (max-device-width: 480px)
{

.pad-10{
	padding-left: 10px;
}

/* x- tablet only, y - desktop only, z - none	*/
	.show-x {
	display: initial;	
	}

	.show-y {
	display: none;
	}

	.col-sm {
	width: 100%;
	}

	.col-x {
	display: none;	
	}

	.col {
	padding: 0%;
	}
	
	.ar, .details {
	padding-left: 10px;	
	}

}