/* @override http://development.local/html/miryoku/css/media-queries.css */

/* #Media queries
================================================== */
@media (max-width: 979px) {
	
	
	
	
}



/*=================================================================*/
/*  Table Portrait
/*=================================================================*/
@media (min-width: 768px) and (max-width: 979px) {
	
	.container { width: 680px; }

	/* #Full Slider
	================================================== */
	#layerslider-container-fw .in-slide-content h1{
		font-size: 20px;
	}
	#layerslider-container-fw .in-slide-content h2{
		font-size: 17px;
	}
	#layerslider-container-fw .in-slide-content p{
		font-size: 12px;
	}
	
	/* #Normal Slider
	================================================== */
	#layerslider-normal{
		padding-top: 105px;
		height: 340px;
	}
	#layerslider-bk h1{
		font-size: 19px !important;
	}
	#layerslider-bk h2{
		font-size: 22px !important;
	}

	
	/* #Carousel
	================================================== */
	.recent-works .span4,
	.recent-works .span8{
		width: 100%;
	}
	.recent-works .bx-wrapper{
		width: 600px;
	}

	/* #Team shortcode
	================================================== */
	.team-member {
		padding-bottom: 0px;
		width: 100% !important;
	}
	.team-member .member-text{
		padding: 0 20px;
		display: block;
	}
	
	
	/* #Portfolio
	================================================== */
	#filter-bar .layout{ right: 6px; }
	
	#portfolio li.project.size1{ width: 330px;}
	#portfolio li.project.size2{ width: 156px; }
	#portfolio li.project.size3{ width: 156px; }
	#portfolio li.project.size4{ width: 156px; }
	#portfolio li.project.size5{ width: 175px; }
	#portfolio li.project.size6{ width: 156px; }
	#portfolio li.project.size7{ width: 146px; }
	#portfolio li.project.size8{ width: 156px; }
	#portfolio li.project.size9{ width: 175px; }
	#portfolio li.project.size10{ width: 156px; }
	#portfolio li.project.size11{ width: 156px; }
	#portfolio li.project.size12{ width: 156px; }
	#portfolio li.project.size13{ width: 156px; }
	#portfolio li.project.size14{ width: 146px; }
	

}





/*=================================================================*/
/*  Mobile Portrait
/*=================================================================*/
@media (max-width: 767px) {
	#menu #left-border,
	#menu #right-border{
		display: none;
	}
	#menu li{
		padding-top: 8px;
		padding-bottom: 0;
		margin-bottom: -3px;
	}
	#header{
		width: auto;
		padding-left: 0;
		padding-right: 0;
		position: relative;
	}
	body {
	  padding-right: 0px;
	  padding-left: 0px;
	}
	.container{
		padding-right: 20px;
		padding-left: 20px;
		width: 268px;
	}
	/* #Full Slider
	================================================== */
	#layerslider-container-fw .in-slide-content h1{
		font-size: 11px;
		line-height: 11px;
	}
	#layerslider-container-fw .in-slide-content h2{
		font-size: 10px;
		line-height: 10px;
	}
	#layerslider-container-fw .in-slide-content p{
		font-size: 8px;
		line-height: 9px;
		margin-top: -5px;
	}
	#layerslider-container-fw .ls-bottom-nav-wrapper{
		display: none;
	}
		
	/* #Normal Slider
	================================================== */
	#layerslider-normal{
		height: auto;
		padding-bottom: 30px;
		padding-top: 30px;
	}
	#layerslider-normal .ls-bottom-nav-wrapper{
		display: none;
	}
	#layerslider-bk h1{
		font-size: 10px !important;
		line-height: 10px;
	}
	#layerslider-bk h2{
		font-size: 9px !important;
		line-height: 9px;
		margin-top: -5px !important;
	}
	
	
	
	
	
	
	
	.page-intro{
		margin-top: 20px;
	}
	
	.top-social{
		width: 100%;
		text-align: center;
		margin-bottom: 10px;
	}
	
	.column-square{
		overflow: hidden;
		display: none;
		padding-top: 10px;
		padding-bottom: 10px;
	}
	
	/* #Carousel
	================================================== */
	.recent-works .bx-wrapper{
		width: 180px;
	}
	
	
	
	/* #Team member
	================================================== */
	.team-member{
		width: 100%;
		overflow: hidden;
		padding-bottom: 10px;
	}
	.team-member .member-details{
		width: 100% !important;
	}
	.team-member .member-details img{
		width: 82%;
	}
	.team-member .member-text{
		padding-left: 10px;
		padding-right: 10px;
	}
	
	/* #Services
	================================================== */
	.service-icon{
		float: left !important;
		width: 120px !important;
	}
	
	/* #Portfolio
	================================================== */
	#portfolio{
		margin-top: 0;
	}
	#portfolio li.project.size1,
	#portfolio li.project.size2,
	#portfolio li.project.size3,
	#portfolio li.project.size4,
	#portfolio li.project.size5,
	#portfolio li.project.size6,
	#portfolio li.project.size7,
	#portfolio li.project.size8,
	#portfolio li.project.size9,
	#portfolio li.project.size10,
	#portfolio li.project.size11,
	#portfolio li.project.size12,
	#portfolio li.project.size13,
	#portfolio li.project.size14{
		width: 99%;
	}
	#portfolio li.project.size1 img,
	#portfolio li.project.size2 img,
	#portfolio li.project.size3 img,
	#portfolio li.project.size4 img,
	#portfolio li.project.size5 img,
	#portfolio li.project.size6 img,
	#portfolio li.project.size7 img,
	#portfolio li.project.size8 img,
	#portfolio li.project.size9 img,
	#portfolio li.project.size10 img,
	#portfolio li.project.size11 img,
	#portfolio li.project.size12 img,
	#portfolio li.project.size13 img,
	#portfolio li.project.size14 img{
		width: 100%;
	}
	
	
	
}



