/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: local('Lato Light'), local('Lato-Light'), url(../fonts/S6u9w4BMUTPHh7USSwaPGQ3q5d0N7w.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: local('Lato Light'), local('Lato-Light'), url(../fonts/S6u9w4BMUTPHh7USSwiPGQ3q5d0.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(../fonts/S6uyw4BMUTPHjxAwXiWtFCfQ7A.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(../fonts/S6uyw4BMUTPHjx4wXiWtFCc.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

#jem .jem-row, #jem .jem-dl { padding-left: 0; }

#jem .jem-event { align-items: top; }



/* ==========================================================================
   Template:	Oneweb
   Version: 	3.0 for Joomla 2.5, 3+
   Created: 	April 2013

   Author: 	Seth Warburton - Internet Inspired! - @nternetinspired
   Copyright:	Seth Warburton - (C) 2013
   License:	GNU/GPL v3 or later http://www.gnu.org/licenses/gpl-3.0.html

   Inspiration:	https://github.com/h5bp/html5-boilerplate
		https://github.com/malarkey/320andup/
		https://github.com/csswizardry/inuit.css
   ========================================================================== *
 * INTRODUCTION
 * ============
 *
 * Oneweb is an Object Orientated framework and so attempts to separate out
 * everything into re-usable modules. Unlike most other frameworks it tries
 * to abstract the 'design' away from the layout. The intention is that you
 * never have to do battle with the framework.
 *
 * Breaking everything down into maintainable, and easily digestible, chunks
 * makes it easy to find and change what you want and separating the basic
 * design constructs from their styling makes it possible to easily update
 * the framework without breaking your 'design'.
 *
 * HOW DOES IT WORK?
 * =================
 *
 * The Oneweb framework handles basic layout and provides all the css 'tools',
 * while the UI template does all the pretty stuff.
 *
 * This file pulls in the Oneweb framework and any modules that are enabled
 * by default. After that elements are styled by pulling in modules from the
 * UI folder.
 *
 * Modifications to the framework should be made ONLY by overriding its
 * defaults from within the UI template, using the _variables.scss file.
 *
 * Within the UI folder you can do almost anything you want. For example, if
 * you want to add some widgets to your template drop _widgets.scss into the
 * ui folder and then import _widgets.scss using this file. You can also
 * enable the import of any framework modules that are disabled by default,
 * simply by setting the use paramter to true, e.g.,
 *
 * $use-wells:             true;
 *
 * STYLEGUIDE
 * ==========
 *
 * For my sanity an yours Oneweb has been authored according to a styleguide,
 * STYLEGUIDE.md
 *
   ========================================================================== */
/*
 * _variables.scss overrides framework defaults, and enables optional modules,
 * so it needs to be loaded first.
 *
 *
 * Any variables you find set in framework/_defaults.scss should be overridden
 * in ui/_variables.scss.
 */
/* ==========================================================================
   	OPTIONAL MODULES
   ========================================================================== */
/* ==========================================================================
   	OVERRIDE VARIABLES
   ========================================================================== */
/* Sets the html background dark for a faux footer. */
/* ==========================================================================
   	CUSTOM VARIABLES
   ========================================================================== */
/* Now, let's bring in the framework! */
/* ==========================================================================
   Package:	Oneweb CSS framework
   Version: 	1.0
   Created: 	April 2013
   ========================================================================== */
/* ==========================================================================
 * WARNING!!
 * =========
 *
 * Avoid editing this file, or any file within the framework folder!
 * Doing so will make it impossible to update without breaking your template.
 * Alterations and additions should be made within UI folder only.
 *
 * From the UI folder it's easy to disable almost any part of the framework,
 * add to it or modify any aspect of it. Making modifications within the
 * framework folder is doing it the hard way!
   ========================================================================== */
/* Let's start importing framework stuff! */
/* ==========================================================================
    DEFAULT FONT STACKS
   ========================================================================== */
/* ==========================================================================
    ROOT RULES
   ========================================================================== */
/* Default font-size in %, equates to 1em or 16px. */
/* Our font stacks. */
/* Default font-weight. */
/* Root element colours. */
/* Also set a body background, to allow for faux footers. */
/* Spacing units derived from line-height; they scale with root-font-size. */
/* Constrain content widths to maintain an optimal measure (line-length). */
/* ==========================================================================
    BRANDING
   ========================================================================== */
/* Default brand colour. */
/* Default colour for objects and borders. */
/* Link colours. */
/* The default size of rounded corners. */
/* UI elements colours, used in badges, buttons, labels, etc. */
/* ==========================================================================
    HEADINGS
   ========================================================================== */
/* Heading sizes specified in em. */
/* Heading weight. */
/* ==========================================================================
    TYPE SIZING
   ========================================================================== */
/* Type (up)sizing classes */
/* Type (down)sizing classes */
/* ==========================================================================
    TYPOGRAPHY
   ========================================================================== */
/* Default quote marks. If you're French you'll want to change these. */
/* ==========================================================================
    DEFAULT BREAKPOINTS
   ========================================================================== */
/* Specifying breakpoints in ems accounts for user-initiated resizes. */
/* ==========================================================================
    OPTIONAL MODULES
   ========================================================================== */
/* The following modules can be enabled in ui/_variables.scss if required. */
/* Ensure our mixins are available to all modules by loading them first. */
/* ==========================================================================
    MIXINS
   ========================================================================== */
/* Set boxsizing, defaults to border-box. */
/* Set an appropriate line-height for elements when setting font-size. */
/* The micro clearfix http://nicolasgallagher.com/micro-clearfix-hack. */
/* Hyphenate text */
/* Basic transitions. */
/* Basic coloured box-shadows. */
/* Basic horizontal gradients. */
/* Basic vertical gradients. */
/* Media query mixin to add a defined breakpoint. The following breakpoints
 * are defined in the defaults file but should be re-declared in
 * ui/_variables.scss.
 *
 * palm
 * lap
 * portable
 * desk
 * desk-wide
 *
 * The active breakpoint size is also appended as a class to the html element,
 * primarily to aid in the de-bugging of media-queries.
 *
 * Use the media query mixin like this:
 *
 * @include media-query(desk) {
 *       your-styles-here;
 * }
 *
 * Please note, as this is a mobile-first framework the layout is mobile by
 * default. Palm represents the first breakpoint encountered as screen size
 * increases.
 */
/* Normalise default browser renderings to eliminate quirks. */
/* normalize.css v2.1.0 | MIT License | git.io/normalize */
/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */
/*
 * Correct `block` display not defined in IE 8/9.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block; }

/*
 * Correct `inline-block` display not defined in IE 8/9.
 */
audio,
canvas,
video {
  display: inline-block; }

.responsive-video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.responsive-video {
position: relative;
padding-bottom: 56.25%; /* Default for 1600x900 videos 16:9 ratio*/
padding-top: 0px;
height: 0;
overflow: hidden;
}

/*
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0; }

/*
 * Address styling not present in IE 8/9.
 */
[hidden] {
  display: none; }

/* ==========================================================================
   Base
   ========================================================================== */
/*
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-family: sans-serif;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  -ms-text-size-adjust: 100%;
  /* 2 */ }

/*
 * Remove default margin.
 */
body {
  margin: 0;}

/* ==========================================================================
   Links
   ========================================================================== */
/*
 * Address `outline` inconsistency between Chrome and other browsers.
 */
a:focus {
  outline: thin dotted; }

/*
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0; }

/* ==========================================================================
   Typography
   ========================================================================== */
/*
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari 5, and Chrome.
 */
/*
 * @nternetinspired likes this behaviour, as long as your markup is laid
 * out correctly I can' see the issue. to-do: test in IE8/9/10!
 */
h1 {
  font-size: 2.5em;
  margin: 0.67em 0; }

/*
 * Address styling not present in IE 8/9, Safari 5, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted; }

/*
 * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 */

/*
 * Address styling not present in Safari 5 and Chrome.
 */
dfn {
  font-style: italic; }

/*
 * Address differences between Firefox and other browsers.
 */
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0; }

/*
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000; }

/*
 * Correct font family set oddly in Safari 5 and Chrome.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  font-size: 1em; }

/*
 * Improve readability of pre-formatted text in all browsers.
 */
pre {
  white-space: pre-wrap; }

/*
 * Set consistent quote types.
 */
q {
  quotes: "\201C" "\201D" "\2018" "\2019"; }

/*
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%; }

/*
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

/* ==========================================================================
   Embedded content
   ========================================================================== */
/*
 * Remove border when inside `a` element in IE 8/9.
 */
img {
  border: 0; }

/*
 * Correct overflow displayed oddly in IE 9.
 */
svg:not(:root) {
  overflow: hidden; }

/* ==========================================================================
   Figures
   ========================================================================== */
/*
 * Address margin not present in IE 8/9 and Safari 5.
 */
figure {
  margin: 0; }

/* ==========================================================================
   Forms
   ========================================================================== */
/*
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

/*
 * 1. Correct `color` not being inherited in IE 8/9.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */ }

/*
 * 1. Correct font family not being inherited in all browsers.
 * 2. Correct font size not being inherited in all browsers.
 * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
 */
button,
input,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 2 */
  margin: 0;
  /* 3 */ }

