/*

	MONTEVERDI FINANZ
	=================
	URL:      www.monteverdi-finanz.de
	Client:   Andreas Heinze
	Design:   Chris Ribal (c.ribal@ribal-webentwicklung.de)
	Code:     Chris Ribal (c.ribal@ribal-webentwicklung.de)
	            
	TABLE OF CONTENTS
	=================
	1. FONTS
	2. GLOBAL
	3. PRIMARY
	4. HEADER
	5. NAVIGATION
	7. TEASER
	8. PAGE LIST
	9. FOOTER
	
*/

/*=====================================
	1. FONT DEFINITIONS
=======================================*/
@font-face { font-family: 'Minion'; src: url('../fonts/minionpro-regular-webfont.eot'); src: url('../fonts/minionpro-regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/minionpro-regular-webfont.woff') format('woff'), url('../fonts/minionpro-regular-webfont.ttf') format('truetype'), url('../fonts/minionpro-regular-webfont.svg#minion_proregular') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'Minion'; src: url('../fonts/minionpro-bold-webfont.eot'); src: url('../fonts/minionpro-bold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/minionpro-bold-webfont.woff') format('woff'), url('../fonts/minionpro-bold-webfont.ttf') format('truetype'), url('../fonts/minionpro-bold-webfont.svg#minion_probold') format('svg'); font-weight: bold; font-style: normal; }

