﻿body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    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 
*/
.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: 280px;
}

a.anchor {
    display: block;
    position: relative;
    top: -95px;
    visibility: hidden;
}


.keystone-logo img {
    max-width: 250px;
    margin: auto;
    display:block;
    margin-top:10px;
}

/* CSS used here will be applied after bootstrap.css */
html, body {
    height: 100%;
    padding-top: 50px;
}

.navbar {
    -webkit-transition: padding 0.2s ease;
    -moz-transition: padding 0.2s ease;
    -o-transition: padding 0.2s ease;
    transition: padding 0.2s ease;
  font-family: 'Buenard', serif;
    /*font-family: 'Copperplate', sans-serif;*/
    font-size: 15px;
    font-weight:bold;
    letter-spacing: 1px;
    background-color:#fff;
}

.affix {
    padding-top: 0.2em !important;
    padding-bottom: 0.2em !important;
    -webkit-transition: padding 0.2s linear;
    -moz-transition: padding 0.2s linear;
    -o-transition: padding 0.2s linear;
    transition: padding 0.2s linear;
}

.icon-social-facebook  {font-size:20px;}section {
    min-height: calc(100% - 70px);
}

body {
    font-family: 'Verdana', sans-serif;
    margin: 0;
    padding: 0;
}
.navbar-brand {
    padding: 10px;
} .white-text {
    color: #fff;
}
.swiper-container-banner {
    width: 100%;
    height: 300px;
    margin-top: 62px;
}

    .swiper-container-banner .swiper-slide {
        text-align: center;
        font-size: 18px;
        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }

.swiper-container-recipes {
    width: 100%;
    height: auto;
}

    .swiper-container-recipes .swiper-slide {
        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }
.white-opacity {
    box-shadow: inset 0 0 0 1000px rgba(255,255,255,.2);
}

.list-style {
  font-family: 'Buenard', serif;
    font-size: 20px;
    color: #f48c20;
}.banner1 {
    background-image: url('../Images/Banner/jan.jpg');
    background-size: cover;
    background-position: 10% 53%;
    background-repeat: no-repeat;
    box-shadow: inset 0 0 0 1000px rgba(0,0,0,.2);
}


    .banner1 p {
        color: #fff;
        font-size: 30px;
      font-family: 'Buenard', serif;
    }.banner2 {
        background-image: url('../Images/Banner/pot.jpg');
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        box-shadow: inset 0 0 0 1000px rgba(0,0,0,.2);
    }
.banner3 {
    background-image: url('../Images/Banner/spices.jpeg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    box-shadow: inset 0 0 0 1000px rgba(0,0,0,.2);
}

.jan-logo img {position:absolute; bottom:10px;right:10px; max-width:100px;}

.content-padding {padding: 50px 50px; }

.janpap-package {max-width:200px;margin:auto;display:block;}
.janpap-banner-logo  {max-width:220px;}

.janpap-color-red-dark {
    background: -webkit-linear-gradient(top, #600e0e, #600e0e 50%, #722c22 50%, #722c22);
    background: linear-gradient(to left, #600e0e, #600e0e 50%, #722c22 50%, #722c22);
    background-size: 20px 100%;
    padding: 10px 15px 15px 15px;
    color: #fff;
}
.janpap-color-red-light {
    background-color: #722c22;
}
.janpap-color-yellow-dark {
    background-color: #ffec95;
}
.janpap-color-yellow-light {
    background-color: #fff2b5;
}
.janpap-color-orange-dark {
    background-color: #f48c20;
}

.janpap-color-orange-light {
    background-color: #f9a23e;
}
.dark-grey {
    background-color: #0a0a0a;
    color: #fff;
}

    .dark-grey h1 {
        color: #fff2b5;
    }
.light-grey {
    background-color: #e9e9e9;
}
.white-background {background-color:#fff; padding: 10px 0px;}

    /*recipes*/
.recipe-item {
    padding: 10px;
    width: 100%;
    border-right: 4px solid #FFF;
}
    .recipe-item h2 {
      font-family: 'Buenard', serif;
        /*font-family: 'Copperplate', sans-serif;*/ text-align: center;
    }
    .recipe-item h3 {
      font-family: 'Buenard', serif;
        /*font-family: 'Copperplate', sans-serif;*/
        text-align: center;
    }

.recipe-image1 {
    background-image: url(../Images/Recipes/1675.jpg);
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    width: 100px;
    height: 100px;
    border: 4px solid #f48c20;
    margin: auto;
    margin-top: 10px;
}
.recipe-image2 {
    background-image: url('../Images/Recipes/Janpap_micr_putu.jpg');
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    width: 100px;
    height: 100px;
    border: 4px solid #f48c20;
    margin: auto;
    margin-top: 10px;
}
.recipe-image3 {
    background-image: url('../Images/Recipes/Janpap_Regte_Putu_Rec.jpg');
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    width: 100px;
    height: 100px;
    border: 4px solid #f48c20;
    margin: auto;
    margin-top: 10px;
}
.recipe-image4 {
    background-image: url('../Images/Recipes/Janpap_roast_veg_putu_Salas.jpg');
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    width: 100px;
    height: 100px;
    border: 4px solid #f48c20;
    margin: auto;
    margin-top: 10px;
}
.recipe-image5 {
    background-image: url('../Images/Recipes/Janpap_Sarel_Microgolf_Rec.jpg');
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    width: 100px;
    height: 100px;
    border: 4px solid #f48c20;
    margin: auto;
    margin-top: 10px;
}
.recipe-image6 {
    background-image: url('../Images/Recipes/Janpap_Sudried_tomatoes_salad.jpg');
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    width: 100px;
    height: 100px;
    border: 4px solid #f48c20;
    margin: auto;
    margin-top: 10px;
}
.recipe-image7 {
    background-image: url('../Images/Recipes/Recepies_Risotto.jpg');
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    width: 100px;
    height: 100px;
    border: 4px solid #f48c20;
    margin: auto;
    margin-top: 10px;
}
.recipe-image8 {
    background-image: url('../Images/Recipes/Recipe_stywe_Janpap_en_sous100_0155.jpg');
    background-size: cover;
    background-position: center;
    border-radius: 50%;
    width: 100px;
    height: 100px;
    border: 4px solid #f48c20;
    margin: auto;
    margin-top: 10px;
}

.spices {
    background-image: url('../Images/spices.jpg');
    background-position:right center;
    background-size:contain;
    background-repeat:no-repeat;
}
thead tr th {
  font-family: 'Buenard', serif;
    font-size:18px;
    font-weight:100!important;
}
.contact-bg {
    background-image: url('../Images/contact-bg-01.png');
    background-size:contain;
}


.footer-top a {
    color: #f48c20;
}

.footer-top h3 {
    font-size: 19px;
}
footer {
    background: -webkit-linear-gradient(top, #600e0e, #600e0e 50%, #722c22 50%, #722c22);
    background: linear-gradient(to left, #600e0e, #600e0e 50%, #722c22 50%, #722c22);
    background-size: 20px 100%;
    padding: 10px 15px 15px 15px;
    color: #fff;
    font-family: 'Buenard', serif;
    text-align: center;
    font-size:15px;
    letter-spacing:1px;
}
footer p {margin-bottom:0;}
    footer a, footer a:hover, footer a:active, footer a:focus {
        color: #fff;
    }