/* CSS Document */

/**************************************************************************************************************/
/* reset */
/**************************************************************************************************************/
html, body {
	width:100%;
	height:100%;
	overflow-x: hidden;
	overflow-y: auto;
	
	position:relative;
}
body {
	font-family:'font_2';
	background-color:rgba(255,255,255,1.00);

	-webkit-user-select: none;
	-moz-user-select: -moz-none;
	-ms-user-select: none;
	user-select: none;
}
html, body, p, ul, li, a, img, h1, h2, h3, h4, h5, form {
	padding:0;
	margin:0;
}
ul {
	list-style:none;
}
a {
	color:rgba(0,0,0,0.50);
	text-decoration:none;
	outline:none;
	
	transition:all 0.4s ease;
	-webkit-transition: all 0.4s ease;		/*safari and chrome */
	-moz-transition: all 0.4s ease;			/* firefox */
	-o-transition: all 0.4s ease;			/* opera */
	-ms-transition: all 0.4s ease;			/* internet explorer */
}
table, table tr, table tr td {
	margin:0;
	padding:0;
	vertical-align:middle;
}
button {
    background:none;
    border:none;
	border-radius:0;
    padding:0;
    margin:0;
}

/**************************************************************************************************************/
/* animations*/
/**************************************************************************************************************/
@keyframes animateLeftRight {
	0% { background-position: 0 50%; }
	50% { background-position: 100% 50%; }
	100% { background-position: 0 50%; }
}
@keyframes animateTopBotom {
	0% { background-position: 50% 0; }
	50% { background-position: 50% 100%; }
	100% { background-position: 50% 0; }
}

/**************************************************************************************************************/
/* general */
/**************************************************************************************************************/
#page {
	min-height:100vh;
	
	transition:all 0.4s ease;
	-webkit-transition: all 0.4s ease;		/*safari and chrome */
	-moz-transition: all 0.4s ease;			/* firefox */
	-o-transition: all 0.4s ease;			/* opera */
	-ms-transition: all 0.4s ease;			/* internet explorer */
}
/**************************************************************************************************************/
/* header */
/**************************************************************************************************************/
#header {
	width:100%;
	height:40px;
	background-color:rgba(255,255,255,1.00);
	position:fixed;
	overflow:hidden;
	z-index:1000;
	display:none;

	transition:all 0.4s ease;
	-webkit-transition: all 0.4s ease;		/*safari and chrome */
	-moz-transition: all 0.4s ease;			/* firefox */
	-o-transition: all 0.4s ease;			/* opera */
	-ms-transition: all 0.4s ease;			/* internet explorer */
}
#navDesk {
	right:10px;
	z-index:2000;
	position:absolute;
}
#subMenuBg {
	width:100%;
	height:0;
	margin-top:40px;
	position:absolute;
	background-color:rgba(0,0,0,0.70);
	box-shadow:inset 0 10px 10px -10px rgba(0,0,0,1.00), inset 0 -10px 10px -10px rgba(0,0,0,1.00);

	transition:all 0.4s ease;
	-webkit-transition: all 0.4s ease;		/*safari and chrome */
	-moz-transition: all 0.4s ease;			/* firefox */
	-o-transition: all 0.4s ease;			/* opera */
	-ms-transition: all 0.4s ease;			/* internet explorer */
}
#section {
	padding:0 25px;
	text-align:center;
	color:rgba(255,126,0,1.00);
}
#subSection {
	padding:0 8px;
	text-align:center;
}
#subSection .menuDeskButton {
	color:rgba(255,255,255,1.00);
}
#subSection .menuDeskButton:hover {
	color:rgba(255,126,0,1.00);
}

.menuDeskButton {
	width:100%;
	height:100%;
	
	transition:all 0.4s ease;
	-webkit-transition: all 0.4s ease;		/*safari and chrome */
	-moz-transition: all 0.4s ease;			/* firefox */
	-o-transition: all 0.4s ease;			/* opera */
	-ms-transition: all 0.4s ease;			/* internet explorer */
}
.menuDeskButton:hover {
	color:rgba(255,126,0,1.00);
}
.noLinkBtn {
	cursor:default;
}
.noLinkBtn:hover {
	color:rgba(0,0,0,1.00);
}

#loginName {
	width:150px;
	padding:0 8px;
	text-align:right;
	vertical-align:top;
	line-height:40px;
}
#setingsBtn {
	vertical-align:top;
}

