/* custom styles */
img {
    max-width: 100%;
    font-style: italic;
    vertical-align: middle;
}


img[width],
img[height] {
    max-width: none;
}


/* media object */
.media {
    padding: 0;

    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    /*-webkit-flex-flow: row wrap;*/
    justify-content: flex-start;
    align-items: stretch;
}
.media--rev .media-object {
    order: 1;
}
.media-body {
    flex: 1;
}
.media-middle {
    align-self: center;
}
.media-bottom {
    align-self: flex-end;
}


.clearfix:before,
.clearfix:after,
.dl-horizontal dd:before,
.dl-horizontal dd:after,
.container:before,
.container:after,
.container-fluid:before,
.container-fluid:after,
.row:before,
.row:after,
.form-horizontal .form-group:before,
.form-horizontal .form-group:after,
.nav:before,
.nav:after,
.navbar:before,
.navbar:after,
.navbar-header:before,
.navbar-header:after,
.navbar-collapse:before,
.navbar-collapse:after,
.panel-body:before,
.panel-body:after,
.modal-header:before,
.modal-header:after,
.modal-footer:before,
.modal-footer:after {
    content: " ";
    display: table;
}
.clearfix:after,
.dl-horizontal dd:after,
.container:after,
.container-fluid:after,
.row:after,
.form-horizontal .form-group:after,
.nav:after,
.navbar:after,
.navbar-header:after,
.navbar-collapse:after,
.panel-body:after,
.modal-header:after,
.modal-footer:after {
    clear: both;
}

.center-block {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.pull-right {
    float: right !important;
}

.pull-left {
    float: left !important;
}

.hide {
    display: none !important;
}

.show {
    display: block !important;
}

.invisible {
    visibility: hidden;
}

.text-hide {
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0;
}

.hidden {
    display: none !important;
}

.affix {
    position: fixed;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

.text-center {
    text-align: center;
}

.text-justify {
    text-align: justify;
}

.text-nowrap {
    white-space: nowrap;
}

.text-lowercase {
    text-transform: lowercase;
}

.text-uppercase {
    text-transform: uppercase;
}

.text-capitalize {
    text-transform: capitalize;
}

.text-muted {
    color: #777777;
}

.text-primary {
    color: #337ab7;
}

a.text-primary:hover,
a.text-primary:focus {
    color: #286090;
}

.text-success {
    color: #3c763d;
}

a.text-success:hover,
a.text-success:focus {
    color: #2b542c;
}

.text-info {
    color: #31708f;
}

a.text-info:hover,
a.text-info:focus {
    color: #245269;
}

.text-warning {
    color: #8a6d3b;
}

a.text-warning:hover,
a.text-warning:focus {
    color: #66512c;
}

.text-danger {
    color: #a94442;
}

a.text-danger:hover,
a.text-danger:focus {
    color: #843534;
}

.img-rounded {
    border-radius: 6px;
}
.img-thumbnail {
    padding: 4px;
    line-height: 1.42857143;
    background-color: #ffffff;
    border: 1px solid #dddddd;
    border-radius: 4px;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    display: inline-block;
    max-width: 100%;
    height: auto;
}
.img-circle {
    border-radius: 50%;
}

.container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}

.container {
    width: 1054px;
}

.row {
    margin-left: -15px;
    margin-right: -15px;
}

.span1,
.span2,
.span3,
.span4,
.span5,
.span6,
.span7,
.span8,
.span9,
.span10,
.span11,
.span12 {
    position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
}

.span1,
.span2,
.span3,
.span4,
.span5,
.span6,
.span7,
.span8,
.span9,
.span10,
.span11,
.span12 {
    float: left;
}

.span12 {
    width: 100%;
}

.span11 {
    width: 91.66666667%;
}

.span10 {
    width: 83.33333333%;
}

.span9 {
    width: 75%;
}

.span8 {
    width: 66.66666667%;
}

.span7 {
    width: 58.33333333%;
}

.span6 {
    width: 50%;
}

.span5 {
    width: 41.66666667%;
}

.span4 {
    width: 33.33333333%;
}

.span3 {
    width: 25%;
}

.span2 {
    width: 16.66666667%;
}

.span1 {
    width: 8.33333333%;
}

.span-pull-12 {
    right: 100%;
}

.span-pull-11 {
    right: 91.66666667%;
}

.span-pull-10 {
    right: 83.33333333%;
}

.span-pull-9 {
    right: 75%;
}

.span-pull-8 {
    right: 66.66666667%;
}

.span-pull-7 {
    right: 58.33333333%;
}

.span-pull-6 {
    right: 50%;
}

.span-pull-5 {
    right: 41.66666667%;
}

.span-pull-4 {
    right: 33.33333333%;
}

.span-pull-3 {
    right: 25%;
}

.span-pull-2 {
    right: 16.66666667%;
}

.span-pull-1 {
    right: 8.33333333%;
}

.span-pull-0 {
    right: auto;
}

.span-push-12 {
    left: 100%;
}

.span-push-11 {
    left: 91.66666667%;
}

.span-push-10 {
    left: 83.33333333%;
}

.span-push-9 {
    left: 75%;
}

.span-push-8 {
    left: 66.66666667%;
}

.span-push-7 {
    left: 58.33333333%;
}

.span-push-6 {
    left: 50%;
}

.span-push-5 {
    left: 41.66666667%;
}

.span-push-4 {
    left: 33.33333333%;
}

.span-push-3 {
    left: 25%;
}

.span-push-2 {
    left: 16.66666667%;
}

.span-push-1 {
    left: 8.33333333%;
}

.span-push-0 {
    left: auto;
}

.span-offset-12 {
    margin-left: 100%;
}

.span-offset-11 {
    margin-left: 91.66666667%;
}

.span-offset-10 {
    margin-left: 83.33333333%;
}

.span-offset-9 {
    margin-left: 75%;
}

.span-offset-8 {
    margin-left: 66.66666667%;
}

.span-offset-7 {
    margin-left: 58.33333333%;
}

.span-offset-6 {
    margin-left: 50%;
}

.span-offset-5 {
    margin-left: 41.66666667%;
}

.span-offset-4 {
    margin-left: 33.33333333%;
}

.span-offset-3 {
    margin-left: 25%;
}

.span-offset-2 {
    margin-left: 16.66666667%;
}

.span-offset-1 {
    margin-left: 8.33333333%;
}

.span-offset-0 {
    margin-left: 0%;
}



/* top navigation */
body.parallax-on #masthead {
    height: 83px;
    border-bottom: none;
    -webkit-transition: top 1.5s ease;
    -moz-transition: top 1.5s ease;
    -o-transition: top 1.5s ease;
    transition: top 1.5s ease;
}
body.parallax-on #masthead.off-canvas { top: -65px; }

