/* doc link background images for specific file types */



.mainPgContent a[href$='.pdf'], .contentColumn a[href$='.pdf'] {
	background:transparent url(/img/icon/icpdf.png) top left no-repeat;
	display:inline;padding-bottom:3px;
	padding-left:20px;
}

.mainPgContent a[href$='.docx'], .contentColumn a[href$='.docx'] {
	background:transparent url(/img/icon/icdocx.gif) top left no-repeat;
	display:inline;
	padding-left:20px;
}

.mainPgContent a[href$='.dotx'], .contentColumn a[href$='.dotx'] {
	background:transparent url(/img/icon/icdocx.gif) top left no-repeat;
	display:inline;
	padding-left:20px;
}


.mainPgContent a[href$='.doc'], .contentColumn a[href$='.doc'] {
	background:transparent url(/img/icon/icdoc.gif) top left no-repeat;
	display:inline;
	padding-left:20px;
}

.mainPgContent a[href$='.xlsx'], .contentColumn a[href$='.xlsx'] {
	background:transparent url(/img/icon/icxls.gif) top left no-repeat;
	display:inline;
	padding-left:20px;
}

.mainPgContent a[href$='.xls'], .contentColumn a[href$='.xls'] {
	background:transparent url(/img/icon/icxls.gif) top left no-repeat;
	display:inline;
	padding-left:20px;
}

.mainPgContent a[href*=".xlsx&FldUrl=&Source="], .contentColumn a[href*=".xlsx&FldUrl=&Source="] {
	background:transparent url(/img/icon/icxls.gif) top left no-repeat;
	display:inline;
	padding-left:20px;
}

.mainPgContent a[href*=".xls&FldUrl=&Source="], .contentColumn a[href*=".xls&FldUrl=&Source="] {
	background:transparent url(/img/icon/icxls.gif) top left no-repeat;
	display:inline;
	padding-left:20px;
}

.mainPgContent a[href$='.pptx'], .contentColumn a[href$='.pptx'] {
	background:transparent url(/img/icon/icpptx.gif) top left no-repeat;
	display:inline;
	padding-left:20px;
}

.mainPgContent a[href$='.ppt'], .contentColumn a[href$='.ppt'] {
	background:transparent url(/img/icon/icppt.gif) top left no-repeat;
	display:inline;
	padding-left:20px;
}

a[href$='.pdf'].noShow, a[href$='.docx'].noShow, a[href$='.doc'].noShow, a[href$='.dotx'].noShow, 
a[href$='.xlsx'].noShow, a[href$='.xls'].noShow, a[href$='.pptx'].noShow, 
a[href$='.ppt'].noShow {
	background:none;
	display:inline;
	padding-left:0px;
}

/* classes for linking docs to Blue Button links */
 
a[href$='.pdf'].noShowBBShort, a[href$='.docx'].noShowBBShort, a[href$='.doc'].noShowBBShort, 
a[href$='.xlsx'].noShowBBShort, a[href$='.xls'].noShowBBShort, a[href$='.pptx'].noShowBBShort, 
a[href$='.ppt'].noShowBBShort{
	width:96px;
	height:18px;	
	display:block;
	padding:2px 16px 0 8px;
	font:bold 12px Arial, Helvetica, sans-serif;
	color:#fff;
	background:url("/Style%20Library/Images/UCSD/Btn_BlueShort.png") no-repeat;
}

a[href$='.pdf'].noShowBBLong, a[href$='.docx'].noShowBBLong, a[href$='.doc'].noShowBBLong, 
a[href$='.xlsx'].noShowBBLong, a[href$='.xls'].noShowBBLong, a[href$='.pptx'].noShowBBLong, 
a[href$='.ppt'].noShowBBLong{
	width:168px;
	height:18px;	
	display:block;
	padding:2px 16px 0 8px;
	font:bold 12px Arial, Helvetica, sans-serif;
	color:#fff;
	background:url("/Style%20Library/Images/UCSD/Btn_BlueLong.png") no-repeat;
}

/* "NEW" item image Flag */

