html, body{
    margin: 0;
    padding: 0;
}

@font-face {
    font-family: amatic;
    src: url('../font/AmaticSC-Regular.ttf');
}

p{
    font-family: Century Gothic, 'Arimo', sans-serif;
}

.handwritten-text{
    font-family: amatic;
}

/* Start flow headers */

.flow-element-header{
    display: block;
    text-align: center;
    margin: 0;
    width: 100%;
}

.flow-element-content-wrapper{
    padding: 3em 0 4.5em 0;
    z-index: 1;
}

.flow-element{
    display: block;
    text-align: center;
    padding: 3em 0 4.5em;
    margin: 0;
    width: 100%;
    background-color: #121314;
}


/* End flow headers */

/* Start social menu */

#social{
    position: fixed;
    right: 0;
    top: 50px;
    margin-right: 5px;
    z-index: 9999;
}
.social-charm{

}
.social-charm-link{
    text-decoration: none;
}
.social-charm-image{
    width: 50px;
    height: 50px;
    border-radius: 50%;
    cursor: pointer;
}

/* End social menu */

/* Start mobile social menu */

#social-mobile{
    position: fixed;
    display: none;
    width: 100%;
    z-index: 9999;
}
.social-collapsed{
    transition: all 0.6s linear;
    top: -80px
}

.social-mobile-list{
    list-style: none;
    width: 100%;
    height: 80px;
    margin: 0;
    padding: 0;
}
.social-mobile-list-item{
    text-align: center;
    height: 80px;
    width: 25%;
    float: left;
    display: inline-block;
    border-bottom-width: 15px;
    border-bottom-style: solid;
}
.social-mobile-link{
    text-decoration: none;
    display: block;
    height: 80px;
}
.social-mobile-img{
    max-height: 80px;
}

#fb-social{
    background-color: #3B579D;
    border-bottom-color: #3B579D;
}
#fl-social{
    background-color: #F8C268;
    border-bottom-color: #F8C268;
}
#gplus-social{
    background-color: #00A84E;
    border-bottom-color: #00A84E;
}
#location-social{
    background-color: #999999;
    border-bottom-color: #999999;
}
#mail-social{
    background-color: #C4C4C4;
    border-bottom-color: #C4C4C4;
}

.social-visible{
    transition: all 0.6s linear;
    top:0;
}

/* End mobile social menu */

/* Start flow element */

.flow-element-section-header{
    text-align: center;
    margin-bottom: 3em;
}
.flow-element-title{
    font-size: 45px;
    font-family: amatic;
    color: white;
}

/* End flow element */


/* Start footer */

#footer{
    background-color: #1D1D1D;
    color: lightgray;
    padding-bottom: 1em;
    background-image: none;
}

.footer-article{
    margin-left: 25px;
    margin-right: 25px;
    font-family: Century Gothic, 'Arimo', sans-serif;
}

#suited-coders-link:link{
    text-decoration: none;
    color: lightgray;
}
#suited-coders-link:active{
    text-decoration: none;
    color: lightgray;
}
#suited-coders-link:visited{
    text-decoration: none;
    color: lightgray;
}
#suited-coders-link:hover{
    text-decoration: none;
    color: grey;
}

/* End footer */

/* Start contact form */

#contact{

}
#contact-top{
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}
#content-column-1{
    width: 33%;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: white;
}
#content-column-2{
    width: 33%;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
}
#content-column-3{
    width: 33%;
    overflow: hidden;
    display: inline-block;
    vertical-align: top;
    color: white;
}

.contact-link{
    text-decoration: none;
    color: #FFFFFF;
}
.contact-link:active{
    text-decoration: none;
    color: #FFFFFF;
}
.contact-link:visited{
    text-decoration: none;
    color: #FFFFFF;
}
.contact-link:hover{
    text-decoration: none;
    color: #AAAAAA;
}

.contact-info-text{
    font-family: Century Gothic, 'Arimo', sans-serif;
}
.contact-form-logo{
    width: 33%;
    margin-top: 50px;
}
.contact-form-subtitle{
    font-family: Century Gothic, 'Arimo', sans-serif;
    font-weight: normal;
}

#contact-form-center{
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
    color: white;
    margin-top: 80px;
}
#form-table{
    width: 100%;
    padding-right: 1em;
    font-family: Century Gothic, 'Arimo', sans-serif;
}
.form-inputfields{
    width: 100%;
    border-style: solid;
    background-color: #ECECEC;
    border-width: 0 0 1px 0;
    border-color: gray;
}
.form-inputfields-textarea{
    width: 100%;
    border-style: none;
    background-color: #BEBEBE;
    padding-left: 0;
    padding-right: 0;
}
#contact-form-submit{
    border-style: none;
    background-color: #FFFFFF;
    height: 1.8em;
    padding-left: 4em;
    padding-right: 4em;
    font-family: Century Gothic, 'Arimo', sans-serif;
    text-transform: uppercase;
    color: #000000;
    cursor: pointer;
    border-radius: 0;
}

.tbl-column-1{
    width: 50px;
}
.tbl-column-2{

}
.tbl-column-3{
    width: 50px;
}
#tbl-column-submit{
    text-align: left;
}
#contact-form-error{
    color: red;
}
.contact-form-hidden{
    display: none;
}
.contact-in-progress{
    display: none;
}
.contact-in-progress-visible{
    display: block;
}
.contact-thanks{
    display: none;
}
.contact-thanks-visible{
    display: block;
}

/* End contact form */

/* Start footer */

.footer-credits{
    max-width: 1280px;
    margin: 45px auto 0 auto;
    color: #6D6E70;
    text-align: left;
}
.owner-credit{
    display: inline-block;
    vertical-align: top;
    color: #6D6E70;
    font-size: 0.8em;
}
.website-credit{
    width: 200px;
    display: inline-block;
    vertical-align: top;
    float: right;
    color: #6D6E70;
    font-size: 0.8em;
    clear: both;
}
.footer-credit-link{
    color: #6D6E70;
    transition: all 0.25s ease-in;
}
.footer-credit-link:active{
    color: #6D6E70;
}
.footer-credit-link:visited{
    color: #6D6E70;
}
.footer-credit-link:hover{
    color: #C84D24;
    transition: all 0.25s ease-out;
}

/* End footer */