@charset "utf-8";
@charset "utf-8";

 @media screen and (min-width:990px) {
body{
margin: 0px;
background: #f5f6f7;
}
.menu-mobile{
display:none;
}
#menumob{
display:none;
}
.language{
float: left;
width: 100%;
}
.language .box{
float: right;
padding: 7px;
background: #FFF;
font-family: 'open_sanssemibold';
}
.language .box img{
float: left;
width: 18px;
}
:root .css3-metro-dropdown option,
:root .css3-metro-dropdown:after,
:root .css3-metro-dropdown::after,
:root .css3-metro-dropdown select
{
color: #FFF;
cursor: pointer;
}
:root .css3-metro-dropdown select,
:root .css3-metro-dropdown:after,
:root .css3-metro-dropdown::after
{
display: block;
background: none;
color: #FFF;
}
:root .css3-metro-dropdown select,
:root .css3-metro-dropdown option
{
color: #FFF;
}
:root .css3-metro-dropdown
{
position: relative;
display: inline-block;
border-left: none;
}
:root .css3-metro-dropdown::after
{
content: "\25bc";
position: absolute;
top: 0;
right: 0;
display: block;
width: 20px;
font-size: 8px;
line-height: 12px;
text-align: center;
-webkit-pointer-events: none;
-moz-pointer-events: none;
pointer-events: none;
}
:root .css3-metro-dropdown select
{
height: 12px;
border: 0;
vertical-align: middle;
font-family: 'open_sanssemibold';
font-size: 10px;
outline: 0 none;
}
:root .css3-metro-dropdown option
{
background:none;
color: #FFF;
border:none;
cursor:pointer;
} :root .css3-metro-dropdown-color-ff2e12 select
{
background: #FFF;
color: #d70000;
}
:root .css3-metro-dropdown-color-ff2e12:after
{
background: #FFF;
color: #d70000;
}
:root .css3-metro-dropdown-color-ff2e12::after
{
background: #FFF;
color: #d70000;
}
.left_side{
float: left;
width: 25%;
padding: 2.5%;
margin-top: 2.5%;
margin-left: 0%;
margin-right: 0%;
background: #FFF;
border-radius: 5px;
margin-bottom: 30px;
-webkit-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.2);
box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.2);
}
.left_side .logo{
float: left;
width: 100%;
}
.left_side .logo img{
width: 100%;
max-width: 250px;
}
.left_side .menu{
float: left;
width: 100%;
margin-top: 30px;
}
.left_side .menu li{
float: left;
width: 100%;
padding: 5%;
list-style: none;
border-radius: 5px;
background: #092c61;
margin-bottom: 10px;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
}
.left_side .menu a:nth-last-child(1) li{
margin-bottom: 0px;
}
.left_side .menu li:hover, .left_side .menu li.active{
background: #27a6dc;
}
.left_side .menu li:nth-last-child(1){
background: #fe0000;
}	
.left_side .menu a li{
color: #FFF;
font-size: 13px;
font-family: 'open_sansbold';
letter-spacing: 1px;
}
.right_side{
float: right;
width: 73%;
margin-top: 2.5%;
}
.right_side .contact_top{
float: left;
width: 100%;
margin-bottom: 30px;
}
.right_side .contact_top .slogan{
float: left;
width: 52%;
padding: 1%;
height: 150px;
background: #fe0000;
-webkit-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.4);
-moz-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.4);
box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.4);
}
.right_side .contact_top .slogan .text{
padding-bottom: 10px;
color: #FFF;
text-align: justify;
font-size: 17px;
font-family: 'open_sanssemibold';
line-height: 1.5em;
}
.right_side .contact_top .phone{
float: right;
width: 45%;
padding-bottom: 20px;
background: #FFF;
border-radius: 5px;
-webkit-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.4);
-moz-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.4);
box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.4);
overflow: hidden;
}
.right_side .contact_top .phone .side1{
float: left;
width: 100%;
padding: 2.5%;
padding-top: 1.5%;
padding-bottom: 1.5%;
background: #092c61;
color: #FFF;
font-size: 16px;
font-family: 'open_sansbold';
letter-spacing: 1px;
line-height: 1.7em;
}
.right_side .contact_top .phone .side1 i{
float: left;
width: 23px;
height: 23px;
font-size: 16px;
border-radius: 50%;
background: #DDD;
text-align: center;
color: #3c4044;
line-height: 1.5em;
margin-right: 10px;
}
.right_side .contact_top .phone .side2{
float: left;
width: 100%;
padding: 2.5%;
color: #fe0000;
font-size: 15px;
font-family: 'open_sansbold';
text-align: center;
}
.right_side .contact_top .phone .side2 a{
float: left;
color: #fe0000;
width: 50%;
margin-top: 5px;
margin-bottom: 5px;
}
.right_side .contact_top .phone .side3{
float: left;
width: 100%;
color: #5E5D5D;
text-align: center;
font-size: 11px;
font-family: 'open_sansregular';
}
.right_side .about_home{
float: left;
width: 100%;
margin-bottom: 30px;
overflow: hidden;
text-align: justify;
}
.right_side .about_home .name{
float: left;
width: 100%;
margin-bottom: 10px;
color: #092c61;
font-family: 'open_sansbold';
font-size: 24px;
}
.right_side .about_home p{
font-family: 'open_sanssemibold';
font-size: 18px;
line-height: 1.5em;
padding-bottom: 10px;
}
.right_side .listing{
float: left;
width: 100%;
overflow: hidden;
}
.right_side .listing .top{
float: left;
width: 100%;
margin-bottom: 15px;
font-family: 'open_sansbold';
font-size: 20px;
color: #092c61;
}
.right_side .listing .top .sort{
float: right;
width: 200px;
margin-right: 3px;
font-family: 'open_sanssemibold';
} .dropdown {
width: 100%;
border-radius: 5px;
display: inline-block;
background-color: #FFF;
-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
transition: all .5s ease;
position: relative;
font-size: 13px;
color: #8c8c8c;
height: 100%;
text-align: left;
}
.dropdown .select {
cursor: pointer;
display: block;
padding: 10px
}
.dropdown .select > i {
font-size: 13px;
color: #888;
cursor: pointer;
transition: all .3s ease-in-out;
float: right;
line-height: 18px
}
.dropdown:hover {
box-shadow: 0 0 4px rgb(204, 204, 204)
}
.dropdown:active {
background-color: #f8f8f8
}
.dropdown.active:hover,
.dropdown.active {
box-shadow: 0 0 4px rgb(204, 204, 204);
border-radius: 5px 5px 0 0;
background-color: #f8f8f8
}
.dropdown.active .select > i {
transform: rotate(-180deg)
}
.dropdown .dropdown-menu {
position: absolute;
background-color: #fff;
width: 100%;
left: 0;
margin-top: 1px;
box-shadow: 0 1px 2px rgb(204, 204, 204);
border-radius: 0 1px 5px 5px;
overflow: hidden;
display: none;
max-height: 144px;
overflow-y: auto;
z-index: 9
}
.dropdown .dropdown-menu li {
padding: 10px;
transition: all .2s ease-in-out;
cursor: pointer
} 
.dropdown .dropdown-menu {
padding: 0;
list-style: none
}
.dropdown .dropdown-menu li:hover {
background-color: #f2f2f2
}
.dropdown .dropdown-menu li:active {
background-color: #e2e2e2
}
.right_side .listing .grid{
float: left;
width: 100%;
display: grid;
grid-template-columns: auto auto auto;
grid-gap: 15px;
}
.right_side .listing .grid > div {
text-align: center;
}
.right_side .listing .box{
float: left;
width: 100%;
overflow: hidden;
margin-bottom: 20px;
background: #FFF;
-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
}
.right_side .listing .box .pic{
float: left;
width: 100%;
height: 200px;
margin-bottom: 20px;
overflow: hidden;
text-align: center;
}
.right_side .listing .box .pic img{
width: 100%;
height: 100%;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
}
.right_side .listing .box .pic img:hover{
opacity: 0.5;
transform: scale(1.05);
}
.right_side .listing .box .text{
float: left;
width: 90%;
margin: 5%;
margin-top: 0%;
font-family: 'open_sansregular';
font-size: 13px;
line-height: 1.5em;
color: #000;
}
.right_side .listing .box .text .name{
float: left;
width: 100%;
text-align: center;
font-family: 'open_sansbold';
font-size: 16px;
color: #092c61;
margin-bottom: 10px;
}
.right_side .listing .box .text table{
float: left;
width: 100%;
}
.right_side .listing .box .text table td{
float: left;
width: 50%;
box-shadow: inset 0px 0px 0px 1px rgba(221,221,221,1); 
padding: 5px;
}	
.right_side .listing .box .text table td.colspan{
float: left;
width: 100%;
box-shadow: inset 0px 0px 0px 1px rgba(221,221,221,1); 
padding: 5px;
margin-bottom: -1px;
}	
*{
box-sizing: border-box;
}
.right_side .about_page{
float: left;
width: 92%;
padding: 4%;
background: #FFF;
margin-bottom: 50px;
-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
}
.right_side .about_page .logo{
float: left;
width: 100%;
text-align: center;
margin-bottom: 30px;
}
.right_side .about_page .logo img{
width: 100%;
max-width: 120px;
}
.right_side .about_page .text{
float: left;
width: 100%;
line-height: 1.9em;
font-family: 'open_sansregular';
font-size: 15px;
color: #092c61;
margin-bottom: 30px;
}
.right_side .about_page .text p{
padding-bottom: 10px;
}
.right_side .about_page .text li{
padding-left: 0px;
margin-left: 15px;
padding-bottom: 10px;
}
.right_side .about_page .text h1{
float: left;
width: 100%;
font-family: 'open_sansbold';
color: #fe0000;
font-size: 28px;
margin-bottom: 20px;
}
.right_side .about_page .text table{
float: left;
width: 100%;
line-height: 1.5em;
}
.right_side .about_page .text tr{
background: rgba(221, 221, 221, 0.5);
}
.right_side .about_page .text td{
padding: 10px;
}
.right_side .about_page .text td:nth-last-child(2){
width: 30%;
}
.right_side .about_page .text .one{
font-size: 16px;
font-family: 'open_sansbold';
padding: 2.5px;
width: 25px;
background: #fe0000;
color: #FFF;
text-align: center;
}
.right_side .about_page .text .two{
font-size: 20px;
font-family: 'open_sansbold';
color: #092c61;
}
.right_side .about_page .text .three{
color: #092c61;
}
.right_side .about_page .name{
float: left;
width: 100%;
margin-bottom: 20px;
font-family: 'open_sansbold';
font-size: 16px;
color: #4E4E4E;
}
.right_side .about_page .grid_marketing{
float: left;
width: 100%;
display: grid;
grid-template-columns: auto auto auto;
grid-gap: 20px;
margin-bottom: 80px;
}
.right_side .about_page .grid_marketing > div {
text-align: left;
}
.right_side .about_page .box_marketing{
float: left;
width: 95%;
height: 320px;
max-width: 250px;
text-align: center;
background: #092c61;
padding: 2.5%;
}
.right_side .about_page .box_marketing .pic{
float: left;
width: 100%;
height: 220px;
overflow: hidden;
margin-bottom: 15px;
}
.right_side .about_page .box_marketing .pic img{
width: 100%;
height: 100%;
}
.right_side .about_page .box_marketing .desc{
float: left;
width: 100%;
height: 90px;
overflow: hidden;
color: #FFF;
font-size: 16px;
text-align: center;
font-family: 'open_sanssemibold';
}
.right_side .about_page .box_marketing .desc .list{
float: left;
width: 100%;
margin-bottom: 7px;
}
.right_side .about_page .grid{
float: left;
width: 100%;
display: grid;
grid-template-columns: auto auto auto auto auto auto;
grid-gap: 30px;
margin-bottom: 50px;
}
.right_side .about_page .grid > div {
text-align: left;
}
.right_side .about_page .box{
float: left;
width: 100%;
height: 100px;
text-align: center;
}
.right_side .about_page .box img{
width: 100%;
height: 100%;
}
.right_side .about_page form{
float: left;
width: 100%;
}
.right_side .about_page .input{
float: left;
width: 60%;
padding-left: 2%;
height: 45px;
margin-bottom: 20px;
background: #f3f6fa;
border-radius: 5px;
border: none;
font-size: 15px;
font-family: 'open_sanssemibold';
color: #000;
-webkit-box-shadow: inset 0px 0px 0px 1px rgba(220,228,239,1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(220,228,239,1);
box-shadow: inset 0px 0px 0px 1px rgba(220,228,239,1);
}
.right_side .about_page textarea{
float: left;
width: 58%;
padding: 2%;
height: 100px;
margin-bottom: 20px;
background: #f3f6fa;
border-radius: 5px;
border: none;
font-size: 15px;
font-family: 'open_sanssemibold';
color: #000;
-webkit-box-shadow: inset 0px 0px 0px 1px rgba(220,228,239,1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(220,228,239,1);
box-shadow: inset 0px 0px 0px 1px rgba(220,228,239,1);
}
.right_side .about_page .button{
float: left;
padding: 15px;
border-radius: 5px;
padding-left: 40px;
padding-right: 40px;
color: #FFF;
font-family: 'open_sansbold';
font-size: 16px;
background: #092c61;
border: none;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
}
.right_side .about_page .button:hover{
background: #2da8dd;
}
.right_side .detail_page{
float: left;
width: 100%;
padding: 2.5%;
background: #FFF;
margin-bottom: 50px;
-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
}
.right_side .detail_page .title{
float: left;
width: 100%;
margin-bottom: 30px;
font-family: 'open_sanssemibold';
font-size: 30px;
color: #4E4E4E;
letter-spacing: 1.5px;
}
.right_side .detail_page .text{
float: left;
width: 100%;
line-height: 1.7em;
font-family: 'open_sanssemibold';
font-size: 15px;
color: #4E4E4E;
margin-bottom: 30px;
}
.right_side .detail_page .text p{
padding-bottom: 10px;
}
.right_side .detail_page .text table{
width: 30%;
font-family: 'open_sansregular';
font-size: 13px;
line-height: 1.5em;
color: #000;
}
.right_side .detail_page .text table p{
padding: 0;
}
.right_side .detail_page .text table td{
float: left;
width: 50%;
box-shadow: inset 0px 0px 0px 1px rgba(221,221,221,1); 
padding: 5px;
}	
.right_side .detail_page .text table td.colspan{
float: left;
width: 100%;
box-shadow: inset 0px 0px 0px 1px rgba(221,221,221,1); 
padding: 5px;
margin-bottom: -1px;
}	
.right_side .detail_page .text li{
padding-left: 0px;
padding-bottom: 10px;
}
.right_side .detail_page .grid{
float: left;
width: 100%;
display: grid;
grid-template-columns: auto auto auto;
grid-gap: 20px;
}
.right_side .detail_page .grid > div {
text-align: left;
}
.right_side .detail_page .box{
float: left;
width: 100%;
height: 200px;
text-align: center;
position: relative;
overflow: hidden;
}
.right_side .detail_page .box img{
width: 100%;
height: 100%;
}
.right_side .detail_page .box .back{
opacity: 0;
-webkit-transition-duration: 0.1s;
transition-duration: 0.1s;
}
.right_side .detail_page .box:hover .back{
opacity: 1;
position: absolute;
right: 5px;
top: 5px;
font-size: 30px;
}
.right_side .detail_page .box a{
color: #4E4E4E;
}
.paging{
float: left;
width: 100%;
margin-top: 20px;
margin-bottom: 20px;
}
.paging ul{
float: left;
width: 100%;
}
.paging li{
float: left;
list-style: none;
margin-right: 5px;
}
.paging li a{
float: left;
width: 35px;
height: 35px;
text-align: center;
border-radius: 3px;
border: 2px solid #092c61;
background: #092c61;
color: #FFF;
font-size: 15px;
line-height: 2.3em;
font-family: 'open_sanssemibold';
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
}
.paging li a:hover, .paging li a.active{
border: 2px solid #fe0000;
background: #fe0000;
color: #FFF;
}
.footer_top{
float: left;
width: 100%;
padding-top: 50px;
padding-bottom: 30px;
background: #092c61;
}
.footer_top .grid{
float: left;
width: 100%;
display: grid;
grid-template-columns: auto auto auto;
grid-gap: 20px;
}
.footer_top .grid > div {
text-align: left;
}
.footer_top .side{
float: left;
width: 100%;
}
.footer_top .side .title{
float: left;
width: 100%;
margin-bottom: 20px;
font-family: 'open_sanssemibold';
font-size: 18px;
color: #FFF;
}
.footer_top .side .loc{
float: left;
width: 100%;
margin-bottom: 10px;
font-family: 'open_sansregular';
color: #FFF;
font-size: 15px;
}
.footer_top .side .loc a{
color: #FFF;
}
.footer_top .side .loc i{
float: left;
width: 30px;
height: 40px;
text-align: left;
font-size: 16px;
margin-top: 2px;
}
.footer_top .side .link{
float: left;
width: 100%;
margin-bottom: 15px;
font-family: 'open_sansregular';
color: #FFF;
font-size: 15px;
}
.footer_top .side .link a{
color: #FFF;
}
.footer_bottom{
float: left;
width: 100%;
padding-top: 20px;
padding-bottom: 20px;
background: #f5f6f7;
color: #404040;
font-family: 'open_sanssemibold';
font-size: 12px;
text-align: center;
}
#back-to-top {
position: fixed;
bottom: 10px;
right: 20px;
z-index: 9999;
width: 45px;
height: 45px;
text-align: center;
background: url(//bsi.asia/wp-content/themes/bahari/assets/images/top.png) no-repeat center #000;
color: #FFF;
cursor: pointer;
border: 0;
border-radius: 2px;
text-decoration: none;
transition: all 0.3s ease-out; 
-webkit-transition: all 0.3s ease-out;
opacity: 0;
-webkit-box-shadow: 0px 0px 5px -1px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 0px 5px -1px rgba(0,0,0,0.5);
box-shadow: 0px 0px 5px -1px rgba(0,0,0,0.5);
}
#back-to-top:hover {
opacity: 0.5;
}
#back-to-top.show {
opacity: 1;
}
}
@media screen and (min-width:1180px){
.container_24{
margin-left: auto;
margin-right: auto;
width: 90%;
}
.container_25{
margin-left: auto;
margin-right: auto;
width: 80%;
}
}
@media screen and (min-width:990px) and (max-width:1179px) {
.container_24{
margin-left: auto;
margin-right: auto;
width: 95%;
}
.container_25{
margin-left: auto;
margin-right: auto;
width: 85%;
}
}
 @media screen and (min-width:0px) and (max-width:989px) {
nav:not(.mm-menu){
display: none;
}
.menu-mobile{
text-align: left;
float: left;
z-index: 10;
position: relative;
}
.menu-mobile{
font-size: 16px;
margin-top: 5px;
font-weight: bold;
color: #000;
line-height: 47px;
-moz-box-sizing: border-box;
box-sizing: border-box;	
}
.menu-mobile .fixed{
position: fixed;
top: 0;
left: 0;
}
.menu-mobile .menu-mobile a{
background: center center no-repeat transparent;
background-image:url(//bsi.asia/wp-content/themes/bahari/assets/images/mob.png);
display: block;
width: 30px;
height: 29px;
top: 0;
right: 0px;
float:left;
text-decoration:none;
}
.language{
float: left;
width: 100%;
}
.language .box{
float: right;
padding: 7px;
background: #FFF;
font-family: 'open_sanssemibold';
}
.language .box img{
float: left;
width: 18px;
}
:root .css3-metro-dropdown option,
:root .css3-metro-dropdown:after,
:root .css3-metro-dropdown::after,
:root .css3-metro-dropdown select
{
color: #FFF;
cursor: pointer;
}
:root .css3-metro-dropdown select,
:root .css3-metro-dropdown:after,
:root .css3-metro-dropdown::after
{
display: block;
background: none;
color: #FFF;
}
:root .css3-metro-dropdown select,
:root .css3-metro-dropdown option
{
color: #FFF;
}
:root .css3-metro-dropdown
{
position: relative;
display: inline-block;
border-left: none;
}
:root .css3-metro-dropdown::after
{
content: "\25bc";
position: absolute;
top: 0;
right: 0;
display: block;
width: 20px;
font-size: 8px;
line-height: 12px;
text-align: center;
-webkit-pointer-events: none;
-moz-pointer-events: none;
pointer-events: none;
}
:root .css3-metro-dropdown select
{
height: 12px;
border: 0;
vertical-align: middle;
font-family: 'open_sanssemibold';
font-size: 10px;
outline: 0 none;
}
:root .css3-metro-dropdown option
{
background:none;
color: #FFF;
border:none;
cursor:pointer;
} :root .css3-metro-dropdown-color-ff2e12 select
{
background: #FFF;
color: #d70000;
}
:root .css3-metro-dropdown-color-ff2e12:after
{
background: #FFF;
color: #d70000;
}
:root .css3-metro-dropdown-color-ff2e12::after
{
background: #FFF;
color: #d70000;
}
body{
margin: 0px;
background: #f5f6f7;
}
.container_24{
margin-left: auto;
margin-right: auto;
width: 90%;
}
.container_25{
margin-left: auto;
margin-right: auto;
width: 90%;
}
.left_side{
float: left;
width: 100%;
margin-top: 10px;
margin-bottom: 10px;
padding: 2.5%;
background: #FFF;
border-radius: 5px;
-webkit-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.2);
box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.2);
}
.left_side .logo{
float: left;
width: 100%;
text-align: center;
margin-top: -40px;
}
.left_side .logo img{
width: 150px;
}
.left_side .menu{
display: none;
}
.left_side .menu li{
float: left;
width: 90%;
padding: 5%;
list-style: none;
border-radius: 5px;
background: #092c61;
margin-bottom: 10px;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
}
.left_side .menu a:nth-last-child(1) li{
margin-bottom: 0px;
}
.left_side .menu li:hover, .left_side .menu li.active{
background: #27a6dc;
}
.left_side .menu a li{
color: #FFF;
font-size: 13px;
font-family: 'open_sansbold';
letter-spacing: 1px;
}
.right_side{
float: left;
width: 100%;
}
.right_side .contact_top{
float: left;
width: 100%;
}
.right_side .contact_top .slogan{
float: left;
width: 100%;
padding: 3%;
background: #fe0000;
-webkit-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.4);
-moz-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.4);
box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.4);
margin-bottom: 10px;
}
.right_side .contact_top .slogan .text{
padding-bottom: 10px;
color: #FFF;
text-align: justify;
font-size: 14px;
font-family: 'open_sansregular';
line-height: 1.7em;
}
.right_side .contact_top .phone{
float: left;
width: 100%;
background: #FFF;
border-radius: 5px;
margin-bottom: 20px;
-webkit-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.4);
-moz-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.4);
box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.4);
overflow: hidden;
}
.right_side .contact_top .phone .side1{
float: left;
width: 100%;
padding: 3%;
background: #092c61;
color: #FFF;
font-size: 14px;
font-family: 'open_sansbold';
letter-spacing: 1px;
line-height: 1.7em;
}
.right_side .contact_top .phone .side1 i{
float: left;
width: 23px;
height: 23px;
font-size: 13px;
border-radius: 50%;
background: #DDD;
text-align: center;
color: #3c4044;
line-height: 1.5em;
margin-right: 10px;
}
.right_side .contact_top .phone .side2{
float: left;
width: 100%;
color: #fe0000;
font-size: 18px;
font-family: 'open_sansbold';
text-align: center;
padding : 2%;
}
.right_side .contact_top .phone .side2 a{
float: left;
color: #fe0000;
width: 50%;
margin-top: 5px;
margin-bottom: 0px;
}
.right_side .contact_top .phone .side2 a{
color: #fe0000;
float: left;
width: 97%;
margin: 1.5%;
margin-bottom: 5px;
}
.right_side .contact_top .phone .side3{
float: left;
width: 100%;
color: #5E5D5D;
text-align: center;
font-size: 11px;
margin-bottom: 10px;
padding : 3%;
font-family: 'open_sansregular';
}
.right_side .about_home{
float: left;
width: 100%;
overflow: hidden;
text-align: justify;
}
.right_side .about_home .name{
float: left;
width: 100%;
margin-bottom: 10px;
color: #092c61;
font-family: 'open_sansbold';
font-size: 24px;
}
.right_side .about_home p{
font-family: 'open_sanssemibold';
font-size: 16px;
line-height: 1.5em;
padding-bottom: 10px;
}
.right_side .listing{
float: left;
width: 100%;
margin-top: 30px;
overflow: hidden;
}
.right_side .listing .top{
float: left;
width: 100%;
margin-bottom: 15px;
font-family: 'open_sansbold';
font-size: 20px;
color: #092c61;
}
.right_side .listing .top .sort{
float: right;
width: 170px;
margin-right: 2px;
font-family: 'open_sanssemibold';
} .dropdown {
width: 100%;
border-radius: 5px;
display: inline-block;
background-color: #FFF;
-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
transition: all .5s ease;
position: relative;
font-size: 13px;
color: #8c8c8c;
height: 100%;
text-align: left;
}
.dropdown .select {
cursor: pointer;
display: block;
padding: 10px
}
.dropdown .select > i {
font-size: 13px;
color: #888;
cursor: pointer;
transition: all .3s ease-in-out;
float: right;
line-height: 18px
}
.dropdown:hover {
box-shadow: 0 0 4px rgb(204, 204, 204)
}
.dropdown:active {
background-color: #f8f8f8
}
.dropdown.active:hover,
.dropdown.active {
box-shadow: 0 0 4px rgb(204, 204, 204);
border-radius: 5px 5px 0 0;
background-color: #f8f8f8
}
.dropdown.active .select > i {
transform: rotate(-180deg)
}
.dropdown .dropdown-menu {
position: absolute;
background-color: #fff;
width: 100%;
left: 0;
margin-top: 1px;
box-shadow: 0 1px 2px rgb(204, 204, 204);
border-radius: 0 1px 5px 5px;
overflow: hidden;
display: none;
max-height: 144px;
overflow-y: auto;
z-index: 9
}
.dropdown .dropdown-menu li {
padding: 10px;
transition: all .2s ease-in-out;
cursor: pointer
} 
.dropdown .dropdown-menu {
padding: 0;
list-style: none
}
.dropdown .dropdown-menu li:hover {
background-color: #f2f2f2
}
.dropdown .dropdown-menu li:active {
background-color: #e2e2e2
}
.right_side .listing .grid{
float: left;
width: 100%;
display: grid;
grid-template-columns: auto;
grid-gap: 20px;
}
.right_side .listing .grid > div {
text-align: center;
}
.right_side .listing .box{
float: left;
width: 100%;
overflow: hidden;
background: #FFF;
-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
}
.right_side .listing .box .pic{
float: left;
width: 100%;
height: 190px;
margin-bottom: 10px;
overflow: hidden;
text-align: center;
}
.right_side .listing .box .pic img{
width: 100%;
height: 100%;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
}
.right_side .listing .box .pic img:hover{
opacity: 0.5;
transform: scale(1.05);
}
.right_side .listing .box .text{
float: left;
width: 95%;
margin: 2.5%;
margin-top: 0%;
margin-bottom: 0%;
font-family: 'open_sansregular';
font-size: 13px;
line-height: 1.5em;
color: #000;
}
.right_side .listing .box .text .name{
float: left;
width: 100%;
text-align: center;
font-family: 'open_sansbold';
font-size: 15px;
color: #092c61;
margin-bottom: 10px;
}
.right_side .listing .box .text table{
float: left;
width: 100%;
}
.right_side .listing .box .text table td{
float: left;
width: 50%;
box-shadow: inset 0px 0px 0px 1px rgba(221,221,221,1); 
padding: 5px;
}	
.right_side .listing .box .text table td.colspan{
float: left;
width: 100%;
box-shadow: inset 0px 0px 0px 1px rgba(221,221,221,1); 
padding: 5px;
margin-bottom: -1px;
}	
*{
box-sizing: border-box;
}
.right_side .about_page{
float: left;
width: 90%;
padding: 5%;
background: #FFF;
margin-top: 20px;
margin-bottom: 50px;
-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
}
.right_side .about_page .logo{
float: left;
width: 100%;
text-align: center;
margin-bottom: 30px;
}
.right_side .about_page .logo img{
width: 100%;
max-width: 120px;
}
.right_side .about_page .text{
float: left;
width: 100%;
line-height: 1.9em;
font-family: 'open_sansregular';
font-size: 15px;
color: #092c61;
margin-bottom: 30px;
}
.right_side .about_page .text p{
padding-bottom: 10px;
}
.right_side .about_page .text li{
padding-left: 0px;
margin-left: 10px;
padding-bottom: 10px;
}
.right_side .about_page .text h1{
float: left;
width: 100%;
font-family: 'open_sansbold';
color: #fe0000;
font-size: 28px;
margin-bottom: 20px;
}
.right_side .about_page .text table{
float: left;
width: 100%;
line-height: 1.5em;
}
.right_side .about_page .text tr{
background: rgba(221, 221, 221, 0.5);
}
.right_side .about_page .text td{
padding: 10px;
}
.right_side .about_page .text .one{
font-size: 14px;
font-family: 'open_sansbold';
padding: 2.5px;
width: 25px;
background: #fe0000;
color: #FFF;
text-align: center;
}
.right_side .about_page .text .two{
font-size: 17px;
font-family: 'open_sansbold';
color: #092c61;
}
.right_side .about_page .text .three{
color: #092c61;
}
.right_side .about_page .name{
float: left;
width: 100%;
margin-bottom: 20px;
font-family: 'open_sansbold';
font-size: 16px;
color: #4E4E4E;
}
.right_side .about_page .grid_marketing{
float: left;
width: 100%;
display: grid;
grid-template-columns: auto auto;
grid-gap: 15px;
margin-bottom: 80px;
}
.right_side .about_page .grid_marketing > div {
text-align: left;
}
.right_side .about_page .box_marketing{
float: left;
width: 94%;
height: 250px;
max-width: 200px;
text-align: center;
background: #092c61;
padding: 3%;
}
.right_side .about_page .box_marketing .pic{
float: left;
width: 100%;
height: 160px;
overflow: hidden;
margin-bottom: 10px;
}
.right_side .about_page .box_marketing .pic img{
width: 100%;
height: 100%;
}
.right_side .about_page .box_marketing .desc{
float: left;
width: 100%;
height: 70px;
overflow: hidden;
color: #FFF;
font-size: 13px;
text-align: center;
font-family: 'open_sanssemibold';
}
.right_side .about_page .box_marketing .desc .list{
float: left;
width: 100%;
margin-bottom: 7px;
}
.right_side .about_page .grid{
float: left;
width: 100%;
display: grid;
grid-template-columns: auto auto auto;
grid-gap: 30px;
margin-bottom: 50px;
}
.right_side .about_page .grid > div {
text-align: left;
}
.right_side .about_page .box{
float: left;
width: 100%;
height: 100px;
text-align: center;
}
.right_side .about_page .box img{
width: 100%;
height: 100%;
}
.right_side .about_page form{
float: left;
width: 100%;
}
.right_side .about_page .input{
float: left;
width: 95%;
padding-left: 5%;
height: 45px;
margin-bottom: 20px;
background: #f3f6fa;
border-radius: 5px;
border: none;
font-size: 15px;
font-family: 'open_sanssemibold';
color: #000;
-webkit-box-shadow: inset 0px 0px 0px 1px rgba(220,228,239,1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(220,228,239,1);
box-shadow: inset 0px 0px 0px 1px rgba(220,228,239,1);
}
.right_side .about_page textarea{
float: left;
width: 95%;
padding: 2.5%;
height: 100px;
margin-bottom: 20px;
background: #f3f6fa;
border-radius: 5px;
border: none;
font-size: 15px;
font-family: 'open_sanssemibold';
color: #000;
-webkit-box-shadow: inset 0px 0px 0px 1px rgba(220,228,239,1);
-moz-box-shadow: inset 0px 0px 0px 1px rgba(220,228,239,1);
box-shadow: inset 0px 0px 0px 1px rgba(220,228,239,1);
}
.right_side .about_page .button{
float: left;
padding: 15px;
border-radius: 5px;
padding-left: 40px;
padding-right: 40px;
color: #FFF;
font-family: 'open_sansbold';
font-size: 16px;
background: #092c61;
border: none;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
}
.right_side .about_page .button:hover{
background: #2da8dd;
}
.right_side .detail_page{
float: left;
width: 100%;
padding: 5%;
background: #FFF;
margin-top: 20px;
margin-bottom: 20px;
-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.2);
}
.right_side .detail_page .title{
float: left;
width: 100%;
margin-bottom: 30px;
font-family: 'open_sanssemibold';
font-size: 25px;
color: #4E4E4E;
letter-spacing: 1px;
}
.right_side .detail_page .text{
float: left;
width: 100%;
line-height: 1.7em;
font-family: 'open_sanssemibold';
font-size: 15px;
color: #4E4E4E;
margin-bottom: 30px;
}
.right_side .detail_page .text p{
padding-bottom: 10px;
}
.right_side .detail_page .text table{
float: left;
width: 100%;
font-family: 'open_sansregular';
font-size: 13px;
line-height: 1.5em;
color: #000;
}
.right_side .detail_page .text table p{
padding: 0;
}
.right_side .detail_page .text table td{
float: left;
width: 50%;
box-shadow: inset 0px 0px 0px 1px rgba(221,221,221,1); 
padding: 5px;
}	
.right_side .detail_page .text table td.colspan{
float: left;
width: 100%;
box-shadow: inset 0px 0px 0px 1px rgba(221,221,221,1); 
padding: 5px;
margin-bottom: -1px;
}		
.right_side .detail_page .text li{
padding-left: 0px;
padding-bottom: 10px;
}
.right_side .detail_page .grid{
float: left;
width: 100%;
display: grid;
grid-template-columns: auto auto;
grid-gap: 10px;
}
.right_side .detail_page .grid > div {
text-align: left;
}
.right_side .detail_page .box{
float: left;
width: 100%;
height: 120px;
text-align: center;
position: relative;
overflow: hidden;
}
.right_side .detail_page .box img{
width: 100%;
height: 100%;
}
.right_side .detail_page .box .back{
opacity: 0;
-webkit-transition-duration: 0.1s;
transition-duration: 0.1s;
}
.right_side .detail_page .box:hover .back{
opacity: 1;
position: absolute;
right: 5px;
top: 5px;
font-size: 20px;
}
.right_side .detail_page .box a{
color: #4E4E4E;
}
.paging{
float: left;
width: 100%;
margin-top: 30px;
margin-bottom: 30px;
}
.paging ul{
float: left;
width: 100%;
}
.paging li{
float: left;
list-style: none;
margin-right: 5px;
}
.paging li a{
float: left;
width: 35px;
height: 35px;
text-align: center;
border-radius: 3px;
border: 2px solid #092c61;
background: #092c61;
color: #FFF;
font-size: 15px;
line-height: 2.3em;
font-family: 'open_sanssemibold';
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
}
.paging li a:hover, .paging li a.active{
border: 2px solid #fe0000;
background: #fe0000;
color: #FFF;
}
.footer_top{
float: left;
width: 100%;
padding-top: 30px;
padding-bottom: 30px;
background: #092c61;
}
.footer_top .grid{
float: left;
width: 100%;
display: grid;
grid-template-columns: auto;
grid-gap: 20px;
}
.footer_top .grid > div {
text-align: left;
}
.footer_top .side{
float: left;
width: 100%;
}
.footer_top .side .title{
float: left;
width: 100%;
margin-bottom: 20px;
font-family: 'open_sanssemibold';
font-size: 16px;
color: #FFF;
}
.footer_top .side .loc{
float: left;
width: 100%;
margin-bottom: 10px;
font-family: 'open_sansregular';
color: #FFF;
font-size: 15px;
}
.footer_top .side .loc i{
float: left;
width: 30px;
height: 30px;
text-align: left;
font-size: 14px;
margin-top: 3px;
}
.footer_top .side .loc a{
color: #FFF;
}
.footer_top .side .link{
float: left;
width: 100%;
margin-bottom: 15px;
font-family: 'open_sansregular';
color: #FFF;
font-size: 14px;
}
.footer_top .side .link a{
color: #FFF;
}
.footer_bottom{
float: left;
width: 100%;
padding-top: 15px;
padding-bottom: 15px;
background: #f5f6f7;
color: #404040;
font-family: 'open_sanssemibold';
font-size: 12px;
text-align: center;
}
#back-to-top {
position: fixed;
bottom: 10px;
right: 10px;
z-index: 9999;
width: 45px;
height: 45px;
text-align: center;
background: url(//bsi.asia/wp-content/themes/bahari/assets/images/top.png) no-repeat center #000;
color: #FFF;
cursor: pointer;
border: 0;
border-radius: 2px;
text-decoration: none;
transition: all 0.3s ease-out; 
-webkit-transition: all 0.3s ease-out;
opacity: 0;
-webkit-box-shadow: 0px 0px 5px -1px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 0px 5px -1px rgba(0,0,0,0.5);
box-shadow: 0px 0px 5px -1px rgba(0,0,0,0.5);
}
#back-to-top:hover {
opacity: 0.5;
}
#back-to-top.show {
opacity: 1;
}
}article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; font-size: 13px; line-height: 1.231; }
body, button, input, select, textarea { font-family: sans-serif; color: #222; }
::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; }
a {
color: #206BB7;
text-decoration:none;
}
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
ul, ol {
margin-top: 0px;
margin-right: 0;
margin-bottom: 1em;
margin-left: 0;
padding-top: 0;
padding-right: 0;
padding-bottom: 0;
padding-left: 40px;
}
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }
form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; *overflow: visible; }
table button, table input { *overflow: auto; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }
table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }  body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
margin:0;
padding:0;
}
html,body {
margin:0;
padding:0;
}
table {
border-collapse:collapse;
border-spacing:0;
}
fieldset,img { 
border:0;
}
address,caption,cite,code,dfn,th,var {
font-style:normal;
font-weight:normal;
}
caption,th {
text-align:left;
}
h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:normal;
}
q:before,q:after {
content:'';
}
abbr,acronym { border:0;
}
/@font-face {
font-family: 'open_sansbold';
src: url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Bold-webfont.eot);
src: url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Bold-webfont.eot?#iefix) format('embedded-opentype'),
url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Bold-webfont.woff) format('woff'),
url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Bold-webfont.ttf) format('truetype'),
url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Bold-webfont.svg#open_sansbold) format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'open_sansregular';
src: url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Regular-webfont.eot);
src: url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Regular-webfont.eot?#iefix) format('embedded-opentype'),
url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Regular-webfont.woff) format('woff'),
url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Regular-webfont.ttf) format('truetype'),
url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Regular-webfont.svg#open_sansregular) format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'open_sanssemibold';
src: url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Semibold-webfont.eot);
src: url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Semibold-webfont.eot?#iefix) format('embedded-opentype'),
url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Semibold-webfont.woff2) format('woff2'),
url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Semibold-webfont.woff) format('woff'),
url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Semibold-webfont.ttf) format('truetype'),
url(//bsi.asia/wp-content/themes/bahari/assets/font/OpenSans-Semibold-webfont.svg#open_sanssemibold) format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'MotoyaLCedar-W3-90ms-RKSJ-H';
src: url(//bsi.asia/wp-content/themes/bahari/assets/font/MotoyaLCedar-W3-90ms-RKSJ-H.eot?#iefix) format('embedded-opentype'),  url(//bsi.asia/wp-content/themes/bahari/assets/font/MotoyaLCedar-W3-90ms-RKSJ-H.woff) format('woff'), url(//bsi.asia/wp-content/themes/bahari/assets/font/MotoyaLCedar-W3-90ms-RKSJ-H.ttf)  format('truetype'), url(//bsi.asia/wp-content/themes/bahari/assets/font/MotoyaLCedar-W3-90ms-RKSJ-H.svg#MotoyaLCedar-W3-90ms-RKSJ-H) format('svg');
font-weight: normal;
font-style: normal;
}.mm-menu.mm-horizontal > .mm-panel {
-webkit-transition: -webkit-transform 0.4s ease;
transition: transform 0.4s ease; }
.mm-menu .mm-hidden {
display: none; }
.mm-wrapper {
overflow-x: hidden;
position: relative; }
.mm-menu,
.mm-menu > .mm-panel {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 0; }
.mm-menu {
background: inherit;
display: block;
overflow: hidden;
padding: 0; }
.mm-menu > .mm-panel {
background:#092c61;
color: #FFF;
font-size: 13px;
font-family: 'open_sansbold';
letter-spacing: 1px;
line-height: 1;
-webkit-overflow-scrolling: touch;
overflow: scroll;
overflow-x: hidden;
overflow-y: auto;
box-sizing: border-box;
-webkit-transform: translate(100%, 0);
-moz-transform: translate(100%, 0);
-ms-transform: translate(100%, 0);
-o-transform: translate(100%, 0);
transform: translate(100%, 0); }
.mm-menu > .mm-panel.mm-opened {
-webkit-transform: translate(0%, 0);
-moz-transform: translate(0%, 0);
-ms-transform: translate(0%, 0);
-o-transform: translate(0%, 0);
transform: translate(0%, 0); }
.mm-menu > .mm-panel.mm-subopened {
-webkit-transform: translate(-30%, 0);
-moz-transform: translate(-30%, 0);
-ms-transform: translate(-30%, 0);
-o-transform: translate(-30%, 0);
transform: translate(-30%, 0); }
.mm-menu > .mm-panel.mm-highest {
z-index: 1; }
.mm-menu .mm-list {
padding: 20px 0; }
.mm-menu > .mm-list {
padding-bottom: 0; }
.mm-menu > .mm-list:after {
content: '';
display: block;
height: 40px; }
.mm-panel > .mm-list {
margin-left: -20px;
margin-right: -20px; }
.mm-panel > .mm-list:first-child {
padding-top: 0; }
.mm-list,
.mm-list > li {
list-style: none;
display: block;
padding: 0;
margin: 0; }
.mm-list {
font: inherit;
font-size: 14px; }
.mm-list a,
.mm-list a:hover {
text-decoration: none; }
.mm-list > li {
position: relative; }
.mm-list > li > a,
.mm-list > li > span {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
color: inherit;
line-height: 20px;
display: block;
padding: 10px 10px 10px 20px;
margin: 0; }
.mm-list > li:not(.mm-subtitle):not(.mm-label):not(.mm-search):not(.mm-noresults):after {
content: '';
width:100%;
height:1px;
background:none;
display: block;
width: 2px;
position: absolute;
bottom: 0;
left: 0; }
.mm-list > li:not(.mm-subtitle):not(.mm-label):not(.mm-search):not(.mm-noresults):after {
width: auto;
position: relative;
left: auto; }
.mm-list a.mm-subopen {
background: rgba(3, 2, 1, 0);
width: 100%;
height: 100%;
padding: 0;
position: absolute;
right: 0;
top: 0;
z-index: 2; }
.mm-list a.mm-subopen:before {
content: '';
border-left-width: 0px;
border-left-style: solid;
display: block;
height: 100%;
position: absolute;
left: 0;
top: 0; }
.mm-list a.mm-subopen.mm-fullsubopen {
width: 100%; }
.mm-list a.mm-subopen.mm-fullsubopen:before {
border-left: none; }
.mm-list a.mm-subopen + a,
.mm-list a.mm-subopen + span {
padding-right: 5px;
margin-right: 40px; }
.mm-list > li.mm-selected > a.mm-subopen {
background: transparent; }
.mm-list > li.mm-selected > a.mm-fullsubopen + a,
.mm-list > li.mm-selected > a.mm-fullsubopen + span {
padding-right: 45px;
margin-right: 0; }
.mm-list a.mm-subclose {
text-indent: 20px;
padding-top: 30px;
margin-top: -20px; }
.mm-list > li.mm-label {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
font-size: 10px;
text-transform: uppercase;
text-indent: 20px;
line-height: 25px;
padding-right: 5px; }
.mm-list > li.mm-spacer {
padding-top: 40px; }
.mm-list > li.mm-spacer.mm-label {
padding-top: 25px; }
.mm-list a.mm-subopen:after,
.mm-list a.mm-subclose:before {
content: '';
border: 2px solid transparent;
display: inline-block;
width: 7px;
height: 7px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
margin-bottom: -5px;
position: absolute;
bottom: 50%; }
.mm-list a.mm-subopen:after {
border-top: none;
border-left: none;
right: 18px; }
.mm-list a.mm-subclose:before {
border-right: none;
border-bottom: none;
margin-bottom: -15px;
left: 22px; }
.mm-menu.mm-vertical .mm-list .mm-panel {
display: none;
padding: 10px 0 10px 10px; }
.mm-menu.mm-vertical .mm-list .mm-panel li:last-child:after {
border-color: transparent; }
.mm-menu.mm-vertical .mm-list li.mm-opened > .mm-panel {
display: block; }
.mm-menu.mm-vertical .mm-list > li > a.mm-subopen {
height: 40px; }
.mm-menu.mm-vertical .mm-list > li > a.mm-subopen:after {
top: 16px;
bottom: auto; }
.mm-menu.mm-vertical .mm-list > li.mm-opened > a.mm-subopen:after {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg); }
.mm-menu.mm-vertical .mm-list > li.mm-label > a.mm-subopen {
height: 25px; }
html.mm-opened .mm-page {
}
.mm-menu {
background:none;
color: rgba(0, 0, 0, 0.6); }
.mm-menu .mm-list > li:after {
border-color: rgba(0,0, 0, 0.15); }
.mm-menu .mm-list > li > a.mm-subclose {
background: rgba(0, 0, 0, 0.1);
color: rgba(0, 0, 0, 0.3); }
.mm-menu .mm-list > li > a.mm-subopen:after, .mm-menu .mm-list > li > a.mm-subclose:before {
border-color: rgba(0, 0, 0, 0.3); }
.mm-menu .mm-list > li > a.mm-subopen:before {
border-color: rgba(0, 0, 0, 0.15); }
.mm-menu .mm-list > li.mm-selected > a:not(.mm-subopen),
.mm-menu .mm-list > li.mm-selected > span {
background: rgba(0, 0, 0, 0.1); }
.mm-menu .mm-list > li.mm-label {
background: rgba(0, 0, 0, 0.05); }
.mm-menu.mm-vertical .mm-list li.mm-opened > a.mm-subopen,
.mm-menu.mm-vertical .mm-list li.mm-opened > ul {
background: rgba(0, 0, 0, 0.05); } .mm-page {
box-sizing: border-box;
position: relative; }
.mm-slideout {
-webkit-transition: -webkit-transform 0.4s ease;
-ms-transition: -ms-transform 0.4s ease;
transition: transform 0.4s ease; }
html.mm-opened {
overflow: hidden;
position: relative; }
html.mm-opened body {
overflow: hidden; }
html.mm-background .mm-page {
background: inherit; }
#mm-blocker {
background: none;
display: none;
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 999999; }
html.mm-opened #mm-blocker,
html.mm-blocking #mm-blocker {
display: block; }
.mm-menu.mm-offcanvas {
display: none;
position: fixed; }
.mm-menu.mm-current {
display: block; }
.mm-menu {
width: 80%;
min-width: 240px;
max-width: 440px; }
html.mm-opening .mm-slideout {
-webkit-transform: translate(80%, 0);
-moz-transform: translate(80%, 0);
-ms-transform: translate(80%, 0);
-o-transform: translate(80%, 0);
transform: translate(80%, 0); }
@media all and (max-width: 175px) {
html.mm-opening .mm-slideout {
-webkit-transform: translate(140px, 0);
-moz-transform: translate(140px, 0);
-ms-transform: translate(140px, 0);
-o-transform: translate(140px, 0);
transform: translate(140px, 0); } }
@media all and (min-width: 550px) {
html.mm-opening .mm-slideout {
-webkit-transform: translate(440px, 0);
-moz-transform: translate(440px, 0);
-ms-transform: translate(440px, 0);
-o-transform: translate(440px, 0);
transform: translate(440px, 0); } } .mm-buttonbar {
border: 1px solid transparent;
border-radius: 5px;
text-align: center;
line-height: 20px;
overflow: hidden;
display: block;
padding: 0;
margin: 0;
position: relative; }
.mm-buttonbar:after {
content: '';
display: block;
clear: both; }
.mm-buttonbar > * {
border-left: 1px solid transparent;
box-sizing: border-box;
display: block;
width: 100%;
height: 100%;
float: left;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden; }
.mm-buttonbar > a {
text-decoration: none; }
.mm-buttonbar > input {
position: absolute;
left: -1000px;
top: -1000px; }
.mm-buttonbar > input:checked + label {
border-color: transparent  !important; }
.mm-buttonbar > *:first-child,
.mm-buttonbar > input:first-child + * {
border-left: none; }
.mm-buttonbar.mm-buttonbar-2 > * {
width: 50%; }
.mm-buttonbar.mm-buttonbar-3 > * {
width: 33.33%; }
.mm-buttonbar.mm-buttonbar-4 > * {
width: 25%; }
.mm-buttonbar.mm-buttonbar-5 > * {
width: 20%; }
.mm-header .mm-buttonbar {
margin-top: 20px;
margin-left: -30px;
margin-right: -30px; }
.mm-footer .mm-buttonbar {
border: none;
border-radius: none;
line-height: 40px;
margin: -10px -10px 0 -20px; }
.mm-footer .mm-buttonbar > * {
border-left: none; }
.mm-list > li > .mm-buttonbar {
margin: 10px 20px; }
.mm-menu .mm-buttonbar {
border-color: rgba(255, 255, 255, 0.6);
background: #333333; }
.mm-menu .mm-buttonbar > * {
border-color: rgba(255, 255, 255, 0.6); }
.mm-menu .mm-buttonbar > input:checked + label {
background: rgba(255, 255, 255, 0.6);
color: #333333; } em.mm-counter {
font: inherit;
font-size: 14px;
font-style: normal;
text-indent: 0;
line-height: 20px;
display: block;
margin-top: -10px;
position: absolute;
right: 40px;
top: 50%; }
em.mm-counter + a.mm-subopen {
padding-left: 40px; }
em.mm-counter + a.mm-subopen + a,
em.mm-counter + a.mm-subopen + span {
margin-right: 80px; }
em.mm-counter + a.mm-fullsubopen {
padding-left: 0; }
.mm-vertical em.mm-counter {
top: 12px;
margin-top: 0; }
.mm-nosubresults > em.mm-counter {
display: none; }
.mm-menu em.mm-counter {
color: rgba(255, 255, 255, 0.3); } html.mm-opened.mm-dragging .mm-menu,
html.mm-opened.mm-dragging .mm-page,
html.mm-opened.mm-dragging .mm-fixed-top,
html.mm-opened.mm-dragging .mm-fixed-bottom,
html.mm-opened.mm-dragging #mm-blocker {
-webkit-transition-duration: 0s;
-moz-transition-duration: 0s;
-ms-transition-duration: 0s;
-o-transition-duration: 0s;
transition-duration: 0s; } .mm-footer {
background: inherit;
border-top: 1px solid transparent;
text-align: center;
line-height: 20px;
box-sizing: border-box;
width: 100%;
height: 40px;
padding: 10px 10px 0 20px;
position: absolute;
z-index: 2;
bottom: 0;
left: 0; }
.mm-menu.mm-hasfooter > .mm-panel:after {
height: 80px; }
.mm-menu .mm-footer {
border-color: rgba(0, 0, 0, 0.15);
color: rgba(255, 255, 255, 0.3); } .mm-header {
background: inherit;
border-bottom: 1px solid transparent;
text-align: center;
line-height: 20px;
box-sizing: border-box;
width: 100%;
height: 60px;
padding: 0 50px;
position: absolute;
z-index: 2;
top: 0;
left: 0; }
.mm-header .mm-title,
.mm-header .mm-prev,
.mm-header .mm-next,
.mm-header .mm-close {
padding-top: 30px; }
.mm-header .mm-title {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
display: inline-block;
width: 100%;
position: relative; }
.mm-header .mm-prev,
.mm-header .mm-next,
.mm-header .mm-close {
text-decoration: none;
display: block;
box-sizing: border-box;
min-width: 10px;
height: 100%;
position: absolute;
top: 0;
z-index: 1; }
.mm-header .mm-prev {
padding-left: 20px;
padding-right: 10px;
left: 0; }
.mm-header .mm-next,
.mm-header .mm-close {
padding-left: 10px;
padding-right: 20px;
right: 0; }
.mm-header [href].mm-prev:before, .mm-header [href].mm-next:after {
content: '';
border: 2px solid transparent;
display: inline-block;
width: 7px;
height: 7px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg); }
.mm-header [href].mm-prev:before {
border-right: none;
border-bottom: none;
margin-left: 2px;
margin-right: 5px; }
.mm-header [href].mm-next:after, .mm-header [href].mm-close:after {
margin-left: 5px;
margin-right: -2px; }
.mm-header [href].mm-next:after {
border-top: none;
border-left: none; }
.mm-header [href].mm-close:after {
content: 'x'; }
.mm-menu.mm-hassearch .mm-header {
height: 50px;
top: 50px; }
.mm-menu.mm-hassearch .mm-header .mm-title,
.mm-menu.mm-hassearch .mm-header .mm-prev,
.mm-menu.mm-hassearch .mm-header .mm-next,
.mm-menu.mm-hassearch .mm-header .mm-close {
padding-top: 20px; }
.mm-menu.mm-hasheader li.mm-subtitle {
display: none; }
.mm-menu.mm-hasheader > .mm-panel {
padding-top: 80px; }
.mm-menu.mm-hasheader > .mm-panel.mm-list {
padding-top: 60px; }
.mm-menu.mm-hasheader > .mm-panel > .mm-list:first-child {
margin-top: -20px; }
.mm-menu.mm-hasheader.mm-hassearch > .mm-panel {
padding-top: 120px; }
.mm-menu.mm-hasheader.mm-hassearch > .mm-panel.mm-list {
padding-top: 100px; }
.mm-menu .mm-header {
border-color: rgba(0, 0, 0, 0.15);
color: rgba(255, 255, 255, 0.3); }
.mm-menu .mm-header .mm-prev:before,
.mm-menu .mm-header .mm-next:after,
.mm-menu .mm-header .mm-close:after {
border-color: rgba(255, 255, 255, 0.3); } .mm-list li.mm-label > span {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
padding: 0;
line-height: 25px; }
.mm-list li.mm-label.mm-opened a.mm-subopen:after {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg); }
.mm-list li.mm-collapsed:not(.mm-uncollapsed) {
display: none; }
.mm-menu.mm-vertical .mm-list > li.mm-label > a.mm-subopen:after {
top: 8.5px; }
.mm-menu .mm-list li.mm-label > div > div {
background: rgba(255, 255, 255, 0.05); } .mm-search,
.mm-search input {
box-sizing: border-box; }
.mm-list > li.mm-search {
padding: 10px;
margin-top: -20px; }
.mm-list > li.mm-subtitle + li.mm-search {
margin-top: 0; }
div.mm-panel > div.mm-search {
padding: 0 0 10px 0; }
.mm-menu.mm-hasheader .mm-list > li.mm-search {
margin-top: 0; }
.mm-menu > .mm-search {
background: inherit;
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 2; }
.mm-search {
padding: 10px; }
.mm-search input {
border: none;
border-radius: 30px;
font: inherit;
font-size: 14px;
line-height: 30px;
outline: none;
display: block;
width: 100%;
height: 30px;
margin: 0;
padding: 0 10px; }
.mm-search input::-ms-clear {
display: none; }
.mm-menu .mm-noresultsmsg {
text-align: center;
font-size: 21px;
display: none;
padding: 60px 0; }
.mm-menu .mm-noresultsmsg:after {
border: none !important; }
.mm-noresults .mm-noresultsmsg {
display: block; }
.mm-menu li.mm-nosubresults > a.mm-subopen {
display: none; }
.mm-menu li.mm-nosubresults > a.mm-subopen + a,
.mm-menu li.mm-nosubresults > a.mm-subopen + span {
padding-right: 10px; }
.mm-menu.mm-hassearch > .mm-panel {
padding-top: 70px; }
.mm-menu.mm-hassearch > .mm-panel > .mm-list:first-child {
margin-top: -20px; }
.mm-menu.mm-hasheader > .mm-panel > div.mm-search:first-child {
margin-top: -10px; }
.mm-menu.mm-hasheader > .mm-panel > div.mm-search:first-child + .mm-list {
padding-top: 0; }
.mm-menu .mm-search input {
background: rgba(255, 255, 255, 0.3);
color: rgba(255, 255, 255, 0.6); }
.mm-menu .mm-noresultsmsg {
color: rgba(255, 255, 255, 0.3); } input.mm-toggle,
input.mm-check {
position: absolute;
left: -10000px; }
label.mm-toggle,
label.mm-check {
margin: 0;
position: absolute;
bottom: 50%;
z-index: 2; }
label.mm-toggle:before,
label.mm-check:before {
content: '';
display: block; }
label.mm-toggle {
border-radius: 30px;
width: 50px;
height: 30px;
margin-bottom: -15px; }
label.mm-toggle:before {
border-radius: 30px;
width: 28px;
height: 28px;
margin: 1px; }
input.mm-toggle:checked ~ label.mm-toggle:before {
float: right; }
label.mm-check {
width: 30px;
height: 30px;
margin-bottom: -15px; }
label.mm-check:before {
border-left: 3px solid;
border-bottom: 3px solid;
width: 40%;
height: 20%;
margin: 25% 0 0 20%;
opacity: 0.1;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg); }
input.mm-check:checked ~ label.mm-check:before {
opacity: 1; }
.mm-menu.mm-vertical .mm-list > li label.mm-toggle, .mm-menu.mm-vertical .mm-list > li label.mm-check {
bottom: auto;
margin-bottom: 0; }
.mm-menu.mm-vertical .mm-list > li label.mm-toggle {
top: 5px; }
.mm-menu.mm-vertical .mm-list > li label.mm-check {
top: 5px; }
label.mm-toggle, label.mm-check {
right: 20px; }
label.mm-toggle + a,
label.mm-toggle + span {
margin-right: 70px; }
label.mm-check + a,
label.mm-check + span {
margin-right: 50px; }
a.mm-subopen + label.mm-toggle, a.mm-subopen + label.mm-check {
right: 50px; }
a.mm-subopen + label.mm-toggle + a,
a.mm-subopen + label.mm-toggle + span {
margin-right: 100px; }
a.mm-subopen + label.mm-check + a,
a.mm-subopen + label.mm-check + span {
margin-right: 80px; }
em.mm-counter + a.mm-subopen + label.mm-toggle, em.mm-counter + a.mm-subopen + label.mm-check {
right: 90px; }
em.mm-counter + a.mm-subopen + label.mm-toggle + a,
em.mm-counter + a.mm-subopen + label.mm-toggle + span {
margin-right: 140px; }
em.mm-counter + a.mm-subopen + label.mm-check + a,
em.mm-counter + a.mm-subopen + label.mm-check + span {
margin-right: 120px; }
.mm-menu label.mm-toggle {
background: rgba(0, 0, 0, 0.15); }
.mm-menu label.mm-toggle:before {
background: #333333; }
.mm-menu input.mm-toggle:checked ~ label.mm-toggle {
background: #4bd963; }
.mm-menu label.mm-check:before {
border-color: rgba(255, 255, 255, 0.6); } html.mm-slide .mm-menu {
-webkit-transition: -webkit-transform 0.4s ease;
transition: transform 0.4s ease; }
html.mm-slide.mm-opened .mm-menu {
-webkit-transform: translateX(-30%);
-moz-transform: translateX(-30%);
-ms-transform: translateX(-30%);
-o-transform: translateX(-30%);
transform: translateX(-30%); }
html.mm-slide.mm-opening .mm-menu {
-webkit-transform: translateX(0%);
-moz-transform: translateX(0%);
-ms-transform: translateX(0%);
-o-transform: translateX(0%);
transform: translateX(0%); }
html.mm-slide.mm-right.mm-opened .mm-menu {
-webkit-transform: translateX(30%);
-moz-transform: translateX(30%);
-ms-transform: translateX(30%);
-o-transform: translateX(30%);
transform: translateX(30%); }
html.mm-slide.mm-right.mm-opening .mm-menu {
-webkit-transform: translateX(0%);
-moz-transform: translateX(0%);
-ms-transform: translateX(0%);
-o-transform: translateX(0%);
transform: translateX(0%); }
html.mm-slide.mm-top.mm-opened .mm-menu {
-webkit-transform: translateY(-30%);
-moz-transform: translateY(-30%);
-ms-transform: translateY(-30%);
-o-transform: translateY(-30%);
transform: translateY(-30%); }
html.mm-slide.mm-top.mm-opening .mm-menu {
-webkit-transform: translateY(0%);
-moz-transform: translateY(0%);
-ms-transform: translateY(0%);
-o-transform: translateY(0%);
transform: translateY(0%); }
html.mm-slide.mm-bottom.mm-opened .mm-menu {
-webkit-transform: translateY(30%);
-moz-transform: translateY(30%);
-ms-transform: translateY(30%);
-o-transform: translateY(30%);
transform: translateY(30%); }
html.mm-slide.mm-bottom.mm-opening .mm-menu {
-webkit-transform: translateY(0%);
-moz-transform: translateY(0%);
-ms-transform: translateY(0%);
-o-transform: translateY(0%);
transform: translateY(0%); }
html.mm-zoom-menu .mm-menu {
-webkit-transition: -webkit-transform 0.4s ease;
transition: transform 0.4s ease; }
html.mm-zoom-menu.mm-opened .mm-menu {
-webkit-transform: scale(0.7, 0.7) translateX(-30%);
-moz-transform: scale(0.7, 0.7) translateX(-30%);
-ms-transform: scale(0.7, 0.7) translateX(-30%);
-o-transform: scale(0.7, 0.7) translateX(-30%);
transform: scale(0.7, 0.7) translateX(-30%);
-webkit-transform-origin: left center;
-moz-transform-origin: left center;
-ms-transform-origin: left center;
-o-transform-origin: left center;
transform-origin: left center; }
html.mm-zoom-menu.mm-opening .mm-menu {
-webkit-transform: scale(1, 1) translateX(0%);
-moz-transform: scale(1, 1) translateX(0%);
-ms-transform: scale(1, 1) translateX(0%);
-o-transform: scale(1, 1) translateX(0%);
transform: scale(1, 1) translateX(0%); }
html.mm-zoom-menu.mm-right.mm-opened .mm-menu {
-webkit-transform: scale(0.7, 0.7) translateX(30%);
-moz-transform: scale(0.7, 0.7) translateX(30%);
-ms-transform: scale(0.7, 0.7) translateX(30%);
-o-transform: scale(0.7, 0.7) translateX(30%);
transform: scale(0.7, 0.7) translateX(30%);
-webkit-transform-origin: right center;
-moz-transform-origin: right center;
-ms-transform-origin: right center;
-o-transform-origin: right center;
transform-origin: right center; }
html.mm-zoom-menu.mm-right.mm-opening .mm-menu {
-webkit-transform: scale(1, 1) translateX(0%);
-moz-transform: scale(1, 1) translateX(0%);
-ms-transform: scale(1, 1) translateX(0%);
-o-transform: scale(1, 1) translateX(0%);
transform: scale(1, 1) translateX(0%); }
html.mm-zoom-menu.mm-top.mm-opened .mm-menu {
-webkit-transform: scale(0.7, 0.7) translateY(-30%);
-moz-transform: scale(0.7, 0.7) translateY(-30%);
-ms-transform: scale(0.7, 0.7) translateY(-30%);
-o-transform: scale(0.7, 0.7) translateY(-30%);
transform: scale(0.7, 0.7) translateY(-30%);
-webkit-transform-origin: center top;
-moz-transform-origin: center top;
-ms-transform-origin: center top;
-o-transform-origin: center top;
transform-origin: center top; }
html.mm-zoom-menu.mm-top.mm-opening .mm-menu {
-webkit-transform: scale(1, 1) translateY(0%);
-moz-transform: scale(1, 1) translateY(0%);
-ms-transform: scale(1, 1) translateY(0%);
-o-transform: scale(1, 1) translateY(0%);
transform: scale(1, 1) translateY(0%); }
html.mm-zoom-menu.mm-bottom.mm-opened .mm-menu {
-webkit-transform: scale(0.7, 0.7) translateY(30%);
-moz-transform: scale(0.7, 0.7) translateY(30%);
-ms-transform: scale(0.7, 0.7) translateY(30%);
-o-transform: scale(0.7, 0.7) translateY(30%);
transform: scale(0.7, 0.7) translateY(30%);
-webkit-transform-origin: center bottom;
-moz-transform-origin: center bottom;
-ms-transform-origin: center bottom;
-o-transform-origin: center bottom;
transform-origin: center bottom; }
html.mm-zoom-menu.mm-bottom.mm-opening .mm-menu {
-webkit-transform: scale(1, 1) translateY(0%);
-moz-transform: scale(1, 1) translateY(0%);
-ms-transform: scale(1, 1) translateY(0%);
-o-transform: scale(1, 1) translateY(0%);
transform: scale(1, 1) translateY(0%); }
html.mm-zoom-panels .mm-menu.mm-horizontal > .mm-panel {
-webkit-transform: scale(1.5, 1.5) translateX(100%);
-moz-transform: scale(1.5, 1.5) translateX(100%);
-ms-transform: scale(1.5, 1.5) translateX(100%);
-o-transform: scale(1.5, 1.5) translateX(100%);
transform: scale(1.5, 1.5) translateX(100%);
-webkit-transform-origin: left center;
-moz-transform-origin: left center;
-ms-transform-origin: left center;
-o-transform-origin: left center;
transform-origin: left center;
-webkit-transition-property: -webkit-transform, left;
transition-property: transform, left; }
html.mm-zoom-panels .mm-menu.mm-horizontal > .mm-panel.mm-opened {
-webkit-transform: scale(1, 1) translateX(0%);
-moz-transform: scale(1, 1) translateX(0%);
-ms-transform: scale(1, 1) translateX(0%);
-o-transform: scale(1, 1) translateX(0%);
transform: scale(1, 1) translateX(0%); }
html.mm-zoom-panels .mm-menu.mm-horizontal > .mm-panel.mm-opened.mm-subopened {
-webkit-transform: scale(0.7, 0.7) translateX(-30%);
-moz-transform: scale(0.7, 0.7) translateX(-30%);
-ms-transform: scale(0.7, 0.7) translateX(-30%);
-o-transform: scale(0.7, 0.7) translateX(-30%);
transform: scale(0.7, 0.7) translateX(-30%); } .mm-menu.mm-fullscreen {
width: 100%;
min-width: 140px;
max-width: 10000px; }
html.mm-opening.mm-fullscreen .mm-slideout {
-webkit-transform: translate(100%, 0);
-moz-transform: translate(100%, 0);
-ms-transform: translate(100%, 0);
-o-transform: translate(100%, 0);
transform: translate(100%, 0); }
@media all and (max-width: 140px) {
html.mm-opening.mm-fullscreen .mm-slideout {
-webkit-transform: translate(140px, 0);
-moz-transform: translate(140px, 0);
-ms-transform: translate(140px, 0);
-o-transform: translate(140px, 0);
transform: translate(140px, 0); } }
@media all and (min-width: 10000px) {
html.mm-opening.mm-fullscreen .mm-slideout {
-webkit-transform: translate(10000px, 0);
-moz-transform: translate(10000px, 0);
-ms-transform: translate(10000px, 0);
-o-transform: translate(10000px, 0);
transform: translate(10000px, 0); } }
html.mm-right.mm-opening.mm-fullscreen .mm-slideout {
-webkit-transform: translate(-100%, 0);
-moz-transform: translate(-100%, 0);
-ms-transform: translate(-100%, 0);
-o-transform: translate(-100%, 0);
transform: translate(-100%, 0); }
@media all and (max-width: 140px) {
html.mm-right.mm-opening.mm-fullscreen .mm-slideout {
-webkit-transform: translate(-140px, 0);
-moz-transform: translate(-140px, 0);
-ms-transform: translate(-140px, 0);
-o-transform: translate(-140px, 0);
transform: translate(-140px, 0); } }
@media all and (min-width: 10000px) {
html.mm-right.mm-opening.mm-fullscreen .mm-slideout {
-webkit-transform: translate(-10000px, 0);
-moz-transform: translate(-10000px, 0);
-ms-transform: translate(-10000px, 0);
-o-transform: translate(-10000px, 0);
transform: translate(-10000px, 0); } }
.mm-menu.mm-front.mm-fullscreen.mm-top, .mm-menu.mm-front.mm-fullscreen.mm-bottom {
height: 100%;
min-height: 140px;
max-height: 10000px; }
html.mm-opened.mm-fullscreen .mm-page {
box-shadow: none !important; } .mm-menu.mm-top,
.mm-menu.mm-bottom {
width: 100%;
min-width: 100%;
max-width: 100%; }
.mm-menu.mm-right {
left: auto;
right: 0; }
.mm-menu.mm-bottom {
top: auto;
bottom: 0; }
html.mm-right.mm-opening .mm-slideout {
-webkit-transform: translate(-80%, 0);
-moz-transform: translate(-80%, 0);
-ms-transform: translate(-80%, 0);
-o-transform: translate(-80%, 0);
transform: translate(-80%, 0); }
@media all and (max-width: 175px) {
html.mm-right.mm-opening .mm-slideout {
-webkit-transform: translate(-140px, 0);
-moz-transform: translate(-140px, 0);
-ms-transform: translate(-140px, 0);
-o-transform: translate(-140px, 0);
transform: translate(-140px, 0); } }
@media all and (min-width: 550px) {
html.mm-right.mm-opening .mm-slideout {
-webkit-transform: translate(-440px, 0);
-moz-transform: translate(-440px, 0);
-ms-transform: translate(-440px, 0);
-o-transform: translate(-440px, 0);
transform: translate(-440px, 0); } } html.mm-front .mm-slideout {
-webkit-transform: none !important;
-moz-transform: none !important;
-ms-transform: none !important;
-o-transform: none !important;
transform: none !important;
z-index: 0 !important; }
.mm-menu.mm-front {
z-index: 1;
box-shadow: 0 0 15px rgba(0, 0, 0, 0.5); }
html.mm-opened.mm-next .mm-page {
box-shadow: none; }
.mm-menu.mm-front, .mm-menu.mm-next {
-webkit-transition: -webkit-transform 0.4s ease;
-ms-transition: -ms-transform 0.4s ease;
transition: transform 0.4s ease;
-webkit-transform: translate(-100%, 0);
-moz-transform: translate(-100%, 0);
-ms-transform: translate(-100%, 0);
-o-transform: translate(-100%, 0);
transform: translate(-100%, 0); }
.mm-menu.mm-front.mm-right, .mm-menu.mm-next.mm-right {
-webkit-transform: translate(100%, 0);
-moz-transform: translate(100%, 0);
-ms-transform: translate(100%, 0);
-o-transform: translate(100%, 0);
transform: translate(100%, 0); }
.mm-menu.mm-front.mm-top {
-webkit-transform: translate(0, -100%);
-moz-transform: translate(0, -100%);
-ms-transform: translate(0, -100%);
-o-transform: translate(0, -100%);
transform: translate(0, -100%); }
.mm-menu.mm-front.mm-bottom {
-webkit-transform: translate(0, 100%);
-moz-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
-o-transform: translate(0, 100%);
transform: translate(0, 100%); }
html.mm-opening .mm-menu.mm-front, html.mm-opening .mm-menu.mm-next {
-webkit-transform: translate(0, 0);
-moz-transform: translate(0, 0);
-ms-transform: translate(0, 0);
-o-transform: translate(0, 0);
transform: translate(0, 0); }
.mm-menu.mm-front.mm-top, .mm-menu.mm-front.mm-bottom {
height: 80%;
min-height: 140px;
max-height: 880px; } html.mm-opened.mm-light .mm-page {
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); }
.mm-menu.mm-light {
background: #f3f3f3;
color: rgba(0, 0, 0, 0.6); }
.mm-menu.mm-light .mm-list > li:after {
border-color: rgba(0, 0, 0, 0.1); }
.mm-menu.mm-light .mm-list > li > a.mm-subclose {
background: rgba(255, 255, 255, 0.6);
color: rgba(0, 0, 0, 0.3); }
.mm-menu.mm-light .mm-list > li > a.mm-subopen:after, .mm-menu.mm-light .mm-list > li > a.mm-subclose:before {
border-color: rgba(0, 0, 0, 0.3); }
.mm-menu.mm-light .mm-list > li > a.mm-subopen:before {
border-color: rgba(0, 0, 0, 0.1); }
.mm-menu.mm-light .mm-list > li.mm-selected > a:not(.mm-subopen),
.mm-menu.mm-light .mm-list > li.mm-selected > span {
background: rgba(255, 255, 255, 0.6); }
.mm-menu.mm-light .mm-list > li.mm-label {
background: rgba(0, 0, 0, 0.03); }
.mm-menu.mm-light.mm-vertical .mm-list li.mm-opened > a.mm-subopen,
.mm-menu.mm-light.mm-vertical .mm-list li.mm-opened > ul {
background: rgba(0, 0, 0, 0.03); }
.mm-menu.mm-light .mm-buttonbar {
border-color: rgba(0, 0, 0, 0.6);
background: #f3f3f3; }
.mm-menu.mm-light .mm-buttonbar > * {
border-color: rgba(0, 0, 0, 0.6); }
.mm-menu.mm-light .mm-buttonbar > input:checked + label {
background: rgba(0, 0, 0, 0.6);
color: #f3f3f3; }
.mm-menu.mm-light label.mm-check:before {
border-color: rgba(0, 0, 0, 0.6); }
.mm-menu.mm-light em.mm-counter {
color: rgba(0, 0, 0, 0.3); }
.mm-menu.mm-light .mm-footer {
border-color: rgba(0, 0, 0, 0.1);
color: rgba(0, 0, 0, 0.3); }
.mm-menu.mm-light .mm-header {
border-color: rgba(0, 0, 0, 0.1);
color: rgba(0, 0, 0, 0.3); }
.mm-menu.mm-light .mm-header .mm-prev:before,
.mm-menu.mm-light .mm-header .mm-next:after,
.mm-menu.mm-light .mm-header .mm-close:after {
border-color: rgba(0, 0, 0, 0.3); }
.mm-menu.mm-light .mm-list li.mm-label > div > div {
background: rgba(0, 0, 0, 0.03); }
.mm-menu.mm-light .mm-search input {
background: rgba(0, 0, 0, 0.1);
color: rgba(0, 0, 0, 0.6); }
.mm-menu.mm-light .mm-noresultsmsg {
color: rgba(0, 0, 0, 0.3); }
.mm-menu.mm-light label.mm-toggle {
background: rgba(0, 0, 0, 0.1); }
.mm-menu.mm-light label.mm-toggle:before {
background: #f3f3f3; }
.mm-menu.mm-light input.mm-toggle:checked ~ label.mm-toggle {
background: #4bd963; }
html.mm-opened.mm-white .mm-page {
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); }
.mm-menu.mm-white {
background: white;
color: rgba(0, 0, 0, 0.6); }
.mm-menu.mm-white .mm-list > li:after {
border-color: rgba(0, 0, 0, 0.1); }
.mm-menu.mm-white .mm-list > li > a.mm-subclose {
background: rgba(0, 0, 0, 0.06);
color: rgba(0, 0, 0, 0.3); }
.mm-menu.mm-white .mm-list > li > a.mm-subopen:after, .mm-menu.mm-white .mm-list > li > a.mm-subclose:before {
border-color: rgba(0, 0, 0, 0.3); }
.mm-menu.mm-white .mm-list > li > a.mm-subopen:before {
border-color: rgba(0, 0, 0, 0.1); }
.mm-menu.mm-white .mm-list > li.mm-selected > a:not(.mm-subopen),
.mm-menu.mm-white .mm-list > li.mm-selected > span {
background: rgba(0, 0, 0, 0.06); }
.mm-menu.mm-white .mm-list > li.mm-label {
background: rgba(0, 0, 0, 0.03); }
.mm-menu.mm-white.mm-vertical .mm-list li.mm-opened > a.mm-subopen,
.mm-menu.mm-white.mm-vertical .mm-list li.mm-opened > ul {
background: rgba(0, 0, 0, 0.03); }
.mm-menu.mm-white .mm-buttonbar {
border-color: rgba(0, 0, 0, 0.6);
background: white; }
.mm-menu.mm-white .mm-buttonbar > * {
border-color: rgba(0, 0, 0, 0.6); }
.mm-menu.mm-white .mm-buttonbar > input:checked + label {
background: rgba(0, 0, 0, 0.6);
color: white; }
.mm-menu.mm-white label.mm-check:before {
border-color: rgba(0, 0, 0, 0.6); }
.mm-menu.mm-white em.mm-counter {
color: rgba(0, 0, 0, 0.3); }
.mm-menu.mm-white .mm-footer {
border-color: rgba(0, 0, 0, 0.1);
color: rgba(0, 0, 0, 0.3); }
.mm-menu.mm-white .mm-header {
border-color: rgba(0, 0, 0, 0.1);
color: rgba(0, 0, 0, 0.3); }
.mm-menu.mm-white .mm-header .mm-prev:before,
.mm-menu.mm-white .mm-header .mm-next:after,
.mm-menu.mm-white .mm-header .mm-close:after {
border-color: rgba(0, 0, 0, 0.3); }
.mm-menu.mm-white .mm-list li.mm-label > div > div {
background: rgba(0, 0, 0, 0.03); }
.mm-menu.mm-white .mm-search input {
background: rgba(0, 0, 0, 0.1);
color: rgba(0, 0, 0, 0.6); }
.mm-menu.mm-white .mm-noresultsmsg {
color: rgba(0, 0, 0, 0.3); }
.mm-menu.mm-white label.mm-toggle {
background: rgba(0, 0, 0, 0.1); }
.mm-menu.mm-white label.mm-toggle:before {
background: white; }
.mm-menu.mm-white input.mm-toggle:checked ~ label.mm-toggle {
background: #4bd963; }
html.mm-opened.mm-black .mm-page {
box-shadow: none; }
.mm-menu.mm-black {
background: black;
color: rgba(255, 255, 255, 0.6); }
.mm-menu.mm-black .mm-list > li:after {
border-color: rgba(255, 255, 255, 0.2); }
.mm-menu.mm-black .mm-list > li > a.mm-subclose {
background: rgba(255, 255, 255, 0.25);
color: rgba(255, 255, 255, 0.3); }
.mm-menu.mm-black .mm-list > li > a.mm-subopen:after, .mm-menu.mm-black .mm-list > li > a.mm-subclose:before {
border-color: rgba(255, 255, 255, 0.3); }
.mm-menu.mm-black .mm-list > li > a.mm-subopen:before {
border-color: rgba(255, 255, 255, 0.2); }
.mm-menu.mm-black .mm-list > li.mm-selected > a:not(.mm-subopen),
.mm-menu.mm-black .mm-list > li.mm-selected > span {
background: rgba(255, 255, 255, 0.25); }
.mm-menu.mm-black .mm-list > li.mm-label {
background: rgba(255, 255, 255, 0.15); }
.mm-menu.mm-black.mm-vertical .mm-list li.mm-opened > a.mm-subopen,
.mm-menu.mm-black.mm-vertical .mm-list li.mm-opened > ul {
background: rgba(255, 255, 255, 0.15); }
.mm-menu.mm-black .mm-buttonbar {
border-color: rgba(255, 255, 255, 0.6);
background: black; }
.mm-menu.mm-black .mm-buttonbar > * {
border-color: rgba(255, 255, 255, 0.6); }
.mm-menu.mm-black .mm-buttonbar > input:checked + label {
background: rgba(255, 255, 255, 0.6);
color: black; }
.mm-menu.mm-black label.mm-check:before {
border-color: rgba(255, 255, 255, 0.6); }
.mm-menu.mm-black em.mm-counter {
color: rgba(255, 255, 255, 0.3); }
.mm-menu.mm-black .mm-footer {
border-color: rgba(255, 255, 255, 0.2);
color: rgba(255, 255, 255, 0.3); }
.mm-menu.mm-black .mm-header {
border-color: rgba(255, 255, 255, 0.2);
color: rgba(255, 255, 255, 0.3); }
.mm-menu.mm-black .mm-header .mm-prev:before,
.mm-menu.mm-black .mm-header .mm-next:after,
.mm-menu.mm-black .mm-header .mm-close:after {
border-color: rgba(255, 255, 255, 0.3); }
.mm-menu.mm-black .mm-list li.mm-label > div > div {
background: rgba(255, 255, 255, 0.15); }
.mm-menu.mm-black .mm-search input {
background: rgba(255, 255, 255, 0.3);
color: rgba(255, 255, 255, 0.6); }
.mm-menu.mm-black .mm-noresultsmsg {
color: rgba(255, 255, 255, 0.3); }
.mm-menu.mm-black label.mm-toggle {
background: rgba(255, 255, 255, 0.2); }
.mm-menu.mm-black label.mm-toggle:before {
background: black; }
.mm-menu.mm-black input.mm-toggle:checked ~ label.mm-toggle {
background: #4bd963; }