custom.css

Custom styles for the A&S site

CSS stylesheet icon custom.css — CSS stylesheet, 9 KB (9433 bytes)

File contents

/* ---------------------------------------------------------------------------------------- FONTS */

body {font-family: "Gotham SSm A", "Gotham SSm B";}

#content-body h1 {
  font-family: "Gotham SSm A", "Gotham SSm B";
  font-size: 40px !important;
  font-weight: 100;
  line-height: 50px;
  letter-spacing: -0.02em;
}

#content-body h2 {
  font-family: "Gotham SSm A", "Gotham SSm B";
  font-size: 32px !important;
  font-weight: 700;
  display: block;
  margin: 30px 0px 20px;
  line-height: 40px;
}

#content-body h3, #content-body h2.tileHeadline {
  font-family: "Gotham SSm A", "Gotham SSm B";
  font-size: 25px !important;;
  margin: 30px 0px 10px;
  line-height: 30px;
  font-weight: 500;
  color: #666
}

#content-body h4 {
  font-family: "Gotham SSm A", "Gotham SSm B";
}

#content-body p, #content-body li {
  font-size: 16px;
  letter-spacing: -0.02em;
  font-weight: 300;
  line-height: 30px;
  margin-bottom: 20px;
}

@media (max-width: 767px) {
  #content-body h1 {font-size: 30px !important; line-height: 40px;}
  #content-body h2 {font-size: 20px !important; line-height: 30px;}
}

i, em {font-weight: 400;}

.mercury {
	font-family: "Mercury SSm A", "Mercury SSm B";
	font-style: italic;
	letter-spacing: normal;
}

/* STYLING PODCAST IMAGES AFTER THE SCRIPT ADDS THIS CLASS */
.podcastimg:before {
  content: "Podcast";
  position: absolute;
  top: 0;
  right: 0;
  z-index: 100;color: #000;
  background-color: #ccc;
  padding: 5px 5px 5px 30px;
  background-image: url("http://louisville.edu/artsandsciences/images/icons/podcast.png");
  background-repeat: no-repeat;
  background-position: 5px center;
  background-size: 20px 20px;
  text-shadow: none;
  font-size: 14px;
  vertical-align: bottom;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  filter: alpha(opacity=50);
  -moz-opacity: 0.5;
  -khtml-opacity: 0.5;
  opacity: 0.5;
}

/* STYLING PODCAST HEADLINES 

span.podcast, h2.tileHeadline.podcast {
  color: #000;
  background-color: #ccc;
  padding: 5px 5px 5px 30px;
  background-image: url("http://louisville.edu/artsandsciences/images/icons/podcast.png");
  background-repeat: no-repeat;
  background-position: 5px center;
  background-size: 20px 20px;
  text-shadow: none;
  font-size: 14px;
  vertical-align: bottom;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  filter: alpha(opacity=50);
  -moz-opacity: 0.5;
  -khtml-opacity: 0.5;
  opacity: 0.5;
}

@media (max-width: 500px) {
  span.podcast {
    display:table-cell;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
    filter: alpha(opacity=10);
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
}
}
*/

/* PLAY BUTTON */

p.play a {
  color: #fff;
  background-color: #ad0000;
  border: 1px solid #ad0000;
  padding: 10px 10px 10px 25px;

  border-radius: 5px;
  width: auto;
  background-size: 12px 20px;
  background-image: url("/artsandsciences/images/icons/play.png");
  background-repeat: no-repeat;
  background-position: 5px center;
}

p.play a:hover {
  text-decoration: none;
  background-color: #fff;
  color: #ad0000;
  border: 1px solid #ccc;
  background-image: url("/artsandsciences/images/icons/play-yellow.png");
}

/* CUSTOM SOCIAL SHARE BUTTONS */
#shareme {margin-bottom: 20px; margin-top: -20px}
#shareme p {margin-bottom: 0px !important}
.fb_iframe_widget {top: -5px; margin-right: 10px}


/* HIDES CUSTOM HOMEPAGE BACKGROUND COLOR WHEN LOGGED IN */
body.userrole-authenticated {background-color: transparent;}

/* MARKETING TEMPLATE MODS */

html,body {width: 100%;margin: 0px;padding: 0px;overflow-x: hidden;}

body {
    background-image: url('/artsandsciences/images/background.png');
    background-position: 0 -80px
}

#breadcrumbs, #document-description, #social-counters
{display: none !important;}

#navbar {background-color: #fff}

#core-content, #marketing_banners {margin-top: 25px}

#core-content > div > div {border-top: 0px solid #AD0000;}

#core-content .main-content, #core-content .sidebar, #social-counters {
    background-color: #fff;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

#content-body {background: #fff}

header.lower-grey #lowerbar {
    border-bottom: 0px solid #DBDBDB; 
    background-color: #fff;
    padding-top: 10px; 
    padding-bottom: 10px; 
}

#social {float: right}
#social img {margin-right: 5px; padding-top: 4px}

span.portletItemDetails {display: none}

