/* Add your own custom css to this file. You may wish to use css !important calls to override css from the template css files.
----------------------------------------------------------- */

#s5_responsive_mobile_top_bar { display:none!important; }
#s5_responsive_mobile_sidebar { display:none!important; }
#s5_responsive_mobile_top_bar_spacer { display:none!important; }

@media screen and (max-width: 750px){  .s5_logo img {  width:80%!important;  } .s5_menu_overlay_text { display:none!important; }  }
@media screen and (max-width: 570px){  .s5_logo img {  width:60%!important;  } }


	.s5_wrap_fmfullwidth #s5_overlay_menu_open {
		margin-top:0px;}

#s5_overlay_menu_open {  margin-top:-6px; }

#s5_menu_wrap_top { Border-bottom:1px solid #D1D1D1; min-height:77px; }

@media screen and (max-width: 570px){ 
#s5_menu_overlay_inner_wrap {
	width:350px;
	padding-left:20px;
	padding-top:100px;}
}

#s5_center_area_inner, #s5_above_columns_inner {
    padding-bottom: 0px;
    padding-top: 30px;}


.footer-icons  { text-align:right; }
.footer-text { text-transform:uppercase; text-align:left; font-size:0.9em} 

@media screen and (max-width: 670px){ 
.footer-icons  { text-align:center; }
.footer-text { text-transform:uppercase; text-align:center; font-size: 0.8em} 
}

#s5_footer_area1 {
padding-left:20px; padding-right:50px;
margin-top: 13px;
border-top:1px solid #ECECEC;
min-height:77px;
padding-bottom:0px;
}

@media screen and (max-width: 750px){ 
#s5_footer_area1 {
padding-left:20px; padding-right:20px;
} }

#s5_footer_area2 {  padding-top:20px;	 }

	#s5_footer {
		text-align:center;
		font-size: 0.8em;
		color:#979797;
}


#s5_menu_overlay_inner_wrap { }

#s5_footer_area1 .yee-container-fluid {padding-bottom:0px!important; margin-bottom:0px!important;  }
#s5_footer_area1 .yee-row {padding-bottom:0px!important; margin-bottom:0px!important;  }
#s5_footer_area1 .yee-col-md-6 {padding-bottom:0px!important; margin-bottom:0px!important;  }
#s5_footer_area1 .yee-widget {padding-bottom:0px!important; margin-bottom:0px!important;  }

/* BREEZING FORMS
----------------------------------------------------------- */	



    #bfSubmitButton {   
        color: #474747;  
	padding: 23px; 
width:350px;
margin-right:0px;
margin-top:0px;
min-height:60px;
font-size: 1.0em!important;
text-transform: uppercase!important;
	border-radius: 0px;
border:0px!important;
background: #CFCDCD!important;
}

    #bfSubmitButton:hover {   
       color: #fff;  
background: #000!important;

}


.custom-entrylogo { 
/*max-width:600px; 
    margin-left : auto;
    margin-right : auto;
    position : absolute;
 z-index:99999999999; text-align:center;  display: block;    top:20%!important; left:30%;
padding-left:30px; padding-right:30px; *//* commented by joomlafreaks */
max-width:100%; 
    margin-left : auto;
    margin-right : auto;
    position : absolute;
 z-index:99999999999; text-align:center;  display: block;    top:40%; left:0!important;right:0;
padding-left:0px; padding-right:0px; 
 }



/* make keyframes that tell the start state and the end state of our object */
 
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
 
@keyframes rotater {
0% { transform:rotate(0) scale(1) }
50% { transform:rotate(360deg) scale(2) }
100% { transform:rotate(720deg) scale(1) }
}

.fade-in {
	opacity:0;  /* make things invisible upon start */
	-webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
	-moz-animation:fadeIn ease-in 1;
	animation:fadeIn ease-in 1;
 
	-webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
	-moz-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
 
	-webkit-animation-duration:1s;
	-moz-animation-duration:1s;
	animation-duration:1s;
}
 
.fade-in.one {
-webkit-animation-delay: 1.6s;
-moz-animation-delay: 1.6s;
animation-delay: 1.6s;
}
 
/*---make a basic box ---*/
.box  { 
	/* safari / chrome / mozilla */
	animation-name:rotater; 
	animation-duration:500ms; 
	animation-iteration-count:1; 
	animation-timing-function: ease-out;

	/* opera */
	-o-transform:rotate(360deg) scale(2);
	-o-transition-duration:500ms;
	-o-transition-timing-function: ease-out;

	/* ie */
	-ms-transform:rotate(360deg) scale(2);
	-ms-transform-duration:500ms;
	-ms-transform-timing-function: ease-out;
}



