@font-face {
    font-family: 'cabinsemibold';
    src: url('fonts/cabin-semibold-webfont.woff2') format('woff2'),
         url('fonts/cabin-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'alfa_slab_oneregular';
    src: url('fonts/alfaslabone-regular-webfont.woff2') format('woff2'),
         url('fonts/alfaslabone-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'cabinregular';
    src: url('fonts/cabin-regular-webfont.woff2') format('woff2'),
         url('fonts/cabin-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

.clear{
    clear: both;
}

body{
    
}

.bg {
    background-image: url(../images/bg1.jpg);
    background-size: contain;
    background-attachment: fixed;
}

.img {
    width: 80%;
}

.bgRed {
    background-color: rgba(107, 21, 50, .95);
    padding: 25px 0;
    position: relative;
}

.bgPink {
    background-color: rgba(178, 32, 78, .95);
    padding: 25px 0;
    position: relative;
}

h1{
    margin: 10px auto;
    font-family: 'alfa_slab_oneregular';
    font-size: 2em;
    letter-spacing: 2px;
    text-align: center;
    color: #ffc000;
    text-shadow: 2px 2px 5px #000;
    margin-bottom: 25px;
}

h2 {
    margin: 0 10% 0 10%;
    text-align: center;
    font-family: 'alfa_slab_oneregular';
    letter-spacing: 2px;
    font-size: 2em;
    color: #ffc000;
    text-shadow: 2px 2px 5px #000;
    padding: 25px 0;
}

p{
    width: 90%;
    margin: 0 auto 25px auto;
    color: white;
    font-family: 'cabinregular';
    font-size: .9em;
    letter-spacing: 1px;
    line-height: 1.2em; 
    text-align: center;
}

.pCenter{
    text-align: center;
    width: 80%;
    margin: auto;
}

.right{
    text-align: right;
    width: 100%;
    float: right;
    margin-right: 10%;
}

.pRight{
    text-align: center;
    right: 10%;
    bottom: 30px;   
}

.img1{
    width: 100%;
    margin-bottom: 25px;
}

.feet {
    width: 80%;
    margin-left: 20%;
}

.gun {
    width: 80%;
}

.tooth {
    width: 80%;
    margin: 0 10%;
}

@media (min-width:600px){
    .bgRed{
        padding-bottom: 0;
        height: 300px;
    }
    
    .bgPink {
        position: relative;
        height: 300px;
    }
    
    .img1{
        width: 50%;
        max-width: 375px;
        margin-bottom: 0;
        float: left;
    }
    
    h1 {
        width: 40%;
        font-size: 3em;
        float: left;
    }
    
    h2{
        display: block;
        width: 90%;
        margin: 0 5%;
        text-align: left;
        float: left;
    }
    
    .pLeft{
        text-align: left;
        width: 50%;
        margin: 0 0% 25px 10%;        
    }
    
    .right{
        position: absolute;
        bottom: 175px;
        right: 0;
    }
    
    .pRight{
        width: 60%;
        text-align: right;
        margin: 0 10% 25px 0;
        position: absolute;
        bottom: 50px;
        right: 0;
    }
    
    .feet {
        width: 40%;
        max-width: 350px;
        margin: 0;
        float: right;
        position: absolute;
        top: 0px;
        right: 0;
        z-index: +1;
    }
    
    .gun{
        width: 40%;
        float: left;
    }
    
    .tooth{
        width: 30%;
        max-width: 250px;
        position: absolute;
        bottom: 0;
        right: 0;
    }
}

@media (min-width:850px){
    h1{
        width: 55%;
        text-align: left;
        font-size: 5vw;
    }
    
    .pCenter{
        font-size: 1.5vw;
        text-align: left;
    }
    
    h2{
        font-size: 4vw;
    }
    
    .pLeft{
        font-size: 1.5vw;
    }
    
    .pRight{
        font-size: 1.5vw;
    }
    
    .gun{
        max-width: 450px;
    }
}

@media (min-width: 1300px) {
    #container{
        width: 1300px;
        margin: auto;
        box-shadow:0px 0px 1000px 1000px rgba(60, 6, 24, .95);
    }
    
    h1 {
        width: 65%;
        font-size: 4em;
    }
    
    .pCenter{
        font-size: 1.5em;
    }
    
    .pLeft{
        font-size: 1.25em;
    }
    
    .pRight {
        font-size: 1.25em;
    }
    
    h2{
        font-size: 3em;
    }  
    
    .bg {
        
    }
}