/*=================================================================*/
/*  Mobile Landscape
/*=================================================================*/
@media only screen and (min-width: 480px) and (max-width: 767px) {	
	.container{
		width: 428px;
	}
	
	#header{
		position: absolute;
	}
	
	
	/* #Full Slider
	================================================== */
	#layerslider-container-fw .in-slide-content h1{
		font-size: 15px;
		line-height: 15px;
	}
	#layerslider-container-fw .in-slide-content h2{
		font-size: 14px;
		line-height: 14px;
	}
	#layerslider-container-fw .in-slide-content p{
		font-size: 10px;
		line-height: 15px;
		margin-top: -5px;
	}
	
	/* #Normal Slider
	================================================== */
	#layerslider-normal{
		height: 184px;
		padding-top: 104px;
	}
	#layerslider-bk h1{
		font-size: 15px !important;
		line-height: 15px;
	}
	#layerslider-bk h2{
		font-size: 14px !important;
		line-height: 14px;
	}
	
	
	
	/* #Carousel
	================================================== */
	.recent-works .bx-wrapper{
		width: 280px;
	}
	
	
	
	/* #Team member
	================================================== */
	.team-member{	
		overflow: hidden;
		padding-bottom: 10px;
	}
	.team-member .member-details{
		width: 230px !important;
	}
	.team-member .member-details img{
		width: auto;
	}
	.team-member .member-text{
		padding-left: 10px;
		padding-right: 10px;
	}
	
	
		
	input[type="text"],
	textarea{
		width: 90% !important;
	}
	.inner-button{
		background: none !important;
		padding-left: 0 !important;
		width: 100%;
		padding-bottom: 19px;
		margin-top: -27px;
		margin-bottom: -8px;
	}
	.inner-button a{
		width: 90%;
		display: block;
		height: 14px;
	}
	#filter-bar{
		display: nonesss;
	}
	#portfolio .project{
		text-align: left;
		width: 100%;
		margin-bottom: 35px;
		margin-left: 0px;
		margin-right: 0px;
	}
	.tagline .span8,
	.tagline .span4{
		float: none;
		width: 100% !important;
	}
	.tagline .inner-button{
		float: left !important;
	}
	.tagline .social-container{
	}
	


	
	
}




