@font-face {
    font-family: "Akkurat Regular";
    src: url(../fonts/Akkurat.ttf);
}

@font-face {
    font-family: "Akkurat Bold";
    src: url(../fonts/Akkurat-Bold.ttf);
}

html {
    background: #b8bbb4;
    overflow-y: scroll;
}

body {
    color: #000;
    background: #b8bbb4;
    margin-top: 65px;
    font-size: 10pt;
    font-family: "Akkurat Regular";
    line-height: 13pt;
}

strong {
  font-family: "Akkurat Bold";
}

a {
    color:  #000;
    opacity: 1;
    transition: color 200ms ease-in;
}

a:active, a:focus, a:hover {
    text-decoration: none;
    color: #000;
}

a:hover {
    color:  #808285;
}

/* do not transition these anchor tags */
.logo a:hover,
a.module-item:hover {
    color: #000;
}

a.active {
    color: #808285;
}

ul {
    margin: 0;
}


hr {
    border-top: none;
    border-bottom: 1px dotted #000;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Akkurat Bold";
    font-size: 10pt;
    line-height: 15pt;
    font-weight: normal;
    margin: 0px;
}

#logo-left {
    background: url(/static/img/tacklebox_left.svg) no-repeat;
    background-position:left;
    float:left;
    width: 18px;
    height: 40px;
    overflow:hidden;
}

#logo-center {
    background: url(/static/img/tacklebox_center.svg) no-repeat;
    background-position:center;
    float: left;
    width: 9px;
    height: 40px;
    overflow:hidden;
}

#logo-right {
    background: url(/static/img/tacklebox_right.svg) no-repeat;
    background-position:right;
    float:left;
    width: 20px;
    height: 40px;
    overflow:hidden;
}

#map-canvas {
    width: 810px;
    height: 575px;
}

.left-seperated {}

.center-seperated {
    margin-left: -3px;
}

.right-seperated {
    margin-left: -4px;
}

.left-combined {}

.center-combined {
   margin-left: -7px;
}

.right-combined {
    margin-left: -8px;
}

.grid-container {
    position: absolute;
    right: 0;
    left: 0;
    margin-left: auto;
    margin-right: auto;
}

.grid-test {
    height: 1000px;
    background: url(/static/img/grid_test.png) repeat;
    opacity: 0.7;
}

.center-fixed {
    position: fixed;
    width: 100%;
    top: 0px;
    z-index: 999;
}

/* Navigation Menu */

.navbar-main .container {
    margin-right: auto;
    margin-left: auto;
}

.navbar-top {
    background-color: #b8bbb4;
    line-height: normal;
}

.navbar-top li {
    line-height: normal;
}

.navbar-top hr {
    padding: 0;
    margin: 0;
    border-bottom: 1px solid #000;
    width: 1005px;
    clear: both;
    margin-left: 15px;
    margin-top: 67px;
}

.navbar-container {
    position: relative;
    height: 52px;
    width: 100%;
}

.navbar-content {
    position: absolute;
    bottom: 0px;
}

.navbar-content-right {
    right: 0px;
}

.dropdown-content {
    background-color: #b8bbb4;
    background-color: rgb(184, 187, 180);
    background-color: rgba(184, 187, 180, .95);
    /* Fallback for internet explorer alpha channel */
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#f2b8bbb4, endColorstr=#f2b8bbb4);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#e5b8bbb4, endColorstr=#e5b8bbb4)";
}

.project-menu-container {
    border-bottom: 1px solid #000000;
    padding-bottom: 30px;
}

/*** site generic ***/

.relative-wrapper {
    position: relative;
    height: 100%;
}

.nav {
}

.nav ul {
    margin: 0;
}

.nav li {
    list-style-type: none;
}

.flat-list {
    margin: 0px;
}

.flat-list li {
    float:left;
    margin-left: 15px;
}

.flat-list li:first-child {
    margin-left: 0;
}

/*** navigation ***/
.site-title {
    font-family: "Akkurat Bold";
}

/*** project menu ****/
.project-menu {
    margin-top: 30px;
}

.project-menu li {
    line-height: 13pt;
}

/*** projects ***/
.project {
    margin-top: 30px;
}

.project-content [class*=span] {
    float: none;
    display: table-cell;
    vertical-align: top;
    padding-left: 15px;
}

.project hr {
    border-top: none;
    border-bottom: 1px dotted #000;
    margin: 30px 0;
}

