/* Theme Name:GLOBAL ABODE
Theme URI:http://ga.com
Description:GA Template
Design by:The Website Company
Version:1.0
Author CSS:Tung ken
Text Domain:GA */

/** * Table of Contents:*
* 1.0 - Reset
* 2.0 - Common Format
* 3.0 - Repeatable Patterns
* 4.0 - Basic Structure
* 5.0 - Header
*   5.1 - Site Header
*   5.2 - Navigation
* 6.0 - Content
* 7.0 - Footer
* ---------------------------------------------------------------------------- */
/** * 1.0 Reset
*
* Modified from Normalize.css to provide cross-browser consistency and a smart
* default styling of HTML elements.
*
* @see http://git.io/normalize
* ---------------------------------------------------------------------------- */
 
/* Google fonts */
@font-face {
    font-family: 'RotundusRounded';
    src: url('../fonts/RotundusRounded-Regular.ttf') format('ttf'), 
         url('../fonts/RotundusRounded-Regular.woff');
   
}
@font-face {
    font-family: 'Arial Black';
    src: local('Arial Black');

}
* {
    outline: none;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
nav,
section,
summary {
    display: block;
}
audio,
canvas,
video {
    display: inline-block;
}
audio:not([controls]) {
    display: none;
    height: 0;
}
[hidden] {
    display: none;
}
html {
    font-size: 100%;
    overflow-y: scroll;
    -webkit-text-size-adjust: none;
    -ms-text-size-adjust: none;
}
html,
button,
input,
select,
textarea {
    font-family:arial, sans-serif;
}
a {
    color: #fff;
    text-decoration: none;
}

a:focus {
}
a:active,
a:hover {
    color: #f6a50a;
    outline: 0;
}
address {
    font-style: italic;
    margin: 0 0 24px;
}
abbr[title] {
    border-bottom: 1px dotted;
}
b,
strong {
    font-weight: bold;
}
dfn {
    font-style: italic;
}
mark {
    background: #ff0;
    color: #000;
}
p {
    margin: 0 0 24px;
    background: url("../images/bg-blank.png") repeat scroll left top transparent;
}
code,
kbd,
pre,
samp {
    font-family:arial, sans-serif;
    font-size: 14px;
    -webkit-hyphens: none;
    -moz-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
}
pre {
    color: #666;
    font-family:arial, sans-serif;
    font-size: 14px;
    margin: 20px 0;
    overflow: auto;
    padding: 20px;
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word;
}
blockquote,
q {
    -webkit-hyphens: none;
    -moz-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
    quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
    content: "";
    content: none;
}
blockquote {
    font-size: 18px;
    font-style: italic;
    font-weight: 300;
    margin: 24px 40px;
}
blockquote blockquote {
    margin-right: 0;
}
blockquote cite,
blockquote small {
    font-size: 14px;
    font-weight: normal;
    text-transform: uppercase;
}
blockquote em,
blockquote i {
    font-style: normal;
    font-weight: 300;
}
blockquote strong,
blockquote b {
    font-weight: 400;
}
small {
    font-size: smaller;
}
sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sup {
    top: -0.5em;
}
sub {
    bottom: -0.25em;
}
dl {
    margin: 0 20px;
}
dt {
    font-weight: bold;
}
dd {
    margin: 0 0 20px;
}
menu,
ol,
ul {
    margin: 16px 0;
    padding: 0 0 0 40px;
}
ul {
    list-style-type: square;
}
ul.menu-main,
ol.menu-main {
    list-style: none;
    list-style-image: none;
}
li > ul,
li > ol {
    margin: 0;
}
img {
    -ms-interpolation-mode: bicubic;
    border: 0;
    vertical-align: middle;
}
svg:not(:root) {
    overflow: hidden;
}
figure {
    margin: 0;
}
form {
    margin: 0;
}
fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}
legend {
    border: 0;
    padding: 0;
    white-space: normal;
}
button,
input,
select,
textarea {
    font-size: 100%;
    margin: 0;
    max-width: 100%;
    vertical-align: baseline;
}
button,
input {
    line-height: normal;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer;
}
button[disabled],
input[disabled] {
    cursor: default;
}
input[type="checkbox"],
input[type="radio"] {
    padding: 0;
}
input[type="search"] {
    -webkit-appearance: textfield;
    padding-right: 2px; /* Don't cut off the webkit search cancel button */
    width: 270px;
}
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;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 13px;
    line-height: 100%;
    width: 100%;
    font-family:arial,sans-serif;line-height:24px;
}
.poppup-projects h3{
    font-family: Arial Black, Gadget, sans-serif;
    font-weight: normal;
    font-size:26px;
    margin:0 0 24px;
    line-height:35px;
}
caption,
th,
td {
    font-weight: normal;
    text-align: left;
}
caption {
    font-size: 16px;
    margin: 20px 0;
}
th {
    font-weight: bold;
    text-transform: uppercase;
}
td {
    padding: 5px 5px 5px 0;
}
del {
    color: #333;
}
ins {
    background: #fff9c0;
    text-decoration: none;
}
hr {
    background: url(images/dotted-line.png) repeat center top;
    background-size: 4px 4px;
    border: 0;
    height: 1px;
    margin: 0 0 24px;
}
.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