@media screen and (max-width: 1270px) { .custom-entrylogo {   left:25%;    } }
@media screen and (max-width: 1070px) {.custom-entrylogo {  left:17%  } }
@media screen and (max-width: 870px){  .custom-entrylogo {   left:12%  } }
@media screen and (max-width: 750px){  .custom-entrylogo {   left:5%  } }
@media screen and (max-width: 600px){  .custom-entrylogo {   left:1%;  }  }


@media screen and (min-width: 751px){  .custom-entrylogo {   top:25%  } }

@media screen and (max-width: 750px){  .custom-entrylogo {   top:55%  } }

.s5_outer-entrylogo { align:center; text-align:center; display: block;     margin-left: auto;    margin-right: auto;  }

.uk-overlay-hover { background: #000!important; }
.uk-overlay-panel  { background-color:rgba(0, 0, 0, 0.5); }


.module_round_box {  padding:0px; }
.module_round_box_outer {  padding:0px;   }

#s5_pos_custom_1 { z-index:9999999999!important; position:absolute; }

.carouselContainer { padding:0px!important; margin:0px!important; }
.carousel  { padding:0px!important; margin:0px!important; }


#s5_pos_above_body_2  { z-index:9999999999!important; position:absolute; }



#scroll-info{
	position:absolute;
	left:50%;
	bottom:150px;
	margin-left: -105px;
	width: 200px;
	height: 45px;
	z-index:999999999999;
	overflow:hidden;

font-family: 'Brandon Grotesque Bold'!important;

	-webkit-transform: translate(0, 80px);
	   -moz-transform: translate(0, 80px);
	    -ms-transform: translate(0, 80px);
	     -o-transform: translate(0, 80px);
	        transform: translate(0, 80px);

	-webkit-transition: -webkit-transform 0.6s ease-in-out;
	   -moz-transition: -moz-transform 0.6s ease-in-out;
	     -o-transition: -o-transform 0.6s ease-in-out;
	        transition: transform 0.6s ease-in-out;
}

@media screen and (max-width: 750px){  #scroll-info {
	position:absolute;
	left:50%;
	bottom:-150px; } }


@media screen and (max-width: 450px){  #scroll-info {
	position:absolute;
	left:50%;
	bottom:0px; } }


#scroll-info.show{
	-webkit-transform: translate(0, 0);
	   -moz-transform: translate(0, 0);
	    -ms-transform: translate(0, 0);
	     -o-transform: translate(0, 0);
	        transform: translate(0, 0);
}

#scroll-info a{
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	padding: 10px;
	color: #FFFFFF;
	font-family: 'Arial', sans-serif;
	font-size: 16px;
	font-weight: 700;
	line-height:1;
	text-align:center;
	letter-spacing:0.2em;

	z-index: 1;
}
#scroll-info-line{
	position:absolute;
	left: 10px;
	bottom: 10px;
	width:80px;
	height:2px;
	overflow:hidden;
	z-index: 0;
}
#scroll-info-line div{
}

@-webkit-keyframes scroll-info-line {
	from, 5% { width: 0px; }
	33%,66% { left: 0px; width: 80px; }
	95%, to { left: 80px; }
}

@keyframes scroll-info-line {
	from, 5% { width: 0px; }
	33%,66% { left: 0px; width: 80px; }
	95%, to { left: 80px; }
}




/* ENTRY LOGO
----------------------------------------------------------- */	








#site-name{
	color:#ffffff;
	position:absolute;
	width:110%;
	margin-left: -45%;
	top:51%;
	left:50%;
	z-index:1;
	font-family: 'Calibre-Bold',"?????? Pro W3","Hiragino Kaku Gothic Pro","????","Meiryo",Osaka,"?? ?????", "MS PGothic",sans-serif;
	font-size: 40px;
	font-weight: 700;
	line-height:1;
	text-align: center;


	-webkit-transform: translate(0,-20px);
	   -moz-transform: translate(0,-20px);
	    -ms-transform: translate(0,-20px);
	     -o-transform: translate(0,-20px);
	        transform: translate(0,-20px);

	-webkit-transition: -webkit-transform 1s ease-out;
	   -moz-transition: -moz-transform 1s ease-out;
	     -o-transition: -o-transform 1s ease-out;
	        transition: transform 1s ease-out;
}

#site-name span{
	display: inline-block;
	opacity:0;
	margin-right: 0.3em;
	-webkit-transform: scale(1.9,1.9);
	   -moz-transform: scale(1.9,1.9);
	    -ms-transform: scale(1.9,1.9);
	     -o-transform: scale(1.9,1.9);
	        transform: scale(1.9,1.9);

	-webkit-transition: opacity .5s ease-out, -webkit-transform .5s ease-out;
	   -moz-transition: opacity .5s ease-out, -moz-transform .5s ease-out;
	     -o-transition: opacity .5s ease-out, -o-transform .5s ease-out;
	        transition: opacity .5s ease-out, transform .5s ease-out;
}
#site-name span:last-child{
	margin-right: 0;
}
#site-name .c6{
	margin-right:1em;
}
#site-name.show{
	-webkit-transform: translate(0, 0);
	   -moz-transform: translate(0, 0);
	    -ms-transform: translate(0, 0);
	     -o-transform: translate(0, 0);
	        transform: translate(0, 0);
}
#site-name.show span{
	opacity:1;
	-webkit-transform: scale(1,1);
	   -moz-transform: scale(1,1);
	    -ms-transform: scale(1,1);
	     -o-transform: scale(1,1);
	        transform: scale(1,1);
}

