html,
body {
    background: #fcfcfc;
    height: 100%;
}

.photo-gallery {
    text-align: center;
}
.photo-gallery
    > * {
    display: inline-block;
    margin: 2px;
}

.service-container
    > * {
    display: inline-block;
    width: 24%;
    box-sizing: border-box;
    vertical-align: top;
    text-align: center;
    margin-top: 8px;
}

.about-company {
    display: block;
    text-align: center;
    padding-top: 12px;
    width: 200px;
    text-decoration: underline;
    color: #03508e;
}
.about-company:hover {
    text-decoration: none;
}

.price-comparison {
    display: block;
    padding-bottom: 15px;
    font-size: 18px;
}

.company-page {
    display: block;
    padding-top: 12px;
    font-size: 15px;
}

.company-page:hover {
    color: #3d88c4;
}

.directions-page {
    display: block;
    padding-bottom: 10px;
    font-size: 15px;
}

.directions-page:hover {
    color: #3d88c4;
}

.configurator-container {
    display: flex;
}

.configurator-sidebar {
    width: 300px;
    padding-right: 20px;
    border-right: 2px
        solid
        #03508e;
}
.configurator-sidebar
    h3 {
    margin: 0;
    border-bottom: 1px
        solid
        #03508e;
}
.configurator-sidebar
    .field-container {
    margin-top: 24px;
}

.configurator-content {
    flex-grow: 1;
    margin-left: 20px;
}

