/*********************************************************************************************************************

											ALL STYLES BY:


____________________________________________/\\\\\\__________________________________________________/\\\____
 ___________________________________________\////\\\________________________________________________/\\\\\____
  _________________________________/\\\_________\/\\\_____/\\\_____________________________________/\\\/\\\____
   _____/\\\\\_____/\\\____/\\\__/\\\\\\\\\\\____\/\\\____\///___/\\/\\\\\\_______/\\\\\\\\_______/\\\/\/\\\____
    ___/\\\///\\\__\/\\\___\/\\\_\////\\\////_____\/\\\_____/\\\_\/\\\////\\\____/\\\/////\\\____/\\\/__\/\\\____
     __/\\\__\//\\\_\/\\\___\/\\\____\/\\\_________\/\\\____\/\\\_\/\\\__\//\\\__/\\\\\\\\\\\___/\\\\\\\\\\\\\\\\_
      _\//\\\__/\\\__\/\\\___\/\\\____\/\\\_/\\_____\/\\\____\/\\\_\/\\\___\/\\\_\//\\///////___\///////////\\\//__
       __\///\\\\\/___\//\\\\\\\\\_____\//\\\\\____/\\\\\\\\\_\/\\\_\/\\\___\/\\\__\//\\\\\\\\\\___________\/\\\____
        ____\/////______\/////////_______\/////____\/////////__\///__\///____\///____\//////////____________\///_____



**********************************************************************************************************************/
@font-face { font-family: 'Droid Serif'; src: url("/assets/fonts/DroidSerif.eot"); /* IE9 Compat Modes */ src: url("/assets/fonts/DroidSerif.eot?#iefix") format("embedded-opentype"), url("/assets/fonts/DroidSerif.woff") format("woff"), url("/assets/fonts/DroidSerif.ttf") format("truetype"), url("/assets/fonts/DroidSerif.svg#5d364ce9e566edaca137d4e0c9262156") format("svg"); /* Legacy iOS */ font-style: normal; font-weight: 400; }

@font-face { font-family: 'Droid Serif'; src: url("/assets/fonts/DroidSerif-Bold.eot"); /* IE9 Compat Modes */ src: url("/assets/fonts/DroidSerif-Bold.eot?#iefix") format("embedded-opentype"), url("/assets/fonts/DroidSerif-Bold.woff") format("woff"), url("/assets/fonts/DroidSerif-Bold.ttf") format("truetype"), url("/assets/fonts/DroidSerif-Bold.svg#d209f49a3ee236863ef396274df64fc8") format("svg"); /* Legacy iOS */ font-style: normal; font-weight: 700; }

@font-face { font-family: 'Droid Serif'; src: url("/assets/fonts/DroidSerif-BoldItalic.eot"); /* IE9 Compat Modes */ src: url("/assets/fonts/DroidSerif-BoldItalic.eot?#iefix") format("embedded-opentype"), url("/assets/fonts/DroidSerif-BoldItalic.woff") format("woff"), url("/assets/fonts/DroidSerif-BoldItalic.ttf") format("truetype"), url("/assets/fonts/DroidSerif-BoldItalic.svg#c160bd7df9efe71d33aafb46c82669a2") format("svg"); /* Legacy iOS */ font-style: italic; font-weight: 700; }

@font-face { font-family: 'Droid Serif'; src: url("/assets/fonts/DroidSerif-Italic.eot"); /* IE9 Compat Modes */ src: url("/assets/fonts/DroidSerif-Italic.eot?#iefix") format("embedded-opentype"), url("/assets/fonts/DroidSerif-Italic.woff") format("woff"), url("/assets/fonts/DroidSerif-Italic.ttf") format("truetype"), url("/assets/fonts/DroidSerif-Italic.svg#4d1507d45b1997fa2cb5ea228b85eacd") format("svg"); /* Legacy iOS */ font-style: italic; font-weight: 400; }

@font-face { font-family: 'Oswald'; src: url("/assets/fonts/Oswald-Bold.eot"); /* IE9 Compat Modes */ src: url("/assets/fonts/Oswald-Bold.eot?#iefix") format("embedded-opentype"), url("/assets/fonts/Oswald-Bold.woff") format("woff"), url("/assets/fonts/Oswald-Bold.ttf") format("truetype"), url("/assets/fonts/Oswald-Bold.svg#8b7d84d0fec5c092ff0cd49cce97dba9") format("svg"); /* Legacy iOS */ font-style: normal; font-weight: 700; }

@font-face { font-family: 'Oswald'; src: url("/assets/fonts/Oswald-Light.eot"); /* IE9 Compat Modes */ src: url("/assets/fonts/Oswald-Light.eot?#iefix") format("embedded-opentype"), url("/assets/fonts/Oswald-Light.woff") format("woff"), url("/assets/fonts/Oswald-Light.ttf") format("truetype"), url("/assets/fonts/Oswald-Light.svg#ffb8dcef06d46f6eb147bc130c4ffab3") format("svg"); /* Legacy iOS */ font-style: normal; font-weight: 200; }

