.main{
    display:flex;
    background: #11587D;
    padding-top: 80px;
    text-align: center;
    padding-bottom: 100px;
}

h1{
    color:white;
}

.main p{
    color: white;
}

.main .btn{
    border-color: white;
    background-color: white;
}

.problems-section{
    display:flex;
    background: white;
    text-align: center;
    padding-top: 40px;
    padding-bottom: 90px;
}

.problem{
    border-radius: calc(0.625rem + 4px);
    border-style: solid;
    border-width: 1px;
    border-color: #dadada;
    padding: calc(0.25rem * 6);
    background: white;
    margin-top: 25px;
    text-align: left;
    transition: all 0.2s ease;
}

.problem:hover{
    box-shadow: 0 10px 6px -5px rgba(0, 0, 0, 0.1);
}

.problem i{
    display: block;
    width:56px;
    height:56px;
    color: #11587D;
    font-weight: 700;
    font-size: 2.4em;
    text-align: center;
    align-items: center;
    line-height: 56px;
    border-radius: 0.625rem;
}

.services-section{
    background: #ececec;
    text-align: center;
    padding-top: 60px;
    padding-bottom: 90px;
    display: flex;
}

.services-section h2{
    color: #121222;
}

.service{
    border-radius: calc(0.625rem + 4px);
    border-style: solid;
    border-width: 1px;
    border-color: #dadada;
    padding: calc(0.25rem * 6);
    background: white;
    text-align: left;
    margin-top: 25px;
    box-shadow: 0 5px 3px -5px rgba(0, 0, 0, 0.25);
    transition: all 0.2s ease;
}

.service:hover{
    box-shadow: 0 10px 6px -5px rgba(0, 0, 0, 0.1);
}

.service > i{
    display: block;
    width:56px;
    height:56px;
    background-color: rgba(17, 88, 125, 0.25);
    color: #11587D;
    font-size: 1.7em;
    text-align: center;
    align-items: center;
    line-height: 56px;
    border-radius: 0.625rem;
}

.location{
    display: flex;
    background: white;
    padding-top: 60px;
    padding-bottom: 30px;
    text-align: center;
}

.location i{
    font-size: 3.6em;
    font-weight: 700;
    color:#11587D;
}

.location p{
    margin-bottom: 50px;
}

.other-location{
    margin-top: 40px;
    color: #121222;
    background-color: #ececec;
    border-radius: calc(0.625rem + 4px);
    padding: 23px;
    border-left: 3px solid #11587D;
}

.location span{
    display: inline-block;
    min-width: 220px;
    background: #ececec;
    padding-top: 15px;
    padding-bottom: 15px;
    border-radius: calc(0.625rem + 4px);
    margin: 10px;
    transition: all 0.2s ease;
}

.location span:hover{
    background: #11587D;
    color:white;
}

.why{
    display: flex;
    background-color: #11587D;
    padding-top: 40px;
    padding-bottom: 60px;
    color:white;
    text-align: center;
}

.why-reason{
    display: block;
    margin-top: 60px;
}

.why-reason p{
    color: white;
}

.why-reason > i{
    display: inline-block;
    font-size: 2em;
    width: 70px;
    height:70px;
    text-align: center;
    align-items: center;
    line-height: 72px;
    border-radius: 100%;
    background: rgba(255,255,255,0.1);
}

.why-reason:last-of-type > i{
    line-height: 76px;
}

.need-help{
    background: #ececec;
    display: flex;
    padding-top: 70px;
    padding-bottom: 70px;
    text-align: center;
}

.need-help .container > i{
    color:#11587D;
    font-size: 3em;
}

.need-help .btn:first-of-type{
    background-color: #11587D;
    border-color: #11587D;
    color: white;
}

.need-help .btn:last-of-type{
    border-color: #11587D;
    color: #11587D;
}

.need-help .btn{
    margin-top: 40px;
    display: inline-block;
}


@media screen and (min-width: 800px) {
    .problems > div {
        display: flex;
        flex-wrap: wrap;
    }
    
    .problem{
        width: calc(33% - 60px);
        float: left;
        margin-right: 20px;
    }

    .problem:last-of-type{
        margin-right: 0px;
    }

    .services > div {
        display: flex;
        flex-wrap: wrap;
    }

    .service{
        width: calc(33% - 60px);
        float: left;
        margin-right: 20px;
    }

    .service:last-of-type{
        margin-right: 0px;
    }

    .why-reason{
        width: calc(25% - 25px);
        float: left;
        margin-right: 30px;
    }

    .why-reason:last-of-type{
        margin-right: 0px;
    }

    .need-help .btn:first-of-type{
        margin-right: 30px;
    }
}