/* Box size everything */

*{
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

/* Fonts */

@font-face {
    font-family: 'Bebas Neue';
    src: url('/fonts/bebas-neue.woff2') format('woff2'),
    url('/fonts/bebas-neue.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* General */

html,
body {
    height: 100%;
    -webkit-font-smoothing: antialiased;
}

html {
    background: #000000;
    transition: all 0.3s ease-in-out;
}

body {
    height: 100%;
    color: #fff;
    font-family: 'Bebas Neue', sans-serif;
    line-height: 1.6;
    font-size: 14px;
}

a {
    color: #fff;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

ol,
ul {
    margin-left: 30px;
}

hr {
    border-bottom: 1px solid #fff;
}

h1 {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 40px;
    color: #fff;
    margin-bottom: 10px;
}

h2 {
    font-family:  'Bebas Neue', sans-serif;
    font-size: 18px;
    color: #fff;
    font-weight: normal;
    margin-bottom: 10px;
}

h3 {
    font-family:  'Bebas Neue', sans-serif;
    font-size: 16px;
    color: #fff;
    font-weight: normal;
    margin-bottom: 10px;
}

table.withForm tr td{
    padding-bottom: 5px;
    vertical-align: top;
}

table.withForm tr td.withLabel{
    padding-top: 6px;
    padding-right: 10px;
}

select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
input[type="button"]{
    padding: 5px 10px;
    border: 1px solid #CCC;
    border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
}

select{
    padding: 2px 4px;
}

select.error,
textarea.error,
input[type="text"].error,
input[type="password"].error,
input[type="datetime"].error,
input[type="datetime-local"].error,
input[type="date"].error,
input[type="month"].error,
input[type="time"].error,
input[type="week"].error,
input[type="number"].error,
input[type="email"].error,
input[type="url"].error,
input[type="search"].error,
input[type="tel"].error,
input[type="color"].error{
    background-color: #e8e8e8;
}

/* Container width required for responsive layout */

.container {
    position: relative;
    max-width: 1050px;
    width: 97%;
    margin: 0 auto;
}

/* Required L hide/show classes */

.l-hide {
    display: none;
    visibility: hidden;
}

/* General template positioning container */

#template-container {
    min-height: 100%;
    margin: 0 auto;
    position: relative;
}

/* Row, required for the grid */

.row{
    width: 102.4%;
    margin-left: -1.2%;
    margin-right: -1.2%;
    margin-top: 0;
    margin-bottom: 0
}

.row-full{
    width: 100%;
    margin-left: 0px;
    margin-right: 0px
}

/* Cols, required for the grid*/

[class*='col-']{
    float: left;
    width: 100%
}

.col-10{
    width: 7.6%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-10-full{
    width: 10%;
    margin: 0 0 2.4% 0;
}

.col-15{
    width: 12.6%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-15-full{
    width: 15%;
    margin: 0 0 2.4% 0;;
}

.col-20{
    width: 17.6%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-20-full{
    width: 20%;
    margin: 0 0 2.4% 0;
}

.col-25{
    width: 22.6%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-25-full{
    width: 25%;
    margin: 0 0 2.4% 0;
}

.col-30{
    width: 27.6%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-30-full{
    width: 30%;
    margin: 0 0 2.4% 0;
}

.col-33{
    width: 30.93333%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-33-full{
    width: 33.33333%;
    margin: 0 0 2.4% 0;
}

.col-40{
    width: 37.6%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-40-full{
    width: 40%;
    margin: 0 0 2.4% 0;
}

.col-50{
    width: 47.6%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-50-full{
    width: 50%;
    margin: 0 0 2.4% 0;
}
.col-60{
    width: 57.6%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-60-full{
    width: 60%;
    margin: 0 0 2.4% 0;
}

.col-65{
    width: 62.6%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-65-full{
    width: 65%;
    margin: 0 0 2.4% 0;
}

.col-66{
    width: 64.26667%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-66-full{
    width: 66.66667%;
    margin: 0 0 2.4% 0;
}

.col-70{
    width: 67.6%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-70-full{
    width: 70%;
    margin: 0 0 2.4% 0;
}

.col-75{
    width: 72.6%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-75-full{
    width: 75%;
    margin: 0 0 2.4% 0;
}

.col-80{
    width: 77.6%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-80-full{
    width: 80%;
    margin: 0 0 2.4% 0;
}

.col-90{
    width: 87.6%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-90-full{
    width: 90%;
    margin: 0 0 2.4% 0;
}

.col-100{
    width: 97.6%;
    margin: 0 1.2% 2.4% 1.2%;
}

.col-100-full{
    width: 100%;
    margin: 0 0 2.4% 0;
}


/* Useful classes */

.float-left{
    float: left;
}

.float-right{
    float: right;
}

.margin-top-10px{
    margin-top: 10px;
}

.margin-bottom-10px{
    margin-bottom: 10px;
}

.margin-top-20px{
    margin-top: 20px;
}

.margin-bottom-20px{
    margin-bottom: 20px;
}

.no-margin-bottom{
    margin-bottom: 0px!important;
}

.unselectable {
    -moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
}

.text-align-center{
    text-align: center;
}

.text-align-left{
    text-align: left;
}

.text-align-right{
    text-align: right;
}

.full{
    width: 100%;
}

.full-width{
    width: 100%;
}

.margin-auto{
    margin: 0 auto;
    float: none!important;
}

.color-red{
    color: #e64c3c;
}

/* Project styles */

.header-logo-container{
    margin: 100px 0px 50px 0px;
    width: 100%;
    opacity: 0;
    text-align: center;
}

.social-links-container{
    margin-bottom: 25px;
}

.social-link{
    display: inline-block;
    background: #fff;
    padding: 5px 10px;
    color: #000;
    line-height: 30px;
    font-size: 30px;
    transition: all 0.3s ease-in-out;
    border-radius: 5px;
}

.social-link i{
    margin-right: 5px;
}

.feed-container{
    margin-bottom: 50px;
}

/* IE 8 fixes */

.ie8 img{
    width: 100%;
    height: auto;
}


/* Fade effect default styles (no touch devices) */

.no-touch .fade-left{
    opacity: 0; 
    left: -60px; 
    position: relative;
}

.no-touch .fade-right{
    opacity: 0; 
    right: -60px; 
    position: relative;
}

.no-touch .fade-top{
    opacity: 0; 
    top: -60px; 
    position: relative;
}

.no-touch .fade-bottom{
    opacity: 0; 
    bottom: -60px; 
    position: relative;
}

.no-touch .fade{
    opacity: 0;
}

html.light{
    background: #fff;
    color: #000;
    transition: all 0.3s ease-in-out;
}

html.light .social-link{
    background: #000;
    color: #fff;
    transition: all 0.3s ease-in-out;
}