/*
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
button,
input {
  line-height: normal; }

/*
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */
button,
select {
  text-transform: none; }

/*
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */ }

/*
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default; }

/*
 * 1. Address box sizing set to `content-box` in IE 8/9.
 * 2. Remove excess padding in IE 8/9.
 */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */ }

/*
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  /* 2
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  */ }

/*
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

/*
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0; }

/*
 * 1. Remove default vertical scrollbar in IE 8/9.
 * 2. Improve readability and alignment in all browsers.
 */
textarea {
  overflow: auto;
  /* 1 */
  vertical-align: top;
  /* 2 */ }

/* ==========================================================================
   Tables
   ========================================================================== */
/*
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
  max-width: 100%;
  background-color: transparent; 
  width: 100%;
  margin-bottom: 20px;}
  
th {
  text-align: left;
}
table > tbody > tr > th,
table > tfoot > tr > th,
table > tbody > tr > td,
table > tfoot > tr > td {
  padding: 5px;
  line-height: 1.42857143;
  vertical-align: top;
  border-top: 1px solid #fff;
}
table > thead > tr > th {
  vertical-align: bottom;
  border-bottom: 2px solid #ddd;
}
table > tbody:first-child > tr:first-child > th,
table > tbody:first-child > tr:first-child > td {
  border-top: 0;
}
table > tbody:last-child > tr:last-child > td {
  border-bottom: 1px solid #fff;
}
table col[class*="col-"] {
  position: static;
  display: table-column;
  float: none;
}
table td[class*="col-"],
table th[class*="col-"] {
  position: static;
  display: table-cell;
  float: none;
}

/* Ethereal items like mixins, and helpers like float or clearfix. */
/* ==========================================================================
    HELPER CLASSES
   ========================================================================== */
/* Clearfix the parent of floated elements to prevent it collapsing. */
.clearfix:before, .media.media-content:before, .well:before, .clearfix:after, .media.media-content:after, .well:after {
  content: "";
  display: table; }
.clearfix:after, .media.media-content:after, .well:after {
  clear: both; }

/* Hide an element but leave it available to speaking browsers. */
.visuallyhidden {
  overflow: hidden;
  position: absolute;
  clip: rect(0 0 0 0);
  height: 1px;
  width: 1px;
  margin: -1px;
  padding: 0;
  border: 0; }

/* Make visuallyhidden elements focusable with a keyboard. */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  position: static;
  clip: auto;
  height: auto;
  width: auto;
  margin: 0;
  overflow: visible; }

/* Image replacement. */
.ir {
  background-color: transparent;
  border: 0;
  overflow: hidden; }

.ir:before {
  content: "";
  display: block;
  width: 0;
  height: 150%; }

/* Mute an object by reducing its opacity. */
.muted, figure figcaption, .article-meta {
  filter: alpha(opacity=70) !important;
  opacity: 0.7 !important; }

/* Add/remove floats */
.float-right, .img-right, .media .media-object-right {
  float: right; }

.float-left, .img-left, .media .media-object {
  float: left; }

.float-none {
  float: none !important; }

