.flexslider { z-index: 1 !important; text-align: left; overflow: hidden; } .flexslider ul.slides * { -webkit-backface-visibility: hidden !important; } .flexslider ul.slides li { position: relative; -webkit-transform: translateZ(0) !important; } .flexslider ul.slides li .mainlink { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; } .flexslider ul.slides li .bannerDescription { position: absolute; right: 40px; top: 0px; padding: 20px; width: 40%; height: auto; font-size: inherit; transition-delay: 1.0s; -moz-transition-delay: 1.0s; -webkit-transition-delay: 1.0s; -o-transition-delay: 1.0s; -webkit-transform: translateZ(1000) !important; -webkit-perspective: 1000 !important; display: block; } .flexslider ul.slides li .bannerDescription img { width: auto; height: auto; } .flexslider ul.slides li .bannerDescription .bannerDescripitonBackground { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: #ffffff; opacity:0.8; filter:alpha(opacity=80); border-radius: 0px 0px 4px 4px; } .flexslider ul.slides li .bannerDescription .bannerDescriptionContent { position: relative; } .flexslider ul.slides li .bannerDescription a.button { margin-right: 2px; } .flexslider ul.slides li .bannerCaption { position: absolute; left: 0px; bottom: 10px; font-size: 2.0em; font-weight: lighter; font-family: Century Gothic, Sans-Serif; padding: 10px 20px; max-width: 50%; white-space: nowrap; overflow: hidden; -webkit-transform: translateZ(10) !important; } .flexslider ul.slides li .bannerCaption .bannerCaptionBackground { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: #ffffff; opacity:0.8; filter:alpha(opacity=80); border-radius: 0px 4px 4px 0px; } .flexslider ul.slides li .bannerCaption .bannerCaptionContent { position: relative; } .flexslider ul.slides li .bannerCaption a { text-decoration: none !important; color: inherit !important; } .flex-control-nav { right: 7% !important; bottom: 4% !important; width: auto !important; } .flex-pauseplay { position: absolute; bottom: 5%; right: 2%; z-index: 20000; } .flex-pauseplay a { text-decoration: none !important; cursor: pointer !important; } .flex-play:before { content: "\e072"; font-family: 'Glyphicons Halflings'; color: rgba(0,0,0,0.8); } .flex-pause:before { content: "\e073"; font-family: 'Glyphicons Halflings'; color: rgba(0,0,0,0.8); } .flex-control-paging li a { border: solid 2px #fff; } .flex-control-paging li a.flex-active { background-color: #003366 !important; } .flex-pauseplay a { border-radius: 20px; border: solid 2px #fff; background-color: rgba(255,255,255,0.8); padding: 6px; } .flexslider .slides img[onclick] { cursor: pointer; } @media (max-width: 991px) { .flexslider ul.slides li .bannerDescription { left: 2%; right: 2%; bottom: 0px; top: auto; width: auto; } .flexslider ul.slides li .bannerCaption { top: 0px; bottom: auto; left: 0; right: 0; height: auto; text-align: left; max-width: 100%; font-size: 1.4em } .flexslider ul.slides li .bannerCaption .bannerCaptionBackground { border-radius: 0px 0px 0px 0px } .flexslider ul.slides li .bannerDescription .bannerDescripitonBackground { border-radius: 0px 0px; } } @media (max-width: 767px) { .bannerCaption { font-size: 1.5em !important; max-width: 100% !important; bottom: 0px !important; left: 0px !important; right: 0px !important; top: auto !important; text-align: left !important; } .bannerDescription, bannerDescription * { display: none !important; } .flex-control-paging { display: none; } } @media (max-width: 550px) { .flex-control-paging, .flex-pauseplay { display: none; } .bannerCaption { font-size: 1.0em !important; white-space: normal !important; } }