/* =============================================================================
 * logo height
 * ========================================================================== */
 
#logo img {max-width: 250px; }


/* =============================================================================
 * padding body top - if you change the logo height you must also adjust the padding of the body-tag
 * ========================================================================== */
 
body {padding-top: 60px;}

/* tablet */
@media only screen and (max-width: 980px) {body {padding-top: 162px;}}

/* phone */
@media only screen and (max-width: 767px) {body {padding-top: 116px;}}


/* =============================================================================
 * background-images
 * ========================================================================== */

/* page background */
body, #container {background: #fff; margin-top:60px;}
body.dark, body.dark #container {background: #252525;}

/* page-title */
#header {background-image: url(../img/bg_title.png)}

/* extended-container - newsteaser */
#extended-container {}

/* socials background // bottom of website */
#socials-container {background-image: url(../img/bg_socials.png);}


/* =============================================================================
 * body fonts
 * ========================================================================== */
 
body {font-family: 'Cantarell', sans-serif; font-size: 15px; line-height: 19px;}



/* =============================================================================
 * header fonts + color
 * ========================================================================== */
 
h1, h2, h3, h4, h5, h6 {font-family: 'Cantarell', sans-serif; font-size: 16px; font-weight: bold; text-transform:uppercase;}
h1,h2,h3,h4,h5,h6,.color {color: #9e5e5c;} 
h1 {text-align:left; margin-bottom: 40px; }


/* =============================================================================
 * social icons - color
 * ========================================================================== */

#socials a {color: #c7342d;}


/* =============================================================================
 * buttons + submit buttons + hyperlinks - color
 * ========================================================================== */

.button, input[type="submit"], input.submit {background: #4a4b4c;}


/* =============================================================================
 * servicebox - color + border
 * ========================================================================== */

.servicebox {background: #f9f9f9;}


/* =============================================================================
 * mainmenu - paddings | layer 1 (width of the menuepoints)
 * ========================================================================== */

nav#mainmenu ul li a {padding: 0 0 0 0; font-size:16px; }
body.no_navisubline nav#mainmenu ul li a {padding: ; color:#9e5e5c}


/* =============================================================================
 * mainmenu - activ + hover | background-color
 * ========================================================================== */

#dropdown li a:hover, #dropdown li a.active, #dropdown li a.trail, #dropdown ul li a:hover, #dropdown ul li a.trail, #dropdown ul li a.active, #dropdown ul li.active a {background: #fff; color:#9e5e5c!important;}


/* =============================================================================
 * mainmenu - color | layer 1
 * ========================================================================== */

nav#mainmenu a {color: #9e5e5c;}
body.top_light nav#mainmenu a {color: #9e5e5c;}


/* =============================================================================
 * mainmenu - background-color | layer 2 + 3
 * ========================================================================== */

nav#mainmenu ul ul {background: #fff;}
nav#mainmenu ul ul li a {font-size:14px}
body.top_light nav#mainmenu ul ul {background: #fff;}


/* =============================================================================
 * mainmenu - font-size | layer 2 + 3
 * ========================================================================== */

#mainmenu ul ul {font-size: 12px;}


/* =============================================================================
 * submenu - hover | color
 * ========================================================================== */

#submenu a:hover {color: #c7342d;}


/* =============================================================================
 * slider fonts
 * ========================================================================== */

.camera_caption {font-size: 18px;}
.camera_caption h3 {font-size: 60px; margin: 0;}
.camera_wrap .button {padding: 12px 32px; font-size: 17px; margin-top: 20px;}

/* phones */
@media only screen and (max-width: 767px) {
	.camera_caption h3 {font-size: 30px;}
} 


/* =============================================================================
 * default menu icon 
 * ========================================================================== */
/* overwrite all other icon definition in the page setup */
/* info: for icon-code look into the file icons.css */
/*  uncomment the following line if you want use this option !! */

/* .mod_navigation li a:before {content:'\e912';} */