.overlay {
    background: radial-gradient(
        ellipse
            at
            center
            20%,
        rgba(
                0,
                0,
                0,
                0.6
            )
            0,
        #0d0f19
            90%
    );
    z-index: 9999;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.wrap {
    min-height: 100%;
    height: auto;
    margin: 0
        auto -60px;
    padding: 0
        0
        60px;
}

.wrap
    > .container {
    padding: 10px
        15px
        20px;
}

.frame,
.map-frame {
    border: 10px
        #fbf5e2;
    background: #fffbf5;
    background-clip: padding-box;
    padding: 15px;
    margin-bottom: 30px;
    box-shadow: 0px
        0px
        5px
        5px
        #eaeaea;
    border-radius: 5px;
}
.map-frame {
    border-color: rgb(
        239,
        245,
        230
    );
}
.frame-hgihlight {
    border-color: #fbf5e2;
}

a {
    color: #03508e;
}

h1,
.big-title {
    font-size: 25px;
    margin-bottom: 15px;
}
h2 {
    font-size: 22px;
    margin: 0
        0
        10px
        0;
}

.title {
    position: relative;
    display: inline-block;
    font-size: 23px;
    margin: 0;
    font-weight: bold;
}

.companies-body,
.company-body {
    margin: 0;
}
.companies-body
    > div {
    margin-top: 15px;
    padding-left: 0;
}
.company-body
    > div {
    padding-left: 0;
}
.company-sidebar {
    text-align: center;
}
.company-name {
    display: block;
    margin-bottom: 10px;
}
.company-column {
    font-size: 1.2em;
    vertical-align: middle;
}
.company-logo {
    width: 200px;
    border: 1px
        solid
        #ffa500;
    background-color: #fff;
    padding: 8px
        8px;
    border-radius: 5px;
}
.company-points {
    font-size: 1.2em;
    color: black;
    padding: 2px
        3px;
    border-radius: 5px;
    border: 1px
        solid
        #d2d2d2;
    background-color: #fff;
}
.company-info {
    margin-top: 6px;
}
.company-info
    > div {
    margin: 10px
        0;
}
.branch-contacts,
.additional-contacts-btn {
    margin-top: 10px;
}
.additional-contacts-btn {
    font-weight: bold;
    cursor: pointer;
    display: inline-block;
}
.branch-info:nth-child(even) {
    margin-top: 15px;
}

/* table style */
table {
    width: 100%;
}
table
    td {
    padding: 5px;
}
.td-grey {
    border: solid
        1px
        rgb(
            199,
            199,
            199
        );
}

.company-address-table
    thead
    th {
    padding-bottom: 5px;
}
.company-address-table
    tbody
    tr,
.company-address-table
    td {
    border: #e9ebee
        solid
        1px;
}
.company-address-table
    td {
    padding: 5px;
}
.company-address-table
    td:nth-child(1) {
    width: 20%;
}
.company-address-table
    td
    a:hover {
    text-decoration: none;
}
.company-address-table
    td:nth-child(2) {
    width: 20%;
}
.company-address-table
    td:nth-child(3) {
    width: 35%;
}
.company-address-table
    td:nth-child(4) {
    width: 25%;
}
/* table style end */

.br {
    margin-bottom: 15px !important;
}
.reverse-br {
    margin-top: 15px !important;
}
.cb {
    clear: both;
}
.fwb {
    font-weight: bold;
}
.fsi {
    font-style: italic;
}
.tdu {
    text-decoration: underline;
}
.vam {
    vertical-align: middle;
}
.tac {
    text-align: center;
}
.icon-20 {
    height: 20px;
}
.service-icons {
    height: 25px;
    display: inline-block;
}
.btn-blue,
.btn-green {
    background: #eb9900;
    color: fff;
    border: 1px
        solid
        #ffa500;
    background-color: #fff;
    padding: 8px
        8px;
    border-radius: 5px;
    display: inline-block;
    cursor: pointer;
}
.btn-blue:hover,
.btn-green:hover {
    background: #03508e;
    text-decoration: none;
    color: white;
}
.btn-green {
    background: #009846;
    color: #e5ffe6;
}
.btn-green:hover {
    background: #00b352;
}
.btn-review {
    width: 200px;
    margin-top: 15px;
    text-align: center;
}

header,
.footer {
    background-color: #fff;
}
header {
    padding: 4px
        0px
        10px
        0px;
    border-bottom: 1px
        solid
        #ddd;
}
.header-left-part {
    float: left;
}
.header-left-part
    a {
    text-decoration: none;
}
.logo-text {
    display: inline-block;
    vertical-align: middle;
}
.logo-text
    [href="/"] {
    color: #03508e;
    font-size: 20px;
    font-weight: bold;
}
.header-right-part {
    float: right;
    margin-top: 10px;
}

.footer {
    height: 60px;
    padding-top: 20px;
    border-top: 1px
        solid
        #ddd;
}

footer
    .pull-right
    a {
    margin-left: 8px;
}

.cargo-dedicated-transport-desc {
    display: flex;
    align-items: center;
    border: #f1f0ec
        solid
        1px;
    border-radius: 5px;
    padding: 5px
        10px;
    margin: 5px;
    background: white;
}
.cargo-dedicated-transport-desc
    > div:first-child {
    min-width: 102px;
}
.cargo-dedicated-transport-desc
    > div:first-child
    img {
    height: 40px;
}
.cargo-dedicated-transport-desc
    > div:nth-child(2) {
    flex: auto;
}

.cargo-transportation-link {
    width: 30%;
    padding: 5px;
    margin: 5px;
    box-sizing: border-box;
    display: inline-block;
}

@media (max-width: 991px) {
    .center-media-width991 {
        float: none !important;
        text-align: center;
        justify-content: center;
    }
}

@media (max-width: 720px) {
    .service-container {
        text-align: center;
    }
    .service-container
        > * {
        min-width: 120px;
    }

    .cargo-transportation-link {
        width: 45%;
    }

    .service-icons {
        height: 40px;
        margin: 4px;
    }
    .hide-block {
        display: none;
    }

    .header-left-part {
        float: none;
    }
    .header-right-part {
        text-align: center;
        border-top: solid
            1px
            #ddd;
        padding-top: 4px;
        float: none;
    }
}

[disabled],
[read-only] {
    background: #f7f7f7;
    cursor: not-allowed;
}

.form-control {
    display: inline-block;
}

.trankomp-input {
    display: inline-block;
    width: 100%;
    height: 34px;
    padding: 6px
        12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555555;
    background-color: #fff;
    background-image: none;
    border: 1px
        solid
        #ccc;
    border-radius: 4px;
}

/* Customized Checkbox Input and Radio */
/*
    Example:
    <input type="radio" name="example" id="exampleId" value="exampleValue">
    <label for="exampleId">Some text</label>
*/
[type="radio"],
[type="checkbox"] {
    display: none;
}

label
    > input[type="radio"],
label
    > input[type="checkbox"] {
    display: inline-block;
}

[type="radio"]
    + label,
[type="checkbox"]
    + label {
    display: inline-block;
    cursor: pointer;
    padding: 2px
        0;
    margin: 0;
    font-weight: normal;
}

[type="radio"]
    + label::before,
[type="checkbox"]
    + label::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    border: #c3c3c3
        1px
        solid;
    border-radius: 50%;
    vertical-align: middle;
    margin-right: 6px;
}
[type="checkbox"]
    + label::before {
    width: 16px;
    height: 16px;
    border-radius: 2px;
}