#navMob {
	position:fixed;
	height:calc(100% - 40px);
	padding-top:40px;
	width:250px;
	left:-250px;
	background-color:rgba(0,0,0,0.70);
	box-shadow:inset -20px 0 20px -20px rgba(0,0,0,1.00);
	z-index:100;
	
	transition:all 0.4s ease;
	-webkit-transition: all 0.4s ease;		/*safari and chrome */
	-moz-transition: all 0.4s ease;			/* firefox */
	-o-transition: all 0.4s ease;			/* opera */
	-ms-transition: all 0.4s ease;			/* internet explorer */
}
#mobMenuBtn {
	position:fixed;
	left:10px;
	top:10px;
	height:20px;
	width:30px;
	cursor:pointer;
	z-index:5000;
	
	transition:all 0.4s ease;
	-webkit-transition: all 0.4s ease;		/*safari and chrome */
	-moz-transition: all 0.4s ease;			/* firefox */
	-o-transition: all 0.4s ease;			/* opera */
	-ms-transition: all 0.4s ease;			/* internet explorer */
}
.width {
	transform: translateX(250px)  !important;
}
.bar {
	transform: translateX(250px)  !important;
	
	
}
#bar1, #bar2, #bar3 {
	width:100%;
	height:2px;
	background-color:rgba(0,0,0,1.00);
	position:absolute;
	
	transition:all 0.4s ease;
	-webkit-transition: all 0.4s ease;		/*safari and chrome */
	-moz-transition: all 0.4s ease;			/* firefox */
	-o-transition: all 0.4s ease;			/* opera */
	-ms-transition: all 0.4s ease;			/* internet explorer */
}
#bar1 {
	top:0;
}
#bar2 {
	top:calc(50% - 1px);
}
#bar3 {
	bottom:0;
}
.changebar1 {
	transform:rotate(-45deg) translate(-6.5px, 6.5px) !important;
}
.changebar2 {
	display:none !important;
}
.changebar3 {
	transform:rotate(45deg) translate(-6.5px, -6.5px) !important;
}
/*.scroll {
	position:fixed !important;
	overflow:hidden !important;
}*/
/**************************************************************************************************************/
/* buttons */
/**************************************************************************************************************/
.settings {
	width:24px;
	height:24px;
	background-image:url('../images/icons/settings.png');
	background-size:contain !important;
	background-position:50% 50%;
	background-repeat:no-repeat;
	margin:8px 0 8px 8px;
	opacity:0.50;
	filter: alpha(50);
	
	transition:all 0.4s ease;
	-webkit-transition: all 0.4s ease;		/*safari and chrome */
	-moz-transition: all 0.4s ease;			/* firefox */
	-o-transition: all 0.4s ease;			/* opera */
	-ms-transition: all 0.4s ease;			/* internet explorer */
}
.settings:hover {
	opacity:1.00;
	filter: alpha(100);
}
/**************************************************************************************************************/
/* footer */
/**************************************************************************************************************/
#footer {
	position:fixed;
	bottom:0;
	z-index:100000;
	width:100%;
	background-color:rgba(255,255,255,1.00);
	text-align:center;
	height:40px;
	line-height:40px;

	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	
	transition:all 0.4s ease;
	-webkit-transition: all 0.4s ease;		/*safari and chrome */
	-moz-transition: all 0.4s ease;			/* firefox */
	-o-transition: all 0.4s ease;			/* opera */
	-ms-transition: all 0.4s ease;			/* internet explorer */
}
/**************************************************************************************************************/
/* index */
/**************************************************************************************************************/
#intro {
	position:fixed;
	width:100%;
	height:100%;
	background-color:rgba(255,255,255,1.00);
	z-index:100000;

	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}
#kaligraphy {
	width:calc(100% - 5%);
	padding-right:5%;
	text-align:right;
	position:absolute;
	height:60%;
	box-shadow:inset 0 10px 10px -10px rgba(0,0,0,1.00), inset 0 -10px 10px -10px rgba(0,0,0,1.00);
	background-color:rgba(0,0,0,1.00);
	overflow:hidden;
	background-size:cover !important;
	background-position:0 0;
	background-repeat:no-repeat;
	background-color:rgba(0,0,0,1.00);
	
	transition:all 2s ease;
	-webkit-transition: all 2s ease;		/*safari and chrome */
	-moz-transition: all 2ss ease;			/* firefox */
	-o-transition: all 2ss ease;			/* opera */
	-ms-transition: all 2ss ease;			/* internet explorer */
}
.background {
	background-image:url('../images/background.jpg');
}
#kaligraphy img {
	height:58%;
	width:auto !important;
}
#club1 {
	width:100%;
	text-align:center;
	position:absolute;
	z-index:20000;
	font-size:3vh;
	top:10%;

	opacity:0.00;
	
	filter:alpha(opacity=0);
	-webkit-filter:alpha(opacity=0);
	-moz-filter:alpha(opacity=0);
	-o-filter:alpha(opacity=0);
	-ms-filter:alpha(opacity=0);
	
	transition:all 1s ease;
	-webkit-transition: all 1s ease;		/*safari and chrome */
	-moz-transition: all 1s ease;			/* firefox */
	-o-transition: all 1s ease;			/* opera */
	-ms-transition: all 1s ease;			/* internet explorer */
}
#enter {
	text-align:left;
	position:absolute;
	color:rgba(255,255,255,1.00);
	background-color:rgba(0,0,0,0.50);
	width:90%;
	z-index:20000;
	padding:10px 5% 10px 5%;
	bottom:0;
	text-shadow:0 0 1px rgba(0,0,0,1.00);
