@charset "UTF-8";
/* CSS Document */

#berlin {
margin: 0;
padding: 0;
}

#berlin p {
margin: 0 0 1.5em 0
}

#berlin a {
color:#000;
text-decoration: underline;
}

#berlin a:hover {
color:#8E8E8E;
text-decoration: none;
}

#berlin h1 {
margin: 15px 0 0 0;
padding: 0;
font-size: 68px;
line-height: 78px;
color:#a40000;
}

#berlin h1 span {
font-size: 28px;
color:#000;
font-weight: normal;
display: block;
margin: 5px 0 15px 0;
padding: 0;
line-height: 24px
}

#berlin .lead {
margin: 10px 0 30px 0;
line-height: 1.6em;
font-size: 1.1em;
}

#berlin .lead2 {
margin: 70px 0 -10px 0;
line-height: 1.6em;
font-size: 14px;
font-weight: bold
}

#berlin h2 {
font-size: 32px;
margin: 50px 0 30px 0;
padding: 25px 0;
border-top: 1px  solid  #000;
border-bottom: 1px  solid  #000;
font-weight: normal;
color:#000000;
}

#berlin h2 span {
font-size: 20px;
display: block;
color: #000000;
margin: 7px 0 5px 0;
}


#berlin h3 {
font-size: 28px;
margin: 30px 0 15px 0;
color:#a40000;
line-height: 34px;
}

#berlin h4 {
font-size: 20px;
margin: 35px 0 15px 0;
color:#a40000;
line-height: 1.3em;
}


#berlin h3.obi {
font-size: 22px;
margin: 40px 0 15px 0;
line-height: 1.2em;
font-weight: bold;
padding: 15px;
color:#FFFFFF;
background: #333333;
display: block
}

#berlin table {
margin: 30px auto 30px auto;
font-size: 14px;
width: 80%
}

#berlin table caption {
font-size: 16px;
padding: 5px 0;
color:#a40000;
}

#berlin table td {
padding: 8px 10px;
font-size: 14px;
text-align: center;
border-bottom: #cccccc 1px solid;
}

#berlin table th {
padding: 8px 10px;
font-size: 14px;
text-align: center;
border-bottom: #cccccc 1px solid;
font-weight: bold;
}
#berlin table tfoot td {
font-size: 0.8em;
text-align: right;
padding: 15px 0;
border-bottom: none;
}

#berlin .info h3 span {
font-size: 18px;
line-height: 1.4em;
font-weight: normal
}

#berlin table.berlinwall {
margin: 0 auto 30px auto;
font-size: 14px;
width: 100%;
text-align: left;
border-top: #cccccc 1px solid;
}

#berlin table.berlinwall caption {
text-align: left;
}

#berlin table.berlinwall td {
text-align: left;
border-bottom: #cccccc 1px solid;
}

#berlin table.berlinwall th {
text-align: left;
border-bottom: #cccccc 1px solid;
color:#a40000;
}

#berlin .btn {
line-height: 1.6em;
font-size: 1.4em;
text-align: center;
}

#berlin .btn a {
padding: 15px 25px;
background :#a40000;
color: #FFFFFF;
display: block;
text-decoration: none;
width: 60%;
margin: 40px auto;
}

#berlin .btn a:hover {
opacity: 0.5;
filter: alpha(opacity=50); 
}


#berlin ul {
margin: 30px 0
}

#berlin ul li {
margin: 18px 0 0 27px;
list-style: none;
line-height: 1.5em;
}

#berlin ul li:before {
font-family: 'FontAwesome';
content:"\f111";
font-size:10px;
margin:-2px 0 0 -27px;
display:block;
float:left;
width:27px;
text-align:center;
}

#berlin .photo {
margin: 30px 0;
text-align: center
}

#berlin .photo img {
margin: 0 auto 7px auto;
text-align: center;
display: block
}

#berlin .smallnote {
margin:10px 0 25px 0;
padding: 0;
font-size: 12px;
color: #666666;
line-height: 16px
}

#berlin .col2-flex ul {
margin:10px 0 0 0;
padding: 0;
}

#berlin .col2-flex ul li {
padding: 0;
margin: 0 0 20px 0;
font-size: 13px
}

#berlin .col2-flex ul li:before {
display: none;
}

#berlin .col2-flex ul li strong {
margin-bottom: 5px;
display: block
}

#berlin h2.life {
background: #a40000;
color: #FFFFFF
}


#berlin h2.balloon {
margin: 50px 0 20px 0;
padding: 15px 25px 18px 20px;
color: #FFFFFF;
position: relative;
background: #a40000;
font-size: 30px;
display: block;
line-height: 1.3em;
border: none;
font-weight: bold;
font-weight: normal;
}

