body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Set widths on the form inputs since otherwise they're 100% wide */
input,
select,
textarea {
    max-width: 280px;
}

/* Carousel */
.carousel-caption {
    z-index: 10 !important;
}

    .carousel-caption p {
        font-size: 20px;
        line-height: 1.4;
    }

@media (min-width: 768px) {
    .carousel-caption {
        z-index: 10 !important;
    }
}

/* My Stuff */

/* @font-face {
    font-family: TitilliumWeb-Regular;
    src: url('~/static/fonts/TitilliumWeb/TitilliumWeb-Regular.ttf') format('truetype');
} */

.my-body {
    background-color: #1e1e1e;
}

.my-navbar {
    font-family: 'Montserrat', 'Titillium Web', Verdana, sans-serif;
}

.my-logo {
    font-family: 'Montserrat';
}

div.my-panel {
    margin: 2%;
    background-color: transparent;
    /*box-shadow: 1px 1px 4px rgba(155, 155, 155, 1.0);*/
    border: 4px;
    border-radius: 4px 4px;
    height: 300px;
    overflow: hidden;
    position: relative
}

div.my-panel:after {
    /*background-color: #FFFFFF;*/
    /*max-height: 350px;*/
    color: transparent;
    /*content: "_";*/
    pointer-events: none;
    position: absolute;
    bottom: 0;
    height: 300px;
    width: 100%;
    
    /* For Safari 5.1 to 6.0 */
    background: -webkit-linear-gradient(transparent, transparent, #1e1e1e);

    /* For Opera 11.1 to 12.0 */
    background: -o-linear-gradient(transparent, transparent, #1e1e1e);

    /* For Firefox 3.6 to 15 */
    background: -moz-linear-gradient(transparent, transparent, #1e1e1e);

    /* Standard syntax */
    background: linear-gradient(transparent, transparent, #1e1e1e);
}

.my-page-header {
    font-family: 'Montserrat', 'Titillium Web', Verdana, sans-serif;
    background-color: #333333;
    margin-top: -20px;
}

    .my-page-header > h3 {
        margin-left: 1%;
        color: #a6e22c;
    }

    .my-page-header > h4 {
        margin-left: 2%;
        color: #66d9ef;
    }

.my-page-content {
    color: #999999;
    font-family: 'Montserrat', 'Titillium Web', Verdana, sans-serif;
    font-weight: lighter;
}

    .my-page-content p {
        line-height: 150%;
        font-size: 135%;
    }

    .my-page-content .my-description {
        line-height: 150%;
        font-size: 135%;
        margin-left: 2%;
    }

.my-content-item > h2 {
    color: #fd9720;
    margin-left: 1%;
}

    .my-content-item > h2 > a {
        color: #fd9720;
    }

.my-content-item > h4 {
    margin-left: 1%;
}

.my-blog-body {
    margin-left: 3%;
    font-size: 115%;
}

.my-content-tags {
    margin-left: 3%;
}

    .my-content-tags a {
        margin: 1%;
    }

.my-content-links {
    margin-left: 3%;
}

.my-content-links a {
    margin: 1%;
    color: #f92672;
}

hr.hr-style-one {
    border: 0;
    height: 1px;
    background: #333;
    background-image: linear-gradient(to right, #ccc, #333, #ccc);
}

hr.hr-style-two {
    border: 0;
    height: 1px;
    color:#FF0000;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), #999, rgba(0, 0, 0, 0));
}

img.my-img-rounded {
    border-radius: 4px 4px;
    border: 4px;
}