body.parallax-on #masthead.fixed {
    top: 0px;
    z-index: 9999;
}
body.logged-in.parallax-on #masthead.fixed {
    top: 32px;
}

#masthead .mid-content {
    padding: 19px 8%;
}

.main-navigation {
    float: left;
    margin-top: 10px;
    margin-left: 4%;
}
.zh-hant .main-navigation {
    margin-left: 14%;
}
.main-navigation a {
    font-family: 'Raleway-Regular', sans-serif;
    font-size: 13px;
    color: #fff;
    text-transform: uppercase;
    padding: 5px 18px;
    letter-spacing: 1px;
}

.main-navigation a.disabled {
    cursor: default;
}
.main-navigation a.disabled,
.main-navigation a.disabled:hover,
.main-navigation a.disabled:visited {
    color: #fff;
}

.social-icons {
    position: relative;
    top: 11px;
    float: right;
    width: auto;
    margin-top: 0 !important;
    padding-left: 14px;
}



#lang_sel_list a.lang_sel_sel,
#lang_sel_list a.lang_sel_other:hover {
    color: #ca992c !important;
}

.inner-wrapper {
    margin: 0 auto;
    padding: 8%;
}
.h1,
.parallax-section h1 {
    padding: 8px 0 0;
    text-align: left;
    border-top: 8px solid #000;
    display: inline-block;
    color: #ca992c;
    font-size: 30px;
}
.mid-content > h1:first-child {
    display: none;
}
/* about section */
.site-content section:first-child {
    position: relative;
}