/** * 2.0 COMMON FORMAT */
/* _Media */
.media {
    margin: 10px
}
.media,
.bd {
    overflow: hidden;
    _overflow: visible;
    zoom: 1
}
.media .img {
    float: left;
    margin-right: 10px
}
.media .img img {
    dis play: block
}
.media .imgr {
    float: right;
    margin-left: 10px
}

/* _Float */
.listh {
    overflow: hidden
}
.right,
.colr {
    float: right
}
.left,
.col,
.col1,
.col2,
.col3,
.col4,
.listh li {
    float: left
}

/* _Inner */
.noborder {
    border: 0 !important
}
input[type='submit'],
input[type='button'] {
    cursor: pointer
}
strong {
    font-weight: bold !important
}
.italic {
    font-style: italic !important
}
.uppercase {
    text-transform: uppercase
}
.text-center {
    text-align: center
}
.rounded {
    position: relative;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}

/** * 3.0 Repeatable Patterns */
/** * 4.0 Basic Structure */
body {
}
.clear {
    clear: both;
}
.relative {
    position: relative;
}
.alignright {
    display: inline;
    float: right;
    margin-left: 1.625em;
}
.alignleft {
    display: inline;
    float: left;
    margin-right: 1.625em;
}
.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}


/** * 5.0 Header */
#header {
    background: #3a393e;
}

#header .wrapper {
    padding: 40px 0px 30px 0px;
    overflow: hidden;
}
#header #logo {
    float: left;
    padding:40px 30px 0px 55px;
}
#header #banner {
    float: left;
    font-size: 37px;
    color: #d2d2d2;
    line-height: 45px;
    text-transform: uppercase;
    padding-top: 15px;
}
.main_menu {
    margin:0px 0px 20px 0px;
    padding:0px 55px 0px 0px;
    text-align: right;
}
.main_menu ul {
    margin: 0px;
    padding: 0px;
    position: relative;
    display: inline-block;
}
.main_menu ul li{
    float:left;
    border-right:1px solid #c4c3c5;
}
.main_menu ul li:last-child{
    border-right:0;
}
.main_menu ul li:last-child a{padding-right: 0;}
.main_menu ul li a {
    font-size: 18px;
    line-height:16px;
    text-transform:lowercase;
    color: #c4c3c5;
    padding: 0px 24px;
    margin: 0px;
    display: block;
    font-family: 'RotundusRounded', sans-serif;
}
.main_menu ul li a:hover,
.main_menu ul li.current-menu-item a,
.main_menu ul li.current-menu-parent a {
    color: #f6a50a;
}
#header .container{background:rgba(35,35,38,0.5);}

