/*=========================*/
/*==== Carousel Styles ====*/
/*=========================*/

/*Hide if no content*/
.VideoCarousel.NoContent{ display:none; }
.PhotoCarousel.NoContent{ display:none; }

/*Carousel Input Regions (hidden)*/
.VideoCarouselInput{ display:none; }
.PhotoCarouselInput{ display:none; }

/*News and Event Carousel Input Regions (hidden)*/
.VideoGalleryInput{ display:none; }
.PhotoGalleryInput{ display:none; }

/*Carousel Styles*/
.PhotoCarousel {  height: 43.85vw; max-height:720px; background-color: black; }
@media screen and (max-width:1024px){ .PhotoCarousel{ height: 55.3vw; } }
@media print {.PhotoCarousel{ display:none; }}
.PhotoCarousel img{ display:none; }
.CarouselMargins{ position: relative; max-width: 1600px; height: 100%; margin-left: auto; margin-right: auto; background-color: #141527; overflow: hidden; }
.CarouselPrevious{  z-index:3; position: absolute; width: 80px; height: 80px; border-radius: 80px; background-color: rgba(145, 177, 224, 0.75); top: 50%; margin-top: -40px; font-size: 0px; left: 15px; transition:padding 0.2s, margin 0.2s, background-color 0.3s;  }
@media screen and (max-width:1280px){ .SideBySideBox .CarouselPrevious{ width: 50px; height: 100%; border-radius: 0px; background-color: rgba(145, 177, 224, 0.75); top: 40px; margin-top: -40px !important; margin-left: 0px !important; font-size: 0px; left: 0px; padding: 0px !important; transition: padding 0.2s, margin 0.2s, background-color 0.3s; } }
@media screen and (max-width:770px){ .CarouselPrevious{ width: 50px; height: 100%; border-radius: 0px; background-color: rgba(145, 177, 224, 0.75); top: 40px; margin-top: -40px !important; margin-left: 0px !important; font-size: 0px; left: 0px; padding: 0px !important; transition: padding 0.2s, margin 0.2s, background-color 0.3s; } }
.PhotoCarousel.OnlyOnePhoto .CarouselPrevious{ display:none; }
.CarouselPrevious:hover{ padding:6px; margin-top:-46px; margin-left:-6px; background-color: rgba(255, 255, 255, 0.6); }
.CarouselPrevious:hover .PreviousArrow{ border-left: 2px solid black; border-top: 2px solid black; } 
.CarouselNext{ z-index:3; position: absolute; width: 80px; height: 80px; border-radius: 80px; background-color: rgba(145, 177, 224, 0.75); top: 50%; margin-top: -40px; font-size: 0px; right: 15px; transition:padding 0.2s, margin 0.2s, background-color 0.3s;}
@media screen and (max-width:1280px){ .SideBySideBox .CarouselNext{width: 50px; height: 100%; border-radius: 0px; background-color: rgba(145, 177, 224, 0.75); top: 40px; margin-top: -40px !important; margin-right: 0px !important; font-size: 0px; right: 0px; padding: 0px !important; transition: padding 0.2s, margin 0.2s, background-color 0.3s;} }
@media screen and (max-width:770px){ .CarouselNext{width: 50px; height: 100%; border-radius: 0px; background-color: rgba(145, 177, 224, 0.75); top: 40px; margin-top: -40px !important; margin-right: 0px !important; font-size: 0px; right: 0px; padding: 0px !important; transition: padding 0.2s, margin 0.2s, background-color 0.3s;} }
.PhotoCarousel.OnlyOnePhoto .CarouselNext{ display:none; }
.CarouselNext:hover{ padding:6px; margin-top:-46px; margin-right:-6px; background-color: rgba(255, 255, 255, 0.6); }
.CarouselNext:hover .NextArrow{ border-right: 2px solid black; border-bottom: 2px solid black; }
.PreviousArrow{ width: 30px; height: 30px; transform: rotate(-45deg); position: relative; top: 24px; left: 29px; border-left: 2px solid rgba(255, 255, 255, 0.5); border-top: 2px solid rgba(255, 255, 255, 0.6); display: block; transition: border 0.3s; }
@media screen and (max-width:1280px){ .SideBySideBox .PreviousArrow{ top: 50%; margin-top: -15px; left: 18px; } }
@media screen and (max-width:770px){ .PreviousArrow{ top: 50%; margin-top: -15px; left: 18px; } }
.NextArrow{ width: 30px; height: 30px; transform: rotate(-45deg); position: relative; top: 24px; left: 18px; border-right: 2px solid rgba(255, 255, 255, 0.5); border-bottom: 2px solid rgba(255, 255, 255, 0.6); display: block; transition: border 0.3s; }
@media screen and (max-width:1280px){ .SideBySideBox .NextArrow{ top: 50%; margin-top: -15px; left: 2px; } }
@media screen and (max-width:770px){ .NextArrow{ top: 50%; margin-top: -15px; left: 2px; } }
.CarouselRepeaters{ position:relative; width:100%; height:100%; animation-name:fadein; animation-duration: 1s; }
.CarouselRepeater{ position:absolute; left:0px; top:0px; width:100%; height:100%; }
.CarouselRepeater.ActiveSlide{ z-index:2; }
.CarouselRepeater .RepeaterImage { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%;  }
.CarouselRepeater .RepeaterImage .RepeaterImageContent { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background-size: contain; background-position: center; background-repeat:no-repeat; }
.CarouselRepeater .RepeaterBleed{ display:none; }
.slideInFromLeft .RepeaterImage{ animation-name:slideInFromLeft; animation-duration:1.25s; /*animation-timing-function: ease-out;*/ }
@keyframes slideInFromLeft { from{left:-100%;} to{ left:0px; } }
.slideInFromRight .RepeaterImage{ animation-name:slideInFromRight; animation-duration:1.25s; /*animation-timing-function: ease-out;*/ }
@keyframes slideInFromRight { from{left:100%;} to{ left:0px; } }
.slideOutToLeft .RepeaterImage{ z-index:1; animation-name:slideOutToLeft; animation-duration:1.25s; /*animation-timing-function: ease-out;*/ }
@keyframes slideOutToLeft { from{left:0px;} to{ left:-100%; } }
.slideOutToRight .RepeaterImage{ z-index:1; animation-name:slideOutToRight; animation-duration:1.25s; /*animation-timing-function: ease-out;*/ }
@keyframes slideOutToRight { from{ left:0px;} to{ left:100%; } }
.mobileCarousel .CarouselRepeater .RepeaterImage .RepeaterImageContent { background-position: center top !important; }
.CarouselText{ position:absolute; color: white; width:100%; top:0px; left:0px; height:100%; display:table; }
.slideInFromLeft .CarouselText{ animation-name: TextInFromLeft; animation-duration:1.25s; /*animation-timing-function: ease-out;*/ }
@keyframes TextInFromLeft { from{left:-60%; opacity:0; } to{left:0px; opacity:1; } }
.slideInFromRight .CarouselText{ animation-name: TextInFromRight; animation-duration:1.25s; /*animation-timing-function: ease-out;*/ }
@keyframes TextInFromRight { from{left:60%; opacity:0;} to{left:0%; opacity:1;} }
.slideOutToLeft .CarouselText{ z-index:1; animation-name: TextOutToLeft; animation-duration:1.25s; /*animation-timing-function: ease-out;*/ }
@keyframes TextOutToLeft { from{left:0px;} to{left:-90%; opacity:0;} }
.slideOutToRight .CarouselText{ z-index:1; animation-name: TextOutToRight; animation-duration:1.25s; /*animation-timing-function: ease-out;*/ }
@keyframes TextOutToRight { from{left:0px;} to{left:90%; opacity:0;} }
.CarouselTextMargins{ display:table-cell; position: relative; }
@media screen and (max-width:770px){ .CarouselTextMargins { margin-left: 65px; margin-right: 65px; } }
.CarouselHeader {  margin-left: 120px; margin-right: 120px; display:inline-block; padding-right:30px; padding-left: 30px; line-height:0.9em; padding-top: 15px; padding-bottom: 15px; font-size: 48px; text-transform: uppercase; color: #f0f6ff; max-width: 800px; font-weight: bold; text-align:left; text-shadow: 0px 0px 20px rgba(0, 0, 0, 0.7); background: linear-gradient(to right,rgba(0,0,0,0) 0%,rgb(51, 98, 150) 16%,rgba(58, 117, 171, 0.68) 70%,rgba(0,0,0,0) 100%); }
@media screen and (max-width:1400px){ .CarouselHeader{ font-size:3.44vw; }}
@media screen and (max-width:1200px){ .CarouselHeader{padding: 1.5vw; padding-left: 3vw; }}
@media screen and (max-width:1024px){ .CarouselHeader{ font-size: 4.8vw; padding-right:30px; padding-left: 30px; padding-top: 15px; padding-bottom: 15px; } }
@media screen and (max-width:770px){ .CarouselHeader{ margin-left:50px; margin-right:50px; padding:2vw; }}
@media screen and (max-width:680px){ .CarouselHeader{ font-size: 32px; } }
@media screen and (max-width:640px){ .CarouselHeader{ font-size: 5vw; } }
.CarouselHeader.HideText_True{ display:none; }
.CarouselTitle{ word-break:break-word; }
.CarouselSubTitle.Hidden_True { display:none; }
.CarouselSubTitle{ font-size:24px; line-height:1em; word-break:break-word; margin-top:8px; }
@media screen and (max-width:1400px){ .CarouselSubTitle{ font-size: 1.725vw; } }
@media screen and (max-width:1024px){ .CarouselSubTitle{ font-size: 2.4vw; } }
@media screen and (max-width:680px){ .CarouselSubTitle{ font-size: 16px; } }
@media screen and (max-width:460px){ .CarouselSubTitle{ font-size: 3.5vw; } }
.CarouselInfo{ background-color: rgba(0, 0, 0, 0.46); padding: 15px; max-width: 800px; } 
.readMoreLink a { color: white; text-decoration: none; font-weight: bold; margin-top: 5px; display: inline-block; }
@media screen and (max-width:480px){ .readMoreLink a { position: absolute; width: 100%; height: 100%; margin-top: 0px; font-size:0px; top:0px; left:0px; } }
.readMoreLink a:hover { text-decoration: underline;  }
.CarouselButtons{ z-index:3; position: absolute; bottom: 15px; margin-left: 120px; margin-right:120px; }
@media screen and (max-width:770px){ .CarouselButtons{ margin-left:65px; margin-right:65px; } }
.PhotoCarousel.OnlyOnePhoto .CarouselButtons{ display:none; }
.CarouselButtons a { vertical-align: top; font-size:0; display:inline-block; width: 20px; height: 10px; background-color: white; margin-right: 10px; border: 2px solid black; margin-top:10px; transition:background-color 0.5s; }
.CarouselButtons .ActiveButton { background-color: #ffc659; }
/*Photo Full Screen Button*/
.ViewPhotoFullscreen{ font-size: 0px; width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; display:none; }
.ViewPhotoFullscree.FullScreen_True{ display:block; }

/*Carousel Text Position*/
.text_topleft .CarouselTextMargins{ vertical-align:top; padding-top:15px; text-align:left; }
.text_topcenter .CarouselTextMargins { vertical-align:top; padding-top:15px; text-align:center; }
.text_topright .CarouselTextMargins { vertical-align:top; padding-top:15px;  text-align:right; }
.text_centerleft .CarouselTextMargins { vertical-align:middle; text-align:left; }
.text_center .CarouselTextMargins { vertical-align:middle; text-align:center;}
.text_centerright .CarouselTextMargins { vertical-align:middle; text-align:right; }
.text_bottomleft .CarouselTextMargins { vertical-align:bottom; padding-bottom:55px;  text-align:left; }
@media screen and (max-width:900px){ .text_bottomleft .CarouselTextMargins { padding-bottom:11vw; } }
@media screen and (max-width:550px){ .text_bottomleft .CarouselTextMargins { padding-bottom:60px; } }
.text_bottomcenter .CarouselTextMargins {  vertical-align:bottom; padding-bottom:55px; text-align:center; }
@media screen and (max-width:900px){ .text_bottomleft .CarouselTextMargins { padding-bottom:11vw; } }
@media screen and (max-width:550px){ .text_bottomleft .CarouselTextMargins { padding-bottom:60px; } }
.text_bottomright .CarouselTextMargins { vertical-align:bottom; padding-bottom:55px; text-align:right; }
@media screen and (max-width:900px){ .text_bottomright .CarouselTextMargins { padding-bottom:11vw; } }
@media screen and (max-width:550px){ .text_bottomright .CarouselTextMargins{ padding-bottom:60px; } }

/*Carousel Background Position*/
.CarouselRepeater .RepeaterImage .RepeaterImageContent.bg_topleft{ background-position:top left; }
.CarouselRepeater .RepeaterImage .RepeaterImageContent.bg_topcenter { background-position:top center;}
.CarouselRepeater .RepeaterImage .RepeaterImageContent.bg_topright { background-position:top right;}
.CarouselRepeater .RepeaterImage .RepeaterImageContent.bg_centerleft { background-position:center left;}
.CarouselRepeater .RepeaterImage .RepeaterImageContent.bg_center { background-position:center;}
.CarouselRepeater .RepeaterImage .RepeaterImageContent.bg_centerright { background-position:center right;}
.CarouselRepeater .RepeaterImage .RepeaterImageContent.bg_bottomleft { background-position:bottom left;}
.CarouselRepeater .RepeaterImage .RepeaterImageContent.bg_bottomcenter { background-position:bottom center;}
.CarouselRepeater .RepeaterImage .RepeaterImageContent.bg_bottomright { background-position:bottom right;}

.CarouselRepeater .RepeaterImageBackground{ position:absolute; top:0px; left:0px; width:100%; height:100%; background: linear-gradient(135deg, rgba(30,87,153,1) 0%,rgba(125,185,232,1) 100%); }

/*Carousel Link Styles*/
.CarouselLink{ position:absolute; top:0px; left:0px; display:block; width:100%; height:100%; font-size:0px; }
.CarouselLink.Hidden_True{ display:none; }
.CarouselLink.DisableIfPhoto_True{ display:none; }

/*Video Carousel Styles*/
.VideoRepeaters { height: 43.85vw; max-height:720px; }
@media screen and (max-width:1024px){ .VideoRepeaters{ height: 55.3vw; } }
.CarouselVideo { height: 43.85vw; max-height:720px; }
@media screen and (max-width:1024px){ .CarouselVideo{ height: 55.3vw; }  }
.CarouselVideo iframe{ width:100% !important; height:100% !important; border:0px !important;}
.CarouselVideo video{ width:100% !important; height:100% !important; border:0px !important;}
.VideoCarousel{ position:relative; overflow:hidden; background-color:black; }
@media print{ .VideoCarousel{ display:none; }}
.VideoCarousel .CarouselVideo { position: absolute; top: 0px; left: 0px; width: 100%; }
.VideoCarousel .CarouselVideo.ActiveVideo { position:relative; z-index:2; }
.VideoCarouselControls{ background-color: #21557d; height:45px; font-size:0px; position:relative; }
.VideoPrev{ width: 43px; height: 43px; position: absolute; top: 0px; left: 0px; border: 1px solid #8e8e8e; background-color: #21557d; transition:background-color 0.5s;}
.VideoPrev:hover{ background-color: #2d73a9 }
.VideoPrevArrow{ width: 18px; height: 18px; display: block; transform: rotate(45deg); border-left: 1px solid #c5c5c5; border-bottom: 1px solid #c5c5c5; margin-left: 16px; margin-top: 11px; }
.VideoNext{ width: 43px; height: 43px; position: absolute; top: 0px; right: 0px; border: 1px solid #8e8e8e; background-color: #21557d; transition:background-color 0.5s;}
.VideoNext:hover{ background-color: #2d73a9 }
.VideoNextArrow{ width: 18px; height: 18px; display: block; transform: rotate(45deg); border-right: 1px solid #c5c5c5; border-top: 1px solid #c5c5c5; margin-left: 8px; margin-top: 11px; }
.videoThumbs{ position: relative; margin-left: 45px; margin-right: 45px; height: 25px; padding: 10px; display: block; }
.videoThumbs a { height: 11px; width: 20px; margin-top: 5px; margin-right: 10px; border: 1px solid black; background-color: white; display: inline-block; font-size:0px; transition:background-color 0.5s; }
.videoThumbs a.ActiveButton { background-color:#ffc659; }
.VideoCarousel .SlideOutToTheRight{ z-index:1; animation-name:slideOutToRight; animation-duration:1.25s; }
.VideoCarousel .SlideInFromTheRight{ z-index:2; animation-name:slideInFromRight; animation-duration:1.25s; }
.VideoCarousel .SlideOutToTheLeft{ z-index:1; animation-name:slideOutToLeft; animation-duration:1.25s; }
.VideoCarousel .SlideInFromTheLeft{ z-index:2; animation-name:slideInFromLeft; animation-duration:1.25s; }
.VideoCarousel.OnlyOneVideo .VideoCarouselControls{ display:none; }
/*Mobile Video fullscreen button*/
.CarouselVideo .ViewVideoFullscreen{ position: absolute; top: 0px; left: 0px; font-size: 0px; width: 100%; height: 100%; display:none;}

/*Hidden Carousel Video w/YouTube Thumbnail*/
.carouselVideoLink{
    display:block;
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;
}

.carouselVideoLink .playButton{
    position:absolute;
    display:block;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    background-repeat:no-repeat;
    background-size:40%;
    background-position:center;
    background-image:url('/App_Themes/Jud4/images/menu/YouTubeThumbnail.png');
}

.carouselVideoLink .hiddenIframe{
    display:none;
}