/* About */

.about-header { margin-bottom:60px;}
.about-header p { margin-top: 15px;}

.bx-executive { position: relative; display: block;}
.bx-executive .hover {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    color: #FFF;
    opacity: 0;
    background-color: rgba(0, 125, 222, 0.75);
    transition: 0.4s;
}
.bx-executive .caption { 
    width: 100%;
    position: absolute;
    bottom:0;
    padding: 20px;
}
.bx-executive .caption h3 { 
    font-size:18px;
    font-family: 'montserratregular','promptregular';
}
.bx-executive .caption p { font-style: italic; font-size: 15px; margin-top: 5px;}
.bx-executive:hover .hover { opacity: 1;}

.bx-vision { 
    width: 100%;
    height: 130px;
    display: table;
    padding: 20px;
    margin-bottom: 20px;
    border: 1px solid #eee; 
    background-color: #fafafa;
    -webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;
    font-size: 0;
}
.bx-vision:hover { 
    color: #FFF;
    background-color: rgba(0, 125, 222, 1);
}
.bx-vision .col-tb { 
    width: 80%; 
    font-size: 16px; line-height: 1.4; display:inline-block; vertical-align: middle;}
.bx-vision .col-tb:first-child { width: 15%; margin-right: 5%;}
.bx-vision .ico { 
    display: block;
    background-size: cover;
    background-repeat: no-repeat;
}
.bx-vision .ico-vision-01 { background-image: url(../img/icon-vision-01.png);}
.bx-vision:hover .ico-vision-01 { background-image: url(../img/icon-vision-01-hover.png);}
.bx-vision .ico-vision-02 { background-image: url(../img/icon-vision-02.png);}
.bx-vision:hover .ico-vision-02 { background-image: url(../img/icon-vision-02-hover.png);}
.bx-vision .ico-vision-03 { background-image: url(../img/icon-vision-03.png);}
.bx-vision:hover .ico-vision-03 { background-image: url(../img/icon-vision-03-hover.png);}
.bx-vision .ico-vision-04 { background-image: url(../img/icon-vision-04.png);}
.bx-vision:hover .ico-vision-04 { background-image: url(../img/icon-vision-04-hover.png);}


/* OWL History */
.owl-history .container { height: 100%;}
.owl-history .owl-theme .owl-nav.disabled+.owl-dots { bottom: -50px;}

.panel-history { margin-bottom: 60px;}
.panel-history .bx-history { margin-bottom: 40px;}
.panel-history .bx-history h3 { 
    padding:14px 20px;
    color: #FFF;
    background-color: #007dde; 
    font-family: 'montserratmedium','promptmedium';
    font-size: 20px;
}
.panel-history .content-history { 
    font-size: 15px;
    border: 1px solid #007dde;
    padding-top: 20px;
    padding-bottom: 20px;
}
.panel-history .content-more { padding:0 20px 20px 20px;}
.panel-history .content-history p { min-height:240px; line-height: 1.4;}
.panel-history .a-click {
    display: block;
    text-align: center;
}
.panel-history .less.active .read-more {
    display: none;
}
.panel-history .read-less {
    display: none;
}
.panel-history .less.active .read-less {
    display: block;
} 
.panel-history .read-more { display: block;}
.panel-history .read-more:after {
    font-family: 'iconfont' !important;
    content: "\e915";
    display:block;
    color: #007dde;
    font-size: 18px;
    text-align: center;
}
.panel-history .read-less:after {
    content: "\e90a";
    font-family: 'iconfont' !important;
    display:block;
    color: #007dde;
    text-align: center;
}

.owl-content { position: relative;}
.owl-content .content-area { 
    position: absolute;
    top:18%;
    right:15px;
    max-width:380px;
    z-index: 10;
    color: #FFF;
    padding:40px 30px; 
    text-align: center;
    background-color: #0072ca;
}
.owl-content .content-area h2 { 
    font-size:28px;
    line-height: 1.15;
    color: #FFF;
}
.owl-content .content-area img { max-width: 100%; width: auto; margin:30px auto 0;}

/* */
@media screen and (min-width:1280px) {

    .panel-history .content-history p { min-height: 240px;}
    
}

@media screen and (max-width:1024px) {
    
    .bx-executive .hover { height:28%; top: inherit; bottom: 0;  opacity:1;}
    
    .bx-vision:hover { background-color: #fafafa;}
    
}

@media screen and (max-width:980px) {
    
    .owl-content .content-area { max-width:250px; padding:20px;}
    .owl-content .content-area h2 { font-size:22px;}
    
    .panel-history .content-history p { min-height:inherit;}

}

@media screen and (max-width:767px) {
    
    .about-header { padding-left:0px; margin-bottom:40px;}
    
    .bx-vision { height: auto;}
    
    .section-executive { padding-bottom: 80px;}
    .owl-executive .owl-nav.disabled+.owl-dots { bottom:-50px;}
    .bx-executive .hover { height:20%;}
    
    .owl-content .container { padding: 0;}
    .owl-content .content-area { 
        width: 100%; 
        max-width: 100%;
        text-align: center;
        position: relative; 
        right: 0; 
        bottom: 0;
        padding:30px 20px;
    }
}