@font-face { font-family: 'Oswald'; src: url("/assets/fonts/Oswald-Regular.eot"); /* IE9 Compat Modes */ src: url("/assets/fonts/Oswald-Regular.eot?#iefix") format("embedded-opentype"), url("/assets/fonts/Oswald-Regular.woff") format("woff"), url("/assets/fonts/Oswald-Regular.ttf") format("truetype"), url("/assets/fonts/Oswald-Regular.svg#d67d554191d502d9670fbfbb34cee6cd") format("svg"); /* Legacy iOS */ font-style: normal; font-weight: 400; }

*, *:before, *:after { -moz-box-sizing: border-box; /* Firefox 1, probably can drop this */ -webkit-box-sizing: border-box; /* Safari 3-4, also probably droppable */ box-sizing: border-box; /* Everything else */ }

/* Reset by outline4
-------------------------------------------------------------------------------------------------- */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td, header, section, nav, footer, article, img, video, audio, figure { position: relative; margin: 0; padding: 0; }

table { border-collapse: collapse; border-spacing: 0; /* table-layout:fixed; */ }

td, th { vertical-align: top; padding-right: 15px; /* padding-bottom: 7px; */ }

td:last-child { padding-right: 0; }

fieldset, img { border: 0; }

address, caption, cite, code, dfn, em, b, strong, th, var { font-style: normal; font-weight: normal; }

caption, th { text-align: left; }

h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }

p, dl, hr, ol, ul, pre, table, fieldset, video, audio, figure { margin-bottom: 20px; font-weight: normal; }

q:before, q:after { content: ''; }

abbr, acronym { border: 0; }

pre { white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -o-pre-wrap; }

*:-moz-any-link:focus { outline: none !important; }

iframe { border: none; }

li { list-style-position: inside; }

/* Set to 100%
-------------------------------------------------------------------------------------------------- */
html, body { height: 100%; }

/* !Make IE behave like a normal browser */
canvas { -ms-touch-action: double-tap-zoom; }