/* ==========================================================================
    VERTICAL RHYTHM
   ========================================================================== */
/*
 * Applies consistent spacing, derived from the baseline height and default
 * font size, to generate a consistent vertical rhythm throughout.
 *
 * Note:
 *
 * Any item which has its size already set with the font-size mixin, h1 - h6
 * for example, already has a bottom-margin set with a value appropriate to
 * the font-size.
 */
address,
article,
blockquote,
dl,
fieldset,
figure,
form,
hgroup,
meter,
ol,
p,
pre,
progress,
select,
small,
table,
textarea,
ul {
  margin-top: 0;
  margin-bottom: 0.809em; }
  
ul.nav.menu {
  margin-bottom: 0.2em; }

/*
 * The following rules contain generic styles of the type applicable primarily
 * to named html elements, like <body>, <table> , or to stylistic classes
 * that can be applied to various objects.
 */
/* ==========================================================================
    ROOT
   ========================================================================== */
/*
 * Border-box *all the things*, as suggested in:
 * http:// paulirish.com/2012/box-sizing-border-box-ftw
 */
*, *:before, *:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box; }

/* Define the root element styles. */
html
{
	font: 100%/1.618 "Lato", sans-serif;
	font-weight: 300;
	color: #333333;
	min-height: 100%;
	overflow-y: scroll;
	-webkit-font-smoothing: antialiased;
	-webkit-overflow-scrolling: touch;
	background-image: url(../images/mainback.jpg);
	background-repeat: repeat;
	background-color: #E2D199;
	background-color: #cd6e57;
}

/* Style the body element styles. */
body {
  backgrodund-color: white; }
main.content  {
  background-color: rgba(255,255,255,0.3);
  box-shadow: 0 0 3px rgba(0,0,0,0.1);
  border-radius: 5px;
  margin-bottom: 1rem;
  min-height: 600px !important;
  display: flow-root;
  }
/* Colour selected text. */
::-moz-selection {
  background-color: #cd6e57;
  color: #fff;
  text-shadow: none; }

::selection {
  background-color: #cd6e57;
  color: #fff;
  text-shadow: none; }

/* This needs to override default root font size, so we load it after. */
/* ==========================================================================
    FLUID TYPE
   ========================================================================== */
/* Slowly increase root font size with viewport */
@media only screen and (min-width: 90em) {
  html {
    font-size: 106.3%; } }

/* ==========================================================================
   	CODE
   ========================================================================== */
pre,
code,
kbd,
samp {
  font-family: monospace; }

pre {
  background-color: #fcfcfc;
  border: 1px solid #eeeeee;
  border-radius: 3px;
  padding: 1em; }

/* ==========================================================================
   	FIGURES
   ========================================================================== */
figure {
  /*
  * Joomla's 'none' image alignment option defaults centering the image.
  * So we should center the caption, if it exists.
  * Crazy, but true.
  */ }
  figure img {
    margin-bottom: 0.809em; }
  figure.img-none figcaption {
    text-align: center; }

/* ==========================================================================
    FORMS
   ========================================================================== */
/* Some form basics. */
form input,
form select,
form textarea {
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease; }
form ul {
  list-style-type: none;
  margin-bottom: 0; }

/* Remove default fieldset styles. */
fieldset {
  border: 1px solid #eeeeee;
  border-radius: 3px;
  padding: 1.618em; }

input,
textarea {
  display: block;
  margin-bottom: 0.809em; }