/*=====================================
	2. GLOBAL STYLES  
=======================================*/
h1 {  }
h2 { font: bold 26px/34px Minion, "Times New Roman", Georgia, sans-serif; color: #ae1a49; margin-bottom: 1em; text-transform: uppercase; letter-spacing: 2px; }
h3 { font: normal 24px/34px Minion, "Times New Roman", Georgia, sans-serif; color: #ae1a49; margin-bottom: 1em; }
h4 { font: normal 18px/26px Minion, "Times New Roman", Georgia, sans-serif; color: #ae1a49; }
h2 small, h3 small { font: normal 0.5em/1em Arial, Helvetica, sans-serif; letter-spacing: 2px; color: #c99fac; display: block; line-height: 1.5em; text-transform: none; }
h2 a, h3 a { color: #ae1a49; text-decoration: none; }
h2 a:hover, h3 a:hover { color: #D9205B; }
a { color: #ae1a49; text-decoration: underline; }
a:hover { text-decoration: none; }
address { font-style: normal; }
address span { font-weight: bold; }
input[type=text], select, textarea { font: normal 12px/20px Arial, Helvetica, sans-serif; background: #fff; padding: 7px 5px; border: 1px solid #ddd; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; box-shadow: inset 0px 2px 3px rgba(0,0,0,0.05); }
blockquote { font: italic normal 26px/34px Minion, "Times New Roman", serif; }

.agb ol { list-style-type: none; counter-reset: item; margin: 0; padding: 0; }
.agb ol > li { display: table; counter-increment: item; margin: 20px 0; }
.agb ol > li:before { content: counters(item, ".") ". "; display: table-cell; padding-right: 0.6em; }
.agb li ol > li { margin: 0; }
.agb li ol > li:before { content: counters(item, ".") " "; }
.agb > ol > li { font-size: 16px; font-weight: bold; }
.agb > ol > li > ol { font-size: 13px; font-weight: normal; margin-top: 5px; }


/*=====================================
	3. PRIMARY STYLES  
=======================================*/
body { background: #f0f0f0 url(../images/page-bg.jpg) repeat left top; font: normal 14px/22px Arial, Helvetica, sans-serif; color: #6e5050; }
.button, .button:focus { display: inline-block; cursor: pointer; border: none; background: #ae1a49; padding: 10px 20px; font: normal 16px/20px Minion, "Times New Roman", Georgia, serif; color: #fff; color: rgba(255,255,255,0.6); text-decoration: none; }
.box.error { background: #FBE3E4; padding-bottom: 0.5em; }
ul.features { padding-left: 0; }
ul.features li { list-style: none; padding: 3px 3px 3px 30px; background: url(../images/checkmark.png) no-repeat left center; }
.box.welcome { background-image: url(../images/office-bg.jpg); background-repeat: no-repeat; background-position: right bottom; background-size: auto 100%; }

/*=====================================
	4. HEADER STYLES  
=======================================*/
.page-top { padding-top: 50px; background: #282424 url(../images/dark-pattern.jpg) repeat left top; }
header {  height: 595px; margin-bottom: 130px; background: url(../images/header-bottom.png) no-repeat center bottom;  }
header .container { background-color: #ffffff; padding: 30px 0; box-shadow: 0 0 200px rgba(255, 255, 255, 0.2), 0px 1px 4px rgba(0,0,0,0.45); -moz-box-shadow: 0 0 200px rgba(255, 255, 255, 0.2), 0px 1px 4px rgba(0,0,0,0.45); -webkit-box-shadow: 0 0 200px rgba(255, 255, 255, 0.2), 0px 1px 4px rgba(0,0,0,0.45); }
header .logo { float: left; margin-left: 40px; }
header .teaser { margin-top: 20px; clear: both; }
header .callout { font: normal 24px/30px Minion, "Times New Roman", Georgia, sans-serif; text-align: center; color: #aaa; }
header.sub { height: 415px; }
header.sub .teaser { height: 250px; overflow: hidden; }

/*=====================================
	5. NAVIGATION STYLES  
=======================================*/
nav { position: relative; width: 690px; margin-right: 20px; height: 65px; margin-top: 70px; float: right; text-align: right; }
nav ul { list-style: none; margin: 0; padding: 0; }
nav ul li { position: relative; display: inline-block; margin-right: 20px; }
nav ul li a, nav ul li a:link, nav ul li a:focus, nav ul li a:hover { float: left;  display: inline-block; height: 65px; font: bold 20px/22px Minion, "Times New Roman", Georia, serif; text-align: center; text-transform: uppercase; color: #afafaf; text-decoration: none; }
nav ul li a span { display: block; font: normal 11px/11px Arial, Helvetica, sans-serif; text-transform: none; color: #afafaf; }
nav ul li.active a { color: #ae1a49; }
nav ul li.active a span { color: #818181; }
nav ul.sub { display: none; position: absolute; top: 65px; left: 50%; padding: 10px; width: 180px; margin-left: -100px; background: #ae1a49; background: rgba(174,26,73,0.9); box-shadow: 0px 2px 3px rgba(0,0,0,0.6); -moz-box-shadow: 0px 2px 3px rgba(0,0,0,0.6); -webkit-box-shadow: 0px 2px 3px rgba(0,0,0,0.6); z-index: 99; }
nav ul.sub li { display: block; margin: 0; }
nav ul.sub li a { display: block; padding: 7px 5px; width: 170px; height: auto; text-transform: none; text-align: left; font: normal 14px/20px Arial, Helvetica, sans-serif; color: #fff; color: rgba(255,255,255,0.6); }
nav .indicator { position: absolute; display: none; bottom: 0; margin-left: -7px; display: inline-block; height: 0px; width: 0px; border-bottom: 7px solid #ae1a49; border-left: 7px solid transparent; border-right: 7px solid transparent; opacity: 0.9; }

/*=====================================
	6. TEASER STYLES  
=======================================*/
.teaser { position: relative; }
.teaser .slides_container { width: 950px; height: 430px; overflow: hidden; }
.teaser .slides_container .slide { position: relative; width: 950px; height: 430px; display: block; }
.teaser .caption { position: absolute; display: none; text-align: center; top: 20px;  z-index: 10; }
.teaser .caption h2 { font: normal 30px/30px Minion, "Times New Roman", Georia, serif; opacity: 0.75; margin-bottom: 20px; text-transform: none; letter-spacing: 0; }
.teaser .caption h3 { text-transform: uppercase; font: normal 26px/30px Minion, "Times New Roman", Georia, serif; opacity: 0.75; margin-bottom: 15px; }
.teaser .caption span { background: #ae1a49; padding: 5px 10px; color: #fff; }
.teaser .caption span.black { background: #000; }
.teaser .caption .button { display: inline-block; font: normal 16px/26px Minion, "Times New Roman", Georia, sans-serif; background: #ae1a49; color: #fff; padding: 5px 10px; }
.teaser .prev, .teaser .next { display: none; position: absolute; width: 69px; height: 70px; top: 150px; cursor: pointer; z-index: 99; }
.teaser .prev { background: url(../images/teaser-prev.png) no-repeat left top; left: 40px; }
.teaser .next { background: url(../images/teaser-next.png) no-repeat left top; right: 40px; }
.teaser .prev:hover, .teaser .next:hover { background-position: left -70px; }
.teaser .prev:active, .teaser .next:active { background-position: left bottom; }
.teaser .pagination { position: absolute; list-style: none; margin: 0; padding: 0; bottom: 60px; width: 100%; text-align: center; z-index: 99; }
.teaser .pagination li { display: inline-block; }
.teaser .pagination li a { display: inline-block; text-indent: -99999px; width: 19px; height: 19px; background: url(../images/teaser-pagination.png) no-repeat left top; }
.teaser .pagination li.current a, .teaser .pagination li:hover a { background-position: left bottom; }
.teaser .mask { position: absolute; bottom: 0; left: 0; width: 950px; height: 40px; background: url(../images/teaser-mask.png) no-repeat left top; z-index: 99; }
header.sub .teaser h1 { text-transform: uppercase; text-align: center; position: absolute; background: #ae1a49; top: 40px; right: 80px; font: normal 40px/40px Minion, "Times New Roman", Georia, serif; opacity: 0.75; padding: 5px 10px; color: #fff; }
header.sub .teaser h1 span { font-size: 20px; text-transform: none; line-height: 24px; display: block; max-width: 500px; margin: 5px auto 0; }

/*=====================================
	7. PAGE LIST STYLES  
=======================================*/
.pages-list .box { position: relative; }
.pages-list .box .image { aspect-ratio: 310/155; position: relative; margin: -30px -40px 30px; }
.pages-list .box .image  a { display: block; width: 100%; height: 100%; }
.pages-list .box .image img { width: 100%; height: 100%; }
.pages-list .box h3 { display: inline-block; position: absolute; bottom: 0; left: 0; padding: 8px 10px 8px 40px; margin: 0; background: #ae1a49; background: rgba(174,26,73,0.8); color: #fff; font: bold 18px/18px Minion, "Times New Roman", Georgia, serif; text-transform: uppercase; letter-spacing: 2px; }

/*=====================================
	8. FOOTER  
=======================================*/
.page-bottom { margin-top: 20px; background: url(../images/dark-pattern.jpg) repeat left top; }
footer { background: url(../images/footer-top.png) no-repeat center top; padding: 100px 0 50px; color: #818181; font: normal 12px/18px Arial, Helvetica, sans-serif; }
footer h3 { color: #aaa; text-transform: uppercase; font-size: 20px; border-bottom: 2px dotted #414141; }
footer p { margin-bottom: 0.75em; }
footer a { color: #818181; }
footer a:hover { color: #bcbcbc; }