#presentations {width:100%; max-width:768px; margin:0 auto 20px auto; background:#3e3e3e; padding:10px 0 0 0; position:relative; z-index:10;}
#presentations .content-inner {width:95%; max-width:671px; margin:-10px auto 0 auto; text-align:center;}
#presentations .content-inner.plain {margin:0 auto; text-align:left;}
#presentations .content-inner h1 {float:left; color:#8db089;}
#presentations .content-inner p {padding:5px 0; margin:0;}
#presentations .content-inner a {color:#8db089;}
#presentations .content-inner a:hover {color:#d1d1d1;}

#presentations .content-outer {width:100%; text-align:left; position:relative; border-bottom:2px solid #8db089;}
#presentations .content-outer:before {content:""; display:block; width:6%; height:22px; background:#8db089; position:absolute; right:0; bottom:0;}
#presentations .content-outer.mediumgrey {background:#5d5d5d;}
#presentations .content-outer .content-inner {margin:0 auto;}

#presentations .content-inner #topmatrix {clear:left; margin-top:20px;}
#presentations .content-inner #topmatrix ul {padding:0; margin:0; list-style:none;}
#presentations .content-inner #topmatrix ul li {width:20%; float:left; text-align:center;}
#presentations .content-inner #topmatrix ul li a {display:block; font:400 13px/25px 'Lato', arial, sans-serif; text-decoration:none; border-right:1px solid #3e3e3e; border-bottom:1px solid #3e3e3e;}
#presentations .content-inner #topmatrix ul li span {display:block; font:400 13px/25px 'Lato', arial, sans-serif; border-right:1px solid #3e3e3e; border-bottom:1px solid #3e3e3e;}
#presentations .content-inner #topmatrix ul li a:hover {color:#fff; background:#8db089;}
#presentations .content-inner #topmatrix ul li .lightgrey {color:#3e3e3e; background:#a8a8a8;}
#presentations .content-inner #topmatrix ul li .mediumgrey {color:#e6e6e6; background:#5d5d5d;}
#presentations .content-inner #topmatrix ul li .darkgrey {color:#e6e6e6; background:#3e3e3e;}
#presentations .content-inner #traveloguesdarkgreen {clear:left; width:100%; width:calc(100% - 1px); height:25px; background:#8db089;}

#presentations .content-inner .travelogues {padding:20px 0; text-align:left;}

#presentations .content-inner .traveloguesleft {width:40%; float:left;}
#presentations .content-inner .traveloguesright {width:55%; float:right;}
#presentations .content-inner .traveloguesright p {text-align:right; padding-bottom:50px; font-size:14px;}

#presentations .content-inner .leftpic {width:25%; float:left;}
#presentations .content-inner .leftpic img {display:block; width:90%; max-width:127px; border:1px solid #bbb7b7; margin-top:24px;}

#presentations .content-inner .textright {float:right; width:72%;}
#presentations .content-inner .travelogues h3 {font:700 15px/20px 'Lato', arial, sans-serif; color:#8db089; padding:0 0 15px 0;}

#travelogues img.to-top {position:fixed; left:50%; bottom:25px; cursor:pointer; z-index:1000; margin-left:-500px;}
#travelogues img.mobile-to-top {display:none;}

#presentations .content-inner .iframecontainer {width:100%; height:0; padding-bottom:75%; position:relative; z-index:10; margin-top:5px;}
#presentations .content-inner .iframecontainer.pad1 {margin-top:55px;}
#presentations .content-inner .iframecontainer.pad2 {margin-top:30px;}
#presentations .content-inner .iframecontainer iframe {width:100%; height:100%; position:absolute; left:0; top:0; z-index:1;}

.narrow {display:none;}
.fb-page {margin-top:15px;}


@media only screen and (max-width:600px) {
html, body {background:#3e3e3e;}
#presentations .content-inner #topmatrix ul li {width:25%;}
#presentations .content-inner .traveloguesleft {width:100%; float:none;}
#presentations .content-inner .traveloguesright {width:100%; max-width:420px; margin:30px auto 0 auto; float:none;}
#presentations .content-inner .iframecontainer.pad1 {margin-top:20px;}
#presentations .content-inner .iframecontainer.pad2 {margin-top:20px;}
#presentations .content-inner .traveloguesright p {padding-bottom:20px;}
.wide {display:none;}
.narrow {display:inline;}
}
@media only screen and (max-width:500px) {
html, body {background:#3e3e3e;}
#presentations .content-inner #topmatrix ul li {width:50%;}
#presentations .content-inner #topmatrix ul li.blank {display:none;}
#presentations .content-inner #topmatrix ul li .darkgrey {color:#e6e6e6; background:#5d5d5d;}

#presentations img.to-top {display:none;}
#presentations .content-inner .leftpic {width:100%; float:none;}
#presentations .content-inner .leftpic h2 {padding-bottom:10px;}
#presentations .content-inner .leftpic img {margin: 0 0 10px; float:left;}
#presentations .content-inner .textright {clear:left; float:none; width:100%;}
}
@media only screen and (max-width:1200px) {
#travelogues img.to-top {display:none;}
#travelogues img.mobile-to-top {display:block; cursor:pointer; z-index:1000;}
}
@media only screen and (max-height:620px) {
#travelogues img.to-top {display:none;}
#travelogues img.mobile-to-top {display:block; cursor:pointer; z-index:1000;}
}