.site-content section:first-child .mid-content {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.parallax-section h1 > span {
    display: none;
}

.tagline {
    font-size: 22px;
    font-family: 'Raleway-Regular', sans-serif;
    line-height: 1.3;
}
.about .tagline {
    font-size: 26px;
}
.heading {
    font-weight: bold;
    margin-bottom: 0;
    text-transform: uppercase;
}

.brand {
    color: #ca992c;
}

.parallax-section {

}

/* values */
.values_template {
    padding: 0;
}
.values_template .tagline {
    font-size: 45px;
    font-family: Raleway-Regular, sans-serif;
    font-weight: bold;
}
.values_template .media-body h1 {
    margin: 30px 0;

}

.values_template .media {
    padding: 0;

    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;

    /*-webkit-flex-flow: row wrap;*/
    justify-content: flex-start;
    align-items: stretch;
}
.values_template .media-object,
.values_template .media-body {

}

.values_template .media-object img {
    visibility: hidden;
}
.philosophies .media-object {
    background: url('../images/PEAR-PHILOSOPHIES.jpg') no-repeat center center;
}
.mission .media-object {
    background: url('../images/PEAR-MISSION-STATEMENT.jpg') no-repeat center center;
}
.vision .media-object {
    background: url('../images/PEAR-VISION.jpg') no-repeat center center;
}

.values_template .media-object {
    width: 50%;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.values_template .media-body {
    padding: 30px 8% 0 5%;
}
.values_template .media--rev .media-body {
    padding: 30px 5% 0 8%;
}


.bx-wrapper .bx-controls-direction a {
    position: absolute;
    top: 50%;
    margin-top: -50px;
    outline: 0px none;
    z-index: 9999;
    text-indent: 0;
    width: auto;
    height: auto;
}

.bx-wrapper .bx-prev,
.bx-wrapper .bx-next {
    font-size: 100px;
    line-height: 1;
    border-radius: 10px;
    background-image: none;

}
/* solutions */
.parallax-section:nth-child(3) h1 {
    color: #fff;
    border-color: #fff;
}
.parallax-section:nth-child(3) .tagline {
    font-family: 'Helvetica-Light', 'OpenSans-Light', sans-serif;;
    font-size: 30px;
    color: #f8ea8d;
}
.parallax-section:nth-child(3) ul {
    list-style-type: disc;
    list-style-position: outside;
    padding-left: 30px;
}
.parallax-section:nth-child(3) li {
    font-family: 'OpenSans-Regular', 'OpenSans-Regular', sans-serif;
    font-size: 20px;
    margin-bottom: 8px;
}

/* portfolio */
.portfolio h1 {
    margin-bottom: 22px;
}
.portfolio .other p {
    font-size: 20px;
    line-height: 0.5;
}
.portfolio .flex-container {
    max-width: 900px;
    margin-top: 50px;
}

.portfolio .tagline {
    font-size: 30px;
    font-family: Helvetica, sans-serif;
}
/* process */
.process {
    color: #fff;
}
.process h1 {
    border-color: #ca992c;
}
.process .tagline {
    font-family: 'Helvetica', 'OpenSans-Regular', sans-serif;
    max-width: 100%;
    margin-bottom: 80px;
}
.process .flex-container {
    justify-content: flex-start;
}
.process .flex-item {
    width: 49%;
    max-width: 49%;

    padding-right: 60px;
    padding-bottom: 40px;
}
.process .media {
    align-items: flex-start;
}
.process .media-body {
    margin-left:  30px;
    font-family: 'Helvetica', 'OpenSans-Regular', sans-serif;
}

/* the pearers */
.the-pearers .flex-item {
    max-width: 49%;
}
.the-pearers .tagline {
    font-family: 'Helvetica', 'OpenSans-Regular', sans-serif;
    max-width: 100%;
    margin-bottom: 80px;
}

/* contact */
.contact h1 {
    border-color: #ca992c;
}
.contact .media-object {
    width: 50%;
}
.contact .media-body {
    padding: 30px 100px;
}

.contact .flex-container {
    align-items: stretch;
}
.contact ul {
    list-style-type: none;
}
.contact .media-body span {
    padding-right: 20px;
}
.contact em {
    color: #666;
    margin-left: 20px;
    font-style: normal;
}
.contact em:first-child {
    margin-left: 0;
}
.contact  a {
    color: #fff;
    text-transform: uppercase;
}
.contact a:hover,
.contact a.active {
    color: #ca992c;
}

.contact-label {
    color: #666;
    margin-left: 20px;
}

.contact .social-icons {
    float: none;
    padding: 40px 0;
}
.contact .social-icons a {
    color: #000;
}

.map-link {
    display: inline-block;
    margin-top: 40px;
}

/* google maps */
.google-map {
    width:100%;
    height:1000px;
}

.map-btn-close {
    color: #666 !important;
    top: -40px !important;
    right: 20px !important;
}

#map-modal-content {
    width: 100vw;
    height: 100vh;
}

/* careers */
.careers {
    color: #fff;
}
.careers .h1 {
    margin: 0 auto 30px ;
    border-color: #ca992c;
}
.careers h2 {
    color: #ca992c;
    margin: 60px auto;
}
.mail-link,
.mail-link:hover,
.mail-link:visited {
    color: #fff;
}
.careers .item-list {
    margin-bottom: 88px;
}
.careers .item {
    text-align: left;
    border-bottom: 1px solid rgba(202, 153, 44, 0.13);
    margin-bottom: 10px;
    padding-top: 20px;
    padding-bottom: 20px;
}
.careers .item-title {
    color: #fff;
    cursor: pointer;
    text-transform: uppercase;
}
.careers .item-title:hover {
    color: #ca992c;
}
.careers .item-excerpt,
.careers .item-content {
    color: #666;
}
.careers .social-icons {
    float: none;
}
.careers .item-content {
    display: none;
}
.careers .expanded .item-content {
    display: block;
}
.careers .item .fa {
    float: left;
    margin: 3px 7px 0 -17px;
    color: #ca992c;
}
.more-link {
    margin-top: 12px;
    font-size: 12px;
    display: block;
}
.rpwe-block {
    margin-bottom: 100px;
}
.rpwe-block ul {
    list-style: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}
.rpwe-block li {
    border-bottom: 1px solid rgba(202, 153, 44, 0.13);
    margin-bottom: 10px;
    padding-top: 20px;
    padding-bottom: 20px;
    list-style-type: none;
    text-align: left;
}
.rpwe-block a {
    display: block !important;
    text-decoration: none;
    color: #ca992c;
    font-size:12px;
}
.rpwe-block h3 {
    background: none !important;
    clear: none;
    margin-bottom: 0 !important;
    margin-top: 0 !important;
    font-weight: 400;
    font-size: 16px !important;
    line-height: 1.5em;
}
.rpwe-block h3 a {
    color: #fff;
    font-weight: bold;
    font-size:16px;
}
.rpwe-thumb {
    border: 1px solid #eee !important;
    box-shadow: none !important;
    margin: 2px 10px 2px 0;
    padding: 3px !important;
}
.rpwe-summary {
    font-size: 16px;
    color:#666;
}
.rpwe-time {
    color: #bbb;
    font-size: 11px;
}
.rpwe-alignleft {
    display: inline;
    float: left;
}
.rpwe-alignright {
    display: inline;
    float: right;
}
.rpwe-aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.rpwe-clearfix:before,.rpwe-clearfix:after {
    content: "";
    display: table !important;
}
.rpwe-clearfix:after {
    clear: both;
}
.rpwe-clearfix {
    zoom: 1;
}

/* Large */
.flex-container {
    padding: 0;
    margin: 0 auto 30px;
    list-style: none;

    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: block;

    flex-flow: wrap;
    -webkit-flex-flow: row wrap;
    justify-content: center;
}

.flex-item {

    margin-top: 10px;
}


footer {
    display: none;
}


/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 9999; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,1); /* Black w/ opacity */
}