.content{
    padding-left:45px;
    padding-right:45px;
    float: left;
    display: block;
}
#main_content{
    background:#161618 url(../images/bg-home.jpg) repeat-x left top;

}

/* Home page */
.block-1{
    border-top:1px solid #91878e;
    border-bottom:1px solid #655c5f;

}
.block-1 .container{
    background:rgba(58,57,62,0.5);
}
.block-1 .content{
     padding-top:20px;
     padding-bottom: 30px;
}
.border-left{
    border-left:1px solid #71696d;
}
#main_content .list{
    list-style: none;display: inline;
    float: left;
    margin:0;
}
#main_content .list li{
    list-style: none;
    display: inline;
    float: left;
    width:255px;
    margin-right:40px;

}
#main_content .list li img{
    border-radius:42px 0 0 0;
    width:100%;
     -webkit-box-shadow:-5px -10px 20px 5px rgba(239, 238, 234, 0.39);
    -moz-box-shadow: -5px -10px 20px 5px rgba(239, 238, 234, 0.39);
     box-shadow:-5px -10px 20px 5px rgba(239, 238, 234, 0.39);
     -webkit-transition: all 0.7s ease;
    transition: all 0.7s ease;
}
#main_content .list li img:hover{
    
}
.home .caption{
    background:#232326;
    padding:25px 10px;
    text-align: center;
    border-radius:0 0 42px 0; 
}
#main_content .caption a{
    font-size: 22px;
    font-family:Arial Black, Gadget, sans-serif;
    font-weight: normal;
}
#main_content .caption a.more{
  font-size: 17px;
  font-family:'RotundusRounded', sans-serif;
  border-bottom:1px solid #c4c3c5;
}
#main_content .list li:last-child{margin-right:0;}
.block-2{
   background:rgba(8,8,10,0.5);
   color:#fff;
}
.block-2 .container{
    background:rgba(13,13,15,0.5);
}
.home .block-2 .content{
  padding-bottom:0;
}
.block-2 .content{
    padding-top:30px;
    padding-bottom:50px;
}
.copyright,.menu-footer{clear:both;}
#footer .menu-footer ul{margin: 0;padding: 0;}

/* Breadcrumbs */
.breadcrumbs {
    border-top: 1px solid #898a88;
    margin: 0px;
    padding: 30px 0px 30px 60px;
    text-transform: uppercase;
    color: #3e3e40;
    font-size: 16px;
}
.breadcrumbs a {
    color: #818280;
}
#main_content .block-left{
    padding-left:0;
    padding-right: 0;
    width:252px;
    float:left;
}

#main_content .block-left img{
     width:100%;
    -webkit-box-shadow: -12px -12px 20px 0px rgba(239, 238, 234, 0.39);
    -moz-box-shadow: -12px -12px 20px 0px rgba(239, 238, 234, 0.39);
    box-shadow: -12px -12px 20px 0px rgba(239, 238, 234, 0.39);
    border-radius:42px 0 0 0;
    -moz-border-radius:42px 0 0 0;
    -ms-border-radius:42px 0 0 0;
    -o-border-radius:42px 0 0 0;
}
#main_content .caption h3{
    font-size:25px;
    color:#c4c3c5;
}
.caption{
    padding:22px 15px 45px 0;
    background: #232326;
    text-align:right;
    border-radius: 0 0 42px 0;
}
#main_content .block-right{
    width:570px;
    margin-left:25px;
    float: right; 
    background: rgba(13,13,15,0.8);
    color:#fff;
    border-radius:0 0 42px 0;
}

