/* Add here all your CSS customizations */

@media only screen and (max-width: 768px) {
    .footerrow {
    }

    @media only screen and (min-width: 768px) {
        .footercontainer {
            max-width: 768px;
        }

        @media (max-width: 650px) {
            .footerrow {
                flex-wrap: wrap;
            }

            .owl-carousel .owl-item img {
                display: block;
                margin-left: auto;
                margin-right: auto;
            }

            p2 {
                color: #323539;
                line-height: 26px;
                margin: 0 0 20px;
            }

                p2.featured {
                    font-size: 1.6em;
                    line-height: 1.5em;
                }

                p2.lead {
                    line-height: 28.8px;
                    line-height: 1.8rem;
                }

                p2 .alternative-font {
                    display: inline-block;
                    margin-top: -15px;
                    position: relative;
                    top: 3px;
                    margin-bottom: -6px;
                }

            svg#curved-line-1 {
                position: absolute;
                top: -10px;
                left: 10px;
                width: 100%;
                height: 180%;
            }

                svg#curved-line-1 .path, svg#curved-line-1 .circle {
                    stroke-dasharray: 1000;
                    stroke-dashoffset: 1000;
                    opacity: 0.3;
                }

            @media (min-width: 992px) and (max-width: 1199px) {
                svg#curved-line-1 {
                    width: 107.4%;
                    -webkit-transform: scale(1.13);
                    transform: scale(1.13);
                }

                .fade-in {
                    animation: fadeIn ease 5s;
                    -webkit-animation: fadeIn ease 5s;
                    -moz-animation: fadeIn ease 5s;
                    -o-animation: fadeIn ease 5s;
                    -ms-animation: fadeIn ease 5s;
                }


                @keyframes fadeIn {
                    0% {
                        opacity: 0;
                    }

                    100% {
                        opacity: 1;
                    }
                }

                @-moz-keyframes fadeIn {
                    0% {
                        opacity: 0;
                    }

                    100% {
                        opacity: 1;
                    }
                }

                @-webkit-keyframes fadeIn {
                    0% {
                        opacity: 0;
                    }

                    100% {
                        opacity: 1;
                    }
                }

                @-o-keyframes fadeIn {
                    0% {
                        opacity: 0;
                    }

                    100% {
                        opacity: 1;
                    }
                }

                @-ms-keyframes fadeIn {
                    0% {
                        opacity: 0;
                    }

                    100% {
                        opacity: 1;
                    }
                }

                /* The style below is just for the appearance of the example div */

                .style {
                    width: 90vw;
                    height: 90vh;
                    text-align: center;
                    padding-top: calc(50vh - 50px);
                    margin-left: 5vw;
                    border: 4px double #F00;
                    background-color: #000;
                }

                    .style p {
                        color: #fff;
                        font-size: 50px;
                    }

                .animated {
                    background-repeat: no-repeat;
                    background-position: left top;
                    padding-top: 95px;
                    margin-bottom: 60px;
                    -webkit-animation-duration: 10s;
                    animation-duration: 10s;
                    -webkit-animation-fill-mode: both;
                    animation-fill-mode: both;
                }

                @-webkit-keyframes fadeIn {
                    0% {
                        opacity: 0;
                    }

                    100% {
                        opacity: 1;
                    }
                }

                @keyframes fadeIn {
                    0% {
                        opacity: 0;
                    }

                    100% {
                        opacity: 1;
                    }
                }

                .fadeIn {
                    -webkit-animation-name: fadeIn;
                    animation-name: fadeIn;
                }

                @keyframes fadeIn {
                    0% {
                        opacity: 0;
                    }

                    100% {
                        opacity: 1;
                    }
                }

                .animated {
                    background-repeat: no-repeat;
                    background-position: left top;
                    padding-top: 95px;
                    margin-bottom: 60px;
                    -webkit-animation-duration: 10s;
                    animation-duration: 10s;
                    -webkit-animation-fill-mode: both;
                    animation-fill-mode: both;
                }

                @-webkit-keyframes fadeIn {
                    0% {
                        opacity: 0;
                    }

                    100% {
                        opacity: 1;
                    }
                }

                @keyframes fadeIn {
                    0% {
                        opacity: 0;
                    }

                    100% {
                        opacity: 1;
                    }
                }

                .fadeIn {
                    -webkit-animation-name: fadeIn;
                    animation-name: fadeIn;
                }

 
                .image-swap {
                            background-image: url('img/whatwedo/3d.jpg');
                            }
                            .image-swap:hover {
                            background-image: url('img/whatwedo/gfx.gif');
                            }

            }
        }
    }
}