/* Modal Content (Image) */
.modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 960px;
}

/* Caption of Modal Image (Image Text) - Same Width as the Image */
#caption {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

/* Add Animation - Zoom in the Modal */
.modal-content, #caption {
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
    from {-webkit-transform:scale(0)}
    to {-webkit-transform:scale(1)}
}

@keyframes zoom {
    from {transform:scale(0)}
    to {transform:scale(1)}
}

/* The Close Button */
.close {
    position: fixed;
    top: -40px;
    right: 40px;
    color: rgba(255,255,255,.5);
    font-size: 100px;
    transition: 0.3s;
    font-family: 'OpenSans-Light';
    z-index: 9999;
}
.logged-in .close {
    top: 0;
}

.close:hover,
.close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

/* lang */
#lang_sel_list {
    float: right;
    top: 9px;
}
#lang_sel_list ul {
    border: none !important;
}
#lang_sel_list a {
    color: #fff !important;
    background: none !important;
    font-size: 13px;
    font-family: Raleway-Regular, sans-serif;
    display: inline-block !important;
    padding-right: 8px;
}

#lang_sel_list li:last-child:before {
    content: '/' !important;
    color: rgba(255, 255, 255, 0.61);
    font-size: 16px;
}


/*nav bar toggle */
.navbar-toggle {
    position: fixed;
    margin-right: 0;
    padding: 8px;
    margin-top: -6px;
    margin-bottom: 0;
    background-color: rgba(51, 51, 51, 0.25);
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    z-index: 2;
    right: 10px;
    cursor: pointer;
    border-color: #333;
}

.navbar-toggle:focus {
    outline: 0;
}
.navbar-toggle .icon-bar {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 1px;
    background-color: #fff;
    position: relative;
    transition: all 500ms ease-in-out;
}
.navbar-toggle .icon-bar + .icon-bar {
    margin-top: 4px;
}

.navbar-toggle:hover,
.navbar-toggle:focus {
    background-color: rgba(51, 51, 51, 0.25);
}
.navbar-toggle.affix {
    position: fixed !important;
}

.bx-wrapper .bx-pager.bx-default-pager a {
    background: #999;
    text-indent: -9999px;
    display: block;
    width: 30px;
    height: 30px;
    margin: 0 12px;
    outline: 0;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    border-radius: 15px;
    border: 8px solid #fff;
}

.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto {
    bottom: 40px;
}

.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
    background: #ca992c;
}

@media screen and (min-width: 920px){
    .portfolio .flex-item {
        padding: 0;
        margin: 20px;
        width: 28%;
    }
}

@media screen and (max-width: 920px){
    .portfolio .flex-item {
        padding: 0;
        margin: 20px;
        width: 23%;
    }
}

@media screen and (max-width: 480px){
.portfolio .flex-item {
    padding: 0;
    margin: 20px;
    width: 36%;
    float: left;
    }
}