input[type="text"],
input[type="email"],
input[type="search"],
input[type="tel"],
input[type="url"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
textarea {
  width: 100%;
  border: 1px solid #eeeeee;
  padding: 0.4045em;
  border-radius: 3px; }
  input[type="text"]:focus,
  input[type="email"]:focus,
  input[type="search"]:focus,
  input[type="tel"]:focus,
  input[type="url"]:focus,
  input[type="password"]:focus,
  input[type="number"]:focus,
  input[type="date"]:focus,
  input[type="month"]:focus,
  input[type="week"]:focus,
  input[type="time"]:focus,
  input[type="datetime"]:focus,
  input[type="datetime-local"]:focus,
  textarea:focus {
    border: 1px solid #d4d4d4;
    outline: none;
    outline-width: 0; }

/* Allow only vertical resizing of textareas. */
textarea {
  resize: vertical; }

/* Make checkboxes and radio buttons display inline. */
label {
  display: inline-block; }

input[type="radio"],
input[type="checkbox"] {
  display: inline-block;
  margin-left: 0.4045em;
  margin-right: 0.4045em; }

select {
  width: 100%;
  height: 2em;
  border: 1px solid #eeeeee; }

progress,
meter {
  display: block;
  width: 100%;
  height: 1.618em; }

/* ==========================================================================
    HEADINGS
   ========================================================================== */
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
  font-family: "Lato", sans-serif;
  font-weight: 400;
  text-rendering: optimizelegibility;
  -moz-font-feature-settings: "liga=1, dlig=1";
  -ms-font-feature-settings: "liga" 1, "dlig" 1;
  -o-font-feature-settings: "liga" 1, "dlig" 1;
  -webkit-font-feature-settings: "liga" 1, "dlig" 1;
  font-feature-settings: "liga" 1, "dlig" 1;
  color: #6e4940;}  

/* ==========================================================================
    IMAGES
   ========================================================================== */
/* Fluid images. */
img {
  max-width: 100%;
  vertical-align: middle;
  -ms-interpolation-mode: bicubic; }

/* Don't ignore `width` and/or `height` attributes if they are present. */
img[width],
img[height] {
  max-width: none; }

.content img {border-radius: 4px;border: 1px solid rgba(255,255,255,0.5);background-color: rgba(255,255,255,0.2)}

.content img.noshade {border-radius: 0;border: 0 solid transparent;background-color: transparent; }

/*
 * Image placement variations, used in Joomla's article image layouts.
 *
 * Of course, floated images typically need a margin so we extend the
 * generic floatr classes here.
 */
.img-right, .media .media-object-right {
  margin-left: 1.618em; }

.img-left, .media .media-object {
  margin-right: 1.618em; 
  margin-bottom: 0.809em;}

.img-center, .img-none img {
  display: block;
  margin-left: auto;
  margin-right: auto; }

/* Joomla has no center option, using "none" instead. Go figure. */
/* ==========================================================================
    LINKS
   ========================================================================== */
a {
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  transition: all 0.2s ease;
  color: #cd6e57;
  text-decoration: none; }
  a:hover, a:focus {
    color: #761001; }
    
.content a {font-weight: 400;}

/* Back to top link. */
a.to-top {
  bottom: -2.5em;
  border-radius: 50%;
  color: #fff;
  cursor: pointer;
  height: 5em;
  line-height: 1;
  opacity: 0.7;
  padding: 1.2em;
  position: fixed;
  right: -2.5em; 
  text-align: left;
  width: 5em;
  box-shadow: 0 0 3px #fff;
  background: #761001;
  color: #fff; 
  }

/* ==========================================================================
    LISTS
   ========================================================================== */
/*
 * There's a reason it's called 'hanging punctuation', bullets should be indented.
 * See: http://www.markboulton.co.uk/journal/five-simple-steps-to-better-typography-part-2
 * for an explanation why. The following kills browser default indents. Nice.
 */
ul,
ol,
dl {
  padding-left: 1.5em; }
  
ol li {
  padding-bottom: .5em; }

/* We don't need vertical space in nested lists, but we do need to add
* the default indent we removed above! */
li > ul,
li > ol {
  margin-bottom: 0;
  padding-left: 2em; }

/* ==========================================================================
    RULES
   ========================================================================== */
hr {
  border: 0;
  border-top: 1px solid #eeeeee;
  display: block;
  height: 1px;
  margin: 1.618em 0;
  padding: 0; }

/* ==========================================================================
    TABLES
   ========================================================================== */
table {
  width: 100%; }

th,
td {
  padding: 0.809em;
  text-align: left; }

/* Bordered tables. */

/* ==========================================================================
    TYPE SIZING
   ========================================================================== */
/*
 * Classes for super-sizing type without the semantics of h tags. Useful in
 * page banners and the like.
 *
 * Taken from Inuit.css' approach:
 * https://github.com/csswizardry/inuit.css/blob/master/base/_headings.scss
 */
.giga {
  font-size: 6em;
  line-height: 1.07867;
  margin-top: 0;
  margin-bottom: 0.26967em; }

.mega {
  font-size: 4.5em;
  line-height: 1.07867;
  margin-top: 0;
  margin-bottom: 0.35956em; }

.kilo, .logo {
  font-size: 2em;
  line-height: 1.07867;
  margin-top: 0;
  margin-bottom: 0.53933em; }

.logo
{
	background-image: url(../images/Shinson-Hapkido-Logo.png);
	text-align: center;
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 100px;
	height: 220px;
	padding-top:120px;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
} 

/*
 * Classes for down-sizing type without the semantics of h or small tags.
 * Useful in article footers, for example.
 */
.milli, figure figcaption, cite {
  font-size: 0.83em;
  line-height: 1.9494;
  margin-top: 0;
  margin-bottom: 1.9494em; }

.micro {
  font-size: 0.75em;
  line-height: 2.15733;
  margin-top: 0;
  margin-bottom: 2.15733em; }
  
.logo span.subtitle {
  font-size: 0.6em;
  margin: 0;
  font-weight: 300; }


/* ==========================================================================
    TYPOGRAPHY
   ========================================================================== */
/* PARAGRAPHS */
/*
 * Numbers in paragraphs should kick it Old Skool:
 * http://webtypography.net/Harmony_and_Counterpoint/Numerals__Capitals_and_Small_Caps/3.2.1/
 *
 * And, as everyone knows, all paragraphs after the first one should be indented
 * by one en(2 x em) without a boundary, or one em with. See:
 *
 * http://webtypography.net/Rhythm_and_Proportion/Blocks_and_Paragraphs/2.3.2/
 *
 * and:
 *
 * http://v1.jontangerine.com/silo/typography/p/
 */
.article p {
  font-variant-numeric: oldstyle-nums; }

/* Typically used in the first paragraph of an article, for added awesome. */
.intro {
  font-size: 1.3125em;
  line-height: 1.23276;
  margin-top: 0;
  margin-bottom: 1.23276em; }

/* BLOCK QUOTES */
/* Default margin indent is zeroed out and padded to allow styling of element. */
blockquote {
  margin-left: 0;
  padding: 0.809em 1.802em; }
  blockquote:before, blockquote:after {
    content: '';
    content: none; }
  blockquote p:last-of-type {
    margin-bottom: 0; }
  blockquote > cite,
  blockquote + cite {
    margin-bottom: 0; }

/* CITATIONS */
cite {
  display: block;
  margin-top: 0.809em; }
  cite:before {
    content: "\2014";
    margin-right: 0.809em; }

/* INLINE QUOTES */
q {
  quotes: "\2018" "\2019" "\201C" "\201D"; }
  q:before {
    content: "\2018";
    content: open-quote; }
  q:after {
    content: "\2019";
    content: close-quote; }

/* ABBREVIATIONS */
/*
 * Should use small-caps and be letterspaced, obviously!
 * http://webtypography.net/Rhythm_and_Proportion/Horizontal_Motion/2.1.6/
 */
abbr {
  font-variant: small-caps;
  letter-spacing: 0.1em; }

/*
 * The following are re-usable 'objects' that bring recurring CSS patterns
 * into discrete and easily maintainable modules.
 */
/* ==========================================================================
    BREADCRUMBS
   ========================================================================== */
.breadcrumb {
  font-size: 0.813em;
  margin-bottom: 0; }
  .breadcrumb > li + li:before {
    content: "\00BB" "\00A0";
    padding: 0 0.20225em; }

/* ==========================================================================
    BUTTONS
   ========================================================================== */
.btn {
  background-color: #fcfcfc;
  border: 1px solid transparent;
  border-radius: 3px;
  cursor: pointer;
  display: inline-block;
  font-size: 100%;
  font-family: "Lato", sans-serif;
  font-weight: 400;
  line-height: 2;
  margin-right: 0.809em;
  margin-bottom: 1.118em;
  padding: 0 0.5em;
  vertical-align: middle;
  white-space: nowrap; }
  .btn:hover {
    text-decoration: none;
    background-color: #efefef; }
  .btn:active {
    outline: none; }

  
.readmore .btn {
  background-color: rgba(255,255,255,0.3); }
   
.readmore .btn:hover {
  background-color: rgba(205,110,87,0.15); 
  }

/* ==========================================================================
    LABELS
   ========================================================================== */
.label,
.label-primary,
.label-success,
.label-danger,
.label-info {
  padding: .125em .25em;
  text-align: center;
  background-color: #fcfcfc;
  border-radius: 3px; }

/* LABEL COLOURS */
.label-primary {
  background-color: #428bca;
  color: #fff; }

.label-success {
  background-color: #5cb85c;
  color: #fff; }

.label-danger {
  background-color: #d9534f;
  color: #fff; }

.label-info {
  background-color: #5bc0de;
  color: #fff; }

.label-warning {
  background-color: #f0ad4e;
  color: #fff; }

/* ==========================================================================
    MEDIA
   ========================================================================== */
/* The media object abstraction, first proposed here:
 *
 * http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/
 *
 * The media object here takes any element with a class of .media and
 * floats an image or anything with a .media-object class to the left
 * and gives it a right margin.
 *
 * To reverse this pattern, simply use .media-object-right.
 */
.media {
  margin-bottom: 1.618em; }
  .media .media-content {
    overflow: hidden; }
    .media .media-content:last-child {
      margin-bottom: 0; }
  .media .media-object-right {
    margin-right: 0; }

/* ==========================================================================
    JOOMLA MODULES
   ========================================================================== */
.module {
  /* Remove default bullets on lists inside modules */ }
  .module ul {
    list-style-type: none; }

/* ==========================================================================
    NAVIGATION
   ========================================================================== */
/* Remove list styles and throw child elements into a horizontal list. */
.nav, .breadcrumb, .pagination ul, .pagenav, .social, .actions {
  list-style: none; }
  .nav li, .breadcrumb li, .pagination ul li, .pagenav li, .social li, .actions li {
    display: inline-block; }
    .nav li a, .breadcrumb li a, .pagination ul li a, .pagenav li a, .social li a, .actions li a {
      padding: 0.20225em; }

/* Creates a vertical list of blocky, finger-friendly, links. */
.nav-stacked li,
.nav-stacked li a {
  display: block; }

/* ==========================================================================
    PAGINATION
   ========================================================================== */
/* Blog and article pagination */
.pagination {
  text-align: center; }
  .pagination ul span {
    padding: 0.4045em; }

/* Article pagination */
.pagenav li {
  width: 50%; }
.pagenav .previous {
  margin-right: -.25em; }
.pagenav .next {
  float: right;
  text-align: right; }

/* ==========================================================================
    ROWS
   ========================================================================== */
/* Gives the content sections some breathing space */
[class*="-row"] {
  -webkit-transition: padding 0.3s ease;
  -moz-transition: padding 0.3s ease;
  -ms-transition: padding 0.3s ease;
  -o-transition: padding 0.3s ease;
  transition: padding 0.3s ease;
  padding: 0 1.618em; }
  [class*="-row"] .content {
    padding: 1.618em 0 0; }
    [class*="-row"] header.content {
    padding: 0 0 1.618em; }
    @media only screen and (min-width: 90em) {
      [class*="-row"] .content {
        padding: 2.427em 0 0.809em; }
        }
         @media only screen and (max-width: 45em) {
      [class*="-row"] header.content {
        padding: 0.809em 0 0; }
        }

.main-row {
  padding: 0;
  }
.main-row main.content {
  padding: 2em;
  min-height: 400px;
  }

.blog .items-row {padding:0;}

.items-row.cols-1 {border-bottom: 1px solid rgba(255,255,255,0.5);}

/* ==========================================================================
    WELLS
   ========================================================================== */
.well {
  display: block;
  padding: 1.618em; }

/* ==========================================================================
    CONTENT WRAPPER
   ========================================================================== */
.wrapper {
  margin: 0 auto;
  max-width: 51em; }

/*
 * These following need to override some base element styles,
 * so we'll load them last.
 */
/* Override any defaults like display: block on objects. */
/* ==========================================================================
    GRID
   ========================================================================== */
.grid-item, .logo, [role="navigation"], .footer-row .module, .social, .copyright, .above-row .module, .below-row .module {
  display: inline-block;
  margin-right: -.25em;
  width: 100%;
  vertical-align: top; }

/* ==========================================================================
    WIDTHS
   ========================================================================== */
/*
 * Sizes in human readable format. Taken from the inspirational inuit.css:
 *
 * https://github.com/csswizardry/inuit.css/blob/master/generic/_widths.scss
 *
 * Copyright 2012 Harry Roberts
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 *
 */
/* Whole */
.one-whole {
  width: 100%; }

/* Halves */
.one-half, .two-quarters, .three-sixths, .four-eighths, .five-tenths, .six-twelfths {
  width: 50%; }

/* Thirds */
.one-third, .two-sixths, .four-twelfths {
  width: 33.333%; }

.two-thirds, .four-sixths, .eight-twelfths {
  width: 66.666%; }

/* Quarters */
.one-quarter, .two-eighths, .three-twelfths {
  width: 25%; }

.three-quarters, .six-eighths, .nine-twelfths {
  width: 75%; }

/* Fifths */
.one-fifth, .two-tenths {
  width: 20%; }

.two-fifths, .four-tenths {
  width: 40%; }

.three-fifths, .six-tenths {
  width: 60%; }

.four-fifths, .eight-tenths {
  width: 80%; }

/* Sixths */
.one-sixth, .two-twelfths {
  width: 16.666%; }

.five-sixths, .ten-twelfths {
  width: 83.333%; }

/* Eighths */
.one-eighth {
  width: 12.5%; }

.three-eighths {
  width: 37.5%; }

.five-eighths {
  width: 62.5%; }

.seven-eighths {
  width: 87.5%; }

/* Tenths */
.one-tenth {
  width: 10%; }

.three-tenths {
  width: 30%; }

.seven-tenths {
  width: 70%; }

.nine-tenths {
  width: 90%; }

/* Twelfths */
.one-twelfth {
  width: 8.333%; }

.five-twelfths {
  width: 41.666%; }

.seven-twelfths {
  width: 58.333%; }

.eleven-twelfths {
  width: 91.666%; }

@media only screen and (min-width: 20em) {
  /* Whole */
  .palm-one-whole {
    width: 100%; }

  /* Halves */
  .palm-one-half, .palm-two-quarters, .palm-three-sixths, .palm-four-eighths, .palm-five-tenths, .palm-six-twelfths {
    width: 50%; }

  /* Thirds */
  .palm-one-third, .palm-two-sixths, .palm-four-twelfths {
    width: 33.333%; }

  .palm-two-thirds, .palm-four-sixths, .palm-eight-twelfths {
    width: 66.666%; }

  /* Quarters */
  .palm-one-quarter, .palm-two-eighths, .palm-three-twelfths {
    width: 25%; }

  .palm-three-quarters, .palm-six-eighths, .palm-nine-twelfths {
    width: 75%; }

  /* Fifths */
  .palm-one-fifth, .palm-two-tenths {
    width: 20%; }

  .palm-two-fifths, .palm-four-tenths {
    width: 40%; }

  .palm-three-fifths, .palm-six-tenths {
    width: 60%; }

  .palm-four-fifths, .palm-eight-tenths {
    width: 80%; }

  /* Sixths */
  .palm-one-sixth, .palm-two-twelfths {
    width: 16.666%; }

  .palm-five-sixths, .palm-ten-twelfths {
    width: 83.333%; }

  /* Eighths */
  .palm-one-eighth {
    width: 12.5%; }

  .palm-three-eighths {
    width: 37.5%; }

  .palm-five-eighths {
    width: 62.5%; }

  .palm-seven-eighths {
    width: 87.5%; }

  /* Tenths */
  .palm-one-tenth {
    width: 10%; }

  .palm-three-tenths {
    width: 30%; }

  .palm-seven-tenths {
    width: 70%; }

  .palm-nine-tenths {
    width: 90%; }

  /* Twelfths */
  .palm-one-twelfth {
    width: 8.333%; }

  .palm-five-twelfths {
    width: 41.666%; }

  .palm-seven-twelfths {
    width: 58.333%; }

  .palm-eleven-twelfths {
    width: 91.666%; } }
@media only screen and (min-width: 45em) {
  /* Whole */
  .lap-one-whole {
    width: 100%; }

  /* Halves */
  .lap-one-half, .lap-two-quarters, .lap-three-sixths, .lap-four-eighths, .lap-five-tenths, .lap-six-twelfths, .footer-row .module, .below-row .module {
    width: 50%; }

  /* Thirds */
  .lap-one-third, .lap-two-sixths, .lap-four-twelfths, .copyright, .above-row .module {
    width: 33.333%; }

  .lap-two-thirds, .lap-four-sixths, .lap-eight-twelfths, .social {
    width: 66.666%; }

  /* Quarters */
  .lap-one-quarter, .lap-two-eighths, .lap-three-twelfths {
    width: 25%; }

  .lap-three-quarters, .lap-six-eighths, .lap-nine-twelfths {
    width: 75%; }

  /* Fifths */
  .lap-one-fifth, .lap-two-tenths {
    width: 20%; }

  .lap-two-fifths, .lap-four-tenths {
    width: 40%; }

  .lap-three-fifths, .lap-six-tenths {
    width: 60%; }

  .lap-four-fifths, .lap-eight-tenths {
    width: 80%; }

  /* Sixths */
  .lap-one-sixth, .lap-two-twelfths {
    width: 16.666%; }

  .lap-five-sixths, .lap-ten-twelfths {
    width: 83.333%; }

  /* Eighths */
  .lap-one-eighth {
    width: 12.5%; }

  .lap-three-eighths {
    width: 37.5%; }

  .lap-five-eighths {
    width: 62.5%; }

  .lap-seven-eighths {
    width: 87.5%; }

  /* Tenths */
  .lap-one-tenth {
    width: 10%; }

  .lap-three-tenths {
    width: 30%; }

  .lap-seven-tenths {
    width: 70%; }

  .lap-nine-tenths {
    width: 90%; }

  /* Twelfths */
  .lap-one-twelfth {
    width: 8.333%; }

  .lap-five-twelfths {
    width: 41.666%; }

  .lap-seven-twelfths {
    width: 58.333%; }

  .lap-eleven-twelfths {
    width: 91.666%; }
    
 h1,
.h1 {
  font-size: 2.3em;
  line-height: 1.07867;
  margin-top: 0;
  margin-bottom: 0.53933em; }

h2,
.h2 {
  font-size: 1.8em;
  line-height: 1.43822;
  margin-top: 1.43822em;
  margin-bottom: 0.71911em; }
  
h1 > h2 {margin-top: 0;}

h3,
.h3 {
  font-size: 1.5em;
  line-height: 1.4em;
  margin: 1.07867em 0 0.53933em; }

h4,
.h4 {
  font-size: 1.3125em;
  line-height: 1.4em;
  margin: 1.23276em 0 0.11638em; }

h5,
.h5 {
  font-size: 1.125em;
  line-height: 1.43822;
  margin-top: 0;
  margin-bottom: 1.43822em; }

h6,
.h6 {
  font-size: 1em;
  line-height: 1.618;
  margin-top: 0;
  margin-bottom: 1.618em; }
  
.logo
  { font-size: 3em; } 
}
    
@media only screen and (min-width: 62em) {
  /* Whole */
  .portable-one-whole {
    width: 100%; }

  /* Halves */
  .portable-one-half, .portable-two-quarters, .portable-three-sixths, .portable-four-eighths, .portable-five-tenths, .portable-six-twelfths {
    width: 50%; }

  /* Thirds */
  .portable-one-third, .portable-two-sixths, .portable-four-twelfths, .below-row .module {
    width: 33.333%; }

  .portable-two-thirds, .portable-four-sixths, .portable-eight-twelfths {
    width: 66.666%; }

  /* Quarters */
  .portable-one-quarter, .portable-two-eighths, .portable-three-twelfths {
    width: 25%; }

  .portable-three-quarters, .portable-six-eighths, .portable-nine-twelfths {
    width: 75%; }

  /* Fifths */
  .portable-one-fifth, .portable-two-tenths {
    width: 20%; }

  .portable-two-fifths, .portable-four-tenths {
    width: 40%; }

  .portable-three-fifths, .portable-six-tenths {
    width: 60%; }

  .portable-four-fifths, .portable-eight-tenths {
    width: 80%; }

  /* Sixths */
  .portable-one-sixth, .portable-two-twelfths {
    width: 16.666%; }

  .portable-five-sixths, .portable-ten-twelfths {
    width: 83.333%; }

  /* Eighths */
  .portable-one-eighth {
    width: 12.5%; }

  .portable-three-eighths {
    width: 37.5%; }

  .portable-five-eighths {
    width: 62.5%; }

  .portable-seven-eighths {
    width: 87.5%; }

  /* Tenths */
  .portable-one-tenth {
    width: 10%; }

  .portable-three-tenths {
    width: 30%; }

  .portable-seven-tenths {
    width: 70%; }

  .portable-nine-tenths {
    width: 90%; }

  /* Twelfths */
  .portable-one-twelfth {
    width: 8.333%; }

  .portable-five-twelfths {
    width: 41.666%; }

  .portable-seven-twelfths {
    width: 58.333%; }

  .portable-eleven-twelfths {
    width: 91.666%; } 
 }
}
@media only screen and (min-width: 90em) {
  /* Whole */
  .desk-one-whole {
    width: 100%; }

  /* Halves */
  .desk-one-half, .desk-two-quarters, .desk-three-sixths, .desk-four-eighths, .desk-five-tenths, .desk-six-twelfths {
    width: 50%; }

  /* Thirds */
  .desk-one-third, .desk-two-sixths, .desk-four-twelfths {
    width: 33.333%; }

  .desk-two-thirds, .desk-four-sixths, .desk-eight-twelfths {
    width: 66.666%; }

  /* Quarters */
  .desk-one-quarter, .desk-two-eighths, .desk-three-twelfths {
    width: 25%; }

  .desk-three-quarters, .desk-six-eighths, .desk-nine-twelfths {
    width: 75%; }

  /* Fifths */
  .desk-one-fifth, .desk-two-tenths {
    width: 20%; }

  .desk-two-fifths, .desk-four-tenths {
    width: 40%; }

  .desk-three-fifths, .desk-six-tenths {
    width: 60%; }

  .desk-four-fifths, .desk-eight-tenths {
    width: 80%; }

  /* Sixths */
  .desk-one-sixth, .desk-two-twelfths {
    width: 16.666%; }

  .desk-five-sixths, .desk-ten-twelfths {
    width: 83.333%; }

  /* Eighths */
  .desk-one-eighth {
    width: 12.5%; }

  .desk-three-eighths {
    width: 37.5%; }

  .desk-five-eighths {
    width: 62.5%; }

  .desk-seven-eighths {
    width: 87.5%; }

  /* Tenths */
  .desk-one-tenth {
    width: 10%; }

  .desk-three-tenths {
    width: 30%; }

  .desk-seven-tenths {
    width: 70%; }

  .desk-nine-tenths {
    width: 90%; }

  /* Twelfths */
  .desk-one-twelfth {
    width: 8.333%; }

  .desk-five-twelfths {
    width: 41.666%; }

  .desk-seven-twelfths {
    width: 58.333%; }

  .desk-eleven-twelfths {
    width: 91.666%; } }
@media only screen and (min-width: 120em) {
  /* Whole */
  .deskwide-one-whole {
    width: 100%; }

  /* Halves */
  .deskwide-one-half, .deskwide-two-quarters, .deskwide-three-sixths, .deskwide-four-eighths, .deskwide-five-tenths, .deskwide-six-twelfths {
    width: 50%; }

  /* Thirds */
  .deskwide-one-third, .deskwide-two-sixths, .deskwide-four-twelfths {
    width: 33.333%; }

  .deskwide-two-thirds, .deskwide-four-sixths, .deskwide-eight-twelfths {
    width: 66.666%; }

  /* Quarters */
  .deskwide-one-quarter, .deskwide-two-eighths, .deskwide-three-twelfths {
    width: 25%; }

  .deskwide-three-quarters, .deskwide-six-eighths, .deskwide-nine-twelfths {
    width: 75%; }

  /* Fifths */
  .deskwide-one-fifth, .deskwide-two-tenths {
    width: 20%; }

  .deskwide-two-fifths, .deskwide-four-tenths {
    width: 40%; }

  .deskwide-three-fifths, .deskwide-six-tenths {
    width: 60%; }

  .deskwide-four-fifths, .deskwide-eight-tenths {
    width: 80%; }

  /* Sixths */
  .deskwide-one-sixth, .deskwide-two-twelfths {
    width: 16.666%; }

  .deskwide-five-sixths, .deskwide-ten-twelfths {
    width: 83.333%; }

  /* Eighths */
  .deskwide-one-eighth {
    width: 12.5%; }

  .deskwide-three-eighths {
    width: 37.5%; }

  .deskwide-five-eighths {
    width: 62.5%; }

  .deskwide-seven-eighths {
    width: 87.5%; }

  /* Tenths */
  .deskwide-one-tenth {
    width: 10%; }

  .deskwide-three-tenths {
    width: 30%; }

  .deskwide-seven-tenths {
    width: 70%; }

  .deskwide-nine-tenths {
    width: 90%; }

  /* Twelfths */
  .deskwide-one-twelfth {
    width: 8.333%; }

  .deskwide-five-twelfths {
    width: 41.666%; }

  .deskwide-seven-twelfths {
    width: 58.333%; }

  .deskwide-eleven-twelfths {
    width: 91.666%; } }
/* Next up, the template UI! */
/* ==========================================================================
	Package:	Oneweb template UI
	Version: 	1.0
	Created: 	April 2013
   ========================================================================== */
/* ==========================================================================
   	LINKS
   ========================================================================== */
/* Back to top link. */
a.to-top {
  background: #cd6e57;
  color: #fff; }

/* ==========================================================================
    TYPOGRAPHY
   ========================================================================== */
/* BLOCK QUOTES */
/* Borders are nice, sometimes. */
blockquote {
  border-left: 3px solid #d9907e;
  font-style: italic; }

cite {
  font-style: normal; }

/* EMPHATIC ELEMENTS */
/* We reset the root font size to 300, so better wind down boldness. */
b,
strong {
  font-weight: 400; color: #5f3328; }


/* ==========================================================================
    UI BUTTONS
   ========================================================================== */
/*
 * Let's add some template-specific style to these babies!
 */
.btn, .banner-row .download-link, .banner-row .respository-link {
  font-weight: 400; }

*/
/* ==========================================================================
    ROWS
   ========================================================================== */
/* Make some adjustments for special rows */
.header-row .content,
.breadcrumb-row .content,
.credit-row .content {
  padding: 1.618em 0; }

/* ==========================================================================
    HEADER
   ========================================================================== */
.header-row {
  text-align: center;
  padding-top: 3em; }
  @media only screen and (min-width: 45em) {
    .header-row {
      text-align: left; } }

/* ==========================================================================
    LOGO
   ========================================================================== */
@media only screen and (min-width: 45em) {
.logo
{
	margin-bottom: 0;
	vertical-align: middle;
	background-position: left center;
	padding-left: 140px;
	font-weight: 400;
	height: 180px;
	padding-top: 0;
	background-size: 180px;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}  
.kalligraphie
{
	background-image: url(../images/kalligraphie.png);
	float: right;
	width: 90px;
	height: 180px;
	background-size: 47px;
	background-position: left top;
	background-repeat: no-repeat;
}

  .header-row {
  padding-top: 6em;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease; }
  }

/* ==========================================================================
    HEADER NAV
   ========================================================================== */
/* MAIN NAVIGATION */
[role="navigation"] {
  font-weight: 400;
  position:fixed;
  background-color: #f8f5ea; }
[role="navigation"] ul {
  margin-bottom: 0; }
[role="navigation"] ul > li {
  margin: 0 0.20225em; }
[role="navigation"] ul > li a {
  display: block;
  padding: 0.4045em; }
  
@media only screen and (min-width: 45em) {
[role="navigation"] {
  text-align: center;
  vertical-align: middle; }
}
.navi.scrolling {box-shadow: 0 0 12px #8c3e00;
transition: 0.3s box-shadow linear;}

/* ==========================================================================
    BANNER
   ========================================================================== */
.banner-row {
  background: url(../images/tundra.jpg) center center;
  background-size: cover;
  /* The download button */
  /* The GitHub button */ }
  .banner-row h1,
  .banner-row h2 {
    color: #fff; }
  .banner-row .content {
    -webkit-transition: padding 0.3s ease;
    -moz-transition: padding 0.3s ease;
    -ms-transition: padding 0.3s ease;
    -o-transition: padding 0.3s ease;
    transition: padding 0.3s ease; }
    @media only screen and (min-width: 45em) {
      .banner-row .content {
        padding: 2.427em 0 0.809em; } }
    @media only screen and (min-width: 90em) {
      .banner-row .content {
        padding: 3.236em 0 1.618em; } }

/* ==========================================================================
    FOOTER
   ========================================================================== */
.footer-row {
  background: #cd6e57;
  position: relative;
  bottom: 0px;
  width: 100%;
  text-align: center;
  /* Offset the content container as we're padding the grid items */
  /* Make each module a grid item */ }
  
.footer-row .content {
   padding: 5px 1px 1px;
   margin-button: 0 !important; }

[role="contentinfo"] a {
  color: #fff;
  font-weight: 300;}
  
.footer-menu ul {
  text-align: center; }
  
  .footer-menu li {
  padding: 0 1em;
  font-size: 0.9em;}

/* ==========================================================================
    ARTICLE ACTIONS
   ========================================================================== */
/* The print / mail /edit links */
.actions {
  font-size: 0.83em;
  line-height: 1.9494;
  margin-top: 0;
  margin-bottom: 1.9494em;
  margin-top: 0;
  text-align: right; }

/* ==========================================================================
    ARTICLE INFO
   ========================================================================== */
/* Article category, author, publish date, hits, etc. */
.article-meta {
  font-size: 0.83em;
  line-height: 1.9494;
  margin-top: 0;
  margin-bottom: 1.9494em; }

/* ==========================================================================
    ABOVE-ROW MODULES
   ========================================================================== */
/* Make each module a grid item */
.above-row {
  /* Offset the content container as we're padding the grid items */
  /* Make each module a grid item */ }
  @media only screen and (min-width: 45em) {
    .above-row .content {
      margin-left: -1.618em; } }
  .above-row .module {
    /* And give it a width on larger screens */ }
    @media only screen and (min-width: 45em) {
      .above-row .module {
        padding-left: 1.618em; } }

/* ==========================================================================
    BELOW-ROW MODULES
   ========================================================================== */
/* Make each module a grid item */
.below-row {
  background: #ffeec5;
  border-top: 1px solid #eebb02;
  /* Offset the content container as we're padding the grid items */
  /* Make each module a grid item */ }
  @media only screen and (min-width: 45em) {
    .below-row .content {
      margin-left: -1.618em; } }
  .below-row .module {
    /* And give it a width on larger screens */ }
    @media only screen and (min-width: 45em) {
      .below-row .module {
        padding-left: 1.618em; } }

.copyright {display: none;}

.dj-megamenu-select {width: 90% !important;display: Block; margin: 10px auto 0;}


.info-box
{
	background-color: rgba(255,255,255,0.5);
	border-radius: 8px;
	box-shadow: 0 0 5px #ff9000;
	color: #8b0007;
	line-height: 1.5em;
	margin: 20px auto;
	padding: 20px 20px 5px 20px;
	display: block;
	text-decoration: none;
}

.info-box:hover
{
	background-color: rgba(255,255,255,0.7);;
	box-shadow: 0 0 2px #ff9000;
	color: #222;
}

.dj-megamenu-GongDongChe .dj-subwrap-in, .dj-megamenu-GongDongChe .dj-subcol  {width: auto !important;min-width: 150px;white-space: nowrap;}

.module-instagram {margin: 0 0 3rem 0;}

.convertforms .cf-response {color: black !important;}