.bg-cover {
        background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('anhlop11.jpg');
        background-size: cover;
        background-repeat: no-repeat;
    }
    .display-3 {
        color: white;
    }
    .lead {
        color: white;
    }
    .navbar-brand{
        font-size: 2rem;
    }
    
    .h69 {
    font-size: 20px;
    color: #333;
    text-align: left;
    font-weight: bold;
}
.socialfooter{
    color:gray;
}
.socialfooter2{
    color:gray;
}
.socialfooter:hover {
color:367CE5;
}
.socialfooter2:hover {
color:E9A92A;
}
* {
    box-sizing: border-box;
}

.button {
    display: inline-block;
    font-family: "Montserrat", "Trebuchet MS", Helvetica, sans-serif;
    -webkit-font-smoothing: antialiased;
    position: relative;
    padding: .8em 1.4em;
    padding-right: 4.7em;
    background: @button-colour;
    border: none;
    color: white;
    transition: .2s;
    &:before,
    &:after {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        padding-top: inherit;
        padding-bottom: inherit;
        width: 2.8em;
        content: "\00a0";
        font-family: 'FontAwesome', sans-serif;
        font-size: 1.2em;
        text-align: center;
        
        transition: .2s;
        transform-origin: 50% 60%;
    }
    &:before {
        background: @button-tint;
    }
    &:hover {
        background: darken(@button-colour, 10%);
    }
    &:active,
    &:focus {
        background: darken(@button-colour, 30%);
        outline: none;
    }
}

.button {
    min-width: 15em;
}

.arrow {
    background: #FE5F55;
    &:hover {
        background: darken(#FE5F55, 10%);
    }
    &:active,
    &:focus {
        background: darken(#FE5F55, 30%);
    }
    &:after {
        content: "\F054";
    }
    &:hover:after {
        -webkit-animation: bounceright .3s alternate ease infinite;
        animation: bounceright .3s alternate ease infinite;
    }
}

.phone { 
    background: #139675;
    &:hover {
        background: darken(#139675, 10%);
    }
    &:active,
    &:focus {
        background: darken(#139675, 20%);
    }
    &:after {
        content: "\F095";
    }
    &:hover:after {
        -webkit-animation: wiggle .05s alternate ease infinite;
        animation: wiggle .05s alternate ease infinite;
    }
}

.email {
    background: #C673B3;
    &:hover {
        background: darken(#C673B3, 10%);
    }
    &:active,
    &:focus {
        background: darken(#C673B3, 20%);
    }
    &:after {
        content: "\F0E0";
    }
    &:hover:after {
        -webkit-animation: none;
        -webkit-transform: skew(-20deg);
        animation: none;
        transform: skew(-20deg);
        text-indent: .1em;
    }
}

.search {
    &:after {
        content:"\f002";
    }
    &:hover:after {
        -webkit-animation: none;
        -webkit-transform: scale(1.4);
        animation: none;
        transform: scale(1.4);
    }
}


@-webkit-keyframes bounceright {
    from { -webkit-transform: translateX(0); }
    to   { -webkit-transform: translateX(3px); }
}

@-webkit-keyframes wiggle {
    from { -webkit-transform: rotate(0deg); }
    to   { -webkit-transform: rotate(30deg); }
}

@keyframes bounceright {
    from { transform: translateX(0); }
    to   { transform: translateX(3px); }
}

@keyframes wiggle {
    from { transform: rotate(0deg); }
    to   { transform: rotate(30deg); }
}