/*ADDS AS LOGO BEFORE DEFAULT UOFL LOGO*/
div#logo.pull-left:before {
    background-image: url(/artsandsciences/images/logos/AS-logo-small.png);
    content: " ";
    display: block;
    width: 222px;
    height: 85px;
    float: left;
    margin: 0px;
    background-repeat: no-repeat;
    background-position: 50%;
}

/* MAKES UOFL LOGO INVISIBLE AND RE-DEFINES ITS CLICKABLE DIMENSIONS */
#logo img {
    margin-left: -222px;
    width: 221px;
    margin-top: 25px;
    height: 36px;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -moz-opacity: 0.0;
    -khtml-opacity: 0.0;
    opacity: 0.0;
}

/* ADJUSTS MARGINS FOR SEARCH BAR AND TERTIARY MENU TO FIX VERTICAL ALIGNMENT */
header.uofl form.search {margin: 30px 5px 0px;}
#tertiary-menu {margin: 25px 5px 0px;}

/* HIDES SITE TITLE AND ORIGINAL CONTENTS OF TERTIARY MENU */
#tertiary-menu ul, #site-title {display: none}

/*  SOCIAL ICONS IN HEADER AND FOOTER  */

#tertiary-menu img, #fatfooter img {
    margin: 5px;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;
}

#tertiary-menu img:hover, #fatfooter img:hover {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
}

#tertiary-menu img {
    width: 22px;
    height: 22px;
    border: 1px solid #999;
    border-radius: 50%;
    padding: 4px;
}

/* FOOTER RE-STYLE */

#prefooter_wrapper {
    border: none;
    margin-top: 0px;
    text-shadow: none;
    color: #fff;
}

#fatfooter {
    max-width: 1170px;
    margin-left: auto;
    margin-right: auto
}

#prefooter-rows {padding: 0px}

.prefooter-header {margin-bottom: 5px !important}

#prefooter.light a {line-height: 25px;}

@media (max-width: 767px) {
    #prefooter_wrapper {margin-top: 0px;}
    #prefooter {margin: 0;}
    #prefooter > div {border-bottom: none;}
    #prefooter .row-fluid:first-child {width: auto}
    .prefooter-header {margin-top: 15px !important}
}

#prefooter *[class^='span'] {border: 0px solid #ddd}

/* MISC */
@media (max-width: 980px) {
.header-search .search {width: 70%;} /* MAKES SEARCH FIELD WIDER IN MOBILE MENU */
#drawer table td:first-child {width: 10%;} /* SMALLER HOME BUTTON CELL IN MOBILE MENU */
#nav-drawer-home-link {font-size: 0px;} /* HIDES UOFL HOME BUTTON TEXT IN MOBILE MENU */
}

p.byline {
  font-style: italic;
  text-decoration: underline;
}

/* LEFT NAVIGATION */

.main-content .left-nav {margin: 50px 0 0 20px;} /* adjusts margins of navigation */

ul.left-nav {margin: 0 0 10px 0px;} /* removes left indentation from navigation list */

.left-nav li.nav-link {padding: 10px 10px; margin-bottom:0px; border-bottom: 1px dotted #ccc}
.left-nav li.nav-link:hover {background-color: #eee;}
.left-nav li.nav-link a:hover {text-decoration: none}

.nav-header {padding-left: 0px;} /* removes left indentation navigation header */

.uofl-navbar #nav-main .nav > li {margin-right: 22px;} /* less space between main nav items */
.uofl-navbar #nav-main .nav > li:last-child {margin-right: 0px;!important} /* removes right margin for last nav item */


/* CONTENT AREA  */ 

@media (max-width: 767px) {
  #lowerbar, #navbar, #core-content {padding: 0 .2em;} /* removes extra left/right padding at mobile resolution */

  #core-content {margin-top: 0px; padding: 0px}

  #core-content .main-content, #core-content .sidebar, #social-counters {
    -webkit-box-shadow: none;
    -moz-box-shadow:none;
    box-shadow: none;
}

  ul.left-nav {margin: 0 0 10px 20px;} /* restores some left padding for navigation after above action */

  div#content-wrapper.span9::after {display: none} /* eliminates unneccessary shadow below content area at mobile rez */

  .phone_nav::after {display: none}
}

/* EVENT FEED MODS */
body.marketing #lw li.lwe {padding: 10px;}
#lw li.lwe:hover {background-color: transparent !important}
.lwl {display: none}


/* PULL QUOTES */

#content-body blockquote {margin-left: 30px;}
#content-body blockquote img {margin-bottom:10px}

.pullquote::before {
    content: url(/artsandsciences/images/icons/quotes-open.png);
}

.pullquote::after {
    content: url(/artsandsciences/images/icons/quotes-closed.png);
}

.pullquote {
    border-left: 3px solid #e5e5e5 !important;
    margin: 1em 0em 0.5em 0.5em;
    padding-right: 0px; 
    font-size: 1.3em; 
}

@media screen and (max-width: 500px) {
.pullquote {width: 100%; border-left: 0px !important;}
}