.home .block-2{
    border-bottom:1px solid #34312c;
}
.home #footer{
    border:none;
}
/* Over ga page */
.content_single {
    padding:55px 20px;
}
.item-block{
  border-bottom: 1px solid #353235;

}
#main_content .list-item .block-left img{
    box-shadow:none;
    border-radius:50px 0 50px 0;
}
.block-2 .list-item .content{
   padding-bottom:30px; 
}
.list-item .content_single{padding-top:0;padding-bottom:0;}
#main_content .item-block .block-right{
   background:transparent;
   
}

#main_content .item-block:last-child{
    border-bottom: 0;
    padding-bottom:0px;
}
#main_content .block-2 .block-left img{
  border:4px solid #4b4b4b;
}
.page .block-1 .block-left img{
    height:213px;
}
.page .block-1 .block-right{
    height:319px;
}
.page-template-default .block-1 .caption{
    display:none;
}
.page-template-default #main_content .block-1 .block-left img{
   height:320px;
   border-radius:42px 0 42px 0;
}
.back-to-top{
    padding:20px;
    background: url(../images/back-top-top.png) no-repeat left center;
    margin-right:50px;
    bottom:5%;
    right:0;
    cursor: pointer;
    float:right;
    position:fixed;
    z-index:999;
}
/* 404 page */
.error404 .inner {
    text-align: center;
    margin-top: 20px;
    background: #eee;
}

/** * 7.0 Footer */
#footer {
    font-size: 14px;
    background: #161618;
    border-top: 1px solid #34312c;
    color:#c4c3c5;
    text-align:right;
}

#footer .container{
     padding: 20px 0px;
    background:rgba(13,13,15,0.5);
}
#footer .container.scroll-top{
    padding:0;
    height:0;
}
#footer .content{
    float:none;
}
#footer .menu-footer {
    margin: 0px;
    padding: 0px 0 10px 0;
    list-style-type: none;
    display: inline-block;
    float: right;
}
#footer .menu-footer li {
    float: left;
    border-right: 1px solid #c4c3c5;
}
#footer .menu-footer li:last-child{border:0;}
#footer .menu-footer li a {
    font-size: 18px;
    line-height: 16px;
    text-transform: lowercase;
    color: #c4c3c5;
    padding: 0px 15px 0px 10px;
    margin: 0px;
    display: block;
    font-family:'RotundusRounded', sans-serif;
   
}
#footer .menu-footer li.last a {
    background: none;
}
#footer .menu-footer li a:hover,
#footer .menu-footer li.current-menu-item a,
#footer .menu-footer li.current-menu-parent a {
    color: #f6a50a;
}