@media only screen and (max-width: 600px){
	#site-name{
		font-size:30px;
	}
}

@media only screen and (max-width: 480px){
	#site-name{
		font-size:25px;
	}
}

@media only screen and (max-width: 380px){
	#site-name{
		font-size:20px;
	}
}


/********************* logo css by joomlafreaks ****************/




.site-name-wrap-logo-symbol { margin-left:-22px; }


div#site-name-wrap {
  background:transparent;
  position: relative;
}

div#site-name-wrap span {
font-family: 'Brandon Grotesque Bold'!important;
  font-size:50px;
  line-height:1.5em;
  font-weight:normal;
  margin-right:5px;
  text-transform: uppercase;
  position: relative;
  display:inline-block;
  color:#fff;
}


@media only screen and (min-width:555px){ span#logothe img{margin-top:-8px; } }



span#logothe img{width:75px; }

span#logohex img{width:44px;margin-top:-10px; }

div#site-name-wrap span:nth-child(1) {
  -webkit-animation-name: sitenamezoom; /* Chrome, Safari, Opera */
    -webkit-animation-duration:0.5; /* Chrome, Safari, Opera */
    -webkit-animation-delay:400ms;
    -webkit-animation-timing-function: ease-out;
    animation-name: sitenamezoom;
    animation-duration: 0.5s;
    animation-duration: 400ms;
    animation-timing-function: ease-out;
    margin-right:15px!important;
}

div#site-name-wrap span:nth-child(2) {
  -webkit-animation-name: sitenamezoom; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 0.5s;/* Chrome, Safari, Opera */
    -webkit-animation-delay: 400ms;
    -webkit-animation-timing-function: ease-out;
    animation-name: sitenamezoom;
    animation-duration: 0.5s;
    animation-duration: 400ms;
    animation-timing-function: ease-out;
}

div#site-name-wrap span:nth-child(3) {
  -webkit-animation-name: sitenamezoom; /* Chrome, Safari, Opera */
    -webkit-animation-duration:0.5s;
    -webkit-animation-delay: 466.667ms;/* Chrome, Safari, Opera */
    -webkit-animation-timing-function: ease-out;
    animation-name: sitenamezoom;
    animation-duration: 0.5s;
    animation-delay: 466.667ms;
    animation-timing-function: ease-out;
}

div#site-name-wrap span:nth-child(4) {
 -webkit-animation-name: sitenamezoom; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 0.5s;
    -webkit-animation-delay: 66.6667ms;/* Chrome, Safari, Opera */
    -webkit-animation-timing-function: ease-out;
    animation-name: sitenamezoom;
    animation-duration:0.5s;
    animation-delay: 66.6667ms;
    animation-timing-function: ease-out;
}

div#site-name-wrap span:nth-child(5) {
  -webkit-animation-name: sitenamezoom; /* Chrome, Safari, Opera */
  -webkit-animation-duration:0.5s; /* Chrome, Safari, Opera */
  -webkit-animation-delay:266.667ms;
  -webkit-animation-timing-function: ease-out;
  animation-name: sitenamezoom;
  animation-duration:0.5s;
  animation-delay:266.667ms;
  animation-timing-function: ease-out;
}

div#site-name-wrap span:nth-child(6) {
  -webkit-animation-name: sitenamezoom; /* Chrome, Safari, Opera */
  -webkit-animation-duration:0.5s; /* Chrome, Safari, Opera */
  -webkit-animation-delay:133.333ms;
  -webkit-animation-timing-function: ease-out;
  animation-name: sitenamezoom;
  animation-duration:0.5s;
  animation-delay:133.333ms;
  animation-timing-function: ease-out;
}

div#site-name-wrap span:nth-child(7) {
  -webkit-animation-name: sitenamezoom; /* Chrome, Safari, Opera */
  -webkit-animation-duration:0.5s; /* Chrome, Safari, Opera */
  -webkit-animation-delay:166.667ms;
  -webkit-animation-timing-function: ease-out;
  animation-name: sitenamezoom;
  animation-duration:0.5s;
  animation-delay:166.667ms;
  animation-timing-function: ease-out;
}

