@import url('https://fonts.googleapis.com/css?family=Quicksand:400,700&display=swap');

html {
    position: relative;
    min-height: 100%;
}

body {
    font-family: 'Quicksand', sans-serif;
    margin-top: 80px;
    /* Margin bottom by footer height */
    margin-bottom: 80px;
    /* Margin bottom by footer height */
}

/* link */
a:link,
a:visited {
    color: #e67e22;
    text-decoration: none;
}

a:link:active,
a:visited:active {
    color: #f2b705;
}

a.white:link,
a.white:visited {
    color: #fff;
    text-decoration: none;
}

a.white:link:active,
a:visited:active {
    color: #cccccc;
}

/* container */
.container {
    /* width: auto; */
    max-width: 480px;
    /* padding: 0; */
}

.col {
    padding-right: 0px;
    padding-left: 0px;
}

/* navbar */
.navbar-logo {
    font-family: 'Quicksand', sans-serif;
    font-size: 2.5em;
    font-weight: 700;
    color: #f2b705;
}


.navbar-title {
    font-family: 'Quicksand', sans-serif;
    font-size: 1.5em;
    font-weight: 700;
    color: #f2b705;
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    color: #fff;
    background-color: #e67e22;
}

.nav-pills .nav-link {
    border-radius: 0rem;
}

/* icon */
.icon-text {
    vertical-align: middle;
}

.header-icon {
    color: #f2b705;
    width: 36px;
    height: 36px;
    stroke-width: 1;
}

.header-icon:hover {
    color: #f2b705;
    width: 36px;
    height: 36px;
    stroke-width: 2;
}

.card-icon {
    width: 32px;
    height: 32px;
    stroke-width: 2;
}

.footer-icon {
    color: #fff;
    width: 36px;
    height: 36px;
    stroke-width: 1;
}

.footer-icon:hover {
    color: #fff;
    width: 36px;
    height: 36px;
    stroke-width: 2;
}

.footer-icon-active {
    color: #fff;
    width: 36px;
    height: 36px;
    stroke-width: 2;
}

/* button */
.btn-outline-custom {
    color: #f2b705;
    background-color: transparent;
    background-image: none;
    border-color: #f2b705;
}

/* card */
.card {
    color: #555;
    border-top: none;
    border-left: none;
    border-bottom: 1px solid #dee2e6 !important;
    border-right: none;
    margin: 10px 0;
}

.card-header {
    background-color: transparent;
}

.card-body {
    padding: 10px;
}

/* modal */
.modal-content {
    border: none;
}

.modal-header {
    background-color: #f2b705;
    color: #fff;
}

.bg-custom {
    background-color: #f2b705;
}

.line-bottom {
    border-bottom: 1px solid #dee2e6 !important;
}

.text-description {
    font-family: 'Roboto', sans-serif;
}

div.scrollmenu {
    overflow: auto;
    white-space: nowrap;
}

.thumbnail {
    width: 100%;
    height: 150px;
}


@media (max-width: 576px) {
    .thumbnail {
        width: 100%;
        height: 120px;
    }
}