/* Theme Name:Appstract Theme URI:http://www.cpothemes.com Description:An organized, panel-based theme with a focus on images and visual works. Appstract features a completely liquid layout, being able to fit any device with ease and including multiple template to choose from. Its panel layout allows yo to create a thriving homepage, providing lots of content couple with a finely crafted design. Author:CPOThemes Author URI:http://www.cpothemes.com Version:1.0.1 License:GNU General Public License 2.0 License URI:license.txt */ /* INDEX 0. CSS RESET Resets all styles for consistency and browser compatibility. Courtesy of Eric Meyer at http://meyerweb.com/eric/tools/css/reset/index.html. 1. GENERAL ELEMENTS Styles basic elements such as headings or hyperlinks, affecting the overall site but not its layout. 2. LAYOUT Defines the structure and design of the site. All styles that displace elements go here. Special layout elements such as breadcrums or page-specific stuff also goes here. 3. NAVIGATION Defines the styles for menus and cross-post navigation. Any specific element related to site traversing goes here. 4. POSTS Styles the appearance of posts and overall content, as well as typography. Must be in line with editor-style.css, so that both styles match. 5. COMMENTS Sets the appearance of the comment system, structuring both entries and posting forms. 6. WIDGETS Establishes the layout of widgets. Whereas the layout section affects the site in general, this section determines widget appearance for both their layout and contents. 7. MOBILE & OTHER Any other elements, such as expanded functions or plugins, go here. This includes special forms or templates. */ /* -------------------------------------------------------------- 0. CSS RESET -------------------------------------------------------------- */ 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, font, 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 { background:transparent; border:0; margin:0; padding:0; vertical-align:baseline; } body { line-height:1; } h1, h2, h3, h4, h5, h6 { font-weight:normal; } ol, ul, li { list-style:none; } blockquote { quotes:none; } blockquote:before, blockquote:after { content:''; content:none; } del { text-decoration:line-through; } table { border-collapse:collapse; border-spacing:0; } a img { border:none; } /* -------------------------------------------------------------- 1. GENERAL ELEMENTS -------------------------------------------------------------- */ /* BODY */ body { font-family:Arial, Helvetica, sans-serif; background:#fff; color:#666; font-size:14px; line-height:1.7em; } /* HEADINGS */ h1, h2, h3, h4, h5, h6 { font-family:Verdada, Arial, Helvetica, sans-serif; color:#555; line-height:1.1em; margin:0 0 10px; } h1 { font-size:36px; } h2 { font-size:22px; } h3 { font-size:18px; } h4 { font-size:16px; } h5 { font-size:15px; } h6 { font-size:14px; } /* HYPERLINKS */ a:link, a:visited { color:#e86031; text-decoration:none; } a:hover { color:#F88051; text-decoration:underline; } /* GENERAL TYPOGRAPHY */ p, address { margin-bottom:1.6em; } span, div, p, dl, td, th, ul, ol, blockquote { } /* LISTS */ ul li { list-style:circle; margin:0 0 5px 20px; list-style-position:inside; } ol li { list-style:decimal; margin:0 0 5px 20px; list-style-position:inside; } ol ol li { list-style:upper-alpha; } ol ol ol li { list-style:lower-roman; } ol ol ol ol li { list-style:lower-alpha; } ul ul, ol ol, ul ol, ol ul { margin-bottom:0; } ul, ol, dd, pre, hr { margin-bottom:24px; } ul ul, ol ol, ul ol, ol ul { margin-bottom:0; } dl { margin:0 0 24px 0; } dt { font-weight:bold; } dd { margin-bottom:18px; } strong, b { font-weight:bold; } cite, em, i { border:none; font-style:italic; } big { font-size:131.25%; } ins { background:#ffc; border:none; } del { text-decoration:line-through; } /* ADDRESSES */ address { font-size:0.9em; line-height:1.2em; } /* CITATIONS */ blockquote { display:block; font-style:italic; padding:0 5%; margin:25px 0; } blockquote cite, blockquote em, blockquote i { font-style:normal; } /* PREDEFINED TEXT */ pre { font-family:Courier, monospace; background:#f5f5f5; border:1px solid #ccc; color:#222; line-height:18px; margin-bottom:18px; padding:1.5em; display:block; overflow:auto; margin:25px 0; } abbr, acronym { border-bottom:1px dotted #666; cursor:help; } ins { text-decoration:none; } sup, sub { font-size:0.7em; height:0; line-height:1; position:relative; vertical-align:baseline; } sup { bottom:1ex; } sub { top:.5ex; } pre, kbd, tt, var { line-height:21px; } code { font-size:13px; } /* CODE */ code, code var { font-family:Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; } /* TABLES */ table { border:1px solid #bbb; border-collapse:collapse; border-spacing:0; margin:0 0 24px; text-align:left; width:100%; } tr th, thead th { border:none; color:#888; font-weight:bold; line-height:1.2em; padding:9px 24px; } tr td { border:none; padding:6px 24px; } tr th, thead th, tr th, thead th { background:#ddd; } /* FORM FIELDS */ input, textarea { font-size:1em; } /* HEADING LINE */ hr { background-color:#fff; border:0; border-top:1px solid #bbb; border-bottom:1px solid #fff; clear:both; height:0; margin:40px 0; } /* INLINE IMAGES */ img { margin:0; max-width:100%; line-height:0em; } img.size-auto, img.size-large, img.size-full, img.size-medium { max-width:100%; height:auto; } .alignleft, img.alignleft { display:inline; float:left; margin-right:24px; margin-top:4px; } .alignright, img.alignright { display:inline; float:right; margin-left:24px; margin-top:4px; } .aligncenter, img.aligncenter { clear:both; display:block; margin-left:auto; margin-right:auto; } img.alignleft, img.alignright, img.aligncenter { margin-bottom:12px; } /* IMAGE CAPTIONS */ .wp-caption { margin-bottom:20px; padding:5px 0; max-width:100%; text-align:center; background:url(images/bg_shade_light.png); line-height:0em; } .wp-caption .wp-caption-text{ } .wp-caption img { margin:0; padding:0; max-width:100%; line-height:0em; } .wp-caption p { margin:10px 0 10px; color:#666; line-height:1.2em; font-size:12px; } .wp-smiley { margin:0; } /* The basic styling ends here. Rendered styles ahead. */ /* FORMS */ input[type=text], textarea { font-family:Arial, Helvetica, sans-serif; border:1px solid #bbb; padding:8px; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; } /* BUTTONS */ .button, .button:visited { display:inline-block; background:url(images/bg_button.png) repeat-x #eee center bottom; width:auto; border:1px solid #bbb; margin:5px 0; border-bottom:1px solid #aaa; padding:12px 15px; color:#444; text-shadow:0 1px 0 #f2f2f2; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; font-weight:bold; cursor:pointer; } .button:link { color:#444; } .button:hover { background:#eee; text-decoration:none; } .button:active { border-top:1px solid #aaa; } .button_small { font-size:12px; padding:5px 10px; margin:5px 0; } .button_medium { font-size:16px; padding:15px 20px; margin:5px 0; } .button_large { font-size:20px; padding:20px 30px; margin:10px 0; } /* Button Colors */ .button_red, .button_red:visited { background-color:#F76; text-shadow:0 1px 0 #fA8; border-color:#A43; } .button_blue, .button_blue:visited { background-color:#7dbdff; text-shadow:0 1px 0 #9DF; border-color:#48B; } .button_green, .button_green:visited { background-color:#93ed7e; text-shadow:0 1px 0 #BF9; border-color:#694; } .button_teal, .button_teal:visited { background-color:#6bd5d4; text-shadow:0 1px 0 #7EE; border-color:#499; } .button_purple, .button_purple:visited { background-color:#c792f4; text-shadow:0 1px 0 #DAF; border-color:#86B; } .button_pink, .button_pink:visited { background-color:#eb9ce1; text-shadow:0 1px 0 #FBF; border-color:#A6A; } .button_orange, .button_orange:visited { background-color:#f0b371; text-shadow:0 1px 0 #FC8; border-color:#A84; } .button_yellow, .button_yellow:visited { background-color:#ebe47b; text-shadow:0 1px 0 #FF9; border-color:#AA6; } .button_gray, .button_gray:visited { background-color:#ccc; text-shadow:0 1px 0 #ddd; border-color:#777; } .button_black, .button_black:visited { background-color:#666; text-shadow:0 -1px 0 #000; color:#fff; border-color:#333; } .button_white, .button_white:visited { background-color:#fff; text-shadow:0 1px 0 #fff; border-color:#BBB; } /* MESSAGE BOXES */ .message_box { display:block; background:#f9f9f9; font-size:12px; font-weight:bold; margin:20px 0; padding:15px 20px; border:1px solid #BBB; color:#666; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; } .message_ok { background:#d9f5ce; color:#060; border:1px solid #6dcd72; } .message_error { background:#ffdec9; color:#600; border:1px solid #d8986e; } .message_warn { background:#fff9d8; color:#960; border:1px solid #cdb676; } .message_info { background:#d6e8fd; color:#006; border:1px solid #8ea0e5; } .column { display:block; float:left; overflow:hidden; } .col2 { width:47%; margin-right:6%; } .col2_last { width:47%; } .col3 { width:29%; margin-right:6%; } .col3x2 { width:67%; } .col3_last { width:30%; } .col4 { width:20%; margin-right:6%; } .col4x3 { width:74%; } .col4_last { width:22%; } .col5 { width:15%; margin-right:6%; } .col5x3 { width:57%; } .col5_last { width:16%; } .col_content { display:block; padding:0 60px 0 0; } .col_divide { display:block; clear:both; width:100%; } /* ACCORDIONS */ .accordion { clear:both; background:url(images/bg_shade_light.png); border:1px solid #ddd; margin-bottom:15px; } .accordion_title { padding:10px; margin:0; cursor:pointer; } .accordion_content { background:url(images/bg_shade_lighter.png); padding:10px; } /* TABBED CONTENT */ .tabs {} .tabs .tab_title { display:block; float:left; background:url(images/bg_shade_light.png); padding:5px 10px; } .tabs .tab_content { clear:both; background:url(images/bg_shade_lighter.png); padding:10px; } /* SEPARATORS */ .pageseparator { overflow:hidden; position:relative; clear:both; width:100%; height:30px; margin:20px 0; } .pageseparator .line { position:absolute; border-top:1px solid #bbb; top:50%; width:100%; } .pageseparator .top { position:absolute; right:0px; background:url(images/top.gif) no-repeat #666 center; height:24px; width:24px; border:3px solid #ddd; border-radius:2px; } .pageseparator .top:hover { background:url(images/top.gif) no-repeat #777 center; } /* -------------------------------------------------------------- 2. LAYOUT -------------------------------------------------------------- */ /* WRAPPERS */ .wrapper { overflow:hidden; } /* SITE STRUCTURE */ #topmenu { overflow:hidden; padding:0 20px; background:#222; } #header { background:#e86031; padding:0 0px; } #menu { float:right; padding:0 15px 0 0; } #social { float:right; text-align:right; margin:0; padding:15px 15px 0 0; width:auto; } #submenu { float:left; width:30%; } #slider { background:#222; padding:0px; position:relative; text-align:center; border-bottom:20px solid #e86031; -moz-transition:0.3s all; -webkit-transition:0.3s all; transition:0.3s all; } #features { padding:20px 20px 0; } #breadcrumb { margin:15px 0; border-bottom:1px dashed #ddd; display:none; } #main { overflow:hidden; padding:20px; } #content { float:left; width:65%; margin-right:5%; } #homemenu { text-align:center; } #showcase { clear:both; padding:0; } #sidebar { float:left; width:30%; } #footersidebar { overflow:hidden; background:#333; color:#999; padding:20px 20px 0; text-shadow:0px 1px 0px #000; } #footermenu { float:right; overflow:hidden; margin:0 auto 0px; } #footer { background:#222; color:#999; overflow:hidden; padding:20px; clear:both; font-size:12px; } .clear { clear:both; width:100%; height:0; margin:0; padding:0; } /* CONTENT LAYOUT VARIATIONS */ #content.right { float:right; margin:0 0 0 5%; } #content.wide { float:none; padding:0; margin:0; width:auto; } /* HEADER */ #header .logo { float:left; padding:0 20px; } #header .logo a { display:block; line-height:1em; } #header .title { display:block; font-family:'Imprima', Verdada, Arial, Helvetica, sans-serif; color:#fff; font-size:42px; line-height:1em; margin-bottom:5px; text-shadow:0 -1px 0 #000; } #header .title a { color:#fff; display:inline; } #header .title a:hover { text-decoration:none; } #header .logo .description { display:none; text-transform:capitalize; letter-spacing:2px; } #header .hidden { display:none; } #header .subheader { float:right; text-align:right; } #header .subheader .contact { font-size:16px; } #header #searchform { float:right; } #header #searchform label { display:none; } #header #searchform input[type=text] { display:none; float:left; font-size:12px; width:188px; padding:5px; margin:0 10px 0 0; height:18px; border:none; border-radius:2px; } #header #searchform input[type=text]:focus{ border:1px solid #525d9b; } #header #searchform input[type=submit] { display:block; background:url(images/icon_search_large.png) no-repeat center; border:none; border-radius:2px; width:32px; height:32px; padding:0; padding:25px; cursor:pointer; color:transparent; } #header #searchform input[type=submit]:hover { background-color:#aaa; } /* SOCIAL ICONS */ #social a { margin:0 0 0 5px; } /* BREADCRUMBS */ #breadcrumb a { padding:10px 15px; border-right:1px solid #ddd; } #breadcrumb a:first-child { } #breadcrumb a:hover { } #breadcrumb span { font-size:12px; display:inline-block; padding:10px 15px; } /* TAGLINES */ .tagline { clear:both; overflow:hidden; background:url(images/bg_shade_light.png); margin:0px auto; padding:20px 20px 10px; border-bottom:1px solid #bbb; } /* HOMEPAGE SLIDES */ #slider ul { display:block; overflow:hidden; padding:5px; margin:0; } #slider ul:hover li { opacity:0.5; } #slider ul li { overflow:hidden; float:left; width:33.333333%; position:relative; list-style:none; margin:0; padding:0; border:5px solid #222; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; -moz-transition:0.3s all; -webkit-transition:0.3s all; transition:0.3s all; } #slider ul li > a { display:block; line-height:0; margin:0; padding:0; } #slider ul li img { display:block; width:100%; height:auto; line-height:0; margin:0; padding:0; } #slider ul li .textbox { overflow:hidden; position:absolute; background:url(images/bg_slider_textbox_dark.png); line-height:1.7em; color:#eee; padding:50px 10px 10px; bottom:0; left:0; right:0; text-align:left; } #slider ul li .textbox_right { float:right; text-align:right; } #slider ul li .textbox .title { color:#fff; line-height:1.1em; text-shadow:0 -1px 0 #444; font-size:20px; margin:0; } #slider ul li .textbox p { margin-bottom:0; font-size:12px; } #slider ul li .textbox a:link, #slider ul li .textbox a:visited { color:#fff; } #slider ul li .textbox a:hover { color:#fff; text-decoration:underline; } #slider ul li:hover { opacity:1; } #slider .separator { clear:both; width:100px; } #slider .separator_two { display:none; } #slider .prev, #slider .next { display:inline-block; margin:0 auto; opacity:0.8; z-index:99999; width:30px; height:26px; margin:0; cursor:pointer; -moz-transition:0.3s all; -webkit-transition:0.3s all; transition:0.3s all; } #slider:hover .prev, #slider:hover .next { } #slider .prev:hover, #slider .next:hover { opacity:1; } #slider .prev { background: url(images/arrow_left.png) no-repeat center; } #slider .next { background: url(images/arrow_right.png) no-repeat center; } #slider .pages { vertical-align:top; display:inline-block; z-index:999; margin:0 auto; height:26px; } #slider .pages a { display:inline-block; overflow:hidden; background:#999; color:#999; margin:0 3px; width:16px; height:16px; -moz-border-radius:20px; -webkit-border-radius:20px; border:5px solid #ddd; border-radius:50px; -moz-transition:0.4s all; -webkit-transition:0.4s all; transition:0.4s all; } #slider .pages a:hover { text-decoration:none; } #slider .pages .activeSlide { background:#777; color:#777; border-radius:3px; } /* HOMEPAGE FEATURES */ #features .feature { float:left; width:22%; margin:0 3% 30px 0; } #features .feature_right { margin-right:0; } #features .feature_second { } #features .feature img { display:block; float:left; width:25%; height:auto; margin-right:5%; line-height:0; } #features .feature .title { } #features .feature .content { margin-left:30%; } #features .feature .content p { margin:0; } #features .separator { clear:both; padding:10px 0; width:100%; } /* TESTIMONIALS */ #testimonials { display:block; overflow:hidden; margin:0; padding:0; height:55px; } #testimonials .testimonial { display:block; padding:0; margin:0; list-style:none; } #testimonials .testimonial img { display:block; float:right; line-height:0; padding:0; margin:0 0 0 30px; width:50px; height:auto; list-style:none; border-radius:50%; box-shadow:0 1px 2px 0 #444; } #testimonials .testimonial .content { background:url(images/icon_testimonial.png) no-repeat; margin-right:350px; font-size:16px; text-shadow:0 1px 0 #444; border-radius:3px; } #testimonials .testimonial .content p { padding-left:50px; margin-bottom:0; } #testimonials .testimonial .byline { float:right; width:220px; text-align:right; color:#fff; } #testimonials .testimonial .byline .author { font-weight:bold; } /* FOOTER */ #footer a { color:#fff; } /* WIDGET LAYOUT */ #sidebar .widget { list-style:none; overflow:hidden; margin:0; } #sidebar .widget .title { margin:0 0 20px; } #sidebar .widget li { list-style:none; margin:0 0 30px; overflow:hidden; } #sidebar .widget li:first-child { border-top:0; } #sidebar .widget li:last-child { border-bottom:0; } #sidebar .widget li a { } #sidebar .widget ul { margin:0; } #sidebar .widget ul li { background:url(images/bg_list.gif) no-repeat left 7px; padding:0px 0 10px 20px; margin:0; border:none; } #sidebar .widget ul ul { margin-left:1.3em; margin-bottom:5px; } #sidebar .widget ul ul ul { margin-bottom:0; } /* WIDGET LAYOUT AT FOOTER */ #footersidebar .widget { float:left; list-style:none; overflow:hidden; width:22%; margin:0 4% 0 0; } #footersidebar .widget_last { margin-right:0; } #footersidebar .widget .title { margin:0 0 20px; color:#fff; } #footersidebar .widget .title { font-size: 20px !important; } #footersidebar .widget li { list-style:none; margin:0 0 30px; } #footersidebar .widget ul { margin:0 0 30px; } #footersidebar .widget ul li { background:url(images/bg_list_footer.gif) no-repeat left 7px; padding:0px 0px 5px 20px; margin:0 0 5px; border-bottom:1px dashed #666; } #footersidebar .widget ul li:last-child{ border-bottom: 0 !important; } #footersidebar .widget li a { color:#fff; } #footersidebar .widget ul ul { margin-left:1.3em; margin-bottom:5px; } #footersidebar .widget ul ul ul { margin-bottom:0; } /* -------------------------------------------------------------- 3. NAVIGATION -------------------------------------------------------------- */ /* TOP MENU */ .nav_top { overflow:hidden; margin:5px auto 0; padding:5px 0; line-height:1em; } .nav_top > ul { float:left; overflow:visible; } /* Menu Elements */ .nav_top li { float:left; list-style:none; margin:0 15px 0 0; } .nav_top li:last-child { border-right:0; } .nav_top li a { display:block; color:#fff; float:left; padding:0; font-size:11px; } .nav_top li a:hover, .nav_top li:hover > a { text-decoration:underline; } .nav_top .current_page_item > a, .nav_top .current-menu-item > a { text-decoration:underline; } /* MAIN MENU */ .nav_main { margin:0; } .nav_main > ul { margin:0; } /* Menu Elements */ .nav_main li { float:left; position:relative; padding:0; margin:0; list-style:none; -moz-transition:0.2s all; -webkit-transition:0.2s all; transition:0.2s all; } .nav_main li:first-child { margin:0; } .nav_main li a { display:block; margin:0; padding:15px 15px; color:#fff; font-size:14px; text-shadow:0px -1px 0px #444; -moz-transition:0.2s all; -webkit-transition:0.2s all; transition:0.2s all; } /*.nav_main li a:hover,*/ .nav_main li:hover { text-decoration:none; } .nav_main li a:hover { text-decoration:none; background-color:rgba(255,255,255,0.2); } .nav_main .current-menu-parent > a, .nav_main .current_page_ancestor > a, .nav_main .current_page_item > a, .nav_main .current-menu-item > a { } .nav_main .current-menu-parent > a:hover, .nav_main .current_page_ancestor > a:hover, .nav_main .current_page_item > a:hover, .nav_main .current-menu-item > a:hover, .nav_main .current-menu-parent:hover > a, .nav_main .current_page_ancestor:hover > a, .nav_main .current_page_item:hover > a, .nav_main .current-menu-item:hover > a { background-color:rgba(255,255,255,0.2); } /* Children Elements */ .nav_main li ul { margin:0; position:absolute; top:100%; left:0; z-index:999999; -moz-transition:0.4s all; -webkit-transition:0.4s all; transition:0.4s all; } .nav_main li ul li { overflow:hidden; height:0px; width:200px; -moz-transition:0.4s all; -webkit-transition:0.4s all; transition:0.4s all; } .nav_main li ul li a { height:22px; width:180px; background:#fff; color:#444; padding:8px 10px; border-bottom:1px solid #ddd; text-shadow:none; -moz-transition:0.4s all; -webkit-transition:0.4s all; transition:0.4s all; } .nav_main li ul li a:hover { background:#eee; } /* Children display on hover */ .nav_main li:hover > ul { } .nav_main li:hover > ul li { height:39px; max-height:9999px; box-shadow:0px 1px 3px 0px #bbb; } /* Transition Delay */ .nav_main li:hover ul li:nth-child(1) { -moz-transition-delay:0.1s; -webkit-transition-delay:0.1s; transition-delay:0.1s; } .nav_main li:hover ul li:nth-child(2) { -moz-transition-delay:0.2s; -webkit-transition-delay:0.2s; transition-delay:0.2s; } .nav_main li:hover ul li:nth-child(3) { -moz-transition-delay:0.3s; -webkit-transition-delay:0.3s; transition-delay:0.3s; } .nav_main li:hover ul li:nth-child(4) { -moz-transition-delay:0.4s; -webkit-transition-delay:0.4s; transition-delay:0.4s; } .nav_main li:hover ul li:nth-child(5) { -moz-transition-delay:0.5s; -webkit-transition-delay:0.5s; transition-delay:0.5s; } .nav_main li:hover ul li:nth-child(n+6) { -moz-transition-delay:0.6s; -webkit-transition-delay:0.6s; transition-delay:0.6s; } /* HOME MENU */ .nav_home { overflow:hidden; margin:10px auto; width:720px; padding:0; border-radius:3px; box-shadow:0px 2px 2px -1px #888; } .nav_home > ul { } /* Menu Elements */ .nav_home li { float:left; list-style:none; width:120px; margin:0; padding:0; } .nav_home li:last-child { border-right:0; } .nav_home li a { display:block; padding:10px; font-size:11px; background:url(images/bg_homemenu.gif) repeat-x center #fff; } .nav_home li a:hover, .nav_home li:hover > a { text-decoration:none; background:#f2f2f2; } .nav_home .current_page_item > a, .nav_home .current-menu-item > a { text-decoration:none; } /* FOOTER MENU */ .nav_footer { font-size:12px; text-align:center; margin:0; padding:0; } .nav_footer > ul { overflow:visible; margin:0; padding:0; } /* Menu Elements */ .nav_footer li { display:inline-block; margin:0; list-style:none; } .nav_footer li a { padding:10px 15px; color:#fff; } .nav_footer li:first-child a { border-left:0; } .nav_footer li a:hover, .nav_footer li:hover > a { } .nav_footer .current_page_item > a, .nav_footer .current-menu-item > a { text-decoration:underline; } /* SUBMENU NAVIGATION */ /*#submenu h3 { padding:0 0px 0 0; }*/ .nav_sub { margin:0; padding:0; } .nav_sub li { list-style:none; margin:0; } .nav_sub li a { display:block; padding:8px 10px; border-radius:3px; } .nav_sub .current_page_item, .nav_sub .current-cat { border-bottom:0; } .nav_sub .current_page_item a, .nav_sub .current-cat a { background-color:#ddd; border-bottom:0; } .nav_sub li ul { display:none; font-size:1em; } /* NEXT/PREV POST NAVIGATION */ #navigation { width:100%; margin:0; padding:20px 0; float:left; } #navigation .prev { float:left; width:50%; text-align:right; } #navigation .next { float:right; width:50%; } #navigation a:link, #navigation a:visited { display:inline-block; padding:6px 15px; margin:0 3px; font-size:14px; background:#ddd; background:-moz-linear-gradient(top, #f5f5f5 0%, #cccccc 100%); background:-webkit-linear-gradient(top, #f5f5f5 0%,#cccccc 100%); background:linear-gradient(to bottom, #f5f5f5 0%,#cccccc 100%); border:1px solid #ccc; border-bottom:1px solid #aaa; color:#444; text-shadow:0 1px 0 #f2f2f2; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; } #navigation a:active, #navigation a:hover { background:#fff; } /* PAGINATION */ .page-link { clear:both; } #pagination { overflow:hidden; margin:20px; float:left; background:#ddd; background:-moz-linear-gradient(top, #f5f5f5 0%, #cccccc 100%); background:-webkit-linear-gradient(top, #f5f5f5 0%,#cccccc 100%); background:linear-gradient(to bottom, #f5f5f5 0%,#cccccc 100%); border:1px solid #ccc; border-bottom:1px solid #aaa; color:#444; text-shadow:0 1px 0 #f2f2f2; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; } #pagination span { display:block; float:left; color:#777; background:#ccc; padding:5px 10px; font-size:14px; } #pagination a { display:block; float:left; padding:5px 10px; font-size:14px; text-shadow:0 1px 0 #fff; } #pagination a:hover { background:#eee; text-decoration:none; } #pagination .current { } /* IN-POST PAGINATION */ .page-link { clear:both; } #postpagination { overflow:hidden; margin:10px 0px 30px; float:left; background:#ddd; background:-moz-linear-gradient(top, #f5f5f5 0%, #cccccc 100%); background:-webkit-linear-gradient(top, #f5f5f5 0%,#cccccc 100%); background:linear-gradient(to bottom, #f5f5f5 0%,#cccccc 100%); border:1px solid #ccc; border-bottom:1px solid #aaa; color:#444; text-shadow:0 1px 0 #f2f2f2; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; } #postpagination span { display:block; float:left; color:#777; background:#ccc; padding:5px 10px; font-size:14px; } #postpagination a span { display:block; float:left; padding:5px 10px; font-size:14px; background:none; } #postpagination a span:hover { background:#eee; text-decoration:none; } #postpagination .current { text-shadow:0 1px 0 #fff; } /* -------------------------------------------------------------- 4. POSTS & PAGES -------------------------------------------------------------- */ /* PREVIEWS */ .previewlist { overflow:hidden; padding:0 0px; } .preview { margin:0 0 30px; overflow:hidden; } .preview .title { padding:0; margin:0 0 10px 0; } .preview .title a { color:#333; } .preview .byline { overflow:hidden; padding:0 0 10px; color:#999; font-size:12px; margin:0 0; } .preview .byline a { color:#999; } .preview .byline .date { float:left; background:url(images/icon_date.png) no-repeat left 4px; padding:0 30px 0 25px; margin:0; } .preview .byline .author { float:left; background:url(images/icon_author.png) no-repeat left 4px; padding:0 30px 0 25px; margin:0; } .preview .byline .category { float:left; background:url(images/icon_category.png) no-repeat left 4px; padding:0 30px 0 25px; } .preview .byline .comments { float:left; background:url(images/icon_comments.png) no-repeat left 4px; padding:0 0 0 25px; } .preview .thumbnail { margin:0 0 30px; line-height:0em; height:auto; } .preview .thumbnail img { display:block; margin:0; line-height:0em; width:100%; height:auto; } .preview .readmore { margin:15px 0 0; } .preview .content { padding:0; margin:0 0; } .preview .content p { margin-bottom:0; } .preview .page { margin-left:0; } .preview .separator { clear:both; width:100%; } /* LARGE PREVIEWS */ .widepreview { margin:0 0 30px 0; overflow:hidden; } .widepreview .title { padding:0; margin:0 0 10px 0; } .widepreview .title a { color:#333; } .widepreview .byline { overflow:hidden; padding:0 0 10px; color:#999; font-size:12px; margin:0 0; border-bottom:0 solid #ccc; } .widepreview .byline a { color:#999; } .widepreview .byline .date { float:left; background:url(images/icon_date.png) no-repeat left 4px; padding:0 30px 0 25px; margin:0; } .widepreview .byline .author { float:left; background:url(images/icon_author.png) no-repeat left 4px; padding:0 30px 0 25px; margin:0; } .widepreview .byline .category { float:left; background:url(images/icon_category.png) no-repeat left 4px; padding:0 30px 0 25px; } .widepreview .byline .comments { float:left; background:url(images/icon_comments.png) no-repeat left 4px; padding:0 0 0 25px; } .widepreview .thumbnail { float:left; margin:0 4% 20px 0; line-height:0em; width:48%; height:auto; } .widepreview .thumbnail img { display:block; margin:0; line-height:0em; width:100%; height:auto; } .widepreview .readmore { margin:15px 0 0; } .widepreview .content { padding:0; margin:0 0; } .widepreview .content p { margin-bottom:0; } .widepreview .page { margin-left:0; } .widepreview .separator { clear:both; width:100%; } /* ENTRIES */ .entry { overflow:hidden; margin:0; padding:0; clear:both; } .entry .title { padding:0; margin:0 0px 20px; } .entry .title a { color:#333; } .entry .meta { margin:0 30px; } .entry .byline { overflow:hidden; padding:0 0 20px; color:#999; font-size:12px; margin:0 0; border-bottom:0 solid #ccc; } .entry .byline a { color:#999; } .entry .byline .date { float:left; background:url(images/icon_date.png) no-repeat left 4px; padding:0 30px 0 25px; margin:0; } .entry .byline .author { float:left; background:url(images/icon_author.png) no-repeat left 4px; padding:0 30px 0 25px; margin:0; } .entry .byline .category { float:left; background:url(images/icon_category.png) no-repeat left 4px; padding:0 30px 0 25px; } .entry .byline .comments { float:left; background:url(images/icon_comments.png) no-repeat left 4px; padding:0 0 0 25px; } .entry .thumbnail { overflow:hidden; position:relative; margin:0 0 0; line-height:0em; height:auto; max-height:500px; } .entry .thumbnail .title { position:absolute; background:url(images/bg_slider_textbox_dark.png); color:#fff; font-size:46px; bottom:0; left:0; right:0; padding:20px; margin:0; text-shadow:0 -1px 0 #222; } .entry .thumbnail img { display:block; margin:0; line-height:0em; width:100%; height:auto; } .entry .tags { background:url(images/icon_tags.png) no-repeat left 4px; padding:0 0 2px 30px; margin:0 0 30px; } .entry .tags a { font-size:10px; color:#999; } .entry .content { overflow:hidden; padding:0px; } .entry .page { margin-left:0; padding: 0 0px 0px; } .entry .subscribe { float:right; margin:30px; } .entry .subscribe img { float:right; } .entry .subscribe .tooltip { float:right; background:url(images/bg_subscribe.gif) right center no-repeat #222; border-radius:5px 0 0 5px; height:22px; color:#fff; padding:5px 20px 5px 12px; margin-right:30px; opacity:0; -moz-transition:0.3s all; -webkit-transition:0.3s all; transition:0.3s all; } .entry .subscribe:hover .tooltip { opacity:1; margin-right:5px; margin-left:30px; } .entry .slides { margin:0 0 30px; } .entry .slides ul { display:block; overflow:hidden; margin:0 0 20px; padding:0 0 10px; } .entry .slides ul li { display:block; overflow:hidden; background:#222; list-style:none; width:100%; margin:0; padding:0; box-shadow:0 10px 8px -10px #778; } .entry .slides ul li img { display:block; width:100%; height:auto; margin:0; line-height:0em; } .entry .slides ul li .content { position:absolute; width:60%; margin:30px 15%; padding:20px 5%; bottom:0; background:url(images/bg_shade.png); color:#c0c0c0; border-radius:3px; } .entry .pages { width:100%; text-align:center; margin:0 auto; } .entry .pages a { display:inline-block; overflow:hidden; background:#666; color:#666; border:3px solid #666; margin:0 5px; width:20px; height:10px; border-radius:2px; } .entry .pages .activeSlide { color:#fff; background:#fff; } .entry .video { margin:30px 0; position:relative; padding-bottom:56.25%; padding-top:25px; height:0; } .entry .video iframe { position:absolute; top:0; left:0; width:100%; height:100%; } .entry .details { display:block; float:right; background:url(images/bg_shade_light.png); margin:0 0 0 4%; width:20%; padding:20px 20px 10px; } .entry .details li { display:block; list-style:none; margin:0 0 10px; padding-left:30px; } .entry .details .date { background:url(images/icon_date.png) no-repeat left 4px; } .entry .details .client { background:url(images/icon_author.png) no-repeat left 4px; } .entry .details .link { background:url(images/icon_link.png) no-repeat left 4px; } .entry .details .description { background:url(images/icon_comments.png) no-repeat left 4px; } /* PORTFOLIO NAVIGATION */ .nav_portfolio { background:url(images/bg_tagline.png) repeat-y center; overflow:hidden; margin:0; padding:30px 0 0; } .nav_portfolio_vertical { background:none; float:left; width:30%; overflow:hidden; margin:0 0 30px; padding:0; } .nav_portfolio li { overflow:hidden; list-style:none; float:left; width:30%; margin:0 5% 30px 0; } .nav_portfolio_vertical li { float:none; width:auto; margin:0 0 30px 0; } .nav_portfolio .second { } .nav_portfolio .third { margin-right:0; } .nav_portfolio li .thumbnail { display:block; float:left; overflow:hidden; border-radius:3px; margin:0 auto; width:70px; height:70px; -moz-transition:0.2s all; -webkit-transition:0.2s all; transition:0.2s all; } .nav_portfolio li .thumbnail:hover { box-shadow:0 0 3px 1px #777; } .nav_portfolio li .thumbnail img { display:block; width:100%; height:auto; line-height:0; } .nav_portfolio li .title { display:block; margin:0 0 5px 90px; text-align:left; font-size:18px; text-transform:capitalize; padding:0; line-height:1em; } .nav_portfolio li .nodescription { margin-top:25px; } .nav_portfolio li a:hover { } .nav_portfolio li .description { display:block; margin-left:90px; color:#888; text-transform:none; } .nav_portfolio .separator_three { clear:both; padding:0; width:100%; } .nav_portfolio .separator_two { display:none; } /* PORTFOLIO SHOWCASE */ #showcase > .title { padding:0px 20px; } #showcase > .description { padding:0px 20px 20px; } #showcase .content { padding:5px; background:#222; } #showcase .content:hover .item { opacity:0.5 } #showcase .item { float:left; position:relative; overflow:hidden; display:block; background:#fff; width:33.33333%; margin:0; border:5px solid #222; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; -moz-transition:0.4s all; -webkit-transition:0.4s all; transition:0.4s all; } #showcase .content .item:hover { text-decoration:none; opacity:1; } #showcase .item_second { } /*#showcase .item .thumbnail { display:block; position:relative; overflow:hidden; box-shadow:0 6px 2px -5px #333; }*/ #showcase .item img { max-width:100%; display:block; margin:0 auto; width:100%; height:auto; line-height:0; } #showcase .item .textbox { overflow:hidden; position:absolute; background:url(images/bg_slider_textbox_dark.png); bottom:0; left:0; right:0; padding:50px 10px 10px; font-size:14px; } #showcase .item .title { margin:0; color:#fff; } #showcase .item .overlay { opacity:0; background:url(images/bg_showcase2.png) no-repeat center; position:absolute; top:0; z-index:9999; width:100%; top:0; bottom:0; -moz-transition:0.4s all; -webkit-transition:0.4s all; transition:0.4s all; } #showcase .thumbnail:hover .overlay { opacity:1; } #showcase .item_half { width:46%; margin:0 8% 30px 0; } #showcase .item_last { margin-right:0; } #showcase .item_full { float:none; position:static; overflow:hidden; display:block; width:auto; padding:0 0 30px; } #showcase .item_full .column { position:relative; float:left; } #showcase .item_full .thumbnail { width:38%; } #showcase .item_full img { width:400px; } #showcase .item_full .title { margin-left:40%; } #showcase .item_full .content { margin-left:40%; } #showcase .item_full .meta { margin:0 0 20px 40%; text-transform:uppercase; } #showcase .item_full .meta a { color:#888; } #showcase .separator { padding:20px 0; width:100%; } #showcase .separator_two { display:none; } .sticky {} /* ADMIN EDIT LINKS */ .edit_link { background:#F90; color:#FFF; padding:0 5px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; } .edit_link:hover { background:#FC3; } .edit_link a { color:#FFF; } /* AUTHOR BIOS */ .author_bio { overflow:hidden; clear:both; padding:20px; margin:30px; background:#eee; } .author_bio .avatar { float:left; display:block; margin:0 20px 0 0; } .author_bio h2 { margin:0 0 10px; } .author_bio .description { margin:0; font-size:12px; } .author_bio .link { float:right; margin:20px 0 0; } /* SHORTCODES */ /* WP GALLERY */ .gallery { margin:0 auto 2em;} .gallery .gallery-item { float:left; display:block; background:#fff; margin:10px 1.5% 20px; text-align:center; width:47%; box-shadow: 0 1px 2px 0 #111111; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; } .gallery .gallery-item:hover { } .gallery .gallery-icon { text-align:center; padding:0; margin:0; overflow:hidden; line-height:0; } .gallery-columns-2 .gallery-item { width:47%; } .gallery-columns-3 .gallery-item { width:30%; } .gallery-columns-4 .gallery-item { width:22%; } .gallery-columns-5 .gallery-item { width:17%; } .gallery-columns-6 .gallery-item { width:13.6%; } .gallery-columns-7 .gallery-item { width:12.25%; margin:10px 1% 10px; } .gallery-columns-8 .gallery-item { width:10.5%; margin:10px 1% 10px; } .gallery-columns-9 .gallery-item { width:9.11%; margin:10px 1% 10px; } .gallery dl a { display:block; } .gallery dl a img { width:100%; height:auto; margin:0 auto; } .gallery .gallery-caption { font-size:12px; line-height:1.2em; margin:10px 0 0;} .gallery br+br { display:none; } /* SEARCH PAGE */ #search_form { margin:30px 0; overflow:hidden; position:relative; } #search_form input[type=text] { float:left; font-size:14px; -moz-box-sizing:border-box;-webkit-box-sizing:border-box; box-sizing:border-box; width:40%; padding:10px 45px 10px 10px; height:40px; border:1px solid #929DcB; border-radius:5px; } #search_form input[type=submit] { display:block; position:absolute; right:0; background:url(images/icon_search.gif) no-repeat center; width:40px; height:38px; border:0; padding:0; margin:1px; cursor:pointer; color:transparent; } #search_form input[type=submit]:hover { background-color:#eee; } /* CONTACT FORM */ #contact_form { float:right; margin-left:5%; } #contact_form .test { left:-9999px; position:absolute; top:-9999px; } #contact_form .field { overflow:hidden; margin:0 0 20px; } #contact_form .field label{ display:block; float:left; padding:8px 20px 8px 0; width:100px; } #contact_form .field input[type=text] { width:400px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; max-width:100%; } #contact_form .field textarea{ height:200px; width:400px; max-height:400px; min-height:200px; resize:vertical; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; max-width:100%; } #contact_form .field .error{ display:block; margin-left:120px; color:#F30; font-weight:bold; font-size:0.8em; } #contact_form .field input[type=submit]{ margin:0; } /* SITEMAP */ #sitemap { margin:30px 0; } #sitemap .sitemap { width:17%; float:left; margin-right:3%; } #sitemap .sitemap li { list-style:none; display:block; width:100%; margin:0 0 0 0; padding:0; } #sitemap .sitemap .current_page_item { display:none; } #sitemap .sitemap li a:link, #sitemap ul li a:visited { font-size:16px; } #sitemap .sitemap ul { margin:0; width:100%; } #sitemap .sitemap ul li { margin:0; padding:0; height:auto; text-transform:none; } #sitemap .sitemap ul a:link, #sitemap ul ul a:visited { color:#666; font-size:12px; } #sitemap .sitemap ul a:hover { text-decoration:underline; } #sitemap .separator { clear:both; padding:0; width:100%; } #sitemap .separator_two { display:none; clear:both; padding:0; width:100%; } #sitemap .separator_three { display:none; clear:both; padding:0; width:100%; } /* -------------------------------------------------------------- 5. COMMENTS -------------------------------------------------------------- */ /* COMMENTS */ #comments { clear:both; padding:30px 0; border-top:1px solid #ddd; } #comments > h3 { margin-bottom:20px; } .commentlist { list-style:none; padding:0; margin:10px 0 30px 0; } .comment { overflow:hidden; list-style:none; margin:0 0 0px 0px; padding:0; } .comment .avatar { float:left; border-radius:3px; } .comment .title { font-size:12px; padding:0; margin-left:68px; } .comment .author { font-size:16px; font-weight:bold; text-shadow:0 -1px 0 #fff; } .comment .bypostauthor { } .comment .date { display:block; width:220px; } .comment .title a:link, .comment .title a:visited { } .comment .title a:active, .comment .title a:hover { } .comment .approval { display:block; background:#eee; padding:0 10px 0; margin:0;} .comment .content { clear:left; margin:10px 0 0; padding:20px; background:url(images/bg_shade_light.png); } .comment .options { padding:0; overflow:hidden; margin-bottom:20px; } .comment .options a { display:block; float:right; margin-left:10px; font-size:12px; } /* Contents Styling for Comment Body */ .comment .content ul, .comment .content ol { margin-bottom:18px; } .comment .content p:last-child { margin-bottom:6px; } .comment .content blockquote p:last-child { margin-bottom:24px; } /* Nested Comments */ .comment .children { list-style:none; margin:0 0 0 50px; } .nopassword, .nocomments { font-size:12px; font-weight:bold; margin:0; padding:0; } /* Pingbacks & Trackbacks */ #comments ol.pinglist { margin:0; } #comments .pingback { list-style:none; margin:0 0 10px 0; } #comments .pingback .url { font-size:13px; font-style:italic; } /* COMMENT FORM */ #respond { margin:30px 0; overflow:hidden; position:relative; } #respond h3 { } #respond p { display:block; padding:0; margin:10px 0; } #respond form { } .children #respond { margin:0 48px 0 0; } /* Fields */ #respond .comment-notes { display:none; } #cancel-comment-reply-link { display:block; font-size:0.9em; font-weight:normal; line-height:18px; } #respond .required { display:none; color:#ff4b33; font-weight:bold; } #respond label{ display:block; float:left; padding:8px 5% 8px 0; width:120px; } #respond input[type=text] { width:200px; } #respond textarea{ height:200px; width:490px; max-height:400px; min-height:200px; resize:vertical; } /* Nested Form */ #comments-list #respond { margin:0 0 18px 0; } #comments-list ul #respond { margin:0; } /* Allowed Tags */ #respond .form-allowed-tags { display:block; color:#888; font-size:12px; line-height:18px; } #respond .form-allowed-tags code { display:block; font-size:12px; } #respond #submit, #respond #submit:visited { display:inline-block; background:#333; width:auto; border:0; border-bottom:1px solid #533; padding:12px 15px; color:#FFF; text-shadow:0 -1px 0 #333; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; font-weight:bold; cursor:pointer; } #respond #submit, #respond #submit:visited { display:inline-block; background:#ddd; background:-moz-linear-gradient(top, #f5f5f5 0%, #cccccc 100%); background:-webkit-linear-gradient(top, #f5f5f5 0%,#cccccc 100%); background:linear-gradient(to bottom, #f5f5f5 0%,#cccccc 100%); width:auto; border:1px solid #ccc; margin:20px 0; border-bottom:1px solid #aaa; padding:12px 15px; color:#444; text-shadow:0 1px 0 #f2f2f2; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; font-weight:bold; cursor:pointer; } #respond #submit:hover { background:#666; } #respond #submit:active { background:#666; border-bottom:0; border-top:1px solid #335; } /* -------------------------------------------------------------- 6. WIDGETS Includes all widget-related elements -------------------------------------------------------------- */ /* Forms */ .widget select { max-width:100%; } /* SEARCH WIDGET */ .widget_search { overflow:hidden; position:relative; } .widget_search label { display:none; } .widget_search input[type=text] { float:left; font-size:12px; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; width:100%; padding:10px 45px 10px 10px; height:40px; border:1px solid #bbb; border-radius:3px; } .widget_search input[type=text]:focus{ } .widget_search input[type=submit] { float:right; position:absolute; right:0px; display:block; background:url(images/icon_search.gif) no-repeat center #fff; width:40px; height:40px; border:1px solid #bbb; padding:0; margin:0; cursor:pointer; color:transparent; border-radius:0 3px 3px 0; } .widget_search input[type=submit]:hover { background-color:#f5f5f5; } /* TAG CLOUD WIDGET */ .widget_tag_cloud #wp_tag_cloud div { line-height:1.6em; } .widget_tag_cloud a { display:inline-block; background:#ddd; padding:4px 8px; margin:2px; border-radius:3px; } /* CALENDAR WIDGET */ #wp-calendar { width:100%; padding:0; clear:both; border:0; color:#aaa; } #wp-calendar caption { font-weight:bold; text-transform:capitalize; color:#fff; padding:5px; text-align:center; } #wp-calendar td { padding:5px; text-align:center; background:none; border-bottom:0; } #wp-calendar td, table#wp-calendar th { padding:3px 0; text-align:center; } #wp-calendar tfoot #next { text-align:right; } #wp-calendar thead { border:1px solid #333; } #wp-calendar thead th { background:#333; padding:8px 0; color:#bbb; } #wp-calendar tbody { background:#333; border:1px solid #333; } #wp-calendar tbody tr { background:#333; } #wp-calendar tbody tr:nth-child(2n+1) { background:#444; } #wp-calendar tbody tr td { border:0 solid #222; -moz-transition:0.3s all; -webkit-transition:0.3s all; transition:0.3s all; } #wp-calendar tbody tr td:hover { background:#555; } #wp-calendar tbody tr:nth-child(2n+1) td:hover { background:#666; } #wp-calendar tbody tr #today { background:#555; border:1px solid #777; } #wp-calendar tbody tr #today:hover { background:#888; } #wp-calendar tbody tr td.pad:hover { background:#444; } #wp-calendar tbody tr td a { } #wp-calendar tfoot { background:none; } #wp-calendar tfoot td { background:none; } #wp-calendar tfoot #prev { text-align:left; } #wp-calendar tfoot #next { text-align:right; } /* RSS WIDGET */ .widget_rss a.rsswidget { } .widget_rss a.rsswidget:hover { color:#ff4b33; } .widget_rss .widget-title img { width:14px; height:14px; } /* CPOTHEMES RECENT POSTS WIDGET */ .cpotheme_recent_posts {} .cpotheme_recent_posts .item { overflow:hidden; padding-bottom:15px;} .cpotheme_recent_posts .item .title {} .cpotheme_recent_posts .item .thumbnail { display:block; width:75px; float:left; margin-right:15px; } .cpotheme_recent_posts .item img { display:block; width:75px; height:auto; box-shadow:0px 1px 2px 0px #111; } .cpotheme_recent_posts .item .meta { font-size:10px; } /* CPOTHEMES FLICKR WIDGET */ #cpotheme_flickr { overflow:hidden; } #cpotheme_flickr div { float:left; overflow:hidden; width:75px; margin:0px 8px 8px 0px; box-shadow:0px 1px 2px 0px #111; } #cpotheme_flickr a { display:block; line-height:0; } #cpotheme_flickr img { } /* CPOTHEMES TWITTER WIDGET */ .twitter_stream {} #footersidebar .twitter_stream li.tweet { background:url(images/bg_shade_light.png); list-style:none; padding:10px; margin:0 0 10px; border:none; border-radius:3px; } .twitter_stream {} /* CPO TWEETS WIDGET */ /*.widget_cpo_tweets { } .widget_cpo_tweets .tweet-container { } .widget_cpo_tweets .tweet { margin:10px 0; } .widget_cpo_tweets .tweet .avatar { float:left; margin:0 10px 0 0 } .widget_cpo_tweets .tweet .user { } .widget_cpo_tweets .tweet .date { font-size:0.8em; } .widget_cpo_tweets .tweet .status { font-size:0.9em; clear:both; } .tweet_wrapper { } .tweet_username { color:#777; font-size:16px; font-style:italic; } .tweet_status { font-size:0.9em; } .tweet_date { padding-left:15px; color:#777; font-size:12px; } .tweet_follow { font-style:italic; }*/ .widget_rss .rsswidget img{ display: none; } .leftcol{width: 48%;float: left;} .rightcol{width: 48%;float: right;} /* -------------------------------------------------------------- 6. MOBILE & OTHER Includes all queries that shape the site for mobile experiences as well as random snippets that don't fit elsewhere -------------------------------------------------------------- */ /* TABLET PORTRAIT */ @media only screen and (max-width: 800px){ .leftcol, .rightcol{float: none;width: auto;} #menu { float:none; text-align:center; } #submenu { } #slider { margin-left:0; } #main { margin-left:0; } #content { padding:0; width:67%; margin-right:3%; } #features { margin:0; } #showcase { } #tagline h2 { font-size:18px; } #footersidebar { padding:15px 10px 0; } #footer { padding:15px; text-align:center; } #footermenu { float:none; margin-bottom:20px; } #content.right { margin:0 0 0 3%; } #header .logo { background:url(images/bg_shade_light.png); float:none; text-align:center; } #header .description { text-align:center; } #social { float:none; background:url(images/bg_shade_light.png); text-align:center; } #social a { } /* HOMEPAGE SLIDES */ #slider ul li { width:50%; } #slider .separator { display:none; } #slider .separator_two { display:block; clear:both; width:100px; } /* FEATURES */ #features .feature { width:48%; margin-right:4%; } #features .feature_second { margin-right:0; } #features .feature_right { margin-right:0; } #features .separator { display:none; } #features .separator_two { clear:both; width:100px; } /* TESTIMONIALS */ #testimonials .testimonial .content { margin-right:200px; } #showcase .description .link { display:block; float:none; margin:20px 0; text-align:center; } #showcase .item { width:50%; } #showcase .item_last { margin-right:0; } #showcase .item_third { margin-right:0; } #showcase .item_second { margin-right:0; } #showcase .separator { display:none; } #showcase .separator_three { display:none; } #showcase .separator_two { display:block; clear:both; width:100%; } #showcase .item_full { width:auto; margin:0 0 30px; } #showcase .item_full .content { margin-left:350px; } #showcase .item_full .thumbnail { width:300px; } #showcase .item_full img { width:300px; } #showcase .item_full .content { margin-left:350px; } #showcase .item_full .meta { margin:0 0 20px 350px; text-transform:uppercase; } /* NAVIGATION */ .nav_top { text-align:center; } .nav_top li { display:inline-block; } .nav_top li a { margin:0 auto; } .nav_portfolio { background:none; } .nav_portfolio li { width:47%; margin:0 6% 20px 0; } .nav_portfolio .third { margin-right:6%; } .nav_portfolio .second { margin-right:0; } .nav_portfolio li .thumbnail { margin:0 auto 20px; } .nav_portfolio .separator_three { display:none; } .nav_portfolio_vertical { float:left; margin:0 0 30px; } .nav_portfolio_vertical li { width:auto; margin:0 0 30px 0; } /* COMMENTS */ .children #respond { margin:0 48px 0 0; } #cancel-comment-reply-link { display:block; font-size:0.9em; font-weight:normal; line-height:18px; } #respond .required { display:none; color:#ff4b33; font-weight:bold; } #respond label{ float:none; padding:8px 0; } #respond input[type=text], #respond textarea{ -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; width:100%; } #comments-list #respond { margin:0 0 18px 0; } #respond .form-allowed-tags { margin-left:0; } #respond #submit, #respond #submit:visited { margin-left:0; } /* CONTACT FORM */ #contact_form .field { overflow:hidden; margin:0 0 20px; } #contact_form .field input[type=text] { width:250px; } #contact_form .field textarea{ width:250px; } #contact_form .field input[type=submit]{ margin:0; } /* WIDGET LAYOUT AT FOOTER */ #footersidebar .widget { width:47%; margin:0 6% 0 0; } #footersidebar .widget_second { margin:0; } #footersidebar .widget_last { margin:0; } } /* SMARTPHONE */ @media only screen and (max-width: 480px){ .leftcol, .rightcol{float: none;width: auto;} #topmenu { display:none; } #header { overflow:hidden; } #social { float:none; text-align:center; padding:10px 0; width:100%; } #menu { float:none; text-align:center; overflow:hidden; padding:0; } #submenu { float:none; margin:30px 0; width:auto; } #slider { margin-left:0; } #main { margin-left:0; padding:10px; } #content { margin:0; float:none; width:auto; } #features { margin:0; padding:15px 10px 0; } #showcase { } #tagline h2 { font-size:18px; } #sidebar { float:none; width:auto; background:#fff; padding:10px; } #footersidebar { padding:15px 10px 0; } #footer { padding:15px; text-align:center; } #footermenu { float:none; margin-bottom:20px; } #content.right { float:none; margin:0; } #content.wide { width:auto; margin:0; } /* HOMEPAGE SLIDES */ #slider ul { } #slider ul li { width:100%; } #slider ul li .bg { background:none; } #slider ul li .content { width:100%; position:absolute; bottom:0; } #slider ul li .textbox { width:100%; border-radius:0; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; } #features .feature { width:100%; margin:0 0 40px 0; } #features .feature_right { margin-right:0; } #features .feature_second { margin-right:0; } #showcase .description .link { display:block; float:none; margin:20px 0; text-align:center; } #showcase .item { width:100%; } #showcase .item_second { margin-right:0; } #showcase .item_third { margin-right:0; } #showcase .separator_three { display:none; } #showcase .separator_two { display:block; clear:both; width:100%; } #showcase .item .content { display:none; } #showcase .item .title { } #showcase .work { margin-left:0; } #showcase .item_full { width:auto; } #showcase .item_full .thumbnail { width:auto; } #showcase .item_full img { width:100%; } #showcase .item_full .column { float:none; } #showcase .item_full .meta { display:none; } #showcase .item_full .content { display:none; } /* TESTIMONIALS */ #testimonials { height:130px; } #testimonials .testimonial img { display:none; } #testimonials .testimonial .content { margin-right:0; min-height:30px; } #testimonials .testimonial .byline { float:none; width:auto; text-align:left; margin-bottom:15px; } #testimonials .testimonial .byline .author { border-right: 1px solid #fff; padding-right:15px; margin-right:15px; } #testimonials .testimonial .byline br { display:none; } /* NAVIGATION */ .nav_top { text-align:center; } .nav_top li { display:inline-block; } .nav_top li a { margin:0 auto; } .nav_main li { background:none; float:none; margin:0 auto; padding:0; } .nav_main > li { overflow:hidden; } .nav_main li a { float:none; font-size:16px; padding:5px 15px; } .nav_main li a .description{ display:none; } .nav_main li ul { display:none; overflow:hidden; position:static; margin:0 10px 10px; top:100%; left:auto; width:auto; z-index:9999; } .nav_main li ul li a { text-align:center; width:auto; border:0; font-size:14px; } .nav_main li ul li a:hover { width:auto; } .nav_main li ul ul { top:100%; left:0; } .nav_main li > ul { width:auto; } .nav_main li:hover > ul { display:block; width:auto; } .nav_main li:hover > ul li { width:auto; background:none; } .nav_portfolio li { float:none; clear:both; width:auto; margin:0 0 20px 0; } .nav_portfolio li .thumbnail { margin:0 auto 20px; } .nav_portfolio .separator_three { display:none; } .nav_portfolio_vertical { float:none; width:auto; margin:0 0 30px; } .nav_portfolio_vertical li { width:auto; margin:0 0 30px 0; } /* POSTS & PAGES */ .previewlist { padding:0; } .preview { float:left; width:100%; margin:0 0 30px 0; } .preview .title { padding:0; margin:0 0 10px 0; } .preview .date { float:none; margin:10px; padding:10px; } .preview .date br { display:none; } .preview .content { padding:10px 0 0; margin:0; } .widepreview .thumbnail { float:none; width:100%; margin-right:0; } .entry .comments { display:none; } .entry .thumbnail { display:block; text-align:center; float:none; margin:0 auto; text-align:center; } .entry .thumbnail img { margin:0 auto; text-align:center; } .entry .title { font-size:24px; } .entry .details { float:none; margin:0 0 20px; width:auto; } #contact_form { float:none; width:auto; padding:0 0 20px; } #sitemap { margin:30px 10px; } #sitemap .sitemap { width:47%; margin-right:6%; } #sitemap .sitemap_third { margin-right:6%; } #sitemap .sitemap_fourth { margin-right:6%; } #sitemap .sitemap_second { margin-right:0; } #sitemap .separator { display:none; } #sitemap .separator_three { display:none; } #sitemap .separator_two { display:block; } /* COMMENTS */ .comment .title { padding:0; height:48px; } .comment .author { display:block; } .comment .date { display:block; border:0; padding:0; margin:0; } .comment .content { padding:10px; } .comment .children { margin-left:20px; } /* WIDGET LAYOUT AT FOOTER */ #footersidebar .widget { width:100%; margin:0; } /* WIDGETS */ #cpotheme_flickr div { width:72px; } }