@charset "UTF-8";
/* -------- color guide ----------
#03a30c - AT-Grün - #af143b - weinrot - #3c6b92 : main blue
#6acce2 : light blue
#2c566a : teal accent
#193742 : dark blue
#ecd9ca - sand beige - #e1d8b9 : sand accent
#cb7d20 : orange accent
#51341a : brown
#995522 : dark orange (used for links or high contrast accents)
#cb202a : red accent (this color does not encode well, use only for small accents)
#896287 : purple
*/
/* to jump to a specific section search for the unique character pair at the front of each TOC section
<<> */
/* ----- Style sheet TOC ----------------
^1 Global constants
^2 Global classes
^3 Home page layout
^4 Base Layout styles
^5 Region detail styles
^5a Header
^5b Navigation
^5c Main Content
^5d data tables
^5e spotlight region
^5f forms
^5g Secondary Content
^5h Footer
*/
/* -------- import font rules ---------- */
@import url(fonts.css);
/* ^1 --------------------------- global constants -------------------------*/
/*limited reset*/
html, body, div, section, article, aside, header, hgroup, footer, nav, h1, h2, h3, h4, h5, h6, p, blockquote, address, time, span, em, strong, img, ol, ul, li, figure, canvas, video {
margin: 0;
padding: 0;
border: 0;
}
a:link, a:visited {
color: #952;
text-decoration: none;
}
a:hover, a:active {
color: #cb7d20;
border-bottom: 1px dashed #cb7d20;
}
p + h1 {
margin-top: 1em;
padding-top: 1em;
border-top: 2px solid #999;
}
p {
font-size: 1em;
line-height: 2;
margin: 0 0 1em;
}
/*html5 display rule*/
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, video {
display: block;
}
html, body {
margin: 0; padding: 0;}
body {
text-align:center;
font-family: Verdana, Geneva, sans-serif;
/* font:100% DroidSerif, Georgia, "Times New Roman", Times, serif;*/
background: #03a30c;
background: -moz-linear-gradient(top, #03a30c 15%, #ece9ca 90%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(15%,#03a30c), color-stop(90%,#ece9ca));
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#03a30c', endColorstr='#ece9ca',GradientType=0 );
margin:0;
}
/* ^2 ------ global classes -------- */
.floatRight {
float: right;
}
.floatLeft {
float: left;
}
.clearRight {
clear: right;
}
.clearLeft {
clear: left;
}
.clearBoth {
clear: both;
}
span.accent {
display: block;
text-align: right;
}
#mainContent img.articleImage {
display: block;
margin: 1em 0;
}
.callOut {
background: #ece9ca;
padding: 25px;
margin-bottom: 25px;
-webkit-border-top-left-radius: 0px;
-webkit-border-top-right-radius: 0px;
-webkit-border-bottom-right-radius: 20px;
-webkit-border-bottom-left-radius: 0px;
-moz-border-radius-topleft: 0px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomright: 20px;
-moz-border-radius-bottomleft: 0px;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
border-bottom-right-radius: 20px;
border-bottom-left-radius: 0px;
width: 385px;
}
/* ^3 ------------- home page specfic layout styles ----------- */
#home #wrapper {
background: #91CD80 url(../_images/home_page_back.jpg) no-repeat 0 100px;
}
#attentionLine {
height: 328px;
clear: both;
border-top: 1px solid #757575;
}
#attentionLine h1{
font: normal 2.8em DejaVuSansCond, Arial, sans-serif;
color: #fff;
text-shadow: 1px 0px 0px #000;
filter: dropshadow(color=#000000, offx=1, offy=0);
margin: 70px 0 0 607px;
letter-spacing:1px;
}
#attentionLine a:link, #attentionLine a:visited{
border: none;
width: 285px;
height: 55px;
background: url(../_images/tour_badge.png) no-repeat;
display:block;
margin: 70px 0 0 783px;
}
#attentionLine a:hover, #attentionLine a:active{
background-position: left bottom;
}
#attentionLine h2{
text-indent:-1000em;
}
#home #contentWrapper{
margin: 0 25px;
padding: 25px;
background: #fff;
background: rgba(255,255,255, 0.9);
float: left;
width: 1080px;
}
#home #mainContent {
float: right;
width: 700px;
padding-right: 0;
margin-right: 0;
}
#home #secondaryContent {
float: left;
width: 300px;
margin-top: 0;
background: #ECE9CA;
}
#home #mainContent h1, #home #secondaryContent h1 {
margin: 1em 0 .5em;
padding-top: 2em;
border-top: 2px solid #999;
}
#home #mainContent h1:first-child, #home #secondaryContent h1:first-child {
border: none;
padding-top: 0;
margin: 0 0 .25em;
}
#home #mainContent p + h1 {
margin-top: 1em;
padding-top: 1em;
border-top: 2px solid #999;
}
#home #mainContent p {
font-size: 1em;
line-height: 2;
margin: 1em 0;
}
#home #mainContent p.spotlight{
padding-right: 200px;
background: url(../_images/cycle_logo.png) no-repeat top right;
}
#home video {
margin: 1em 0;
}
#home p.videoText {
width: 525px;
}
/* ^4 --------------------- base layout styles ------------------- */
#wrapper {
position: relative;
padding: 0;
width: 1180px;
margin: 25px auto 0;
background: #fff;
text-align: left;
z-index: 1; /*fix for IE menu issues*/
}
#mainHeader {
position: relative;
float: left;
z-index: 2; /*fix for IE menu issues*/
}
#mainContent {
float: right;
width: 740px;
margin-right: 25px;
overflow: hidden;
}
#secondaryContent {
float: left;
margin-top: 150px;
width: 440px;
padding-left: 25px;
}
#pageFooter {
background: #ece9ca;
clear:both;
overflow: auto;
border-top: 1px solid #757575;
height: 750px;
width: 100%;
}
/* ^5----------------------- region-detail styles ------------------------ */
/* header ^5a*/
#mainHeader a.logo:hover {
border: none;
}
#mainHeader a.logo{
width: 192px;
height: 237px;
display: block;
background: url(../_images/grossarth_htb.gif) no-repeat;
position: absolute;
top: 150px;
left: 50px;
text-indent: -1000em;
z-index: 2000;
background-image: url(../_images/pic_t225854.jpg);
}
/* navigation ^5b*/
#siteNav h1 {
display: none;
}
#siteNav ul {
list-style: none;
padding:0;
margin:0;
float: left;
}
#siteNav > ul {
height: 100px;
background-color: #b3b3b3;
width: 938px; /*add padding-left for total width*/
padding-left: 242px; /*allow logo to clear*/
}
#siteNav ul > li {
float: left;
margin:2.5em 0 0;
padding: 0;
position: relative;
}
#siteNav li a:link, #siteNav li a:visited{
display: block;
padding: 0 25px;
border-right: 2px solid #03a30c;
text-transform: uppercase;
color: #03a30c;
text-align: center;
letter-spacing: .1em;
font-family: Verdana, Geneva, sans-serif;
font-size: 1.1em;
}
#siteNav li a.current, #siteNav li a.current:hover {
color: #fff;
cursor: default;
}
#siteNav li a:hover, #siteNav li a:active{
color: #fff;
border-bottom: none;
}
#siteNav li a:link span.tagline, #siteNav li a:visited span.tagline{
font: italic .8em DroidSerif, Georgia, "Times New Roman", Times, serif;
color: #fff;
text-transform: none;
padding-top: .5em;
letter-spacing: 0;
}
#siteNav li:last-child a{
border-right: none;
}
#siteNav li ul {
position: absolute;
top: 30px;
left: auto;
display: none;
-webkit-box-shadow: 2px 2px 5px #333;
-moz-box-shadow: 2px 2px 5px #333;
box-shadow: 2px 2px 5px #333;
-moz-border-radius-topleft: 0px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
width: 100%;
background: #fff;
}
.no-js #siteNav li:hover ul, .no-js #siteNav li ul:hover{
display: block;
}
#siteNav li ul li {
float:none;
padding: 0;
margin:0;
}
#siteNav li ul a:link, #siteNav li ul a:visited {
font:normal .7em DejaVuSansCond, Arial, sans-serif;
line-height: 2.5em;
text-align: center;
color: #03a30c;
padding: 0 1em;
display:block;
border-right: none;
letter-spacing: 0;
border-bottom: 1px solid #03a30c;
}
#siteNav li ul a:hover, #siteNav li ul a:active {
color: #fff;
background: #03a30c;
}
/* mainContent ^5c */
#mainContent #contentHeader {
margin-bottom: 6em;
}
/* keep headlines the same when crumbs are present */
#wrapper #mainContent header.hasCrumbs {
margin-bottom: 4em;
}
#mainContent #contentHeader h1 {
padding-bottom: .1em;
letter-spacing: 1px;
border-bottom: 2px solid #03a30c;
color: #03A30C;
margin-top: 1.6em;
font-family: Verdana, Geneva, sans-serif;
font-size: 1.2em;
font-style: normal;
font-weight: normal;
font-variant: normal;
}
#mainContent #contentHeader #subLinks {
display: none;
}
#mainContent h2{
font: normal 1.4em DejaVuSans, Helvetica, Arial, sans-serif;
color: #03a30c;
margin: 1em 0 0;
}
#mainContent h3{
font: bold 1.2em DejaVuSansCond, Helvetica, Arial, sans-serif;
color: #03a30c;
margin: 1em 0 0;
}
#mainContent #mainArticle {
margin-bottom: 50px;
float: left;
}
#mainContent #mainArticle pre {
font-family: Verdana, Geneva, sans-serif;
font-size: .9em;
padding: 25px;
background: #eee;
border: 1px solid #ccc;
margin-left: 25px;
-webkit-border-top-left-radius: 0px;
-webkit-border-top-right-radius: 0px;
-webkit-border-bottom-right-radius: 20px;
-webkit-border-bottom-left-radius: 0px;
-moz-border-radius-topleft: 0px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomright: 20px;
-moz-border-radius-bottomleft: 0px;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
border-bottom-right-radius: 20px;
border-bottom-left-radius: 0px;
display: block;
}
#mainContent #mainArticle .multiCol {
-moz-column-count: 2;
-moz-column-gap: 25px;
-webkit-column-count: 2;
-webkit-column-gap: 25px;
column-count: 2;
column-gap: 25px;
}
#mainContent #mainArticle h1{
font: normal 2em DejaVuSans, Arial, sans-serif;
color: #03a30c;
margin: 1.2em 0 .2em;
}
#mainContent #mainArticle #supportOptions h2{
font: normal 1.4em DejaVuSansCond, Arial, sans-serif;
color: #2c566a;
}
#mainContent #mainArticle h2 span.tourCost {
font-size: .8em;
color: #666;
font-style: italic;
margin-top: .5em;
display: block;
border-bottom: 1px solid #666;
padding-bottom: .25em;
margin-bottom: 1em;
}
#mainContent #mainArticle ul {
list-style: none;
margin: 1em 0;
padding: 0;
}
#mainContent #mainArticle ul ul{
margin: 1.4em 0 1em 0;
}
#mainContent #mainArticle li {
margin: 0 0 1.2em 2.4em;
padding: 0 0 0 24px;
background: url(../_images/star_bullet.gif) no-repeat 0 2px;
font-size: 1em;
color: #51341a;
}
#mainContent #mainArticle li li{
font-size: 100%;
margin-bottom: .7em;
}
#mainContent #mainArticle ul.faqNav{
-moz-column-count: 3;
-moz-column-gap: 16px;
-webkit-column-count: 3;
-webkit-column-gap: 16px;
column-count: 3;
column-gap: 16px;
padding: 0;
width: 650px;
}
#mainContent #mainArticle ul.faqNav li{
background: none;
padding: 0;
font-size: .8em;
}
#mainContent #mainArticle ul.faqNav a{
background: #cb7d20;
padding: 5px;
font-family: Verdana, Geneva, sans-serif;
color: #fff;
width: 100%;
display: block;
text-align: center;
}
#mainContent #mainArticle ul.faqNav a:hover{
background: #952;
border: none;
}
#mainContent div.tourDescription {
border-top: 2px solid #2c566a;
float: left;
clear: left;
padding: 10px 0;
margin-bottom: 15px;
}
#mainContent .tourDescription h2 {
font-size: 1.6em;
color: #193742;
font-weight: bold;
margin-bottom: .5em;
clear: right;
}
#mainContent .tourDescription h3.price {
font-size: 1.2em;
font-family: Verdana, Geneva, sans-serif;
color: #666;
font-weight: normal;
font-style: italic;
text-align: right;
clear: right;
margin: -1.6em 0 1em;
}
#mainContent .tourDescription p {
font-size: .9em;
line-height: 2;
}
#mainContent .tourDescription span.option {
font-weight: bold;
text-align: right;
display:block;
}
#mainContent .tourDescription img {
float: left;
padding: 10px 10px 10px 0;
}
#mainContent .tourDescription a.more {
display:block;
float: right;
width: 95px;
height: 30px;
background: url(../_images/more_bug.gif) no-repeat left top;
text-indent: -1000em;
margin: 15px 0 0 15px;
}
#mainContent a.book {
display:block;
float: right;
width: 95px;
height: 30px;
background: url(../_images/book_bug.gif) no-repeat left top;
text-indent: -1000em;
margin: 15px 0 0 15px;
}
#mainContent a.detail {
float: left;
}
#mainContent .tourDescription a.more:hover,#mainContent a.book:hover{
background-position: right top;
border: none;
}
#mainContent #mainArticle dl.faq {
margin-bottom: 1em;
padding-bottom: 1em;
border-bottom: 1px solid #999;
}
#mainContent #mainArticle dl.faq dt {
font: normal bold .9em DejaVuSansCond, Arial, sans-serif;
padding: 0;
margin: 1em 0 .5em;
color: #333;
letter-spacing: 1px;
}
#mainContent #mainArticle dl.faq dd {
font-size: .9em;
line-height: 1.4;
color: #333;
text-align: justify;
margin: 0;
padding: 0 0 0 2em;
}
#mainContent #mainArticle p a.top {
text-align: right;
padding-left: 30px;
background: url(../_images/return_top.gif) no-repeat;
line-height: 20px;
float: right;
}
#mainContent #mainArticle p a.top:hover {
border: none;
color: #333;
}
/* data tables ^5d */
/*simple tables*/
#mainContent table.simple {
width: 90%;
background: #c3cebc;
border: none;
margin: 1em 0 1em;
border: 1px solid #666;
border-collapse: collapse;
}
#mainContent table.small {
width: 60%;
border: none;
margin: 1em 0 1em;
}
#mainContent table.simple thead{
background: #555;
border-bottom: 1px solid #000;
}
#mainContent table.simple thead th{
font-size: .8em;
font-weight: normal;
text-align: left;
padding: 0 10px;
line-height: 2.6em;
color: #fff;
}
#mainContent table.simple caption {
text-transform: uppercase;
font-weight: bold;
font-size: 1.2em;
text-align: left;
font-family: Verdana, Geneva, sans-serif;
}
#mainContent table.simple caption time {
font-size: .6em;
font-style: italic;
text-align: right;
text-transform: lowercase;
position: relative;
right: 0;
top: -1.4em;
display: block;
}
#mainContent table.simple th, #mainContent table.simple td {
font-family: Verdana, Geneva, sans-serif;
font-size: .8em;
padding-left: 1em;
text-align: left;
line-height: 3;
}
#mainContent table.simple td {
border: 1px solid #666;
}
#mainContent table.small td {
border: none;
}
#mainContent table.simple tr:nth-child(odd) {
background: #ece9ca;
}
/*complex tables*/
#mainContent table.complex {
width: 95%;
margin: 1em auto 1em;
font-family: Verdana, Geneva, sans-serif;
font-size: 0.9em;
border-collapse: collapse;
border: 1px solid #333;
background: #ece9ca;
}
#mainContent table.complex caption {
text-transform: uppercase;
font-weight: bold;
font-size: 1.2em;
text-align: left;
font-family: Verdana, Geneva, sans-serif;
}
#mainContent table.complex th{
font-size: 1em;
font-weight: normal;
text-align: left;
padding: 0 10px;
line-height: 2.6em;
color: #FFF;
background: #555;
border-bottom: 1px solid #000;
}
#mainContent table.complex thead {
background: url(../_images/thead_back.gif) repeat-x left top;
height: 40px;
}
#mainContent table.complex thead th {
background: none;
color: #000;
text-align:left;
border: 1px solid #333;
}
#mainContent table.complex td {
padding: 0 10px;
border: 1px solid #333;
font-size: .8em;
}
#mainContent #trailType, #mainContent #trailPath, #mainContent #trailRating {
background: #fff;
}
/* form styling ^5f */
#mainContent #mainArticle form p {
color: #193742;
margin: 0 0 20px 20px;
}
#mainContent #mainArticle form p.subHead {
margin: 0 0 0 20px;
clear: both;
}
#mainContent #mainArticle form label.subHead {
display: block;
float: none;
margin: 0;
width: auto;
}
#mainContent form {
font: normal .9em Arial, Helvetica, sans-serif;
color: #193742;
}
#mainContent fieldset {
padding: 40px 20px 20px 20px;
margin: 0 0 2em;
background-color: #ece9ca;
width: 650px;
border: none;
position: relative;
-webkit-border-top-left-radius: 20px;
-webkit-border-top-right-radius: 0px;
-webkit-border-bottom-right-radius: 0px;
-webkit-border-bottom-left-radius: 0px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomright: 0px;
-moz-border-radius-bottomleft: 0px;
border-top-left-radius: 20px;
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
border-bottom-left-radius: 0px;
}
#mainContent fieldset legend {
padding: 0;
margin: 0;
color: #51341a;
}
#mainContent legend strong {
position: absolute;
margin-left: 20px;
margin-top: 10px;
font-size: 1.2em;
}
#mainContent input[type="text"], #mainContent input[type="email"],#mainContent input[type="password"],#mainContent input[type="tel"],#mainContent input[type="url"]{
width: 350px;
padding-right: 25px;
}
#mainContent textarea {
width: 500px;
height: 150px;
}
#mainContent form label{
width: 80px;
float: left;
clear: left;
margin-right: .50em;
}
#mainContent form label.inline {
width: auto;
float: none;
}
#mainContent #mainArticle form ol{
list-style:none;
margin: 0;
padding: 0;
}
#mainContent #mainArticle form li {
background: none;
margin: 0;
padding: 0;
}
/*
#mainContent form input[required]{
border-right: 4px solid #cb202a;
}
*/
/*contact form*/
#mainContent form#frmContact .col1 {
float: left;
padding-left: 20px;
margin-right: 20px;
width: 160px;
margin-bottom: 1em;
}
#mainContent form#frmContact .col2, #mainContent form#frmContact .col3 {
float: left;
margin-right: 20px;
width: 170px;
}
#mainContent form#frmContact div p {
margin: 0 0 .5em 0;
}
#mainContent form#frmContact div label {
font-size: .9em;
display: inline;
float: none;
}
/* secondaryContent ^5g */
#secondaryContent h1 {
font: normal 1.5em DejaVuSans, Arial, sans-serif;
font-weight: normal;
color: #03a30c;
padding-bottom: .1em;
margin-bottom: 1em;
border-bottom: 2px solid #03a30c;
}
#secondaryContent #specials h2 {
font-size: 1.2em;
font-family: Verdana, Geneva, sans-serif;
color: #193742;
margin-bottom: 0;
border-top: 2px solid #999;
padding-top: 1em;
font-weight: normal;
clear: both;
letter-spacing:1px;
}
#secondaryContent #specials h2.top {
border:none;
margin-top: 1em;
}
#secondaryContent #specials p {
font-style: italic;
text-align: right;
margin: .5em 0;
line-height: 1.6;
}
#secondaryContent #specials img {
float: left;
padding-bottom: 1em;
padding-right: 2em;
}
/* footer region ^5h */
#pageFooter section {
float: left;
width: 341px;
padding-top: 25px;
/* [disabled]height: 700px; */
}
#pageFooter section:first-child {
margin-left: 128px;
}
#pageFooter section h1{
font-family: Verdana, Geneva, sans-serif;
font-size: 1em;
letter-spacing:1px;
color: #03a30c;
text-transform: uppercase;
margin-bottom: 1em;
}
#pageFooter section h2{
font-family: Verdana, Geneva, sans-serif;
font-size: 1.5em;
letter-spacing:1px;
color: #666;
margin-bottom: 1em;
}
#pageFooter section p{
font-family: Verdana, Geneva, sans-serif;
font-size: 1em;
margin-bottom: -0.5em;
color: #666;
}
#pageFooter section ul{
list-style: none;
margin: 0;
padding:0;
line-height: 1em;
}
#pageFooter section li {
margin-bottom: 1em;
}
#pageFooter section li a:link, #pageFooter section li a:visited {
font-family: Verdana, Geneva, sans-serif;
text-transform: uppercase;
color: #666;
}
#pageFooter section li a:hover, #pageFooter section li a:active {
color: #fff;
border: none;
}
#atgmLogo {
padding: 100px;
margin: 200px;
}
#wrapper .atgmLogo {
position: absolute;
left: 25px;
top: 50px;
z-index: 3000;
}
#wrapper .gmBild {
position: absolute;
left: 300px;
top: 150px;
z-index: 1;
}
#mainContent ul li {
line-height: 1.2 em;
padding-top: 1.1em;
}
.pdficon {
padding: 0px 15px;
border-top: none;
border-right: none;
border-bottom: none;
border-left: none;
}
a .pdficon {
border: 2px solid #E8E8E8;
}
a .pdficon:hover {
border: 2px solid #FF1F1C;
}
.studytitle {
font-weight: bold;
color: #333;
}
.addresslines {
color: #666;
}
#home #wrapper #pageFooter #companyInfo .addresslines {
}
/* Keep submenus reachable without the retired JavaScript menu libraries. */
#siteNav li:focus-within > ul {
display: block;
z-index: 10;
}
#siteNav a:focus-visible {
outline: 2px solid currentColor;
outline-offset: 2px;
}
@media screen and (max-width: 480px) {
#wrapper .atgmLogo,
#wrapper .gmBild {
position: static;
display: block;
margin: 1rem auto;
}
.no-js #siteNav > ul {
width: 100%;
}
.no-js #siteNav li > a:link,
.no-js #siteNav li > a:visited {
box-sizing: border-box;
width: 100%;
height: auto;
padding: 0.6rem 0.5rem;
line-height: 1.5;
}
#home #attentionLine {
height: auto;
padding: 1rem;
}
#home #attentionLine h1 {
margin: 0;
font-size: 1.5rem;
color: #246429;
text-shadow: none;
}
body.no-js #siteNav li > ul,
body.no-js #siteNav li:hover > ul,
body.no-js #siteNav li > ul:hover {
display: block;
position: static;
width: 100%;
box-shadow: none;
border-radius: 0;
}
#siteNav li ul a:link,
#siteNav li ul a:visited {
width: auto;
height: auto;
line-height: 2.5em;
}
}