﻿body {
    padding-top: 50px;
    padding-bottom: 20px;
    font-family: sans-serif !important;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-top: 0px;
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column */

.navbar-inverse {
    background-color: #007788;
    font-size: 12pt;
}

.navbar-inverse .navbar-nav > li > a {
    color: #cccccc;
}

.navbar-inverse .navbar-nav > li > a:focus, .navbar-inverse .navbar-nav > li > a:hover {
    color: white;
}

.navbar-brand {
    color: #cccccc;
    font-size: 14pt;
    font-weight: bold;
}

.navbar-brand:hover,
.navbar-brand:focus {
    color: #cccccc;
    background-color: transparent;
}

.navbar-brand {
    color: #cccccc;
}

.navbar-brand:visited {
    color: #cccccc;
}

.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 300px;
}

/* Set custom styles */

.site-nav {
}

.site-burger-menu, .site-burger-menu:link, .site-burger-menu:visited, .site-burger-menu:active, .site-burger-menu:hover {
    font-family: Arial, Helvetica;
    font-size: 16pt;
    font-weight: bold;
}

.site-dropdown, .site-dropdown:link, .site-dropdown:visited, .site-dropdown:active, .site-dropdown:hover {
    color: white;
    background: #007788;
    font-family: Arial, Helvetica;
    font-size: 14pt;
    font-weight: bold;
    line-height: 150%;
}

.site-contributor {
    line-height: 1.8;
    text-decoration: none;
    font-weight: bold;
    font-size: 12px;
}

    .site-contributor:hover,
    .site-contributor:focus {
        line-height: 1.8;
        text-decoration: none;
        font-weight: bold;
        font-size: 12px;
    }

    .site-contributor:visited {
        line-height: 1.8;
        text-decoration: none;
        font-weight: bold;
        font-size: 12px;
    }

/* header bar styles */

.headerBar {
    COLOR: white;
    background: #007788;
    FONT-FAMILY: Arial, Helvetica;
    FONT-SIZE: 14pt;
    FONT-WEIGHT: bold;
}

.header:link, .header:visited, .header:active, .header:hover {
    COLOR: white;
    background: #007788;
    FONT-FAMILY: Arial, Helvetica;
    FONT-SIZE: 12pt;
    FONT-WEIGHT: bold;
    text-decoration: none;
}

/* select and links */

.selectNameLinks, .selectNameLinks:link, .selectNameLinks:visited, .selectNameLinks:active {
    COLOR: black;
    background-color: white;
    FONT-FAMILY: Arial, Helvetica;
    FONT-SIZE: 14pt;
    FONT-WEIGHT: normal;
    text-decoration: none;
    BORDER: 0;
}

.selectNameLinks:hover {
    COLOR: black;
    background-color: white;
    FONT-FAMILY: Arial, Helvetica;
    FONT-SIZE: 14pt;
    FONT-WEIGHT: bold;
    text-decoration: none;
    BORDER: 0;
}

.selectImageLinks, .selectImageLinks:link, .selectImageLinks:visited, .selectImageLinks:active, .selectImageLinks:hover {
    background-color: white;
    height: 120px;
    text-decoration: none;
    BORDER: 0;
}

.selectImage {
    background-color: white;
    height: 120px;
    text-decoration: none;
    BORDER: 0;
}

.selectInformationLinks, .selectInformationLinks:link, .selectInformationLinks:visited, .selectInformationLinks:active .selectInformationLinks:hover {
    COLOR: #808080;
    background-color: white;
    FONT-FAMILY: Arial, Helvetica;
    FONT-SIZE: 10pt;
    FONT-WEIGHT: normal;
    text-decoration: none;
    BORDER: 0;
}

.selectIngredientsLinks, .selectIngredientsLinks:link, .selectIngredientsLinks:visited, .selectIngredientsLinks:active .selectIngredientsLinks:hover {
    COLOR: black;
    background-color: white;
    FONT-FAMILY: Arial, Helvetica;
    FONT-SIZE: 12pt;
    FONT-WEIGHT: normal;
    text-decoration: none;
    border: 0;
}