/* !Body
----------------------------------------------------------------------------------------------------*/
body { font-size: 20px; line-height: 1.625; font-family: Droid Serif, Arial, sans-serif; color: #333; background: #fff; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }

/* !Headings & Formatting
----------------------------------------------------------------------------------------------------*/
h1, h2, h3, h4, .h0, .h1, .h2, .h3, .h4 { font-family: Oswald, Droid Serif, Arial, sans-serif; color: #333; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; }

h1, .h1 { font-size: 77px; line-height: 1.1; margin-bottom: 11px; }

h1.sub, .h1-sub { font-family: Droid Serif, Arial, sans-serif; font-style: italic; font-size: 48px; line-height: 1.1; margin-bottom: 11px; }

h2, .h2 { font-size: 48px; line-height: 1.1; margin-bottom: 11px; }

h3, .h3 { font-size: 20px; line-height: 23px; }

span.legend { font-size: 16px; display: block; margin-bottom: 22px; }

.ab-dark h1, .ab-dark h2, .ab-dark h3, .ab-dark h4, .ab-dark .h0, .ab-dark .h1, .ab-dark .h2, .ab-dark .h3, .ab-dark .h4 { color: white; }

/* !--Project Grid
----------------------------------------------------------------------------------------------------*/
.grid { width: calc(100% + 40px); margin-left: -20px; }

.grid:after { content: ""; display: table; clear: both; }

.col-1-1, .col-1-2, .col-1-3, .col-2-3, [class*='col-'] { float: left; position: relative; padding-left: 20px; padding-right: 20px; vertical-align: top; }

.col-1-1 { width: 100%; }

@media only screen and (max-width: 30em) { .col-1-1 { width: 100%; } }

.col-1-2 { width: 50%; }

@media only screen and (max-width: 30em) { .col-1-2 { width: 100%; } }

.col-1-3 { width: 33.3333333333333%; }

@media only screen and (max-width: 47.5em) { .col-1-3 { width: 50%; } }

.col-1-5 { width: 20%; }

@media only screen and (max-width: 47.5em) { .col-1-5 { width: 33.3333333333333%; } }

@media only screen and (max-width: 30em) { .col-1-5 { width: 50%; } }

.col-2-3 { width: 66.6666666666666%; }

@media only screen and (max-width: 30em) { .col-2-3 { width: 100%; padding-left: 0; padding-right: 0; } }

.desktop { display: block; }

@media only screen and (max-width: 30em) { .desktop { display: none; } }

.mobile { display: none; }

@media only screen and (max-width: 30em) { .mobile { display: block; } }

/* !Links
----------------------------------------------------------------------------------------------------*/
a, a:visited { color: red; text-decoration: none; /* font-weight: normal; */ transition: .5s; }

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

/* Image links remove the Magic border below images (another method would be to make images display as block) */
a img, a:hover img { border: none !important; text-decoration: none; vertical-align: bottom; background: none; }

/* !Link with Icons
----------------------------------------------------------------------------------------------------*/
a.download_icon { padding-left: 23px; background: url(/images/layout/download.svg) no-repeat 0 50% transparent; height: 19px; }

a:hover.download_icon { text-decoration: underline; }

.no_svg a.download_icon { background-image: url(/images/layout/download.png); }

a.external { padding-right: 23px; background: url(/assets/images/icons/external-link.svg) no-repeat right 7px transparent; height: 12px; color: #B5B5B5; border-bottom-color: #B5B5B5; }

.no_svg a.external { background-image: url(/assets/images/icons/external-link.png); }

/* Inline Formats
----------------------------------------------------------------------------------------------------*/
i, em { font-style: italic; font-variant: normal; font-weight: normal; }

b, strong { font-family: Droid Serif, Arial, sans-serif; font-style: normal; font-variant: normal; font-weight: bold; }

hr { border: 0; margin-left: 0px; color: #fff; background-color: #fff; height: 1px; }

/* Layout divs
----------------------------------------------------------------------------------------------------*/
#wrapper, .wrapper { width: 100%; max-width: 720px; margin: 0 auto; z-index: 1; margin-top: 50px; padding-left: 20px; padding-right: 20px; }

/* home (portfolio listing) -----------------------------------------------------------------------------------*/
.porfolio_listing, .porfolio_listing_inner { position: relative; }

.porfolio_listing_inner { font-size: 0; width: 100%; height: 100%; overflow: hidden; margin: 0; padding: 0; border-radius: 100%; }

a.overlay { opacity: 0; transition: opacity 0.7s; border-radius: 100%; position: absolute; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0, 0, 0, 0.8); margin: 0; padding: 0; border: 0; }

a:hover.overlay { border: none; opacity: 0.9; }

.overlay_inner { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; z-index: 2; }

.overlay_inner .h3 { color: white !important; }

.overlay_inner p { font-family: Oswald, Droid Serif, Arial, sans-serif; font-style: italic; font-size: 13.33333px; color: white; margin-bottom: 0; }

.overlay_inner hr { margin: 0; padding: 0; }

/* .overlay { position: absolute; top: 0; left:0; right: 0; bottom: 0; height: 100%; background: rgba(0,0,0,.6); opacity: 1; } */
/* .overlay_inner { display: inline-block; vertical-align: middle; height: 100%; opacity: 1; } .overlay_inner:before { content: ""; display:inline-block; vertical-align: middle; height: 100%; width: 1px; } */
/* Social -----------------------------------------------------------------------------------*/
/* Blog -----------------------------------------------------------------------------------*/
/* Work -----------------------------------------------------------------------------------*/
/* Contact -----------------------------------------------------------------------------------*/
/* Grid -----------------------------------------------------------------------------------*/
/* Header -----------------------------------------------------------------------------------*/
/* Footer -----------------------------------------------------------------------------------*/
a.social_icon { border-bottom: none; display: inline-block; margin-left: 5px; margin-right: 5px; }

a.social_icon:hover { border-bottom: none; }

/* Social Icons
-------------------------------------------------------------------------------------------------------*/
a.facebook_social { display: inline-block; width: 19px; height: 19px; background: url(/files/layout/share/facebook.svg) no-repeat center top transparent; text-indent: -9999px; }

.no_svg a.facebook_social { background-image: url(/files/layout/share/facebook.png); }

a.twitter_social { display: inline-block; width: 19px; height: 19px; background: url(/files/layout/share/twitter.svg) no-repeat center top transparent; text-indent: -9999px; }

.no_svg a.twitter_social { background-image: url(/files/layout/share/twitter.png); }

/* format styling
---------------------------------------------------------------------------------------------------*/
a { color: red; border-bottom: 1px solid red; }

a:hover { color: #333; border-bottom: 1px solid #333; }

a.link { color: red; border-bottom: 1px solid red; }

a:hover.link { color: #333; border-bottom: 1px solid #333; }

blockquote { margin-bottom: 20px; }

blockquote p { font-family: Oswald, Droid Serif, Arial, sans-serif; font-size: 48px; line-height: 1.1; margin-bottom: 6.66667px; word-wrap: break-word; }

blockquote cite { font-style: italic; }

.small_format h1, .small_format .h1 { font-size: 48px; line-height: 1.1; margin-bottom: 8px; padding-right: 15px; }

.small_format h2, .small_format .h2 { font-size: 20px; line-height: 23px; margin-bottom: 8px; padding-right: 15px; }

.small_format p { font-size: 16px; line-height: 18px; margin-bottom: 8px; /* padding-right: 15px; */ }

/* format pagination
---------------------------------------------------------------------------------------------------*/
.pagination .page { display: inline-block; padding: 10px 20px; border: 1px solid #fff; }

.pagination .page.active { background: #272727; color: #fff; border: 1px solid #272727; }

/* Slideshow with ul > li
----------------------------------------------------------------------------------------------------*/
.thumbnail_list { list-style: none; font-size: 0; }

.thumbnail_list.columns3 li { display: inline-block; vertical-align: top; width: 32%; margin-left: 1%; margin-right: 1%; margin-bottom: 2%; }

.thumbnail_list.columns5 li { display: inline-block; vertical-align: top; width: 19%; margin-left: 0.5%; margin-right: 0.5%; margin-bottom: 1%; }

.thumbnail_list li.first { margin-left: 0; }

.thumbnail_list li.last { margin-right: 0; }

.thumbnail_list img { display: block; width: 100%; height: auto; }

/* definition list
---------------------------------------------------------------------------------------------------*/
dt { display: inline-block; float: left; clear: left; width: 130px; font-weight: bold; }

dd { margin: 0 0 0 10px; padding: 0; }

/* Blocks
---------------------------------------------------------------------------------------------------*/
.block { margin-top: 40px; margin-bottom: 40px; }

.big_block { margin-bottom: 60px; }

/* Specials
----------------------------------------------------------------------------------------------------*/
/* Responsive images */
.image_full_width { max-width: 100%; height: auto; /* transition: width 1s ease, height 1s ease; */ }

.image_full_height { width: 67%; height: auto; }

/* image alignement for inline content */
img.left { float: left; padding-right: 19px; padding-bottom: 9px; }

img.right { float: right; padding-left: 19px; padding-bottom: 9px; }

img.center { display: inline-block; text-align: center; }

/* Responsive videos */
.video_full_width_container { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; margin-bottom: 21px; }

.video_full_width_container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.hidden, .hide { display: none; }

a.tag { background: #999; padding: 3px 5px; white-space: nowrap; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; border-bottom: none !important; color: white; }

a:hover.tag { background: red; }

.align_right { text-align: right; }

/* Responsive Google Maps */
.google_maps_full_width { position: relative; padding-bottom: 75%; /* This is the aspect ratio */ height: 0; }

.google_maps_full_width iframe { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; }

.hyphen { -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; }

.uppercase { text-transform: uppercase; }

.small { font-size: 12px; line-height: 14px; }

.center { text-align: center; }

.ident { padding-left: 10px; }

.no_wrap { white-space: nowrap; }

.margin_top { margin-top: 20px; }

.big_margin_top { margin-top: 40px; }

.margin_btm { margin-bottom: 20px; }

.tiny_margin_btm { margin-bottom: 6.66667px; }

.small_margin_btm { margin-bottom: 8px; }

.big_margin_btm { margin-bottom: 40px; }

.very_big_margin_btm { margin-bottom: 60px; }

.medium_margin_btm { margin-bottom: 24px; }

.huge_margin_btm { margin-bottom: 120px; }

.no_margin_btm, .nomargin { margin-bottom: 2px !important; }

.padding_btm { padding-bottom: 20px; }

@media only screen and (max-width: 30em) { .hide_on_mobile { display: none; } }

/* Clear Floated Elements
----------------------------------------------------------------------------------------------------*/
.clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }

.clearfix::after { clear: both; content: ""; display: table; }

/* !Admin Elements
----------------------------------------------------------------------------------------------------*/
a.modalbox_edit, a.admin_link { color: #fff !important; background: #999 !important; font-size: 11px; padding: 2px 6px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; /* future proofing */ -khtml-border-radius: 3px; /* for old Konqueror browsers */ text-decoration: none; }

a:hover.modalbox_edit, a:hover.admin_link { color: #fff; background: #333 !important; text-decoration: none; }

#dev_mode { position: fixed; top: 0; left: 0; width: 100%; height: 5px; background: url(/files/layout/system/devmode.png) repeat-x 0 0 #333f4d; z-index: 2; }

#admin_box { position: fixed; top: 6px; left: 10px; width: 62%; background: transparent; z-index: 100; font-size: 10px; }

#toggler { position: fixed; top: 6px; right: 0; padding: 5px 10px; z-index: 101; color: #272727; }

.logged_in { background: url(/css/images/stripe-gray.png) repeat 0 0 transparent; }

.logged_in_gray { background: url(/css/images/stripe-gray.png) repeat 0 0 transparent; }

.logged_in_black { background: url(/css/images/stripe-dark.png) repeat 0 0 transparent; }

.admin_background { background: #b21f17; }

.admin_white, .admin_white a { color: white !important; }

.admin_white { padding: 5px; }