/* [type="radio"] + label:hover::before,
[type="checkbox"] + label:hover::before {
    background: #c3c3c3;
} */
[type="radio"]
    + label:hover,
[type="checkbox"]
    + label:hover {
    color: #c3c3c3;
}

[type="radio"]:checked
    + label::before {
    background: #c2c2c2;
}
[type="checkbox"]:checked
    + label::before {
    background: center
        center
        no-repeat
        url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABmJLR0QA/wD/AP+gvaeTAAAAjklEQVQ4jcXPuw4BURQF0KWiQYhehUYUxqcTJlpU+AQaj0TCD2gUSCaTMeRK2O09a59z+XcKX9geGqG4ixNGIbiDI2Yoh+AD5iG4jX0WrqL4AX65OcYwp6SFHRaoZA1EOGOMUuqtiS1WqOWd2H+UTBIlSVzPw+mS2P3PG6w/xc8McMEVy3dnv0qEaSj+fW7ZxBwbr7HkEAAAAABJRU5ErkJggg==");
    background-color: white;
    border-radius: 2px;
}
[type="radio"]:checked
    + label,
[type="checkbox"]:checked
    + label {
    color: black;
}

[type="radio"]:disabled
    + label,
[type="checkbox"]:disabled
    + label {
    filter: grayscale(
        1
    );
    cursor: not-allowed;
}
/* Customized Checkbox Input and Radio END */

/* Loader */
/*
    Example:
    <div class="spinner">
        <div class="bounce1"></div>
        <div class="bounce2"></div>
        <div class="bounce3"></div>
    </div>
*/
.spinner {
    margin: 5px
        auto
        0;
    width: 70px;
    text-align: center;
}
.spinner
    > div {
    width: 18px;
    height: 18px;
    background-color: #66afe9;
    border-radius: 100%;
    display: inline-block;
    -webkit-animation: sk-bouncedelay
        1.4s
        infinite
        ease-in-out
        both;
    animation: sk-bouncedelay
        1.4s
        infinite
        ease-in-out
        both;
}
.spinner
    .bounce1 {
    -webkit-animation-delay: -0.32s;
    animation-delay: -0.32s;
}
.spinner
    .bounce2 {
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}
@-webkit-keyframes sk-bouncedelay {
    0%,
    80%,
    100% {
        -webkit-transform: scale(
            0
        );
    }
    40% {
        -webkit-transform: scale(
            1
        );
    }
}
@keyframes sk-bouncedelay {
    0%,
    80%,
    100% {
        -webkit-transform: scale(
            0
        );
        transform: scale(
            0
        );
    }
    40% {
        -webkit-transform: scale(
            1
        );
        transform: scale(
            1
        );
    }
}
.video {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    border: 1px
        solid
        #ccc;
}
.video
    iframe,
.video
    object,
.video
    embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
nav
    ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
nav
    li {
    display: inline-block;
    margin: 0
        5px;
    transition: all
        0.3s;
}
nav
    a {
    display: block;
    color: #285064;
    transition: all
        0.3s;
}
nav
    a:hover {
    color: #12242d;
}
nav
    span {
    display: block;
    line-height: 1.2;
}
nav
    li {
    margin: 0;
    transform: skewX(
        -10deg
    );
    border: 1px
        solid
        #175a91;
}
nav
    a {
    padding: 2px
        8px;
    color: #000;
    background-color: #fffbf5;
}
nav
    a:hover {
    color: #fff;
    background-color: #03508e;
}
nav
    span {
    transform: skewX(
        10deg
    );
    line-height: 1;
}
.tk2020
    ul {
    list-style: none;
    width: 100%;
    margin: 15px
        0
        10px
        0;
    padding: 0;
}
.tk2020
    li {
    margin-bottom: 5px;
}
.tk2020
    li
    a {
    text-decoration: none;
    color: #03508e;
    display: block;
    padding: 5px
        0
        0
        8px;
    border-left: 5px
        solid
        #03508e;
}
.tk2020
    li
    a:hover {
    background: #03508e;
    color: #fff;
    border-left: 5px
        solid
        #ffa500;
}
.strelka {
    margin-bottom: 5px;
    vertical-align: middle;
    display: inline-block;
    width: 0;
    height: 0;
    border-top: 10px
        solid
        transparent;
    border-bottom: 10px
        solid
        transparent;
    border-left: 10px
        solid
        #f29c00;
}
/* Loader End */
