@charset "utf-8";
/* CSS Document */
.bar-cont {
	position: fixed;
	width: 100%;
	height: 50px;
	top: 50px;
	left: 0px;
	color: white;
	z-index: 999999999;
	min-width: 1170px;
}
.tit-cont {
	position: fixed;
    width: 100%;
	min-width: 1170px;
    height: auto;
    /* background-color: #000000e3; */
    margin-top: 90px;
    left: 0px;
    color: white;
    text-align: center;
    display: table;
    vertical-align: middle;
    z-index: 999;
    /* border-style: solid; */
    /* border-width: 1px; */
    /* border-color: white;*/
}
.tit-contbr {
	position: absolute;
    width: 100%;
	min-width: 1170px;
    height: auto;
    /* background-color: #000000e3; */
    margin-top: 90px;
    left: 0px;
    color: white;
    text-align: center;
    display: table;
    vertical-align: middle;
    z-index: 999;
    /* border-style: solid; */
    /* border-width: 1px; */
    /* border-color: white;*/
}
.tit-bord {
	padding: 20px;
    box-sizing: border-box;
    border-style: solid;
    width: fit-content;
    margin: auto;
    text-align: center;
	display: table;
}
.tit-cont2 {
	position: relative;
	width: 100%;
	min-width: 1170px;
	height: 190px;
	background-color: #000000e3;
	left: 0px;
	color: white;
	text-align: center;
	display: table;
	vertical-align: middle;
}
.button-cont {
	max-width: 700px;
	margin: auto;
	height: 50px;
	width: 400px;
}
.button {
	    height: 23px;
    text-align: center;
    cursor: pointer;
    letter-spacing: 1px;
    font-size: 10.5px;
	font-weight: 700;
	transition: all 0.3s;
	display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}
.button {
  color: #FFF;
  transition: all 0.3s;
  position: relative;
}
.button span {
  transition: all 0.3s;
}
.button::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  transition: all 0.3s;
  border-top-width: 1px;
  border-bottom-width: 1px;
  border-top-style: solid;
  border-bottom-style: solid;
  border-top-color: rgba(255,255,255,0.5);
  border-bottom-color: rgba(255,255,255,0.5);
  transform: scale(0.1, 1);
}
.button:hover span {
  letter-spacing: 2px;
}
.button:hover::before {
  opacity: 1; 
  transform: scale(1, 1); 
}
.button::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  transition: all 0.3s;	
}
.button:hover::after {
  opacity: 0; 
  transform: scale(0.1, 1);
}
.button2 {
	height: 25px;
    text-align: center;
    cursor: pointer;
    letter-spacing: 1px;
    font-family: 'Garamond';
    font-size: 26px;
    font-weight: 400;    
	transition: all 0.3s;
	display: flex;
  flex-direction: column;
  flex-wrap: wrap;
    color: #9e9e9e;
}
.button2 {
  transition: all 0.3s;
  position: relative;
}
.button2 span {
  transition: all 0.3s;
}
.button2::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  transition: all 0.3s;
  border-top-width: 1px;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: rgba(255,255,255,0.3);
  transform: scale(0.1, 1);
}
.button2:hover span {
  letter-spacing: 2px;
}
.button2:hover::before {
  opacity: 1; 
  transform: scale(1, 1); 
}
.button2::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  transition: all 0.3s;	
}
.button2:hover::after {
  opacity: 0; 
  transform: scale(0.1, 1);
}
.logo {
	width: 200px;
    left: 30px;
    height: 30px;
    font-size: 20px;
    letter-spacing: 10px;
    font-weight: 100;
    position: absolute;
    top: -10px;
}
.mobilebar {
	left: 0px;
	top: 0px;
	position: fixed;
	width: 100%;
	height: 55px;
	background-color: black;
	display: none;
	z-index: 999999999;
	text-align: center;
	color: white !important;
}
.menubut {
	width: 50px;
	height: 50px;
	right: 0px;
	top: 0px;
	position: absolute;
	color: white !important;
}
.mbar-cont {
	display: none;
	    position: fixed;
    top: 50px;
    left: 0px;
    z-index: 99999999;
    background-color: #000000e6;
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
	
    margin-top: -100%;
	color: white !important;
}
.mbutton {
	height: 50px;
    text-align: center;
    width: 100%;
	color: white !important;
}
@media screen and (max-width: 1100px) {
	
	.tit-cont {
		min-width: 0px;
	}
	.bar-cont {
		display: none;
	}
	.mobilebar {
		display: inline-block;
	}
	.mbar-cont {
		display: block;
	}
	.logo {
		margin-top: 15px;
		font-size: 20px;
		width: 300px;
		top: 0px;
	}
}