div#site-name-wrap span:nth-child(8) {
  -webkit-animation-name: sitenamezoom; /* Chrome, Safari, Opera */
  -webkit-animation-duration:0.5s; /* Chrome, Safari, Opera */
  -webkit-animation-delay:500ms;
  -webkit-animation-timing-function: ease-out;
  animation-name: sitenamezoom;
  animation-duration:0.5s;
  animation-delay:500ms;
  animation-timing-function: ease-out;
}

div#site-name-wrap span:nth-child(9) {
  -webkit-animation-name: sitenamezoom; /* Chrome, Safari, Opera */
  -webkit-animation-duration:0.5s; /* Chrome, Safari, Opera */
  -webkit-animation-delay:400ms;
  -webkit-animation-timing-function: ease-out;
  animation-name: sitenamezoom;
  animation-duration:0.5s;
  animation-delay:400ms;
  animation-timing-function: ease-out;
  margin-right:15px!important;
}

div#site-name-wrap span:nth-child(10) {
  -webkit-animation-name: sitenamezoom; /* Chrome, Safari, Opera */
  -webkit-animation-duration:0.5s; /* Chrome, Safari, Opera */
  -webkit-animation-delay:533.333ms;
  -webkit-animation-timing-function: ease-out;
  animation-name: sitenamezoom;
  animation-duration:0.5s;
  animation-delay:533.333ms;
  animation-timing-function: ease-out;
}

div#site-name-wrap span:nth-child(11) {
  -webkit-animation-name: sitenamezoom; /* Chrome, Safari, Opera */
  -webkit-animation-duration:0.5s; /* Chrome, Safari, Opera */
  -webkit-animation-delay:300ms;
  -webkit-animation-timing-function: ease-out;
  animation-name: sitenamezoom;
  animation-duration:0.5s;
  animation-delay:300ms;
  animation-timing-function: ease-out;
}

div#site-name-wrap span:nth-child(12) {
  -webkit-animation-name: sitenamezoom; /* Chrome, Safari, Opera */
  -webkit-animation-duration:0.5s; /* Chrome, Safari, Opera */
  -webkit-animation-delay:666.667ms;
  -webkit-animation-timing-function: ease-out;
  animation-name: sitenamezoom;
  animation-duration:0.5s;
  animation-delay:666.667ms;
  animation-timing-function: ease-out;
}

div#site-name-wrap span:nth-child(13) {
  -webkit-animation-name: sitenamezoom; /* Chrome, Safari, Opera */
  -webkit-animation-duration:0.5s; /* Chrome, Safari, Opera */
  -webkit-animation-delay:500ms;
  -webkit-animation-timing-function: ease-out;
  animation-name: sitenamezoom;
  animation-duration:0.5s;
  animation-delay:500ms;
  animation-timing-function: ease-out;
}

div#site-name-wrap span:nth-child(14) {
  -webkit-animation-name: sitenamezoom; /* Chrome, Safari, Opera */
  -webkit-animation-duration:0.5s; /* Chrome, Safari, Opera */
  -webkit-animation-delay:566.667ms;
  -webkit-animation-timing-function: ease-out;
  animation-name: sitenamezoom;
  animation-duration:0.5s;
  animation-delay:566.667ms;
  animation-timing-function: ease-out;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes sitenamezoom {
    from {transform:scale(3.9, 3.9);color:#DDD;}
    to {transform:scale(1, 1);color:#000;}
}

/* Standard syntax */
@keyframes sitenamezoom {
    from {transform:scale(3.9, 3.9);color:#DDD;}
    to {transform:scale(1, 1);color:#000;}
}



@media only screen and (max-width:655px){
  
span#logothe img{width:72px;}

span#logohex img{width:32px;}

div#site-name-wrap span{font-size:40px;margin-right:5px}

}


@media only screen and (max-width:555px){
  
span#logothe img{width:65px;}

span#logohex img{width:28px;}

div#site-name-wrap span{font-size:35px;margin-right:5px}

}

@media only screen and (max-width:465px){
  
span#logothe img{width:55px;}

span#logohex img{width:24px;}

div#site-name-wrap span{font-size:35px;margin-right:5px}

}

@media only screen and (max-width: 450px){
  
span#logothe img{width:45px;}

span#logohex img{width:19px;}

div#site-name-wrap span{font-size:25px;margin-right:2px!important;}

div#site-name-wrap span:nth-child(1){margin-right:10px!important;}

div#site-name-wrap span:nth-child(9){margin-right:10px!important;}

}

div#site-name-contacts {
margin-top:50px; 
line-height:180%;
  background:transparent;
  position: relative;
font-size:1.4em;
color:#fff;
font-weight:500;
}

@media only screen and (max-width:800px){ div#site-name-contacts { font-size:1.2em; } }

@media only screen and (max-width:400px){ div#site-name-contacts { font-size:1.0em; } }


@media only screen and (max-width:600px){ .scroll-comingsoon { padding-top:50px; } }