/* move responsive section */
.copyright {
  padding-right: 15px;   
}
/* slider */
.bx-wrapper .bx-controls-direction a {
float: left;
top: 50%;
margin-top: -16px;
outline: 0;
width:40px;
height:40px;
text-indent: -9999px;
z-index: 9999;
overflow: hidden;
}
.poppup-projects{
    opacity:0;
    top:500%;
    width:100%;
    position:fixed;
   
    z-index:9999;
   -webkit-transition: all .3s 0.2s;
     -moz-transition: all .3s 0.2s;
     -ms-transition: all .3s 0.2s;
     -o-transition: all .3s 0.2s;
     transition: all .3s 0.2s;
}
.bx-viewport{
    overflow:auto !important;
    overflow-x: hidden !important;  
}
.poppup-projects.show{
    display:block;
     top:10%;
     opacity:1;
     -webkit-transition: all .3s 0.2s;
     -moz-transition: all .3s 0.2s;
     -ms-transition: all .3s 0.2s;
     -o-transition: all .3s 0.2s;
     transition: all .3s 0.2s;
}
.md-overlay{
    display: none;
    position: fixed;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background: #000;
    border: 1px solid #cecece;
    z-index: 1;
}
.bx-wrapper{
    background:#222124;
    color:#fff;
    border:5px solid #39393a;
}
.content-left{
    width:445px;
    float: left;
}
.content-left img{
    width:100%;
}
.content-right{
    width:450px;
    float:left;
    margin-left:30px;
    padding-top:20px;
}
.bx-controls{
    position: relative;
    bottom: 10%;
    right: 5%;
    float: right;
    top:-30px;
}
.bx-controls-direction,.bx-default-pager,.txt-text{
    float: left;
}
.bx-default-pager{
    padding-right:10px;
    position: relative;
    top: -3px;
}
.txt-text{
    padding-right:5px;
    margin-bottom: 0;
    position: relative;
    top:-3px;
}
.bx-wrapper .bx-controls-direction a.disabled {
  background: url(../images/controls.png) no-repeat 0 0;
   transform:rotate(0deg); 
   -webkit-transform:rotate(0deg); 
   -ms-transform:rotate(0deg); 
   -moz-transform:rotate(0deg);
   -o-transform:rotate(0deg);
}
.bx-wrapper .bx-controls-direction a.bx-next.disabled{
     transform:rotate(180deg); 
     -webkit-transform:rotate(180deg); 
     -moz-transform:rotate(180deg);
     -ms-transform:rotate(180deg);
     -o-transform:rotate(180deg); 
}
.bx-wrapper .bx-controls-direction a.bx-prev.disabled{
   
}
.bx-wrapper .bx-prev {
    background: url(../images/controls.png) no-repeat -60px 0px;
    overflow: hidden;
    transform:rotate(180deg); 
     -moz-transform:rotate(180deg);
     -ms-transform:rotate(180deg);
     -o-transform:rotate(180deg); 
     -webkit-transform:rotate(180deg); 
}
.bx-wrapper .bx-next {
  
 background: url(../images/controls.png) no-repeat -60px 0px;
   margin-left:30px;
}
.close{
  background:url(../images/close.png) no-repeat left center;
  position:absolute;
  top:-19px;
  padding: 20px;
  right:-17px;
  cursor:pointer;
}
.block-2 .content a,.block-2 .content a,.block-1 .content_single a{
    color:#f6a50a;
    text-decoration: underline;
}
.block-2 .content a:hover,.block-1 .content_single a:hover{
    color:#f6a50a;
    text-decoration:none;
}
.title-p{
    opacity:0;
}
.page-id-9 .title-p{opacity:1;}
.menu-mobile{position: absolute;z-index: 99999;width:100%;display: none;}
#icon_menu {
    border: 5px solid #c4c3c5;
    padding: 0px;
    width: 30px;
    position: absolute;
    top: 0px;
    right: 0px;
    z-index: 99999;
}
#icon_menu a {
    background: none;
    display: block;
    height: 5px;
    margin: 5px 0px;
    border-top: 5px solid #c4c3c5;
    border-bottom: 5px solid #c4c3c5;
}
.wrap_menu.visible_phone {
    display: none;
    margin: 0px;
    padding: 40px 20px;
    border: 5px solid #c4c3c5;
    background:#232326;
    z-index: 99999;
}
.menu-mobile .menu li{list-style: none;padding:5px 0;}
.menu-mobile .menu{padding-left:5px;}
.menu-mobile .menu li a{
    font-size: 22px;
    line-height:20px;
    text-transform: lowercase;
    color: #c4c3c5;
    padding: 0px 24px;
    margin: 0px;
    display: block;
    font-family: 'RotundusRounded', sans-serif;
}
.menu-mobile .menu li a:hover,.menu-mobile .menu li.current-menu-item a{
    color:#f6a50a;
}
.page-template-template-contact-php #main_content{
   background:#161618 url(../images/bg-contact.jpg) repeat-x left top;
}
.page-template-template-contact-php .caption{
    padding-bottom: 45px;
}
#main_content a[href^=tel] {
  color: #fff !important;
  text-decoration: none;
}
#main_content .block-left.tk{position: relative;}
.custom-line{padding:0.5px;background:#615b60;position:absolute;top:0; height:100%;right:0;margin-right:-27px;}
.poppup-projects .bxslider{margin:0;} 
/* #Tablet (Portrait)
================================================== */
/* Note:Design for a width of 768px */
    
@media only screen and (min-width:768px) and (max-width:959px) {
    #header #logo{padding:15px;}
    #header .main_menu{padding-top: 25px;}
    #main_content .list{margin-left:55px;}
    #main_content .list li{height:350px;}
    .home #main_content{background-size:cover;}
    #main_content .block-right{width:400px;}
    #main_content .font-size-title{font-size:24px;}
    .poppup-projects .container{width:670px;margin:0 auto;}
    .poppup-projects .content-left{width:300px;}
    .poppup-projects .content-right{
         width: 340px;
        margin-left:15px;
        padding-top: 0px;
     }
     .bx-viewport{margin-bottom: 60px;}
     .page-template-template-contact-php #main_content{

     }
     .poppup-projects .bx-viewport{margin-bottom:0;}
     #main_content .color-contact{
       font-size:13px;
     }
     .poppup-projects .bx-wrapper{overflow:scroll;}
     

}