#berlin h2.balloon span {
color: #FFFFFF;
font-size: 1.5em;
line-height: 1.3em;
font-weight: bold;
display: inline-block;
}

#berlin h2.balloon img {
float: right;
margin: 0 0 15px 0
}

#berlin h2.balloon:after {
  border-top: 15px solid #a40000;
  border-right: 15px solid transparent;
  border-left: 15px solid transparent;
  content: '';
  margin-left: -10px;
  position: absolute;
  bottom: -12px;
  left: 10%;
}

#berlin .life h3 span {
display: block;
color: #000000;
font-size: 0.8em
}

#berlin .life h3 {
font-size: 24px;
}


#berlin .index {
margin: 60px 0 0 0
}

#berlin .index h4 {
font-size: 14px;
margin: 0;
padding: 0 5px 0 0;
display: inline-block;
background: #FFF;
}

#berlin .index ol {
margin: -10px 0 15px 0;
padding-bottom: 15px;
border-top: #a40000 1px solid;
padding-top: 30px;
}

#berlin .index ol li {
margin: 0 0 5px 0;
font-size: 12px;
padding: 0;
list-style: decimal
}

#berlin .index ol li a {
text-decoration: none
}


/* responsive */

body.white .site #berlin {
font-size: 18px;
margin: 0 0 10px 0
}

body.white .site #berlin h1 {
margin: 15px 0 0 0;
padding: 0;
font-size: 40px;
line-height: 1.3em;
color:#a40000;
}

body.white .site #berlin h1 span {
font-size: 22px;
color:#000;
font-weight: normal;
display: block;
margin: 5px 0 15px 0;
padding: 0;
line-height: 1.3em;
}


body.white .site #berlin h2 {
font-size: 32px;
margin: 50px 0 30px 0;
padding: 20px 0;
border-top: 1px  solid  #000;
border-bottom: 1px  solid  #000;
font-weight: normal;
color:#000000;
line-height: 1.2em
}

body.white .site #berlin h2 span {
font-size: 22px;
display: block;
color: #000000;
margin: 7px 0 5px 0;
}


body.white .site #berlin h3 {
font-size:22px;
margin: 50px 0 10px 0;
line-height:1.3em;
}

body.white .site #berlin .lead {
font-size: 18px;
}

body.white .site #berlin .lead2 {
font-size: 18px;
}

body.white .site .photo {
font-size: 16px;
}

body.white .site #berlin h3.obi {
font-size: 22px;
margin: 40px 0 15px 0;
line-height: 1.2em;
font-weight: bold;
padding: 15px;
color:#FFFFFF;
background: #333333;
display: block
}

body.white .site #berlin .btn {
line-height: 1.3em;
font-size: 1.2em;
text-align: center;
}

body.white .site #berlin .btn a {
padding: 15px 25px;
background :#a40000;
color: #FFFFFF;
display: block;
text-decoration: none;
width: 90%;
margin: 40px auto;
}

body.white .site #berlin .btn br {
display: none;
}

body.white .site #berlin h2.balloon {
margin: 50px 0 20px 0;
padding: 15px 25px 18px 20px;
color: #FFFFFF;
position: relative;
background: #a40000;
font-size: 24px;
display: block;
line-height: 1.3em;
border: none;
font-weight: bold;
font-weight: normal;
}

body.white .site #berlin h2.balloon span {
color: #FFFFFF;
font-size: 1.5em;
line-height: 1.3em;
font-weight: bold;
display: inline-block;
}

body.white .site #berlin .life h3 span {
display: block;
color: #000000;
font-size: 0.8em
}

body.white .site #berlin .life h3 {
font-size: 24px;
}

body.white .site #berlin .smallnote {
font-size: 14px;
line-height: 16px
}

body.white .site #berlin .col2-flex ul li {
padding: 0;
margin: 0 0 20px 0;
font-size: 18px
}


body.white .site #berlin table {
font-size: 18px;
width: 100%
}

body.white .site #berlin table caption {
font-size: 18px;
color:#a40000;
font-weight: bold;
}

body.white .site #berlin table td {
font-size: 18px;
}

body.white .site #berlin table th {
font-size: 18px;
}

body.white .site #berlin table.berlinwall {
margin: 0 auto 30px auto;
font-size: 14px;
width: 100%;
text-align: left;
border-top: #cccccc 1px solid;
}

body.white .site #berlin table.berlinwall caption {
text-align: left;
}

body.white .site #berlin table.berlinwall td {
text-align: left;
display: block;
border-bottom: #cccccc 1px solid;
padding-top: 0 
}

body.white .site #berlin table.berlinwall th {
text-align: left;
border-bottom: none;
color:#a40000;
font-size: 18px;
padding: 10px;
display: inline-block;
}
