#important-dates h3 { font-size: 18px } #important-dates { font-size: 13px } .news-item { border-bottom: 1px solid #edf2f7; padding-bottom: 30px; margin-bottom: 30px } .grey-bar.news { margin-bottom: 0; padding: 20px; text-align: right } .grey-bar.news a { font-size: 12px; text-transform: uppercase; color: #30739C } .grey-bar.news a:hover { color: #2A4E68; text-decoration: none } .grey-bar.news a i { margin-right: 5px } .grey-bar.news a.manage-news-link { color: #889E2F; margin-right: 20px } .grey-bar.news a.manage-news-link:hover { color: #5A6E1D } .carousel, .carousel-inner { height: 350px } .carousel-inner img { min-height: 350px; height: 100%; min-width: 100%; max-width: none; width: auto; opacity: .6 } .carousel-inner > .item > a > img, .carousel-inner > .item > img { min-width: 100%; max-width: none; width: 100% } @media (max-width: 767px) { .carousel-inner > .item > a > img, .carousel-inner > .item > img { width: auto } } .carousel-inner .item { height: 350px; background: #2A4E68 } .carousel-control { text-shadow: none } .carousel-control i { position: absolute; top: 50%; z-index: 5; display: inline-block } .carousel-control.right i { right: 50%; margin-top: -15px; margin-right: -15px } .carousel-control.left i { left: 50%; margin-top: -15px; margin-left: -15px } .carousel-caption { text-shadow: none; bottom: 60px } .carousel-caption h3 { color: #fff } .carousel-caption a.more-btn { display: block; color: #fff; background: #DA422F; border-radius: 4px; padding: 5px 10px; margin: 0 auto 20px; max-width: 150px; text-transform: uppercase; font-size: 12px } .carousel-caption a.more-btn:hover { text-decoration: none; background: #B92623 } .newsFeatured { margin: 40px 0 60px; float: left; text-align: left; padding-bottom: 10px; border-bottom: 1px solid #edf2f7; min-width: 100% !important } .featuredImage { position: relative; width: 100%; height: 180px; overflow: hidden; margin-bottom: 10px; background: #30739C } .featuredImage img { width: 100% } .featuredHeadline { position: absolute; bottom: 0; right: 0; left: 0; background: rgba(0, 0, 0, .6); padding: 15px 10px; font-weight: 400; color: #fff } .featuredHeadline .more { display: none; text-align: center; margin: 30px auto 20px; text-transform: uppercase; font-weight: 600; background: #fff; border-radius: 2px; padding: 10px; width: 150px; color: #333 } .featuredHeadline .more i { margin-left: 8px } .featuredHeadline .more:hover { background: #eee } .featuredImage:hover .featuredHeadline, .open .featuredHeadline { top: 0 } .featuredImage:hover .more, .open .more { display: block } .featuredImage:hover .featuredDate { display: none } .featuredDate { font-size: 12px; position: absolute; top: 5px; left: 10px; color: #fff } .featuredSummary { font-size: 12px; color: #555 } ul.featured { padding: 0; margin: 0 } ul.featured li { list-style: none; margin-bottom: 30px; border-radius: 4px } @media (max-width: 767px) { ul.featured li { margin-bottom: 20px } } .recentBox { margin-bottom: 30px } .itemTimeStamp { font-size: 12px; color: #999; margin-left: 10px; padding-left: 10px; border-left: 1px solid #aaa } .news-sidebar { background: #edf2f7; padding: 15px; border-radius: 4px; margin-top: 0 } .see-all-events { float: right } .see-all-events a { font-size: 12px } .eventBlock { padding-left: 15px; font-size: 12px } .eventBlock h3 { margin-bottom: 15px } .eventBlock .event { margin-bottom: 20px } .eventBlock .event.top { margin-top: 20px } .main-video-wrapper { width: 100%; background: #222; height: auto; margin: 0 0 30px; text-align: center; -moz-box-sizing: border-box; box-sizing: border-box } a.main-video { position: relative; display: block; max-width: 617px; margin: 0 auto; border-left: 1px solid #eee; border-right: 1px solid #eee } a.main-video .video-description-wrapper { position: absolute; display: block; background: rgba(0, 0, 0, .7); bottom: 0; left: 0; right: 0; top: 230px; text-align: left; z-index: 1000; padding: 20px } @media (max-width: 767px) { a.main-video .video-description-wrapper { top: 60% } } @media (max-width: 480px) { a.main-video .video-description-wrapper { top: 50% } } a.main-video .video-description-wrapper .video-description { width: 80%; float: left } a.main-video .video-description-wrapper .video-description h3 { color: #fff; font-size: 22px; font-weight: 600; width: 100%; height: 25px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis } a.main-video .video-description-wrapper .video-description p { color: #fff; font-size: 13px; line-height: 1.2; font-weight: 400; padding: 0; display: block; width: 100%; height: 15px; margin: 0 auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis } a.main-video:hover .video-description-wrapper { top: 0 } a.main-video:hover .video-description-wrapper .video-description h3 { height: 10%; white-space: normal } a.main-video:hover .video-description-wrapper .video-description p { height: 90%; white-space: normal } @media (max-width: 480px) { a.main-video:hover .video-description-wrapper { top: 50% } a.main-video:hover .video-description-wrapper .video-description h3 { height: 25px; white-space: nowrap } a.main-video:hover .video-description-wrapper .video-description p { height: 15px; white-space: nowrap } } .main-video img { margin: 0 auto; width: 100%; max-width: 615px; max-height: 100%; display: block; position: relative; z-index: 1 } .play-btn { float: right; color: #fff; font-size: 40px; width: 20%; margin-top: 5px; text-align: center } .play-btn img#play { max-width: 70px; max-height: 70px } .featured-row { width: 100%; background: #2A4E68; padding: 0; position: relative; display: block; margin-bottom: 50px } .featured-row h2 { color: #fff; font-weight: 400; font-size: 24px } .featured-row h2 span { font-weight: 400; font-size: 12px; color: #edf2f7; margin-left: 20px } .featured-row:after { top: 100%; left: 10%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(42, 78, 104, 0); border-top-color: #2A4E68; border-width: 15px; margin-left: -15px } .daily-recap-wrapper .video-thumb-title { text-align: center } .video-thumb { background: #edf2f7; text-align: center; width: 100%; height: 138px; min-height: 138px; position: relative; display: table; overflow: hidden; margin-bottom: 20px } .thumb-play { display: none; background-image: url(//www.openstack.org/themes/openstack/images/landing-pages/auto/play-button.png); background-repeat: no-repeat; background-position: center center; background-color: rgba(0, 0, 0, .3); position: absolute; top: 0; left: 0; right: 0; bottom: 0 } .video-thumb:hover .thumb-play { display: block } .video-thumb img.video-thumb-img { width: 100%; max-width: 100%; height: 138px } .video-thumb p { color: #C6CDD6; font-size: 14px; font-weight: 700; display: table-cell; vertical-align: middle } .sort-row { background: #edf2f7; width: 100%; min-height: 50px; padding: 25px 0; position: relative; display: block; margin: 50px 0; color: #2A4E68 } .sort-left { float: left } .sort-left i { color: #b4c5d6; line-height: 1; margin-right: 10px } .sort-left i:hover { color: #2A4E68; cursor: pointer } .sort-left i.active { color: #2A4E68 } .sort-right { float: right; font-size: 12px; text-transform: uppercase; font-weight: 600 } .sort-right i { margin-left: 10px; font-weight: 700; font-size: 14px } .video-thumb-title { margin: -10px 0 0; color: #30739C; font-size: 12px; font-weight: 400; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis } .video-thumb-speaker { color: #30739C; font-size: 12px; font-weight: 600; margin-bottom: 40px; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis } .video-dropdown > .dropdown-menu { margin: 20px -20px 0; padding: 10px 0; min-width: 230px; border-top-left-radius: 4px; border-top-right-radius: 4px; left: -99%; right: 100%; background-color: #edf2f7; background-clip: padding-box; border: 1px solid transparent; box-shadow: none } .video-dropdown > .dropdown-menu li a { text-transform: uppercase; padding: 13px 20px; font-size: 12px; color: #2A4E68 } .video-dropdown > .dropdown-menu li a:hover { color: #fff; background: #2A4E68 } .video-dropdown > .dropdown-menu li a:focus { outline: 0 } .newSubNav { width: 85% } .newSubNav ul { padding: 0; margin-top: 30px; margin-left: -10px } .newSubNav ul:nth-child(2) { border-top: 1px solid #E8E8E8; padding-top: 30px } .newSubNav li { list-style: none } .newSubNav a { color: #8A959E; text-transform: uppercase; font-size: 12px; padding: 15px 20px; display: block } .newSubNav a.current, .newSubNav a.current:hover { background-color: #EDF2F7; font-weight: 700; color: #2D709B } .newSubNav a:hover { text-decoration: none; color: #000 } .newSubNav .fa-chevron-right { float: right; margin-top: 2px; color: #C6D8E4 } li#start a { color: #75C320 } li#openstack-shared-services { padding-bottom: 20px; border-bottom: 1px solid #E8E8E8 } li#start { margin-top: 20px } fieldset { border: 1px solid #CCC; padding: 20px 17px; margin-bottom: 20px } fieldset ul { list-style: none } input[type=radio] { margin-left: 0 } input[type=checkbox] { margin-left: 0 !important } input[type=checkbox], input[type=radio] { display: inline-block }