#espnwwos-disney-baseball-page .intro-div {
    position: relative;
    width: 100%;
    height: 100%;
    margin-top: 45px;
}
#espnwwos-disney-baseball-page .openMediaEngineButton {
    position: relative;
    left: 0;
    bottom: 0;
    margin: -67px 0 20px 20px;
    display: none;
    border-radius: 10px;
    border: 3px solid #FFF;
    padding: 8px 14px;
    background: none;
    background-color: rgba(0, 0, 0, .45);
    font-size: 17px;
    line-height: 1.5em;
    font-weight: bold;
    text-align: center;
    color: #FFF;
    float: left;
    vertical-align: middle;
}
#page-logo {
    z-index: 1000;
    position: absolute;
}
#espnwwos-disney-baseball-page .openMediaEngineButton:hover {
    text-decoration: none;
    color: #1994d7;
    border-color: #1994d7;
}

/**** Modal ****/
.mediaEngineContainer .shareModal {
    width: 145px !important;
}
.modal-window {
    left: 50% !important;
}
.mediaEngineContainer .bottomHolder {
    left: 7% !important;
}
.thumbnailHolder li:only-child {
    display: none;
}
.previousButton, .nextButton, .close-window {
    z-index: 9999;
}
.close-window {
    left: 95% !important;
    top: 27px !important;
}
.modal {
    position: relative !important;
    top: -15px;
}
.modal .title {
    color: #FFF;
    background-color: #000;
    padding: 0px 15px 5px !important;
}
#modal.modal-window .mediaEngineContainer a.shareButton {
    text-indent: -5% !important;
    left: -15%;
}
.mediaEngineContainer .middleHolder {
    padding: 35px 55px 0 !important;
}
.mediaEngineContainer .videoPlayer {
    top: 35px !important;
}
.thumbnail {
    background-color: #000;
    border: 1px solid #000;
}
li.thumbnail, li.thumbnail.selected {
    width: 53px !important;
}
.mediaEngineContainer .thumbnailSlide {
    height: 65px;
}
.mediaEngineContainer .thumbnailSlider, ul.thumbnailHolder {
    width: 80% !important;
}
.mediaEngineContainer .thumbnail.selected .thumbnailImageHolder, 
.mediaEngineContainer .thumbnail.selected .thumbnailImageHolder img {
    height: 45px !important;
    width: 45px !important;
    background-color: #000;
}
div#media-engine-disneybaseball div.mediaEngineContainer div.bottomHolder 
div.thumbnailSlider div.thumbnailSliderHolder ul.thumbnailHolder 
li.thumbnail div.thumbnailImageHolder img {
    height: 43px;
}
.mediaEngineContainer .bottomHolder {
    margin: 0!important;
    left: 10% !important;
}
.mediaEngineContainer .mediaTypeFilters {
    margin-right: 20% !important;
}
/***ipad/tablet view***/
@media only screen and (max-width: 1024px) {
    .modal-window {
        left: 47%;
    }
    .close-window {
        right: -8% !important;
    }
}
/***mobile view***/
@media only screen and (max-width: 736px) {
    /* hide default play button (apple) */
    *::-webkit-media-controls-panel {
      display: none!important;
      -webkit-appearance: none;
    }
    /* Old shadow dom for play button */
    *::--webkit-media-controls-play-button {
      display: none!important;
      -webkit-appearance: none;
    }
    /* New shadow dom for play button */
    *::-webkit-media-controls-start-playback-button {
      display: none!important;
      -webkit-appearance: none;
    }
    .modal-window {
        left: 0% !important;
        top: 50% !important;
        margin-top: -27%
    }
    .intro-div {
        margin-top: 7px !important;
    }
    #espnwwos-disney-baseball-page .openMediaEngineButton {
        margin-top: -65px !important;
    }
    .close-window {
        top: 5% !important;
        left: 92% !important;
    }
    .mediaEngineContainer .slidesHolder li img {
        width: 85% !important;
    }
    .html5VideoPlayer {
        width: 86% !important
    }
    .html5VideoPlayer {
        top: -1% !important;
        left: 8% !important;
    }
    .progressBar, .thumbTouch, .html5VideoPlayer, .mediaSlider {
        left: 6% !important;
    }
    .mediaSlider {
        margin-top: -1% !important;
    }
    .nextButton {
        right: 6% !important;
    }
    .previousButton {
        left: 4% !important;
    }
    .progressBar, .thumbTouch {
        bottom: 5% !important;
        width: 86% !important;
    }
    .mediaEngineContainer .shareButton, 
    .mediaEngineContainer.touch .shareButton:hover {
        position: relative !important;
        float: none !important;
        left: 31% !important;
        z-index: 9999;
        margin-top: -4% !important;
    }
    .mediaEngineContainer .buttonBar {
        margin: -13% 0 0 35% !important;
    }
}
@media only screen and (max-width: 680px) {
    .html5VideoPlayer, .mediaSlider, .progressBar, .thumbTouch {
        left: -1.5% !important;
    }
    .html5VideoPlayer {
        width: 90% !important;
        top: 2% !important;
    }
    .close-window {
        top: 2% !important;
        right: 12% !important;
    }
    .mediaSlider {
        top: -10px;
    }
    .loadingHolder, .videoReplayButton, .slide .loading, 
    .mediaEngineContainer .largePlayPauseButton .icon, 
    .mediaEngineContainer.touch .largePlayPauseButton:hover .icon {
        left: 45% !important;
    }
    .nextButton {
        right: 11% !important
    }
    .progressBar, .thumbTouch {
        bottom: -4% !important;
    }
    .progressBar, .slidesHolder li img {
        width: 90% !important;
    }
    .mediaEngineContainer .shareButton, 
    .mediaEngineContainer.touch .shareButton:hover {
        left: 25% !important;
}
@media only screen and (max-width: 667px) {
    .html5VideoPlayer {
        top: -7% !important;
    }
    .progressBar, .thumbTouch {
        bottom: 8% !important;
    }
    .videoEndScreen {
        left: -1.5% !important;
    }
}
@media only screen and (max-width: 640px) {
    .modal-window {
        top: 76% !important;
    }
    .close-window {
        left: 81% !important;
    }
    .progressBar, .thumbTouch,
    .html5VideoPlayer {
        width: 83% !important;
        left: 0% !important;
    }
    .html5VideoPlayer {
        top: -9% !important;
    }
    .mediaSlider {
        left: -1% !important;
        top: -19px !important;
    }
    .previousButton {
        left: 2% !important;
    }
    .nextButton {
        right: 17% !important;
    }
    .progressBar, .thumbTouch {
        bottom: 14% !important;
        z-index: 9999;
    }
    .buttonBar {
        top: -160px;
        left: 33% !important;
    }
    .mediaEngineContainer .buttonBar:before, 
    .mediaEngineContainer .buttonBar:after {
        content: none !important;
    }
    .mediaEngineContainer .shareButton, 
    .mediaEngineContainer.touch .shareButton:hover {
        left: -11% !important;
        margin-top: 16% !important;
    }
    .loadingHolder, .videoReplayButton, .slide .loading, 
    .mediaEngineContainer .largePlayPauseButton .icon, 
    .mediaEngineContainer.touch .largePlayPauseButton:hover .icon {
        left: 43% !important;
    }
    .videoEndScreen {
        left: -8% !important;
    }
}
@media only screen and (max-width: 580px) {
    #espnwwos-disney-baseball-page .openMediaEngineButton {
        border: 2px solid #FFF !important;
        padding: 3px 3px !important;
        font-size: 14px !important;
    }
    #espnwwos-disney-baseball-page .openMediaEngineButton {
        margin-top: -51px !important;
    }
    .close-window {
        top: 1% !important;
        left: 52%;
    }
    .modal-window {
        height: 100% !important;
        top: 0% !important;
        margin-top: 0 !important;
        width: 100% !important;
    }
    .html5VideoPlayer, .mediaSlider {
        left: -55px !important;
    }
    .html5VideoPlayer {
        top: 30% !important;
        width: 65% !important;
    }
    .progressBar, .thumbTouch {
        left: -55px !important;
        bottom: -55px !important;
        width: 65% !important;
    }
    .thumbnailSlider, .mediaTypeFilters, .playPauseButton {
        display: none !important;
    }
    .previousButton, .nextButton {
        top: 45% !important;
        margin: 0 !important;
        z-index: 9999 !important;
    }
    .nextButton {
        left: 47%;
    }
    .slidesHolder {
        top: 35%;
    }
    .slidesHolder li img {
        width: 65% !important;
    }
    .loadingHolder, .videoReplayButton, .slide .loading, 
    .mediaEngineContainer .largePlayPauseButton .icon, 
    .mediaEngineContainer.touch .largePlayPauseButton:hover .icon {
        top: 70% !important;
        left: 17% !important;
        margin: 0 !important;
    }
}
@media only screen and (max-width: 570px) {
    .close-window {
        left: 73% !important;
    }
    .close-window {
        top: 0 !important;
    }
    .previousButton, .nextButton {
        top: -20% !important;
    }
    .nextButton {
        left: 68% !important;
    }
    .html5VideoPlayer {
        width: 85% !important;
        left: -6.5% !important;
        top: -6% !important;
    }
    .mediaSlider {
        top: -18px !important;
    }
    .slidesHolder {
        top: -10% !important;
    }
    .loadingHolder, .videoReplayButton, .slide .loading, 
    .mediaEngineContainer .largePlayPauseButton .icon, 
    .mediaEngineContainer.touch .largePlayPauseButton:hover .icon {
        top: 36% !important;
        left: 31% !important;
    }
    .progressBar, .thumbTouch {
        width: 89%  !important;
        left: -9% !important;
        bottom: 10% !important;
    }
}
@media only screen and (max-width: 414px) {
    .close-window {
        left: 50% !important;
        top: 3% !important;
    }
    .html5VideoPlayer {
        width: 60% !important;
        top: 20% !important;
    }
    .mediaSlider {
        top: 140px !important;
    }
    .mediaEngineContainer .slidesHolder li img {
        width: 65% !important;
    }
    .progressBar, .thumbTouch {
        bottom: -4% !important;
        width: 60% !important;
        left: -6.5% !important;
    }
    .previousButton, .nextButton {
        top: 50% !important;
        left: 1% !important;
    }
    .nextButton {
        left: 46% !important;
    }
    .mediaEngineContainer .shareButton, .mediaEngineContainer.touch .shareButton:hover {
        left: -37% !important;
        top: 180px !important;
    }
    .loadingHolder, .videoReplayButton, .slide .loading, 
    .mediaEngineContainer .largePlayPauseButton .icon, 
    .mediaEngineContainer.touch .largePlayPauseButton:hover .icon {
        top: 65% !important;
        left: 18% !important;
    }
    .videoEndScreen {
        margin: 90px 0 0 -170px !important;
        left: 0 !important;
    }
}
@media only screen and (max-width: 375px) {
    .close-window {
        left: 47% !important;
    }
    .buttonBar {
        display: block !important;
    }
    .html5VideoPlayer, .mediaEngineContainer .slidesHolder li img {
        width: 59% !important;
    }
    .html5VideoPlayer {
        left: -9% !important;
        top: 12% !important;
    }
    .mediaSlider {
        top: 130px !important;
    }
    .progressBar, .thumbTouch {
        bottom: 5% !important;
        left: -9% !important;
        width: 59% !important
    }
    .previousButton, .nextButton {
        top: 28% !important;
    }
    .nextButton {
        left: 41% !important;
    }
    .loadingHolder, .videoReplayButton, .slide .loading, 
    .mediaEngineContainer .largePlayPauseButton .icon, 
    .mediaEngineContainer.touch .largePlayPauseButton:hover .icon {
        left: 16% !important;
        top: 54% !important;
    }
    .videoEndScreen {
        margin: 30px 0 0 -173px !important;
    }
}
@media only screen and (max-width: 360px) {
    .close-window {
        left: 44% !important;
    }
    .previousButton, .nextButton {
        top: 30% !important;
    }
    .previousButton {
        left: 0 !important;
    }
    .nextButton {
        left: 41% !important;
    }
    .progressBar, .thumbTouch {
        width: 57% !important;
    }
    .videoEndScreen {
        left: -2% !important;
    }
    .buttonBar {
        top: 0 !important;
        left: 0 !important;
    }
    .mediaEngineContainer .shareButton, 
    .mediaEngineContainer.touch .shareButton:hover {
        left: -8% !important;
        top: -15px !important;
    }
}
@media only screen and (max-width: 320px) {
    a.openMediaEngineButton {
        left: -10px !important;
        bottom: -10px !important;
        font-size: 12px !important;
    }
    .close-window {
        top: 1% !important;
        left: 40% !important;
    }
    .html5VideoPlayer {
        width: 50.4% !important;
        left: -9% !important;
        top: 20% !important;
    }
    .mediaSlider {
        top: 133px !important;
    }
    .slidesHolder {
        width: 50% !important;
    }
    .previousButton, .nextButton {
        top: 45% !important;
    }
    .previousButton {
        left: -1% !important;
    }
    .nextButton {
        left: 36% !important;
    }
    .loadingHolder, .videoReplayButton, .slide .loading, 
    .mediaEngineContainer .largePlayPauseButton .icon, 
    .mediaEngineContainer.touch .largePlayPauseButton:hover .icon {
        left: 12% !important;
        top: 60% !important;
    }
    .progressBar, .thumbTouch {
        left: -9% !important;
        bottom: 2% !important;
        width: 51% !important;
    }
    .videoEndScreen {
        left: -5% !important;
        top: 41% !important;
    }
}