/* #Mobile (Portrait)
================================================== */
/* Note:Design for a width of 320px */

@media only screen and (max-width:767px) {
    .content_single{padding:15px 15px 0 15px;}
    #header .menu-mobile{
        display: block;
    }
    .main_menu{
        display: none;
    }
   #header #logo{
      padding:15px 0  15px 5px;
   }
   #main_content .content{padding:15px 15px;}
   #main_content .block-1 .content{
    padding:15px 15px 0 15px;
   }
   #main_content .list li{
    margin-bottom: 15px;
    margin-right:0;
    width:270px;
   }
   #main_content .border-left{border-left: 0;padding-left:15px !important;border-top:1px solid #71696d;padding-top:15px;margin-top: 15px;} 
   #main_content .block-left{width:270px;}
   #main_content.pp-page .block-left{margin-bottom: 15px;}
   #main_content .block-right{
     margin-left: 0;
     width:270px;
     height:auto;
   }
   .pp-page .block-1 .block-right{margin-bottom:15px;}

   #footer .content{padding:15px;}
   #footer .menu-footer ul{margin: 0;padding: 0;}
   #footer .menu-footer li{margin-bottom:10px;}
   #footer .menu-footer li a{padding:0px 15px 0px 8px;}
   .copyright{text-align: center;}
   #main_content .item-block .block-right{
      border:0;

   }
   #main_content ul.custom-list li{width:100%;}
   .poppup-projects .content-right{width:270px;padding:40px 15px 0 15px;margin-left: 0;}
   .bx-viewport{margin-bottom:100px;}
   .font-size-title{line-height:30px;}
   .back-to-top{margin-right:0;}
   .page-template-template-contact-php #main_content{
     background:#161618 url(../images/bg-home.jpg) repeat-x left top;
   }
   .poppup-projects.show{top:10% !important;}
   .page-template-template-contact-php .content_single{padding:15px 15px 0 15px;}
   .poppup-projects .bx-wrapper{overflow:scroll;height:320px;}
   .poppup-projects .bx-viewport{margin-bottom:0;}
   #main_content .custom-line{display:none;}
   #main_content .list li img{box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none;-ms-box-shadow:none;}
   #logo img{height:50px;}

   .poppup-projects .bx-controls{
     position:static;
     margin-bottom:10px;
   }
}

/* #Mobile (Landscape)
================================================== */
/* Note:Design for a width of 480px */

@media only screen and (min-width:480px) and (max-width:767px) {
    #header .menu-mobile{
        display: block;
    }
    #main_content .list{margin-left: 55px;}
    #footer .menu-footer li a{font-size: 15px;}
    #main_content.pp-page .block-left{margin-left:55px;}
    #main_content .block-right{width:100%;}
    #main_content .item-block .block-right{
      border:0;
      
   }
   .back-to-top{margin-right:0;}
   html .poppup-projects .content-right{
     width: 380px;
    padding: 15px;
    margin-left: 0;
   }
   .poppup-projects .bx-viewport{margin-bottom:0;}
   .poppup-projects.show{top:5% !important;}
   .poppup-projects .bx-wrapper{overflow:scroll;height:250px;}
   #main_content .custom-line{display:none;}
   #main_content .list li img{box-shadow:none;-webkit-box-shadow:none;-moz-box-shadow:none;-ms-box-shadow:none;}

}