/*=================================================================*/
/*  Mobile Menu
/*=================================================================*/
@media (max-width: 767px) {
  body {
    padding-top: 0;
  }
  .navbar-fixed-top,
  .navbar-fixed-bottom {
    position: static;
  }
  .navbar-fixed-top {
    margin-bottom: 20px;
  }
  .navbar-fixed-bottom {
    margin-top: 20px;
  }
  .navbar-fixed-top .navbar-inner,
  .navbar-fixed-bottom .navbar-inner {
    padding: 5px;
  }
  .navbar .container {
    width: auto;
    padding: 0;
  }
  .navbar .brand {
    padding-right: 10px;
    padding-left: 10px;
    margin: 0 0 0 -5px;
  }
  .nav-collapse {
    clear: both;
  }
  .nav-collapse .nav {
    float: none;
    margin: 0 0 10px;
  }
  .nav-collapse .nav > li {
    float: none;
  }
  .nav-collapse .nav > li > a {
    margin-bottom: 2px;
  }
  .nav-collapse .nav > .divider-vertical {
    display: none;
  }
  .nav-collapse .nav .nav-header {
    color: #777777;
    text-shadow: none;
  }
  .nav-collapse .nav > li > a,
  .nav-collapse .dropdown-menu a {
    padding: 9px 15px;
    font-weight: bold;
    color: #777777;
    -webkit-border-radius: 3px;
       -moz-border-radius: 3px;
            border-radius: 3px;
  }
  .nav-collapse .btn {
    padding: 4px 10px 4px;
    font-weight: normal;
    -webkit-border-radius: 4px;
       -moz-border-radius: 4px;
            border-radius: 4px;
  }
  .nav-collapse .dropdown-menu li + li a {
    margin-bottom: 2px;
  }
  .nav-collapse .nav > li > a:hover,
  .nav-collapse .dropdown-menu a:hover {
    background-color: #f2f2f2;
  }
  .navbar-inverse .nav-collapse .nav > li > a,
  .navbar-inverse .nav-collapse .dropdown-menu a {
    color: #999999;
  }
  .navbar-inverse .nav-collapse .nav > li > a:hover,
  .navbar-inverse .nav-collapse .dropdown-menu a:hover {
    background-color: #111111;
  }
  .nav-collapse.in .btn-group {
    padding: 0;
    margin-top: 5px;
  }
  .nav-collapse .dropdown-menu {
    position: static;
    top: auto;
    left: auto;
    display: none;
    float: none;
    max-width: none;
    padding: 0;
    margin: 0 15px;
    background-color: transparent;
    border: none;
    -webkit-border-radius: 0;
       -moz-border-radius: 0;
            border-radius: 0;
    -webkit-box-shadow: none;
       -moz-box-shadow: none;
            box-shadow: none;
  }
  .nav-collapse .open > .dropdown-menu {
    display: block;
  }
  .nav-collapse .dropdown-menu:before,
  .nav-collapse .dropdown-menu:after {
    display: none;
  }
  .nav-collapse .dropdown-menu .divider {
    display: none;
  }
  .nav-collapse .nav > li > .dropdown-menu:before,
  .nav-collapse .nav > li > .dropdown-menu:after {
    display: none;
  }
  .nav-collapse .navbar-form,
  .nav-collapse .navbar-search {
    float: none;
    padding: 10px 15px;
    margin: 10px 0;
    border-top: 1px solid #f2f2f2;
    border-bottom: 1px solid #f2f2f2;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
       -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
  }
  .navbar-inverse .nav-collapse .navbar-form,
  .navbar-inverse .nav-collapse .navbar-search {
    border-top-color: #111111;
    border-bottom-color: #111111;
  }
  .navbar .nav-collapse .nav.pull-right {
    float: none;
    margin-left: 0;
  }
  .nav-collapse,
  .nav-collapse.collapse {
    height: 0;
    overflow: hidden;
  }
  .navbar .btn-navbar {
    display: block;
  }
  .navbar-static .navbar-inner {
    padding-right: 10px;
    padding-left: 10px;
  }
  
  #menu {
  	padding: 0px;
  	top: 0;
	  margin-bottom: -8px;
	  background-color: #202120;
	  float: none;
  }
  #menu > .nav{
  	margin-top: 0px;
  }
  #menu > .nav > li{
  	border-bottom: 1px solid #292828;
	border-top: 1px solid #464643;
	width: 100%;
}
  #menu > .nav > li:first-child{
  	border-top: none;
  }
  #menu > .nav > li:last-child{
  	border-bottom: none;
  }
  .dropdown-menu .sub-menu {
      position: relative;
      visibility: visible !important;
      display: block !important;
  }
  .dropdown-menu li{
  	border-bottom: 1px solid #292828 !important;
  	border-top: 1px solid #464643 !important;
  }
  .dropdown-menu li:first-child{
  	border-top: none !important;
  }
  .dropdown-menu li:last-child{
  	border-bottom: none !important;
  }
  .dropdown-menu li a{
  	padding-top: 6px;
  	padding-bottom: 6px;
  	font-size: 12px;
  	color: #fefefe !important;
  	text-shadow: none !important;
  }
  #header #menu .nav li a{
  	text-shadow: none;
  	color: #fefefe;
  }
  .dropdown-menu li:hover a,
  .dropdown-menu li.current a,
  .dropdown-menu li.current_page_item a{
  	background: none !important;
  	color: #f85140;
  }
  
  
  
  
  #footer{
  	padding-left: 25px;
	  padding-right: 25px;
  }
  
}

@media (min-width: 767px) {
  .nav-collapse.collapse {
    height: auto !important;
    overflow: visible !important;
  }
  

  
}