.selectSplashLinks, .selectSplashLinks:link, .selectSplashLinks:visited, .selectSplashLinks:active {
    background-color: white;
    text-decoration: none;
    border-color: white;
    border: 0;
}

.selectSplashLinks:hover {
    background-color: white;
    text-decoration: none;
    border-color: white;
    border: 0;
}

/* recipe viewing classes -- these classes are clones of those in Drinqz Plugin */

.viewRecipeIngredient {
    COLOR: black;
    background-color: white;
    FONT-FAMILY: Arial, Helvetica;
    FONT-SIZE: 12pt;
    FONT-WEIGHT: normal;
    text-decoration: none;
    BORDER: 0;
}

.viewRecipeIngredientInstructions {
    COLOR: #c0c0c0;
    background-color: white;
    FONT-FAMILY: Arial, Helvetica;
    FONT-SIZE: 10pt;
    FONT-WEIGHT: normal;
    text-align: left;
    text-decoration: none;
    BORDER: 0;
}

.viewRecipeInstruction {
    COLOR: black;
    background-color: white;
    FONT-FAMILY: Arial, Helvetica;
    FONT-SIZE: 12pt;
    FONT-WEIGHT: normal;
    text-decoration: none;
    BORDER: 0;
}

/* styles for search box */

#newSearch {
    float: right;
    padding: 0px;
    margin: 0;
}

.searchText {
    margin: 0;
    padding: 5px 15px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    border: 1px solid #ffffff;
    border-right: 0px;
    border-top-left-radius: 5px 5px;
    border-bottom-left-radius: 5px 5px;
}

.searchButton {
    margin: 0;
    padding: 5px 15px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #007788;
    outline: none;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    border: solid 1px #007788;
    background-image: url('/Images/Buttons/Search16.png');
    background-repeat: no-repeat;
    background-size: 16px 16px;
    background-position: 5px center;
    background-color: white;
}

.searchButton:hover {
    margin: 0;
    text-decoration: none;
    image-orientation: 
}

.searchButton::-moz-focus-inner
/* Fixes submit button height problem in Firefox */ {
    margin: 0;
    border: 0;
}

.searchClear {
    margin: 0;
    padding: 5px 15px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #007788;
    outline: none;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    border: solid 1px #007788;
    background-image: url('/Images/Buttons/Clear16.png');
    background-repeat: no-repeat;
    background-size: 16px 16px;
    background-position: 5px center;
    background-color: white;
    border-top-right-radius: 5px 5px;
    border-bottom-right-radius: 5px 5px;
}

.searchClear:hover {
    margin: 0;
    text-decoration: none;
}

.searchClear::-moz-focus-inner
/* Fixes submit button height problem in Firefox */ {
    margin: 0;
    border: 0;
}

.searchIngredient {
    margin: 0;
    padding: 5px 15px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #007788;
    outline: none;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    border: solid 1px #007788;
    background-image: url('/Images/Buttons/Search16.png');
    background-repeat: no-repeat;
    background-size: 16px 16px;
    background-position: 5px center;
    background-color: white;
    border-radius: 5px 5px;
}

.searchIngredient:hover {
    margin: 0;
    text-decoration: none;
    image-orientation:
}

.searchIngredient::-moz-focus-inner
/* Fixes submit button height problem in Firefox */ {
    margin: 0;
    border: 0;
}

/* styles for ingredient search box */

.ingredientBar {
    COLOR: #007788;
    background: white;
    FONT-FAMILY: Arial, Helvetica;
    FONT-SIZE: 14pt;
    FONT-WEIGHT: bold;
    border: 3px solid #007788;
    border-radius: 5px 5px;
}

.searchIngredientText {
    margin: 0;
    padding: 5px 15px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    border: 1px solid #007788;
    border-radius: 5px 5px;
}

/* placeholder styles */

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #c0c0c0;
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #c0c0c0;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: #c0c0c0;
}

/* styles for youtube */

.youtubeContainer {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
}

.youtubeVideo {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
 