* {
    text-align: center;
    /* color: #fff; */
}


body, html {
    background-color: #DCDCDC;
    margin-bottom: 0;
}

.main {
    background-color: #fff;
    opacity: 0.9;
    /* height: 100%; */
    border-radius: 10px;
    margin: auto;
    /* margin: min(50px); */
    width: auto;
    max-width: 750px;
    padding: 20 20px;
}

.introContainer {
    background-color: #DCDCDC;
}

.content {
    padding: 25px;
}

.post {
    height: auto;
    width: 100%;
    margin: 0;
    padding: 10px 60px 10px 60px;
}

.content .post h1 {
    font-size: 32px;
    font-weight: bold;
}

.intro {
    width: 100%;
    height: 272px;
    background-size: 272px;
}

.navbar.navbar-right li {
    margin-left: 1.4em;
}

.navbar.navbar-right li a {
    color: #EF3A3A;
}

.introImages {
    padding: 0;
    margin: 0;
    height: 272px;
    width: 100%;
    position: absolute;
    overflow: hidden;
}

.content .post .gif {
    display: block;
    width: 400px;
    height: 400px;
    margin: 25px auto 0px auto;
}

.introImages {
    background-color: #DCDCDC;
}

.introImages img {
    height: 272px;
    margin: 0;
    padding: 0;
    border: none;
    position: absolute;
}

p, h1, h2, h3, h4 {
    opacity: 87%;
}

h2 {
    margin-top: 25px;
}

.content .post h1:before {
    content: url(../../content/Assets/separator.png);
    display: block;
    margin: auto;
    padding-bottom: 25px;
}

.contentList, ul, li, a {
    list-style: none;
}

ul li{
    text-align: center;
}

.contentList > li {
    /* float: left; */
    /* width: 51%; */
    padding-left: 33%;
    text-align: left;
}

.contentList li a {
    color: #EF3A3A;
}

.contentList {
    margin: 25px;
    font-size: 20px;
}

.contentTitle {
    margin: 25px;
}

/* .main-nav{
    background-color: #121212;
} */

.campic {
    height: 250px;
    width: auto;
}

h2+img, hr+h2 {
    margin-top: 25px;
}

iframe {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    background: transparent;
    vertical-align: middle;
    /* display: block; */
    margin: auto;
}

p a {
    font-size: inherit;
}

pre {
    margin: 0;
    padding: 0px;
}

pre code {
    text-align: left;
    background-color: #eee;
    border: 1px solid #999;
    display: block;
    padding: 20px;
    margin: 25px;
    line-height: 1.4em;
    overflow:auto;
}

.sketchlink {
    display: block;
    margin: auto;
    margin-top: 25px;
}

.sketchcode>summary {
    list-style: none;
    padding: 5px;
    width: 100px;
    margin: auto;
    margin-top: 25px;
    background-color: #eee;
    border: 1px solid #999;
    border-radius: 5px;
}

.sketchcode>summary::-webkit-details-marker {
    display: none;
}

.description {
    width: 100%;
    display: block;
    margin: 10px auto 25px auto;
}