/*	font-size:4vh;
	cursor:pointer;

	opacity:0.00;
	
	filter:alpha(opacity=0);
	-webkit-filter:alpha(opacity=0);
	-moz-filter:alpha(opacity=0);
	-o-filter:alpha(opacity=0);
	-ms-filter:alpha(opacity=0);
	
	transition:all 1s ease;
	-webkit-transition: all 1s ease;		/*safari and chrome */
/*	-moz-transition: all 1s ease;			/* firefox */
/*	-o-transition: all 1s ease;			/* opera */
/*	-ms-transition: all 1s ease;			/* internet explorer */
}
/*#enter:hover {
	color:rgba(0,0,0,1.00);
	text-shadow:0 10px 5px  rgba(0,0,0,0.50);
}*/
#enter a {
	color: rgba(255,150,0,1.00);
}
#enter a:focus {
	border:none;
}
#enter a:hover {
color: rgba(255,150,0,1.00);
}
#logo {
	position:absolute;
	top:10px;
	right:10px;
	z-index:10000;
}
#logo img {
	height:5vh;
	width:auto;
}
#logo td {
	padding-left:2vh;
}
#mainSwiper {
	width:100%;
	height:100%;
}

#slideImg {
}
img {
}

.imageHeight {
	object-fit:cover;
}



/**************************************************************************************************************/
/**************************************************************************************************************/
/**************************************************************************************************************/
/* Mobile Layout: 480px and below. */
/**************************************************************************************************************/
#navDesk {
	display:none;
}
#subMenuBg {
	display:none;
}
.slide1 {
	animation: animateLeftRight 20s linear infinite;
	-webkit-animation: animateLeftRight 20s linear infinite;	/*safari and chrome */
	-moz-animation: animateLeftRight 20s linear infinite;		/* firefox */
	-o-animation: animateLeftRight 20s linear infinite;			/* opera */
	-ms-animation: animateLeftRight 20s linear infinite;		/* internet explorer */
}
#mobMenuBtn {
	display:block;
}

/**************************************************************************************************************/
/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
/**************************************************************************************************************/
@media only screen and (min-width: 481px) {
#navDesk {
	display:none;
}
#subMenuBg {
	display:none;
}
.slide1 {
	animation: animateLeftRight 20s linear infinite;
	-webkit-animation: animateLeftRight 20s linear infinite;	/*safari and chrome */
	-moz-animation: animateLeftRight 20s linear infinite;		/* firefox */
	-o-animation: animateLeftRight 20s linear infinite;			/* opera */
	-ms-animation: animateLeftRight 20s linear infinite;		/* internet explorer */
}
#mobMenuBtn {
	display:block;
}
}

/**************************************************************************************************************/
/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */
/**************************************************************************************************************/
@media only screen and (min-width: 769px) {
#header:hover {
	height:130px;
}
#header:hover #subMenuBg {
	height:90px;
}
#navDesk {
	display:block;
}
#subMenuBg {
	display:block;
}
.slide1 {
	animation: animateTopBotom 20s linear infinite;
	-webkit-animation: animateTopBotom 20s linear infinite;	/*safari and chrome */
	-moz-animation: animateTopBotom 20s linear infinite;		/* firefox */
	-o-animation: animateTopBotom 20s linear infinite;			/* opera */
	-ms-animation: animateTopBotom 20s linear infinite;		/* internet explorer */
}
#mobMenuBtn {
	display:none;
}
}
/**************************************************************************************************************/
.border {
	border-top:1px solid rgba(0,0,0,1.00) !important;
}
.show {
	opacity:1.00 !important;
	
	filter:alpha(opacity=100) !important;
	-webkit-filter:alpha(opacity=100) !important;
	-moz-filter:alpha(opacity=0100 !important;
	-o-filter:alpha(opacity=100) !important;
	-ms-filter:alpha(opacity=100) !important;
}