/*------------------------------------------------------------------
    IMPORT FONTS
-------------------------------------------------------------------*/

@import url('https://fonts.googleapis.com/css?family=Montserrat:400,500,600,600i,700,700i,800,800i');
@import url('https://fonts.googleapis.com/css?family=Quattrocento+Sans:400,400i,700,700i');

/*------------------------------------------------------------------
    SKELETON
-------------------------------------------------------------------*/


/*------------------------------------------------------------------ LOADER -------------------------------------------------------------------*/

#back-to-top {
    position: fixed;
    bottom: 40px;
    right: 40px;
    z-index: 9999;
    width: 32px;
    height: 32px;
    text-align: center;
    line-height: 30px;
    background: #d33b33;
    color: #ffffff;
    cursor: pointer;
    border: 0;
    border-radius: 2px;
    text-decoration: none;
    transition: opacity 0.2s ease-out;
    font-size: 30px;
}


/*------------------------------------------------------------------ Footer Main -------------------------------------------------------------------*/

section .footing {
    position: absolute;
    bottom: 0px;
    width: 100%;
    background: #ffff;
}

section .footer-main {
    display: flex;
}

section .footer-main .box {
    flex-basis: 50%;
    padding: 10px 20px;
}

.social {
    margin: 20px 0 0 0;
}

.social a {
    color: #000;
    padding: 0 2px;
}

.social a span {
    height: 40px;
    width: 40px;
    background: #1a1a1a;
    line-height: 40px;
    text-align: center;
    border-radius: 5px;
    transition: 0.3s;
}

.social a span:hover {
    background: #f12020;
}

.box h4 {
    color: #000;
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 20px;
    position: relative;
    font-weight: 700;
}

.box h4::before {
    width: 100%;
    content: "";
    height: 3px;
    position: absolute;
    bottom: -3px;
    left: 0px;
    background: #1a1a1a;
}

.box h4::after {
    position: absolute;
    content: "";
    height: 3px;
    background: #f12020;
    bottom: -3px;
    left: 0px;
}

.left h4::after {
    width: 45%;
}

.center h4::after {
    width: 35%;
}

.right h4::after {
    width: 40%;
}

.feedback h4::after {
    width: 35%;
}

.box .content {
    margin: 20px 0 0 0;
    position: relative;
}

.solo a {
    color: #000;
    text-align: left;
    text-decoration: none;
    display: block;
    line-height: 32px;
    position: relative;
    padding-left: 15px;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
}

.solo a::before {
    font-family: FontAwesome;
    content: "\f105";
    position: absolute;
    left: 5px;
    line-height: 30px;
    font-size: 16px;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
}

.solo a:hover::before {
    left: 5px;
}

.solo a:hover {
    color: #d33b33;
    padding-left: 20px;
}

.solo,
.dual,
.dual a {
    color: #000;
    text-align: left;
    text-decoration: none;
}

.dual a:hover::before {
    left: 0px;
}

.dual a:hover {
    color: #d33b33;
    padding-left: 5px;
}

.dual .fas {
    font-size: 18px;
    background: #1a1a1a;
    height: 30px;
    width: 30px;
    line-height: 30px;
    text-align: center;
    border-radius: 50%;
    transition: 0.3s;
    cursor: pointer;
}

.dual .fas:hover {
    background: #f12020;
}

.dual .text {
    font-size: 1.0625rem;
    font-weight: 500;
    padding-left: 2px;
}

.dual .phone {
    margin: 10px 0;
}

.solo form .text {
    font-size: 1.0625rem;
    margin-bottom: 2px;
    color: #656565;
}

.solo form .msg {
    margin-top: 10px;
}

.solo form input,
.solo form textarea {
    color: #dfdbdb;
    width: 100%;
    font-size: 1.0625rem;
    background: #151515;
    padding-left: 10px;
    border: 1px solid #222222;
}

.solo form input:focus,
.solo form textarea:focus {
    outline-color: #3498db;
}

.solo form input {
    height: 35px;
}

.solo form .btn {
    margin-top: 10px;
}

.solo form .btn button {
    height: 40px;
    width: 100%;
    border: none;
    outline: none;
    color: #ffffff;
    background: #f12020;
    font-weight: 500;
    cursor: pointer;
    transition: 0.3s;
}

.solo form .btn button:hover {
    background: #000;
}


/*------------------------------------------------------------------ Copyright -------------------------------------------------------------------*/

.footer-bottom {
    background: #2c2c2c;
    padding: 20px 0px;
    position: relative;
}

.footer-bottom center {
    text-align: center;
    color: #656565;
    font-size: 16px;
}

.footer-bottom center a {
    color: #d33b33;
    text-decoration: none;
}

.footer-bottom center a:hover {
    text-decoration: underline;
}

@media screen and (max-width: 900px) {
    footer {
        position: relative;
        bottom: 0px;
    }
    .footer-main {
        flex-wrap: wrap;
        flex-direction: column;
    }
    .footer-main .box {
        margin: 5px 0;
    }
}