/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;} /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;} body {line-height: 1;} ol, ul {list-style: none;} blockquote, q {quotes: none;} blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;} table {border-collapse: collapse; border-spacing: 0;} /* / meyer Reset Styles */ html { font: 16px/20px 'Open Sans', sans-serif; background: #07173a; /* Old browsers */ background: -moz-linear-gradient(top, #07173a 0%, #485563 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#07173a), color-stop(100%,#485563)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #07173a 0%,#485563 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #07173a 0%,#485563 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #07173a 0%,#485563 100%); /* IE10+ */ background: linear-gradient(to bottom, #07173a 0%,#485563 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#07173a', endColorstr='#485563',GradientType=0 ); /* IE6-9 */ } body {background: url('../images/header-bg.png') repeat-x 0 31px transparent;} /* COMMON ANCHORS */ a {color: #16274a;} a:hover {text-decoration: none;} a:active {color: #464646; text-decoration: underline;} a:visited {color: #16274a;} /* SHARED */ .wdthctn {width: 1024px; margin: 0 auto;} .element-invisible {opacity: 0} /* REMOVE */ /*#utahgovheader {display: none;}*/ /* END REMOVE */ #mobileMenu {display: none; width: auto;} #mobileMenu a {display: block; color: #9f9f9f; text-align: center; text-decoration: none; font-size: 1.4rem;} #mobileMenu a i.fa {display: block; font-size: 4rem;} header {height: 210px; width: 100%; position: relative;} header h1 {width: 350px; position: absolute; left: 0; z-index: 99;} header h1 a {display: block; width: 350px; height: 160px; background: url('../images/header-udclogo.png') no-repeat center center transparent; text-indent: 100%; white-space: nowrap; overflow: hidden;} header nav {position: absolute; right: 0;} header .subheader {height: 70px; position: absolute; top: 140px; left: 0; right: 0;} header .subheader .alerts {position: absolute; left: 0;} header .subheader .alerts ul {} header .subheader .alerts ul li {} header .subheader .alerts ul li a {color: #FFF; text-decoration: none; display: block;} header .subheader .alerts ul li > a {font-size: 27px; padding: 22px 0 0 0;} header .subheader .alerts ul li > a:hover {} header .subheader .alerts ul li p a {font-size: 11px; text-align: right;} header .subheader .search {position: absolute; right: 0; padding: 17px 0 0;} header .subheader .search input[type="text"] {background-color: rgba(7, 23, 58, 0.8); color: #FFF; border: 1px solid #10173a; font-size: 16px; font-weight: lighter; padding: 0.6rem; position: absolute; top: 16px; right: 0; width: 310px;} header .subheader .search input[type="search"] {background-color: rgba(7, 23, 58, 0.8); color: #FFF; border: 1px solid #10173a; font-size: 16px; font-weight: lighter; padding: 0.6rem; position: absolute; top: 16px; right: 0; width: 310px;} header .subheader .search button {background: url('../images/search-icon.png') no-repeat center center transparent; border: none; position: absolute; right: 0; font-size: 10px; padding: 7px 0; white-space: nowrap; text-indent: 100%; overflow: hidden; width: 40px; height: 38px;} header .subheader .search input[type="image"] {background: url('../images/search-icon.png') no-repeat center center transparent; border: none; position: absolute; right: 0; font-size: 10px; padding: 0; white-space: nowrap; text-indent: 100%; overflow: hidden; width: 40px; height: 38px;} header .subheader .search button i {color: #afafb0;} /* MAIN NAV */ nav {/*overflow: hidden;*/} nav ul.nav {font-size: 14px;} nav ul.nav > li {float: left; margin-top: 10px; background: url('../images/header-nav-divider.png') no-repeat right 20px transparent;} nav ul.nav > li:first-child {display: none;} nav ul.nav > li > a, nav ul.nav > li span > a {display: block; border-top: 10px solid transparent; height: 80px; padding: 38px 14px 0; text-align: center; width: 80px; line-height: 20px; text-decoration: none; color: #4f4f4f; transition: all .25s ease;} nav ul.nav > li:hover > a, nav ul.nav > li:hover span > a, {border-top: 10px solid #e96a38; background: rgba(255, 255, 255, 0.5);} nav ul div.dropdownContainer {position: absolute; z-index: 9999; background-color: #EEEEEE; /*overflow: hidden;*/ width: 420px; min-height: 370px; box-shadow: 0 10px 20px -6px rgba(0, 0, 0, 0.4); display: none;} nav ul.nav > ul.nav-child {background-color: #FFF; width: 219px; min-height: 370px; border-right: 1px solid #d0d0d0;} nav ul.nav ul.nav-child > li {position: relative; width: 220px;} nav ul.nav ul.nav-child > li.parent {background: url('../images/nav-parent-icon.png') no-repeat right center transparent;} nav ul.nav ul.nav-child > li > a, nav ul.nav ul.nav-child > li span > a {display: block; border-bottom: 1px solid #e4e4e4; padding: 16px 20px; color: #4f4f4f; text-decoration: none;} nav ul.nav ul.nav-child > li > a:hover, nav ul.nav ul.nav-child > li span > a:hover {background-color: #4a90cd; color: #FFF;} nav ul div.dropdownContainer ul div.dropdownContainer {background-color: #E5E5E4; right: auto; min-height: 10px; width: 200px; right: -200px; top: 0; overflow: hidden;} nav ul.nav ul.nav-child li ul.nav-child li a {padding: 16px 0 16px 20px; font-size: 0.9em;} /*hover drop*/ nav ul.nav li:hover > div.dropdownContainer {display: block;} nav ul div.menuimage {overflow: hidden; position: absolute; right: 0; width: 160px; height: 200px; background-position: center center; background-size: cover; background-repeat: no-repeat; border: 20px solid #EEE;} nav ul ul div.menuimage {display: none;} nav ul.nav li.TranslateMenu {} nav ul.nav li.TranslateMenu ul.nav-child {min-height: initial;} nav ul.nav li.TranslateMenu div.dropdownContainer {width: auto; min-height: initial; right: 0;} nav ul.nav li.TranslateMenu li.translateinfo {display: block; border-bottom: 1px solid #e4e4e4; padding: 16px 20px; color: #4f4f4f; text-decoration: none;} nav ul.nav li.item-112 div.dropdownContainer {right: 0;} /* TEMPORARY */ /*nav ul li.item-102 div.dropdownContainer {display: block;}*/ /* HOME */ section.homefeature {overflow: hidden; margin: 40px auto;} section.homefeature div.moduletable {} section.homefeature div.moduletable > h3 {display: none;} section.homefeature div.moduletable > ul {} section.homefeature div.moduletable ul li {} /* homefeedimage */ section.homefeature div.moduletable ul li div.homefeedimage {position: relative; width: 676px; height: 344px; float: left; background-size: cover; background-position: center center;} section.homefeature div.moduletable ul li div.homefeedimage a {position: absolute; top: 0; bottom: 0; right: 0; left: 0;} /* homefeedtext */ section.homefeature div.moduletable ul li div.homefeedtext {position: relative; background-color: #eeeeee; width: 288px; height: 304px; float: right; padding: 20px;} section.homefeature div.moduletable ul li div.homefeedtext a.mod-articles-category-title {font-size: 34px; text-decoration: none; display: block; color: #7E7E7E; margin: 0 0 1rem;} section.homefeature div.moduletable ul li div.homefeedtext span.mod-articles-category-date {color: #7E7E7E; font-size: 12px; margin: 1rem 0;} section.homefeature div.moduletable ul li div.homefeedtext p.mod-articles-category-introtext {color: #2b2b2b; font-size: 14px; margin: 1.4rem 0 1rem; line-height: 20px;} section.homefeature div.moduletable ul li div.homefeedtext a.mod-articles-category-link {display: block; background-color: #363D4A; color: #FFF; text-decoration: none; text-align: center; position: absolute; bottom: 20px; left: 20px; right: 20px; padding: 1em;} /* homeservices */ section.homeservices {margin: 40px auto; position: relative;} section.homeservices span.scroll-left, section.homeservices span.scroll-right {display: block; background-color: transparent; position: absolute; height: 150px; width: 20px; opacity: 0.2; cursor: pointer; background-repeat: no-repeat; background-position: center center; border-radius: 5px;} section.homeservices span.scroll-left:hover, section.homeservices span.scroll-right:hover {background-color: RGBA(74, 144, 205, 0.7);} section.homeservices span.scroll-left {left: 0; background-image: url('../images/featuredmenu/arrow-left.png');} section.homeservices span.scroll-right {right: 0; background-image: url('../images/featuredmenu/arrow-right.png');} section.homeservices span.scroll-left.active, section.homeservices span.scroll-right.active {opacity: 1;} section.homeservices div.slidemenu {overflow: hidden; width: 974px; margin: 0 auto;} section.homeservices ul {margin: 0;} section.homeservices ul li {float: left; margin: 0 7px;} section.homeservices ul li:first-child {margin: 0 10px 0 0;} section.homeservices ul li:last-child {margin: 0 0 0 10px;} section.homeservices ul li a {display: block; width: 110px; height: 100px; border-radius: 12px; text-decoration: none; color: #494949; padding: 40px 20px 10px;} section.homeservices ul li a { background: #fdfdfd; /* Old browsers */ background: -moz-linear-gradient(top, #fdfdfd 0%, #d0cfce 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fdfdfd), color-stop(100%,#d0cfce)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #fdfdfd 0%,#d0cfce 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #fdfdfd 0%,#d0cfce 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #fdfdfd 0%,#d0cfce 100%); /* IE10+ */ background: linear-gradient(to bottom, #fdfdfd 0%,#d0cfce 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fdfdfd', endColorstr='#d0cfce',GradientType=0 ); /* IE6-9 */ } section.homeservices ul li a:hover {background: #f5f5f5;} section.homeservices ul li a img {display: block; margin: 0 auto 10px;} section.homeservices ul li a span {display: block; text-align: center;} /* homemidcontent */ section.homemidcontent {overflow: hidden;} section.homemidcontent > div {height: 320px; background-color: #FFFFFF; padding: 20px; position: relative;} /* directorscorner */ section.homemidcontent div.moduletable.directorscorner {float: left; width: 288px;} section.homemidcontent div.moduletable.directorscorner h3 {background-color: #4a90cd; color: #FFF; padding: 20px; margin: -20px -20px 20px -20px ;} section.homemidcontent div.moduletable.directorscorner div.custom {font-size: 12px; line-height: 16px;} section.homemidcontent div.moduletable.directorscorner div.custom h4 {font-size: 18px;} section.homemidcontent div.moduletable.directorscorner div.custom h5 {font-size: 12px; margin-bottom: 16px;} section.homemidcontent div.moduletable.directorscorner div.custom p {} section.homemidcontent div.moduletable.directorscorner div.custom img {float: left; width: 114px; height: auto; padding: 0 20px 10px 0;} /* latestnews */ section.homemidcontent div.latestnews {float: right; width: 636px;} section.homemidcontent div.latestnews h3 {background-color: #4a90cd; color: #FFF; padding: 20px; margin: -20px -20px 20px -20px;} section.homemidcontent div.latestnews ul.latestnews {} section.homemidcontent div.latestnews ul.latestnews li {overflow: hidden; margin: 1.4rem 0;} section.homemidcontent div.latestnews ul.latestnews li a {font-size: 16px; text-decoration: none; color: #7e7e7e; font-weight: 600;} section.homemidcontent div.latestnews ul.latestnews li a:hover {text-decoration: underline; color: #08173B;} section.homemidcontent div.latestnews ul.latestnews li span.mod-articles-category-date {float: left; display: block; font-size: 24px; font-weight: 600; width: 60px; text-align: center; text-transform: uppercase; background-color: #EEE; color: #aeaeae; padding: 6px; margin-right: 20px;} section.homemidcontent div.latestnews ul.latestnews li p {font-size: 12px; line-height: 16px;} section.homemidcontent div.latestnews ul.latestnews li:hover span.mod-articles-category-date {background-color: #4A90CD; color: #FFF;} /* homesocialfeeds */ section.homesocialfeeds {overflow: hidden; margin: 40px auto;} section.homesocialfeeds > div {height: 380px; background-color: #FFFFFF; float: left; width: 288px; padding: 20px;} section.homesocialfeeds div > h3 {background-color: #4a90cd; color: #FFF; padding: 20px; margin: -20px -20px 20px -20px;} section.homesocialfeeds div.twitterfeed {margin-right: 20px;} section.homesocialfeeds div.twitterfeed p {font-size: 0.8rem; margin: 0.8rem 0 0.2rem;} section.homesocialfeeds div.twitterfeed a {text-decoration: none;} section.homesocialfeeds div.twitterfeed div.date a {font-size: 0.8rem; color: #BEBEBE; padding: 4px 0 0;} section.homesocialfeeds div.youtubefeed {margin-right: 20px;} section.homesocialfeeds div.pinterestfeed {} section.homesocialfeeds div.pinterestfeed > span {box-shadow: none !important; width: 100% !important; padding: 0 !important;} section.homesocialfeeds div.pinterestfeed > span > span:first-child {display: none !important;} section.homesocialfeeds div.pinterestfeed > span > span {width: auto !important;} /* SECONDARY CONTENT */ section.content {width: 1024px; margin: 40px auto; overflow: hidden;} section.content article {background-color: #FFF; width: 636px; padding: 20px; float: left; font-size: 14px; min-height: 500px;} section.content article h2[itemprop="name"] {background-color: #4a90cd; color: #FFF; font-size: 16px; padding: 20px; margin: -20px -20px 0;} section.content article h2[itemprop="name"] a {color: #FFF; text-decoration: none;} section.content article h1 {font-size: 1.6rem; font-weight: 600; margin: 0.6em 0;} section.content article h2 {font-size: 1.4rem; font-weight: 600; margin: 0.6em 0;} section.content article h3 {font-size: 1.2rem; font-weight: 600; margin: 0.6em 0;} section.content article h4 {font-size: 1.1rem; font-weight: 600; margin: 0.6em 0;} section.content article h5 {font-size: 1rem; font-weight: 600; margin: 0.6em 0;} section.content article h6 {font-size: 0.9rem; font-weight: 600; margin: 0.6em 0;} section.content article p {line-height: 18px; margin: 1em 0;} section.content article img {max-width: 100%; height: auto;} section.content article strong {font-weight: bold;} section.content article em {font-style: italic;} section.content article hr {height: 1px; background: #D1D1D1; border: none; clear: both; margin: 1em 0;} /* Tables */ section.content article tr, section.content article th, section.content article td {vertical-align: top;} section.content article table[border="1"] tr {border-left: 1px solid #cecece; border-top: 1px solid #cecece;} section.content article table[border="1"] td, section.content article table[border="1"] th {border-right: 1px solid #cecece; border-bottom: 1px solid #cecece; padding: 2px 4px;} section.content article table th {font-weight: 600; text-align: left; background-color: #4a90cd; color: #FFF;} section.content article table th p {color: #FFF;} /* Lists */ section.content article ol {list-style: decimal; margin: 1em;} section.content article ol[type="A"] {list-style: upper-alpha;} section.content article ol[type="a"] {list-style: lower-alpha;} section.content article ol[type="I"] {list-style: upper-roman;} section.content article ol[type="i"] {list-style: lower-roman;} section.content article ol li {list-style: decimal;} section.content article ul {list-style: disc; margin: 1em;} section.content article ul li {list-style: disc;} section.content article ul.pagenav {display: none;} section.content article ul.actions {float: right;} section.content article ul.actions li {list-style: none; margin: 0;} /* Search and Extra Content */ section.content article div.search {position: relative;} section.content article div.search h1.page-title {background-color: #4a90cd; color: #fff; font-size: 16px; margin: -20px -20px 0; padding: 20px;} section.content article div.search .counter {font-size: 12px; color: #636363;} section.content article div.search .word {position: relative; width: 376px;} section.content article div.search .word input[type="text"] {display: block; width: 280px; box-shadow: 0 1px 4px #D1D1D1 inset; font-size: 1.2em; font-weight: lighter; border: none; padding: 0.4em 0.5em; color: #A6A6A6; margin: 0; float: left;} section.content article div.search .word button {background-color: #9E9E9E; border: 2px solid #9E9E9E; color: #FFFFFF; cursor: pointer; display: block; font-size: 14px; margin: 0; padding: 8px; position: absolute; right:0; } section.content article div.search .word label {display: none;} section.content article div.search .searchintro {line-height: normal;} section.content article div.search .phrases {} section.content article div.search .phrases legend {display: none;} section.content article div.search .phrases .phrases-box {display: none;} section.content article div.search .phrases .ordering-box {background-color: #3A80BD; border-radius: 0.5em; padding: 0.3em 0.6em;position: absolute; top:12px; right: 130px;} section.content article div.search .phrases .ordering-box label {font-size: 0.8em;} section.content article div.search .form-limit {background-color: #3A80BD; border-radius: 0.5em; padding: 0.3em 0.6em; position: absolute; top:12px; right: 0;} section.content article div.search .form-limit label {font-size: 0.8em;} section.content article div.search .only {display: none;} section.content article div.search dl.search-results {} section.content article div.search dl.search-results dt.result-title {margin-top: 2em; font-size: 0.6em; line-height: normal;} section.content article div.search dl.search-results dt.result-title a {font-size: 1.8em;} section.content article div.search dl.search-results dd.result-category {display: none;} section.content article div.search dl.search-results dd.result-text {font-size: 0.86em; border-bottom: 1px solid #DFDFDF; padding-bottom: 0.7em;} section.content article div.search dl.search-results dd.result-created {display: none;} section.content article .display-limit {background-color: #DEDEDE; border-radius: 0.5em 0.5em 0.5em 0.5em; float: right; padding: 0.3em 0.6em;} section.content article .display-limit label {font-size: 0.8em;} section.content article div.pagination {float: right; margin: 1em 0; color: #939393;} section.content article div.pagination ul {overflow: hidden;} section.content article div.pagination ul li {float: left; font-size: 0.8em; margin: 0 0.3em;} section.content article div.pagination .counter {font-size: 11px; text-align: right; color: #636363;} section.content article div.search div.btn-toolbar {overflow: hidden; margin: 1em 0;} section.content article div.search #searchForm button {background: url("../images/search-icon.png") no-repeat scroll center center transparent; border: medium none; font-size: 10px; height: 38px; overflow: hidden; padding: 7px 0; text-indent: 100%; white-space: nowrap; width: 40px;} section.content article div.search #searchForm input#search-searchword {padding: 0.3em; font-size: 1.2em;} section.content article div.search #searchForm span.icon-search {} /* Category List Page */ section.content article div.category-list {} section.content article div.category-list .content-category h1 {background-color: #cc4d2d; color: #fff;font-size: 16px; padding: 20px; margin: -20px -20px 0;} section.content article div.category-list table.category {width: 100%; margin: 10px 0;} section.content article div.category-list table.category thead {} section.content article div.category-list table.category tr {} section.content article div.category-list table.category th {} section.content article div.category-list table.category td {padding: 0 0 10px;} section.content article div.category-list table.category td a {background-color: #e6e6e6; color: #434343; display: block; padding: 16px 20px; text-decoration: none;} /* hidden content */ section.content article .article-info {display: none;} section.content article div.icons {display: none;} /* ASIDE */ section.content aside {background-color: #FFF; width: 288px; padding: 20px; float: right;} section.content aside .moduletable h3 {background-color: #4a90cd; color: #FFF; font-size: 16px; padding: 20px; margin: 0 -20px;} section.content aside .moduletable:first-child > h3 {margin: -20px -20px 0;} section.content aside ul.category-module {margin: 20px 0;} section.content aside ul.category-module li {margin: 0 0 10px 0;} section.content aside ul.category-module li a {display: block; padding: 16px 20px; background-color: #e6e6e6; text-decoration: none; color: #434343;} section.content aside ul.category-module li a:hover {background-color: #08173B; color: #F5F5F5;} /* aside common elements */ section.content aside img {max-width: 100%; height: auto;} section.content aside .custom {} section.content aside .custom ol {list-style: decimal; margin: 1em;} section.content aside .custom ol[type="A"] {list-style: upper-alpha;} section.content aside .custom ol[type="a"] {list-style: lower-alpha;} section.content aside .custom ol[type="I"] {list-style: upper-roman;} section.content aside .custom ol[type="i"] {list-style: lower-roman;} section.content aside .custom ol li {list-style: decimal;} section.content aside .custom ul {list-style: disc; margin: 1em;} section.content aside .custom ul li {list-style: disc;} section.content aside .custom h1 {font-size: 1.6rem; font-weight: 600; margin: 0.6em 0;} section.content aside .custom h2 {font-size: 1.4rem; font-weight: 600; margin: 0.6em 0;} section.content aside .custom h3 {font-size: 1.2rem; font-weight: 600; margin: 0.6em 0;} section.content aside .custom h4 {font-size: 1.1rem; font-weight: 600; margin: 0.6em 0;} section.content aside .custom h5 {font-size: 1rem; font-weight: 600; margin: 0.6em 0;} section.content aside .custom h6 {font-size: 0.9rem; font-weight: 600; margin: 0.6em 0;} section.content aside .custom p {line-height: 18px; margin: 1em 0;} section.content aside .custom strong {font-weight: bold;} section.content aside .custom em {font-style: italic;} section.content aside .custom hr {height: 1px; background: #D1D1D1; border: none; clear: both; margin: 1em 0;} /* FOOTER */ footer { position: relative; min-height: 250px; margin: 100px 0 0 0; border-top: 1px solid #FFF; box-shadow: 0 20px 30px 10px #111; background: #d1d0cf; /* Old browsers */ background: -moz-linear-gradient(top, #d1d0cf 0%, #fdfdfd 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d1d0cf), color-stop(100%,#fdfdfd)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #d1d0cf 0%,#fdfdfd 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #d1d0cf 0%,#fdfdfd 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #d1d0cf 0%,#fdfdfd 100%); /* IE10+ */ background: linear-gradient(to bottom, #d1d0cf 0%,#fdfdfd 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d1d0cf', endColorstr='#fdfdfd',GradientType=0 ); /* IE6-9 */ } footer div.footcontent {min-height: 250px; margin: -40px auto 0; padding: 60px 0 0; width: 1024px; background: url('../images/footer-udclogo.png') no-repeat 0 0 transparent; position: relative;} footer div.footcontent ul.socialmedia {overflow: hidden; margin: 20px 0 20px 200px;} footer div.footcontent ul.socialmedia li {float: left; width: 24.8%; font-size: 14px;} footer div.footcontent ul.socialmedia li a {color: #3f3f3f; text-decoration: none;} footer div.footcontent ul.socialmedia li a i {} footer div.footcontent p.missionstatement {color: #3f3f3f; font-size: 14px; margin: 0 0 0 200px; line-height: 20px;} footer div.footcontent #UtGovFooter {color: #818181;} footer div.footcontent #UtGovFooter a {color: #818181; text-decoration: none; font-size: 12px;} footer div#TopLink {position: absolute; right: 0; bottom: 20px;} footer div#TopLink a {display: block; text-decoration: none; text-align: center; background-color: RGBA(211, 211, 211, 0); padding: 16px; border-radius: 5px; font-size: 12px; color: RGBA(129, 129, 129, 0.3);} footer div#TopLink a i {display: block; font-size: 26px;} footer div#TopLink a:hover {background-color: RGBA(211, 211, 211, 0.3); color: RGBA(129, 129, 129, 0.5);} /* RESPONSIVE */ /* ------ TABLET 768px -------- */ @media handheld, only screen and (max-width: 768px) { /*body {background: none;}*/ header h1 {position: relative; width: 70%;} .wdthctn {width: 100%;} /* Nav */ #mobileMenu {display: block; position: absolute; right: 30px; top: -105px;} header nav {height: auto; left: 0; right: 0; top: 140px; z-index: 98;} nav ul.nav {display: none; background-color: #dfdfdf; overflow: hidden;} nav ul.nav > li {float: none; margin: 0; padding: 0;} nav ul.nav > li > a {border-bottom: 1px solid #bfbfbf; border-top: medium none; font-size: 1.2rem; height: auto; line-height: normal; padding: 16px 2%; text-align: left; width: 100%;} nav ul.nav li.TranslateMenu div.dropdownContainer {display: block !important; width: 100%;} nav ul.nav li.TranslateMenu ul.nav-child {width: auto !important;} header .subheader {height: 140px;} header .subheader .alerts {top: 70px; width: 100%; height: 70px; background: url("../images/header-bg.png") repeat-x scroll 0 -140px transparent;} header .subheader .alerts ul li > a {width: auto; padding: 22px 2% 0; text-align: center;} header .subheader .alerts ul li > p {display: none;} header .subheader .search {height: 40px; left: 0; overflow: hidden; right: 0; top: 0;} header .subheader .search input[type="text"] {width: 92%; right: 2%; left: 2%; padding: 0.6rem 2%;} header .subheader .search button {right: 2%;} nav ul.nav li:hover div.dropdownContainer {display: none;} /* Home Featured */ section.homefeature {margin: 80px auto 40px;} section.homefeature div.moduletable ul li div.homefeedimage {width: 100%; float: none;} section.homefeature div.moduletable ul li div.homefeedtext {width: 96%; float: none; height: 214px; padding: 20px 2%;} section.homeservices span.scroll-left, section.homeservices span.scroll-right {display: none;} section.homeservices div.slidemenu, section.homeservices ul {width: 100% !important;} /* Featured Menu */ section.homeservices ul li:first-child, section.homeservices ul li:last-child {margin: 4px 2%;} section.homeservices ul li {float: none; margin: 4px 2%; overflow: hidden;} section.homeservices ul li a {padding: 10px 2% 10px; width: auto; height: auto;} section.homeservices ul li a span {text-align: left; margin-left: 60px; padding: 10px 0;} section.homeservices ul li a img {float: left;} /* Home Mid */ section.homemidcontent > div {height: auto;} section.homemidcontent div.moduletable.directorscorner, section.homemidcontent div.latestnews {width: 96%; padding:20px 2%; float: none; overflow: hidden;} section.homemidcontent div.latestnews {margin-top: 40px;} /* Home Social */ section.homesocialfeeds > div {height: auto; float: none; padding:20px 2%; width: 96%;} section.homesocialfeeds div.youtubefeed {overflow: hidden;} section.homesocialfeeds div.youtubefeed ul li {width: auto; float: left; margin-right: 1%;} section.homesocialfeeds div.pinterestfeed > span > span {height: auto !important;} /* Secondary */ section.content {margin-top: 90px; width: 100%;} section.content article, section.content aside {padding: 20px 2%; width: 96%;} section.content aside {margin-top: 20px;} /* Footer */ footer div.footcontent {width: 100%;} footer div.footcontent {background-position: center top;} footer div.footcontent p.missionstatement {margin: 130px 2% 20px;} footer div.footcontent ul.socialmedia {margin: 20px 2%;} footer div.footcontent ul.socialmedia li a {font-size: 3rem; text-align: center; display: block;} footer div.footcontent ul.socialmedia li a span {display: none;} } /* ------ 500px -------- */ @media handheld, only screen and (max-width: 500px) { body {background-position: 0 0;} #utahgovheader {display: none;} header .subheader .alerts ul li > a {font-size: 1.3em;} #TopLink {display: none;} } /* ------ 430px -------- */ @media handheld, only screen and (max-width: 430px) { header h1 a {background-size: 100% auto; width: 230px;} } /* ------ 320px -------- */ @media handheld, only screen and (max-width: 320px) { header h1 a {width: 210px;} } /* CUSTOM ADDITIONS */ /* hide the newest article in latest news since it is displayed as the featured article */ .latestnews li:first-child { display: none; }