@import url('https://fonts.googleapis.com/css?family=Pavanam');

html,body,p,li,ul,ol,span,div,h1,h2,h3,a,span,table,tr,th,td,input,textarea {
    padding:0;
    margin:0;
    font-family:'Pavanam', sans-serif;
    font-weight:400;
    font-size:18px;
    line-height:150%;
    text-decoration:none;
    border:none;
}

body {
    background-color:#16110D;
}

#header {
    background:#fff;
    width:100%;
}

#header-body {
    max-width:960px;
    margin:0px auto;
    display:table;
    width:100%;
    padding:20px 0px;
}

#logo-image, #menu {
    display:table-cell;
    vertical-align:middle;
}

figcaption {
    display:none;
}

#menu {
    padding-right:8px;
}

#logo-image img {
    position:relative;
    top:4px;
    left:8px;
}

#language-menu {
    text-align:right;
    margin-bottom:10px;
}

#language-menu a {
    color:#5371a3;
    margin-left:8px;
    transition: color .4s;
}

#navigation-menu {
    text-align:right;
}

#language-menu a:hover {
    color:#ffcc00;
}

#navigation-menu a {
    margin-left:30px;
    color:#4d4d4d;
    font-size:20px;
    font-weight:700;
    transition: color .4s;
}

#navigation-menu a:hover {
    color:#ffcc00;
    padding-bottom:4px;
}

#navigation-button,
#navigation-bar {
    display:none;
}

.root #footer {
    display:none;
}

#footer,
#footer span {
    clear: both;
    font-size:14px;
    color:#777;
    text-align:center;
    margin-top:20px;
    padding-top:20px;
    padding-bottom:20px;
    border-top:1px solid #333;
}

#content {
    width:100%;
}

#content-body {
    max-width:960px;
    margin-right:auto;
    margin-left:auto;
    padding-left:8px;
    padding-right:8px;
}

#content h1 {
    padding-top:100px;
    padding-bottom:30px;
    text-align:center;
    font-size:34px;
    color:#fff;
}

/***** FORMS *****/

input[type="text"],
textarea {
    font-family:Source Sans Pro;
    padding:6px;
    font-size:20px;
    margin-bottom:12px;
    box-sizing:border-box;
    width:100%;
}

.button {
    padding:16px;
    color:#bbb;
    font-size:20px;
    border-radius:20px;
    line-height:100%;
    background-color:transparent;
	border:2px solid #bbb;
    text-decoration:none;
    cursor:pointer;
    transition:color .5s, border-color .5s, padding .3s linear;
}

.button:hover {
    color:#fff;
    border-color:#fff;
}

#form-errors {
    background-color:#bb0000;
    padding:6px;
    margin-bottom:6px;
    border-radius:6px;
    box-sizing:border-box;
    color:#fff;
    width:100%;
    margin-left:auto;
    margin-right:auto;
}

.form-error {
    border: 2px solid red;
}

/***** HOME PAGE *****/

#page.root #content {
    background-image: url('/images/homepage-image.png');
    background-size: 100%;
    background-repeat:no-repeat;
    min-height:700px;
}

#page.root #homepage-wrapper {
    max-width:800px;
    text-align:center;
    margin:0px auto;
    padding-bottom:30px;
    color:#fff;
}

#page.root #content h1 {
    font-size:50px;
    margin-bottom:30px;
    line-height:100%;
    opacity:0;
    transition:opacity .7s, padding .7s;
}

#homepage-text {
    opacity:0;
    transition:opacity 1s;
    margin-bottom:30px;
}

#homepage-table {
    display:table;
    margin-left:auto;
    margin-right:auto;
    width:99%;
}

#homepage-table div {
    display:table-cell;
    width:33%;
    opacity:0;
    transition:opacity 2s;
}

#homepage-column2 {
    padding-left:20px;
    padding-right:20px;
}

#page.root .subheading {
    color:#ffcc00;
    margin-bottom:20px;
}

#homepage-table img {
    width:120px;
}

#homepage-slogan {
    margin-top:40px;
    font-size:26px;
    opacity:0;
    transition:opacity 1s;
}

#page.root .button:hover {
    padding:20px;
}

div.fancybox-caption__body {
    background-color:rgb(0,0,0,0.3);
}

/***** CONTACT PAGE *****/

#contactpage-table {
    display:table;
    width:100%;
}

#contactpage-left,
#contactpage-right {
    display:table-cell;
}

#contactpage-left {
    max-width:400px;
    padding-right:16px;
    width:40%;
    color:#aaa;
}

#contact-email {
    color:#ffcc00;
}

#page.contact #url,
#page.contact #secret {
    display:none;
}

#page.contact input[type='text'],
#page.contact textarea {
    color:rgb(170, 170, 170);
}

/***** ABOUT PAGE *****/

#page.about .description {
    margin-bottom:30px;
}

#page.about p {
    color:#fff;
    opacity:.7;
}

#page.about .name {
    font-size:26px;
}

#page.about .job {
    font-size:20px;
}

#page.about .name,
#page.about .job {
    opacity:1;
}

.left-image {
    float:left;
    width:150px;
    margin-right:20px;
    margin-bottom:20px;
}

/***** PORTFOLIO PAGE *****/

#page.portfolio #project-container {
    text-align:center;
}

#page.portfolio #project-container img {
    width:200px;
    height:150px;
}

/***** THANK YOU PAGE *****/

#page.thanks #content {
    padding-top:100px;
}

#page.thanks #thankyou-table {
    display:table;
    margin-left:auto;
    margin-right:auto;
    padding:16px;
    font-size:20px;
    border-radius:20px;
    line-height:100%;
	border:3px solid #bbb;
}

#page.thanks #thankyou-image,
#page.thanks #thankyou-text {
    display:table-cell;
    vertical-align:middle;
}

#page.thanks #thankyou-text {
    max-width:400px;
    color:#fff;
    padding-left:20px;
}

/***** 404 PAGE *****/

#notfound-table {
    display:table;
    margin-left:auto;
    margin-right:auto;
    padding:16px;
    font-size:20px;
    border-radius:20px;
    line-height:100%;
	border:3px solid #bbb;
}

#notfound-image,
#notfound-text {
    display:table-cell;
    vertical-align:middle;
}

#notfound-text {
    max-width:400px;
    color:#fff;
    padding-left:20px;
}