/* scrollbar */
.ps-container.ps-active-x > .ps-scrollbar-x-rail, .ps-container.ps-active-y > .ps-scrollbar-y-rail {
  display: block; }
.ps-container > .ps-scrollbar-x-rail {
  display: none;
  position: absolute;
  /* please don't change 'position' */
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  -webkit-transition: background-color 0.2s linear, opacity 0.2s linear;
  -moz-transition: background-color 0.2s linear, opacity 0.2s linear;
  -o-transition: background-color 0.2s linear, opacity 0.2s linear;
  transition: background-color 0.2s linear, opacity 0.2s linear;
  bottom: 3px;
  /* there must be 'bottom' for ps-scrollbar-x-rail */
  height: 8px; }
  .ps-container > .ps-scrollbar-x-rail > .ps-scrollbar-x {
    position: absolute;
    /* please don't change 'position' */
    background-color: #aaa;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    border-radius: 4px;
    -webkit-transition: background-color 0.2s linear;
    -moz-transition: background-color 0.2s linear;
    -o-transition: background-color 0.2s linear;
    transition: background-color 0.2s linear;
    bottom: 0;
    /* there must be 'bottom' for ps-scrollbar-x */
    height: 8px; }
  .ps-container > .ps-scrollbar-x-rail.in-scrolling {
    background-color: #eee;
    opacity: 0.9;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    filter: alpha(opacity=90); }
.ps-container > .ps-scrollbar-y-rail {
  display: none;
  position: absolute;
  /* please don't change 'position' */
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  border-radius: 4px;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  -webkit-transition: background-color 0.2s linear, opacity 0.2s linear;
  -moz-transition: background-color 0.2s linear, opacity 0.2s linear;
  -o-transition: background-color 0.2s linear, opacity 0.2s linear;
  transition: background-color 0.2s linear, opacity 0.2s linear;
  right: 3px;
  /* there must be 'right' for ps-scrollbar-y-rail */
  width: 8px; }
  .ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y {
    position: absolute;
    /* please don't change 'position' */
    background-color: #aaa;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    border-radius: 4px;
    -webkit-transition: background-color 0.2s linear;
    -moz-transition: background-color 0.2s linear;
    -o-transition: background-color 0.2s linear;
    transition: background-color 0.2s linear;
    right: 0;
    /* there must be 'right' for ps-scrollbar-y */
    width: 8px; }
  .ps-container > .ps-scrollbar-y-rail.in-scrolling {
    background-color: #eee;
    opacity: 0.9;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    filter: alpha(opacity=90); }
.ps-container:hover > .ps-scrollbar-x-rail, .ps-container:hover > .ps-scrollbar-y-rail {
  opacity: 0.6;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
  filter: alpha(opacity=60); }
  .ps-container:hover > .ps-scrollbar-x-rail.in-scrolling, .ps-container:hover > .ps-scrollbar-y-rail.in-scrolling {
    background-color: #eee;
    opacity: 0.9;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    filter: alpha(opacity=90); }
.ps-container:hover > .ps-scrollbar-x-rail:hover {
  background-color: #eee;
  opacity: 0.9;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
  filter: alpha(opacity=90); }
  .ps-container:hover > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x {
    background-color: #999; }
.ps-container:hover > .ps-scrollbar-y-rail:hover {
  background-color: #eee;
  opacity: 0.9;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
  filter: alpha(opacity=90); }
  .ps-container:hover > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y {
    background-color: #999; }