.project-header {
    height: 100%;
}

.project-header h2 {
    margin: 0;
    padding: 0;
    font-family: "Akkurat Regular";
}

.project-social {
    position: absolute;
    margin-top: 15px;
    bottom: 0;
}

.project-description {
    min-height: 30px;
}

.project-images ul {
    margin: 0px;
}

.project-images li {
    list-style-type: none;
    margin-bottom: 30px;
}
.project-images li:last-child {
    list-style-type: none;
    margin-bottom: 0;
}

.project-images li img {
    width: 1005px;
}

/*** news ***/

.news-item {
    margin-top: 30px;
    margin-bottom: 30px;
    margin-left: 0;
}

.news-item h2 {
    font-family: "Akkurat Bold";
}

.news-image, .news-description {
    display: table-cell;
    vertical-align: top;
}

.news-image img {
    margin-bottom: 15px;
    margin-right: 15px;
    width: 310px;
    display: block;
}

.news-image img:last-child {
    margin-bottom: 0;
}

.news-description {
    padding-left: 15px;
    width: 495px;
}

.news-social {
    position: absolute;
    bottom: -7px;
}

.news-social-extra-spacing {
    position:relative;
}

/*** profile ***/
.profile {
    padding-bottom: 30px;
    border-bottom: 1px solid #000;
}

.profile hr {
    margin: 0px;
    border: none;
    border-top: 1px dotted #000;
}

.profile-header {
    padding-top: 30px;
    padding-bottom: 30px;
}

.profile-header h2 {
    font-family: "Akkurat Regular";
    font-size: 24pt;
    line-height: 30pt;
    margin: 0;
    padding: 0;
}

.profile h3 {
    margin-bottom: 15px;
    line-height: 10pt;
}

.profile-principal {
    border-top: 1px dotted #000;
    padding-top: 30px;
    padding-bottom: 30px;
}

.profile-snippet {
    margin-top: 30px;
    margin-bottom: 30px;
}

.profile-photo {
    margin-top: 30px;
}

.profile-photo img {
    width: 310px;
    margin-right: 15px;
}

.profile-description {
    margin-top: 30px;
}

/*** contact ***/
.contact {
    margin-top: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #000;
}

/*** press menu ***/
.pressmenu-item-container {
    border-bottom: 1px dotted #000;
}

/* Chrome is not applying the opacity
   on all child elements */
.pressmenu-item-container a:hover > div {
    color: #808285;
}

.pressmenu-item:first-child {
    padding-top: 1px;
}

.pressmenu-item:last-child .pressmenu-item-container {
    border-bottom: 1px solid #000;
}

.pressmenu-item-container [class*='span'] {
    float: none;
    display: table-cell;
    vertical-align: bottom;
    padding: 5px 0 3px 15px;
    height: 20px;
}

/*** press ***/

.press {
    margin-top: 30px;
}

.press-image img {
    width: 835px;
    margin-bottom: 30px;
}

.press-image img:last-child {
    margin-bottom: 0;
}

/*** module content ***/

.module-container {
    margin-top: 30px;
}

.module-item {
    opacity: 0;
    transition: opacity 200ms ease-in;
}

.module {
    margin-bottom: 15px;
    position: relative;
    margin-left: 15px;
    float: left;
}

.module img {
    width: 325px;
}

.no-opacity {
    opacity: 1;
}

.module:hover > .module-overlay, .module-overlay:hover {
    opacity: 1;
}

.module-overlay {
    background-color: #000;
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, .80);
    /* Fallback for internet explorer alpha channel */
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#cc000000, endColorstr=#cc000000);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#cc000000, endColorstr=#cc000000)";
    padding-top: 15px;
    padding-left: 15px;
    color: #B8BBB4;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    opacity: 0;
    -webkit-transition: opacity 400ms ease-in;
       -moz-transition: opacity 400ms ease-in;
         -o-transition: opacity 400ms ease-in;
            transition: opacity 400ms ease-in;
}

/*** footer content ***/

.footer {
    position: relative;
    bottom: 0px;
    height: 55px;
    margin-top: 60px;
}

.footer .container {
    border-top: 1px solid #000;
    padding-top: 15px;
}

/* MEDIA QUERY */
@media only screen and (max-device-width: 768px) {
  .center-fixed {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1000;
  }

  a:hover {
    color: #000;
  }
}