.mainPgContent .newFlagLeft, .contentColumn .newFlagLeft {
	background:transparent url("https://assets.ucsd.edu/img/icon/icon-new.gif") top left no-repeat;
	display:inline-block  !important;
	padding-left:40px !important;
}
.mainPgContent .newFlagRight, .contentColumn .newFlagRight {
	background:transparent url("https://assets.ucsd.edu/img/icon/icon-new.gif") top right no-repeat;
	display:inline-block  !important;
	padding-right:40px  !important;
}

/* Top Link */
#scrollUp {
    bottom: 0;
    right: 30px;
    width: 70px;
    height: 70px;
    margin-bottom: -10px;
    padding: 10px 5px 5px 5px;
    font: 14px/20px sans-serif;
    text-align: center;
    text-decoration: none;
    text-shadow: 0 1px 0 #fff;
    color: #828282;
    -webkit-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.2);
    background-color: #E6E6E6;
    background-image: -moz-linear-gradient(top, #EBEBEB, #DEDEDE);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#EBEBEB), to(#DEDEDE));
    background-image: -webkit-linear-gradient(top, #EBEBEB, #DEDEDE);
    background-image: -o-linear-gradient(top, #EBEBEB, #DEDEDE);
    background-image: linear-gradient(to bottom, #EBEBEB, #DEDEDE);
    background-repeat: repeat-x;
    -webkit-transition: margin-bottom 150ms linear;
    -moz-transition: margin-bottom 150ms linear;
    -o-transition: margin-bottom 150ms linear;
    transition: margin-bottom 150ms linear;
}

#scrollUp:hover {
    margin-bottom: 0;
}



/* Blue Button Anchor Styles */

.mainPgContent a.btnBlueLight:link, .mainPgContent a.btnBlueLight:visited {min-width:75px;max-width:630px;width:auto;	height:21px;padding:4px 25px 0px 8px;display:inline-block;font-family:Arial, Helvetica, sans-serif;font-size:12px;line-height:15px;text-align:left;color:#fff !important;background:url("/css/images/btn-blue-light.png") !important;background-position: right top !important;margin:0px;overflow:hidden;}
.mainPgContent a.btnBlueLight:hover, .mainPgContent a.btnBlueLight:focus, .mainPgContent a.btnBlueLight:active {	background-position: right -25px;text-decoration:underline;}
.mainPgContent a.btnBlueDark:link, .mainPgContent a.btnBlueDark:visited {	min-width:75px;	max-width:630px;width:auto;	height:21px;padding:4px 25px 0px 8px;	display:inline-block;	font-family:Arial, Helvetica, sans-serif;	font-size:12px;line-height:15px;	text-align:left;color:#fff !important;background:url("/css/images/btn-blue-dark.png") !important;background-position: right top !important;margin:0px;overflow:hidden;}
.mainPgContent a.btnBlueDark:hover, .mainPgContent a.btnBlueDark:focus, .mainPgContent a.btnBlueDark:active {background-position: right -25px;text-decoration:underline;}
.mainPgContent a.btnBlueLight.fullRound,.mainPgContent  a.btnBlueDark.fullRound {border-top-left-radius:10px;border-bottom-left-radius:13px;padding-left:10px;}


/* Prev Next Btns */

a.btn-gray {height:24px;padding:0 10px;margin:5px 0;font-size:12px;font-weight:normal;line-height:24px;color:#666;background:#e8e8e8;border:1px solid #8f9092;display:block;}
a.btn-gray.prev {padding-left:32px;margin-right:10px;background:#e8e8e8 url("/css/images/btn-next-prev-arrows-gray.gif") 0 0 no-repeat !important;float:left;}
a.btn-gray.next {padding-right:32px;margin-left:10px;background:#e8e8e8 url("/css/images/btn-next-prev-arrows-gray.gif") right -24px no-repeat !important;float:right;}


/* Helper Classes */

.alignRight {float:right;padding:8px 0px 10px 10px; }
.alignLeft {float:left;padding:8px 10px 10px 0px; }

.caption {font-size:10px;line-height:normal;color:#666;text-align:left;}
.img-caption-gray, p.img-caption-gray {padding: 8px;line-height: 15px;font-size: 11px;border-bottom-right-radius: 5px;border-bottom-left-radius: 5px;background-color: rgb(243, 243, 243);}

/* Photo Box Call-Out Classes */

.PictureCalloutVertical {width:95.5%; padding:10px 2% 5px 2.5%; background-color:#EEE;border-top: solid 1px #63B1E5;border-bottom: solid 1px #63B1E5;display:table;}
		.PictureCalloutVertical .calloutCaption {text-align:center; padding-bottom: 0px; font-size:11px; color:#444; font-style:normal; line-height:125%;}
		.PictureCalloutVertical .calloutImage {width:47.5%; float:left; overflow:hidden; margin: 0px 2.5% 5px 0;}
		.PictureCalloutVertical .calloutImage IMG {	width:100%; height:auto;}
		.PictureCalloutVertical P.calloutText  {font-size:15px; font-weight:normal;padding:0px; text-align:left; float:left; color:#63B1E5; width:50%;}

.PictureCalloutHorizontal {width:95.5%; padding:10px 2% 5px 2.5%; background-color:#EEE;border-top: solid 1px #63B1E5;border-bottom: solid 1px #63B1E5;display:table;}
		.PictureCalloutHorizontal .calloutCaption {text-align:center; padding-bottom: 0px; font-size:11px; color:#444; font-style:normal; line-height:125%;}
		.PictureCalloutHorizontal .calloutImage {width:95%; float:left; margin: 0px 2.5% 5px 2.5%;}
		.PictureCalloutHorizontal .calloutImage IMG {width:100%; height:auto;}
		.PictureCalloutHorizontal .calloutText  {font-size:15px; font-weight:normal;padding:10px 0 0 0; text-align:left; color:#63B1E5; line-height: 150%; display: block; clear: both; padding-top: 0px;}


.editDisplay, .displayNone {display:none;}

.pullquoteGray {font-size:16px;color:#666;}

CODE {font-family:"Courier New", Courier, monospace;display:block;overflow:auto;background:#f7f7f7;border: 1px inset #DDD;font-size:11px;white-space:pre;padding:5px;}

/* Ensure that bullets and lists are not obsured by box objects aligned to the left or right */
OL {z-index: 5; position: relative;}

/* Hide elements only on mobile */
@media only screen and (max-width: 768px)  {
	.mobile-no-show {
		display:none !important;
	}
}

/* Equal Columns */
@media only screen and (max-width: 768px)  {
	.equal-cols-2 .left-col, .equal-cols-2 .right-col, .equal-cols-3 .left-col, .equal-cols-3 .right-col, .equal-cols-3 .middle-col, .equal-cols-4 .left-col, .equal-cols-4 .right-col, .equal-cols-4 .middle-col, .equal-cols-5 .left-col, .equal-cols-5 .right-col, .equal-cols-5 .middle-col {
		width:100% !important;
		margin-left:0% !important;
	}
}
@media only screen and (max-width: 990px)  {
	.equal-cols-4 .left-col, .equal-cols-4 .right-col, .equal-cols-4 .middle-col, .equal-cols-5 .left-col, .equal-cols-5 .right-col, .equal-cols-5 .middle-col {
		width:100% !important;
		margin-left:0% !important;
	}
}

.equal-cols-2, .equal-cols-3, .equal-cols-4, .equal-cols-5 {
	width:100%;
}

.equal-cols-2:after, .equal-cols-3:after, .equal-cols-4:after, .equal-cols-5:after {
	content: ".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}

.equal-cols-2 .left-col, .equal-cols-3 .left-col, .equal-cols-4 .left-col, .equal-cols-5 .left-col,
.equal-cols-2 .middle-col, .equal-cols-3 .middle-col, .equal-cols-4 .middle-col, .equal-cols-5 .middle-col {
	float:left;
}

.equal-cols-2 .right-col, .equal-cols-3 .right-col, .equal-cols-4 .right-col, .equal-cols-5 .right-col {
	float:right;
}

.equal-cols-2 .left-col, .equal-cols-2 .right-col {
	width:47%;
}

.equal-cols-3 .left-col, .equal-cols-3 .right-col, .equal-cols-3 .middle-col {
	width:30%;
}

.equal-cols-3 .middle-col {
	margin-left:5%;
}

.equal-cols-4 .left-col, .equal-cols-4 .right-col, .equal-cols-4 .middle-col {
	width:22%;
}

.equal-cols-4 .middle-col {
	margin-left:4%;
}

.equal-cols-5 .left-col, .equal-cols-5 .right-col, .equal-cols-5 .middle-col {
	width:17%;		
}

.equal-cols-5 .middle-col {
	margin-left:3.75%;
}

/* Call Out Boxes */


.callOutFullWidth , .callOut3Col {
	padding: 15px 2% 15px 2%;
	margin: 8px 0 0 0;
	width:96%; height:auto; 
	display:block;
	clear: both;
	line-height: 18px;
	background: #efefef;
	border: 1px solid #b2b1b1;
}

.callOutFullWidth H3,  .callOut3Col H3 {
    color: #4D4D4F;
    font-size: 17px;
    font-family: UniversBold, Arial, sans-serif;
    font-weight: normal;
    border-bottom: #AAA 1px solid;
    padding-bottom: 5px;
    margin: 0;
}


.callOutFullWidth H2 ,  .callOut3Col H2 {
    color: #4D4D4F;
    font-size: 17px;
    font-family: UniversBold, Arial, sans-serif;
    font-weight: normal;
    border-bottom: #AAA 1px solid;
    padding-bottom: 5px;
    margin: 0;
}


.callOutVideoHalf {
	padding: 2%;
	width:42%; height:auto; 
	margin: 2%;
	display:inline-block;
	clear: both;
	line-height: 150%;
	background: #efefef;
	border: 1px solid #b2b1b1;

}

.callOutVideoThird {
	padding: 2%;
	width:30%; 
	height:auto; 
	margin: 1%;
	display:inline-block;
	clear: both;
	line-height: 150%;
	background: #efefef;
	border: 1px solid #b2b1b1;

}

.callOutVideoHalf H3, .callOutVideoThird H3 {
	margin-bottom:10px !important;
	margin-top:-5px !important;
	color: #4D4D4F !important;
	font-size: 13px !important;
	font-family: UniversBold, Arial, sans-serif;
	font-weight: normal;
	border-bottom: 1px solid #ccc !important;
	padding-bottom: 5px !important;
	margin-bottom: 8px !important;
}



/* Social Media Icons */

span.socialMediaIcon16 a {width:16px;height:16px;display:inline-block;border:none;vertical-align:middle;background:url("/css/images/social-media-sprite.png") 0 0 no-repeat;}

span.socialMediaIcon16 a.icon-facebook {background-position: 0 -50px;}

span.socialMediaIcon16 a.icon-twitter {background-position: -50px -50px;}

span.socialMediaIcon16 a.icon-googleplus {background-position: -100px -50px;}

span.socialMediaIcon16 a.icon-linkedin {background-position: -150px -50px;}

span.socialMediaIcon16 a.icon-youtube {background-position: -200px -50px;}

span.socialMediaIcon16 a.icon-tumblr {background-position: -250px -50px;}

span.socialMediaIcon16 a.icon-rss {background-position: -300px -50px;}

span.socialMediaIcon32 a {width:32px;height:32px;display:inline-block;border:none;vertical-align:middle;background:url("/css/images/social-media-sprite.png") 0 0 no-repeat;}

span.socialMediaIcon32 a.icon-facebook {background-position: 0 0;}

span.socialMediaIcon32 a.icon-twitter {background-position: -50px 0;}

span.socialMediaIcon32 a.icon-googleplus {background-position: -100px 0;}

span.socialMediaIcon32 a.icon-linkedin {background-position: -150px 0;}

span.socialMediaIcon32 a.icon-youtube {background-position: -200px 0;}

span.socialMediaIcon32 a.icon-tumblr {background-position: -250px 0;}

span.socialMediaIcon32 a.icon-rss {background-position: -300px 0;}

/* No show for Font Awesome External Link Icon */
A.no-external-link span i.fa {
	display:none !important;
}

/* Responsive Div Wrapper for Youtube embeds */

	.video-responsive{
	    overflow:hidden;
	    padding-bottom:56.25%;
	    position:relative;
	    height:0;
	}
	.video-responsive iframe{
    	left:0;
    	top:0;
    	height:100%;
    	width:100%;
    	position:absolute;
	}
	.video-responsive.acc-video {
	    padding-bottom: 30% !important;
	}
	.video-responsive .acc-iframe {
        width: 450px !important;
        height: 250px !important;
    }
    
.callOutVideoThird>iframe {
    width: 100%;
}
    
/* Accordion iframe*/
@media screen and (min-width: 768px) {
	.video-responsive .acc-iframe{
    	 width: 450px !important;
        height: 250px !important;
	}

}
    
    
@media screen and (min-width: 768px) {
	.video-responsive iframe{
    	/*height:auto;*/
    	height: 100%;
    	width:auto;
	}
	
}

@media only screen and (max-width: 600px) {
  .callOutVideoThird {
		width: 90%;	
	}
	.callOutVideoThird > iframe {
	    width: 100% !important;
	    height: 100%;
	}
	.callOutVideoThird.right {
	    float: unset;
	}
}

#yt-corona-video {
	width: 560px !important;
	height: 315px !important;
}


/* Mobile style fix for Shared Articles - Cherr B.*/
/* iPhone 5 */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) { 
 
	#yt-corona-video {
		width: 100% !important;
    	height: 100% !important;
	}
	p.caption {
	 margin-top: 20px;
	}
	.yt-mobile {
	 width: 400px;
	}
	.callOutVideoThird.right {
	    float: unset;
	}
}

/* iPhone 6/7/8/X */
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) { 
    #yt-corona-video {
		width: 320px !important;
    	height: 100% !important;
	}
	p.caption {
	 margin-top: 20px;
	}
	.yt-mobile {
	 width: 400px;
	}
	.callOutVideoThird {
		width: 90%;	
	}
	.callOutVideoThird > iframe {
	    width: 100% !important;
	    height: 100%;
	    margin-bottom: -14px;
	}
	.callOutVideoThird.right {
	    float: unset;
	}
	.video-responsive .acc-iframe {
	    width: 100% !important;
	    height: 100% !important;
	}
	.video-responsive.acc-video {
	    padding-bottom: 60% !important;
	}
}

/* iPhone 6/7/8 Plus */
@media only screen and (min-device-width : 414px) and (max-device-width : 736px) {
    #yt-corona-video {
		width: 320px !important;
    	height: 100% !important;
	}
	p.caption {
	 margin-top: 20px;
	}
	.yt-mobile {
	 width: 400px;
	}
	.callOutVideoThird 
	{
		width: 90%;	
	}
	.callOutVideoThird > iframe {
	    width: 100% !important;
	    height: 100%;
	    margin-bottom: -14px;
	}
	.callOutVideoThird.left, .callOutVideoThird.right{
	    float: unset;

	}

}

/* iPad */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px)and (-webkit-min-device-pixel-ratio: 2) { 
    #yt-corona-video {
		width: 100% !important;
    	height: 100% !important;
	}
	p.caption {
	 margin-top: 20px;
	}
	.yt-mobile {
	 width: 400px;
	}
	.callOutVideoThird {
		width: 90% !important;	
	}
	.callOutVideoThird > iframe {
	    width: 100% !important;
	    height: 100%;
	    margin-bottom: -14px;
	}
	.callOutVideoThird.left, .callOutVideoThird.right{
	    float: unset;

	}


}

@media only screen and (max-width: 667px) {
    .newsFeatureShareLinks.editNoDisplay {
       float: unset; 
    }
}