@charset "utf-8";

<link href="https://fonts.googleapis.com/css?family=Montserrat:400,500,700" rel="stylesheet">

body{ font-family: 'Montserrat', sans-serif; }

.mobileview{ max-width: 480px; margin: 0 auto; }

.player{
    font-family: 'Montserrat', sans-serif;
    letter-spacing: 0px;
    padding: 14px 1px;
    text-align: center;
}

.border-top{
    border-top: #484848 solid 1px;
    margin: 0px 10px 10px 10px;
}

header{
    font-family: 'Montserrat', sans-serif !important;
    padding: 5px;
    font-size: 15px;
    text-align: center;
    background-color: black;
    color: #fff;
    font-weight: 500;
	background-image:url(../images/header-bg.jpg);
    background-size: cover;
}

header h1{
    font-size: 29px;
    color: #000;
    letter-spacing: -2px;
    text-align: center;
    color: #fff;
    font-weight: 700;
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    text-align: right;
    margin-top: 0px;
    right: 5px; 
}

header .logo{ position: absolute; transform: translateY(-50%); top: 50%; left: 0px;  }
header .col-xs-5,
header .col-xs-7{ padding: 3px !important; min-height: 150px; position: relative; min-height: 75px !important; }

#distance{
    margin-top: 10px !important;
}

.km{ font-size: 30px; }

.km-text{ font-size: 15px; }

.mymap{ padding: 0px; overflow: hidden; }

footer{
    font-family: 'Montserrat', sans-serif !important;
	background-image:url(../images/footer-bg.jpg);
    background-size: cover;
    color: #fff;
    padding: 10px;
    margin-top: 0px;
    font-size: 15px;
    font-weight: 500;
    text-align: center;
}

footer .col-xs-8,
footer .col-xs-4{ padding: 0px !important; }
footer .col-xs-4{ text-align: right; }


@media (max-width: 575px) {
}

@media (max-width: 767px) { 
}

@media (max-width: 991px){ 
}

@media (max-width: 1199px) {
}