@charset "utf-8";
/*--------------media query css------------------*/	
/*------------tablet landscape view------*/
@media (max-width:1500px) {
	
	
}
@media (max-width:1200px) {
	#header-main { padding-top: 0; }
	.logo { display: block;width: 250px;  }	
	.cf{padding: 0;}
	

}
@media (max-width:985px) {
	.main { width: auto; padding: 0 15px; }
	
}
/*------------tablet portrait  view------*/
@media (max-width:1024px) {
	#header-main { border-top-width: 0; padding-top: 10px; }
	.logo { display: block;width: 220px;  }
	.mid-container { border-top-width: 20px; }
	
	
}
/*------------mobile landscape  view------*/
@media (max-width:767px) {
	#header-main { padding-top: 20px; }
	.logo { display: block;width: 195px;  }
	.mid-container { border-top-width: 10px; }
    .accordion { height: auto; }

.accordion ul li,
.accordion ul li:hover,
.accordion ul:hover li,
.accordion ul:hover li:hover {
  position: relative;
  display: block;
  width: 100%;
  -webkit-transition: none;
  transition: none;
    height: 400px;

}
    
    .accordion ul li div {
  display: block;
  width: 100%;
    padding: 0;
   height: 350px;

   
   
}

.accordion ul li div a {
  display: block;
  position: relative; top: -200px;
  z-index: 3;
  vertical-align: top;
  color: #fff;
  text-decoration: none;
  font-family: Open Sans, sans-serif;
  transition: all 200ms ease;
}

.accordion ul li div a * {
  opacity: 0;
  margin: 0;
  position: relative;
  z-index: 5;
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
}

.accordion ul li div a p {
  top: 120px;
  font-size: 11px;
  text-align: left;
    line-height: 22px;
    margin: 5px 40px;
    text-transform: uppercase;
    color: #838383;
    
    
   
}

.title {
  font-size: 18px;
    color: #fff;
    text-transform: uppercase;
    font-family: 'kionaregular';
    position: relative; top:50%;
   
    
}
	
	
}
/*------------mobile portrait view------*/
@media (max-width:640px) {
	#header-main { padding-bottom: 0; }
	.logo { display: block;width: 200px;  margin-bottom: 10px; }
.cf{padding: 0;}
p{font-size: 12px;}
	
}
/*----------optional css------*/
@media (max-width:480px) {
	
}
/*---------use only when design is customise-----------*/