/* Bard Base CSS Template*/ /* ----------- Helper Classes ---------- */ .hideForMobile, .hideForTablet { display: none; } /* ---------------------------- GLOBAL STYLES ------------------------ */ html { } body { margin: 0px; padding: 0px; font-family: "Source Sans Pro", "SourceSans", Helvetica, sans-serif; font-size: 16px; line-height: 24px; color: #222; } body a:link, a:visited { color:#ad1a1f; text-decoration: underline; } body a:hover, a:active { color:#ad1a1f; text-decoration: underline; } h1 { font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: 700; color:#222222; margin: 10px 0px 20px 0px; padding: 0px; display: block; font-size: 2.8em; line-height: 38px; text-transform: uppercase; } h1.pagetitle { font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: 700; color: #ad1a1f; font-size: 2.8em; line-height: 40px; margin: 50px 0px 10px 0px; z-index: 2000; } h1.pagetitle a:link, h2.pagetitle a:visited { color:#ad1a1f;text-decoration: none; } h1.pagetitle a:hover, h2.pagetitle a:active { color:#ad1a1f;text-decoration: underline; } h2 { font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; color:#ad1a1f; margin: 20px 0px 5px 0px; display: block; font-size: 1.75em; font-weight: 900; line-height: 1em;} p { font-size: 1em; line-height: 24px; display: block; } strong { font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: 800; } iframe {border: none;} /* reset styles */ .bardtype { font-family: "Source Sans Pro", "SourceSans", Helvetica, sans-serif; font-size: 0.9em; color:#000; } .bardtype a:link, a:visited { color:#ad1a1f; text-decoration: underline; } .bardtype a:hover, a:active { color:#ad1a1f; text-decoration: underline; } .clearout { clear: both; line-height: 1px; } img a {border-style: none; } .imgshell img { width: 100%; height: auto; margin: 0px; padding: 0px; } /*.content { width: 100%; height: auto; margin: 0px; padding: 0px; }*/ /* random font styles */ .bodytext { margin: 0px; padding: 0px; font-family: "Source Sans Pro", "SourceSans", Helvetica, sans-serif; font-size: 16px; line-height: 24px; color: #222; } .caption { position: relative; display: block; font-size: .8em; line-height: 1.5em; color: #222; margin: 10px auto; width: 80%; text-align: center; clear: both; font-style: italic; } .timezone { position:relative; font-size:.9em; color:#333; font-style:italic; } .intro { font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif;font-size: 1em; line-height: 2em; color: #666; font-weight: 500; margin: 0px 0px 10px 0px;} ul { padding: 5px 5px 5px 20px; } .icons { font-family: "Modern Pics", sans-serif; color: #FFF; margin: 0px 2px 0px 15px; text-align: center; } .expandblock { position: relative; width: auto; } .expandblock ul li { margin: 0px; padding: 0px;} .hrule { width: 90%; border-top: 1px solid #666; padding: 0; margin: 10px auto; } .hidden {display:none;} .visuallyhidden { border: 0; height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;} .red { color: #ad1a1f; display: inline; font-size: inherit; line-height: inherit; padding: inherit; margin: inherit; } .subtitle { font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif;color:#ad1a1f; margin: 10px 0px 5px 0px; padding: 0px; font-size: 1.4em; font-weight: bold; } iframe>.subtitle { font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif;color:#ad1a1f; margin: 10px 0px 5px 0px; padding: 0px; font-size: 1.4em; font-weight: bold; } .footnote { position: relative; display:block; width:85%; margin: 10px auto; padding: 10px 0; font-size: 0.8em; font-style: italic; color: #666; border-top: 1px solid #222; } .pagetitle { font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: 700; color: #222222; font-size: 2.8em; line-height: 40px; margin: 100px auto 0px auto; z-index: 2000; display: block; height: auto; max-width: 1100px; } /* styles for skip to main content */ .skip { display: block; padding: 5px 25px 5px 25px; position: absolute; top: -100px; left: 0px; color: #FFFFFF; border: 1px solid #DDD; background: #a11a1f; transition: top 1s ease-out; z-index: 1000;} .skip:focus { position: absolute; left: 0px; top: 0px; width: auto; height: auto; outline: 0; transition: top .1s ease-in;} a.skip, a.skip:link, a.skip:visited, a.skip:active, a.skip:hover { color: #FFFFFF; text-decoration: none; outline: 0;} /* CMS Styles */ .cms-subtitle1 { font-family: "Source Sans Pro", "SourceSans", sans-serif;color:#ad1a1f; margin: 20px 0px 5px 0px; padding: 0px; font-size: 1.5em; font-weight: 700; } .cms-subtitle2 { font-family: "Source Sans Pro", "SourceSans", sans-serif;color:#222; margin: 15px 0px 0px 0px; padding: 0px; font-size: 1.25em; font-weight: 700; } .cms-subtitle3 { font-family: "Source Sans Pro", "SourceSans", sans-serif;color:#222; margin: 15px 0px 0px 0px; padding: 0px; font-size: 1.25em; font-weight: 700; } .cms-caption { font-family: "Source Sans Pro", "SourceSans", sans-serif; font-style: italic; color:#666; margin: 10px 0px; padding: 0px; font-size: 0.8em;} .cms-button { font-size:0.75em; font-weight: 800; line-height: 0.5em; display: inline-block; width: auto !important; height: auto; margin: 0px 10px; padding: 10px; color: #FFF; background: #ad1a1f; border-radius: 0px; font-family: "Source Sans Pro", "SourceSans", sans-serif; white-space: nowrap; text-transform:uppercase; letter-spacing: 2px; } .cms-button a { color: #FFF; text-decoration: none; } .cms-button a:link, .cms-button a:visited { color: #FFF; text-decoration: none; } .cms-button a:hover, .cms-button a:active { color: #FFF; text-decoration: underline; } a .cms-button { font-size:0.75em; font-weight: 800; line-height: 0.5em; display: inline-block; width: auto !important; height: auto; margin: 0px 10px; padding: 10px; color: #FFF; background: #ad1a1f; border-radius: 0px; font-family: "Source Sans Pro", "SourceSans", sans-serif; white-space: nowrap; text-transform:uppercase; letter-spacing: 2px; } /* Styles for ResLife/Admission Chat Add On */ #kipsu-chat-button {background: #ad1a1f !important;border: none;border-radius: 0px !important;color: #FFF !important;position: fixed;cursor: pointer;height: 50px;z-index: 800;bottom: 0px !important;font-family: "Source Sans Pro", "SourceSans", sans-serif !important;right: 15px;text-align: center;font-weight: bold;font-size: 14px;line-height: 36px;padding: 0 20px;display: inline-block;user-select: none; white-space: normal;} /* Fix for Anchor Links in Bard Template */ /*a[id]:not([href])::before { content: ''; display: block;height: 100px; margin-top: -100px; visibility: hidden;}*/ /* Fix for Anchor Links Class in Bard Template */ /*a.anchor {display: block;height: 100px; margin-top: -100px; visibility: hidden; clear:both;}*/ /*Symantic Table Styles */ table {width: 100%; margin:0;} td {padding: 2%; } /* generic tables */ .table {position:relative;display:flex;flex-wrap: wrap; width:90%;margin:5px auto;} .table .tr {position:relative;display:flex;flex-flow: row wrap;width: 100%; text-align:left;padding:0%; } .table .td {position:relative;flex: 1; width: auto !important;vertical-align: top;text-align:left;padding:1%;margin: 1%; } .table .row-break { flex-basis: 100%;width: 0px; height: 0px; overflow: hidden;} .table>.td>.content {position:relative;width:80%; margin: 0; padding: 0 10%; display:block;vertical-align: top; } /* classes for widths of tables and columns */ .width5 { position: relative; width:4%; padding: 0.5%;} .width10 { position: relative; width:9%; padding: 0.5%; } .width15 { position: relative; width:14%; padding: 0.5%; } .width20 { position: relative; width:19%; padding: 0.5%; } .width25 { position: relative; width:24%; padding: 0.5%; } .width30 { position: relative; width:29%; padding: 0.5%; } .width50 { position: relative; width:49%; padding: 0.5%; } .width60 { position: relative; width:99%; padding: 0.5%; } .width70 { position: relative; width:70%; padding: 0.5%; } .width75 { position: relative; width:74%; padding: 0.5%; } .width80 { position: relative; width:79%; padding: 0.5%; } .width90 { position: relative; width:89%; padding: 0.5%; } /* Replacement for Tables */ .csstable { display: table; width:90%; margin: 5px auto; } .csstable .csscell { display: table-cell; padding: 1%; width: auto !important; } /* button styles */ .ctabutton { display: inline-block; width: auto; height: auto; margin: 5px 5px 10px 0px; padding: 10px 12px; background: #ad1a1f; border: none; border-radius: 0; color: #FFF; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; white-space: nowrap; font-size:.75em; line-height: .5em; text-transform:uppercase; letter-spacing: 2px; font-weight: 800;} .ctabutton a:link, .ctabutton a:visited { color: #FFF; text-decoration: none; } .ctabutton a:hover, .ctabutton a:active { color: #FFF; text-decoration: underline; } /* modal button styles */ button.modal-open { display: inline-block; width: auto; height: auto; margin: 0px; padding: 5px 10px; background: #ad1a1f; border: none; border-radius: 0; color: #FFF; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; white-space: normal; line-height: 0.5em; text-transform:uppercase; letter-spacing: 2px; font-weight: 800;} button.modal-open a:link, button.modal-open a:visited { color: #FFF; text-decoration: none; } button.modal-open a:hover, button.modal-open a:active { color: #FFF; text-decoration: underline; } /* modal button styles */ .ctabutton>button.modal-open { display: inline-block; width: auto; height: auto; margin: 0px ; padding: 5px 10px; background: #ad1a1f; border: none; border-radius: 0; color: #FFF; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-size: 1.0em; line-height: 0.5em; text-transform:uppercase; letter-spacing: 2px; font-weight: 800;} .ctabutton>button.modal-open a:link, .ctabutton>button.modal-open a:visited { color: #FFF; text-decoration: none; } .ctabutton>button.modal-open a:hover, .ctabutton>button.modal-open a:active { color: #FFF; text-decoration: underline; } /* ------- classes for main structure ------ */ #supershell { position: relative; margin: 0px; padding: 0px; width: 100%; display: block; } #supershell>img { position: relative; width: 50%; min-width: 1000px; height: auto;} header.fixed {position: fixed; width: 100%; top: 0px; } /* ------- Header Changes for Emergency Ribbon at Top ------- header.fixed {position: fixed; width: 100%; top: 34px; z-index: 9900;} .emergencies {position:fixed; top: 0px; left: 0; width: 100%; margin: 0; padding: 0px; z-index:2000; height: 35px;} .emergencies .emerbutton {position:relative; width: auto; margin: 0 auto; padding: 5px 15px; background: #ad1a1f; font-size: 0.9em; text-align: center;} .emergencies .emerbutton a:link, .emergencies a:visited { color: #FFF;text-transform:uppercase; text-decoration: none;} .emergencies .emerbutton a:active, .emergencies a:hover { color: #FFF;text-transform:uppercase; text-decoration: underline;}*/ header .topnav { width: 100%; height: 25px; background: #222; text-align: right; margin: 0; padding: 0;} header .topnav .toplinks { width: 100%; max-width: 1170px; height: 25px; background: #222; color: #CCC; text-align: right; margin: 0; padding: 5px 0; font-size: 0.8em; } header .topnav .toplinks a:link, header .topnav .toplinks a:visited { color: #CCC; text-decoration: none;} header .topnav .toplinks a:active, header .topnav .toplinks a:hover { color: #FFF; text-decoration: underline;} /* -------------- main structure styles -------------- */ main { position:relative; width: 100%; top: 0px; margin: 0px auto 0px auto; padding: 0px; overflow:hidden; display: block; } main #maintext { position:relative; display:block; width: 100%; background: #FFF; margin: 0px auto; padding: 0px 0px 40px 0px; top: 0px; } main #maintext .content { position: relative; padding: 0px; margin: 0 auto; width:100%; display: block; } #ccelogo { position: absolute; top: 0px; left: 0%; width: 150px; height:125px; z-index: 9999; overflow: hidden; } #ccelogo img { position: relative; width: 100%; height: auto !important;} /* intro H1 and main image styles */ #introshell { position: relative; width: 100%; max-width: 1400px; height: auto; min-height: 0px; overflow: hidden; z-index: 900; margin: 110px auto 0 auto; padding: 0; } #introshell>#title {margin: 25px auto; padding: 10px 0; max-width: 1200px; } #introshell>#title>h1.pagetitle {padding: 0px; margin: 50px auto 0px auto; text-transform: uppercase;text-align: center; color: #222;font-weight: 900; letter-spacing: 2px; } #introshell>.sitetitle { position: absolute; top: 10px; left: 5%; width: auto; max-width: 1200px; height: 50px;overflow: hidden; float: none; margin: 2px auto; padding: 0px; z-index: 1001; } #introshell>.sitetitle>.sitelogo { position: relative; top: 0; margin: 0px auto; padding: 0; height: 50px; width: auto !important; display: block; max-width: 1200px;font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; color:#FFF; font-weight: lighter; font-size: 1.5em; line-height: 1em; background:url(https://www.bard.edu/images/tints/80black.png) repeat; overflow: hidden; } #introshell>.sitetitle>.sitelogo img { margin: 0px; padding: 0px; z-index: 1001; height: 100%; width: auto; } #introshell>.sitetitle .pagetitle img { margin: 0px 10px; padding: 0px; } #introshell>.sitetitle .pagetitle { font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; color:#FFF; margin: 20px 0px 0px 20px; padding: 10px; width: auto !important; display: inline-block; font-weight: lighter; font-size: 1.5em; line-height: 1em; background: #ad1a1f; z-index: 1001; } #introshell .image { position: relative; width: 100%; height: 450px; background: #222; z-index: 1000; padding: 0; margin: 0 auto; max-height: 550px; max-width: 1300px; min-height: 0px; overflow: hidden; } #introshell .image img { width: 100%; height: auto !important; padding: 0; margin: 0; } #introshell>.image>.tint { position: absolute; bottom: 0%; left: 0%; display: block; width: 60%; color: #FFF;background: url(/images/tints/80black.png) repeat; min-height: 50px; overflow: visible; z-index: 1001; margin: 0; padding: 2% 20%; } #introshell .image h1 { position: absolute; bottom: 20%; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: 600;text-transform: uppercase; letter-spacing: 3px; width: 100%; color: #FFF; font-size: 3.0em; line-height: 1em; text-align: center; margin: 0 auto; padding: 1% 0; z-index: 1001; /*background: url(https://www.bard.edu/images/tints/80black.png) repeat;*/ text-shadow: 2px 2px 2px #333;} #introshell>.image>.caption { position: absolute; bottom: 0%; right: 0%; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: 600; display: block; width: auto !important; color: #FFF; text-align: center; margin: 0; padding: 1% 2%; font-style: normal; z-index: 1002; } #introshell>.image>.caption a:link { color: #FFF; } #introshell>.image>.caption a:visited { color: #FFF; } #introshell>.image>.caption a:active { color: #FFF; text-decoration: underline; } #introshell>.image>.caption a:hover { color: #FFF; text-decoration: underline; } .introbuttons { position: relative; width: 100%; height: auto !important; margin: 30px auto 0px auto; padding: 0; z-index: 100; } .introbuttons>.content { position: relative; width: 95%; max-width: 1200px; margin: 0px auto; align-items: center; text-align: center;} .introbuttons>.content>.buttons { position: relative; display: inline-block; white-space: normal; width: auto; height: auto !important; border: none; padding: 5px 0px; margin-right: 20px; margin-bottom: 0px; color: #FFF; font-size: 0.8em; line-height: 0.5em; letter-spacing: 2px; text-transform: uppercase; font-weight: 800; align-items: center; } .introbuttons>.content>.buttons a:link, .introbuttons>.content>.buttons a:visited { color: #FFF; text-decoration: none; background: #ad1a1f;padding: 10px 15px; } .introbuttons>.content>.buttons a:active, .introbuttons>.content>.buttons a:hover { color: #FFF; text-decoration: none; background: #ad1a1f;padding: 10px 15px;} #introtext { position: relative; display: block; width: 80%; margin: 40px auto; padding: 0px; font-size: 1.1em; text-align: center; max-width: 1000px; font-weight: 500;} #introtext>h2 { display: block; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; color:#ad1a1f; margin: 10px 0px 5px 0px; padding: 0px 0px 5px 0px; font-size: 1.5em; line-height: 1.2em; font-weight: 900; text-align:center; text-transform: uppercase; letter-spacing: 3px;} #introtext .subtitle { display: block; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; color:#ad1a1f; margin: 10px 0px 5px 0px; padding: 0px 0px 5px 0px; font-size: 1.3em; line-height: 1.2em; font-weight: 900; text-align:center; text-transform: uppercase; letter-spacing: 3px;} #introtext h3 { display: inline; } #introtext>.ctabutton { width: auto; height: auto; margin: 10px auto 0 auto; padding: 10px; background: #ad1a1f; border: none; border-radius: 0; font-size: 0.70em; } #introtext>button.modal-open { width: auto; height: auto; margin: 10px auto 0 auto; padding: 10px; background: #ad1a1f; border: none; border-radius: 0; font-size: .7em; float: none; } /* classes for 2019 template */ /* start Announcement styles*/ .announce { position:relative; display:block; width:70%; height: auto !important; overflow: visible; margin: 50px auto 0px auto; padding: 0px; align-content: center;max-width: 1100px; background:url(https://www.bard.edu/images/line.png) repeat-x; } .announce>.content { position: relative; display:block; float: none; width: 60%; overflow: hidden; margin: 0 auto; padding: 0; text-align: center; } .announce>.content>.words>.padding { position: relative; display:block; float: none; width: 80%; overflow: hidden; margin: 0 auto; padding: 0; text-align: center; } .announce>.content>.words>.padding>.subtitle { text-align: left; } .announce>.content>.words>.padding>h2 { position: relative; display: inline-block; text-align: center; height: 30px; width: auto !important; text-transform: uppercase; letter-spacing: 2px; font-size: 1.2em; line-height: 1em; padding: 5px 10px; margin: 0;background: #FFF; color: #333; clear: both;} .announce>.content>.words>.padding>.ctabutton { position: relative; display: block; text-align: center; } .announce>.content p { position: relative; width: 50%; background: #ededed; margin: 20px 20%; padding: 5%; } .announce>.content>.words { position: relative; display:block; float: none; width: 100%; overflow: hidden; margin: 0 auto; padding: 0; text-align: center; } .announce>.content>.words>.padding .subtitle { font-size: 1.05em; line-height: 1.5em; font-weight: 200; margin: 0 5%; color: #333;} /*.announce>.content>.words>.padding>.ctabutton { clear: both; display: block; width: auto !important;}*/ /*lori hid because it was causing buttons to go full width */ /* start audio cluster */ .audioclust { position: relative; display: block; width: 100%; max-width: 1100px; height: auto !important; margin: 30px auto; padding: 0; max-height: 300px; overflow: hidden; } .audioclust .content { position: relative; display: block; width: 100%; height: auto !important; margin: 0; padding: 0; overflow: visible; } .audioclust .content .words { position: relative; display: block; width: 100%; height: auto !important; margin: 0; padding: 0; background: #222; overflow: hidden; max-height: 300px; } .audioclust .content .words .padding { position: relative; display: block; width: 65%; height: auto !important; margin: 0; padding: 2.5%; float: left; background: #222; color: #FFF; } .audioclust .content .words .padding h2 { margin: 0 0 10px 0; padding: 0 0 10px 0; border-bottom: 1px solid #f6f6f6; color: #FFF; text-transform: uppercase; letter-spacing: 2px; font-size: 1.2em; } .audioclust .content .words .multibuttons { position: relative; display: inline; width: 30%; height: auto !important; max-height: 300px; margin: 0; padding: 0; float: left; background: #FFF; overflow-y: scroll; } .audioclust .content .words .multibuttons ul { position: relative; display: block; width: 90%; height: auto !important; margin: 0 auto; padding: 0; list-style: none; background: #FFFFFF; } .audioclust .content .words .multibuttons ul li { position: relative; display: block; width: 100%; height: auto !important; margin: 1% auto; padding: 1%; float: left; list-style: none; background: #f6f6f6; } .audioclust .content .words .multibuttons ul li .ckeditor-html5-audio {position: relative; width: 100%; } /* start Billboard styles */ .billboard { position: relative; display: block; width: 100%; height: auto !important; padding: 0; margin: 30px auto 0 auto; } .billboard .content { position: relative; width: 100%; display:block; } .billboard .content .caption { margin: 5px 0; width: 100%;} .billboard .content .imgcenter { position: relative; width: 80%; margin: 0 auto 0px auto; } .billboard .content .imgcenter img { width: 100%; height: auto; } .billboard .content .imgfull { width: 100%; margin: 0 auto; padding: 0; background: #FFF; } .billboard .content .imgfull img { width: 100%; height: auto !important; padding: 0; margin: 0; } .billboard .content .imgright { width: 60%; margin: 0; padding: 0; background: #FFF; float: right; display: inline; } .billboard .content .imgright img { width: 100%; height: auto !important; padding: 0; margin: 0; } .billboard .content .imgshell { width: 60%; margin: 0; padding: 0; background: #FFF; float: left; } .billboard .content .imgshell img { width: 100%; height: auto !important; padding: 0; margin: 0; } .billboard .content .embcenter { position: relative; width: 80%; margin: 0 auto 30px auto; } .billboard .content .embcenter iframe { width: 100%; height: auto !important; min-height: 800px; padding: 0; margin: 0; } .billboard .content .embfull { position: relative; width: 100%; height: auto !important; overflow: visible; margin: 0 auto; padding: 0; background: #FFF; } .billboard .content .embfull iframe { width: 100vw; height: calc(100vw/1.77); top: 0; left: 0; padding: 0; margin: 0; } .billboard .content .embright { width: 60%; margin: 0; padding: 0; background: #FFF; float: right; display: inline; } .billboard .content .embright iframe { width: 100%; height: auto !important; padding: 0; margin: 0; } .billboard .content .embshell { width: 60%; margin: 0; padding: 0; background: #FFF; float: left; } .billboard .content .embshell iframe { width: 100%; height: auto !important; padding: 0; margin: 0; } .billboard .content .embleft { width: 60%; margin: 0; padding: 0; background: #FFF; float: left; } .billboard .content .embleft iframe { width: 100%; height: auto !important; padding: 0; margin: 0; } .billboard>.content>.words { position: absolute; bottom: 5%; width: 100%; height: auto; z-index: 1000; } .billboard>.content>.words>.padding { position: relative; text-align: center; width: 60%; margin: 0 auto; color: #FFF;} .billboard>.content>.words>.padding>h2 { color: #FFF; font-size: 3em; font-family:"Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; text-shadow: 2px 2px 2px #000;} .billboard img { width: 100%; height: auto !important; } .billboard .content .words .padding .cms-button { position: relative; display: inline-block; margin-bottom: 10px;} .billboard .multibuttons {align-content: center; align-items: center; margin-top: 20px; } .billboard .multibuttons ul, .billboard .multibuttons ul li, .billboard .multibuttons ul li .multitext {list-style: none; padding: 0; margin: 0 auto 5px auto; text-align: center; } .billboard .multibuttons ul {width: 30%; padding: 20px; border: 1px solid #222; background:#FFF;} .billboard .multibuttons ul li .multitext .linktitle { width: auto !important; max-width: 40%;height: auto; margin: 10px auto; padding: 7px; color: #FFF; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; white-space: nowrap; font-size:.75em; line-height: .5em; text-transform:uppercase; letter-spacing: 1px; font-weight: 800; text-align: center;} .billboard .multibuttons ul li .multitext .linktitle a:link, .billboard .multibuttons ul li .multitext .linktitle a:visited { color: #fff; text-decoration: none; background: #ad1a1f; padding: 5px 10px; } .billboard .multibuttons ul li .multitext .linktitle a:hover, .billboard .multibuttons ul li .multitext .linktitle a:active { color: #fff; text-decoration: underline;background: #ad1a1f; padding: 5px 10px; } .billboard .multibuttons ul li .multitext .ctabutton>button.modal-open { margin: 0; padding: 0; line-height: 0.8em; } /* start Biography styles */ .biography { position: relative; width: 100%; height: auto; margin: 50px auto; padding: 0px; display: block;} .biography .content { max-width:1100px; margin: 0px auto;} .biography>.content>.imgleft { position: relative; display:inline; float: left; width: 30%; height: auto !important; overflow: hidden; margin: 0px 30px 0px 0px; z-index: 500;} .biography>.content>.imgshell { position: relative; display:inline; float: left; width: 30%; height: auto !important; overflow: hidden; margin: 0px 30px 0px 30px; z-index: 500;} .biography>.content>.imgleft img, .biography>.content>.imgshell img { width: 100%; height: auto; margin: 0px 30px 0px 0px;} .biography>.content>.imgright { position: relative; display:inline; float: right; width: 30%; height: auto !important; overflow: hidden; margin: 0px 0px 0px 30px; z-index: 500; } .biography>.content>.imgright img { width: 100%; height: auto; margin: 0px 0px 0px 10px;} .biography>.content>.imgcenter { position: relative; display:inline; float: left; width: 20%; overflow: hidden; margin: 0px auto; z-index: 500; } .biography>.content>.imgfull img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .biography>.content>.imgfull { position: relative; display:inline; float: left; width: 30%; overflow: hidden; margin: 0px auto; z-index: 500; } .biography>.content>.imgcenter img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .biography .content .embcenter { position: relative; width: 80%; margin: 0 auto 0px auto; } .biography .content .embcenter iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; } .biography .content .embfull { width: 100%; margin: 0 auto; padding: 0; background: #222; } .biography .content .embfull iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; } .biography .content .embright { width: 30%; margin: 0; padding: 0; background: #FFF; float: right; display: inline; } .biography .content .embright iframe { width: 100%; height: auto !important; padding: 0; margin: 0; min-height: 300px;} .biography .content .embshell { position: relative; width: 30%; display: inline; margin: 0px 30px 0px 0px; padding: 0; background: #FFF; float: left; z-index: 8000;} .biography .content .embshell iframe { width: 100%; height: 100%; padding: 0; min-height: 200px; margin: 0; z-index: 9000;} .biography .content .embleft { width: 30%; margin: 0; padding: 0; background: #FFF; float: left; } .biography .content .embleft iframe { width: 100%; height: auto !important; padding: 0; margin: 0; min-height: 300px; } .biography>.content>.words { position: relative; display: inline; width: 100%; padding: 0; margin: 0px; vertical-align: top; line-height: 30px; text-align: left; background: #f6f6f6; z-index: 499;} .biography>.content>.words>.padding { margin: 0 15%; padding: 0; z-index: 499; } .biography>.content>.words>.padding>h2 { font-weight: bold; text-transform: uppercase; letter-spacing: 2px; font-size: 1.2em; padding:0; margin:0; line-height:1em;} .biography>.content>.words>.padding>.subtitle { color: #222; font-size: 1.15em; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #999; z-index: 499;} .biography>.content>.words>.multibuttons { margin: 0 20%; padding: 0%; background: #FFF;} .biography>.content>.words>.multibuttons>ul { margin: 0; padding: 0; list-style: none;} .biography>.content>.words>.multibuttons>ul>li { margin: 0; padding: 2px; float:none;list-style: none;} .biography>.content>.words>.multibuttons>ul>li>.multimgshell {width:10%;margin:0;padding:0;} .biography>.content>.words>.multibuttons>ul>li>.multitext {width:80%;margin:0;padding:0;} .biography>.content>.words>.multibuttons>ul>li>.multimgshell>img { height:25px;width:auto; } .biography>.content>.words p { line-height: 32px;} .biography>.content>.words { padding: 0px; margin: 0px; } .biography>.content>.words>.padding>.ctabutton>button.modal-open { font-size: 1em; font-weight: 600; line-height: 0.5em; margin: 0px; padding: 0; text-transform: uppercase; letter-spacing: 2px; text-align: center; width: auto; color: #FFFFFF; float: none;} .biography>.content>.words>.padding>.ctabutton>button.modal-open>a:hover, .biography>.content>.words>.padding>.ctabutton>button.modal-open>a:active { text-decoration: underline; } .biography .content .embedshell { position: relative; display:inline; float: left; width: 25%; min-width: 0%; height: auto; overflow: hidden; margin: 10px 30px 0px 0px; } .biography .content .embedshell iframe { width: auto; height: auto; } .biography .textlinks { display: block; max-width: 100%; float: left;min-width: 0%; min-height: 0px; padding: 0px 0px 0px 0px; margin: 0px 0px 10px 0px; } .biography .textlinks .content { width: 100%; min-height: 100px; padding: 0px; margin: 0px 0px 0px 10px; border-right: 1px solid #CCC; } .biography .textlinks ul { margin: 0px 0px 0px 20px; } .biography.expandblock { min-height: 0px; } .biography .content .imgright .ctabutton { position: absolute; bottom: 10px; right: 10px; } /* start Callout/Quote styles */ .callout {position:relative; display:block;width:70%; text-align:center; margin: 50px auto; max-width: 800px; /*border-top: 1px solid #ededed;border-bottom: 1px solid #ededed;*/} .callout h2 {font-size: 1em; font-weight: 900; color:#222; text-transform: uppercase; letter-spacing: 3px; padding: 0 0 20px 0; border-bottom: 1px solid #222; margin: 0 0 20px 0; } .callout p { line-height: 36px; margin: 0 0 10px 0; } .callout .content .words .padding ul { position: relative; margin: 10px; padding: 0;} .callout .content .words .padding ul li { position: relative; margin: 0 0 10px 0; padding: 0;} .callout .content .words .padding ol { position: relative; margin: 10px auto; padding: 0; width:80%;} .callout .content .words .padding ol li { position: relative; margin: 0 0 15px 0; padding: 0; text-align: left;} .callout .content .words .padding .ctabutton button.modal-open { font-size: 0.9em; font-weight: 600; line-height: 0em; margin: 0px; padding: 0; text-transform: uppercase; letter-spacing: 2px; text-align: center; width: auto; color: #FFFFFF; float: none;} .callout .content .words .padding .ctabutton button.modal-open a { padding: 0; margin: 0; } .callout .content .words .padding .ctabutton button.modal-open a:hover, .callout .content .words .padding .ctabutton button.modal-open a:active { text-decoration: underline; } .callout .content .imgshell { position: relative; width: 30%; float: left; display: inline; margin: 0 1% 0 0; padding: 0; overflow: hidden; } .callout .content .imgleft { position: relative; width: 30%; float: left; display: inline; margin: 0 1% 0 0; padding: 0; overflow: hidden; } .callout .content .imgcenter { position: relative; width: 30%; float: left; display: inline; margin: 0 1% 0 0; padding: 0; overflow: hidden;} .callout .content .imgfull { position: relative; width: 30%; float: left; display: inline; margin: 0 1% 0 0; padding: 0;overflow: hidden; } .callout .content .imgright { position: relative; width: 30%; float: right; display: inline; margin: 0 0 0 1%; padding: 0; overflow: hidden; } .callout .content .imgshell img, .callout .content .imgleft img, .callout .content .imgcenter img, .callout .content .imgfull img, .callout .content .imgright img { width: 100%; height: auto !important; padding: 0; margin: 0; } .callout .content .embcenter { position: relative; width: 80%; margin: 0 auto 0px auto; } .callout .content .embcenter iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; } .callout .content .embfull { width: 100%; margin: 0 auto; padding: 0; background: #222; } .callout .content .embfull iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; } .callout .content .embright { width: 60%; margin: 0; padding: 0; background: #FFF; float: right; display: inline; } .callout .content .embright iframe { width: 100%; height: auto !important; padding: 0; margin: 0; } .callout .content .embshell { width: 60%; margin: 0; padding: 0 20px 0 0; background: #FFF; float: left; } .callout .content .embshell iframe { width: 100%; height: auto !important; min-height: 265px; padding: 0; margin: 0; } .callout .content .embleft { width: 60%; margin: 0; padding: 0 20px 0 0; background: #FFF; float: left; } .callout .content .embleft iframe { width: 100%; height: auto !important; min-height: 265px; padding: 0; margin: 0; } .callout .content .imgshell .caption, .callout .content .imgleft .caption, .callout .content .imgcenter .caption, .callout .content .imgfull .caption, .callout .content .imgright .caption { margin: 0; } .callout .content .words .multibuttons { position: relative; margin: 0; padding: 0;} .callout .content .words .multibuttons ul { position: relative; margin: 0; padding: 0; width: 100%} .callout .content .words .multibuttons ul li { position: relative; margin: 0; padding: 0; width: auto; text-align: left; list-style: none; display: inline-block; } .callout .content .words .multibuttons ul li .multitext{ position: relative; margin: 0; padding: 0; width: auto;} .callout .content .words .multibuttons ul li .multitext .linktitle { position: relative; margin: 5px; padding: 5px 15px; width: auto; background: #ad1a1f;} .callout .content .words .multibuttons ul li .multitext .linktitle a { color: #fff; text-decoration: none;font-size: 0.8em; font-weight: 600; line-height: 0em; text-transform: uppercase; letter-spacing: 2px; text-align: center; color: #FFFFFF; float: none;} .colcluster {position: relative; } .colcluster>.content {position: relative; } .colcluster>.content>.words>.multibuttons {position: relative; } .colcluster>.content>.words>.multibuttons>ul {position: relative; display: block; width: 100%;list-style: none;} .colcluster>.content>.words>.multibuttons>ul>li { position: relative; list-style: none; display: inline; padding: 0; margin: 0 0 50px 0; } .colcluster>.content>.words>.multibuttons>ul>li>.multitext { position: relative; list-style: none; display: inline; padding: 0; margin: 0 0 50px 0; } .colcluster>.content>.words>.multibuttons>ul>li>.multitext>.linktitle { position: relative; list-style: none; display: inline; padding: 0; margin: 0 0 50px 0; } .colcluster>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a { position: relative; list-style: none; display: inline; width: 25%; border: 1px solid #f6f6f6; padding: 1%; margin: 0 1% 20px 0; white-space: nowrap; } .column { position: relative; display: table; width: 100%; height: auto !important; padding: 0px; float: none; } .column .contentx4 { position: relative; display: table-cell; float: left; width: 25%; height: auto !important; padding:0%; vertical-align: top; } .acacol { position: relative; width:70%;float:left;margin-right: 5%; display:inline; } .acaside { position: relative; width:25%;float:left;display:inline; } /* start Events styles */ .events { position: relative; width:80%; max-width: 1200px; margin: 30px auto; padding: 0; align-content: center; } .events>.content .words .padding { position: relative; display:block; float: none; width: 100%; overflow: hidden; margin: 0 auto; padding: 0; text-align: center; } .events ul.hpevents { position: relative; width: 100%; background: #FFF; display: table; table-layout:auto !important; margin: 0 auto; padding: 0; height: auto; } .events ul.hpevents li { position: relative; list-style: none; display: table-cell !important; width: auto !important; min-width:19%; max-width:98%; border: 1px solid #222; padding: 1%; margin: 0; text-align:left; } .events ul.hpevents li .date {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 1.5em; color: #222; font-weight: 800; } .events ul.hpevents li .day {position: relative; display: inline; float: left; padding: 0; margin: 0; font-size: 0.9em; color: #ad1a1f; text-transform: uppercase; letter-spacing: 1px; } .events ul.hpevents li .eventtext { text-align: left; float: left; display: inline; font-size: 0.8em; padding: 10px 20px; line-height: 1.1em; } .events ul.hpevents li .eventtext .eventlink {font-size: 1.3em; font-weight: 800; text-align: left; } .events ul.hpevents li .eventtext button.modal-open {display: block;background: #fff;color: #ad1a1f;white-space: normal; text-align: left;line-height: 1em; font-size: 1.3em;text-transform: none;letter-spacing: 0px;font-weight: 800; margin: 0 0 10px 0;} .events ul.hpevents li .eventpic { position: relative; width: 25%; height: 150px; float: left; overflow: hidden; margin-right: 1%;} .events ul.hpevents li .eventpic img { width: auto;height:100%;} .events .ctabutton { width: auto; height: auto; margin: 10px auto 0 auto; padding: 10px; background: #ad1a1f; border: none; border-radius: 0; font-size: 0.70em; text-align: center; } .events .eventfeat { position: relative; display:block; width: 100%; height: auto; margin: 20px 0; padding: 0;} .events .eventfeat .eventfeatimg { position: relative; float: left; width: 48%; height: auto; margin: 0 2% 0 0; padding: 0;} .events .eventfeat .eventfeatimg img { width: 100%; height: auto; margin: 0; padding: 0;} .events .eventfeat .eventfeattext { position: relative; float: left; width: 48%; height: auto; margin: 0; padding: 1%;} .events .eventfeat .eventfeattext button.modal-open { text-align: left; text-transform: none; font-size: 1.4em; line-height: 1.4em; letter-spacing: 0px; margin: 10px 0; padding: 0;} .events .eventcol { position: relative; display:table; width: 98%; height: auto; overflow: visible; margin: 20px 0; padding: 1%; border: 1px solid #333; } .events .eventcol .eventcolimg { position: relative; float: left; width: 18%; height: auto; overflow: hidden; margin: 0 2% 0 0; padding: 0;} .events .eventcol .eventcolimg img { width: 100%; height: auto; margin: 0; padding: 0;} .events .eventcol .datebox { position: relative; float: left; width: 8%; height: auto; margin: 0; padding: 1%;} .events .eventcol .datebox .date {position: relative; width: 100%; padding: 0; margin: 0; font-size: 1.5em; color: #222; font-weight: 800; } .events .eventcol .datebox .day {position: relative; width: 100%; padding: 0; margin: 0; font-size: 0.8em; text-transform: uppercase; letter-spacing: 1px; color: #666; } .events .eventcol .eventcoltext { position: relative; float: left; width: 70%; height: auto; margin: 0; padding: 0;} .events .eventcol .eventcoltext button.modal-open { text-align: left; text-transform: none; font-size: 1.2em; line-height: 1.2em; letter-spacing: 0px; margin: 10px 0 0 0; padding: 0; color: #ad1a1f;} #events .modal-content .imgleft {position: relative;float: left;width: 40%;height: auto !important;display:inline;margin: 0 1% 0 0;} /* start Event Boxes styles */ .eventfeed { position: relative; display: inline-block; float: left; width: 70%; margin: 0;} .eventfeed .eventrow { position: relative; display: block;width: 95%; margin: 20px 0; padding: 2.5%; border: 2px solid #CCC; background: #f6f6f6; } .eventfeed .eventrow h3 { font-size: 1.4em; border: none; margin: 0 0 5px 0; color: #333; } .eventfeed .eventrow h3 a:link, .eventfeed .eventrow h3 a:visited { text-decoration: none;color: #333; } .eventside { position: relative; display: inline-block; float: left; width: 20%; border: 1px solid #CCC; margin: 20px 2%; padding: 2%; } .eventimg { position: relative; display: inline; float: left; width: 20%; height: auto; margin: 0 2% 0 0; padding: 0;} .eventimg img { position: relative; width: 100%; height: auto; margin: 0; padding: 0;} body#chinaevents .eventfeed { position: relative; display: inline-block; float: left; width: 100%; margin: 0;} ul.eventfeed { position: relative; width: 100%; display: block; height: auto !important; padding: 0 0; } ul.eventfeed li { list-style: none; position: relative; width: 100%; display: block; height: auto !important; min-height: 100px; padding: 0; margin: 10px 0; } ul.eventfeed li .eventdate { position: relative; width: 10%; display: inline; float: left; padding: 2%; background: #ad1a1f; color: #FFF; text-align: center;} ul.eventfeed li .eventarea { position: relative; width: 82%; display: inline; float: left; padding: 2%; background: #f6f6f6; } ul.eventfeed li .eventdate .date{ font-size: 1.5em; } .cal_small h2 {font-size: 1.4em;margin: 0 0 5px 0;color: #ad1a1f;} /* expand bars new 2/1 */ .expandbars { display: block; width: 65%; max-width: 960px; margin: 20px auto 30px auto; padding: 15px 15px 5px 15px; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; background-color: #FFF; } .expandbars .ctabutton>button>i.fas {display: inline; font-size: 1.0em; line-height: 0.5em; color: #222; margin: 0 5px; padding: 0; border-radius:0;} .expandbars .ctabutton>button>i.fas>a:link, .expandbars .ctabutton>button>i.fas>a:visited, .expandbars .ctabutton>button>i.fas>a:active, .expandbars .ctabutton>button>i.fas>a:hover {color: #222;} .expandbars .ctabutton {font-size: 1.0em; color: #222; background: #FFF; text-transform: none; letter-spacing:0px; } .expandbars .ctabutton button.modal-open { font-size: 1.2em; font-weight: 900; line-height: 1em; margin: 0px; padding: 0; text-align: left; display: inline; float:left; width: auto; color:#222; text-transform: none; letter-spacing:0px; font-family: "Source Sans Pro", "SourceSans", Trebuchet, Arial, sans-serif; white-space: normal; background: #FFF; } .expandbars .imgshell { position: relative; float: left; width: 20%; height: auto; margin: 0px; padding: 0px 10px 0px 0px; overflow: hidden; } .expandbars .imgshell img { width: 100%; height: auto; } .expandbars h2 {display: none;} /* expand bar modal pop up style */ .modal-content .imgleft {position: relative; float: left; width: 30%; height: auto !important; display: inline; margin: 0 2% 0 0; } .modal-content .imgleft img {position: relative; width: 100%; height: auto !important; } .modal-content .primgfeat {position: relative; float: left; width: 40%; height: auto !important; display: inline; margin: 0 2% 0 0; } .modal-content .primgfeat img {position: relative; width: 100%; height: auto !important; } .modal-content .primgright {position: relative; float: right; width: 40%; height: auto !important; display: inline; margin: 0 0 0 2%; } .modal-content .primgright img {position: relative; width: 100%; height: auto !important; } .modal-content .primgleft {position: relative; float: left; width: 40%; height: auto !important; display: inline; margin: 0 2% 0 0; } .modal-content .primgleft img {position: relative; width: 100%; height: auto !important; } /* expand tint */ .expandtint { display: block; width: 65%; max-width: 960px; margin: 20px auto 30px auto; padding: 15px 15px 5px 15px; border-top: 1px solid #fff; border-bottom: 1px solid #fff; background: #ededed; } .expandtint .ctabutton {font-size: 1.0em; background: #ededed; color: #222;} .expandtint .ctabutton>button>i.fas {display: inline; font-size: 1.0em; line-height: 0.5em; color: #222; margin: 0 5px; padding: 0; border-radius:0; background: #ededed;} .expandtint .ctabutton>button>i.fas>a:link, .expandtint .ctabutton>button>i.fas>a:visited, .expandtint .ctabutton>button>i.fas>a:active, .expandtint .ctabutton>button>i.fas>a:hover {color: #222;} .expandtint .ctabutton {font-size: 1.0em; color: #222; background: #ededed; text-transform: none; letter-spacing:0px; } .expandtint .ctabutton button.modal-open { font-size: 1.2em; font-weight: 900; line-height: 1em; margin: 0px; padding: 0; text-align: left; display: inline; float:left; width: auto; color:#222; text-transform: none; letter-spacing:0px; font-family: "Source Sans Pro", "SourceSans", Trebuchet, Arial, sans-serif; white-space: normal; background: #ededed; } .expandtint .imgshell { position: relative; float: left; width: 20%; height: auto; margin: 0px; padding: 0px 10px 0px 0px; overflow: hidden; } .expandtint .imgshell img { width: 100%; height: auto; } .expandtint h2 {display: none;} /* expand bar modal pop up style */ .modal-content .imgleft {position: relative; float: left; width: 30%; height: auto !important; display: inline; margin: 0 2% 0 0; } .modal-content .imgleft img {position: relative; width: 100%; height: auto !important; } /* expand indent */ .expandindent { display: block; width: 55%; max-width: 960px; margin: 20px auto 30px auto; padding: 10px 10px 0px 10px; border-top: 1px solid #666; border-bottom: 1px solid #666; background: #f6f6f6; } .expandindent .ctabutton {font-size: 1.0em; background: #f6f6f6; color: #333;} .expandindent .ctabutton>button>i.fas {display: inline; font-size: 1.0em; line-height: 0.5em; color: #333; margin: 0 5px; padding: 0; border-radius:0; background: #f6f6f6;} .expandindent .ctabutton>button>i.fas>a:link, .expandindent .ctabutton>button>i.fas>a:visited, .expandindent .ctabutton>button>i.fas>a:active, .expandindent .ctabutton>button>i.fas>a:hover {color: #333;} .expandindent .ctabutton {font-size: 1.0em; color: #333; background: #f6f6f6; text-transform: none; letter-spacing:0px; } .expandindent .ctabutton button.modal-open { font-size: 1.0em; font-weight: 900; line-height: 1em; margin: 0px; padding: 0; text-align: left; display: inline; float:left; width: auto; color:#333; text-transform: none; letter-spacing:0px; font-family: "Source Sans Pro", "SourceSans", Trebuchet, Arial, sans-serif; white-space: normal; background: #f6f6f6; } .expandindent .imgshell { position: relative; float: left; width: 20%; height: auto; margin: 0px; padding: 0px 10px 0px 0px; overflow: hidden; } .expandindent .imgshell img { width: 100%; height: auto; } .expandindent h2 {display: none;} /* expand bar modal pop up style */ .modal-content .imgleft {position: relative; float: left; width: 30%; height: auto !important; display: inline; margin: 0 2% 0 0; } .modal-content .imgleft img {position: relative; width: 100%; height: auto !important; } /* start Facts styles */ .facts>.content>.words>.padding>h2 { text-align: center; display:none; } .facts { position: relative; width:100%; margin: 30px auto; padding: 0; } .facts ul { position: relative; width: 100%; background: #FFF; display: block; margin: 0 auto; padding: 0; height: auto; } .facts .multibuttons ul { position: relative; width: 80%; height: auto;display: table; margin: 0 auto; padding: 0; } .facts .multibuttons ul li { position: relative; width: auto; height: auto; display: table-cell; margin: 0 auto; padding: 0; text-align: center; } .facts .multibuttons ul li .imgshell, .facts .multibuttons ul li .imgleft { position: absolute; top: 0; width: 100%; height: 50%; display:table-cell; } .facts .multibuttons ul li .imgright, .facts .multibuttons ul li .imgcenter { position: absolute; bottom: 0; width: 100%; height: 50%; display:table-cell; } .facts .multibuttons ul li .imgshell img, .facts .multibuttons ul li .imgleft img, .facts .multibuttons ul li .imgright img, .facts .multibuttons ul li .imgcenter img { position: relative; width: 100%; height: auto; } .facts .multibuttons ul li .multitext { position: relative; display:table-cell; margin: 0; padding: 0 2%; text-align: center; font-size: 1.5em; line-height: 1.2em; color: #ad1a1f;} .facts .multibuttons ul li .multitext strong { position: relative; margin: 0; padding: 0; text-align: center; font-size: 2em; line-height: 1.2em; font-weight: 800; color: #222;} .facts a:link, .facts a:visited {color: #FFF; text-decoration: none;} .facts a:active, .facts a:hover {color: #CCC; text-decoration: none;} /* start FAQ styles */ .faqs { position:relative; display:block; width:67%; max-width: 1000px; height: auto !important; overflow: visible; margin: 30px auto; padding: 0%; } .faqs .content {position:relative; display:block; width:100%; height: auto !important; overflow: visible; margin: 0px auto; padding: 0%; } .faqs p { line-height: 36px; margin: 0 0 10px 0; } .faqs .content .words { position:relative; display:block; width:100%; height: auto !important; overflow: visible; margin: 0px auto; padding: 0%;} .faqs .content .words .padding { position:relative; display:block; width:100%; height: auto !important; overflow: visible; margin: 0px auto; padding: 0%; } .faqs .content .words .padding h2 { font-size: 1.5em; margin-bottom: 20px; } .faqs .content .words .padding .ctabutton button.modal-open { font-size: 0.9em; font-weight: 600; line-height: 0em; margin: 0px; padding: 0; text-transform: uppercase; letter-spacing: 2px; text-align: center; width: auto; color: #FFFFFF; float: none;} .faqs .content .words .padding .ctabutton button.modal-open a { padding: 0; margin: 0; } .faqs .content .words .padding .ctabutton button.modal-open a:hover, .callout .content .words .padding .ctabutton button.modal-open a:active { text-decoration: underline; } .faqs .content .words .multibuttons { position: relative; margin: 0; padding: 0; display: block; overflow: visible; background: #f6f6f6;} .faqs .content .words .multibuttons ul { margin: 0; padding: 3% 4% 2% 3%; list-style: none; display: block; overflow: visible; border: 1px solid #f6f6f6;} .faqs .content .words .multibuttons ul li { position: relative; width: 100%; margin: 0 0 30px 0; padding: 0px 0 40px 0; list-style:none; border-bottom: 1px solid #555; font-size: 1.1em; white-space: normal; text-align: left; line-height: 1.1em;} .faqs .content .words .multibuttons ul li .multitext .linktitle { text-align: left; line-height: 1.1em;} .faqs .content .words .multibuttons ul li .linktitle { display:none; } .faqs .content .words .multibuttons ul li p { margin: 0; padding: 0 10px; float: left; } .faqs .content .words .multibuttons ul li .ctabutton { position: relative; float: left; margin: 0; padding: 0 0 0 10px; background: #f6f6f6; color: #222; text-transform:none; letter-spacing: 0px; text-align: left; line-height: 1.1em;} .faqs .content .words .multibuttons ul li .ctabutton button.modal-open { float: left; padding: 0px 0 0 0; background: #f6f6f6; color: #222; font-size: 1.3em; text-transform: none; letter-spacing: 0px; text-align: left; line-height: 1.1em;} .faqs .content .words .multibuttons ul li .multimgshell { position: relative; float: left; display: inline; width: 5%; height: auto; margin-top: 0; padding-top: 0; top: -13px;} .faqs .content .words .multibuttons ul li .multimgshell img { position: relative; width: 100%; height: auto;} /* start Four Column styles .fourcol { position: relative; display: table; width: 100%; max-width:1200px; height: auto; margin: 50px auto; padding: 0px; } .fourcol .content { position: relative; float:left; width: 100%; padding: 10px 0px; margin: 0px auto; } .fourcol>.content>.words { position: relative; width: 100%; max-width:1100px; display: block; margin: 0px auto;} .fourcol>.content>.words>.multibuttons { position: relative; width: 100%; max-width:1100px; display: block; margin: 0px auto;} .fourcol>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto 10px auto; width: 100%; } .fourcol>.content>.words>.multibuttons>ul>li { position: relative; width: 21%; display:inline; float: left; margin: 0 4% 20px 0; } .fourcol>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: 100%; height: auto; display:block; float:none; } .fourcol>.content>.words>.multibuttons>ul>li>.multimgleft, .fourcol>.content>.words>.multibuttons>ul>li>.multimgright, .fourcol>.content>.words>.multibuttons>ul>li>.multimgcenter, .fourcol>.content>.words>.multibuttons>ul>li>.multimgfull, .fourcol>.content>.words>.multibuttons>ul>li>.multimgshell { position: relative; width: 100%; height: auto; display:block; overflow: hidden; } .fourcol>.content>.words>.multibuttons>ul>li>.multimgleft img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgright img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgcenter img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgfull img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgshell img { position: relative; width: 100%; height: auto;} .fourcol>.content>.words>.padding>h2 { color: #222; font-weight: 900; font-size: 1.2em; padding:0; margin:0 auto; line-height:1em; text-align: center; text-transform: uppercase; letter-spacing: 3px; } .fourcol>.content>.words>.multibuttons>ul>li>.multitext>strong { color: #222; font-weight: 900; font-size: 1.2em; } .fourcol .content .words .multibuttons ul li .multitext a strong { font-weight: 900; font-size: 1.2em; } .fourcol.content.words blockquote.instagram-media {width: 100px; min-width: 100px; max-width: 120px;} */ /* start Four Column styles */ .fourcol { position: relative; width: 100%; height: auto; margin: 30px auto; padding: 0px 0; display: table; background: #FFF; } .fourcol .content { position: relative; width: 100%; max-width:1100px; height: auto; margin: 50px auto; padding: 0px; display: table;} .fourcol .content>.imgleft, .fourcol>.content>.imgshell { position: relative; display:table-cell; float: left; width: 29%; height: auto !important; overflow: hidden; margin: 0px 30px 0px 20px; padding: 1%; background: #FFF; } .fourcol .content>.imgleft img, .fourcol>.content>.imgshell img { width: 100%; height: auto; margin: 0px 30px 0px 0px;} .fourcol .content>.imgright { position: relative; display:table-cell; float: right; width: 29%; height: auto !important; overflow: hidden; margin: 0px 20px 0px 30px; padding: 1%; background: #FFF; } .fourcol .content>.imgright img { width: 100%; height: auto; margin: 0;} .fourcol>.content>.imgcenter { position: relative; display:inline; float: left; width: 30%; overflow: hidden; margin: 0px auto; } .fourcol>.content>.imgcenter img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .fourcol>.content>.imgfull { position: relative; display:inline; float: left; width: 90%; overflow: hidden; margin: 0px auto; } .fourcol>.content>.imgfull img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .fourcol .content .embleft, .fourcol>.content .embshell { position: relative; display:table-cell; float: left; width: 48%; height: auto !important; overflow: hidden; margin: 0px 30px 20px 0px; } .fourcol .content .embleft iframe, .fourcol>.content .embshell iframe { width: 100%; height: auto; min-height: 300px; margin: 0px 30px 0px 0px;} .fourcol .content .embright { position: relative; display:table-cell; float: right; width: 48%; height: auto !important; overflow: hidden; margin: 0px 0px 0px 30px; } .fourcol .content .embright iframe { width: 100%; height: auto; min-height: 300px; margin: 0px 0px 0px 30px;} .fourcol .content .embcenter { position: relative; display:inline; float: left; width: 70%; overflow: hidden; margin: 0px auto; } .fourcol .content .embcenter iframe { width: 100%; height: auto; min-height: 400px; margin: 0px 0px 0px 0px;} .fourcol .content .embfull { position: relative; display:block; float: none; width: 90%; overflow: hidden; margin: 0px auto; } .fourcol .content .embfull iframe { width: 100%; height: auto; min-height: 600px; margin: 0px 0px 0px 0px;} .fourcol>.content>.words { position: relative; width: 100%; max-width:1100px; display: block; margin: 0px auto;} .fourcol>.content>.words>.padding { text-align: center; line-height:1.9em; } .fourcol>.content>.words>.padding>p { line-height:1.9em; margin: 20px; } .fourcol>.content>.words>.padding>h2 { text-transform: uppercase; letter-spacing: 3px; text-align: center; color: #222; font-weight: 900; font-size: 1.4em; padding:0; margin:0 auto; line-height:1em; } .fourcol>.content>.words>.padding>.subtitle { margin:10px auto; text-align: center; font-size: 1.1em;} .fourcol>.content>.words>.multibuttons { position: relative; width: 100%; max-width:1100px; display: block; margin: 0px auto;} .fourcol>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto; padding: 0px; width: 100%; display: table; } .fourcol>.content>.words>.multibuttons>ul>li { position: relative; width: 21%; display:table-cell; float: left; margin: 2%; padding: 0;text-align: center; min-height: 100px; background: #F6F6F6; color: #222; } .fourcol .content .words .multibuttons .cms-button { margin: 15px auto; line-height: 1em;} .fourcol>.content>.words>.multibuttons>ul>li>.multimgshell, .fourcol>.content>.words>.multibuttons>ul>li>.multimgleft, .fourcol>.content>.words>.multibuttons>ul>li>.multimgright, .fourcol>.content>.words>.multibuttons>ul>li>.multimgcenter{ position: relative; width: 90%; height: auto; display:block; overflow: hidden; margin: 5%; } .fourcol>.content>.words>.multibuttons>ul>li>.multimgfull{ position: relative; width: 100%; height: auto; display:block; overflow: hidden; margin: 0;} .fourcol>.content>.words>.multibuttons>ul>li>.multimgleft img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgright img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgcenter img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgshell img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgfull img { position: relative; width: 100%; height: auto; padding: 0; margin: 0;} .fourcol>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: 96%; height: auto; margin: 2%; display:block; float:none; line-height: 1.8em; } .fourcol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle {font-size: 1.2em; text-align: center; color:#333;font-weight:900; margin: 10px auto 5px auto;} .fourcol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:link, .fourcol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:visited {text-decoration:none;} .fourcol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:active, .fourcol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:hover{text-decoration:underline;} .fourcol>.content>.words>.multibuttons>ul>li>.multitext button.modal-open {color: #FFF; text-decoration: none; font-weight: 800; } .fourcol>.content>.words>.multibuttons>ul>li>.multitext>div>ul { position: relative; text-align: left; width: 90%; margin: 0 auto; } .fourcol>.content>.words>.multibuttons>ul>li>.multitext>div>ul>li { text-align: left; margin: 0 0 10px 0; } .fourcol>.content>.words>.multibuttons>ul>li>.multitext>.ctabutton>button.modal-open { margin: 0; padding: 0; line-height: 1.1em; } .fourcol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>.ctabutton {display:inline-block;margin-top: 20px;} .fourcol>.content>.words>.multibuttons>ul>li>.multiembshell, .fourcol>.content>.words>.multibuttons>ul>li>.multiembleft, .fourcol>.content>.words>.multibuttons>ul>li>.multiembright, .fourcol>.content>.words>.multibuttons>ul>li>.multiembcenter { position: relative; width: 90%; height: auto; display:block; overflow: hidden; margin: 5%; } .fourcol>.content>.words>.multibuttons>ul>li>.multiembshell img { position: relative; width: 100%; height: 100%; display:block; max-height: 150px; } .fourcol>.content>.words>.multibuttons>ul>li>.multiembshell iframe, .fourcol>.content>.words>.multibuttons>ul>li>.multiembleft iframe, .fourcol>.content>.words>.multibuttons>ul>li>.multiembright iframe, .fourcol>.content>.words>.multibuttons>ul>li>.multiembcenter iframe { position: relative; width: 100%; height: 100%; display:block; max-height: 150px; } body#home .fourcol .multitext { text-align: center;} body#home .fourcol h2 { color: #333; font-weight: 900;font-size: 1.5em;} body#home .fourcol .ctabutton { display: block; margin: 0px auto;text-align: center; align-content: center; width: 10%; } /* heroshell Two column H2 and main image styles */ #heroshell { float:left; position: relative; top: 40px; width: 50%; max-height: 550px; min-height: 100px; overflow: hidden; z-index: 1000; margin: 0 0 20px 0; padding: 0;} #heroshell>.image>h1 { font-family: "Source Sans Pro", "SourceSans", Roboto, Arial, sans-serif; font-weight: 900;position: absolute; bottom: 7%; left: 0; text-transform: uppercase; letter-spacing: 3px; display: block; width: 100%; color: #fff; opacity: 0.9; font-size: 3em; line-height: 1em; text-align: center;min-height: 0px; overflow: visible; padding: 0px 0px 0px 0px; } #heroshell #title { position: relative; max-width: 1200px; width: auto !important; height: 100px; top: 0px; left: 0%; } #heroshell .image { width: 100%; height: auto !important; background: #222; z-index: 1000; padding: 0; margin: 0; max-height: 550px; min-height: 0px; overflow: hidden; } #heroshell .image img { width: 100%; height: auto !important; padding: 0; margin: 0; } #heroshell>.image>.caption { position: absolute; bottom: 0px; right: 15px; color: #FFF; font-size: 0.8em; line-height: 1.1em;} #heroshell>.introbuttons { position: absolute; bottom: 5%; left: 10%; right: 10%; margin: auto; width: 50%;height: auto; display: block; text-align: center; align-items: baseline;} #heroshell>.introbuttons .content { } #heroshell .introbuttons .buttons { display: block; width: 400px; float: right; border: none; padding: 5px 0px; margin: 20px 0px 0px 0px; background-color: transparent; color: #FFF; font-size: 0.8em; letter-spacing: 2px; text-transform: uppercase; font-weight: 900; ; } #heroshell .introbuttons .buttons a:link, #heroshell .introbuttons .buttons a:visited{ color: #FFF; text-decoration: none; padding: 5px 20px 5px 20px; } #heroshell .introbuttons .buttons a:active, #heroshell .introbuttons .buttons a:hover { color: #FFF; text-decoration: none; background: #ad1a1f;padding: 5px 20px 5px 20px;} #heroshell>#title>h1.pagetitle { font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: 900;position: relative; top: 0; left: 0%; text-transform: uppercase; letter-spacing: 3px; display: block; width: 100%; color: #222; font-size: 2em; line-height: 1em; text-align: center; height: 100px; overflow: visible;} /* start Highlight styles */ .highlight { position:relative; display:inline-block; width:100%; height: auto !important; margin: 30px auto; padding: 50px 0px; vertical-align: top; background: #f6f6f6; overflow: visible; } .highlight .content { position: relative; display:table; width: 100%; max-width: 1100px; overflow: visible; margin: 0 auto; align-content: center; vertical-align: top; } .highlight>.content>.imgshell { position: relative; display:table-cell; float: left; width: 50%; overflow: hidden; margin: 0 1% 0 0; } .highlight>.content>.imgleft { position: relative; display:table-cell; float: left; width: 50%; overflow: hidden; margin: 0 1% 0 0; } .highlight>.content>.imgcenter { position: relative; display:table-cell; width: 50%; overflow: hidden; margin: 0 1% 0 0; } .highlight>.content>.imgfull { position: relative; display:table-cell; width: 50%; overflow: hidden; margin: 0 1% 0 0; } .highlight>.content>.imgright { position: relative; display:table-cell; float: right; width: 50%; overflow: hidden; margin: 0 0 0 1%; } .highlight>.content>.imgshell img, .highlight>.content>.imgleft img, .highlight>.content>.imgcenter img, .highlight>.content>.imgfull img, .highlight>.content>.imgright img { width: 100%; height: auto !important; padding: 0; margin: 0px} .highlight>.content>.imgshell a { position: relative; display:block; width: 100%; margin: 0; } .highlight .content .embcenter { position: relative; width: 80%; margin: 0 auto 0px auto; background: #f6f6f6; } .highlight .content .embcenter iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; } .highlight .content .embfull { width: 100%; margin: 0 auto; padding: 0; background: #f6f6f6; } .highlight .content .embfull iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; } .highlight .content .embright { width: 50%; margin: 0; padding: 0; background: #f6f6f6; float: right; display: inline; } .highlight .content .embright iframe { width: 100%; height: auto !important; min-height: 350px; padding: 0; margin: 0 0 0 5% } .highlight .content .embshell { width: 50%; height: auto !important; margin: 0 5% 0 0; padding: 0; background: #f6f6f6; float: left; display: inline; } .highlight .content .embshell iframe { width: 100%; height: auto !important; min-height: 350px; padding: 0; margin: 0 5% 0 0; } .highlight .content .embleft { width: 50%; height: auto !important; margin: 0; padding: 0; background: #f6f6f6; float: left; display: inline; } .highlight .content .embleft iframe { width: 100%; height: auto !important; min-height: 350px; padding: 0; margin: 0 5% 0 0 } .highlight>.content>.words { position: relative; display: table-cell; text-align: center; width: 40%; max-width: 100%; margin: 0; padding: 0;} .highlight>.content>.words>.padding { position: relative; text-align: center; width: 90%; margin: 0 auto; } .highlight>.content>.words>.padding .subtitle { color: #222; font-size: 1.2em; font-weight: 600; line-height: 1.5em; } .highlight>.content>.words>.padding>.ctabutton { width: auto !important; margin: 0px auto 10px auto; padding: 12px 20px;text-align: center;} .highlight>.content>.words>.padding>.ctabutton>button.modal-open { font-weight: 600; line-height: 0em; margin: 0px; padding: 0; text-transform: uppercase; letter-spacing: 2px; text-align: center; width: auto !important; color: #FFFFFF; float: none;} .highlight>.content>.words>.padding>.ctabutton>button.modal-open>a:hover, .highlight>.content>.words>.padding>.ctabutton>button.modal-open>a:active { text-decoration: underline; } .highlight>.content>.words>.padding>ul { position: relative; text-align: left; width: 80%; margin: 0 auto; } .highlight>.content>.words>.padding>ul>li { text-align: left; margin-bottom: 7px; } .highlight>.content>.words>.padding>ol { position: relative; text-align: left; width: 80%; margin: 0 auto; } .highlight>.content>.words>.padding>ol>li { text-align: left; } .highlight .content .words>h2 { color: #ad1a1f; font-size: 1.3em; margin: 0; } .highlight .content .words .multibuttons { position: relative; display: block;text-align: center; width: auto !important; margin: 0;} .highlight>.content>.words>.multibuttons>ul { position: relative; text-align: center; width: 80%; margin: 0 auto; } .highlight .content .words .multibuttons li { list-style: none; position: relative; background: #ad1a1f;color: #FFF; text-align: center; width: auto !important; padding: 5px 0; margin: 0 0 10px 0; font-size: 0.9em; text-transform: uppercase; letter-spacing: 2px;} .highlight .content .words .multibuttons li a:link, .highlight .content .multibuttons li a:visited { background: #ad1a1f; color:#FFF; text-decoration: none; } .highlight .content .words .multibuttons li a:hover, .highlight .content .multibuttons li a:active { background: #ad1a1f; color:#FFF; text-decoration: underline; } .highlight .content .words .multibuttons li .multitext { display: inline-block; width: auto !important;} .highlight .content .words .multibuttons li .multitext .textmulti { display: none;} .highlight .content .words .multibuttons li .multitext .linktitle { font-size: 0.8em; font-weight: 800; display: inline;} .highlight .content .words .multibuttons li .multitext .ctabutton { width: auto !important; margin: 0 auto; color: #FFFFFF; float: none; display: inline-block; } .highlight .content .words .multibuttons li .multitext .ctabutton button.modal-open { font-size: 1em; line-height: 1em; margin: 0px; padding: 0; text-transform: uppercase; letter-spacing: 2px; text-align: center; width: auto; color: #FFFFFF; float: none; display: inline-block; } /* start Highlight Cluster styles*/ .highcluster { position:relative; display:block; width:100%; height: auto !important; overflow: visible; margin: 30px auto 50px auto; padding: 0px 0px 20px 0px; align-content: center;max-width: 1100px; } .highcluster>.content { position: relative; display:block; float: none; width: 100%; height: auto !important; overflow: visible; margin: 0 auto 10px auto; padding: 0;} .highcluster>.content>.imgshell { position: relative; width: 50%; float: left; display: inline; margin: 0 1% 1% 0; padding: 0; overflow: hidden; } .highcluster>.content>.imgleft { position: relative; width: 50%; float: left; display: inline; margin: 0 1% 1% 0; padding: 0; overflow: hidden; } .highcluster .content>.imgcenter { position: relative; width: 50%; float: left; display: inline; margin: 0 1% 1% 0; padding: 0; overflow: hidden; } .highcluster .content .imgfull { position: relative; width: 50%; float: left; display: inline; margin: 0 1% 1% 0; padding: 0;overflow: hidden; } .highcluster>.content>.imgright { position: relative; width: 50%; float: left; display: inline; margin: 0 0 1% 1%; padding: 0; overflow: hidden; } .highcluster .content .imgshell img, .highcluster .content .imgleft img, .highcluster .content .imgcenter img, .highcluster .content .imgfull img, .highcluster .content .imgright img { width: 100%; height: auto !important; padding: 0; margin: 0; } .highcluster .content .embcenter { width: 60%; height: auto !important; margin: 0; padding: 0; background: #FFF; float: left; display: inline; } .highcluster .content .embcenter iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; } .highcluster .content .embfull { width: 60%; height: auto !important; margin: 0; padding: 0; background: #FFF; float: left; display: inline; } .highcluster .content .embfull iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; } .highcluster .content .embright { width: 60%; margin: 0; padding: 0; background: #FFF; float: right; display: inline; } .highcluster .content .embright iframe { width: 100%; height: auto !important; min-height: 300px; padding: 0; margin: 0; } .highcluster .content .embshell { width: 60%; height: auto !important; margin: 0; padding: 0; background: #FFF; float: left; display: inline; } .highcluster .content .embshell iframe { width: 100%; height: auto !important; min-height: 300px; padding: 0; margin: 0; } .highcluster .content .embleft { width: 60%; height: auto !important; margin: 0; padding: 0; background: #FFF; float: left; display: inline; } .highcluster .content .embleft iframe { width: 100%; height: auto !important; min-height: 400px; padding: 0; margin: 0; } .highcluster>.content>.words { position: absolute; top: 0px; display:block; float: none; width: 100%; height: auto !important; min-height: 365px; overflow: visible; margin: 0; padding: 0; } .highcluster>.content>.words>.padding { position: absolute; bottom: 5px; text-align: left; width: 40%; margin: 1%; padding: 1%; display: inline-block; color: #FFF; z-index: 1001; background:url(https://www.bard.edu/images/tints/80black.png) repeat; } .highcluster>.content>.words>.padding p { margin: 0; padding: 0; } .highcluster>.content>.words>.padding>.ctabutton { display: inline; float: left; width: auto; margin: 10px 0 0 0; padding: 10px;font-size: 0.8em; line-height: 0.3em; background: #ededed; } .highcluster>.content>.words>.padding>.ctabutton>a:link, .highcluster>.content>.words>.padding>.ctabutton>a:visited { color: #ad1a1f; text-decoration: none;} .highcluster>.content>.words>.padding>.ctabutton>a:hover { color: #ad1a1f; text-decoration: underline;} .highcluster>.content>.words>.padding>ul { position: relative; text-align: left; width: 80%; margin: 0 auto; } .highcluster>.content>.words>.padding>ul>li { text-align: left; } .highcluster>.content>.words>.padding>h2 { color: #FFF; margin: 0; } .highcluster>.content>.words>.multibuttons { position: absolute; top: 0; right: 0; width: 50%; height: auto !important; float: right; margin: 0; overflow: visible } .highcluster>.content>.words>.multibuttons>ul { position: relative; text-align: left; width: 96%; margin: 0 auto; } .highcluster>.content>.words>.multibuttons>ul>li { min-height: 85px; display: block; list-style: none; position: relative; color: #333; text-align: left; width: auto !important; padding: 5px 0; margin: 0 0 25px 0; font-size: 0.9em; overflow: visible; clear:both; } .highcluster>.content>.words>.multibuttons>li a:link, .highcluster>.content>.words>.multibuttons>li a:visited { color:#ad1a1f; text-decoration: none; background: none; } .highcluster>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: 60%; height: auto !important; margin: 0 auto;float: left; display: inline; overflow: visible; } .highcluster>.content>.words>.multibuttons>ul>li>.multitext>.linktitle {position: relative; float: none; display: block; background: none; font-size: 1.25em; line-height: 1.0em; text-align: left; color:#ad1a1f;font-weight:900; margin: 0;} .highcluster>.content>.words>.multibuttons>ul>li>.multitext>p { margin: 0; padding: 0;} .highcluster>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:link,.highcluster>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:visited {color: #ad1a1f; text-decoration: none;} .highcluster>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:active,.highcluster>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:hover {color: #ad1a1f; text-decoration: underline; font-weight: 800; background: #ededed;} .highcluster>.content .words>.multibuttons>li>.multitext>.textmulti { } .highcluster>.content>.words>.padding>.ctabutton>button.modal-open { font-size: 0.8em; line-height: 1em; margin: 0px; padding: 0; text-transform: uppercase; letter-spacing: 2px; text-align: center; width: auto; color: #ad1a1f; float: none;} .highcluster>.content>.words>.multibuttons>ul>li>.multimgshell { position: relative; width: 30%; height: auto !important; margin: 0 auto;float: left; display: inline; overflow: visible } .highcluster>.content>.words>.multibuttons>ul>li>.multimgshell img{ width: 90%; margin: 0 auto;float: left; display: inline; } /* start Highlight Facts styles*/ .highfacts { position:relative; display:block; width:100%; height: auto !important; overflow: visible; margin: 30px auto; padding: 0px; align-content: center;max-width: 1100px; } .highfacts>.content { position: relative; display:block; float: none; width: 100%; overflow: hidden; margin: 0 auto; padding: 0;} .highfacts>.content>.imgshell { position: relative; width: 50%; float: left; display: inline; margin: 0 1% 1% 0; padding: 0; overflow: hidden; } .highfacts>.content>.imgleft { position: relative; width: 50%; float: left; display: inline; margin: 0 1% 1% 0; padding: 0; overflow: hidden; } .highfacts .content>.imgcenter { position: relative; width: 50%; float: left; display: inline; margin: 0 1% 1% 0; padding: 0; overflow: hidden; } .highfacts .content .imgfull { position: relative; width: 50%; float: left; display: inline; margin: 0 1% 1% 0; padding: 0;overflow: hidden; } .highfacts>.content>.imgright { position: relative; width: 50%; float: right; display: inline; margin: 0 0 1% 1%; padding: 0; overflow: hidden; } .highfacts .content .imgshell img, .highfacts .content .imgleft img, .highfacts .content .imgcenter img, .highfacts .content .imgfull img, .highfacts .content .imgright img { width: 100%; height: auto !important; padding: 0; margin: 0; } .highfacts>.content>.imgshell>.caption { margin: 0; padding: 0; text-align: left; } .highfacts>.content>.embshell { position: relative; width: 50%; float: left; display: inline; margin: 0 1% 1% 0; padding: 0; overflow: hidden; } .highfacts>.content>.embleft { position: relative; width: 50%; float: left; display: inline; margin: 0 1% 1% 0; padding: 0; overflow: hidden; } .highfacts .content>.embcenter { position: relative; width: 50%; float: left; display: inline; margin: 0 1% 1% 0; padding: 0; overflow: hidden; } .highfacts .content .embfull { position: relative; width: 50%; float: left; display: inline; margin: 0 1% 1% 0; padding: 0;overflow: hidden; } .highfacts>.content>.embright { position: relative; width: 50%; float: right; display: inline; margin: 0 0 1% 1%; padding: 0; overflow: hidden; } .highfacts .content .embshell iframe, .highfacts .content .embleft iframe, .highfacts .content .embcenter iframe, .highfacts .content .embfull iframe, .highfacts .content .embright iframe { width: 100%; height: auto !important; min-height: 300px; padding: 0; margin: 0; } .highfacts>.content>.imgshell>.caption { margin: 0; padding: 0; text-align: left; } .highfacts>.content>.words { position: absolute; top: 0px; display:block; float: none; width: 100%; height: auto !important; min-height: 365px; overflow: visible; margin: 0; padding: 0; } .highfacts>.content>.words>.padding { position: absolute; bottom: 5px; text-align: left; width: 40%; margin: 1%; padding: 1%; display: inline-block; color: #FFF; z-index: 1001; background:url(https://www.bard.edu/images/tints/80black.png) repeat; } .highfacts>.content>.words>.padding p { margin: 0; padding: 0; } .highfacts>.content>.words>.padding>.ctabutton { display: inline; float: left; width: auto; margin: 10px 0 0 0; padding: 10px;font-size: 0.8em; line-height: 0.3em; background: #ededed; } .highfacts>.content>.words>.padding>.ctabutton>a:link, .highfacts>.content>.words>.padding>.ctabutton>a:visited { color: #ad1a1f; text-decoration: none;} .highfacts>.content>.words>.padding>.ctabutton>a:hover { color: #ad1a1f; text-decoration: underline; } .highfacts>.content>.words>.padding>ul { position: relative; text-align: left; width: 80%; margin: 0 auto; } .highfacts>.content>.words>.padding>ul>li { text-align: left; } .highfacts>.content>.words>.padding>h2 { color: #FFF; margin: 0; } .highfacts>.content>.words>.multibuttons { position: absolute; top: 0; right: 0; width: 50%; float: right;margin: 0; } .highfacts>.content>.words>.multibuttons>ul { position: relative; text-align: left; width: 96%; margin: 0 auto; } .highfacts>.content>.words>.multibuttons>ul>li { position: relative; width: 40%; min-height: 130px; display: inline-block; list-style: none;color: #333; text-align: center; padding: 3%; margin: 0 1% 2% 0; font-size: 1.2em; align-content: center; background: #f6f6f6; } .highfacts>.content>.words>.multibuttons>li a:link, .highfacts>.content>.words>.multibuttons>li a:visited { color:#ad1a1f; text-decoration: none; background: none; } .highfacts>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: 90%; margin: 0 auto;text-align: center; line-height: 2.0em; } .highfacts>.content>.words>.multibuttons>ul>li>.multitext>.linktitle {position: relative; float: none; display: block; background: none; font-size: 3em; text-align: center; color:#ad1a1f;font-weight:900; margin: 20px 0;} .highfacts>.content>.words>.multibuttons>ul>li>.multitext>p { margin: 0; padding: 0;} .highfacts>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:link,.highfacts>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:visited {color: #ad1a1f; text-decoration: none;} .highfacts>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:active,.highfacts>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:hover {color: #ad1a1f; text-decoration: underline; font-weight: 800; background: #ededed;} .highfacts>.content .words>.multibuttons>li>.multitext>.textmulti { } .highfacts>.content>.words>.padding>.ctabutton>button.modal-open { font-size: 0.8em; line-height: 1em; margin: 0px; padding: 0; text-transform: uppercase; letter-spacing: 2px; text-align: center; width: auto; color: #ad1a1f; float: none;} .highfacts>.content>.words>.multibuttons>ul>li>.multimgshell { position: relative; width: 30%; margin: 0 auto;float: left; display: inline; } .highfacts>.content>.words>.multibuttons>ul>li>.multimgshell img{ width: 90%; margin: 0 auto;float: left; display: inline; } /* start FAQ styles */ .imglinks { position:relative; display:block; width:67%; max-width: 1000px; height: auto !important; overflow: visible; margin: 30px auto; padding: 0%; } .imglinks .content {position:relative; display:block; width:100%; height: auto !important; overflow: visible; margin: 0px auto; padding: 0%; } .imglinks p { line-height: 36px; margin: 0 0 10px 0; } .imglinks .words { position:relative; display:block; width:100%; height: auto !important; overflow: visible; margin: 0px auto; padding: 0%;} .imglinks .words .padding { position:relative; display:block; width:100%; height: auto !important; overflow: visible; margin: 0px auto; padding: 0%; } .imglinks .words .padding h2 { font-size: 1.5em; margin-bottom: 20px; } .imglinks .words .padding .ctabutton button.modal-open { font-size: 0.9em; font-weight: 600; line-height: 0em; margin: 0px; padding: 0; text-transform: uppercase; letter-spacing: 2px; text-align: center; width: auto; color: #FFFFFF; float: none;} .imglinks .words .padding .ctabutton button.modal-open a { padding: 0; margin: 0; } .imglinks .words .padding .ctabutton button.modal-open a:hover, .callout .content .words .padding .ctabutton button.modal-open a:active { text-decoration: underline; } .imglinks .words .multibuttons { position: relative; margin: 0; padding: 0; background: #FFF; display: block; overflow: visible;} .imglinks .words .multibuttons ul { margin: 0; padding: 3% 4% 2% 3%; list-style: none; display: table; overflow: visible; border: 1px solid #f6f6f6; } .imglinks .words .multibuttons ul li { position: relative; width: 24%; display: table-cell; float: left; margin: 0 1% 30px 0; padding: 0px 0 40px 0; list-style:none; font-size: 1.1em; text-align: left; line-height: 1.1em;} .imglinks .words .multibuttons ul li .multitext .linktitle { text-align: left; line-height: 1.1em;} .imglinks .words .multibuttons ul li .linktitle { display:none; } .imglinks .words .multibuttons ul li p { margin: 0; padding: 0 10px; float: left; } .imglinks .words .multibuttons ul li .ctabutton { position: relative; float: left; margin: 0; padding: 0 0 0 10px; background: #FFFFFF; color: #222; text-transform:none; letter-spacing: 0px; text-align: left; line-height: 1.1em;} .imglinks .words .multibuttons ul li .ctabutton button.modal-open { float: left; padding: 0px 0 0 0; background: #FFFFFF; color: #222; font-size: 1.3em; text-transform: none; letter-spacing: 0px; text-align: left; line-height: 1.1em;} .imglinks .words .multibuttons ul li .multimgshell { position: relative; float: left; display: inline; width: 50%; height: auto; margin-top: 0; padding-top: 0; top: -13px;} .imglinks .words .multibuttons ul li .multimgshell img { position: relative; width: 100%; height: auto;} .includenews { position: relative; width: 100%; max-width: 1000px; display: block;} .includenews .newscol { width: 33%; margin: 0 2% 0 0; display: inline; float: left; } .includenews .eventcol { width: 28%; margin: 0; padding: 1%; display: inline; float: left; border: 1px solid #222; } .inspire { position: relative; display: block; width: 75%; height: auto; margin: 30px auto; padding: 0; } .inspire h3 { text-align: center; font-size: 1.3em; font-weight: bold; font-family: Arial Black, sans-serif; } .inspire h4 { text-align: center; font-size: 1.6em; font-weight: normal; line-height: 1.8em; } .inspire .rule { width: 15%; border-bottom: 2px solid #ad1a1f; margin: 10px auto; } /* start INCLUDE Montage styles */ .montage>h2 { text-align: center; } .montage { position: relative; width:100%; height: auto; margin: 0 auto 50px auto; padding: 0; overflow: visible;} .montage .multibuttons ul { position: relative; width: 100%; height: auto; background: #222; display: table; margin: 0 auto; padding: 0; overflow: visible; } .montage .multibuttons ul li { position: relative; width: 20%; display: table-cell; margin: 0 auto; padding: 0; background: #222; overflow: visible; } .montage .multibuttons ul li .multitext { position: relative; display:table-cell; width:100%; margin: 0 auto; padding: 0; text-align: center; font-size: 1.7em; line-height: 1.2em;color: #FFF;} .montage .multibuttons ul li .imgshell, .montage .multibuttons ul li .imgleft { position: relative; width: 100%; height: 100%; display:table-cell; } .montage .multibuttons ul li .imgright, .montage .multibuttons ul li .imgcenter { position: relative; width: 100%; height: 100%; display:table-cell; } .montage .multibuttons ul li .imgshell img, .montage .multibuttons ul li .imgleft img, .montage .multibuttons ul li .imgright img, .montage .multibuttons ul li .imgcenter img { position: relative; width: 100%; height: auto; } .montage a:link, .montage a:visited {color: #FFF; text-decoration: none;} .montage a:active, .montage a:hover {color: #CCC; text-decoration: none;} /* start One Column styles */ .onecol { position: relative; width: 100%; height: auto; margin: 30px auto; padding: 0px 0; display: inline; float: left; clear:none !important; background: #FFF; } .onecol .content { position: relative; width: 100%; height: auto; margin: 0 auto; padding: 1%; display: table; background: #FFF; } .onecol>.content>.words { position: relative; width: 100%; max-width: 1100px; display: block; margin: 0px auto; float: none; padding: 0;} .onecol>.content>.words>.padding { position: relative; text-align: left; width: 18%; float: left; display: inline; padding: 2% 2% 2% 0; } .onecol>.content>.words>.padding>p { line-height:1.5em; margin: 5px 0; } .onecol>.content>.words>.padding>h2 { text-transform: none; letter-spacing: 0px; text-align: left; color: #ad1a1f; font-weight: 900; font-size: 1.4em; padding: 20px 0; margin:0 auto; line-height:1em; } .onecol>.content>.words>.padding>.subtitle { margin:0; text-align: left; font-size: 1.1em;color: #222;} .onecol>.content>.words>.padding>.ctabutton { position: relative; margin:10px auto; text-align: center; float: none; } .onecol>.content>.imgshell { display:none;} .onecol>.content>.words>.multibuttons { position: relative; width: 80%; max-width:80%; display: inline; float: left; margin: 0px; padding: 0; } .onecol>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto; width: 100%; display: block; } .onecol>.content>.words>.multibuttons>ul>li { position: relative; width: 90%; display:table; float: none; margin: 0%; padding: 2% 5% 3% 5%;height: auto; vertical-align: top;background: #333; } .onecol>.content>.words>.multibuttons>ul>li>.multimgshell {position: relative; width: 25%; height: auto; overflow: hidden; padding: 0; margin: 0px 10px 0px 0;display: table-cell; } .onecol>.content>.words>.multibuttons>ul>li>.multimgleft {position: relative; width: 25%; height: auto; overflow: hidden; padding: 0; margin: 0 10px 0px 0;display: table-cell; } .onecol>.content>.words>.multibuttons>ul>li>.multimgfull{ position: relative; width: 100%; height: auto; overflow: hidden; padding: 0; margin: 0 5% 0 0;display: block; float: none;} .onecol>.content>.words>.multibuttons>ul>li>.multimgshell img, .onecol>.content>.words>.multibuttons>ul>li>.multimgleft img, .onecol>.content>.words>.multibuttons>ul>li>.multimgfull img { position: relative; width: 100%; height: auto !important; } .onecol>.content>.words>.multibuttons>ul>li>.multimgright { position: relative; width: 35%; height: auto; max-height: 225px; overflow: hidden; padding: 0; margin: 0 0 10px 20px;display: table-cell; } .onecol>.content>.words>.multibuttons>ul>li>.multimgright img { position: relative; width: 100%; height: auto !important; } /* one-col multiimg center modified for tall/vertical/portrait images */ .onecol>.content>.words>.multibuttons>ul>li>.multimgcenter {position: relative; width: 20%; height: auto; max-height: 230px; overflow: hidden; padding: 0; margin: 5px 20px 5px 0; display: table-cell; float: left;} .onecol>.content>.words>.multibuttons>ul>li>.multimgcenter img { position: relative; width: 100%; height: 100%; } .onecol>.content>.words>.multibuttons>ul>li>.multimgshell iframe {width: 100%; height: 100%; } .onecol>.content>.words>.multibuttons>ul>li>.multiembshell, .onecol>.content>.words>.multibuttons>ul>li>.multiembleft, .onecol>.content>.words>.multibuttons>ul>li>.multiembright, .onecol>.content>.words>.multibuttons>ul>li>.multiembcenter, .onecol>.content>.words>.multibuttons>ul>li>.multiembfull{ position: relative; width: 100%; height: auto; overflow: hidden; padding: 0; margin: 0;display: block; float: none;} .onecol>.content>.words>.multibuttons>ul>li>.multiembshell iframe, .onecol>.content>.words>.multibuttons>ul>li>.multiembleft iframe, .onecol>.content>.words>.multibuttons>ul>li>.multiembright iframe, .onecol>.content>.words>.multibuttons>ul>li>.multiembcenter iframe, .onecol>.content>.words>.multibuttons>ul>li>.multiembfull iframe { position: relative; width: 100%; height: auto !important; min-height: 265px; } .onecol>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: auto !important; min-width: 50%; padding: 2%; margin: 0; font-size: 0.95em; line-height: 1.7em; display: table-cell; color: #FFF; vertical-align:top; text-align: left; } .onecol>.content>.words>.multibuttons>ul>li>.multitext .cms-button {margin: 10px 0; } .onecol>.content>.words>.multibuttons>ul>li>.multitext .cms-caption {color: #ededed;} .onecol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle {font-size: 1.3em; text-align: left; color:#FFF;font-weight:900; margin: 0px; padding:0; text-transform: uppercase; } .onecol>.content>.words>.multibuttons>ul>li>.multitext>p {margin: 20px 0px 5px 0px; padding:0; } .onecol>.content>.words>.multibuttons>ul>li>.multitext a:link, .onecol>.content>.words>.multibuttons>ul>li>.multitext a:visited {text-decoration:underline;color:#FFF;} .onecol>.content>.words>.multibuttons>ul>li>.multitext>a:active, .onecol>.content>.words>.multibuttons>ul>li>.multitext>a:hover{text-decoration:underline;color:#FFF;} .onecol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:link, .onecol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:visited {text-decoration:none;color:#FFF;} .onecol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:active, .onecol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:hover{text-decoration:underline;color:#FFF;} /* ----- Styles for PR Fac & student Profiles ---- */ #profile { width: 50%; padding: 2%; margin: 20px auto; border: 1px solid #333; } #profile .profimg { position: relative; display: inline; width: 24%; height: auto; float: left; margin: 0px 2% 5px 0px; } #profile .profimg img { width: 100%; height: auto; } #profile .proftext { position: relative; display: inline; width: 74%; height: auto; float: left; margin: 0px; } #profile h2 {text-transform: uppercase;letter-spacing: 3px;text-align: center;color: #222;font-weight: 900;font-size: 1.4em;padding: 0;margin: 0 auto 10px auto;line-height: 1em;} /* start Section Header styles*/ .section { position:relative; display:block; width:70%; height: auto !important; overflow: visible; margin: 50px auto 0px auto; padding: 0px; align-content: center;max-width: 1100px; background:url(https://www.bard.edu/images/line.png) repeat-x; } .section>.content { position: relative; display:block; float: none; width: 100%; overflow: hidden; margin: 0 auto; padding: 0; text-align: center; } .section>.content .imgshell { position: relative; width: 50%; height: auto; margin: 2% auto 1% auto;} .section>.content>.words>.padding>h2 { position: relative; display: inline-block; text-align: center; height: 30px; width: auto !important; text-transform: uppercase; letter-spacing: 2px; font-size: 1.2em; line-height: 1em; padding: 5px 10px; margin: 0;background: #FFF; color: #333; clear: both;} .section>.content>.words>.padding>.ctabutton { position: relative; display: table; text-align: center; width: auto !important; margin: 10px auto;} .section>.content p { position: relative; width: 76%; background: #ededed; margin: 10px 10%; padding: 2%; } .section>.content>.words { position: relative; display:block; float: none; width: 100%; overflow: hidden; margin: 0 auto; padding: 0; text-align: center; } .section>.content>.words>.padding { position: relative; display:block; float: none; width: 100%; overflow: hidden; margin: 0 auto; padding: 0; text-align: center; } .section>.content>.words>.padding .subtitle { font-size: 1.05em; line-height: 1.5em; font-weight: 200; margin: 0 5%; color: #333;} .section .multibuttons { position: relative; width: 90%; height: auto !important; margin: 0px auto 0px auto; padding: 0; z-index: 100; } .section .multibuttons ul { display: block; position: relative; width: 100%; margin: 0px auto; align-items: center; text-align: center; } .section .multibuttons ul li { list-style: none; display: inline-block; } .section .multibuttons ul li .multitext .linktitle { position: relative; display:inline; float: left; background: #ad1a1f; margin: 5px; padding: 1px 15px; text-align: center; } .section .multibuttons ul li .multitext .linktitle a { color: #FFF; text-decoration: none; text-transform: uppercase; letter-spacing: 2px; font-size: 0.8em; font-weight: bold; } /* Center/Magnified Slideshow Styles */ .slideshow { position:relative; display:block; width:90%; height: auto !important; overflow: visible; margin: 50px auto; padding: 0px; align-content: center;max-width: 1100px; } .slideshow > .content { position: relative; display:block; float: none; width: 100%; overflow: hidden; margin: 0 auto; padding: 0; text-align: center; } /* start Subhead styles*/ .subhead { position:relative; display:block; width:90%; max-width: 1100px; height: auto !important; overflow: visible; margin: 20px auto 20px auto; padding: 20px 0px 30px 0px; align-content: center;border-top: 1px solid #999; border-bottom: 1px solid #999; } .subhead>.content { position: relative; display:block; float: none; width: 100%; overflow: hidden; margin: 0 auto; padding: 0; text-align: center; } .subhead>.content>.words>.padding>h2 { position: relative; display: inline-block; text-align: left; height: 30px; width: auto !important; text-transform: uppercase; letter-spacing: 2px; font-size: 1.2em; line-height: 1em; padding: 5px 10px; margin: 0;background: #FFF; color: #333; clear: both;} .subhead>.content>.words>.padding>.ctabutton { position: relative; display: block; text-align: center; } .subhead>.content p { position: relative; display: block; width: 76%; background: #ededed; margin: 10px 10%; padding: 2%; } .subhead>.content>.words { position: relative; display:block; float: none; width: 100%; overflow: hidden; margin: 0 auto; padding: 0; text-align: left; } .subhead>.content>.words>.padding { position: relative; display:block; float: none; width: 100%; overflow: hidden; margin: 0 auto; padding: 0; text-align: left; } .subhead>.content>.words>.padding .subtitle { font-size: 1.05em; line-height: 1.5em; font-weight: 200; margin: 0 5%; color: #333;} .subhead>.content>.words>.multibuttons { display: block; } .subhead>.content>.words>.multibuttons>ul { display: block; width: 100%; padding: 0; margin: 10px; } .subhead>.content>.words>.multibuttons>ul>li { list-style: none; display: inline; } .subhead>.content>.words>.multibuttons>ul>li>.multitext { list-style: none; display: inline; float: left; margin: 0 20px 10px 0; } .subhead>.content>.words>.multibuttons>ul>li>.multitext>.linktitle { position: relative; display:inline; float: none; background: #f6f6f6; border: 1px solid #CCC; margin: 10px auto; padding: 1px 15px 3px 15px; text-align: center; } .subhead>.content>.words>.multibuttons ul li>.multitext>.linktitle a { color: #222; text-decoration: none; text-transform: uppercase; letter-spacing: 2px; font-size: 0.7em; font-weight: bold; } /* start Spotlight/Profile styles */ .spotlight { position:relative; display:table; width:80%; max-width: 1200px; min-height: 300px; background:#222; padding: 5% 10%; margin: 50px auto; align-content: center; } .spotlight>.content { width: 100%; } .spotlight>.content>.imgshell, .spotlight>.content>.imgleft { position: relative; float:left; display:block; width:45%; margin-right: 3%;z-index:501;} .spotlight>.content>.imgright { position: relative; float:right; display:block; width:45%; margin-left: 3%; } .spotlight>.content>.imgcenter {float:none;width:100%;margin: 0px auto;} .spotlight>.content>.imagefull {display:block;width: 100%; z-index: 500; position: absolute; top: 0; left: 0; overflow: hidden; } .spotlight>.content>.imgleft img,.spotlight>.content>.imgshell img,.spotlight>.content>.imgright img,.spotlight>.content>.imagecenter img,.spotlight>.content>.imagefull img {width: 100%; height: auto; } .spotlight .content .embcenter { position: relative; width: 80%; margin: 0 auto 0px auto; background: #222; } .spotlight .content .embcenter iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; background: #222; } .spotlight .content .embfull { width: 100%; margin: 0 auto; padding: 0; background: #222; } .spotlight .content .embfull iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; background: #222; } .spotlight .content .embright { width: 50%; margin: 0; padding: 0; background: #222; float: right; display: inline; } .spotlight .content .embright iframe { width: 100%; height: auto !important; min-height: 340px; padding: 0; margin: 0 0 0 5%; background: #222; } .spotlight .content .embshell { width: 50%; height: auto !important; margin: 0 0 0 0; padding: 0; background: #222; float: left; display: inline; } .spotlight .content .embshell iframe { width: 100%; height: auto !important; min-height: 340px; padding: 0; margin: 0 5% 0 0; background: #222; } .spotlight .content .embleft { width: 50%; height: auto !important; margin: 0; padding: 0; background: #222; float: left; display: inline; } .spotlight .content .embleft iframe { width: 100%; height: auto !important; min-height: 340px; padding: 0; margin: 0 5% 0 0; background: #222; } .spotlight .caption { color: #FFFFFF; margin: 0; text-align: left;} .spotlight>.content>.words { position:relative; display:block; width:50%; height:auto; float: left; overflow: visible; margin: 0px auto; padding: 0%; text-align: center; color: #FFF; z-index: 501; } .spotlight>.content>.words>.padding { position: relative; width: 90%; height:auto; overflow: visible; margin: 0px 5%; padding: 0%; text-align: center; color: #FFF; } .spotlight>.content>.words>.padding>p>a:link {color: #FD0303;} .spotlight>.content>.words>.padding>h2 {color:#FFF; text-transform: uppercase; letter-spacing: 2px; } .spotlight>.content>.words>.padding>ul { width: 80%; height:auto; overflow: visible; margin: 0px auto; padding: 0%; text-align: left; color: #FFF; } .spotlight>.content>.words>.padding>ul>li { text-align: left; } .spotlight>.content>.words>.padding .ctabutton {margin-bottom: 10px; } .spotlight>.content>.words>.padding .ctabutton>button.modal-open { margin: 0; padding: 0; line-height: 0.8em;} .spotlight>.content>.words>.padding .cms-subtitle1 { font-family: "Source Sans Pro", "SourceSans", sans-serif;color:#FFF; margin: 20px 0px 5px 0px; padding: 0px; font-size: 1.5em; font-weight: 700; } .spotlight>.content>.words>.padding .cms-subtitle2 { font-family: "Source Sans Pro", "SourceSans", sans-serif;color:#999; margin: 15px 0px 0px 0px; padding: 0px; font-size: 1.25em; font-weight: 700; } .spotlight>.content>.words>.padding .cms-subtitle3 { font-family: "Source Sans Pro", "SourceSans", sans-serif;color:#FFF; margin: 15px 0px 0px 0px; padding: 0px; font-size: 1.25em; font-weight: 700; } .spotlight>.content>.words>.padding .cms-caption { font-family: "Source Sans Pro", "SourceSans", sans-serif; font-style: italic; color:#FFF; margin: 10px 0px; padding: 0px; font-size: 0.8em;} .spotlight>.content>.words>.multibuttons{ width: 100%; } .spotlight>.content>.words>.multibuttons>ul {padding: 5px; } .spotlight>.content>.words>.multibuttons>ul>li { list-style: none; width: 100%; height:auto; overflow: visible; margin: 0px; padding: 0%; text-align: center; color: #FFF;} .spotlight>.content>.words>.multibuttons>ul>li>.multitext>.linktitle { display: inline-block; width: auto; height: auto; margin: 0 0 10px 0; padding: 10px; background: #ad1a1f; border: none; border-radius: 0; color: #FFF; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; white-space: nowrap; font-size:.75em; line-height: .5em; text-transform:uppercase; letter-spacing: 1px; font-weight: 800;} .spotlight>.content>.words>.multibuttons>ul>li>.multitext>.linktitle a:link, .spotlight>.content>.words>.multibuttons>ul>li>.multitext>.linktitle a:visited { color:#FFF; text-decoration: none; } /* start Text styles */ .text { position: relative; width: 100%; height: auto; margin: 30px auto 30px auto; padding: 0px; display: block; background: #FFF;} .text>h2 { color: #222; font-weight: bold; font-size: 1.4em; padding:0; margin:0; line-height:1em;} .text .content { max-width:1100px; margin: 0px auto; display:table;} .text>.content>.imgleft, .text>.content>.imgshell { position: relative; display:table-cell; float: left; width: 48%; height: auto !important; overflow: hidden; margin: 0px 30px 0px 0px; } .text>.content>.imgleft img, .text .content .imgshell img { width: 100%; height: auto; margin: 0px 30px 0px 0px;} .text>.content>.imgright { position: relative; display:table-cell; float: right; width: 48%; height: auto !important; overflow: hidden; margin: 0px 0px 0px 2%; padding: 0; } .text>.content>.imgright img { width: 100%; height: auto; margin: 0;} .text>.content>.imgcenter { position: relative; display:inline; float: left; width: 70%; overflow: hidden; margin: 0px auto; } .text>.content>.imgcenter img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .text .content .embcenter { position: relative; width: 80%; margin: 0 auto 0px auto; } .text .content .embcenter iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; } .text .content .embfull { width: 100%; margin: 0 auto; padding: 0; background: #222; } .text .content .embfull iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; } .text .content .embright { width: 50%; margin: 0; padding: 0; background: #FFF; float: right; display: inline; } .text .content .embright iframe { width: 100%; height: auto !important; min-height: 320px; padding: 0; margin: 0; } .text .content .embshell { width: auto !important; width: 48%; height: auto !important; margin: 0 30px 0 0; padding: 0; background: #FFF; float: left; display: inline; } .text .content .embshell iframe { width: 100%; height: auto !important; min-height: 320px; padding: 0; margin: 0; } .text .content .embleft { width: 48%; height: auto !important; margin: 0 30px 0 0; padding: 0; background: #FFF; float: left; display: inline; } .text .content .embleft iframe { width: 100%; height: auto !important; min-height: 320px; padding: 0; margin: 0; } .text>.content>.words { position: relative; display: table-cell; width: auto !important; min-width: 50% !important; max-width: 100%;padding: 0; margin: 0px; line-height: 30px; vertical-align: middle; } .text>.content .words>.padding { margin: 0 2.5%; padding: 0; width: 95%; } .text .content>.words .padding .text3cols { position:relative; width: 100%; margin: 0 auto; padding: 20px 0 0 0; vertical-align: middle; display: table; } .text .content .words .padding .text3cols .textcol { position:relative; display: table-cell; vertical-align: top; width: 33%; padding: 0; } .text>.content>.words>.multibuttons { margin: 0 0px; padding: 0; } .text>.content>.words>.multibuttons>ul { margin: 0 5%; padding: 0; width: 90%; list-style: none; } .text>.content>.words>.multibuttons>ul>li { margin: 0; padding: 2px; float:none;} .text>.content>.words>.multibuttons>ul>li>.imgshell {width:10%;margin:0;padding:0;} .text>.content>.words>.multibuttons>ul>li>.multitext {width:80%;margin:0;padding:0;} .text>.content>.words>.multibuttons>ul>li>.multitext button.modal-open {color: #FFF;} .text>.content>.words>.multibuttons>ul>li>.imgshell>img { height:25px;width:auto; } .text>.content>.words>.multibuttons>ul>li>.multitext>.ctabutton>button.modal-open { margin: 0; padding: 0; line-height: 0.8em; } .text>.content>.words>.multibuttons>ul>li>.multitext>.linktitle { } .text>.content>.words p { line-height: 32px;} .text>.content>.words>.padding>.ctabutton { margin-bottom: 30px;} .text>.content>.words>.padding>.ctabutton>button.modal-open { font-size: 1em; font-weight: 600; line-height: 1em; margin: 0px; padding: 0; text-transform: uppercase; letter-spacing: 2px; text-align: center; width: auto; color: #FFFFFF; float: none;} .text>.content>.words>.padding>.ctabutton>button.modal-open>a:hover, .text>.content>.words>.padding>.ctabutton>button.modal-open>a:active { text-decoration: underline; } .text .content .embedshell { position: relative; display:inline; float: left; width: 25%; min-width: 0%; height: auto; overflow: hidden; margin: 10px 30px 0px 0px; } .text .content .embedshell iframe { width: auto; height: auto; } .text .textlinks { display: block; max-width: 100%; float: left;min-width: 0%; min-height: 0px; padding: 0px 0px 0px 0px; margin: 0px 0px 10px 0px; } .text .textlinks .content { width: 100%; min-height: 100px; padding: 0px; margin: 0px 0px 0px 10px; border-right: 1px solid #CCC; } .text .textlinks ul { margin: 0px 0px 0px 20px; } .text.expandblock { min-height: 0px; } .text .content .imgright .ctabutton { position: absolute; bottom: 10px; right: 10px; } /* start Text Grey styles */ .textgrey { position: relative; width: 100%; height: auto; margin: 30px auto 50px auto; padding: 30px 0px; display: table; background: #f6f6f6; } .textgrey>h2 { color: #222; font-weight: bold; font-size: 1.4em; padding:0; margin:0; line-height:1em;} .textgrey .content { max-width:1100px; margin: 0px auto;} .textgrey>.content>.imgleft, .text .content .imgshell { position: relative; display:table-cell; float: left; width: 48%; height: auto !important; overflow: hidden; margin: 0px 30px 0px 0px; } .textgrey>.content>.imgleft img, .text .content .imgshell img { width: 100%; height: auto; margin: 0px 30px 0px 0px;} .textgrey>.content>.imgright { position: relative; display:table-cell; float: right; width: 48%; height: auto !important; overflow: hidden; margin: 0px 0px 0px 30px; } .textgrey>.content>.imgright img { width: 100%; height: auto; margin: 0;} .textgrey>.content>.imgcenter { position: relative; display:inline; float: left; width: 70%; overflow: hidden; margin: 0px auto; } .textgrey>.content>.imgcenter img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .textgrey .content .embcenter { position: relative; width: 80%; margin: 0 auto 0px auto; } .textgrey .content .embcenter iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; } .textgrey .content .embfull { width: 100%; margin: 0 auto; padding: 0; background: #222; } .textgrey .content .embfull iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; } .textgrey .content .embright { width: 50%; margin: 0; padding: 0; background: #FFF; float: right; display: inline; } .textgrey .content .embright iframe { width: 100%; height: auto !important; min-height: 320px; padding: 0; margin: 0; } .textgrey .content .embshell { width: 50%; height: auto !important; margin: 0; padding: 0; background: #FFF; float: left; display: inline; } .textgrey .content .embshell iframe { width: 100%; height: auto !important; min-height: 320px; padding: 0; margin: 0; } .textgrey .content .embleft { width: 50%; height: auto !important; margin: 0; padding: 0; background: #FFF; float: left; display: inline; } .textgrey .content .embleft iframe { width: 100%; height: auto !important; min-height: 320px; padding: 0; margin: 0; } .textgrey .content .words { position: relative; display: table-cell; width: auto; padding: 0; margin: 0px; vertical-align: middle; line-height: 30px; min-width: 50%; max-width: 100%;} .textgrey .content .words>.padding { margin: 0 30px; padding: 0; width: 100%; } .textgrey .content .words .padding .text3cols { position:relative; width: 100%; margin: 0 auto; padding: 20px 0 0 0; vertical-align: middle; display: table; } .textgrey .content .words .padding .text3cols .textcol { position:relative; display: table-cell; vertical-align: top; width: 33%; padding: 0; } .textgrey>.content>.words>.multibuttons { margin: 0 0px; padding: 0; } .textgrey>.content>.words>.multibuttons>ul { margin: 0 30px; padding: 0; list-style: none; } .textgrey>.content>.words>.multibuttons>ul>li { margin: 0; padding: 2px; float:none;} .textgrey>.content>.words>.multibuttons>ul>li>.imgshell {width:10%;margin:0;padding:0;} .textgrey>.content>.words>.multibuttons>ul>li>.multitext {width:80%;margin:0;padding:0;} .textgrey>.content>.words>.multibuttons>ul>li>.multitext button.modal-open {color: #FFF;} .textgrey>.content>.words>.multibuttons>ul>li>.imgshell>img { height:25px;width:auto; } .textgrey>.content>.words>.multibuttons>ul>li>.multitext>.ctabutton>button.modal-open { margin: 0; padding: 0; line-height: 0.8em; } .textgrey>.content>.words p { line-height: 32px;} .textgrey>.content>.words { padding: 0px; margin: 0px; } .textgrey>.content>.words>.padding>.ctabutton>button.modal-open { font-size: 0.9em; font-weight: 600; line-height: 1em; margin: 0px; padding: 0; text-transform: uppercase; letter-spacing: 2px; text-align: center; width: auto; color: #FFFFFF; float: none;} .textgrey>.content>.words>.padding>.ctabutton>button.modal-open>a:hover, .textgrey>.content>.words>.padding>.ctabutton>button.modal-open>a:active { text-decoration: underline; } .textgrey .content .embedshell { position: relative; display:inline; float: left; width: 25%; min-width: 0%; height: auto; overflow: hidden; margin: 10px 30px 0px 0px; } .textgrey .content .embedshell iframe { width: auto; height: auto; } .textgrey .textlinks { display: block; max-width: 100%; float: left;min-width: 0%; min-height: 0px; padding: 0px 0px 0px 0px; margin: 0px 0px 10px 0px; } .textgrey .textlinks .content { width: 100%; min-height: 100px; padding: 0px; margin: 0px 0px 0px 10px; border-right: 1px solid #CCC; } .textgrey .textlinks ul { margin: 0px 0px 0px 20px; } .textgrey.expandblock { min-height: 0px; } .textgrey .content .imgright .ctabutton { position: absolute; bottom: 10px; right: 10px; } /* start Text Lists styles */ .textlists { position: relative; width: 100%; height: auto; margin: 30px auto 50px auto; padding: 0px; display: table; } .textlists h2 { color: #222; font-weight: bold; text-align: center; text-transform: uppercase; letter-spacing: 2px; font-size: 1.3em; padding:0; margin:0; line-height:1.2em;} .textlists .content { max-width:1000px; margin: 0px auto; padding: 0; } .textlists .content .imgleft, .textlists .content .imgshell { position: relative; display:table-cell; float: left; width: 38%; height: auto !important; overflow: hidden; margin: 0px 2% 0px 0px; } .textlists .content>.imgleft img, .text .content .imgshell img { width: 100%; height: auto; margin: 0px 30px 0px 0px;} .textlists .content>.imgright { position: relative; display:table-cell; float: right; width: 48%; height: auto !important; overflow: hidden; margin: 0px 0px 0px 30px; } .textlists .content>.imgright img { width: 100%; height: auto; margin: 0;} .textlists .content>.imgcenter { position: relative; display:inline; float: left; width: 70%; overflow: hidden; margin: 0px auto; } .textlists .content>.imgcenter img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .textlists .content .embcenter { position: relative; width: 80%; margin: 0 auto 0px auto; } .textlists .content .embcenter iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; } .textlists .content .embfull { width: 100%; margin: 0 auto; padding: 0; background: #222; } .textlists .content .embfull iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; } .textlists .content .embright { width: 50%; margin: 0; padding: 0; background: #FFF; float: right; display: inline; } .textlists .content .embright iframe { width: 100%; height: auto !important; min-height: 320px; padding: 0; margin: 0; } .textlists .content .embshell { width: 50%; height: auto !important; margin: 0; padding: 0; background: #FFF; float: left; display: inline; } .textlists .content .embshell iframe { width: 100%; height: auto !important; min-height: 320px; padding: 0; margin: 0; } .textlists .content .embleft { width: 50%; height: auto !important; margin: 0; padding: 0; background: #FFF; float: left; display: inline; } .textlists .content .embleft iframe { width: 100%; height: auto !important; min-height: 320px; padding: 0; margin: 0; } .textlists .content .words { position: relative; display: block; width: 100%; padding: 0; margin: 0px; vertical-align: middle; line-height: 30px; } .textlists .content .words>.padding { margin: 0; padding: 0; width: 100%; } .textlists>.content>.words>.multibuttons { margin: 20px auto; padding: 2%; width: 70%; background: #FFF; border: 1px solid #999;} .textlists>.content>.words>.multibuttons>ul { margin: 0; padding: 0; list-style: none; } .textlists>.content>.words>.multibuttons>ul>li { margin: 0 0 2px 0; padding: 0 0 2px 0; float:none; border-bottom: 1px solid #999} .textlists>.content>.words>.multibuttons>ul>li a { text-decoration: none; } .textlists>.content>.words>.multibuttons>ul>li>.imgshell {width:10%;margin:0;padding:0;} .textlists>.content>.words>.multibuttons>ul>li>.multitext {width:80%;margin:0;padding:0;} .textlists>.content>.words>.multibuttons>ul>li>.multitext button.modal-open {color: #FFF;} .textlists>.content>.words>.multibuttons>ul>li>.imgshell>img { height:25px;width:auto; } .textlists>.content>.words>.multibuttons>ul>li>.multitext>.ctabutton>button.modal-open { margin: 0; padding: 0; line-height: 0.8em; } .textlists>.content>.words p { line-height: 32px;} .textlists>.content>.words { padding: 0px; margin: 0px; } .textlists>.content>.words>.padding>.ctabutton>button.modal-open { font-size: 0.9em; font-weight: 600; line-height: 1em; margin: 0px; padding: 0; text-transform: uppercase; letter-spacing: 2px; text-align: center; width: auto; color: #FFFFFF; float: none;} .textlists>.content>.words>.padding>.ctabutton>button.modal-open>a:hover, .textlists>.content>.words>.padding>.ctabutton>button.modal-open>a:active { text-decoration: underline; } .textlists .content .embedshell { position: relative; display:inline; float: left; width: 25%; min-width: 0%; height: auto; overflow: hidden; margin: 10px 30px 0px 0px; } .textlists .content .embedshell iframe { width: auto; height: auto; } .textlists .textlinks { display: block; max-width: 100%; float: left;min-width: 0%; min-height: 0px; padding: 0px 0px 0px 0px; margin: 0px 0px 10px 0px; } .textlists .textlinks .content { width: 100%; min-height: 100px; padding: 0px; margin: 0px 0px 0px 10px; border-right: 1px solid #CCC; } .textlists .textlinks ul { margin: 0px 0px 0px 20px; } .textlists.expandblock { min-height: 0px; } .textlists .content .imgright .ctabutton { position: absolute; bottom: 10px; right: 10px; } /* start Three Column styles */ .threecol { position: relative; width: 100%; height: auto; margin: 30px auto 50px auto; padding: 30px 0; display: table; background: #f6f6f6; } .threecol .content { position: relative; width: 100%; max-width:1100px; height: auto; margin: 50px auto; padding: 0px; display: table;} .threecol .content>.imgleft, .threecol>.content>.imgshell { position: relative; display:table-cell; float: left; width: 29%; height: auto !important; overflow: hidden; margin: 0px 30px 0px 20px; padding: 1%; background: #FFF; } .threecol .content>.imgleft img, .threecol>.content>.imgshell img { width: 100%; height: auto; margin: 0px 30px 0px 0px;} .threecol .content>.imgright { position: relative; display:table-cell; float: right; width: 29%; height: auto !important; overflow: hidden; margin: 0px 20px 0px 30px; padding: 1%; background: #FFF; } .threecol .content>.imgright img { width: 100%; height: auto; margin: 0;} .threecol>.content>.imgcenter { position: relative; display:inline; float: left; width: 30%; overflow: hidden; margin: 0px auto; } .threecol>.content>.imgcenter img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .threecol>.content>.imgfull { position: relative; display:inline; float: left; width: 90%; overflow: hidden; margin: 0px auto; } .threecol>.content>.imgfull img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .threecol .content .embleft, .threecol>.content .embshell { position: relative; display:table-cell; float: left; width: 48%; height: auto !important; overflow: hidden; margin: 0px 30px 20px 0px; } .threecol .content .embleft iframe, .threecol>.content .embshell iframe { width: 100%; height: auto; min-height: 300px; margin: 0px 30px 0px 0px;} .threecol .content .embright { position: relative; display:table-cell; float: right; width: 48%; height: auto !important; overflow: hidden; margin: 0px 0px 0px 30px; } .threecol .content .embright iframe { width: 100%; height: auto; min-height: 300px; margin: 0px 0px 0px 30px;} .threecol .content .embcenter { position: relative; display:inline; float: left; width: 70%; overflow: hidden; margin: 0px auto; } .threecol .content .embcenter iframe { width: 100%; height: auto; min-height: 400px; margin: 0px 0px 0px 0px;} .threecol .content .embfull { position: relative; display:block; float: none; width: 90%; overflow: hidden; margin: 0px auto; } .threecol .content .embfull iframe { width: 100%; height: auto; min-height: 600px; margin: 0px 0px 0px 0px;} .threecol>.content>.words { position: relative; width: 100%; max-width:1100px; display: block; margin: 0px auto;} .threecol>.content>.words>.padding { text-align: center; line-height:1.9em; } .threecol>.content>.words>.padding>p { line-height:1.9em; margin: 20px; } .threecol>.content>.words>.padding>h2 { text-transform: uppercase; letter-spacing: 3px; text-align: center; color: #222; font-weight: 900; font-size: 1.4em; padding:0; margin:0 auto; line-height:1em; } .threecol>.content>.words>.padding>.subtitle { margin:10px auto; text-align: center; font-size: 1.1em;} .threecol>.content>.words>.multibuttons { position: relative; width: 100%; max-width:1100px; display: block; margin: 0px auto;} .threecol>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto; padding: 0px; width: 100%; display: table; } .threecol>.content>.words>.multibuttons>ul>li { position: relative; width: 29%; display:table-cell; float: left; margin: 2%; padding: 0;text-align: center; min-height: 100px; background: #FFF; color: #222; } .threecol .content .words .multibuttons .cms-button { margin: 15px auto; line-height: 1em;} .threecol>.content>.words>.multibuttons>ul>li>.multimgshell, .threecol>.content>.words>.multibuttons>ul>li>.multimgleft, .threecol>.content>.words>.multibuttons>ul>li>.multimgright, .threecol>.content>.words>.multibuttons>ul>li>.multimgcenter{ position: relative; width: 90%; height: auto; display:block; overflow: hidden; margin: 5%; } .threecol>.content>.words>.multibuttons>ul>li>.multimgfull{ position: relative; width: 100%; height: auto; display:block; overflow: hidden; margin: 0;} .threecol>.content>.words>.multibuttons>ul>li>.multimgleft img, .threecol>.content>.words>.multibuttons>ul>li>.multimgright img, .threecol>.content>.words>.multibuttons>ul>li>.multimgcenter img, .threecol>.content>.words>.multibuttons>ul>li>.multimgshell img, .threecol>.content>.words>.multibuttons>ul>li>.multimgfull img { position: relative; width: 100%; height: auto; padding: 0; margin: 0;} .threecol>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: 96%; height: auto; margin: 2%; display:block; float:none; line-height: 1.8em; } .threecol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle {font-size: 1.3em; text-align: center; color:#ad1a1f;font-weight:900; margin: 10px auto 5px auto;} .threecol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:link, .threecol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:visited {text-decoration:none;} .threecol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:active, .threecol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:hover{text-decoration:underline;} .threecol>.content>.words>.multibuttons>ul>li>.multitext button.modal-open {color: #FFF; text-decoration: none; font-weight: 800; } .threecol>.content>.words>.multibuttons>ul>li>.multitext>div>ul { position: relative; text-align: left; width: 90%; margin: 0 auto; } .threecol>.content>.words>.multibuttons>ul>li>.multitext>div>ul>li { text-align: left; margin: 0 0 10px 0; } .threecol>.content>.words>.multibuttons>ul>li>.multitext>.ctabutton>button.modal-open { margin: 0; padding: 0; line-height: 1.1em; } .threecol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>.ctabutton {display:inline-block;margin-top: 20px;} .threecol>.content>.words>.multibuttons>ul>li>.multiembshell, .threecol>.content>.words>.multibuttons>ul>li>.multiembleft, .threecol>.content>.words>.multibuttons>ul>li>.multiembright, .threecol>.content>.words>.multibuttons>ul>li>.multiembcenter { position: relative; width: 90%; height: auto; display:block; overflow: hidden; margin: 5%; } .threecol>.content>.words>.multibuttons>ul>li>.multiembshell img { position: relative; width: 100%; height: 100%; display:block; max-height: 150px; } .threecol>.content>.words>.multibuttons>ul>li>.multiembshell iframe, .threecol>.content>.words>.multibuttons>ul>li>.multiembleft iframe, .threecol>.content>.words>.multibuttons>ul>li>.multiembright iframe, .threecol>.content>.words>.multibuttons>ul>li>.multiembcenter iframe { position: relative; width: 100%; height: 100%; display:block; max-height: 150px; } /* start Three Column DARK styles */ .threecold { position: relative; width: 100%; height: auto; margin: 30px auto 50px auto; padding: 30px 0; display: table; background: #222; color: #FFF;} .threecold .content { position: relative; width: 100%; max-width:1100px; height: auto; margin: 50px auto; padding: 0px; display: table;} .threecold .content>.imgleft, .threecold>.content>.imgshell { position: relative; display:table-cell; float: left; width: 29%; height: auto !important; overflow: hidden; margin: 0px 30px 0px 20px; padding: 1%; background: #222; color: #FFF;} .threecold .content>.imgleft img, .threecold>.content>.imgshell img { width: 100%; height: auto; margin: 0px 30px 0px 0px;} .threecold .content>.imgright { position: relative; display:table-cell; float: right; width: 29%; height: auto !important; overflow: hidden; margin: 0px 20px 0px 30px; padding: 1%; background: #FFF; } .threecold .content>.imgright img { width: 100%; height: auto; margin: 0;} .threecold>.content>.imgcenter { position: relative; display:inline; float: left; width: 30%; overflow: hidden; margin: 0px auto; } .threecold>.content>.imgcenter img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .threecold>.content>.imgfull { position: relative; display:inline; float: left; width: 90%; overflow: hidden; margin: 0px auto; } .threecold>.content>.imgfull img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .threecold .content .embleft, .threecold>.content .embshell { position: relative; display:table-cell; float: left; width: 48%; height: auto !important; overflow: hidden; margin: 0px 30px 20px 0px; } .threecold .content .embleft iframe, .threecold>.content .embshell iframe { width: 100%; height: auto; min-height: 300px; margin: 0px 30px 0px 0px;} .threecold .content .embright { position: relative; display:table-cell; float: right; width: 48%; height: auto !important; overflow: hidden; margin: 0px 0px 0px 30px; } .threecold .content .embright iframe { width: 100%; height: auto; min-height: 300px; margin: 0px 0px 0px 30px;} .threecold .content .embcenter { position: relative; display:inline; float: left; width: 70%; overflow: hidden; margin: 0px auto; } .threecold .content .embcenter iframe { width: 100%; height: auto; min-height: 400px; margin: 0px 0px 0px 0px;} .threecold .content .embfull { position: relative; display:block; float: none; width: 90%; overflow: hidden; margin: 0px auto; } .threecold .content .embfull iframe { width: 100%; height: auto; min-height: 600px; margin: 0px 0px 0px 0px;} .threecold>.content>.words { position: relative; width: 100%; max-width:1100px; display: block; margin: 0px auto; color: #FFF;} .threecold>.content>.words>.padding { text-align: center; line-height:1.9em; color: #FFF;} .threecold>.content>.words>.padding>p { line-height:1.9em; margin: 20px; } .threecold>.content>.words>.padding>h2 { text-transform: uppercase; letter-spacing: 3px; text-align: center; color: #FFF; font-weight: 900; font-size: 1.4em; padding:0; margin:0 auto; line-height:1em; } .threecold>.content>.words>.padding>.subtitle { margin:10px auto; text-align: center; font-size: 1.1em;} .threecold>.content>.words>.multibuttons { position: relative; width: 100%; max-width:1100px; display: block; margin: 0px auto;} .threecold>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto; padding: 0px; width: 100%; display: table; } .threecold>.content>.words>.multibuttons>ul>li { position: relative; width: 29%; display:table-cell; float: left; margin: 2%; padding: 0;text-align: center; min-height: 100px; background: #FFF; color: #222;} .threecold .content .words .multibuttons .cms-button { margin: 15px auto; line-height: 1em;} .threecold>.content>.words>.multibuttons>ul>li>.multimgshell, .threecold>.content>.words>.multibuttons>ul>li>.multimgleft, .threecold>.content>.words>.multibuttons>ul>li>.multimgright, .threecold>.content>.words>.multibuttons>ul>li>.multimgcenter{ position: relative; width: 90%; height: auto; display:block; overflow: hidden; margin: 5%; } .threecold>.content>.words>.multibuttons>ul>li>.multimgfull{ position: relative; width: 100%; height: auto; display:block; overflow: hidden; margin: 0;} .threecold>.content>.words>.multibuttons>ul>li>.multimgleft img, .threecold>.content>.words>.multibuttons>ul>li>.multimgright img, .threecold>.content>.words>.multibuttons>ul>li>.multimgcenter img, .threecold>.content>.words>.multibuttons>ul>li>.multimgshell img, .threecold>.content>.words>.multibuttons>ul>li>.multimgfull img { position: relative; width: 100%; height: auto; padding: 0; margin: 0;} .threecold>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: 90%; height: auto; padding: 2.5%; margin: 0 auto;display:block; float:none; line-height: 1.8em;} .threecold>.content>.words>.multibuttons>ul>li>.multitext>.linktitle {font-size: 1.3em; text-align: center; color:#ad1a1f;font-weight:900; margin: 10px auto 15px auto;} .threecold>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:link, .threecold>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:visited {text-decoration:none;} .threecold>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:active, .threecold>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:hover{text-decoration:underline;} .threecold>.content>.words>.multibuttons>ul>li>.multitext button.modal-open {color: #FFF; text-decoration: none; font-weight: 800; } .threecold>.content>.words>.multibuttons>ul>li>.multitext>div>ul { position: relative; text-align: left; width: 90%; margin: 0 auto; } .threecold>.content>.words>.multibuttons>ul>li>.multitext>div>ul>li { text-align: left; margin: 0 0 10px 0; } .threecold>.content>.words>.multibuttons>ul>li>.multitext>.ctabutton>button.modal-open { margin: 0; padding: 0; line-height: 1.1em; } .threecold>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>.ctabutton {display:inline-block;margin-top: 20px;} /* start Three Column WHITE styles */ .threecolw { position: relative; width: 100%; height: auto; margin: 30px auto; padding: 0px 0; display: table; background: #FFF; } .threecolw .content { position: relative; width: 100%; max-width:1100px; height: auto; margin: 0px auto; padding: 0px; display: table;} .threecolw .content>.imgleft, .threecolw>.content>.imgshell { position: relative; display:table-cell; float: left; width: 29%; height: auto !important; overflow: hidden; margin: 0px 30px 0px 20px; padding: 1%; background: #222; } .threecolw .content>.imgleft img, .threecolw>.content>.imgshell img { width: 100%; height: auto; margin: 0px 30px 0px 0px;} .threecolw .content>.imgright { position: relative; display:table-cell; float: right; width: 29%; height: auto !important; overflow: hidden; margin: 0px 20px 0px 30px; padding: 1%; background: #FFF; } .threecolw .content>.imgright img { width: 100%; height: auto; margin: 0;} .threecolw>.content>.imgcenter { position: relative; display:inline; float: left; width: 30%; overflow: hidden; margin: 0px auto; } .threecolw>.content>.imgcenter img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .threecolw>.content>.imgfull { position: relative; display:inline; float: left; width: 90%; overflow: hidden; margin: 0px auto; } .threecolw>.content>.imgfull img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .threecolw .content .embleft, .threecolw>.content .embshell { position: relative; display:table-cell; float: left; width: 48%; height: auto !important; overflow: hidden; margin: 0px 30px 20px 0px; } .threecolw .content .embleft iframe, .threecolw>.content .embshell iframe { width: 100%; height: auto; min-height: 300px; margin: 0px 30px 0px 0px;} .threecolw .content .embright { position: relative; display:table-cell; float: right; width: 48%; height: auto !important; overflow: hidden; margin: 0px 0px 0px 30px; } .threecolw .content .embright iframe { width: 100%; height: auto; min-height: 300px; margin: 0px 0px 0px 30px;} .threecolw .content .embcenter { position: relative; display:inline; float: left; width: 70%; overflow: hidden; margin: 0px auto; } .threecolw .content .embcenter iframe { width: 100%; height: auto; min-height: 400px; margin: 0px 0px 0px 0px;} .threecolw .content .embfull { position: relative; display:block; float: none; width: 90%; overflow: hidden; margin: 0px auto; } .threecolw .content .embfull iframe { width: 100%; height: auto; min-height: 600px; margin: 0px 0px 0px 0px;} .threecolw>.content>.words { position: relative; width: 100%; max-width:1100px; display: block; margin: 0px auto;} .threecolw>.content>.words>.padding { text-align: center; line-height:1.9em; } .threecolw>.content>.words>.padding>p { line-height:1.9em; margin: 20px; } .threecolw>.content>.words>.padding>h2 { text-transform: uppercase; letter-spacing: 3px; text-align: center; color: #222; font-weight: 900; font-size: 1.4em; padding:0; margin:0 auto; line-height:1em; } .threecolw>.content>.words>.padding>.subtitle { margin:10px auto; text-align: center; font-size: 1.1em;} .threecolw>.content>.words>.multibuttons { position: relative; width: 100%; max-width:1100px; display: block; margin: 0px auto;} .threecolw>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto; padding: 0px; width: 100%; display: table; } .threecolw>.content>.words>.multibuttons>ul>li { position: relative; width: 29%; display:table-cell; float: left; margin: 2%; padding: 0;text-align: center; min-height: 100px; background: #F6F6F6; color: #222; } .threecolw .content .words .multibuttons .cms-button { margin: 15px auto; line-height: 1em;} .threecolw>.content>.words>.multibuttons>ul>li>.multimgshell, .threecolw>.content>.words>.multibuttons>ul>li>.multimgleft, .threecolw>.content>.words>.multibuttons>ul>li>.multimgright, .threecolw>.content>.words>.multibuttons>ul>li>.multimgcenter{ position: relative; width: 90%; height: auto; display:block; overflow: hidden; margin: 5%; } .threecolw>.content>.words>.multibuttons>ul>li>.multimgfull{ position: relative; width: 100%; height: auto; display:block; overflow: hidden; margin: 0;} .threecolw>.content>.words>.multibuttons>ul>li>.multimgleft img, .threecolw>.content>.words>.multibuttons>ul>li>.multimgright img, .threecolw>.content>.words>.multibuttons>ul>li>.multimgcenter img, .threecolw>.content>.words>.multibuttons>ul>li>.multimgshell img, .threecolw>.content>.words>.multibuttons>ul>li>.multimgfull img { position: relative; width: 100%; height: auto; padding: 0; margin: 0;} .threecolw>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: 100%; height: auto; display:block; float:none; line-height: 1.8em;} .threecolw>.content>.words>.multibuttons>ul>li>.multitext>.linktitle {font-size: 1.3em; text-align: center; color:#ad1a1f;font-weight:900; margin: 10px auto 5px auto;} .threecolw>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:link, .threecolw>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:visited {text-decoration:none;} .threecolw>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:active, .threecolw>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:hover{text-decoration:underline;} .threecolw>.content>.words>.multibuttons>ul>li>.multitext button.modal-open {color: #FFF; text-decoration: none; font-weight: 800; } .threecolw>.content>.words>.multibuttons>ul>li>.multitext>div>ul { position: relative; text-align: left; width: 90%; margin: 0 auto; } .threecolw>.content>.words>.multibuttons>ul>li>.multitext>div>ul>li { text-align: left; margin: 0 0 10px 0; } .threecolw>.content>.words>.multibuttons>ul>li>.multitext>.ctabutton>button.modal-open { margin: 0; padding: 0; line-height: 1.1em; } .threecolw>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>.ctabutton {display:inline-block;margin-top: 20px;} /* -------- Top (Page) Title ---------- */ .toptitle { position: relative; display: block; text-align: center; height: auto !important; width: 90%; max-width: 1100px; padding: 0; margin: 20px auto; background:url(https://www.bard.edu/images/line.png) repeat-x;} .toptitle>h2 { position: relative; display: inline-block; text-align: center; height: 30px; width: auto !important; text-transform: uppercase; letter-spacing: 2px; font-size: 1.2em; line-height: 1em; padding: 5px 10px; margin: 0 auto;background: #FFF; color: #333; clear: both;} .toptitle>.ctabutton { position: relative; display: inline-block; text-align: center; margin: 10px auto; } /* start Two Column styles */ .twocol { position: relative; width: 100%; height: auto; margin: 30px auto; padding: 30px 0; display: table; float: none; background: #f6f6f6;} .twocol>.content { position: relative; width: 90% !important; height: auto; margin: 0 auto; padding: 1% !important; display: table; } .twocol>.content>.words { position: relative; width: 100%; max-width: 1100px; display: block; margin: 0px auto; float: none; padding: 0;} .twocol>.content>.words>.padding { position: relative; text-align: left; width: 18%; float: left; display: inline; padding: 2% 2% 2% 0; } .twocol>.content>.words>.padding>p { line-height:1.6em; margin: 20px 0; } .twocol>.content>.words>.padding>p .cms-button { margin: 10px 0; } .twocol>.content>.words>.padding>h2 { text-transform: uppercase; letter-spacing: 3px; text-align: left; color: #222; font-weight: 900; font-size: 1.4em; padding: 20px 0; margin:0 auto; line-height:1em; } .twocol>.content>.words>.padding>.subtitle { margin:10px auto; text-align: left; font-size: 1.1em;} .twocol>.content>.words>.padding>.ctabutton { position: relative; margin:10px auto; text-align: center; float: none; } .twocol>.content>.imgshell { display:none;} .twocol>.content>.words>.multibuttons { position: relative; width: 80%; max-width:80%; display: inline; float: left; margin: 0px; padding: 0; } .twocol>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto; width: 100%; display: block; } .twocol>.content>.words>.multibuttons>ul>li { position: relative; width: 45%; display:inline-block; float: left; margin: 0% 2.5% 2.5% 0; padding: 0%;height: auto; vertical-align: top;background: #FFFFFF; } .twocol>.content>.words>.multibuttons>ul>li>.multimgshell, .twocol>.content>.words>.multibuttons>ul>li>.multimgleft, .twocol>.content>.words>.multibuttons>ul>li>.multimgcenter, .twocol>.content>.words>.multibuttons>ul>li>.multimgfull{ position: relative; width: 100%; height: auto; overflow: hidden; padding: 0; margin: 0 5% 0 0;display: block; float: none;} .twocol>.content>.words>.multibuttons>ul>li>.multimgshell img, .twocol>.content>.words>.multibuttons>ul>li>.multimgleft img, .twocol>.content>.words>.multibuttons>ul>li>.multimgcenter img, .twocol>.content>.words>.multibuttons>ul>li>.multimgfull img { position: relative; width: 100%; height: auto !important; } .twocol>.content>.words>.multibuttons>ul>li>.multimgright { position: relative; width: 45%; height: auto; max-height: 225px; overflow: hidden; padding: 0; margin: 0;display: table-cell; float: right; } .twocol>.content>.words>.multibuttons>ul>li>.multimgright img { position: relative; width: 100%; height: auto !important; } .twocol>.content>.words>.multibuttons>ul>li>.multiembshell, .twocol>.content>.words>.multibuttons>ul>li>.multiembleft, .twocol>.content>.words>.multibuttons>ul>li>.multiembright, .twocol>.content>.words>.multibuttons>ul>li>.multiembcenter, .twocol>.content>.words>.multibuttons>ul>li>.multiembfull{ position: relative; width: 100%; height: auto; overflow: hidden; padding: 0; margin: 0;display: block; float: none;} .twocol>.content>.words>.multibuttons>ul>li>.multiembshell iframe, .twocol>.content>.words>.multibuttons>ul>li>.multiembleft iframe, .twocol>.content>.words>.multibuttons>ul>li>.multiembright iframe, .twocol>.content>.words>.multibuttons>ul>li>.multiembcenter iframe, .twocol>.content>.words>.multibuttons>ul>li>.multiembfull iframe { position: relative; width: 100%; height: auto !important; min-height: 265px; } .twocol>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: auto !important; padding: 4% 6%; margin: 0; font-size: 0.95em; line-height: 1.8em; display: block; color: #333333; vertical-align:top; text-align: left; } .twocol>.content>.words>.multibuttons>ul>li>.multitext .cms-button {display: inline-block; width: auto !important; height: auto; margin: 10px 0 0 0px;padding: 10px; border-top: none; border-radius: 0; color: #FFF; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; white-space: nowrap;font-size: .85em;line-height: .5em;text-transform: uppercase; text-align: left; letter-spacing: 2px;font-weight: 800; } .twocol>.content>.words>.multibuttons>ul>li>.multitext .linktitle {font-size: 1.2em; text-align: left; color:#222;font-weight:900; margin: 0px 0px 15px 0px; padding:0; text-transform: uppercase; } .twocol>.content>.words>.multibuttons>ul>li>.multitext>p {margin: 15px 0px 5px 0px; padding:0; line-height: 1.8em; } .twocol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:link, .twocol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:visited {text-decoration:none;} .twocol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:active, .twocol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:hover{text-decoration:underline;} .twocol>.content>.words>.multibuttons>ul>li>.multitext>.ctabutton {display: inline-block; width: auto !important; height: auto; margin: 10px 0 0 0px;padding: 10px; border-top: none; border-radius: 0; color: #FFF; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; white-space: nowrap;text-transform: uppercase; text-align: left; letter-spacing: 2px;font-weight: 800;} .twocol>.content>.words>.multibuttons>ul>li>.multitext>.ctabutton>button.modal-open {display: inline; width: auto; margin: 0; padding: 0; float: left; word-wrap: break-word; outline: none; border: none; text-align: left; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: bold; line-height: 1.0em;} /* start Two Column Dark styles */ .twocold { position: relative; width: 100%; height: auto; margin: 30px auto; padding: 30px 0; display: inline; float: left; clear:none !important; background: #222; } .twocold>.content { position: relative; width: 90% !important; height: auto; margin: 0 auto; padding: 1% !important; display: table; } .twocold>.content>.words { position: relative; width: 100%; max-width: 1100px; display: block; margin: 0px auto; float: none; padding: 0; color: #FFF;} .twocold>.content>.words>.padding { position: relative; text-align: left; width: 18%; float: left; display: inline; padding: 2% 2% 2% 0; } .twocold>.content>.words>.padding>p { line-height:1.5em; margin: 20px 0; } .twocold>.content>.words>.padding>h2 { text-transform: uppercase; letter-spacing: 3px; text-align: left; color: #FFF; font-weight: 900; font-size: 1.4em; padding: 20px 0; margin:0 auto; line-height:1em; } .twocold>.content>.words>.padding>.subtitle { margin:10px auto; text-align: left; font-size: 1.1em;} .twocold>.content>.words>.padding>.ctabutton { position: relative; margin:10px auto; text-align: center; float: none; } .twocold>.content>.imgshell { display:none;} .twocold>.content>.words>.multibuttons { position: relative; width: 80%; max-width:80%; display: inline; float: left; margin: 0px; padding: 0; } .twocold>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto; width: 100%; display: block; } .twocold>.content>.words>.multibuttons>ul>li { position: relative; width: 45%; display:inline-block; float: left; margin: 0% 2.5% 2.5% 0; padding: 0%;height: auto; vertical-align: top;background: #FFFFFF; } .twocold>.content>.words>.multibuttons>ul>li>.multimgshell, .twocold>.content>.words>.multibuttons>ul>li>.multimgleft, .twocold>.content>.words>.multibuttons>ul>li>.multimgcenter, .twocold>.content>.words>.multibuttons>ul>li>.multimgfull{ position: relative; width: 100%; height: auto; overflow: hidden; padding: 0; margin: 0 5% 0 0;display: block; float: none;} .twocold>.content>.words>.multibuttons>ul>li>.multimgshell img, .twocold>.content>.words>.multibuttons>ul>li>.multimgleft img, .twocold>.content>.words>.multibuttons>ul>li>.multimgcenter img, .twocold>.content>.words>.multibuttons>ul>li>.multimgfull img { position: relative; width: 100%; height: auto !important; } .twocold>.content>.words>.multibuttons>ul>li>.multimgright { position: relative; width: 45%; height: auto; max-height: 225px; overflow: hidden; padding: 0; margin: 0;display: table-cell; float: right; } .twocold>.content>.words>.multibuttons>ul>li>.multimgright img { position: relative; width: 100%; height: auto !important; } .twocold>.content>.words>.multibuttons>ul>li>.multiembshell, .twocold>.content>.words>.multibuttons>ul>li>.multiembleft, .twocold>.content>.words>.multibuttons>ul>li>.multiembright, .twocold>.content>.words>.multibuttons>ul>li>.multiembcenter, .twocold>.content>.words>.multibuttons>ul>li>.multiembfull{ position: relative; width: 100%; height: auto; overflow: hidden; padding: 0; margin: 0;display: block; float: none;} .twocold>.content>.words>.multibuttons>ul>li>.multiembshell iframe, .twocold>.content>.words>.multibuttons>ul>li>.multiembleft iframe, .twocold>.content>.words>.multibuttons>ul>li>.multiembright iframe, .twocold>.content>.words>.multibuttons>ul>li>.multiembcenter iframe, .twocold>.content>.words>.multibuttons>ul>li>.multiembfull iframe { position: relative; width: 100%; height: auto !important; min-height: 265px; } .twocold>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: auto !important; padding: 4% 6%; margin: 0; font-size: 0.95em; line-height: 1.8em; display: block; color: #333333; vertical-align:top; text-align: left; } .twocold>.content>.words>.multibuttons>ul>li>.multitext .cms-button {display: inline-block; width: auto !important; height: auto; margin: 10px 0 0 0px;padding: 10px; border-top: none; border-radius: 0; color: #FFF; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; white-space: nowrap;font-size: .85em;line-height: .5em;text-transform: uppercase; text-align: left; letter-spacing: 2px;font-weight: 800; } .twocold>.content>.words>.multibuttons>ul>li>.multitext .linktitle {font-size: 1.2em; text-align: left; color:#222;font-weight:900; margin: 0px 0px 15px 0px; padding:0; text-transform: uppercase; } .twocold>.content>.words>.multibuttons>ul>li>.multitext>p {margin: 20px 0px 5px 0px; padding:0; } .twocold>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:link, .twocold>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:visited {text-decoration:none;} .twocold>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:active, .twocold>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:hover{text-decoration:underline;} .twocold>.content>.words>.multibuttons>ul>li>.multitext>.ctabutton {display: inline-block; width: auto !important; height: auto; margin: 10px 0 0 0px;padding: 10px; /*background-color: #f6f6f6;*/ border-top: none; border-radius: 0; color: #FFF; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; white-space: nowrap;font-size: .85em;line-height: .5em;text-transform: uppercase; text-align: left; letter-spacing: 2px;font-weight: 800;} .twocold>.content>.words>.multibuttons>ul>li>.multitext>.ctabutton>button.modal-open {display: inline; width: auto; margin: 0; padding: 0; float: left; word-wrap: break-word; outline: none; border: none; text-align: left; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: bold; } /* start Two Column White styles */ .twocolw { position: relative; width: 100%; height: auto; margin: 20px auto; padding: 0px 0; display: inline; float: left; clear:none !important; background: #FFF; } .twocolw>.content { position: relative; width: 90% !important; height: auto; margin: 0 auto; padding: 1% !important; display: table; } .twocolw>.content>.words { position: relative; width: 100%; max-width: 1100px; display: block; margin: 0px auto; float: none; padding: 0;} .twocolw>.content>.words>.padding { position: relative; text-align: left; width: 16%; float: left; display: inline; padding: 2% 2% 2% 0; } .twocolw>.content>.words>.padding>p { line-height:1.5em; margin: 20px 0; } .twocolw>.content>.words>.padding>h2 { text-transform: uppercase; letter-spacing: 3px; text-align: left; color: #222; font-weight: 900; font-size: 1.4em; padding: 20px 0; margin:0 auto; line-height:1em; } .twocolw>.content>.words>.padding>.subtitle { margin:10px auto; text-align: left; font-size: 1.1em;} .twocolw>.content>.words>.padding>.ctabutton { position: relative; margin:10px auto; text-align: center; float: none; } .twocolw>.content>.imgshell { display:none;} .twocolw>.content>.words>.multibuttons { position: relative; width: 82%; max-width:82%; display: inline; float: left; margin: 0px; padding: 0; } .twocolw>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto; width: 100%; display: block; } .twocolw>.content>.words>.multibuttons>ul>li { position: relative; width: 45%; display:inline-block; float: left; margin: 0% 2.5% 2.5% 0; padding: 0%;height: auto; vertical-align: top;background: #f6f6f6; } .twocolw>.content>.words>.multibuttons>ul>li>.multimgshell, .twocolw>.content>.words>.multibuttons>ul>li>.multimgleft, .twocolw>.content>.words>.multibuttons>ul>li>.multimgcenter, .twocolw>.content>.words>.multibuttons>ul>li>.multimgfull{ position: relative; width: 100%; height: auto; overflow: hidden; padding: 0; margin: 0 5% 0 0;display: block; float: none;} .twocolw>.content>.words>.multibuttons>ul>li>.multimgshell img, .twocolw>.content>.words>.multibuttons>ul>li>.multimgleft img, .twocolw>.content>.words>.multibuttons>ul>li>.multimgcenter img, .twocolw>.content>.words>.multibuttons>ul>li>.multimgfull img { position: relative; width: 100%; height: auto !important; } .twocolw>.content>.words>.multibuttons>ul>li>.multimgright { position: relative; width: 45%; height: auto; max-height: 225px; overflow: hidden; padding: 0; margin: 0;display: table-cell; float: right; } .twocolw>.content>.words>.multibuttons>ul>li>.multimgright img { position: relative; width: 100%; height: auto !important; } .twocolw>.content>.words>.multibuttons>ul>li>.multiembshell, .twocolw>.content>.words>.multibuttons>ul>li>.multiembleft, .twocolw>.content>.words>.multibuttons>ul>li>.multiembright, .twocolw>.content>.words>.multibuttons>ul>li>.multiembcenter, .twocolw>.content>.words>.multibuttons>ul>li>.multiembfull{ position: relative; width: 100%; height: auto; overflow: hidden; padding: 0; margin: 0;display: block; float: none;} .twocolw>.content>.words>.multibuttons>ul>li>.multiembshell iframe, .twocolw>.content>.words>.multibuttons>ul>li>.multiembleft iframe, .twocolw>.content>.words>.multibuttons>ul>li>.multiembright iframe, .twocolw>.content>.words>.multibuttons>ul>li>.multiembcenter iframe, .twocolw>.content>.words>.multibuttons>ul>li>.multiembfull iframe { position: relative; width: 100%; height: auto !important; min-height: 265px; } .twocolw>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: auto !important; padding: 4% 6%; margin: 0; font-size: 0.95em; line-height: 1.8em; display: block; color: #333333; vertical-align:top; text-align: left; } .twocolw>.content>.words>.multibuttons>ul>li>.multitext .cms-button {display: inline-block; width: auto !important; height: auto; margin: 10px 0 0 0px;padding: 10px; border-top: none; border-radius: 0; color: #FFF; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; white-space: nowrap;font-size: .85em;line-height: .5em;text-transform: uppercase; text-align: left; letter-spacing: 2px;font-weight: 800; } .twocolw>.content>.words>.multibuttons>ul>li>.multitext .linktitle {font-size: 1.2em; text-align: left; color:#222;font-weight:900; margin: 0px 0px 15px 0px; padding:0; text-transform: uppercase; } .twocolw>.content>.words>.multibuttons>ul>li>.multitext>p {margin: 20px 0px 5px 0px; padding:0; line-height: 1.8em;} .twocolw>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:link, .twocolw>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:visited {text-decoration:none;} .twocolw>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:active, .twocolw>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:hover{text-decoration:underline;} .twocolw>.content>.words>.multibuttons>ul>li>.multitext>.ctabutton {display: inline-block; width: auto !important; height: auto; margin: 10px 0 0 0px;padding: 10px; /*background-color: #f6f6f6;*/ border-top: none; border-radius: 0; color: #FFF; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; white-space: nowrap;font-size: .85em;line-height: .5em;text-transform: uppercase; text-align: left; letter-spacing: 2px;font-weight: 800;} .twocolw>.content>.words>.multibuttons>ul>li>.multitext>.ctabutton>button.modal-open {display: inline; width: auto; margin: 0; padding: 0; float: left; word-wrap: break-word; outline: none; border: none; text-align: left; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: bold; } /* Bottom Buttons */ #multibuttons>h2 { font-size: 1.4em; font-weight: bold; } #multibuttons { position: relative; width: 90%; height: auto !important; overflow: visible; padding: 2% 5% 5% 5%; margin: 0px auto; display: block;background: #f6f6f6; } #multibuttons .buttons { display: block; width: 100%; height: auto !important; overflow: visible; margin: 20px 0px; padding: 0px; font-size: 0.9em; letter-spacing: 2px; text-transform: uppercase; font-weight: 900; } #multibuttons .buttons ul { width: 100%; display: block; height: auto !important; overflow: visible; list-style: none; float: none; margin: 20px auto 0 auto; padding: 0px; } #multibuttons .buttons li { list-style: none; display: inline; color:#222; background-color: #FFF; margin: 0px 30px 0px 0px; padding: 15px 20px; border: 2px solid #e6e6e6; white-space: nowrap; height: 100px; clear: right; } #multibuttons .buttons li a:link, #multibuttons .buttons li a:visited { color:#222; text-decoration: none; } #multibuttons .buttons li a:hover, #multibuttons .buttons li a:active { color:#222; text-decoration: underline; } /* Bottom Buttons */ #bottombuttons>h2 { font-size: 1.4em; font-weight: bold; } #bottombuttons { position: relative; width: 90%; height: auto !important; overflow: visible; padding: 2% 5% 5% 5%; margin: 0px auto; display: block;background: #f6f6f6; min-height: 200px; } #bottombuttons .bbtext { position: relative; margin: 0 auto; width: auto !important; } #bottombuttons .bbembed { position: relative; float: left; display: inline-block; margin: 0 30px;width: auto !important; min-width: 0px;} #bottombuttons .buttons { display: block; width: 100%; height: auto !important; overflow: visible; margin: 20px 0 0 0; padding: 0px; font-size: 0.9em; letter-spacing: 2px; text-transform: uppercase; font-weight: 900; } #bottombuttons .buttons ul { width: 100%; display: block; height: auto !important; overflow: visible; list-style: none; float: none; margin: 20px auto 0 auto; padding: 0px; } #bottombuttons .buttons li { list-style: none; display: inline-block; color:#222; background-color: #FFF; margin: 0px 30px 10px 0px; padding: 15px 20px; border: 2px solid #e6e6e6; white-space: normal; height: auto !important; clear: right; } #bottombuttons .buttons li a:link, #bottombuttons .buttons li a:visited { color:#222; text-decoration: none; } #bottombuttons .buttons li a:hover, #bottombuttons .buttons li a:active { color:#222; text-decoration: underline; } /* photo clusters */ #photocluster { position: relative; width: 95%; height: auto !important; display: block; float: none; margin: 0 auto; padding: 0; max-width: 1200px; } #photocluster h2 {font-size: 1.2em; font-weight: 900; color:#222; text-transform: uppercase; letter-spacing: 3px; padding: 0 0 20px 0; border-bottom: 1px solid #222; margin: 0 0 20px 0; text-align: center; } #photocluster .solophoto { position: relative; width: 50%; float: left; margin: 0; padding: 0; z-index:1000; } #photocluster .solophoto .soloimg { position: relative; width: 100%; height: auto !important; max-height: 557px; display: block; margin: 0; padding: 0; overflow: hidden; } #photocluster .solophoto .soloimg img { width: 100%; height: auto !important; margin: 0; padding: 0; } #photocluster .solophoto .solovid { position: relative; width: 100%; height: auto !important; min-height: 400px; display: block; margin: 0; padding: 0; overflow: visible;} #photocluster .solophoto .solovid iframe { position: absolute;top: 0;left: 0; width: 100%; height: 100%;} #photocluster .solophoto .solotext { position: absolute; bottom: 0; width: 90%; height: auto !important; display: block; margin: 0; padding: 5%; color: #FFF; font-size: 1.7em; font-weight: 600;z-index:1001; } #photocluster .solophoto .solotext h2 { color: #FFF; font-size: 1.7em; } #photocluster .solophoto .solocaption { position: relative; background: #f6f6f6; margin-top: 15px;padding: 20px; } #photocluster .cluster { position: relative; width: 48.5%; float: left; margin: 0; padding: 0;} #photocluster .cluster .clustimg { position: relative; width: 47%; height: 273px; max-height: 273px; float: left; margin: 0 0 2% 2%; padding: 0; background: #222; color: #FFF; } #photocluster .cluster .clustimg img { width: 100%; height: auto !important; } #photocluster .cluster .clustimg .clustvid { position: relative; width: 100%; height: auto; margin: 0; padding: 0; } #photocluster .cluster .clustimg .clustvid iframe { position: absolute;top: 0;left: 0; width: 100%; height: 100%; min-height: 200px; margin: 0; padding: 0; overflow: visible; z-index: 9999;} #photocluster .cluster .clustimg iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; overflow: visible; z-index: 9999;} #photocluster .cluster .clustimg .clusttext { position: absolute; bottom: 1%; width: 90%; height: auto !important; display: block; margin: 0; padding: 5%; font-size: 1.1em; color: #FFF; font-weight: 200; } .solotext a:link, .solotext a:visited { color: #FFF; text-decoration: none; margin: 0px; } .solotext a:active, .solotext a:hover { color: #FFF; text-decoration: underline; } .clusttext a:link, .clusttext a:visited { color: #FFF; text-decoration: none; margin: 0px; font-weight: 800;font-size: 1.2em; } .clusttext a:active, .clusttext a:hover { color: #FFF; text-decoration: underline; font-weight: 800;font-size: 1.2em; } body.details #text iframe {width: 80%; height: 460px; min-height: auto; } /* Video Cols */ .videorow { position: relative; display: block; width: 100%; height: auto !important; min-height: 0px; margin: 10px auto; padding: 0px; } .videorow .videocol { position:relative; display: inline; float: left; width: 48%; margin: 30px 0; padding-right: 2%; } .videorow .videocol .embedshell { position: relative; display: inline; width: 48%; height: auto !important; float: left; margin: 0px; padding: 0px; max-height: 150px; } .videorow .videocol .embedshell iframe { display: block; width: 100%; float: none; margin: 0px; padding: 0px; max-height: 150px; } .videorow .videocol .videotext { position: relative; display: inline; width: 48%; height: auto !important; float: left; margin: 0px; padding: 0 0 0 3%; max-height: 150px; } .videorow h3, .videorow .videocol .videotext h3 { margin: 0px; padding: 0; } .videorow ul { margin: 0px; padding: 0px; height: 150px; overflow-y: scroll; } /* Main Video Styles */ #video{ width:90%; min-height:0px; background-color: #ededed;overflow-x:auto; overflow-y: hidden; position: relative; margin: 0px auto; padding: 0px; } #video .content{ width:7000px; height:300px; background-color: #ededed; padding: 10px 20px; /* just an example*/} #video .content .textcol{ width:250px; height:498px; float:left; margin: 0px 20px 0px 0px; padding: 0px 10px 0px 0px; } #video .content .textcol { /*width: 95%; height: auto !important; margin: 0px 20px 0px 0px; padding: 0px 10px 0px 0px; overflow: scroll; */} #video .content iframe { width:95%; height: auto; max-height: 130px; float:left; margin: 0px 20px 0px 0px; padding: 0px 10px 0px 0px; position: relative; } #footnote { position: relative; display:block; width:85%; margin: 10px auto; padding: 10px 0; font-size: 0.8em; font-style: italic; color: #666; border-top: 1px solid #222; } /* footer styles */ .footer { font-size: .9em; color: #FFF; line-height: 20px; } footer { position: relative; width: 100%; height: auto; min-height: 280px; margin: 0px; padding: 0; background-color: #222; display: block; } footer ul {margin: 0px; padding: 0px; list-style:none;} footer .imgshell img { height: 35px; width: auto; margin: 0px; } footer .content { position: relative; width: 100%; max-width: 1200px; padding: 20px 0px; margin: 0 auto; background-color: #222; display:table; height: auto;} footer .content a:link, footer .content a:visited { color: #FFF; text-decoration:none;} footer .content a:hover, footer .content a:active { color:#FF5C5C; text-decoration:underline;} footer .footercol .ctabutton a:hover, footer .footercol .ctabutton a:active { color:#FFF; text-decoration:underline;} footer .footercol { position: relative; float:left; width: auto; max-width: 50%; margin: 0px 30px 0px 0px; padding: 0px 0px 20px 30px; /*border-left: 1px solid #CCC;*/ } footer .footercol.first { padding: 0px 0px 0px 15px; border-left: none;} footer .footercol #imgfooter img { position: relative; width: 100%; } footer .footercol #imgfooter a { position: relative; width: 100%; height: 100%; } footer .footercol img { position: relative; width: 100%; } footer .content #footercontact { position: relative; float: left; width: auto; display: table-cell; margin: 0; } footer .content #footercontact .imgshell { display:block; height: 40px; width: auto !important; margin: 0px; padding: 0; } footer .content #footercontact .subtitle { display:block; float:none; color: #FFF; font-size: 1.6em; font-weight: 100; margin: 0 0 10px 0; padding: 0; clear: both;} footer .content #footercontact #footiconbox { margin: 10px 0 0 0; } footer .content #footercontact #footiconbox .footericons { float: left; margin: 0 10px 0 0; height: auto; width: auto;} footer .content #footercontact #footiconbox .footericons img { height: 25px; width: auto;} footer .content #footercontent { position: relative; float: left; width: auto !important; min-width: 400px; display: table-cell; margin: 30px 0 0 0;padding: 0 20px; } footer .content #footercontent .imgshell { height: 40px; width: auto !important; margin: 0px; padding: 0;} footer .content #footercontent .subtitle { color: #FFF; font-size: 0.9em; text-transform: uppercase; letter-spacing: 2px; } footer .content #footercontent ul { display: block;} footer .content #footercontent .ctabutton { margin: 15px 0 0 0; } /* ------------- what is this for? ------------ */ ul.news {list-style: none; padding: 0px; margin: 0px 10px 10px 10px; font-size: 1.1em; } ul.news .imgleft {float:left; padding: 0px; margin: 0px 10px 10px 0px; width:100px; height:100px; overflow: hidden; } ul.news .imgleft img { width:100px; height:auto; } ul.news li { padding: 0px 10px 10px 10px; margin: 0px 0px 10px 0px; border-bottom: 1px solid #ededed; } ul.news .caption { font-size: 10px; } ul.newslinks button.linkbutton, ul.news button.linkbutton, button.linkbutton.newslink {display: inline;width: auto;color: #ad1a1f;text-align: left;text-decoration: none;} ul.news button.linkbutton:visited, button.linkbutton.newslink:visited {display: inline;width: auto;color: #ad1a1f;text-align: left;text-decoration: none;} ul.news button.linkbutton:hover, button.linkbutton.newslink:hover {display: inline;width: auto;color: #ad1a1f;text-align: left;text-decoration: underline;} ul.newslinks li > button.linkbutton:first-child, ul.news li > button.linkbutton:first-child {display: inline;} button.linkbutton, button.linkbutton:focus, button.linkbutton:active { background: none;text-align: left; border: none; display: inline; font: inherit; margin: 0; padding: 0; outline: none; outline-offset: 0; color: inherit; cursor: pointer; text-decoration: inherit; } .newstext {position: relative; text-align: left; margin: 0; padding: 20px 0;} .newstext .imgleft {position: relative;display:inline;float:left;width:25%; height: auto; margin: 0 10px 10px 0; padding: 0;} .newstext .imgleft img {width: 100%; height: auto; } /* ------------- what is this for? ------------ */ body.calendar .cal_event h1 { font-size: 2.0em; text-transform: none;} body#home #hppr {position: relative; width: 100%; max-width: 1100px; display: table; margin: 20px auto; } body#home #hppr .hpprnews {position: relative; width: 75%; display: table-cell; float: left; } body#home #hppr .hpprnews>.hpcols {position: relative; width: 45%; display: block; float: left; margin: 0 5% 0 0; } body#home #hppr .hpprnews>.hpcols img {position: relative; width: 100%; height: auto; } body#home #hppr .hpprnews>.hpcols>.image>.caption {position: relative; width: 100%; height: auto; line-height: 1em; text-align: left; margin:0;padding:0; } body#home #hppr .hpprnews>.hpcols>.image iframe {width: 100%; height: 100%; min-height: 200px; } body#home #hppr .hpprnews>.hpcols>.hpsubject {position: relative; width: 100%; height: auto; line-height: 1em; text-align: left; margin:25px 0 10px 0;padding:0; text-transform: uppercase; font-size: 0.8em; font-weight: 800;} body#home #hppr .hpprnews>.hpcols a:link, body#home #hppr .hpprnews>.hpcols a:visited { color:#ad1a1f; text-decoration: none; } body#home #hppr .hpprnews>.hpcols a:active, body#home #hppr .hpprnews>.hpcols a:hover { color:#ad1a1f; text-decoration: underline; } body#home #hppr>h2 , body#home #hppr .subtitle, body#home #hppr .hpprevents>h2 {color: #222;} body#home #hp2pr {position: relative; width: 100%; max-width: 1100px; display: table; margin: 0px auto 60px auto; } body#home #hp2pr .hp2prnews {position: relative; width: 73%; display: table-cell; float: left; } body#home #hp2pr .hp2prnews>.hp2cols {position: relative; width: 67%; display: block; float: left; margin: 0 3% 0 0; } body#home #hp2pr .hp2prnews>.hp2cols a {text-decoration: none; } body#home #hp2pr .hp2prnews>.hp2cols a:active, body#home #hp2pr .hp2prnews>.hp2cols a:hover {text-decoration: underline; } body#home #hp2pr .hp2prnews>.hp2cols img {position: relative; width: 100%; height: auto; } body#home #hp2pr .hp2prnews>.hp2cols>.image>.caption {position: relative; width: 100%; height: auto; line-height: 1em; text-align: left; margin:0;padding:0; } body#home #hp2pr .hp2prnews>.hp2side {position: relative; width: 30%; display: block; float: left; margin: 0; padding: 0%; background: #FFF; } body#home #hp2pr .hp2prnews>.hp2side img {width: 100%; height: auto !important;} body#home #hp2pr>.hp2prfeed { position: relative; width: 24%; padding: 0%; display: table-cell; float: left; margin: 0 3% 0 0; } body#home #hp2pr>.hp2prfeed>ul.hpevents {position: relative; width: 100%; display: table; padding: 0; margin: 10px 0 0 0; list-style: none; } body#home #hp2pr .hp2prfeed>ul.hpevents li {position: relative; display: block; width: 100%;padding: 0; margin: 0; list-style: none;} body#home #hp2pr>.hp2prfeed>ul.hpevents a:link, body#home #hp2pr>.hp2prfeed>ul.hpevents a:visited {color: #ad1a1f; text-decoration: none;} body#home #hp2pr>.hp2prfeed>ul.hpevents a:active, body#home #hp2pr>.hp2prfeed>ul.hpevents a:hover {color: #ad1a1f; text-decoration: underline;} body#home #hp2pr .datesml {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 1.5em; color: #222; font-weight: 800; } body#home #hp2pr .day {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 0.8em; text-transform: uppercase; letter-spacing: 1px; color: #CCC; } body#home #hp2pr>h2 , body#home #hp2pr .subtitle, body#home #hp2pr .hpprevents>h2 {color: #222;} body#home #hp2pr strong { font-weight: 900; } body#home #hp2pr .hpprevents li a:link, body#home #hp2pr .hpprevents li a:visited { color:#ad1a1f; text-decoration: none; font-weight: 800; } body#home #hp2pr .ctabutton { background: #222; } body#home #hppr>.hpprfeed { position: relative; width: 24%; padding: 0%; display: table-cell; float: left; margin: 0 1% 0 0; } body#home #hppr>.hpprfeed>ul.hpevents {position: relative; width: 92%; display: table; padding: 3%; margin: 0 1% 0 0; list-style: none; border: 1px solid #ededed;} body#home #hppr .hpprfeed>ul.hpevents li {position: relative; display: block; width: 100%;padding: 0; margin: 0; list-style: none;} body#home #hppr .datesml {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 1.5em; color: #222; font-weight: 800; } body#home #hppr .day {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 0.8em; text-transform: uppercase; letter-spacing: 1px; color: #CCC; } body#home #hppr>h2 , body#home #hppr .subtitle, body#home #hppr .hpprevents>h2 {color: #222;} body#home #hppr strong { font-weight: 900; } body#home #hppr .hpprevents li a:link, body#home #hppr .hpprevents li a:visited { color:#ad1a1f; text-decoration: none; font-weight: 800; } /* PR News Feeds for a News Page */ body#newsroom #hppr {position: relative; width: 100%; max-width: 1100px; display: table; margin: 20px auto; } body#newsroom #hppr .hpprnews {position: relative; width: 75%; display: table-cell; float: left; } body#newsroom #hppr .hpprnews>.hpcols {position: relative; width: 45%; display: block; float: left; margin: 0 5% 0 0; } body#newsroom #hppr .hpprnews>.hpcols img {position: relative; width: 100%; height: auto; } body#newsroom #hppr .hpprnews>.hpcols>.image>.caption {position: relative; width: 100%; height: auto; line-height: 1em; text-align: left; margin:0;padding:0; } body#newsroom #hppr .hpprnews>.hpcols>.hpsubject {position: relative; width: 100%; height: auto; line-height: 1em; text-align: left; margin:25px 0 10px 0;padding:0; text-transform: uppercase; font-size: 0.8em; font-weight: 800;} body#newsroom #hppr .hpprnews>.hpcols a:link, body#news #hppr .hpprnews>.hpcols a:visited { color:#ad1a1f; text-decoration: none; } body#newsroom #hppr .hpprnews>.hpcols a:active, body#news #hppr .hpprnews>.hpcols a:hover { color:#ad1a1f; text-decoration: underline; } body#newsroom #hppr>h2 , body#news #hppr .subtitle, body#news #hppr .hpprevents>h2 {color: #222;} body#newsroom #hppr .hpprfeed { position: relative; width: 25%; padding: 0%; display: table-cell; float: left; } body#newsroom #hppr .hpprevents { position: relative; width: 100%; padding: 0%; display: table-cell; float: left; } body#newsroom #hppr .hpprevents>.hpcols {position: relative; width: 100%; padding: 3%; display: block; border: 1px solid #222; } body#newsroom #hppr .hpprevents>.hpcols ul.hpevents {position: relative; width: 100%; display: table; padding: 0; margin: 0; list-style: none; } body#newsroom #hppr .hpprevents>.hpcols ul.hpevents li {position: relative; display: table-cell; width: 22%;float: left; padding: 0 1% 0 0; margin: 0 1% 0 0; list-style: none; border-right: 1px solid #ededed; } body#newsroom #hppr .date {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 1.5em; color: #222; font-weight: 800; } body#newsroom #hppr .day {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 0.8em; text-transform: uppercase; letter-spacing: 1px; } body#newsroom #hppr>h2 , body#news #hppr .subtitle, body#news #hppr .hpprevents>h2 {color: #222;} body#newsroom #hppr strong { font-weight: 900; } body#newsroom #hppr .hpprevents li a:link, body#news #hppr .hpprevents li a:visited { color:#ad1a1f; text-decoration: none; } /* PR News Feeds for a News Page */ body#news #hppr {position: relative; width: 100%; max-width: 1100px; display: block; margin: 20px auto 50px auto; } body#news #hppr .hpprnews {position: relative; width: 100%; display: block; float: none; margin: 0;} body#news #hppr .hpprnews>.hpcols {position: relative; width: 100%; display: block; vertical-align: top; float: none; margin: 0 5% 0 0; } body#news #hppr .hpprnews .hpcols .newsimage {position: relative; width: 58%; height: auto; display: inline;float: left; margin:0 2% 0 0;padding:0; } body#news #hppr .hpprnews>.hpcols img {position: relative; width: 100%; height: auto; } body#news #hppr .hpprnews>.hpcols>.image>.caption {position: relative; width: 100%; height: auto; line-height: 1em; text-align: left; margin:0;padding:0; } body#news #hppr .hpprnews>.hpcols>.newstext {position: relative; width: 40%; display: inline;float: left; height: auto; line-height: 2em; text-align: left; margin:0;padding:0; } body#news #hppr .hpprnews>.hpcols>.newstext>.ctabutton a {color: #FFF; } body#news #hppr .hpprnews>.hpcols>.hpsubject {position: relative; width: 100%; height: auto; line-height: 1em; text-align: left; margin:25px 0 10px 0;padding:0; text-transform: uppercase; font-size: 0.8em; font-weight: 800;} body#news #hppr .hpprnews>.hpcols a:link, body#news #hppr .hpprnews>.hpcols a:visited { color:#ad1a1f; text-decoration: none; } body#news #hppr .hpprnews>.hpcols a:active, body#news #hppr .hpprnews>.hpcols a:hover { color:#ad1a1f; text-decoration: underline; } body#news #hppr>h2 , body#news #hppr .subtitle, body#news #hppr .hpprevents>h2 {color: #222;} body#news #hppr .hpprfeed { position: relative; width: 30%; padding: 1%; display: table-cell; float: left; } body#news #hppr .hpprfeed a { text-decoration: none; } body#news #hppr .hpprfeed h2 { color: #222; } body#news #hppr .hpprfeed .hpcols ul {position: relative; width: 100%; display: block; padding: 0; margin: 0; list-style: none; } body#news #hppr .hpprfeed .hpcols ul li { margin: 20px 0;} body#news #hppr .hpprfeed .hpcols ul li a { color: #222;} body#news #hppr .hpprevents { position: relative; width: 30%; padding: 1%; display: table-cell; float: left; } body#news #hppr .hpprevents>.hpcols {position: relative; width: 100%; padding: 0%; display: block;} body#news #hppr .hpprevents>.hpcols ul.hpevents {position: relative; width: 100%; display: block; padding: 0; margin: 0; list-style: none; } body#news #hppr .hpprevents>.hpcols ul.hpevents li {position: relative; display: block; width: 100%;float: none; padding: 0 1% 0 0; margin: 20px 0; list-style: none; } body#news #hppr .date {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 1.5em; color: #222; font-weight: 800; } body#news #hppr .day {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 0.8em; text-transform: uppercase; letter-spacing: 1px; } body#news #hppr>h2 , body#news #hppr .subtitle, body#news #hppr .hpprevents>h2 {color: #222;} body#news #hppr strong { font-weight: 900; } body#news #hppr .hpprevents li a:link, body#news #hppr .hpprevents li a:visited { color:#ad1a1f; text-decoration: none; } body#news #hppr .hpprvideo { position: relative; width: 30%; padding: 1%; display: table-cell; float: left; } body#news .date {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 1.5em; color: #222; font-weight: 800; } body#news .day {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 0.8em; text-transform: uppercase; letter-spacing: 1px; color: #CCC; } #divpr { position: relative; width: 100%; padding: 1%; display: table; float: none; } #divpr .hpprfeed { position: relative; width: 30%; padding: 1.5%; display: table-cell; float: left; } #divpr .hpprfeed .image { position: relative; width: 100%; height: auto !important; padding: 0; margin: 0; display: block; float: none; } #divpr .hpprfeed .image img { position: relative; width: 100%; height: auto !important; padding: 0; margin: 0; display: block; float: none; } #divpr .hpprfeed li.newsitems { margin: 0 0 25px 0; } #divpr .hpprfeed ul.hpevents {position: relative; width: 100%; display: block; padding: 0; margin: 0; list-style: none; } #divpr .hpprfeed ul.hpevents li {position: relative; display: block; width: 100%;float: none; padding: 0 1% 0 0; margin: 20px 0; list-style: none; } #divpr .hpprfeed ul.hpevents li .date {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 1.5em; color: #222; font-weight: 800; } #divpr .hpprfeed ul.hpevents li .day {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 0.8em; text-transform: uppercase; letter-spacing: 1px; } /* Code specfic for inline images in PR News */ /*body.news h1 {position: relative; width: 90%; height: auto !important; margin: 0px 5%; font-size: 2.0em;}*/ body.news .newscontent { position: relative; width: 90%; height: auto !important; margin: 40px 0%; padding: 40px 0 0 0; border-top: 1px solid #ededed; line-height: 2em; } body.news .newscontent .primgfeat { position: relative; float: left; width: 60%; height: auto !important; margin: 0px 25px 0px 0px; padding: 0; } body.news .newscontent .primgfeat img { position: relative; width: 100%; height: auto !important; margin: 0px; padding: 0; } body.news .newscontent .primgfeat .caption { position: relative; float: left; width: 100%; height: auto !important; text-align: left; margin: 0; padding: 0; color: #666; } body.news .primgleft { position: relative; float: left; width: 30%; height: auto !important; margin: 15px 20px 15px 0px; } body.news .primgright { position: relative; float: right; width: 30%; height: auto !important; margin: 15px 0px 15px 20px; } body.news .primgcenter { position: relative; float: none; width: 100%; height: auto !important; margin: 15px 0px 15px 0px; } body.news .primgbot { position: absolute; bottom: 0px; display: inline-block; float: left; width: auto !important; height: 250px; margin: 15px 15px 5px 0px; } body.news .primgleft img, body.news .primgright img, body.news .primgcenter img, body.news .primgbot img { width: 100%; height: auto !important; } body.news .primgcenter img { margin-left: auto; margin-right: auto; } body.news .newscontent .primgleft .caption, body.news .newscontent .primgright .caption, body.news .newscontent .primgcenter .caption, body.news .newscontent .primgbot .caption { position: relative; float: left; width: 100%; height: auto !important; text-align: left; margin: 0; padding: 0; color: #666;} body.newsroom .feattext .primgfeat { position: relative; float: left; width: 60%; height: auto !important; margin: 0px 25px 0px 0px; padding: 0; } body.newsroom .feattext .primgfeat img { position: relative; width: 100%; height: auto !important; margin: 0px; padding: 0; } body.newsroom .feattext .primgfeat .caption { position: relative; float: left; width: 100%; height: auto !important; text-align: left; margin: 0; padding: 0; color: #666; } body.news .releases { position:relative; display: block; width: 100%;max-width: 1100px; height: auto; padding: 0; margin: 50px auto; } body.news .releases .content { position:relative; display: block;width: 100%;height: auto; padding: 0; margin: 0 auto; } body.news .releases .content .prside { position:absolute; right: 0; top: 0; float: right;width: 20%;height: auto; padding: 0; margin: 0; } body.news .releases .content .prside .prcontact { position:relative; display: block;width: 100%;height: auto; padding: 0; margin: 200px 0 30px 0; } body.news .releases .content .prside .prlist { position:relative; display: block;width: 80%;height: auto; padding: 2.5% 5%; margin: 20px 0; background: #f6f6f6; font-size: 0.9em;} body.news .releases .content .prside .prlist .subtitle { position:relative; color: #222; font-size: 1.2em; text-align: center;} body.news .releases .content .prtext { position: relative; left: 0; top: 50px; float:left; width: 75%;height: auto; padding: 0; margin: 0; line-height: 2.0em; vertical-align: top; } body.news .releases .content .prtext .primg {position:relative; display: block;width: 100%;height: auto; padding: 0; margin: 0; } body.news .releases .content .prtext .primg img {position:relative; width: 100%;height: auto; padding: 0; margin: 0; } body.news .releases .content .prtext .primglandscape {position:relative; display: block;width: 100%;height: auto; padding: 0; margin: 0; } body.news .releases .content .prtext .primglandscape img {position:relative; width: 100%;height: auto; padding: 0; margin: 0; } body.news .releases .content .prtext .primgportrait {position:relative; display:inline;float:left; width:40%;height: auto; padding: 0; margin: 0 3% 0 0; } body.news .releases .content .prtext .primgportrait img {position:relative; width: 100%;height: auto; padding: 0; margin: 0; } body.news .releases .content .prtext .caption {position:relative; text-align: left; width: 100%; height: auto !important; overflow: visible; padding: 0; margin: 0 0 25px 0; } body.news .releases .content .prtext h1 { font-size: 1.8em; padding: 0; margin: 2% 0 5% 0; text-transform: none;} body.news h1 { text-transform: none;} body#newsitem h1 { text-transform: none; font-size: 1.8em; line-height: 1.2em; margin-right: 2%;} /* Newsletter Styles */ body#newsletter .ccenewsletter {position: relative; display: block; width: 100%; height: auto !important; padding: 0; margin: 0;} body#newsletter .ccenewsletter ul {position: relative; display: block; width: 100%; height: auto !important; padding: 0; margin: 0;} body#newsletter .ccenewsletter ul li {position: relative; display: table; width: 100%; height: auto !important; min-height: 150px; list-style: none; padding: 10px 0; margin: 10px 0; border-bottom: 1px solid #ededed; } body#newsletter .ccenewsletter ul li .imgleft {position: relative; display: table-cell; float: left; width: 26%; height: auto !important; padding: 0; margin: 0 2% 0 0; } body#newsletter .ccenewsletter ul li .imgleft img {position: relative; width: 100%; height: auto !important; padding: 0; margin: 0; } body#newsletter .ccenewsletter ul li .newstext {position: relative; display: table-cell; float: left; width: 70%; height: auto !important; padding: 0; margin: 0; } body#newsletter>.ccenewsletter>ul>li>.newstext>h2 { font-size: 1.2em; padding: 0; margin: 0; } /* CCE Newsroom page Styles */ .cce-feature { position: relative; width: 100%; height: auto !important; background: #f6f6f6; padding: 0; margin: 20px 0; display: table; } .cce-feature .cce-featcol { position: relative; width: 100%; max-width: 1200px; height: auto !important; padding: 50px; margin: 0 auto; } .cce-feature .cce-featcol .featimg { position: relative; width: 60%; height: auto !important; padding: 0; margin: 0; float: left; display: table-cell;} .cce-feature .cce-featcol .featimg img { position: relative; width: 100%; height: auto !important; padding: 0px; margin: 0; } .cce-feature .cce-featcol .feattext { position: relative; width: 35%; height: auto !important; padding: 2%; margin: 0; float: left; display: table-cell; line-height: 2em;} .cce-feature .cce-featcol .feattext h2 { line-height: 1.5em; margin: 0; padding: 0;} .cce-feature .cce-featcol .feattext p { line-height: 2em; margin: 0; padding: 0;} .cce-newscols { position: relative; width: 100%; max-width: 1200px; height: auto !important; padding: 0px; margin: 50px auto; display: table; } .cce-newscols .cce-highlights { position: relative; width: 60%; height: auto !important; padding: 0; margin: 20px 0; display: table-cell; vertical-align: top; } .cce-newscols .cce-highlights .cce-highcol { position: relative; width: 41%; height: auto !important; padding: 0 9% 0 0; margin: 0; display: table-cell; vertical-align: top; } .cce-newscols .cce-highlights .cce-highcol .highimg { position: relative; width: 98%; height: auto !important; max-height: 310px; overflow: hidden; padding: 0; margin: 0; display: block; } .cce-newscols .cce-highlights .cce-highcol .highimg img { position: relative; width: 100%; height: auto !important; padding: 0px; margin: 0; } .cce-newscols .cce-highlights .cce-highcol .highimg a { display: block; position: relative; width: 100%; height: 100%; padding: 0px; margin: 0; z-index: 100;} .cce-newscols .cce-highlights .cce-highcol .hightext { position: relative; width: 98%; height: auto !important; padding: 1%; margin: 0 auto; display: block; line-height: 1.8em; } .cce-newscols .cce-highlights .cce-highcol .hightext h2 { color: #222; font-size: 1.2em; } .cce-newscols .cce-highlights .cce-highcol .hightext h2 a { color: #222; text-decoration: none; } .cce-newscols .cce-highlights .cce-highcol .hightext h2 a:hover { color: #222; text-decoration: underline; } .cce-newscols .cce-highlights .cce-videocol { position: relative; width: 90%; height: auto !important; padding: 0; margin: 0 auto; display: block; vertical-align: top; } .cce-newscols .cce-highlights .cce-videocol iframe { width: 100%; height: auto !important; min-height: 400px; padding: 0; margin: 0 auto; display: block; } .cce-newscols .cce-highlights .cce-videocol .hightext h2 { color: #222; font-size: 1.2em; } .cce-newscols .cce-newslist { position: relative; width: 31%; height: auto !important; padding: 3%; margin: 20px 0; display: table-cell; vertical-align: top; background: #ededed; } .cce-newscols .cce-newslist .cce-listcol { position: relative; width: 100%; height: auto !important; padding: 0; margin: 0 0 20px 0; display: block; } .eventbox {position: relative; width: 100%; max-width: 1200px; height: auto !important; margin:0px auto; padding:0px; display:block; color: #222; } .eventbox ul {position: relative; width: 100%; display: block; } .eventbox h2 { font-size: 2.3em; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; margin:0px 0px 10px 0px;padding:0px;color:#222; } .eventbox li { text-align: left; width: 100%; height: 40px; list-style:none; display: block; float: none; color: #222; margin: 0 0 40px 0 !important;} .eventbox li .eventdate { position: relative; width: 8%; float: left; color: #FFF; background: #222; padding: 1%; margin: 0 3% 0 0; border: none; text-align: center; } .eventbox li .eventdate .datesml { color: #FFF; font-weight: bold; font-size: 28px; line-height: 20px; padding: 0px; margin: 0px; display: block;text-align: center; } .eventbox li .eventdate .month { color: #FFF; text-transform:uppercase; font-size: 10px; line-height: 10px; font-weight: bold; text-align: center; padding: 0px; margin: 0px 0px 3px 0px;display: block; } .eventbox li .eventarea { position: relative; width: 70%; text-align: left; float: left; padding: 0px; margin: 0px; padding-right: 0px; margin-right: 0px;border-right: none; } .eventbox a:link, body#event .eventtext a:visited { color:#ad1a1f; font-size: 1.2em; text-decoration: none; } .eventbox a:hover, body#event .eventtext a:active { color:#ad1a1f; text-decoration: underline; } .eventbox .button-el { float: left; display: inline; margin-right: 20px; } .eventbox .button { position: absolute; right: 20%; top: 0px; } .eventbox .button a:link, .eventbox .button a:visited { color: #FFF; } ul.events { display: block;} ul.events li { list-style: none; } ul.events li .eventdate { position: relative; width: 10%; float: left; color: #FFF; background: #222; padding: 2%; margin: 0 1% 0 0; border: none; text-align: center; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif;} ul.events li .eventdate .datesml { color: #FFF; font-weight: bold; font-size: 28px; line-height: 20px; padding: 0px; margin: 0px; display: block;text-align: center; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; } ul.events li .eventdate .month { color: #FFF; text-transform:uppercase; font-size: 10px; line-height: 10px; font-weight: bold; text-align: center; padding: 0px; margin: 0px 0px 3px 0px;display: block; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; } ul.events li .eventarea { position: relative; width: 70%; float: left; padding: 0px; margin: 0px; padding-right: 10px; margin-right: 10px;border-right: 1px solid #ededed; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; } .newstype { font-size:0.75em; font-weight: 800; line-height: 0.5em; display: block; width: auto !important; height: auto; margin: 10px 0px; padding: 0px; color: #ad1a1f; font-family: "Source Sans Pro", "SourceSans", sans-serif; white-space: nowrap; text-transform:uppercase; letter-spacing: 2px; } body#event ul.eventfeed { position: relative; width: 100%; display: block; height: auto !important; padding: 0 0; } body#event ul.eventfeed li { list-style: none; position: relative; width: 100%; display: block; height: auto !important; min-height: 100px; padding: 0; margin: 10px 0; } body#event ul.eventfeed li .eventdate { position: relative; width: 10%; display: inline; float: left; padding: 2%; background: #ad1a1f; color: #FFF; text-align: center;} body#event ul.eventfeed li .eventarea { position: relative; width: 82%; display: inline; float: left; padding: 2%; background: #f6f6f6; } body#event ul.eventfeed li .eventdate .date{ font-size: 1.5em; } .cal_small { display: none; } .cal_full {display: block; } /* ---------------- Bard Cart Code ----------------- */ #bardcart {position:fixed; display: block; bottom: 0; width: 100%; height: 160px; background: #222; color: #FFF; border-top: 1px solid #FFF; z-index: 9999;} #bardcart .content {position:relative; width: 100%; max-width: 1300px; height: auto; display: table; background: #222; color: #FFF; padding: 1%; margin: 0 auto; overflow-x: scroll; overflow-y: hidden; } #bardcart .content h2 {position:relative;display:table-cell;float:left;width:auto;height:auto;padding:2%;color: #FFF; margin: 0;line-height: 1em;} #bardcart .cartitem {position:relative;display:table-cell;float:left;width:20%;height:auto;padding:1% 2%;} #bardcart .cartitem .carttext {position:relative;display:table-cell;float:left;width:30%;height:auto;padding:5%; vertical-align: middle; text-transform: uppercase; letter-spacing: 2px;} #bardcart .cartitem .cartimg {position:relative;display:table-cell;float:left;width:60%;height:auto;padding:0; vertical-align: middle;} #bardcart .cartitem .cartimg img {position:relative;display:block;width:100%;height:auto;padding:0;} #bardcart .cartitem a:link, #bardcart .cartitem a:visited {color: #FFF; text-decoration: none; } #bardcart .cartitem a:active, #bardcart .cartitem a:hover {color: #FFF; text-decoration: underline;} .box-closeable, .box-closeable.open {/*position: absolute;*/display: block;visibility: visible;opacity: 1; transition: opacity 100ms ease, visibility 0s linear 0s; } .box-closeable.close { display: block; visibility: hidden; opacity: 0; transition: opacity 100ms ease, visibility 200ms linear 0s; } .button-close { /*position: relative;*/ position: absolute; display: inline-block; width: 14px; height: 14px; right: 0px; margin: 10px 10px 10px 10px; padding: 0px 0px 0px 0px; /*background-color: #222222;*/ background-color: transparent; outline: none; border-width: 0px; border-style: solid; border-color: #FFFFFF; border-radius: 0px; overflow: hidden; /*float: right;*/ z-index: 10; } .button-close::before, .button-close::after { display: block; position: absolute; left: -50%; top: 50%; content: ' '; width: 200%; height: 1px; background-color: #FFFFFF; transform-origin: 50% 50%; } .button-close::before { transform: rotate(-45deg) translate(0px, 0px); } .button-close::after { transform: rotate(45deg) translate(0px, 0px); } .button-close:hover { width: 18px; height: 18px; margin: 8px 8px 10px 10px; border-width: 1px; border-color: #999999; } .button-close:active, .button-close:focus { color: #CCCCCC; } .button-close:visited { color: #CCCCCC; } .button-close:hover::before, .button-close:hover::after { color: #CCCCCC; background-color: #FFFFFF; } .button-close:active::before, .button-close:focus::before, .button-close:active::after, .button-close:focus::after { height: 1px; color: #CCCCCC; background-color: #FFFFFF; } /* ---------------------------- Mega SCREEN DISPLAY STYLES ------------------------ */ @media only screen and (min-width: 1901px) and (max-width: 3000px) { #introshell>.sitetitle { position: absolute; top: 10px; left: 25% !important;; width: auto; max-width: 1200px; min-height: 40px;overflow: visible; float: none; margin: 2px auto; padding: 0px; z-index: 1001; border: 1px solid #fff; } } /* ---------------------------- LARGE SCREEN DISPLAY STYLES ------------------------ */ @media only screen and (min-width: 1400px) and (max-width: 1900px) { #introshell>.sitetitle { position: absolute; top: 10px; left: 17% !important; width: auto; max-width: 1200px; min-height: 40px;overflow: visible; float: none; margin: 2px auto; padding: 0px; z-index: 1001; border: 1px solid #FFF; } } /* ---------------------------- LARGE SCREEN DISPLAY STYLES ------------------------ */ @media only screen and (min-width: 1200px) and (max-width: 1401px) { #introshell>.sitetitle { position: absolute; top: 10px; left: 8% !important; width: auto; max-width: 1200px; min-height: 40px;overflow: visible; float: none; margin: 2px auto; padding: 0px; z-index: 1001; border: none; } } /* ---------------------------- DESKTOP ONLY STYLES ------------------------ */ @media only screen and (min-width: 1001px) and (max-width: 1199px) { #ccelogo { width: 126px; height:102px; left: 0%; z-index: 9999; } #ccelogo img { width: 126px; height:102px; left: 0%; z-index: 9999; } #hppr {width: 95%; margin: 20px 2.5%;} header .topnav { width: 100%; height: 25px; background: #222; text-align: right; margin: 0; padding: 0;} header .topnav .toplinks { width: 96%; max-width: 96%; height: 25px; background: #222; color: #CCC; text-align: right; margin: 0; padding: 5px 2%; font-size: 0.8em;} ul.subnav { } ul.subnav li a:link, ul.subnav li a:visited { color:#FFF; text-decoration: none; padding: 10px 20px 10px 20px; margin: 0px;} ul.subnav li a:hover, ul.subnav li a:active { color:#ad1a1f; text-decoration: underline; background-color: #FFF; } body#inside>h2 {font-size: 1.5em; } body#home #hp2pr {position: relative; width: 95%; max-width: 1100px; display: table; margin: 0px auto 60px auto; } footer .content { margin: 0px auto; width: 95%; overflow: hidden; } footer .content #footercontact, footer .content #footercontent { position: relative; width: auto; max-width: 50%; margin: 0 auto; display:inline; float: left; height: auto; } body#home #hppr {position: relative; width: 95%; max-width: 1100px; display: table; margin: 20px 2.5%; } body#home #hppr .hpprnews {position: relative; width: 65%; display: table-cell; float: left; } body#home #hppr>.hpprfeed { position: relative; width: 34%; padding: 0%; display: table-cell; float: left; margin: 0 1% 0 0; } .cce-feature .cce-featcol { position: relative; width: 90%; max-width: 1200px; height: auto !important; padding: 50px; margin: 0 auto; } .cce-feature .cce-featcol .featimg { position: relative; width: 50%; height: auto !important; padding: 0; margin: 0; float: left; display: table-cell;} .cce-feature .cce-featcol .feattext { position: relative; width: 40%; height: auto !important; padding: 1% 0 0 1%; margin: 0; float: left; display: table-cell; line-height: 2em; } .cce-newscols { position: relative; width: 90%; max-width: 1200px; height: auto !important; padding: 0px; margin: 50px auto; display: table; } .cce-newscols .cce-highlights .cce-highcol { position: relative; width: 45%; height: auto !important; padding: 0 5% 0 0; margin: 0; display: table-cell; vertical-align: top; } /* start Text styles */ .text { position: relative; width: 90%; height: auto; margin: 30px auto 30px auto; padding: 0px; display: block; background: #FFF;} } /* ---------------------------- TABLET STYLES ------------------------ */ @media only screen and (min-width: 665px) and (max-width: 1000px) { body { background: #FFF; } h2.pagetitle { margin: 30px 0px 10px 20px; } #ccelogo { width: 100px; height: auto !important; left: 0%; z-index: 9999; } #ccelogo img { width: 100px; height:auto !important; left: 0%; z-index: 9999; } #hppr {width: 95%; margin: 20px 2.5%;} ul.subnav { width: 768px; } ul.subnav li a:link, ul.subnav li a:visited { color:#FFF; text-decoration: none; padding: 10px 10px 10px 10px; } ul.subnav li a:hover, ul.subnav li a:active { color:#ad1a1f; text-decoration: underline; background-color: #FFF; } .active {display: block;} main #maintext { width: 100%; float: none; display: block; max-width: 100%; margin: 0px; height: auto; top: 0px; } main #maintext .content { padding: 0px; margin: 0px; } main #maincol { width: 100%; float: none; display: block; max-width: 100%; clear: both; height: auto; } #maintext>.content>.imgshell, #maincol>.content>.imgshell { float: left; width: 40%; height: auto; margin-right: 10px; } #maintext>.content>.imgright, #maincol>.content>.imgright { float: right; width: 40%; height: auto; margin-left: 10px; } #coltext>.content>.imgshell { float: none; width: 100%; margin: 0px; padding: 0px; } #introshell { position: relative; top: 0px; width: 100%; height: auto !important; min-height: 50px; overflow: hidden; z-index: 1000; margin: 110px auto 0 auto; padding: 0; } #introshell>#title {margin: 25px auto; padding: 10px 0; max-width: 1200px; } #introshell>#title>h1.pagetitle {padding: 0px; margin: 50px auto 0px auto; text-transform: uppercase;text-align: center; color: #222;font-weight: 900; letter-spacing: 2px; } #introshell>.image { position: relative; width: 100%; height: auto !important; background: #222; z-index: 1000; padding: 0; margin: 0; max-height: 550px; min-height: 0px; overflow: hidden; } #introshell .image h1 { position: absolute; bottom: 20%; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: 600;text-transform: uppercase; letter-spacing: 3px; width: 100%; color: #FFF; font-size: 3.0em; line-height: 1em; text-align: center; margin: 0 auto; padding: 1% 0; z-index: 1001; /*background: url(https://www.bard.edu/images/tints/80black.png) repeat;*/ text-shadow: 2px 2px 2px #333;} #introshell>.image>.caption { position: absolute; bottom: 0%; right: 0%; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: 600; display: block; width: auto !important; color: #FFF; text-align: center; margin: 0; padding: 1% 2%; font-style: normal; z-index: 1002; } #introshell>.image>img { width: 100%; height: auto !important; padding: 0; margin: 0; } #introshell>.sitetitle { position: relative !important; top: 0px !important; left: 20px !important; width: 50% !important; height: auto !important; overflow: visible !important; float: left; margin: 0; padding: 0; z-index: 1001;} /* ------- Header Changes for Emergency Ribbon at Top ------- */ #introshell>.sitetitle { position: relative; top: 55px; float: none;} #introshell>.sitetitle img { width: 100%; max-width: 100%; height: auto !important; overflow: visible; float: none; margin: 0 auto; padding: 0px; z-index: 1001; } #introshell>.sitetitle>.sitelogo { position: relative !important; height: auto !important; overflow: visible !important; background-image: none !important;} #introshell>.introbuttons { position: absolute; bottom: 10%; width: 95%; margin: 0 auto; height: auto !important; display: block; z-index: 11000; overflow: visible;} #introshell>.introbuttons>.content { position: relative; width: 95%; margin: 0px auto; align-items: center; text-align: center;} #introshell>.image>.caption { position: absolute; bottom: 5px; left: 0%; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: 600; display: block; width: 30%; color: #FFF; font-size: 0.8em; line-height: 1em; text-align: right; margin: 0; padding: 1%; font-style: normal; } #introshell #title {margin: 0; min-height: 100px;} #introshell #title h1.pagetitle {margin: 0;} /* 2019 Tablet Styles */ ul.subnav { height:30px; font-size: 1.05em; line-height: .9em; } .subnav { font-weight: 200; color:#FFF; line-height: .8em; padding-top: 0px;} #submenu, #sitemenu {position: relative; margin-top: 0px; } .billboard>.content>.words { position: absolute; bottom: 10%; width: 100%; height: auto; z-index: 1000; } .billboard>.content>.words>.padding { position: relative; text-align: center; width: 70%; margin: 0 auto; color: #FFF;} .billboard>.content>.words>.padding>h2 { color: #FFF; font-size: 2em; font-family:"Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; text-shadow: 2px 2px 2px #000;} /* Bottom Buttons */ #bottombuttons .buttons li { list-style: none; display: inline-block; color:#222; background-color: #FFF; margin: 0px 30px 20px 0px; padding: 15px 20px; border: 2px solid #e6e6e6; white-space: normal; height: auto !important; clear: right; } /* heroshell Two column H2 and main image styles */ #heroshell { float:left; position: relative; top: 0px; width: 100%; max-height: 350px; min-height: 100px; overflow: hidden; z-index: 1000; margin: 0 0 20px 0; padding: 0; } #heroshell>.introbuttons { bottom: 28%; } .events .eventcol .eventcolimg img { width: 100%; height: auto; margin: 0; padding: 0;} .events .eventcol .datebox { position: relative; float: left; width: 12%; height: auto; margin: 0; padding: 1%;} .events .eventcol .eventcoltext { position: relative; float: left; width: 60%; height: auto; margin: 0; padding: 0;} .events .eventcol .eventcoltext button.modal-open { text-align: left; text-transform: none; font-size: 1.2em; line-height: 1.2em; letter-spacing: 0px; margin: 10px 0 0 0; padding: 0; color: #ad1a1f;} /* start Highlight Facts styles*/ .highfacts { position:relative; display:block; width:90%; height: auto !important; overflow: visible; margin: 30px auto; padding: 0px; align-content: center;max-width: 1100px; } .highfacts>.content>.words>.padding { position: absolute; bottom: 0%; text-align: left; width: 50%; height: auto !important; max-height: 110px; margin: 0%; padding: 0.5%; display: inline-block; color: #FFF; z-index: 1001; font-size: 1.0em; background:url(https://www.bard.edu/images/tints/80black.png) repeat; } .highfacts>.content>.words>.padding h2 { font-size: 1.25em; } .highfacts>.content>.words>.multibuttons>ul>li { position: relative; width: 40%; min-height: 120px; display: inline-block; list-style: none;color: #333; text-align: center; padding: 1.5%; margin: 0 1% 2% 0; font-size: 1.1em; line-height: 0.9em;align-content: center; background: #f6f6f6; vertical-align: top; } .highfacts>.content>.words>.multibuttons>ul>li>.multitext>.linktitle {position: relative; float: none; display: block; background: none; font-size: 2em; text-align: center; color:#ad1a1f;font-weight:900; margin: 0px 0;} footer {height: auto; overflow: hidden;} footer .content { margin: 0px auto; width: 95%; overflow: hidden; } footer .content #footercontact { position: relative; width: auto; max-width: 50%; margin: 0 auto; padding: 0; display:inline; float: left; height: auto; } footer .content #footercontent { position: relative; width: auto; max-width: 50%; margin: 0 auto; padding: 0; display:inline; float: left; height: auto; } footer .content #footercontent .footercol { position: relative; float:left; width: 30%; max-width: none; margin: 0px; padding: 0px 20px 0px 20px; border-left: none; } body#home main { overflow: hidden; } body#home main #maintext { width: auto !important; top: 0px; } body#home main article { float: none; width: 100%; background-color: transparent; margin-bottom: 20px;} body#home main article h3 { width: 95%; } body#home main article .content { min-height: 140px; } body#home main article .content .imgshell { width: 35%; height: 100%; float: left; margin-top: 20px; } body#home main article .content #textbox { float: right; width: 59%; padding: 3%; margin: 0px; margin-top: 20px; } body#home #eventbox .eventtext {position: relative; width: 55%;} body#home #eventbox #eventad {width: 40%; } body#home #eventbox #eventad img {width: 100%; height: auto !important } body#home #newsbox { display: block; } body#home #hppr {position: relative; width: 95%; max-width: 1100px; display: table; margin: 20px 2.5%; } body#home #hppr .hpprnews {position: relative; width: 90%; display: block; float: none; margin: 0 5%; } body#home #hppr>.hpprfeed { position: relative; width: 90%; padding: 0%; display: block; float: none; margin: 0 5%; } body#home #hp2pr {position: relative; width: 90%; max-width: 1100px; display: table; margin: 0px auto 60px auto; } #links .content { } body.news .releases {position:relative; display: block;width: 100%;max-width: 1100px; height: auto; padding: 0; margin: 0 auto; } body.news .releases .content .prside {position:relative; float: left; display: inline;width: 25%;height: auto; padding: 0; margin: 0 4% 0 0; vertical-align: top;} body.news .releases .content .prside .prcontact {position:relative; display: block;width: 100%;height: auto; padding: 0; margin: 5% 0; } body.news .releases .content .prtext {position:relative; float: right; display: inline;width: 70%;height: auto; padding: 0; margin: 0; line-height: 2.0em; vertical-align: top;} body.news .releases .content .prtext .primg {position:relative; display: block;width: 100%;height: auto; padding: 0; margin: 0; } body.news .releases .content .prtext .primg img {position:relative; width: 100%;height: auto; padding: 0; margin: 0; } body.news .releases .content .prtext .caption {position:relative; text-align: left; width: 100%; height: auto !important; overflow: visible; padding: 0; margin: 0 0 25px 0; } body#newsitem h1 { font-size: 2em;} .cce-feature .cce-featcol { position: relative; width: 90%; max-width: 100%; height: auto !important; padding: 5%; margin: 0 auto; overflow: hidden; } .cce-feature .cce-featcol .featimg { position: relative; width: 95%; height: auto !important; padding: 0; margin: 0 auto; float: left; display: block;} .cce-feature .cce-featcol .feattext { position: relative; width: 95%; height: auto !important; padding: 1% 0 0 0; margin: 0 auto; float: left; display: block; line-height: 2em; } .cce-newscols { position: relative; width: 90%; max-width: 1200px; height: auto !important; padding: 0px; margin: 50px auto; display: table; } .cce-newscols .cce-highlights { position: relative; width: 90%; height: auto !important; padding: 5%; margin: 0 auto; display: block; vertical-align: top; } .cce-newscols .cce-highlights .cce-highcol { position: relative; width: 45%; height: auto !important; padding: 0 5% 0 0; margin: 0; display: table-cell; vertical-align: top; float: none;} .cce-newscols .cce-newslist {position: relative;width: 100%;height: auto !important;padding: 5%;margin: 20px auto;display: block;vertical-align: top;background: #ededed; float: none;} /* PR News Feeds for a News Page */ body#newsroom #hppr {position: relative; width: 90%; max-width: 1100px; display: table; margin: 0px auto; } body#newsroom #hppr .hpprevents { position: relative; width: 90%; padding: 0%; margin: 0 auto; display: table-cell; float: left; } .events ul.hpevents li { position: relative; list-style: none; display: block; width: auto; max-width: 90%; border: 1px solid #222; padding: 10px; margin: 10px auto; text-align:left;} .biography { position: relative; width: 90%; height: auto; margin: 50px auto; padding: 0px; display: block;} .biography>.content>.words { position: relative; display: inline; width: 100%; padding: 0; margin: 0px; line-height: 30px; vertical-align: top; text-align: left; background: #f6f6f6; z-index: 499;} .biography>.content>.words>.padding { margin: 0 5%; padding: 0; z-index: 499; } .biography>.content>.words>.multibuttons { margin: 0 5%; padding: 0%; background: #FFF;} /* Bottom Buttons */ #bottombuttons .buttons li { list-style: none; display: inline-block; color:#222; background-color: #FFF; margin: 0px 30px 20px 0px; padding: 15px 20px; border: 2px solid #e6e6e6; white-space: normal; height: auto !important; clear: right; } /* expand bars new 2/1 */ .expandbars { display: block; width: 85%; max-width: 960px; margin: 20px auto 30px auto; padding: 15px 15px 5px 15px; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; background-color: #FFF; } .expandtint { display: block; width: 85%; max-width: 960px; margin: 20px auto 30px auto; padding: 15px 15px 5px 15px; border-top: 1px solid #fff; border-bottom: 1px solid #fff; background: #ededed; } .expandindent { display: block; width: 75%; max-width: 960px; margin: 20px auto 30px auto; padding: 10px 10px 0px 10px; border-top: 1px solid #666; border-bottom: 1px solid #666; background: #f6f6f6; } /* start FAQ styles */ .faqs { position:relative; display:block; width:67%; max-width: 1000px; height: auto !important; overflow: visible; margin: 50px auto; padding: 0%; } .highlight .content .embshell, .highlight .content .embleft, .highlight .content .embright { position: relative; display:block; width: 98%; overflow: visible; margin: 0 auto 20px auto; align-content: center; } .highlight .content .embshell iframe, .highlight .content .embleft iframe, .highlight .content .embright iframe, .highlight .content .embcenter iframe, .highlight .content .embfull iframe { width: 90%; min-height: 350px; } .highlight>.content>.words {display: block; float: none; width: 90%; margin: 0 auto; } .highlight>.content>.words>.padding {text-align: left; overflow-x: hidden;} .highlight>.content>.words>.padding .ctabutton {width: auto !important;} .highlight>.content>.words>.padding>h2 {font-size: 1.7em;text-align: left;} .highlight .words { position: relative; display: block; left: 0%; bottom: 5px; z-index: 200; text-align: left; width: 95%; margin: 0 auto 20px auto; } .highlight > .content > .words > .padding .ctabutton {width: 90% !important;} .highlight .words h2 { } .highlight .imgcenter { position: relative; display: block; float: none; width: 90%; margin: 0 auto; overflow: visible; } .highlight .imgcenter img { width: 100%; height: auto; } .highlight .imgfull { position: relative; display: block; float: none; width: 90%; margin: 0 auto; overflow: visible; } .highlight .imgfull img { width: auto !important; height: 400px; margin: 0px; } #maintext .highlight .content .imgleft { position: relative; display: block; float: none; width: 90%; margin: 0 auto; overflow: visible; } #maintext .highlight .content .imgright { position: relative; display: block; float: none; width: 90%; margin: 0 auto; overflow: visible; } #maintext .highlight .content .imgshell { position: relative; display: block; float: none; width: 90%; margin: 0 auto; overflow: visible; } .highlight .content .imgleft img, .highlight .content .imgright img { width: 100%; height: auto !important; margin: 0 0 30px 0; } .highlight > .content > .words > .multibuttons > ul {width: 90%; padding: 0; } .highlight > .content > .words > .multibuttons > ul li .multitext {line-height: 1.0em; } .highcluster>.content>.imgshell, .highcluster>.content>.imgleft, .highcluster>.content>.imgcenter, .highcluster>.content>.imgfull, .highcluster>.content>.imgright{ position: relative; width: 90%; float: none; display: block; margin: 0 auto; padding: 0; overflow: visible; } .highcluster .content .imgshell img, .highcluster .content .imgleft img, .highcluster .content .imgcenter img, .highcluster .content .imgfull img, .highcluster .content .imgright img { width: 100%; height: auto !important; padding: 0; margin: 0; } .highcluster>.content>.words { position: relative; top: 0px; display:block; float: none; width: 90%; height: auto !important; overflow: visible; margin: 0 auto; padding: 0; } .highcluster>.content>.words>.padding { position: relative; text-align: left; width: 95%; margin: 2.5%; padding: 0; display: block; color: #222; z-index: 1001; background:none; } .highcluster>.content>.words>.padding p { margin: 0; padding: 0; } .highcluster>.content>.words>.padding>.ctabutton { display: inline-block; float: none; width: auto; margin: 10px auto; padding: 10px;font-size: 0.8em; line-height: 0.3em; background: #ad1a1f; } .highcluster>.content>.words>.padding>.ctabutton>a:link, .highcluster>.content>.words>.padding>.ctabutton>a:visited { color: #FFF; text-decoration: none;} .highcluster>.content>.words>.padding>.ctabutton>a:hover { color: #FFF; text-decoration: underline;} .highcluster>.content>.words>.padding>ul { position: relative; text-align: left; width: 100%; margin: 0 auto; } .highcluster>.content>.words>.padding>ul>li { text-align: left; } .highcluster>.content>.words>.padding>h2 { color: #222; margin: 0; } .highcluster>.content>.words>.multibuttons { position: relative; width: 100%; float: none;margin: 0; } .highcluster>.content>.words>.multibuttons ul { position: relative; width: 100%; float: none;margin: 0; } .highcluster>.content>.words>.multibuttons ul li .multitext { position: relative; width: 65%; } .highfacts>.content>.words>.padding { position: absolute; top: 30%; text-align: left; width: 48%; height: auto !important; max-height: 110px; margin: 1%; padding: 0.5%; display: inline-block; color: #FFF; z-index: 1001; font-size: 1.0em; background:url(https://www.bard.edu/images/tints/80black.png) repeat; } .highfacts>.content>.words>.multibuttons>ul>li { position: relative; width: 44%; min-height: 90px; display: inline-block; list-style: none;color: #333; text-align: center; padding: 1%; margin: 0 1% 2% 0; font-size: 1.0em; line-height: 0.9em;align-content: center; background: #f6f6f6; vertical-align: top; } .highfacts>.content>.words>.multibuttons>ul>li>.multitext>.linktitle {position: relative; float: none; display: block; background: none; font-size: 2em; text-align: center; color:#ad1a1f;font-weight:900; margin: 0px 0;} /* start One Column styles */ .onecol { position: relative; width: 90%; height: auto; margin: 30px auto; padding: 30px 0; display: block; float: none; clear:none !important; background: #FFF; } /* photo clusters */ #photocluster { position: relative; width: 95%; height: auto !important; display: block; float: none; margin: 0 auto; padding: 0; max-width: 1200px; } #photocluster h2 {font-size: 1.2em; font-weight: 900; color:#222; text-transform: uppercase; letter-spacing: 3px; padding: 0 0 20px 0; border-bottom: 1px solid #222; margin: 0 0 20px 0; text-align: center; } #photocluster .solophoto { position: relative; width: 100%; float: left; margin: 0; padding: 0; z-index:1000; } #photocluster .solophoto .soloimg { position: relative; width: 100%; height: auto !important; max-height: 557px; display: block; margin: 0; padding: 0; overflow: hidden; } #photocluster .solophoto .soloimg img { width: 100%; height: auto !important; margin: 0; padding: 0; } #photocluster .solophoto .solovid { position: relative; width: 100%; height: auto !important; display: block; margin: 0; padding: 0; overflow: visible;} #photocluster .solophoto .solovid iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-height: 500px;} #photocluster .solophoto .solotext { position: absolute; bottom: 0; width: 90%; height: auto !important; display: block; margin: 0; padding: 5%; color: #FFF; font-size: 1.7em; font-weight: 600;z-index:1001; } #photocluster .solophoto .solotext h2 { color: #FFF; font-size: 1.7em; } #photocluster .solophoto .solocaption { position: relative; background: #f6f6f6; margin-top: 15px;padding: 20px; } #photocluster .cluster { position: relative; width: 100%; float: left; margin: 0; padding: 0;} #photocluster .cluster .clustimg { position: relative; width: 47%; height: 273px; max-height: 273px; float: left; margin: 0 0 2% 2%; padding: 0; background: #222; color: #FFF; } #photocluster .cluster .clustimg img { width: 100%; height: auto !important; } #photocluster .cluster .clustimg .clustvid { position: relative; width: 100%; height: auto; margin: 0; padding: 0; } #photocluster .cluster .clustimg .clustvid iframe { position: absolute;top: 0;left: 0; width: 100%; height: 100%; min-height: 200px;} #photocluster .cluster .clustimg iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; overflow: visible; z-index: 9999;} #photocluster .cluster .clustimg .clusttext { position: absolute; bottom: 1%; width: 90%; height: auto !important; display: block; margin: 0; padding: 5%; font-size: 1.1em; color: #FFF; font-weight: 200; } .solotext a:link, .solotext a:visited { color: #FFF; text-decoration: none; margin: 0px; } .solotext a:active, .solotext a:hover { color: #FFF; text-decoration: underline; } .clusttext a:link, .clusttext a:visited { color: #FFF; text-decoration: none; margin: 0px; font-weight: 800;font-size: 1.2em; } .clusttext a:active, .clusttext a:hover { color: #FFF; text-decoration: underline; font-weight: 800;font-size: 1.2em; } .section { width: 90%; margin: 30px auto;} .section > .content p {width: 96%;margin: 10px 0%;padding: 2%;} .spotlight .content .embcenter { position: relative; width: 80%; margin: 0 auto 0px auto; background: #222; } .spotlight .content .embcenter iframe { width: 100%; height: auto !important; min-height: 600px; padding: 0; margin: 0; background: #222; } .spotlight .content .embfull { width: 100%; margin: 0 auto; padding: 0; background: #222; } .spotlight .content .embfull iframe { width: 100%; height: auto !important; min-height: 300px; padding: 0; margin: 0; background: #222; } .spotlight .content .embright { width: 50%; margin: 0; padding: 0; background: #222; float: right; display: inline; } .spotlight .content .embright iframe { width: 100%; height: auto !important; min-height: 300px; padding: 0; margin: 0 0 0 5%; background: #222; } .spotlight .content .embshell { width: 50%; height: auto !important; margin: 0 5% 0 0; padding: 0; background: #222; float: left; display: inline;} .spotlight .content .embshell iframe { width: 100%; height: auto !important; min-height: 200px; padding: 0; margin: 0 5% 0 0; background: #222; } .spotlight .content .embleft { width: 50%; height: auto !important; margin: 0; padding: 0; background: #222; float: left; display: inline; } .spotlight .content .embleft iframe { width: 100%; height: auto !important; min-height: 200px; padding: 0; margin: 0 5% 0 0; background: #222; } /* start Text styles */ .text { position: relative; width: 90%; height: auto; margin: 30px auto 30px auto; padding: 0px; display: block; background: #FFF;} /* start Two Column styles */ .twocol { position: relative; width: 100%; height: auto; margin: 30px auto; padding: 30px 0; display: table; float: none; background: #f6f6f6;} .twocol .content { position: relative; width: 100% !important; height: auto; margin: 0 auto; padding: 0; display: block; background: #f6f6f6; } .twocol>.content>.words { position: relative; width: 100%; max-width: 1200px; display: block; margin: 0px auto; float: none; padding: 0; } .twocol>.content>.words>.padding { position: relative; text-align: center; width: 90%; float: none; display: block; padding: 2% 0 2% 0; margin: 0 auto;} .twocol>.content>.words>.padding>p { line-height:1.5em; margin: 20px 0; } .twocol>.content>.words>.padding>h2 { text-transform: uppercase; letter-spacing: 3px; text-align: center; color: #222; font-weight: 900; font-size: 1.4em; padding: 0px 0; margin:0 auto; line-height:1.1em; } .twocol>.content>.words>.padding>.subtitle { margin:10px auto; text-align: center; font-size: 1.1em;} .twocol>.content>.words>.padding>.ctabutton { position: relative; margin:10px auto; text-align: center; float: none; } .twocol>.content>.imgshell { position: relative; width: 10%; margin: 0px; float: none; max-height: 150px;display:none;} .twocol>.content>.words>.multibuttons { position: relative; width: 90%; max-width:90%; display: block; float: none; margin: 0px auto; padding: 0; } .twocol>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto; width: 100%; display: block; } .twocol>.content>.words>.multibuttons>ul>li { position: relative; width: 45%; display:inline-block; float: left; margin: 0% 2.5% 2.5% 0; padding: 0%;height: auto; min-height: 180px; vertical-align: top;background: #FFFFFF; } .twocol > .content > .words > .multibuttons > ul > li > .multitext audio {width:70%;} /* start Two Column DARK styles */ .twocold { position: relative; width: 100%; height: auto; margin: 30px auto; padding: 30px 0; display: table; float: none; background: #222; } .twocold .content { position: relative; width: 100%; height: auto; margin: 0 auto; padding: 1%; display: block; background: #222; } .twocold>.content>.words { position: relative; width: 100%; max-width: 1100px; display: block; margin: 0px auto; float: none; padding: 0;} .twocold>.content>.words>.padding { position: relative; text-align: center; width: 90%; float: none; display: block; padding: 2% 0 2% 0; } .twocold>.content>.words>.padding>p { line-height:1.5em; margin: 20px 0; } .twocold>.content>.words>.padding>h2 { text-transform: uppercase; letter-spacing: 3px; text-align: center; color: #222; font-weight: 900; font-size: 1.4em; padding: 0px 0; margin:0 auto; line-height:1.1em; } .twocold>.content>.words>.padding>.subtitle { margin:10px auto; text-align: center; font-size: 1.1em;} .twocold>.content>.words>.padding>.ctabutton { position: relative; margin:10px auto; text-align: center; float: none; } .twocold>.content>.imgshell { position: relative; width: 10%; margin: 0px; float: none; max-height: 150px;display:none;} .twocold>.content>.words>.multibuttons { position: relative; width: 90%; max-width:90%; display: block; float: none; margin: 0px auto; padding: 0; } .twocold>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto; width: 100%; display: block; } .twocold>.content>.words>.multibuttons>ul>li { position: relative; width: 45%; display:inline-block; float: left; margin: 0% 2.5% 2.5% 0; padding: 0%;height: auto; min-height: 180px; vertical-align: top;background: #FFFFFF; } .twocold > .content > .words > .multibuttons > ul > li > .multitext audio {width:70%;} /* start Two Column WHITE styles */ .twocolw { position: relative; width: 100%; height: auto; margin: 20px auto; padding: 0px 0; display: block; float: none; clear:none !important; background: #FFF; } .twocolw .content { position: relative; width: 100%; height: auto; margin: 0 auto; padding: 1%; display: table; background: #FFF; } .twocolw>.content>.words { position: relative; width: 90%; max-width: 1100px; display: block; margin: 0px auto; float: none; padding: 0;} .twocolw>.content>.words>.padding { position: relative; text-align: left; width: 18%; float: left; display: inline; padding: 2% 2% 2% 0; } .twocolw>.content>.words>.padding>p { line-height:1.5em; margin: 20px 0; } .twocolw>.content>.words>.padding>h2 { text-transform: uppercase; letter-spacing: 3px; text-align: left; color: #222; font-weight: 900; font-size: 1.4em; padding: 20px 0; margin:0 auto; line-height:1em; } .twocolw>.content>.words>.padding>.subtitle { margin:10px auto; text-align: center; font-size: 1.1em;} .twocolw>.content>.words>.padding>.ctabutton { position: relative; margin:10px auto; text-align: center; float: none; } .twocolw>.content>.imgshell { position: relative; width: 10%; margin: 0px; float: none; max-height: 150px;display:none;} .twocolw>.content>.words>.multibuttons { position: relative; width: 80%; max-width:80%; display: inline; float: left; margin: 0px; padding: 0; } .twocolw>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto; width: 100%; display: block; } .twocolw>.content>.words>.multibuttons>ul>li { position: relative; width: 45%; display:inline-block; float: left; margin: 0% 2.5% 2.5% 0; padding: 0%;height: auto; min-height: 180px; vertical-align: top;background: #f6f6f6; } .twocolw > .content > .words > .multibuttons > ul > li > .multitext audio {width:70%;} } /* -------------------------------------------- MOBILE ONLY STYLES ------------------------------------ */ @media screen and (max-width: 664px) { body { background: #FFF; } /* generic tables */ .table {position:relative;display:block;flex-wrap: none; width:95%;margin:2.5%;} .table .tr {position:relative;display:block;flex-flow: none;width: 100%; text-align:left;padding:0%; } .table .td {position:relative;display: block; flex: none; width: 100%;vertical-align: top;text-align:left;padding:1%;margin: 1%; } .table .trborder {position:relative;display:block;flex-flow: none;width: 100%; text-align:left;padding:0%; height:1px; border-bottom: 1px solid #222; } /* classes for widths of tables and columns */ .width5,.width10,.width15,.width20,.width25,.width30,.width40,.width50,.width60,.width70,.width75,.width80,.width90 { position: relative; display:block !important;width:95% !important;margin:2.5%; padding: 0; overflow: visible; white-space: normal;} .width100 { position: relative; display:block !important;width:100% !important; margin:0; padding: 0; overflow: visible; white-space: normal;} .mobilehide { display: none !important; } /* Force table to not be like tables anymore */ table, thead, tbody, th, td, tr { display: block; } tr { border: 1px solid #ccc; } tr.hidemobile {display:none;} thead, thead>tr, thead>tr>td {visibility: hidden;} td { /* Behave like a "row" */border: none; width:94%; position: relative;padding: 3%; } td:before { /* Now like a table header */position: absolute;/* Top/left values mimic padding */top: 6px; left: 6px; width: 45%; padding-right: 10px; white-space: nowrap; } #navdesk { display: none;} #ccelogo { position: absolute; top: 0px; left: 0%; width: 84px; height:68px; z-index: 9999; } #ccelogo img { width: 84px; height:68px; z-index: 9999; } header .topnav { width: 100%; height: 25px; background: #222; text-align: right; margin: 0; padding: 0;} header .topnav .toplinks { width: 964%; max-width: 94%; height: 25px; background: #222; color: #CCC; text-align: right; margin: 0; padding: 5px 2%; font-size: 0.8em;} #supershell { width: 100%; display: block; float: none; margin: 0px; padding: 0px; overflow-x: hidden; } main { position:relative; width: 100%; top: 0px; margin: 0px auto 0px auto; padding: 0px; overflow-x:hidden; overflow-y: visible; display: block; } main #maintext, main #maincol { width: 100%; float: none; display: block; clear: both; height: auto; margin: 0px; } main #sidebar { float: none; margin: 0px; padding: 0px; width: 100% } main #maintext>.content { position: relative; padding: 0px; width:100%; display: block; } .active {display: block;} ul.subnav { width: 768px; } ul.subnav li a:link, ul.subnav li a:visited { color:#FFF; text-decoration: none; padding: 10px 10px 10px 10px; } ul.subnav li a:hover, ul.subnav li a:active { color:#ad1a1f; text-decoration: underline; background-color: #FFF; } #subnav-about, #subnav-adm, #subnav-aca, #subnav-under, #subnav-grad, #subnav-campus, #subnav-news, #subnav-par { } /*#topnav { float: left; display: inline; position: absolute; top: 10px; right: 5px; right: 0px; height: 25px; width: auto; color: #FFF;font-size: .9em; border:none; margin: 0px; padding: 0px;} #topnav a:link, #topnav a:visited { color:#FFF; margin-right: 5px; } #topnav a:hover, #topnav a:active { color:#FFF; margin-right: 5px; }*/ /* subnav styles */ ul.subnav { position: relative; list-style: none; width: 100%; max-width: 480px; height:auto !important; display: block; margin: 0px 0px 0px 0px; padding: 0px; color: #FFF; background-color: #ad1a1f; font-size: 1.1em; font-weight: bold; line-height: 1.3em; z-index: 900; overflow: visible; } ul.subnav li { width: 100%; height: 35px; margin: 0px; padding: 0px; border-right: none; text-align: left; display: block; } ul.subnav li.last { border-right: none;} ul.subnav li a:link, ul.subnav li a:visited { color: #FFF; background-color: #ad1a1f; text-decoration:none; display:block; width: auto; margin: 0px; padding: 10px;line-height: 16px; text-align: left; } ul.subnav li a:hover, ul.subnav li a:active { color: #FFF; text-decoration:underline; background-color:#ad1a1f; } main>#maincol { width: 100%; float: none; display: block; padding: 0px; margin: 0px; } main>#maincol>.content { position: relative; width: 100%; padding: 10px 0px; margin: 0px; } main>#maincol>#sidebar { position: relative; width: 100%; right: 0px; top: 0px; float: none; margin: 20px 0px 0px 0px; padding: 0px; box-shadow: none; } #maintext>.content>.imgshell, #maincol>.content>.imgshell { float: none; width: 100%; height: auto; margin-right: 0px; padding: 0px; } #maintext>.content>.imgright, #maincol>.content>.imgright { float: none; width: 100%; height: auto; margin-left: 0px; padding: 0px; } #maintext .content>iframe { float: none; width: 100%; height: auto; margin-left: 0px; padding: 0px; } #coltext { width: 100%; padding : 0; } /* Main Column Box Styles */ #submenu, #sitemenu {position: relative; margin-top: 0px; } #pagebox { float: none; width: 100%; height: auto; margin: 0px 0px 20px 0px; } .ctabutton { display: inline-block; width: auto; height: auto; margin: 0px ; padding: 10px; background: #ad1a1f; border: none; border-radius: 0; color: #FFF; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; white-space: normal; font-size:.75em; line-height: 1.0em; text-transform:uppercase; letter-spacing: 2px; font-weight: 800;} .cms-button {word-break: break-all; margin: 0; } .cms-caption {line-height: 18px;} #introshell { position: relative; width: 100%; height: auto !important; overflow: visible; z-index: 1000; margin: 110px 0 0 0; padding: 0; background: #FFF; display: block; clear: both; } #introshell .image { position: relative; width: 100%; height: auto !important; top: 0px; background: none; z-index: 1000; padding: 0; margin: 20px 0 0 0; min-height: 180px; max-height: 650px; overflow: visible; } #introshell .image img { width: 100%; height: auto !important; padding: 0; margin: 0; max-height: 600px; overflow: visible; } #introshell .image h1 { position: relative; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: 600;text-transform: uppercase; letter-spacing: 2px; width: 90%; color: #222; font-size: 1.6em; line-height: 1em; text-align: center; margin: 15px auto; padding: 0; z-index: 1001; background: none; text-shadow: none; } #introshell .image .caption { position: relative; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: 300; text-align: right; display: block; width: auto !important; color: #999; margin: 0; padding: 3%; z-index: 1002; font-style: italic;} #introshell>.sitetitle { position: relative !important; top: 0px !important; left: 0px !important; width: 100% !important; height: auto !important; min-height: 30px !important; overflow: visible; float: left; margin: 0 0 0 0; padding: 0; z-index: 1001; } #introshell #title { position: relative; width: 100%; height: auto !important; top: 0px; background: none; z-index: 1000; padding: 0; margin: 20px 0 0 0; overflow: visible; } #introshell>#title>h1 { position: absolute; left: 0; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: 900;text-transform: uppercase; letter-spacing: 3px; display: block; width: 98%; margin: 20px 0 0 30px; padding: 0; color: #222; font-size: 2.5em; line-height: 1em; text-align: center; background: none; overflow: visible; } #introshell #title h1.pagetitle {position: relative; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: 600;text-transform: uppercase; letter-spacing: 2px; width: 90%; color: #222; font-size: 1.5em; line-height: 1em; text-align: center; margin: 30px auto 20px auto; padding: 0; z-index: 1001; background: none; text-shadow: none;} #introshell>.introbuttons { position: absolute; top: 240px; width: 95%; margin: 0 auto; height: auto !important; display: block; z-index: 11000; overflow: visible;} #introshell>.introbuttons>.content { position: relative; width: 95%; margin: 0px auto; align-items: center; text-align: center;} #introshell>.introbuttons>.content>.buttons { display: inline; width: auto; border: 1px solid #fff; padding: 5px 0px; margin: 15px 10px; background: url(https://www.bard.edu/images/tints/80black.png) repeat; color: #FFF; font-size: 0.8em; letter-spacing: 2px; text-transform: uppercase; font-weight: 900; } #introshell>.introbuttons>.content>.buttons a:link, #introshell>.introbuttons>.content>.buttons a:visited { color: #FFF; text-decoration: none; padding: 10px 20px;} #introshell>.introbuttons>.content>.buttons a:active, #introshell>.introbuttons>.content>.buttons a:hover { color: #FFF; text-decoration: none; background: #ad1a1f;padding: 9px 20px;} #introtext { position: relative; width: 85%; margin: 30px auto; padding: 0px; font-size: 1.1em; line-height:1.5em;} body#home #introtext { position: relative; width: 85%; margin: 30px auto; padding: 0px; font-size: 1.1em; line-height:1.5em;} #introtext .subtitle {font-size: 1.0em;} #introtext>.ctabutton { width: auto; height: auto; margin: 10px auto 0 auto; padding: 10px; background: #ad1a1f; border: none; border-radius: 0; font-size: 0.70em; } #maintext .content .introbuttons {display: block; height: auto !important; overflow: visible;} #maintext .content .introbuttons .content {display: block; height: auto; overflow: visible;} .introbuttons > .content > .buttons {display: block; margin: 30px 10px;} /* ----------- 2019 Styles (alpha order) ---------- */ /* start Billboard styles */ .billboard {position: relative; display: block; width: 100%; height: auto !important; margin: 20px auto 0 auto;} .billboard>.content {width: 100%; display:block; } .billboard>.content>.imgcenter { position: relative; width: 100%; margin: 0 auto; } .billboard>.content>.imgcenter img { width: 100%; height: auto; } .billboard>.content>.imgfull { width: 100%; margin: 0 auto; padding: 0; background: #222; } .billboard>.content>.imgfull img { width: auto !important; height: 50%; max-height: 400px; padding: 0; margin: 0; } .billboard>.content>.imgcenter .caption, .billboard>.content>.imgfull .caption { position: relative; width: 100%; margin: 0 auto;padding: 0; } .billboard .content .embcenter, .billboard .content .embfull, .billboard .content .embright, .billboard .content .embleft, .billboard .content .embshell { position: relative; width: 100%; margin: 0 auto 0px auto; } .billboard .content .embcenter iframe, .billboard .content .embfull iframe, .billboard .content .embright iframe, .billboard .content .embshell iframe, .billboard .content .embleft iframe { width: 100%; height: auto !important; min-height: 250px; padding: 0; margin: 0; } .billboard>.content>.words { position: relative; width: 80% !important; min-width: 80%; height: auto !important; z-index: 1000; background: #FFF; border: 1px solid #666; padding: 2%; margin: -20px auto 5px auto; right: 0; } .billboard>.content>.words>.padding { position: relative; text-align: center; width: 100%; margin: 0 auto; padding: 0; color: #222; font-size: 1.0em; right: 0;} .billboard>.content>.words>.padding p { margin: 0 auto; padding: 0; } .billboard>.content>.words>.padding>h2 { font-size:0.75em; line-height: 1.1em; text-transform:uppercase; letter-spacing: 1px; font-weight: 800; color: #ad1a1f; padding: 0; margin: 15px 0 10px 0; text-shadow: none; } .billboard>.content>.words>.padding>.subtitle { color: #333; font-size: 1.5em; font-family:"Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; margin: 0; padding: 0; line-height: 1em;} .billboard .multibuttons {align-content: center; align-items: center; margin-top: 20px; } .billboard .multibuttons ul, .billboard .multibuttons ul li, .billboard .multibuttons ul li .multitext {list-style: none; padding: 0; margin: 0 auto; text-align: center; } .billboard .multibuttons ul li .multitext .linktitle { width: auto !important; max-width: 100%;height: auto; margin: 10px auto; padding: 7px; color: #FFF; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; white-space: nowrap; font-size:.75em; line-height: .5em; text-transform:uppercase; letter-spacing: 1px; font-weight: 800; text-align: center;} .billboard .multibuttons ul li .multitext .linktitle a:link, .billboard .multibuttons ul li .multitext .linktitle a:visited { color: #FFF; background: #ad1a1f; text-decoration: none; } .billboard .multibuttons ul li .multitext .linktitle a:hover, .billboard .multibuttons ul li .multitext .linktitle a:active { color: #FFF; background: #ad1a1f; text-decoration: underline; padding: 5px 10px; } .biography > .content > .words > .padding {width: 80%; padding: 0; margin: 0 auto;} .biography > .content > .imgshell, .biography > .content > .imgleft, .biography > .content > .imgright, .biography > .content > .imgcenter, .biography > .content > .imgfull{ position: relative;display: block;float: none;width: 100%;height: auto !important;overflow: hidden;margin: 0px 0px 20px 0px;z-index: 500;} .biography > .content > .imgshell img, .biography > .content > .imgleft img, .biography > .content > .imgright img, .biography > .content > .imgcenter img, .biography > .content > .imgfull img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .biography .content .embright, .biography .content .embshell, .biography .content .embleft { width: 100%; margin: 0; padding: 0; background: #FFF; float: none; display: block; } .biography .content .embright iframe, .biography .content .embshell iframe, .biography .content .embleft iframe { width: 100%; height: 100%; padding: 0; margin: 0; min-height: 250px;} /* Bottom Buttons */ #bottombuttons .buttons li { list-style: none; display: block; color:#222; background-color: #FFF; margin: 0px 30px 15px 0px; padding: 15px 20px; border: 2px solid #e6e6e6; white-space: normal; height: auto !important; clear: right; } .column { position: relative; display: block; width: 100%; height: auto !important; padding: 0px; float: none; overflow: visible; } .column .contentx4 { position: relative; display: block; float: none; width: 100%; height: auto !important; padding:0%; vertical-align: top; } .acacol { position: relative; width:90%;float:none;margin: 10px auto; display:block; } .acaside { position: relative; width:90%;float:none;margin: 10px auto; display:block; } .expandbars { display: block; width: 90%; margin: 25px auto; padding: 15px 5% 5px 5%; border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; background-color: #FFF; white-space: normal; } .expandindent {width: 80%;} .events .eventfeat .eventfeatimg { position: relative; float: none; width: 100%; height: auto; margin: 0 0 20px 0; padding: 0;} .events .eventfeat .eventfeattext { position: relative; float: none; width: 98%; height: auto; margin: 0; padding: 1%;} .events .eventfeat .eventfeattext button.modal-open { text-align: left; text-transform: none; font-size: 1.4em; line-height: 1.4em; letter-spacing: 0px; margin: 10px 0; padding: 0;} .events .eventcol { position: relative; display:table; width: 96%; height: auto; overflow: visible; margin: 20px 0; padding: 2%; border: 1px solid #333; } .events .eventcol .eventcolimg { position: relative; float: left; width: 98%; height: auto; max-height: 100%; overflow: visible; margin: 1%; padding: 0;} .events .eventcol .datebox { position: relative; float: none; width: 100%; height: auto; margin: 0; padding: 0;} .events .eventcol .eventcoltext { position: relative; float: none; width: 100%; height: auto; margin: 0; padding: 0;} /* start Facts styles */ .facts h2 { text-align: center; display:none; } .facts { position: relative; width:100%; margin: 50px auto; padding: 0; } .facts ul { position: relative; width: 100%; background: #FFF; display: block; margin: 0 auto; padding: 0; height: auto; } .facts .multibuttons ul { position: relative; width: 80%; height: auto;display: block; margin: 0 auto; padding: 0; } .facts .multibuttons ul li { position: relative; width: auto; height: auto; display: block; margin: 0 auto; padding: 0; text-align: center; } .facts .multibuttons ul li .imgshell, .facts .multibuttons ul li .imgleft { position: absolute; top: 0; width: 100%; height: 50%; display:table-cell; } .facts .multibuttons ul li .imgright, .facts .multibuttons ul li .imgcenter { position: absolute; bottom: 0; width: 100%; height: 50%; display:table-cell; } .facts .multibuttons ul li .imgshell img, .facts .multibuttons ul li .imgleft img, .facts .multibuttons ul li .imgright img, .facts .multibuttons ul li .imgcenter img { position: relative; width: 100%; height: auto; } .facts .multibuttons ul li .multitext { position: relative; display:block; margin: 0; padding: 0 2%; text-align: center; font-size: 1.5em; line-height: 1.2em; color: #ad1a1f;} .facts .multibuttons ul li .multitext strong { position: relative; margin: 0; padding: 0; text-align: center; font-size: 2em; line-height: 1.2em; font-weight: 800; color: #222;} .facts a:link, .facts a:visited {color: #FFF; text-decoration: none;} .facts a:active, .facts a:hover {color: #CCC; text-decoration: none;} /* start FAQ styles */ .faqs { position:relative; display:block; width:85%; max-width: 1000px; height: auto !important; overflow: visible; margin: 50px auto; padding: 0%; } .faqs .content .words .multibuttons { position: relative; margin: 0; padding: 0; background: #FFF; display: block; overflow: visible; } .faqs .content .words .multibuttons ul { margin: 0; padding: 0; list-style: none; display: block; overflow: visible; border: 1px solid #ededed;} .faqs .content .words .multibuttons ul li { position: relative; width: 100%; height: auto !important; overflow: visible !important; margin: 0 0 0px 0; padding: 20px 0 20px 0; list-style:none; border-bottom: 1px solid #ededed; font-size: 1.1em; } .faqs .content .words .multibuttons ul li .multitext { position: relative; width: 90%; height: auto !important; overflow: visible !important; margin: 0; padding: 0; } .faqs .content .words .multibuttons ul li .multitext .ctabutton { position: relative; height: auto !important; float: none; margin: 0; padding: 0 0 0 10px; background: #FFF; color: #222; text-transform:none; letter-spacing: 0px; } .faqs .content .words .multibuttons ul li .multitext .ctabutton button.modal-open { position: relative; float: none; padding: 5px 0 0 0; background: #FFF; color: #222; font-size: 1.3em; text-transform: none; letter-spacing: 0px; height: auto !important; min-height: 25px; display:table-cell; overflow: hidden;} .faqs .content .words .multibuttons ul li .multitext .ctabutton button {white-space: normal; word-wrap: break-word;text-align: left; line-height: 1.3em; } /* start Four Column styles .fourcol { position: relative; display: table; width: 100%; max-width:1200px; height: auto; margin: 50px auto; padding: 0px; } .fourcol .content { position: relative; float:left; width: 100%; padding: 10px 0px; margin: 0px auto; } .fourcol>.content>.words { position: relative; width: 100%; max-width:1100px; display: block; margin: 0px auto;} .fourcol>.content>.words>.multibuttons { position: relative; width: 100%; max-width:1100px; display: block; margin: 0px auto;} .fourcol>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto 10px auto; width: 90%; } .fourcol>.content>.words>.multibuttons>ul>li { position: relative; width: 100%; display:inline; float: left; margin: 0 0 20px 0; } .fourcol>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: 100%; height: auto; display:block; float:none; } .fourcol>.content>.words>.multibuttons>ul>li>.multimgleft, .fourcol>.content>.words>.multibuttons>ul>li>.multimgright, .fourcol>.content>.words>.multibuttons>ul>li>.multimgcenter, .fourcol>.content>.words>.multibuttons>ul>li>.multimgfull, .fourcol>.content>.words>.multibuttons>ul>li>.multimgshell { position: relative; width: 100%; height: auto; display:block; overflow: hidden; } .fourcol>.content>.words>.multibuttons>ul>li>.multimgleft img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgright img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgcenter img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgfull img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgshell img { position: relative; width: 100%; height: auto;} .fourcol>.content>.words>.padding>h2 { color: #222; font-weight: 900; font-size: 1.2em; padding:0; margin:0 auto; line-height:1em; text-align: center; text-transform: uppercase; letter-spacing: 3px; } .fourcol>.content>.words>.multibuttons>ul>li>.multitext>strong { color: #222; font-weight: 900; font-size: 1.2em; } .fourcol .content .words .multibuttons ul li .multitext a strong { font-weight: 900; font-size: 1.2em; } .fourcol.content.words blockquote.instagram-media {width: 100px; min-width: 100px; max-width: 120px;} */ /* start Four Column styles */ .fourcol { position: relative; width: 100%; height: auto; margin: 30px auto 50px auto; padding: 30px 0; display: table; background: #FFF; } .fourcol .content { position: relative; width: 100%; max-width:1100px; height: auto; margin: 50px auto; padding: 0px; display: table;} .fourcol .content>.imgleft, .fourcol>.content>.imgshell { position: relative; display:table-cell; float: left; width: 29%; height: auto !important; overflow: hidden; margin: 0px 30px 0px 20px; padding: 1%; background: #FFF; } .fourcol .content>.imgleft img, .fourcol>.content>.imgshell img { width: 100%; height: auto; margin: 0px 30px 0px 0px;} .fourcol .content>.imgright { position: relative; display:table-cell; float: right; width: 29%; height: auto !important; overflow: hidden; margin: 0px 20px 0px 30px; padding: 1%; background: #FFF; } .fourcol .content>.imgright img { width: 100%; height: auto; margin: 0;} .fourcol>.content>.imgcenter { position: relative; display:inline; float: left; width: 30%; overflow: hidden; margin: 0px auto; } .fourcol>.content>.imgcenter img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .fourcol>.content>.imgfull { position: relative; display:inline; float: left; width: 90%; overflow: hidden; margin: 0px auto; } .fourcol>.content>.imgfull img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .fourcol .content .embleft, .fourcol>.content .embshell { position: relative; display:table-cell; float: left; width: 48%; height: auto !important; overflow: hidden; margin: 0px 30px 20px 0px; } .fourcol .content .embleft iframe, .fourcol>.content .embshell iframe { width: 100%; height: auto; min-height: 300px; margin: 0px 30px 0px 0px;} .fourcol .content .embright { position: relative; display:table-cell; float: right; width: 48%; height: auto !important; overflow: hidden; margin: 0px 0px 0px 30px; } .fourcol .content .embright iframe { width: 100%; height: auto; min-height: 300px; margin: 0px 0px 0px 30px;} .fourcol .content .embcenter { position: relative; display:inline; float: left; width: 70%; overflow: hidden; margin: 0px auto; } .fourcol .content .embcenter iframe { width: 100%; height: auto; min-height: 400px; margin: 0px 0px 0px 0px;} .fourcol .content .embfull { position: relative; display:block; float: none; width: 90%; overflow: hidden; margin: 0px auto; } .fourcol .content .embfull iframe { width: 100%; height: auto; min-height: 600px; margin: 0px 0px 0px 0px;} .fourcol>.content>.words { position: relative; width: 100%; max-width:1100px; display: block; margin: 0px auto;} .fourcol>.content>.words>.padding { text-align: center; line-height:1.9em; } .fourcol>.content>.words>.padding>p { line-height:1.9em; margin: 20px; } .fourcol>.content>.words>.padding>h2 { text-transform: uppercase; letter-spacing: 3px; text-align: center; color: #222; font-weight: 900; font-size: 1.4em; padding:0; margin:0 auto; line-height:1em; } .fourcol>.content>.words>.padding>.subtitle { margin:10px auto; text-align: center; font-size: 1.1em;} .fourcol>.content>.words>.multibuttons { position: relative; width: 100%; max-width:1100px; display: block; margin: 0px auto;} .fourcol>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto; padding: 0px; width: 100%; display: table; } .fourcol>.content>.words>.multibuttons>ul>li { position: relative; width: 96%; display:table-cell; float: left; margin: 2%; padding: 0;text-align: center; min-height: 100px; background: #F6F6F6; color: #222; } .fourcol .content .words .multibuttons .cms-button { margin: 15px auto; line-height: 1em;} .fourcol>.content>.words>.multibuttons>ul>li>.multimgshell, .fourcol>.content>.words>.multibuttons>ul>li>.multimgleft, .fourcol>.content>.words>.multibuttons>ul>li>.multimgright, .fourcol>.content>.words>.multibuttons>ul>li>.multimgcenter{ position: relative; width: 90%; height: auto; display:block; overflow: hidden; margin: 5%; } .fourcol>.content>.words>.multibuttons>ul>li>.multimgfull{ position: relative; width: 100%; height: auto; display:block; overflow: hidden; margin: 0;} .fourcol>.content>.words>.multibuttons>ul>li>.multimgleft img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgright img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgcenter img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgshell img, .fourcol>.content>.words>.multibuttons>ul>li>.multimgfull img { position: relative; width: 100%; height: auto; padding: 0; margin: 0;} .fourcol>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: 96%; height: auto; margin: 2%; display:block; float:none; line-height: 1.8em; } .fourcol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle {font-size: 1.2em; text-align: center; color:#333;font-weight:900; margin: 10px auto 15px auto;} .fourcol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:link, .fourcol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:visited {text-decoration:none;} .fourcol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:active, .fourcol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:hover{text-decoration:underline;} .fourcol>.content>.words>.multibuttons>ul>li>.multitext button.modal-open {color: #FFF; text-decoration: none; font-weight: 800; } .fourcol>.content>.words>.multibuttons>ul>li>.multitext>div>ul { position: relative; text-align: left; width: 90%; margin: 0 auto; } .fourcol>.content>.words>.multibuttons>ul>li>.multitext>div>ul>li { text-align: left; margin: 0 0 10px 0; } .fourcol>.content>.words>.multibuttons>ul>li>.multitext>.ctabutton>button.modal-open { margin: 0; padding: 0; line-height: 1.1em; } .fourcol>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>.ctabutton {display:inline-block;margin-top: 20px;} body#home .fourcol .multitext { text-align: center;} body#home .fourcol h2 { color: #ad1a1f; font-weight: 900;font-size: 1.5em;} body#home .fourcol .ctabutton { display: block; margin: 0px auto;text-align: center; align-content: center; width: 10%; } /* heroshell Two column H2 and main image styles */ #heroshell { float:left; position: relative; top: 0px; width: 100%; max-height: 350px; min-height: 100px; overflow: hidden; z-index: 1000; margin: 0 0 20px 0; padding: 0; } #heroshell>.introbuttons { bottom: 28%; } /* start Highlight Cluster styles*/ .highcluster { position:relative; display:block; width:100%; height: auto !important; overflow: visible; margin: 20px auto 50px auto; padding: 0px; align-content: center;max-width: 1100px; } .highcluster>.content { position: relative; display:block; float: none; width: 100%; overflow: hidden; margin: 0 auto; padding: 0;} .highcluster>.content>.imgshell, .highcluster>.content>.imgleft, .highcluster>.content>.imgcenter, .highcluster>.content>.imgfull, .highcluster>.content>.imgright{ position: relative; width: 100%; float: none; display: block; margin: 0 1% 1% 0; padding: 0; overflow: visible; } .highcluster .content .imgshell img, .highcluster .content .imgleft img, .highcluster .content .imgcenter img, .highcluster .content .imgfull img, .highcluster .content .imgright img { width: 100%; height: auto !important; padding: 0; margin: 0; } .highcluster>.content>.words { position: relative; top: 0px; display:block; float: none; width: 90%; height: auto !important; overflow: visible; margin: 0 auto; padding: 0; } .highcluster>.content>.words>.padding { position: relative; text-align: left; width: 95%; margin: 2.5%; padding: 0; display: block; color: #222; z-index: 1001; background:none; } .highcluster>.content>.words>.padding p { margin: 0; padding: 0; } .highcluster>.content>.words>.padding>.ctabutton { display: inline-block; float: none; width: auto; margin: 10px auto; padding: 10px;font-size: 0.8em; line-height: 0.3em; background: #ad1a1f; } .highcluster>.content>.words>.padding>.ctabutton>a:link, .highcluster>.content>.words>.padding>.ctabutton>a:visited { color: #FFF; text-decoration: none;} .highcluster>.content>.words>.padding>.ctabutton>a:hover { color: #FFF; text-decoration: underline;} .highcluster>.content>.words>.padding>ul { position: relative; text-align: left; width: 100%; margin: 0 auto; } .highcluster>.content>.words>.padding>ul>li { text-align: left; } .highcluster>.content>.words>.padding>h2 { color: #222; margin: 0; } .highcluster>.content>.words>.multibuttons { position: relative; width: 95%; float: none;margin: 0 auto; } .highcluster>.content>.words>.multibuttons>ul { position: relative; text-align: left; width: 100%; margin: 0 auto; padding: 0;} .highcluster>.content>.words>.multibuttons>ul>li { min-height: 85px; display: block; list-style: none; position: relative; color: #333; text-align: left; width: auto !important; padding: 5px 0; margin: 0 auto; font-size: 0.9em; overflow: visible; clear:both; } .highcluster>.content>.words>.multibuttons>li a:link, .highcluster>.content>.words>.multibuttons>li a:visited { color:#ad1a1f; text-decoration: none; background: none; } .highcluster>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: 100%; margin: 0 auto;float: none; display: block; } .highcluster>.content>.words>.multibuttons>ul>li>.multitext>.linktitle {position: relative; float: none; display: block; background: none; font-size: 1.3em; text-align: left; color:#ad1a1f;font-weight:900; margin: 0;} .highcluster>.content>.words>.multibuttons>ul>li>.multitext>p { margin: 0; padding: 0;} .highcluster>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:link,.highcluster>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:visited {color: #ad1a1f; text-decoration: none;} .highcluster>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:active,.highcluster>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:hover {color: #ad1a1f; text-decoration: underline; font-weight: 800; background: #ededed;} .highcluster>.content .words>.multibuttons>li>.multitext>.textmulti { } .highcluster>.content>.words>.padding>.ctabutton>button.modal-open { font-size: 0.8em; line-height: 1em; margin: 0px; padding: 0; text-transform: uppercase; letter-spacing: 2px; text-align: center; width: auto; color: #ad1a1f; float: none;} .highcluster>.content>.words>.multibuttons>ul>li>.multimgshell { position: relative; width: 100%; margin: 0 auto;float: none; display: block; } .highcluster>.content>.words>.multibuttons>ul>li>.multimgshell img{ width: 100%; margin: 0 auto;float: left; display: inline; } .highfacts>.content>.imgleft, .highfacts>.content>.imgright, .highfacts>.content>.imgcenter, .highfacts>.content>.imgfull, .highfacts>.content>.imgshell { position: relative; width: 100%; float: none; display: block; margin: 0 0 1% 0; padding: 0; } .highfacts>.content>.imgshell>.caption { margin: 0; padding: 0; text-align: left; } .highfacts>.content>.words { position: relative; display:block; float: none; width: 100%; height: auto !important; min-height: 100px; overflow: visible; margin: 0; padding: 0; } .highfacts>.content>.words>.padding { position: relative; text-align: left; width: 90%; margin: 1% 5%; padding: 0; display: block; color: #222; z-index: 1001; background: none; } .highfacts>.content>.words>.padding p { margin: 0; padding: 0; } .highfacts>.content>.words>.padding>.ctabutton { display: inline; float: left; width: auto; margin: 10px 0 0 0; padding: 10px;font-size: 0.8em; line-height: 0.3em; background: #ededed; } .highfacts>.content>.words>.padding>.ctabutton>a:link, .highfacts>.content>.words>.padding>.ctabutton>a:visited { color: #ad1a1f; text-decoration: none;} .highfacts>.content>.words>.padding>.ctabutton>a:hover { color: #ad1a1f; text-decoration: underline; } .highfacts>.content>.words>.padding>ul { position: relative; text-align: left; width: 80%; margin: 0 auto; } .highfacts>.content>.words>.padding>ul>li { text-align: left; } .highfacts>.content>.words>.padding>h2 { color: #222; margin: 10px 0; } .highfacts>.content>.words>.multibuttons { position: relative; width: 100%; height: auto !important; overflow: visible; float: none;margin: 0; } .highfacts>.content>.words>.multibuttons>ul { position: relative; text-align: left; width: 96%; margin: 0 auto; } .highfacts>.content>.words>.multibuttons>ul>li { position: relative; width: 40%; min-height: 100px; display: inline; float: left;; list-style: none;color: #333; text-align: center; padding: 2.0%; margin: 0 1% 1% 0; font-size: 1.2em; align-content: center; background: #f6f6f6; word-wrap:break-word;} .highfacts>.content>.words>.multibuttons>li a:link, .highfacts>.content>.words>.multibuttons>li a:visited { color:#ad1a1f; text-decoration: none; background: none; } .highfacts>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: 90%; margin: 0 auto;text-align: center; line-height: 2.0em; } .highfacts>.content>.words>.multibuttons>ul>li>.multitext>.linktitle {position: relative; float: none; display: block; background: none; font-size: 2em; text-align: center; color:#ad1a1f;font-weight:900; margin: 10px 0 0 0;} .highfacts>.content>.words>.multibuttons>ul>li>.multitext>p { margin: 0; padding: 0;} .highfacts>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:link,.highfacts>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:visited {color: #ad1a1f; text-decoration: none;} .highfacts>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:active,.highfacts>.content>.words>.multibuttons>ul>li>.multitext>.linktitle>a:hover {color: #ad1a1f; text-decoration: underline; font-weight: 800; background: #ededed;} .highfacts>.content .words>.multibuttons>li>.multitext>.textmulti { } .highfacts>.content>.words>.padding>.ctabutton>button.modal-open { font-size: 0.8em; line-height: 1em; margin: 0px; padding: 0; text-transform: uppercase; letter-spacing: 2px; text-align: center; width: auto; color: #ad1a1f; float: none;} .highfacts>.content>.words>.multibuttons>ul>li>.multimgshell { position: relative; width: 30%; margin: 0 auto;float: left; display: inline; } .highfacts>.content>.words>.multibuttons>ul>li>.multimgshell img{ width: 90%; margin: 0 auto;float: left; display: inline; } .highfacts > .content > .words > .multibuttons > ul > li { width: 90%; margin: 1% 0;} .highlight { position:relative; display:table; overflow: visible; width:100%; height: auto !important; margin: 20px auto; padding: 0 0 50px 0; align-content: center; background: #f0f0f0; } .highlight .content { position: relative; display:block; width: 100%; overflow: visible; margin: 0 auto; align-content: center; } .highlight .content .embshell, .highlight .content .embleft, .highlight .content .embright { position: relative; display:block; width: 98%; overflow: visible; margin: 0 auto 20px auto; align-content: center; } .highlight .content .embshell iframe, .highlight .content .embleft iframe, .highlight .content .embright iframe, .highlight .content .embcenter iframe, .highlight .content .embfull iframe { min-height: 200px; } .highlight>.content>.words {display: block; float: none; width: 90%; margin: 0 auto; } .highlight>.content>.words>.padding {text-align: left; overflow-x: hidden;} .highlight>.content>.words>.padding .ctabutton {width: auto !important;} .highlight>.content>.words>.padding>h2 {font-size: 1.7em;text-align: left;} .highlight .words { position: relative; display: block; left: 0%; bottom: 5px; z-index: 200; text-align: left; width: 95%; margin: 0 auto 20px auto; } .highlight > .content > .words > .padding .ctabutton {width: 90% !important;} .highlight .words h2 { } .highlight .imgcenter { position: relative; display: block; float: none; width: 90%; margin: 0 auto; overflow: visible; } .highlight .imgcenter img { width: 100%; height: auto; } .highlight .imgfull { position: relative; display: block; float: none; width: 90%; margin: 0 auto; overflow: visible; } .highlight .imgfull img { width: auto !important; height: 400px; margin: 0px; } #maintext .highlight .content .imgleft { position: relative; display: block; float: none; width: 90%; margin: 0 auto; overflow: visible; } #maintext .highlight .content .imgright { position: relative; display: block; float: none; width: 90%; margin: 0 auto; overflow: visible; } #maintext .highlight .content .imgshell { position: relative; display: block; float: none; width: 90%; margin: 0 auto; overflow: visible; } .highlight .content .imgleft img, .highlight .content .imgright img { width: 100%; height: auto !important; margin: 0 0 0 0; } .highlight > .content > .words > .multibuttons > ul {width: 90%; padding: 0; } .highlight > .content > .words > .multibuttons > ul li .multitext {line-height: 1.0em; } .montage {} .multitext { line-height: 38px; } .multitext strong { } /* start One Column styles */ .onecol { position: relative; width: 90%; height: auto; margin: 30px auto; padding: 0px 0; display: inline; float: none; clear:none !important; background: #FFF; } .onecol .content { position: relative; width: 100%; height: auto; margin: 0 auto; padding: 1%; display: table; background: #FFF; } .onecol>.content>.words { position: relative; width: 100%; max-width: 1100px; display: block; margin: 0px auto; float: none; padding: 0;} .onecol>.content>.words>.padding { position: relative; text-align: left; width: 95%; float: none; display: block; margin: 0 2.5%; padding: 0; } .onecol>.content>.words>.multibuttons { position: relative; width: 100%; max-width:100%; display: block; float: none; margin: 0px; padding: 0; } .onecol>.content>.words>.multibuttons>ul { position: relative; width: 100%; display: block; float: none; margin: 0px auto; padding: 0; } .onecol>.content>.words>.multibuttons>ul>li { position: relative; width: 90%; max-width:90%; display: block; float: none; margin: 0px auto; padding: 2.5%; min-height: 100px; } .onecol>.content>.words>.multibuttons>ul>li>.multitext { padding: 0; } /* photo clusters */ #photocluster { position: relative; width: 95%; height: auto !important; display: block; margin: 0 auto; padding: 0; } #photocluster h2 {font-size: 1.2em; font-weight: 900; color:#222; text-transform: uppercase; letter-spacing: 3px; padding: 0 0 20px 0; border-bottom: 1px solid #222; margin: 0 0 20px 0; text-align: center; } #photocluster .solophoto { position: relative; width: 100% !important; float: none; margin: 0; padding: 0; z-index:1000; } #photocluster .solophoto .soloimg { position: relative; width: 100%; height: auto !important; max-height: 557px; display: block; margin: 0; padding: 0; overflow: hidden; } #photocluster .solophoto .soloimg img { width: 100%; height: auto !important; margin: 0; padding: 0; } #photocluster .solophoto .solovid { position: relative; width: 100%; height: auto !important; min-height: 200px !important; display: block; margin: 0 0 20px 0; padding: 0; overflow: visible;} #photocluster .solophoto .solovid iframe { position: absolute;top: 0;left: 0; width: 100%; height: 100%; } #photocluster .solophoto .solovid .caption { display: none;} #photocluster .solophoto .solotext { position: absolute; bottom: 0; width: 90%; height: auto !important; display: block; margin: 0; padding: 5%; color: #FFF; font-size: 1.7em; font-weight: 600;z-index:1001; } #photocluster .solophoto .solotext h2 { color: #FFF; font-size: 1.7em; } #photocluster .solophoto .solocaption { position: relative; background: #f6f6f6; margin-top: 15px;padding: 20px; } #photocluster .cluster { position: relative; width: 100% !important; float: none; margin: 0; padding: 0;} #photocluster .cluster .clustimg { position: relative; width: 50%; height: 273px; max-height: 273px; float: none; margin: 0; padding: 0; background: #222; color: #FFF; } #photocluster .cluster .clustimg img { width: 100%; height: auto !important; } #photocluster .cluster .clustimg .clustvid { position: relative; width: 100%; height: auto; margin: 0; padding: 0; } #photocluster .cluster .clustimg .clustvid iframe { position: absolute;top: 0;left: 0; width: 100%; height: 100%; min-height: 200px; margin: 0; padding: 0; overflow: visible; z-index: 9999; } #photocluster .cluster .clustimg iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;} #photocluster .cluster .clustimg .clusttext { position: absolute; bottom: 1%; width: 90%; height: auto !important; display: block; margin: 0; padding: 5%; font-size: 1.1em; color: #FFF; font-weight: 200; } .solotext a:link, .solotext a:visited { color: #FFF; text-decoration: none; margin: 0px; } .solotext a:active, .solotext a:hover { color: #FFF; text-decoration: underline; } .clusttext a:link, .clusttext a:visited { color: #FFF; text-decoration: none; margin: 0px; font-weight: 800;font-size: 1.2em; } .clusttext a:active, .clusttext a:hover { color: #FFF; text-decoration: underline; font-weight: 800;font-size: 1.2em; } /* ----- Styles for PR Fac & student Profiles ---- */ #profile { width: 80%; padding: 5%; margin: 20px auto; border: 1px solid #333; } #profile .profimg { position: relative; display: block; width: 100%; height: auto; float: none; margin: 0px; } #profile .profimg img { width: 100%; height: auto; } #profile .proftext { position: relative; display: block; width: 100%; height: auto; float: none; margin: 0px; } /* start Section Header styles*/ .section { position:relative; display:block; width:90%; height: auto !important; overflow: visible; margin: 50px auto 0px auto; padding: 0px; align-content: center;max-width: 1100px; background:url(https://www.bard.edu/images/line.png) repeat-x; } .section>.content { position: relative; display:block; float: none; width: 100%; overflow: hidden; margin: 0 auto; padding: 0; text-align: center; } .section>.content h2 { position: relative; display: inline-block; text-align: center; height: 30px; width: auto !important; text-transform: uppercase; letter-spacing: 2px; font-size: 1.2em; line-height: 1em; padding: 5px 10px; margin: 0;background: #FFF; color: #333; clear: both;} .section>.content p { position: relative; width: 90%; background: #ededed; margin: 10px 2.5%; padding: 2.5%; } .section>.content>.words { position: relative; display:block; float: none; width: 100%; overflow: hidden; margin: 0 auto; padding: 0; text-align: center; } .section>.content>.words>.padding { position: relative; display:block; float: none; width: 100%; overflow: hidden; margin: 0 auto; padding: 0; text-align: center; } .section>.content>.words>.padding>.ctabutton { display: inline-block; } .spotlight { position:relative; display:table; width:100%; min-height: 300px; background:#222; padding: 0 0 20px 0; margin: 50px auto; align-content: center; overflow: hidden; } .spotlight h2 {color:#FFF; text-transform: uppercase; letter-spacing: 2px; } .spotlight>.content { } .spotlight>.content>.words { position:relative; width:100%; height:auto; overflow: visible; margin: 0px auto; padding: 0%; text-align: center; color: #FFF; } .spotlight>.content>.words>.padding { width: 80%; height:auto; display: block; overflow: visible; margin: 0px auto; padding: 10px 5% 20px 5%; text-align: left; color: #FFF; } .spotlight>.content>.words>.padding>h2 { text-align: left; color: #FFF; } .spotlight>.content>.imgshell { position: relative; float:none; display: block; width:100%; margin: 0px auto;} .spotlight>.content>.imgleft { position: relative; float:none; display: block; width:100%; margin: 0px auto; overflow: hidden;} .spotlight>.content>.imgright { position: relative; float:none; display: block; width:100%; margin: 0px auto; } .spotlight>.content>.imgleft iframe { position: relative; float:none; display: block; max-width:90%; margin: 0px auto; overflow: hidden; } .spotlight .content .embshell, .spotlight .content .embleft, .spotlight .content .embright { position: relative; display:block; width: 98%; overflow: visible; margin: 1% auto; align-content: center; background: #222;} .spotlight .content .embshell iframe, .spotlight .content .embleft iframe, .spotlight .content .embright iframe { min-height: 200px; background: #222;} .spotlight .caption{ padding-left: 20px; } /* generic tables */ .table {position:relative;display:table;width:90%;margin:5px auto;} .table .tr {position:relative;display:table-cell;text-align:left;padding-left:2%; } .table .td {position:relative;display:block;width:100%;float:none;vertical-align: top;text-align:left;padding: 0; } .table>.td>.content {position:relative;width:100%; margin: 0; padding: 0 10%; display:block;vertical-align: top; } .text { display: block; float: none; width: 90%; margin: 0px auto; padding: 0; } .text>.content { position: relative; display: block; float: none; width: 100%; margin: 0px; padding: 0; } .text>.content>.imgleft, .text>.content>.imgright { display: block; float: none; width: 100%; margin: 20px auto; padding: 0; } .text>.content>.words { display: block; float: none; width: 100%; margin: 20px auto; padding: 0; max-width: 100%; text-align: left;} .text>.content>.words>.padding { display: block; float: none; width: 100%; margin: 20px auto; padding: 0;} .text>.content>.multibuttons { display: block; float: none; width: 85%; margin: 20px auto; } .threecol { position: relative; width: 100%; max-width:100%; height: auto; margin: 50px auto; padding: 20px 0px; display: block; } .threecol>.content>.words { position: relative; width: 90%; max-width:90%; height: auto; margin: 0px auto; padding: 20px 0px; display: block; } .threecol>.content>.imgleft, .text .content .imgshell { position: relative; display:block; float: none; width: 95%; height: auto !important; overflow: visible; margin: 10px auto 20px auto; } .threecol>.content>.imgleft img, .text .content .imgshell img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .threecol>.content>.imgleft iframe, .text .content .imgshell iframe { width: 100%; height: auto; min-height:200px; margin: 0px 0px 0px 0px;} .threecol>.content>.imgright { position: relative; display:block; float: none; width: 80%; height: auto !important; overflow: visible; margin: 20px auto; padding: 5%; background: #FFF;} .threecol>.content>.imgright img { width: 100%; height: auto; margin: 0;} .threecol>.content>.imgcenter { position: relative; display:block; float: none; width: 95%; overflow: hidden; margin: 10px auto 20px auto; } .threecol>.content>.imgcenter img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .threecol .ctabutton {margin: 0px 20px; align-self: center; align-content: center; } .threecol>.content>.words>.padding { margin: 0 0 10px 0; } .threecol>.content>.words>.padding > p { margin: 10px; } .threecol>.content>.words>.padding>h2 { color: #222; font-weight: 900; font-size: 1.2em; padding:0; margin:0 auto; line-height:1em; text-align: center; text-transform: uppercase; letter-spacing: 3px; } .threecol>.content { max-width:100%; margin: 0px auto; overflow-x: hidden; } .threecol>.content>.words>.multibuttons>ul { margin: 0px auto; padding: 0; width: 100%; max-width:100%; display: block; float: none; overflow-x: hidden; } .threecol>.content>.words>.multibuttons>ul>li { position: relative; width: 100%; display:block; padding: 0; float: none; margin: 0 0 20px 0; overflow: visible; min-height: 10px;} /* new full width image style for columns */ .threecol>.content>.words>.multibuttons>ul>li>.multimgfull { position: relative; width: 100%; display:block; float: none; margin: 0 0 20px 0; overflow: visible; } .threecol>.content>.words>.multibuttons>ul>li>.multimgshell, .threecol>.content>.words>.multibuttons>ul>li>.multimgleft, .threecol>.content>.words>.multibuttons>ul>li>.multimgright, .threecol>.content>.words>.multibuttons>ul>li>.multimgcenter { position: relative; width: 90%; display:block; float: none; margin: 5%; padding-top: 20px; overflow: visible;} .threecol>.content>.words>.multibuttons>ul>li>.multimgshell img, .threecol>.content>.words>.multibuttons>ul>li>.multimgleft img, .threecol>.content>.words>.multibuttons>ul>li>.multimgright img, .threecol>.content>.words>.multibuttons>ul>li>.multimgcenter img, .threecol>.content>.words>.multibuttons>ul>li>.multimgfull img{ width: 100%; height: auto; } .threecol>.content>.words>.multibuttons>ul>li>.multimgshell iframe, .threecol>.content>.words>.multibuttons>ul>li>.multimgleft iframe, .threecol>.content>.words>.multibuttons>ul>li>.multimgright iframe, .threecol>.content>.words>.multibuttons>ul>li>.multimgcenter iframe, .threecol>.content>.words>.multibuttons>ul>li>.multimgfull iframe { width: 95%; display:block; float: none; margin: 10px auto 20px auto; overflow: visible; } .threecol > .content > .words > .multibuttons > ul > li > .multitext { width: 95%; display:block; float: none; margin: 0; padding: 2.5%; overflow: visible; } .threecol > .content > .words > .multibuttons > ul > li > .multitext > .linktitle {line-height: 1em;} .threecol > .content > .words > .multibuttons > ul > li > .multitext > p .cms-button {margin-top: 20px;} /* --------- Three Col w/ Dark Background ----------- */ .threecold { position: relative; width: 100%; max-width:100%; height: auto; margin: 25px auto; padding: 20px 0px; display: block; } .threecold>.content>.words { position: relative; width: 90%; max-width:90%; height: auto; margin: 0px auto; padding: 20px 0px; display: block; } .threecold>.content>.imgleft, .text .content .imgshell { position: relative; display:block; float: none; width: 95%; height: auto !important; overflow: visible; margin: 10px auto 20px auto; } .threecold>.content>.imgleft img, .text .content .imgshell img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .threecold>.content>.imgleft iframe, .text .content .imgshell iframe { width: 100%; height: auto; min-height:200px; margin: 0px 0px 0px 0px;} .threecold>.content>.imgright { position: relative; display:block; float: none; width: 80%; height: auto !important; overflow: visible; margin: 20px auto; padding: 5%; background: #FFF;} .threecold>.content>.imgright img { width: 100%; height: auto; margin: 0;} .threecold>.content>.imgcenter { position: relative; display:block; float: none; width: 95%; overflow: hidden; margin: 10px auto 20px auto; } .threecold>.content>.imgcenter img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .threecold .ctabutton {margin: 0px 20px; align-self: center; align-content: center; } .threecold>.content>.words>.padding>h2 { color: #FFF; font-weight: 900; font-size: 1.2em; padding:0; margin:0 auto; line-height:1em; text-align: center; text-transform: uppercase; letter-spacing: 3px; } .threecold>.content { max-width:100%; margin: 0px auto; overflow-x: hidden; } .threecold>.content>.words>.multibuttons>ul { margin: 0px auto; padding: 0; width: 100%; max-width:100%; display: block; float: none; overflow-x: hidden; } .threecold>.content>.words>.multibuttons>ul>li { position: relative; width: 100%; display:block; padding: 0 0 20px 0; float: none; margin: 10px auto 10px auto; overflow: visible; min-height: 100px;} /* new full width image style for columns */ .threecold>.content>.words>.multibuttons>ul>li>.multimgfull { position: relative; width: 100%; display:block; float: none; margin: 0 0 20px 0; overflow: visible; } .threecold>.content>.words>.multibuttons>ul>li>.multimgshell, .threecold>.content>.words>.multibuttons>ul>li>.multimgleft, .threecold>.content>.words>.multibuttons>ul>li>.multimgright, .threecold>.content>.words>.multibuttons>ul>li>.multimgcenter { position: relative; width: 90%; display:block; float: none; margin: 5%; padding-top: 20px; overflow: visible; } .threecold>.content>.words>.multibuttons>ul>li>.multimgfull img { width: 100%; display:block; float: none; margin: 0 0 20px 0; overflow: visible; } .threecold>.content>.words>.multibuttons>ul>li>.multimgshell img, .threecold>.content>.words>.multibuttons>ul>li>.multimgleft img, .threecold>.content>.words>.multibuttons>ul>li>.multimgright img, .threecold>.content>.words>.multibuttons>ul>li>.multimgcenter img { width: 100%; height: auto; } .threecold>.content>.words>.multibuttons>ul>li>.multimgshell iframe, .threecold>.content>.words>.multibuttons>ul>li>.multimgleft iframe, .threecold>.content>.words>.multibuttons>ul>li>.multimgright iframe, .threecold>.content>.words>.multibuttons>ul>li>.multimgcenter iframe, .threecold>.content>.words>.multibuttons>ul>li>.multimgfull iframe { width: 95%; display:block; float: none; margin: 10px auto 20px auto; overflow: visible; } .threecold .multitext { width: 95%; display:block; float: none; margin: 10px auto 20px auto; overflow: visible; } .threecold > .content > .words > .multibuttons > ul > li > .multitext > .linktitle {line-height: 1em;} .threecold > .content > .words > .multibuttons > ul > li > .multitext > p .cms-button {margin-top: 20px;} .threecolw { position: relative; width: 100%; max-width:100%; height: auto; margin: 25px auto; padding: 20px 0px; display: block; } .threecolw>.content>.words { position: relative; width: 90%; max-width:90%; height: auto; margin: 0px auto; padding: 20px 0px; display: block; } .threecolw>.content>.imgleft, .text .content .imgshell { position: relative; display:block; float: none; width: 95%; height: auto !important; overflow: visible; margin: 10px auto 20px auto; } .threecolw>.content>.imgleft img, .text .content .imgshell img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .threecolw>.content>.imgleft iframe, .text .content .imgshell iframe { width: 100%; height: auto; min-height:200px; margin: 0px 0px 0px 0px;} .threecolw>.content>.imgright { position: relative; display:block; float: none; width: 80%; height: auto !important; overflow: visible; margin: 20px auto; padding: 5%; background: #FFF;} .threecolw>.content>.imgright img { width: 100%; height: auto; margin: 0;} .threecolw>.content>.imgcenter { position: relative; display:block; float: none; width: 95%; overflow: hidden; margin: 10px auto 20px auto; } .threecolw>.content>.imgcenter img { width: 100%; height: auto; margin: 0px 0px 0px 0px;} .threecolw .ctabutton {margin: 0px 20px; align-self: center; align-content: center; } .threecolw>.content>.words>.padding>h2 { color: #222; font-weight: 900; font-size: 1.2em; padding:0; margin:0 auto; line-height:1em; text-align: center; text-transform: uppercase; letter-spacing: 3px; } .threecolw>.content { max-width:100%; margin: 0px auto; overflow-x: hidden; } .threecolw>.content>.words>.multibuttons>ul { margin: 0px auto; padding: 0; width: 100%; max-width:100%; display: block; float: none; overflow-x: hidden; } .threecolw>.content>.words>.multibuttons>ul>li { width: 100%; display:block; padding: 0 0 20px 0; float: none; margin: 10px auto 10px auto; overflow: visible; min-height: 100px;} /* new full width image style for columns */ .threecolw>.content>.words>.multibuttons>ul>li>.multimgfull { width: 100%; display:block; float: none; margin: 0 0 20px 0; overflow: visible; } .threecolw>.content>.words>.multibuttons>ul>li>.multimgshell, .threecolw>.content>.words>.multibuttons>ul>li>.multimgleft, .threecolw>.content>.words>.multibuttons>ul>li>.multimgright, .threecolw>.content>.words>.multibuttons>ul>li>.multimgcenter { width: 90%; display:block; float: none; margin: 5%; padding-top: 20px; overflow: visible; } .threecolw>.content>.words>.multibuttons>ul>li>.multimgshell img, .threecolw>.content>.words>.multibuttons>ul>li>.multimgleft img, .threecolw>.content>.words>.multibuttons>ul>li>.multimgright img, .threecolw>.content>.words>.multibuttons>ul>li>.multimgcenter img, .threecolw>.content>.words>.multibuttons>ul>li>.multimgfull img { width: 100%; height: auto; } .threecolw>.content>.words>.multibuttons>ul>li>.multimgshell iframe, .threecolw>.content>.words>.multibuttons>ul>li>.multimgleft iframe, .threecolw>.content>.words>.multibuttons>ul>li>.multimgright iframe, .threecolw>.content>.words>.multibuttons>ul>li>.multimgcenter iframe, .threecolw>.content>.words>.multibuttons>ul>li>.multimgfull iframe { width: 95%; display:block; float: none; margin: 10px auto 20px auto; overflow: visible; } .threecolw>.multitext { width: 95%; display:block; float: none; margin: 10px auto 20px auto; overflow: visible; } .threecolw>.content>.words>.multibuttons>ul>li>.multitext > .linktitle {line-height: 1em;} .threecolw > .content > .words > .multibuttons > ul > li > .multitext > p .cms-button {margin-top: 20px;} /* start Two Column styles */ main #maintext .content .twocol { position: relative; width: 100%; height: auto; margin: 2% auto; padding: 0; display: inline; float: left; clear:none !important; } .twocol .content { width: 90%; margin : 0 auto; display: block; } .twocol>.content>.words { position: relative; width: 100%; display: block; margin: 0px; } .twocol>.content>.words>.padding { position: relative; text-align: left; width: 95%; float: none; display: block; padding: 2.5%; margin: 0 auto } .twocol>.content>.words>.padding h2, .twocol>.content>.words>.padding p { position: relative; text-align: left; width: 95%; display: block; padding: 2.5%; margin: 0 auto } .twocol>.content>.words>.multibuttons { position: relative; width: 100%; max-width:1200px; display: block; margin: 0px auto;} .twocol>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto; width: 100%; display: block; } .twocol>.content>.words>.multibuttons>ul>li { position: relative; width: 80%; display:block; float: left; margin: 10px auto; padding: 5%;height: auto !important; background: #FFF;overflow: visible; } .twocol>.content>.words>.multibuttons>ul>li>.multimgshell, .twocol>.content>.words>.multibuttons>ul>li>.multimgleft, .twocol>.content>.words>.multibuttons>ul>li>.multimgcenter, .twocol>.content>.words>.multibuttons>ul>li>.multimgfull{ position: relative; width: 100%; height: auto; max-height: 400px; overflow: visible; padding: 0; margin: 0;display: block; float: none;} .twocol>.content>.words>.multibuttons>ul>li>.multimgshell img, .twocol>.content>.words>.multibuttons>ul>li>.multimgleft img, .twocol>.content>.words>.multibuttons>ul>li>.multimgcenter img, .twocol>.content>.words>.multibuttons>ul>li>.multimgfull img { position: relative; width: 100%; height: auto !important; } .twocol>.content>.words>.multibuttons>ul>li>.multimgright { position: relative; width: 100%; height: auto; max-height: 400px; overflow: hidden; padding: 0; margin: 0;display: block; float: none; } .twocol>.content>.words>.multibuttons>ul>li>.multimgright img { position: relative; width: 100%; height: auto !important; } .twocol>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: 100%; padding: 0%; margin: 0; } /* start Two Column DARK styles */ main #maintext .content .twocold { position: relative; width: 100%; height: auto; margin: 2% auto; padding: 0; display: inline; float: left; clear:none !important; } .twocold .content { width: 90%; margin : 0 auto; display: block; } .twocold>.content>.words { position: relative; width: 100%; display: block; margin: 0px; } .twocold>.content>.words>.padding { position: relative; text-align: left; width: 95%; float: none; display: block; padding: 2.5%; margin: 0 auto } .twocold>.content>.words>.padding h2, .twocol>.content>.words>.padding p { position: relative; text-align: left; width: 95%; display: block; padding: 2.5%; margin: 0 auto } .twocold>.content>.words>.multibuttons { position: relative; width: 100%; max-width:1200px; display: block; margin: 0px auto;} .twocold>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto; width: 100%; display: block; } .twocold>.content>.words>.multibuttons>ul>li { position: relative; width: 80%; display:block; float: left; margin: 10px auto; padding: 5%;height: auto !important; background: #FFF;overflow: visible; } .twocold>.content>.words>.multibuttons>ul>li>.multimgshell, .twocold>.content>.words>.multibuttons>ul>li>.multimgleft, .twocold>.content>.words>.multibuttons>ul>li>.multimgcenter, .twocold>.content>.words>.multibuttons>ul>li>.multimgfull{ position: relative; width: 100%; height: auto; max-height: 400px; overflow: visible; padding: 0; margin: 0;display: block; float: none;} .twocold>.content>.words>.multibuttons>ul>li>.multimgshell img, .twocold>.content>.words>.multibuttons>ul>li>.multimgleft img, .twocold>.content>.words>.multibuttons>ul>li>.multimgcenter img, .twocold>.content>.words>.multibuttons>ul>li>.multimgfull img { position: relative; width: 100%; height: auto !important; } .twocold>.content>.words>.multibuttons>ul>li>.multimgright { position: relative; width: 100%; height: auto; max-height: 400px; overflow: hidden; padding: 0; margin: 0;display: block; float: none; } .twocold>.content>.words>.multibuttons>ul>li>.multimgright img { position: relative; width: 100%; height: auto !important; } .twocold>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: 100%; padding: 0%; margin: 0; } /* start Two Column WHITE styles */ main #maintext .content .twocolw { position: relative; width: 100%; height: auto; margin: 2% auto; padding: 0; display: inline; float: left; clear:none !important; } .twocolw .content { width: 90%; margin : 0 auto; display: block; } .twocolw>.content>.words { position: relative; width: 100%; display: block; margin: 0px; } .twocolw>.content>.words>.padding { position: relative; text-align: left; width: 95%; float: none; display: block; padding: 2.5%; margin: 0 auto } .twocolw>.content>.words>.padding h2, .twocol>.content>.words>.padding p { position: relative; text-align: left; width: 95%; display: block; padding: 2.5%; margin: 0 auto } .twocolw>.content>.words>.multibuttons { position: relative; width: 100%; max-width:1200px; display: block; margin: 0px auto;} .twocolw>.content>.words>.multibuttons>ul { position: relative; margin: 0px auto; width: 100%; display: block; } .twocolw>.content>.words>.multibuttons>ul>li { position: relative; width: 80%; display:block; float: left; margin: 10px auto; padding: 5%;height: auto !important; background: #F6F6F6;overflow: visible; } .twocolw>.content>.words>.multibuttons>ul>li>.multimgshell, .twocolw>.content>.words>.multibuttons>ul>li>.multimgleft, .twocolw>.content>.words>.multibuttons>ul>li>.multimgcenter, .twocolw>.content>.words>.multibuttons>ul>li>.multimgfull{ position: relative; width: 100%; height: auto; max-height: 400px; overflow: visible; padding: 0; margin: 0;display: block; float: none;} .twocolw>.content>.words>.multibuttons>ul>li>.multimgshell img, .twocolw>.content>.words>.multibuttons>ul>li>.multimgleft img, .twocolw>.content>.words>.multibuttons>ul>li>.multimgcenter img, .twocolw>.content>.words>.multibuttons>ul>li>.multimgfull img { position: relative; width: 100%; height: auto !important; } .twocolw>.content>.words>.multibuttons>ul>li>.multimgright { position: relative; width: 100%; height: auto; max-height: 400px; overflow: hidden; padding: 0; margin: 0;display: block; float: none; } .twocolw>.content>.words>.multibuttons>ul>li>.multimgright img { position: relative; width: 100%; height: auto !important; } .twocolw>.content>.words>.multibuttons>ul>li>.multitext { position: relative; width: 100%; padding: 0%; margin: 0; } /* Video Cols */ .videorow { position: relative; display: block; width: 100%; height: auto !important; overflow: visible; min-height: 0px; margin: 0 auto 0 auto; padding: 0px; } .videorow .videocol { position:relative; display: block; float: none; width: 100%; height: auto !important; overflow: visible; margin: 0px auto 30px auto; padding: 0; clear: right; } .videorow .videocol .embedshell { display: block; width: 100%; height: auto !important; float: none; margin: 0; padding: 0; max-height: 150px; } .videorow .videocol .embedshell iframe { display: block; width: 100%; float: none; margin: 0px; padding: 0px; max-height: 150px; } .videorow .videocol h3 { line-height: 18px; } .videorow .videocol .videotext { position: relative; display: block; width: 94%; height: auto !important; float: none; margin: 0px; padding: 20px 3% 30px 3%; max-height: 1000px; } .videorow .videocol .videolist { position: relative; display: block; width: 94%; height: auto !important; margin: 0px auto; padding: 0; } .videorow h3, .videorow .videocol .videotext h3 { margin: 0px; padding: 0; } .videorow ul { margin: 0px 0px 0 20px; padding: 0px; height: auto; overflow: visible; } .cal_small { display: block; width: 95%; height: auto; margin: 0 auto;} .cal_full {display: none; } .footer { font-size: 1em; color: #FFF; line-height: 24px; } footer { margin: 0px; width: 100%; height: auto; display: block; top: 45px; min-height: 700px; overflow: visible;} footer .content { position: relative; width: 98%; height: auto !important; padding: 0 0 20px 0; margin: 0 auto; display: block; } footer .content #footercontact { position: relative; float: none; width: 92%; display: block; clear: both; padding: 7%; margin: 0 auto; } footer .content #footercontact #footiconbox { margin: 0 auto; width: 100%; float: none; display:block; } footer .content #footercontact #footiconbox #footericons { float: left; } footer .content #footercontent { position: relative; float: none; width: 88%; display: block; margin: 0px auto;padding: 0 6%; } footer .content #footercontent .footercol { position: relative; float: none; width: 100%; max-width: 100%; display: block; margin: 0px 0 0 0;padding: 0; border: none;} footer .footercol #imgfooter img { position: relative; width: 100%; } footer .footercol #imgfooter a { position: relative; width: 100%; height: 100%; } footer .footercol img { position: relative; width: 100%;height: auto;} .eventbox li { position: relative; width: 100%; list-style:none; display: table; float: none; color: #222; margin: 13px 0; } .eventbox li .eventdate { position: relative; width: 10%; display: table-cell; float: left; color: #FFF; background: #222; padding: 2%; margin: 0 2% 0px 0; border: none; text-align: center; } .eventbox li .eventdate .datesml { color: #FFF; font-weight: bold; font-size: 28px; line-height: 20px; padding: 0px; margin: 0px; display: block;text-align: center; } .eventbox li .eventdate .month { color: #FFF; text-transform:uppercase; font-size: 10px; line-height: 10px; font-weight: bold; text-align: center; padding: 0px; margin: 0px 0px 3px 0px;display: block; } .eventbox li .eventarea { position: relative; width: 75%; display: table-cell;float: left; padding: 0px; margin: 0px; padding-right: 0px; margin-right: 0px;border-right: none; } /* 2018 HP Styles */ body#home #hppr {position: relative; width: 90%; max-width: 1100px; display: table; margin: 20px 5%; } body#home #hppr .hpprnews {position: relative; width: 100%; display: block; float: none; margin: 0; } body#home #hppr .hpprnews>.hpcols {position: relative; width: 100%; display: block; float: none; margin: 0; } body#home #hppr>.hpprfeed { position: relative; width: 100%; display: block; float: none; margin: 0;} body#home #maintext .content #icons>.column, body#home #maintext .content #icons>.columnx2, body#home #maintext .content #icons>.columnx3, body#home #maintext .content #icons>.columnx4, body#home #maintext .content #icons>.columnx5, body#home #maintext .content #icons>.columnx6 { display: block; float: none; width: 100%; margin-bottom: 10px; padding: 0px; border: none; } body#home #newsbox .contentx2 { display: block; width: 98%; margin-top: 20px; } body#home #hp2pr {position: relative; width: 90%; max-width: 1100px; display: block; margin: 40px auto 50px auto; } body#home #hp2pr .hp2prnews {position: relative; width: 100%; display: block; float: none; } body#home #hp2pr .hp2prnews>.hp2cols {position: relative; width: 100%; display: block; float: none; margin: 00; } body#home #hp2pr .hp2prnews>.hp2cols img {position: relative; width: 100%; height: auto; } body#home #hp2pr .hp2prnews>.hp2cols>.image>.caption {position: relative; width: 100%; height: auto; line-height: 1em; text-align: left; margin:0;padding:0; } body#home #hp2pr .hp2prnews>.hp2side {position: relative; width: 100%; display: block; float: none; margin: 50px 0; padding: 0%; background: #FFF; } body#home #hp2pr .hp2prnews>.hp2side img {width: 100%; height: auto !important;} body#home #hp2pr>.hp2prfeed { position: relative; width: 100%; padding: 0%; display: block; float: none; margin: 20px 0 50px 0; } body#home #hp2pr>.hp2prfeed>ul.hpevents {position: relative; width: 100%; display: table; padding: 0; margin: 10px 0 0 0; list-style: none; border: none;} body#home #hp2pr .hp2prfeed>ul.hpevents li {position: relative; display: block ; width: 100%;padding: 0; margin: 0; list-style: none;} body#home #hp2pr .datesml {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 1.5em; color: #222; font-weight: 800; } body#home #hp2pr .day {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 0.8em; text-transform: uppercase; letter-spacing: 1px; color: #CCC; } body#home #hp2pr>h2 , body#home #hp2pr .subtitle, body#home #hp2pr .hpprevents>h2 {color: #222;} body#home #hp2pr strong { font-weight: 900; } body#home #hp2pr .hpprevents li a:link, body#home #hp2pr .hpprevents li a:visited { color:#ad1a1f; text-decoration: none; font-weight: 800; } body#home #introtext { position: relative; width: 90%; margin: 20px auto 4% auto; padding: 6% 5%; font-size: 1.0em; line-height: 1.5em; text-align: center; max-width: 1300px; font-weight: 500; background: #f6f6f6; color: #222; clear: both; } body#home #introtext .subtitle { display: block; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; color:#222; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; font-size: 1.3em; line-height: 1.2em; font-weight: 900; text-align:center; text-transform: uppercase; letter-spacing: 3px;} nav .menu_container .menu_dropdown_block .column.three-col, .menu_container .menu_dropdown_block .column.four-col { width: 90%; } /* Code specfic for inline images in PR News */ body.news .newscontent { position: relative; width: 90%; height: auto !important; margin: 40px 5%; padding: 40px 0 0 0; border-top: 1px solid #ededed; line-height: 2em; } body.news .newscontent .primgfeat { position: relative; float: none; display: block; width: 100%; height: auto !important; margin: 0px 0px 0px 0px; padding: 0; } body.news .newscontent .primgfeat img { position: relative; width: 100%; height: auto !important; margin: 0px; padding: 0; } body.news .newscontent .primgfeat .caption { position: relative; float: left; width: 100%; height: auto !important; text-align: left; margin: 0; padding: 0; color: #666; } body.news .primgleft { position: relative; float: none; width: 100%; height: auto !important; margin: 15px 0px 15px 0px; } body.news .primgright { position: relative; float: none; width: 100%; height: auto !important; margin: 15px 0px 15px 0px; } body.news .primgbot { position: absolute; bottom: 0px; display: inline-block; float: none; height: auto !important; width: 100%; margin: 0; } body.news .primgleft img, body.news .primgright img, body.news .primgbot img { width: 100%; height: auto !important; } body.news .newscontent .primgleft .caption, body.news .newscontent .primgright .caption, body.news .newscontent .primgbot .caption { position: relative; float: left; width: 100%; height: auto !important; text-align: left; margin: 0; padding: 0; color: #666;} body.news .section { margin: 0 auto 40px auto; } body.news #introshell { min-height: 50px; } body.news h1 {font-size: 2.0em; } body.news .releases .content>.prside { position:relative; float: none;width: 90%;height: auto; padding: 0; margin: 0 auto; } body.news .releases .content>.prtext { position:relative; float: none;width: 90%;height: auto; padding: 0; margin: 0 auto; line-height: 2.0em; vertical-align: top; } body.news .releases .content .prtext .primg {position:relative; display: block;width: 100%;height: auto; padding: 0; margin: 0; } body.news .releases .content .prtext .primg img {position:relative; width: 100%;height: auto; padding: 0; margin: 0; } body.news .releases .content .prtext .caption {position:relative; text-align: left; width: 100%; height: auto !important; overflow: visible; padding: 0; margin: 0 0 25px 0; } body.news .releases .content .prtext h1 { text-transform: none; font-size: 1.5em; padding: 0; margin: 2% 0 5% 0; } /* CCE Newsroom page Styles */ .cce-feature { position: relative; width: 100%; height: auto !important; background: #f6f6f6; padding: 0; margin: 20px 0; display: table; } .cce-feature .cce-featcol { position: relative; width: 90%; max-width: 1200px; height: auto !important; padding: 5%; margin: 0 auto; } .cce-feature .cce-featcol .featimg { position: relative; width: 100%; height: auto !important; padding: 0; margin: 0; float: left; display: block;} .cce-feature .cce-featcol .featimg img { position: relative; width: 100%; height: auto !important; padding: 0px; margin: 0; } .cce-feature .cce-featcol .feattext { position: relative; width: 100%; height: auto !important; padding: 2%; margin: 0; float: left; display: block; line-height: 2em;} .cce-feature .cce-featcol .feattext h2 { line-height: 1.5em; margin: 0; padding: 0;} .cce-feature .cce-featcol .feattext p { line-height: 2em; margin: 0; padding: 0;} .cce-newscols { position: relative; width: 100%; max-width: 1200px; height: auto !important; padding: 0px; margin: 50px auto; display: block; } .cce-newscols .cce-highlights { position: relative; width: 100%; height: auto !important; padding: 0; margin: 20px 0; display: block; vertical-align: top; } .cce-newscols .cce-highlights .cce-highcol { position: relative; width: 100%; height: auto !important; padding: 0 0 0 0; margin: 0; display: block; vertical-align: top; } .cce-newscols .cce-highlights .cce-highcol .highimg { position: relative; width: 98%; height: auto !important; padding: 0; margin: 0; display: block; } .cce-newscols .cce-highlights .cce-highcol .highimg img { position: relative; width: 100%; height: auto !important; padding: 0px; margin: 0; } .cce-newscols .cce-highlights .cce-highcol .hightext { position: relative; width: 90%; height: auto !important; padding: 1% 5%; margin: 0 auto; display: block; line-height: 1.8em; } .cce-newscols .cce-highlights .cce-highcol .hightext h2 { color: #222; font-size: 1.2em; } .cce-newscols .cce-highlights .cce-highcol .hightext h2 a { color: #222; text-decoration: none; } .cce-newscols .cce-highlights .cce-videocol { position: relative; width: 90%; height: auto !important; padding: 0; margin: 0 auto; display: block; vertical-align: top; } .cce-newscols .cce-highlights .cce-videocol .hightext h2 { color: #222; font-size: 1.2em; } .cce-newscols .cce-newslist { position: relative; width: 100%; height: auto !important; padding: 2.5%; margin: 20px 0; display: block; vertical-align: top; background: #ededed; align-content:center;} .cce-newscols .cce-newslist .cce-listcol { position: relative; width: 90%; height: auto !important; padding: 2.5%; margin: 0 0 20px 0; display: block; } /* PR News Feeds for a News Page */ body#newsroom #hppr {position: relative; width: 90%; max-width: 1100px; display: table; margin: 0px auto; } body#newsroom #hppr .hpprnews {position: relative; width: 100%; display: block; float: none; } body#newsroom #hppr .hpprnews>.hpcols {position: relative; width: 100%; display: block; float: none; margin: 0; } body#newsroom #hppr .hpprfeed { position: relative; width: 100%; padding: 0%; display: block; float: none; } body#newsroom #hppr .hpprevents { position: relative; width: 100%; padding: 0%; margin: 10px auto; display: block; float: none; } body#newsroom #hppr .hpprevents>.hpcols {position: relative; width: 96%; padding: 2%; display: block; border: 1px solid #222; } body#newsroom #hppr .hpprevents>.hpcols ul.hpevents {position: relative; width: 100%; display: table; padding: 0; margin: 0; list-style: none; } body#newsroom #hppr .hpprevents>.hpcols ul.hpevents li {position: relative; display: block; width: 100%;float: none; padding: 0 0 10px 0; margin: 0 0 10px 0; list-style: none; border-bottom: 1px solid #ededed; } .events ul.hpevents li { position: relative; list-style: none; display: table-row !important; width: 90%; max-width: 90%; height: auto !important; border: none; padding: 5%; margin: 10px auto; text-align:left; overflow: visible; border: 1px solid #222;} .events ul.hpevents li .date {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 1.5em; color: #222; font-weight: 800; } .events ul.hpevents li .day {position: relative; display: inline; float: left; padding: 0; margin: 0 5px 0 0; font-size: 0.8em; text-transform: uppercase; letter-spacing: 1px; } .events ul.hpevents li .eventtext { position: relative; text-align: left; float: left; display: inline; font-size: 0.8em; padding: 20px; line-height: 1.1em; } } @media screen and (max-width: 320px){ #supershell { width: 400px; display: block; float: none; margin: 0px; padding: 0px; } } /* ---------------------------- PRINT ONLY STYLES ------------------------ */ @media print { body { background: #FFF; } nav { } nav a:link,nav a:visited,nav a:hover,nav a:active { color: #000; } header { display: none; } header .content #logo { position: relative; top: 5px; width: 175px; padding: 0px; margin: 0px auto; background: url(//www.bard.edu/images/logo-print.png) center center; } header .content #logo img { position: relative; padding: 0px; margin: 0px auto;} main { position:relative; width: 100%; top: 0px; } #introshell { } ul.dropdown-menu {display: none; } #subnav li { margin-right: 10px; padding-right: 10px; } #submenu, #sitemenu {display: none;} #introtext {margin-top: 15px; } #introcol #left #image { display: none; } #introshell h1 { position: relative; top: 10px; left: 0%;font-size: 2em; line-height: 2em; color: #FFF; height: auto; margin: 10px 0; } h1.pagetitle { position: relative; margin: 10px 0; } #introshell .imgshell { width: 100%; height: auto; } #boxes { margin-top: 50px; } #boxes h3 { position: absolute; top: -30%; margin: 0px auto; padding: 0px 5%; text-align: center; color: #FFF; font-size: 1.5em; line-height: 1.2em; font-weight: 200; } #boxes img.icon, #boxes .button {display: none; } * { text-shadow:none!important;color:#000!important;background:transparent!important;box-shadow:none!important; } a:link,a:visited,a:hover,a:active { color: #ad1a1f; text-decoration:underline; } header h2 { font-family: "Helvetica Neue Light", Helvetica, Arial, sans-serif;font-weight: bold; color:#5d5d5d; margin: 0px 0px 15px 0px; display: block; font-size: 3em; line-height: 2em; } .cal_small {display: none; } .cal_full {display: block; } #imgfooter {display:none;} }