/* File: custom.css Description: Custom styles for Thesis BASIC USAGE: If you have enabled the custom stylesheet in the Thesis options panel, the tag will be appended with the "custom" class, like so: . You can use the "custom" class to override *any* CSS declarations contained in the style.css file. For example, if you wish to change the default link color to green, you would add the following declarations to this file: .custom a, .custom a:visited { color: #090; } <--- This makes links green .custom a:hover { color: #00f; } <--- This makes links blue when you mouse over them WHY THIS WORKS: By using the "custom" class, you are creating more specific CSS declarations for HTML elements. CSS styling is applied through rules of specificity, and because declarations prepended with .custom are more specific, they get applied when the page is rendered! More information about styling your Thesis installation using this file can be found in the User's Guide: http://diythemes.com/thesis/rtfm/customizing-thesis-with-customcss/ */ /* File: custom.css Description: Custom styles for the Thesis Theme that you define */ /*---:[ clear ]:---*/ :link, :visited { text-decoration: none; } ul, ol { list-style: none; } h1, h2, h3, h4, h5, h6, pre, code, p { font-size: 1em; } ul, ol, dl, li, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, body, html, p, blockquote, fieldset, input { margin: 0; padding: 0; } a img,:link img,:visited img { border: none; } :focus { outline: 0; } address { font-style: normal; } /*---:[ body ]:---*/ body { background: #292929 url(../custom/images/images/body-background.jpg) repeat left top; min-width: 960px; } /*---:[ header ]:---*/ .custom #header_area { padding-top: 0em; background-color: transparent;} .custom #header { border-width: 0px; background-color: transparent; background: url(../custom/images/images/wrap-glow.jpg) no-repeat center top; } /*---:[ logo ]:---*/ .custom #logo { height:43px; top:0; width:333px; } .custom #logo a { background:transparent url(http://www.thecatholictraveler.com/images/logo2.png) no-repeat scroll 0 0; display:block; height:43px; text-indent:-9999px; width:333px; } .custom #logo a:hover { padding-top: 7px; } /*---:[ menu ]:---*/ .custom .menu { background-color: transparent; border-color: #FBFCFA; margin-left: 20px; margin-bottom: 10px; margin-right: 20px; margin-top: 10px; float: left; width: 600px; } .custom .menu a { border-color: #FBFCFA; background-color: transparent; color: #EBECEE; } .custom .menu a:hover { background-color: transparent; color: #FF6600; } .custom .menu li ul { border-color: #FBFCFA; } .custom .menu ul .current-cat a { background-color: #666666; border-bottom-color: #FBFCFA; } .custom .menu .current a { border-bottom-color: white; color: #EBECEE; background-color: transparent;} .custom .menu .current a:hover { color: #EBECEE; background-color: transparent; } .custom .menu .current-cat a { border-bottom-color: white; color: #EBECEE; background-color: transparent; } .custom .menu .current-cat a:hover { color: #EBECEE; } .custom .menu .current-cat ul a { background-color: #666666; color: #EBECEE; border-bottom-color: #FBFCFA; } .custom .menu .current-cat ul a:hover { color: #EBECEE; border-bottom-color: #FBFCFA; } .custom .menu ul a { width: 250px; border-right-width: 1px; border-left-width: 1px; border-left-style: solid; border-bottom-style: solid; border-right-style: solid; border-top-style: none; border-color: #999999; border-bottom-width: 1px; background-color: #666666; } .custom .menu ul a:hover { width: 250px; border-right-width: 1px; border-left-width: 1px; border-left-style: solid; border-bottom-style: solid; border-right-style: solid; border-top-style: none; border-color: #999999; border-bottom-width: 1px; background-color: #666666; } .custom .menu ul .current a { color: #FF6600; border-left-style: solid; border-bottom-style: solid; border-right-style: solid; border-top-style: none; border-left-width: 1px; border-bottom-width: 1px; border-right-width: 1px; border-top-width: 0px; border-color: #999999; background-color: #4c4c4c; } .custom .menu ul .current a:hover { color: #FF6600; border-left-style: solid; border-bottom-style: solid; border-right-style: solid; border-top-style: none; border-left-width: 1px; border-bottom-width: 1px; border-right-width: 1px; border-top-width: 0px; border-color: #999999; background-color: #4c4c4c; } .custom .menu .current ul a { background-color: #666666; color: #EBECEE; border-bottom-color: #FBFCFA; } .custom .menu .current ul a:hover { background-color: #666666; color: #FF6600; } .custom .menu .current-cat ul a:hover { color: #FF6600; } .custom .menu .current-parent a:hover { background-color: transparent; color: #ff6600; } .custom .menu .current-parent ul a:hover { background-color: #666666; color: #FF6600; } .custom .menu .current-parent > a, .custom .menu .current-cat-parent > a { color: #EBECEE; background-color: transparent; } /*---:[ content ]:---*/ #main-top { margin-right: auto; margin-left: auto; width: 962px; height: 54px; background: url(../custom/images/images/main-top-2.png) no-repeat center top; } .subscribe { float: right; width: 262px; margin: 12px 20px 10px 20px; } .subscribe h5 { padding-left: 10px; padding-bottom: 0; padding-right: 15px; padding-top: 5px; float: left; font-weight: bold; font-size: 1em; color: #c1c1c1; text-shadow: 0 1px 0 #000; } #main-top .rss-feed a:hover { color: #fff; } .subscribe ul { float: right;} .subscribe ul li { float: left; margin-left: 15px; } .subscribe li a:link, .subscribe li a:visited { opacity: .8; } .subscribe li a:hover { opacity: 1; } .subscribe li a:active { opacity: .8; } .custom #content_box { width: 960px; margin: 0px; padding: 0px; background: 0;} .custom .full_width .page { background-position: center top; background-image: url(../custom/images/images/main-body.png); background-repeat: repeat-y; width: 962px; margin: 0 auto; padding-right: 0em; padding-left: 0em; } .custom #content { width: 650px; padding-left: 1em; float: left; } .custom .teasers_box { width: 600px; } .custom .teaser { width: 275px; } .custom #sidebar { float: left; padding-right: 0px; padding-left: 0px; right: auto; left: auto; padding-bottom: 0; padding-top: 0;} #main-bottom { margin-left: -0.1em; height: 15px; background-color: transparent; background: url(../custom/images/images/main-bottom.png) no-repeat center top; } /*---:[ h's ]:---*/ .custom h1 { padding-top: 20px; color: #666666; font-weight: bold; text-shadow: 0px 1px 0px white; margin: 0 0 15px 0; font-size: 2.2em; } .custom h2 { margin-left: 0; margin-bottom: 7px; margin-right: 0; margin-top: 0; padding-top: 7px; border-bottom-color: #cccccc; border-bottom-style: solid; border-left-width: 0px; border-bottom-width: 1px; border-right-width: 0px; border-top-width: 0px; font-family: Helvetica, Verdana, Arial, sans-serif; text-align: left; font-size: 2em; color: #999999; font-weight:normal; text-shadow: 1px 1px 1px white; } .custom h3 { padding-top: 7px; padding-bottom: 3px; font-family: Helvetica, Verdana, Arial, sans-serif; text-align: left; font-size:16px; color: #fbfcfa; font-weight:normal; margin:0; text-shadow: 1px 1px 1px #4c4c4c; } .custom h4 { float: left; padding: 16px 0 0 20px; font-size: 1.4em; line-height: 1; font-weight: bold; color: #dbdbdb; text-shadow: 0 1px 0 #000; } .custom h5 { } .custom h6 { font-family: Helvetica, Verdana, Arial, sans-serif; font-size:12px; color:#111111; font-weight:normal; margin:0; text-shadow:1px 1px 1px #FFFFFF; } /*---:[ multimedia box ]:---*/ .custom .image_box { margin-right: auto; margin-left: auto; background-color: #f1f3f6; } .custom .image_box, .custom_box { border-width: 0px; border-style: none; } .custom #image_box img { padding: 2px; } .custom #multimedia_box { margin-bottom: 0em; } /*---:[ post ]:---*/ .custom .post_box { margin-left: 1em; margin-bottom: 2em; margin-right: 2em; margin-top: 2em; background-color: #f5f5f5; padding-left: 2em; padding-bottom: 1em; padding-right: 2em; padding-top: 1em; border-color: #cccccc; border-style: solid; border-width: 1px; } /*---:[ trips ]:---*/ .trips li { margin-right: auto; margin-left: auto; width: 242px; list-style-type: none; } .trips li.alt { clear: both; } .trips li a { padding-left: 7px; padding-bottom: 7px; padding-right: 7px; padding-top: 7px; color: gray; text-decoration: none; text-align: center; margin-bottom: 13px; margin-right: auto; margin-left: auto; background-color: #fdf7bc; position: relative; display: block; border: 1px solid #bbbbbb; } .trips li a:hover, .trips li a:focus { color: #666666; border-color: #969696; text-decoration: none; } /*---:[ active trips ]:---*/ .active_trips li { margin-right: auto; margin-left: auto; width: 242px; list-style-type: none; } .active_trips li.alt { clear: both; } .active_trips li a { padding-left: 7px; padding-bottom: 7px; padding-right: 7px; padding-top: 7px; color: gray; text-decoration: none; text-align: center; margin-bottom: 13px; margin-right: auto; margin-left: auto; background-color: #c7fda8; position: relative; display: block; border: 1px solid #bbbbbb; } .active_trips li a:hover, .active_trips li a:focus { color: #666666; border-color: #969696; text-decoration: none; } /*---:[ widget ]:---*/ .custom .widget { margin-top: 0px; background-color: #f8f8f8; border:1px solid #999999; margin-left: auto; margin-bottom: 13px; margin-right: auto; } .custom .widget img { margin-right: 0.5em; margin-left: 0.5em; margin-bottom: 1em; padding: 4px; border: 1px solid #bbbbbb !important; } .custom .widget h3 { background:#666666 scroll 0; border-bottom:1px solid #666666; font-size: 1em; margin:0 0 15px; padding:14px; } .custom .widget ul, .widget p { border-style: none; margin:14px; } .custom .widget ul { border-top:1px solid #EEEEEE; clear:both; } .custom .widget ul ul li { list-style-image:none; list-style-position:outside; list-style-type:circle; } .custom .widget ul li a { border-bottom:1px solid #EEEEEE; color: #666666; display:block; line-height: 30px; text-decoration:none; } .custom .widget ul li a:hover { text-decoration: underline; color: #ff6600; } .custom .widget ul ul { border-top:medium none; margin:0 14px; padding-left:5px; } .custom .widget ul ul a { font-size:11px; } .custom #searchform { margin:15px 0 0; padding:0 10px 10px; } .custom .widget input#s, .widget input.field { margin-left: auto; margin-bottom: auto; margin-right: auto; margin-top: auto; padding-left: 5px; padding-bottom: 6px; padding-right: 5px; padding-top: 6px; border:1px solid #898989; } .custom .widget input.submit, .widget input#searchsubmit { background-color:#486083; border:1px solid #486083; color:#FFFFFF; padding:5px; } .custom .widget .screen-reader-text { display:none; } .custom .widget select.postform { margin:0 14px 14px; width:180px; } /*---:[ twitter ]:---*/ .widget_recent_comments li, #woo-twitter li { padding: 6px 0; line-height: 18px; border-bottom: 1px solid #eee; list-style-image:none; } .widget_recent_comments li a, #woo-twitter a { display: inline; padding: 0; line-height: 18px!important; background: none!important; border: none!important; } #twitter span { background: url(images/twitter_bird.png) no-repeat left center !important; padding-left: 48px; } #woo-twitter a { color: #ff6600; } .follow { padding: 0 14px 14px 14px; } /*---:[ flickr ]:---*/ .flickr h3 span.ico { background:transparent url(images/flickr.png) no-repeat scroll left center !important; padding-left:43px; } .flickr h3 span.blue { color:#0061D8; } .flickr h3 span.blue span { color:#FF1183; } /*---:[ alert ]:---*/ .alert { margin-right: auto; margin-left: auto; width: 500px; list-style-type: none; padding-left: 7px; padding-bottom: 7px; padding-right: 7px; padding-top: 7px; color: gray; text-decoration: none; text-align: justify; margin-bottom: 13px; margin-right: auto; margin-left: auto; background-color: #fdf7bc; position: relative; display: block; border: 1px solid #bbbbbb; } .alert a { padding: 0px; margin: 0px; text-decoration: underline; color: gray; } .alert a:hover, .alert a:focus { color: gray; text-decoration: none; } /*---:[ lists ]:---*/ dl { } dt { margin: 0px; padding: 0px; } dd { margin-left: 23px; margin-bottom: 0px; margin-right: 0px; margin-top: 0px; padding: 0px; } dd img { } /*---:[ footer ]:---*/ .custom #footer_area { background: #292929 url(../custom/images/images/body-background.jpg) repeat left top; min-width: 850px; } .custom #footer { background: #292929 url(../custom/images/images/body-background.jpg) repeat left top; min-width: 850px; } /*Feature Box ------------------------------------------------------------ */ .custom #feature_box { padding-left: 0px; padding-bottom: 30px; padding-right: 0px; padding-top: 30px; background: #292929 url(../custom/images/images/body-background.jpg) repeat left top; } div#feature { height: 400px; background: url(../custom/images/images/feature-body.png) repeat-y top center; } div.feature-top { display: block; height: 20px; background: url(../custom/images/images/feature-top.png) no-repeat top center; } div.feature-bottom { display: block; height: 20px; margin-bottom: 30px; background: url(../custom/images/images/feature-bottom.png) no-repeat top center; } div.feature-main { float: left; font-size: 1.3em; padding: 0 20px; width: 618px; } div.feature-main .container { width: 618px; overflow: hidden; position: relative; } div.feature-main .slides { position: absolute; top: 0; left: 0; } div.feature-main .slides div { position: absolute; top: 0; width: 618px; display: none; } div.feature-main div.slide p { margin-top: 10px; text-shadow: 0 1px 0 #fbfbfb; } img.feature-photo { padding: 7px; background: #fff; border: 1px solid #aaa; } div.feature-main h3 { margin: 10px 0 0 0; } div.feature-main h3 a:link, div.feature-main h3 a:visited { font-size: 1.6em; color: #444; text-shadow: 0 1px 0 #fff; } div.feature-main h3 a:hover { color: #ff6600; } div.feature-main a:link.more-link, div.feature-main a:visited.more-link { float: right; display: block; margin-top: 20px; padding: 4px 20px; font-weight: bold; color: #444; text-shadow: 0 1px 0 #fff; background: #eef0f2 url(../custom/images/images/feature-li-bg.png) repeat-x bottom left; border: 1px solid #aaa; -moz-border-radius: 16px; -webkit-border-radius: 16px; } div.feature-main a:hover.more-link { border: 1px solid #c9c9c9; background: #f3f5f7 url(../custom/images/images/feature-li-bg-hover.png) repeat-x bottom left; } /*Feature Sidebar ---------------------------------------*/ div.feature-sidebar { float: right; width: 258px; padding: 5px 24px 15px 20px; } div.feature-sidebar h2 { border-style: none; border-width: 0px; font-size: 1.4em; height: 50px; margin: 10px -36px 5px 0; background: url(../custom/images/images/feature-h2-bg.png) no-repeat top left; color: #f3f4f6; padding: 10px 0 0 16px; text-shadow: 0 1px 0 #111; } div.feature-sidebar ul { margin: 0 0 10px 0; } div.feature-sidebar ul li { margin: 0 0 15px 0; } div.feature-sidebar ul li a { height: 50px; display: block; padding: 12px 15px; font-size: 1.2em; line-height: 1em; border: 1px solid #bfbfbf; background: #ebedf0 url(../custom/images/images/feature-li-bg.png) repeat-x bottom left; -moz-border-radius: 5px; -webkit-border-radius: 5px; } div.feature-sidebar ul li a:hover { border: 1px solid #d1d1d1; background: #f5f7fa url(../custom/images/images/feature-li-bg-hover.png) repeat-x bottom left; } div.feature-main a:active.more-link, div.feature-sidebar ul li.active a, div.feature-sidebar ul li.active a:hover, div.feature-sidebar ul li a:hover:active { border: 1px solid #ccc; border-top: 1px solid #777; border-bottom: 1px solid #dedede; background: #d4d7d9 url(../custom/images/images/feature-li-bg-active.png) repeat-x top left; } div.feature-sidebar ul li.active a { cursor: default; } div.feature-sidebar ul li a img { float: left; display: block; margin: 0 15px 0 0; padding: 3px; background: #fff; border-bottom: 1px solid #aaa; } div.feature-sidebar ul li a:hover img, a:hover img.index-post-thm { -moz-transform: rotate(-4deg); -webkit-transform: rotate(-4deg); } div.feature-sidebar ul li.active a:hover img { -moz-transform: none; -webkit-transform: none; } div.feature-sidebar ul li a strong { display: block; width: 175px; float: right; color: #444; text-shadow: 0 1px 0 #fff; font-size: 1.1em; line-height: 1.3em; margin: 3px 0; } div.feature-sidebar ul li.active a strong { text-shadow: 0 1px 0 #f3f3f3; } div.feature-sidebar ul li a span { display: block; float: right; width: 175px; color: #666; } /*Slider Arrows ----------------------*/ #slider-arrows { margin: 0 auto; width: 64px; } .slider-nav-left { float: left; } .slider-nav-right { float: right; } .slider-nav-left a, .slider-nav-right a { width: 32px; height: 27px; } .slider-nav-left a:hover:active, .slider-nav-right a:hover:active { opacity: .6; }