/*
Theme Name: Searail Theme
Theme URI: http://www.janbijster.com
Template: freesia-empire
Author: Jan Bijster
Author URI: http://www.janbijster.com
Description: Theme for Searail Multimodal B.V. website
Tags: threaded-comments,left-sidebar,right-sidebar,custom-background,custom-colors,custom-header,custom-menu,editor-style,featured-images,sticky-post,theme-options,translation-ready,post-formats,footer-widgets,blog,education,entertainment
Version: 1.3.0.1.1559300508
Updated: 2019-05-31 12:01:48

*/

@import "colors.css";

/* remove boxed-layout for smaller screens */
@media only screen and (max-width: 1023px) {
    .container, .boxed-layout #page, .boxed-layout-small #page, #site-title a img {
        width: 100% !important;
        margin: 0;
    }
    .main-navigation > ul > li {
        padding: 0 10px;
    }
}

/* bring back some content padding */
.tf-business-template #content, .two-column-blog #content, .portfolio_page #content, .about_us #content, .team #content, #content {
    padding: 20px 20px 20px;
}

.top-header {
    padding: 10px 20px;
}

/* display tel and email smaller screens */
@media only screen and (max-width: 767px) {
    #site-description {
        display: block !important;
    }
}

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

/* custom-services */
.custom-services-block {
    min-height: 270px;
    padding-bottom: 0;
}
.custom-services-entry {
    color: #728a4c;
    font-weight: 300;
    font-size: 18px;
    line-height: 27px;
}
.custom-services-entry > svg {
    height: 0.7em;
    width: 0.5em;
    vertical-align: middle;
    margin-right: 0.5em;
}

/* custom selling-points */
.searail-feature-column {
    float: left;
    height: 250px;
    padding: 40px 0;
}

.searail-feature-column.color-light, .searail-feature-column.color-light > * {
    color: #fff;
}

.searail-feature-column.color-dark, .searail-feature-column.color-dark > * {
    color: #545454;
}

.searail-feature-bg-green {
    background-color: #728a4c;
}
.searail-feature-bg-white {
    background-color: #fff;
}

.searail-feature-bg-img-1 {
    background-image: url("./images/container_light.jpg")
}
.searail-feature-bg-img-2 {
    background-image: url("./images/road_toll_light.jpg")
}
.searail-feature-bg-img-1, .searail-feature-bg-img-2 {
    background-size: cover;
    background-position: center;
}

@media screen and (max-width: 940px) {
    .searail-feature-column h2 {
        font-size: 20px;
    }
}
@media screen and (max-width: 600px) {
    .searail-feature-column {
        width: 100%;
    }
}

/* page styling: */
.page-title {
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-align: center;
    padding: 0px;
    width: 100%;
    color: #545454;
}
.page-header {
    background-color: #f2f3f0;
    padding: 7px 20px;
    position: relative;
    overflow: hidden;
}

.btn {
    background-color: #728a4c;
    padding: 7px 28px;
    color: #fff;
    font-weight: 400;
    text-transform: uppercase;
}

.btn:hover {
    background-color: #647944;
}

.our_feature:after {
    display: none;
}

.max-width-600 {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}
.padding-sides-20 {
    padding-left: 20px;
    padding-right: 20px;
}
div#content {
    padding-top: 40px;
}

/* slider */
.main-slider .container {
    position: absolute;
    right: 60px;
    bottom: 20px;
    height: auto;
    width: 50vw;
}
.main-slider h2, .slider-content .slider-title {
    padding-bottom: 0;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 29.5px;
}
.slider-content {
    width: calc(100% - 20px);
}
@media screen and (max-width: 1023px) {
    .main-slider h2, .slider-content .slider-title {
        font-size: 27.7px;
    }
}
@media screen and (max-width: 446px) {
    .main-slider .container {
        right: 10px;
    }
    .main-slider h2, .slider-content .slider-title {
        font-size: 20px;
    }
    .slider-content .slider-text h3 {
        font-size: 16px;
    }
}

/* footer */
.widget_contact ul li {
    margin: 0 0 5px 5px;
}

.boxed-layout #colophon, .boxed-layout-small #colophon {
    margin-bottom: 0px;
}
.site-info {
    display: none;
}