/* =============================================================================================================== 01 RESET CSS =============================================================================================================== */ html, body, div, span, applet, object, iframe, 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; vertical-align: baseline; font-size: 100%; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } /* =============================================================================================================== 02 GLOBAL STYLES =============================================================================================================== */ html { -webkit-font-smoothing: antialiased; } body { position: relative; line-height: 20px; -webkit-text-size-adjust: 100%; } a { color: #777; } .inner { position: relative; margin: 0 auto; width: 960px; } p { line-height: 22px; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: none; } table { border-spacing: 0; border-collapse: collapse; } strong, th, thead td { font-weight: bold; } cite, em, dfn { font-style: italic; } code, pre { display: block; white-space: pre; font-size: 12px; } del { color: #666; text-decoration: line-through; } ins, dfn { border-bottom: 1px solid #ccc; } small, sup, sub { font-size: 85%; } abbr, acronym { text-transform: uppercase; letter-spacing: .1em; } a abbr, a acronym { border: none; } abbr[title], acronym[title], dfn[title] { border-bottom: 1px dotted #ccc; cursor: help; } sup { vertical-align: super; } sub { vertical-align: sub; } p, ul, ol, dl, table, fieldset, blockquote, pre, code { margin-bottom: 20px; } a { text-decoration: none; } a:link, a:visited, a:hover, a:active, a:focus { outline: 0 none; text-decoration: none; } .floatleft, .alignleft { float: left; text-align: left; } .floatright, .alignright { float: right; text-align: right; } .aligncenter { margin-right: auto; margin-left: auto; text-align: center; } /* CLEAR BOTH: FLOATED ELEMENTS FIX =================================================*/ .clearboth { display: block; visibility: hidden; clear: both; overflow: hidden; width: 0; height: 0; } .clearboth:after { display: block; visibility: hidden; clear: both; width: 0; height: 0; content: ' '; font-size: 0; line-height: 0; } * html .clearboth { height: 1%; } /* HEADEING STYLES */ h1, h2, h3, h4, h5, h6 { margin: 0 0 0.8em; text-transform: uppercase; font-weight: normal; line-height: 1.2em; } /* BASIC LIST STYLES */ ul { margin-bottom: 1em; margin-left: 1.5em; list-style-type: disc; } ul li { margin-left: .85em; } ul ul { list-style-type: square; } ul ul ul { list-style-type: circle; } ol { margin-bottom: 1em; margin-left: 2.35em; list-style-position: outside; list-style-type: decimal; } dt { margin-top: .8em; margin-bottom: .4em; font-weight: bold; } ol ol, ul ol { margin-left: 2.5em; } ul ol, ol ul, ol ol, ul ul { margin-bottom: 0; } /* FORM STYLES */ .section_row { margin: 0 0 10px; } .fsection_row label { cursor: pointer; } fieldset { padding: 1em; border: 1px solid #dddddd; } legend { padding: 0 .8em; font-weight: bold; font-size: 1.2em; } textarea, input[type=text], input[type=password], input[type=email], select { outline: none; border: none; font-size: inherit; } input, select { cursor: pointer; } input[type=text], input[type=password], input[type=email] { cursor: text; } textarea { overflow: auto; } textarea, input { padding: 8px; outline: none; } select { padding: 2px; } option { padding: 0 4px; } input[type=button], button { padding: 4px; vertical-align: middle; cursor: pointer; } .content .comment_row { margin-bottom: 20px; width: 100%; } .content .contact_content { width: 95%; height: 200px; } input.text_input, textarea.textarea, .wpcf7-text, .wpcf7-textarea { padding: 8px; outline: none; background-color: rgba(0,0,0,0.1); color: #676767; } input.text_input:focus, textarea.textarea:focus, .wpcf7-text:focus, .wpcf7-textarea:focus { background-color: rgba(0,0,0,0.15); color: #676767; } .dark input.text_input, .dark textarea.textarea { background-color: rgba(255,255,255,0.1); color: #ededed; } .dark input.text_input:focus, .dark textarea.textarea:focus { background-color: rgba(255,255,255,0.15); color: #ededed; } .light input.text_input, .light textarea.textarea { background-color: rgba(0,0,0,0.05); color: #ededed; color: #676767; } .light input.text_input:focus, .light textarea.textarea:focus { background-color: rgba(0,0,0,0.07); color: #ededed; color: #676767; } .boxed_layout { margin: 0 auto; width: 1020px; } /* =============================================================================================================== 02 WORDPRESS DEFAULT STYLES =============================================================================================================== */ .alignleft, img.alignleft { display: inline; float: left; margin-right: 1.5em; } .alignright, img.alignright { display: inline; float: right; margin-left: 1.5em; } .aligncenter, img.aligncenter { display: block; clear: both; margin-right: auto; margin-left: auto; } .alignnone, img.alignnone { clear: both; } .wp-caption { margin-bottom: 1.5em; padding: 5px 0; background: rgba(0,0,0, 0.05); text-align: center; } .wp-caption img { margin: 0; padding: 0; border: 0 none; } .wp-caption p.wp-caption-text { margin: 0; line-height: 1.5; } .wp-smiley { margin: 0 !important; max-height: 1em; } blockquote.left { float: left; margin-right: 20px; margin-left: 0; width: 33%; text-align: right; } blockquote.right { float: right; margin-right: 0; margin-left: 20px; width: 33%; text-align: left; } /* =============================================================================================================== 03 CSS3 ANIMATIONS =============================================================================================================== */ .scrolltop_button { position: fixed; right: 30px; bottom: 20px; z-index: 100; display: none; display: block; width: 46px; height: 46px; background: #606060 url(../images/scroll_top_arrow.png) center center no-repeat; } .scrolltop_button:after { display: block; margin-top: 46px; width: 46px; height: 3px; background: rgba(0,0,0, 0.2); content: ""; } a { -webkit-transition: color 0.2s ease-in; -moz-transition: color 0.2s ease-in; -o-transition: color 0.2s ease-in; transition: color 0.2s ease-in; } .blog_meta .blog_post_type, .newspaper_top_meta .blog_post_type, .blog_pagination a, #page #portfolios header a, .flex-direction-nav li a, .portfolio_single_pagination a, div.anythingSlider .arrow a, .widget_search .search_button, .client_slider .jcarousel-next-vertical, .client_slider .jcarousel-prev-vertical, #navigation ul li a, .button, .anythingControls .arrow, .scrolltop_button, .meta_time, .widget_social a, #toolbar_social ul li a, #cboxPrevious, #cboxNext, .portfolio_plus_icon_newspaper, .portfolio_arrow_icon_newspaper, .hyperlink_icon, .plus_icon, .widget_sub_navigation a, #side_social ul li a, .ls-defaultskin .ls-nav-prev, .ls-defaultskin .ls-nav-next { -webkit-transition: background-color .3s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out; -moz-transition: background-color .3s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out; -ms-transition: background-color .3s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out; -o-transition: background-color .3s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out; transition: background-color .3s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out; } /* =============================================================================================================== 04 HEADER =============================================================================================================== */ #header.fixed_header { position: fixed; top: 0; z-index: 150; } #header.relative_header { position: relative; } #header { width: 100%; } #header .inner { z-index: 98; } .boxed_layout #header.fixed_header { width: 1020px; } #toolbar .inner { z-index: 99; overflow: hidden; } #toolbar { position: relative; width: 100%; height: 34px; border-bottom: 1px solid rgba(0,0,0, 0.2); background: #313131; } /* LOGO & SITE DESCRIPTION */ #header .logo { display: block; float: left; } #header .logo img { float: left; } #header .site_description { display: block; clear: both; font-size: 12px; } #header .site_name { display: block; line-height: 120%; } #toolbar_social { position: relative; z-index: 90; float: right; margin: 10px 10px 0 0; } #toolbar_social ul, #toolbar_social li { margin: 0; padding: 0; list-style: none; line-height: 10px; } #toolbar_social ul li { display: inline; } #toolbar_social ul li a { width: 24px; height: 24px; opacity: 0.2; } #toolbar_social ul li a:hover { opacity: 0.6; } .header_tagline { display: inline-block; float: right; padding: 10px 20px 0 0; text-align: right; } @media only screen and (max-width: 1024px) { #header .logo { margin: 0 auto !important; } } /* =============================================================================================================== 05 MAIN NAVIGATION =============================================================================================================== */ #navigation_wrapper { position: absolute; right: 0; bottom: 0; z-index: 80; } #navigation { position: relative; z-index: 200; display: inline; margin: 0; padding: 0; } #navigation ul { display: inline; margin: 0; padding: 0; list-style-type: none; } #navigation ul li { position: relative; display: inline; float: left; margin: 0; } #navigation ul li a { display: block; overflow: hidden; margin: 0 15px; padding: 12px 2px 20px 2px; text-decoration: none; } #navigation ul li > a { border-bottom: 3px solid transparent; } #navigation ul li ul li > a, #navigation ul li ul li > a:hover { border: none !important; } #navigation ul li a { margin: 0 !important; } #navigation ul li { margin: 0 15px; } .main_nav_style_2 #navigation ul li ul { border: none !important; } .main_nav_style_2 #navigation ul li > a { border: none !important; } .main_nav_style_2 #navigation ul li a { padding: 12px 15px 15px; } .main_nav_style_2 #navigation ul li ul { margin-top: 0 !important; } * html #navigation ul li a { display: inline-block; } #navigation ul li a { text-transform: uppercase; letter-spacing: 0.5px; } #navigation ul li a:hover, #navigation ul li:hover > a { } #navigation ul li ul { position: absolute; left: 0; z-index: 200; display: block; visibility: hidden; margin-top: -3px; padding: 0; padding-bottom: 10px; width: 230px; background: url(../images/overlay_85.png); } #navigation ul li ul li { display: list-item; float: none; margin: 0; padding: 0; width: 230px; } #navigation ul li ul li a:after { display: block; margin: 8px 0 0 0; width: 70px; height: 1px; background: rgba(255,255,255,0.1); content: ""; } #navigation ul li ul li:last-child > a:after { width: 0 !important; height: 0 !important; } #navigation ul li ul li ul { top: 0; padding: 0; width: 230px; } #navigation ul li ul li a { margin: 0; padding: 8px 10px 0 10px !important; width: 210px; text-transform: none; font-weight: normal; } #navigation ul ul li a, #navigation ul ul li a:link, #navigation ul ul li a:visited { height: 100%; } #navigation ul li ul li a:hover, #navigation ul ul li:hover > a { width: 210px; } #navigation ul ul ul { margin-top: -3px; } #responsive_navigation { display: none; clear: both; width: 100%; text-align: center; } #responsive_navigation select { width: 440px; border-right: none !important; border-left: none !important; } .customStyleSelectBox { overflow: hidden; margin-bottom: 20px; width: 440px; height: 46px; background: url(../images/responsive_nav_bg.png) right center no-repeat; color: #7d7979; color: #aaaaaa; text-align: center; text-transform: uppercase; font-size: 11px; line-height: 46px; } /* =============================================================================================================== SIDE SOCIAL NETWORKS =============================================================================================================== */ @media only screen and (max-width : 1024px) { #side_social { display: none; } } #side_social { position: fixed; top: 50%; z-index: 110; } #side_social.left { left: 0; } #side_social.right { right: 0; } #side_social ul, #side_social ul li { margin: 0; padding: 0; list-style: none; } #side_social ul li { display: block; } #side_social ul li a { display: block; margin: 0; padding: 13px 13px 9px 13px; background-color: #444444; } #side_social ul li a.rss:hover { background-color: #e97d24; } #side_social ul li a.twitter:hover { background-color: #00adec; } #side_social ul li a.facebook:hover { background-color: #3a5a97; } #side_social ul li a.linkedin:hover { background-color: #0076a9; } #side_social ul li a.dribbble:hover { background-color: #d3306e; } #side_social ul li a.google:hover { background-color: #c23b2b; } #side_social ul li a.pinterest:hover { background-color: #ad2e25; } #side_social ul li a.delicious:hover { background-color: #0001fe; } #side_social ul li a.digg:hover { background-color: #1b5891; } #side_social ul li a.flickr:hover { background-color: #ff0083; } #side_social ul li a.deviantart:hover { background-color: #5f7a6a; } #side_social ul li a.tumblr:hover { background-color: #395777; } #side_social ul li a.stumble:hover { background-color: #de470c; } #side_social ul li a.blogger:hover { background-color: #fa6700; } #side_social ul li a.behance:hover { background-color: #035dfb; } #side_social ul li a.lastfm:hover { background-color: #c71c05; } #side_social ul li a.skype:hover { background-color: #3bc1f4; } #side_social ul li a.vimeo:hover { background-color: #4ba8c0; } #side_social ul li a.wordpress:hover { background-color: #2998c3; } #side_social ul li a.yahoo:hover { background-color: #650f6a; } #side_social ul li a.youtube:hover { background-color: #fe1511; } /* =============================================================================================================== 06 PAGE LAYOUT =============================================================================================================== */ #page { overflow: hidden; } .client_slider_enabled #page { padding-bottom: 70px; } #page .inner { margin: 0 auto; padding: 30px 0 30px 0; } #main, #sidebar { position: relative; } * html #page, * html #sidebar { display: inline; } .right_sidebar #main { position: relative; float: left; } .right_sidebar #main .content { overflow: hidden; } .right_sidebar #sidebar { float: right; margin: 0; } .right_sidebar #sidebar .sidebar_content { padding: 10px 0 30px 20px; } .left_sidebar #main { float: right; } .left_sidebar #sidebar { float: left; margin: 0; } .left_sidebar #sidebar .sidebar_content { padding: 10px 10px 30px 0; } .right_sidebar #main, .left_sidebar #main .content, .right_sidebar #main .content { width: 640px; } .left_sidebar #sidebar, .right_sidebar #sidebar { width: 300px; } /* =============================================================================================================== 07 PAGE INTRODUCE =============================================================================================================== */ #introduce { position: relative; } .introduce_shadows { padding: 0 30px; border: 1px solid rgba(0,0,0,0.2); border-right: 0; border-left: 0; background: url(../images/introduce_top_shadow.png) top center no-repeat; } .introduce_wrapper { margin: 0 auto; padding: 20px 0; } #introduce h1 { margin-bottom: 10px; font-weight: 800; } #introduce h1.title_center { display: inline-block; margin: 0; width: 100%; text-align: center; } #introduce h1.title_center:before, #introduce h1.title_center:after { display: inline-block; margin-bottom: 10px; width: 120px; height: 1px; content: ""; opacity: 0.7; } #introduce h1.title_center:after { margin-left: 10px; } #introduce h1.title_center:before { margin-right: 10px; } #introduce h4 { margin-bottom: 0; font-weight: normal !important; } .entry_edit a { display: inline-block; margin-left: 15px; width: 16px; height: 16px; background: url(../images/edit_icon.png); } .creative_introduce { } .creative_introduce .introduce_dominant, .creative_introduce .introduce_highlight { margin-bottom: 10px !important; word-wrap: break-word; } .creative_introduce .introduce_subtitle { margin-top: 20px; font-weight: normal !important; font-size: 18px !important; } .creative_introduce .introduce_subtitle:after { display: block; margin: 15px 0 30px 0; width: 140px; height: 4px; background: rgba(0,0,0,0.2); content: ""; } .creative_introduce .introduce_desc { margin-bottom: 0 !important; color: #666666 !important; font-style: italic !important; font-size: 12px !important; } /* =============================================================================================================== 08 HOMEPAGE JCAROUSEL =============================================================================================================== */ .carousel_wrapper { margin: 0 auto 80px; padding: 40px 10px 0; height: 320px; } .carousel_wrapper h2 { display: block; margin-bottom: 20px; color: #fff !important; text-align: center; font-weight: 800 !important; font-size: 14px !important; } .carousel_wrapper h2:before, .carousel_wrapper h2:after { display: inline-block; margin-bottom: 4px; width: 120px; height: 1px; background: rgba(255,255,255, 0.4); content: ""; opacity: 0.7; } .carousel_wrapper h2:after { margin-left: 10px; } .carousel_wrapper h2:before { margin-right: 10px; } .carousel_wrapper .thumbnail { position: relative; z-index: 10; display: block; margin: 0; padding: 0; width: 220px; height: 283px; } .carousel_desc_header { position: absolute; top: -10px; left: 0; width: 220px; height: 10px; background: url(../images/carousel_desc_header.png) no-repeat; } .carousel-extra-info .title { z-index: 10; display: block; margin-bottom: 0; padding: 10px 10px 0 10px; color: #000; text-transform: uppercase; } .carousel-extra-info .title:after { display: block; margin: 5px 0 5px 45px; width: 100px; height: 1px; background: rgba(0,0,0, 0.2); content: ""; } .carousel-category { color: #a4a4a4; font-style: italic; font-size: 11px; } .carousel-extra-info { position: absolute; bottom: 2px; left: 0; display: none; padding-bottom: 10px; width: 100%; border-bottom: 2px solid rgba(0,0,0, 0.2); background: #dfdfdf; } .carousel-inner-shadow { position: absolute; top: 0; left: 0; display: none; width: 100%; height: 100%; background: url(../images/carousel-inner-shadow.png) no-repeat; } .hc_list_carousel { margin: 0 auto 30px auto; } .hc_list_carousel ul { display: block; margin: 0; padding: 0; list-style: none; } .hc_list_carousel li { display: block; float: left; margin: 0; padding: 0; width: 220px; height: 280px; text-align: center; } .hc_list_carousel.responsive { margin-left: 0; width: auto; } /* .carousel_wrapper .jcarousel-skin { /* margin:0 auto; */ */width:960px; /* } .jcarousel-clip-horizontal {overflow: hidden; */ /* } .jcarousel-item { /* position:relative; */ /* width:220px; */ /* height:280px; */ text-align:center; */ /* margin:0; */ /* } .jcarousel-item-horizontal { margin-left: 0; */ /* } .jcarousel-direction-rtl .jcarousel-item-horizontal { margin-left: 0px; */ /* margin-right: 0; */ .hc_list_carousel .hc_prev, .hc_list_carousel .hc_next { position: absolute; top: -50px; width: 16px; height: 16px; background-image: url("../images/carousel_arrows.png"); opacity: 0.6; cursor: pointer; } .hc_list_carousel .hc_next:hover, .hc_list_carousel .hc_prev:hover { opacity: 1; } .hc_list_carousel .hc_next { right: 23px; background-position: right center; } .hc_list_carousel .hc_prev { right: 45px; background-position: left center; } /* Client Box */ .client_slider { position: absolute; top: -151px; left: -10px; margin: 0 auto; width: 980px; border: 1px solid rgba(0,0,0, 0.2); background: #fff; } #client_box_slider { display: none; } #client_box_slider li { margin: 0; padding: 0; border-right: 1px solid rgba(0,0,0, 0.2); } #client_box_slider li .thumb { display: block; float: right; width: 160px; height: 150px; } .client_box_heading { display: inline-block; float: left; width: 179px; height: 150px; border-right: 1px solid rgba(0,0,0, 0.2); } .client_box_heading .client_title { display: block; padding: 65px 20px 0 20px; text-align: center; text-transform: uppercase; font-weight: 800; } .client_slider .client_box_container { float: right; width: 800px; height: 150px; } .client_slider .jcarousel-container-horizontal { width: 800px; height: 150px; } .client_slider .jcarousel-clip-horizontal { overflow: hidden; } .client_slider .jcarousel-item { position: relative; width: 159px; height: 150px; } .client_slider .jcarousel-next-horizontal, .client_slider .jcarousel-prev-horizontal { position: absolute; left: -100px; width: 21px; height: 21px; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; background-color: #a2a2a2; background-image: url(../images/vertical_carousel_arrows.png); background-repeat: no-repeat; cursor: pointer; } .client_slider .jcarousel-next-horizontal { top: 30px; background-position: 6px 7px; } .client_slider .jcarousel-prev-horizontal { top: 100px; background-position: 6px -40px; } /* =============================================================================================================== 09 FOOTER LAYOUT =============================================================================================================== */ #footer { position: relative; width: 100%; } .client_slider_enabled #footer { padding-top: 80px; } #footer_toolbar { z-index: 60; padding: 3px 0; width: 100%; } #footer_banner { position: absolute; top: 0; left: 0; z-index: 50; width: 220px; height: 100%; } .footer_slogan { padding: 40px 15px 0 15px; } .footer_tagline { position: absolute; bottom: 20px; left: 0; padding: 0 15px; } .footer_slogan_disabled .footer_widget { width: 100% !important; } .footer_widget { float: right; padding-top: 30px; width: 720px; } #footer_nav { display: inline-block; float: right; margin-top: 20px; } #footer_nav ul { margin: 0; padding: 0; } #footer_nav li { float: left; margin: 0; padding: 0 6px; list-style: none; } #footer_nav a { color: #999999; text-transform: uppercase; font-size: 10px; } /* =============================================================================================================== 10 FOOTER NAVIGATION =============================================================================================================== */ .copyright { float: left; margin: 20px 0 0 5px; text-transform: uppercase; font-size: 10px; } .sub_footer_logo { display: block; float: left; width: 150px; height: 60px; } /* =============================================================================================================== 12 SLIDESHOW =============================================================================================================== */ /* #home .anythingWindow, #home #anything_slider li.panel, #home .anythingBase, #home .anythingSlider, #home #anything_slider_loading{height:410px !important; */ /* } #iPadHome .anythingWindow, #iPadHome #anything_slider li.panel, #iPadHome .anythingBase, #iPadHome .anythingSlider, #iPadHome #anything_slider_loading {height: 300px !important; */ /* } #iphoneHome .anythingWindow, #iphoneHome #anything_slider li.panel, #iphoneHome .anythingBase, #iphoneHome .anythingSlider, #iphoneHome #anything_slider_loading{height:250px !important; */ .anythingslider .inner { margin: 0 auto !important; padding: 0 !important; } .anythingslider { position: relative; z-index: 70; display: block; overflow: visible !important; margin: 0 auto 0 auto; } .anythingslider_wrapper { position: relative; overflow: hidden; } #anything_slider_loading { position: absolute; top: 0px; z-index: 65; background: url("../images/loading.gif") no-repeat 50% 50%; } .boxed_layout .inner.with_desc_wrapper { padding: 0 30px !important; } .anything_item { position: relative; width: 100%; } #anything_slider { display: none; } .anythingSlider { position: relative; display: block; overflow: visible !important; margin: 0 auto; padding: 0; } .anythingSlider .anythingBase { position: absolute; top: 0; left: 0; overflow: visible !important; margin: 0; padding: 0; background: transparent; list-style: none; } .anythingSlider .anythingWindow { position: relative; overflow: hidden; width: 100%; height: 100%; } .anythingBase .panel { display: block; float: left; overflow: hidden; margin: 0; padding: 0; background: transparent; } .anythingBase .vertical .panel { float: none; } .anythingSlider .arrow span { display: block; visibility: hidden; } .anythingSlider .arrow.disabled { display: none; } .anythingSlider .fade .panel { position: absolute; top: 0; left: 0; float: none; opacity: 0; filter: alpha(opacity=0); } .anythingSlider .fade .activePage { z-index: 2; opacity: 1; filter: alpha(opacity=100); } /* Navigation Arrows */ .control_minimal_style .anythingSlider .arrow { top: 50%; bottom: auto; margin-top: -40px; } div.anythingSlider .arrow { position: absolute; bottom: 0; z-index: 100; display: block; } div.anythingSlider .arrow a { display: block; width: 40px; height: 40px; outline: 0; background: #f1f1f1 url('../images/slider_arrows.png') no-repeat; text-align: center; } div.anythingSlider .arrow a:hover { opacity: 1; } /* Navigation Links */ div.anythingSlider .anythingControls { position: relative; z-index: 70; outline: 0; } .control_minimal_style .anythingControls ul { width: 100%; background: none !important; text-align: center; } .anythingControls ul { margin: -40px 0 0 0; padding: 18px 20px 0 0; width: 30%; height: 25px; text-align: right; } div.anythingSlider .anythingControls ul li { display: inline; } div.anythingSlider .anythingControls ul a { position: relative; z-index: 60; display: inline-block; margin: 0; width: 11px; height: 11px; background-image: url(../images/slider_pagination.png); background-position: -21px center; text-align: left; text-indent: -100000px; } div.anythingSlider .anythingControls ul a:hover { background-position: -42px center; } div.anythingSlider .anythingControls ul a.cur { background-position: 0px center; } div.anythingSlider .anythingControls .anythingNavWindow { float: left; overflow: hidden; } div.anythingSlider .arrow a span { display: block; visibility: hidden; } div.anythingSlider .back { left: 30%; margin-left: 20px; } .control_minimal_style .anythingSlider .back { left: 0; margin: 0; } div.anythingSlider .back a { background-position: left bottom; } div.anythingSlider .back a:hover { background-position: right top; } div.anythingSlider .back.disabled { display: none; } .control_minimal_style .anythingSlider .forward { right: 0; left: auto; margin: 0; } div.anythingSlider .forward { left: 30%; margin-left: 63px; } div.anythingSlider .forward a { background-position: left top; } div.anythingSlider .forward a:hover { background-position: right bottom; } div.anythingSlider .forward.disabled { display: none; } div.anythingSlider .full_image { display: block; margin: 0 auto; padding: 0; outline: 0; } div.anythingSlider .desc_box { float: left; margin-bottom: 60px; width: 340px; text-align: left; } .with_description .slide_image { position: relative; display: block; float: right; padding: 0; outline: 0; } div.anythingSlider .video-wrapper { float: right; margin: 0; width: 530px; } div.anythingSlider .full_width .video-wrapper { width: 100%; height: 410px; } div.anythingSlider .full_width .video-wrapper .video-container { padding-bottom: 22%; } div.anythingSlider .with_caption .with_caption_image { } div.anythingSlider .with_caption .desc_box { width: 400px; } div.anythingSlider .with_caption_wrapper { position: absolute; top: 0; left: 50%; margin-left: -480px !important; } .with_description.anything_item { overflow: hidden; } div.anythingSlider h2 { font-weight: normal !important; font-size: 36px !important; } div.anythingSlider p { margin-bottom: 15px; font-size: 11px !important; line-height: 18px !important; opacity: 0.7; } div.anythingSlider p:before { display: block; margin-bottom: 10px; width: 70px; height: 4px; background: #fff; content: " "; } div.anythingSlider .button { } /* FLEXSLIDER */ .boxed.flexslider_slideshow { margin: 20px auto; } .flexslider_slideshow .inner { padding: 0 !important; } @media only screen and (max-width: 1000px) { .flexslider_slideshow { margin-top: 0; } } /* Control Nav */ .flexslider_slideshow.fade .flex-control-nav { bottom: -35px; } .flexslider_slideshow.slide .flex-control-nav { bottom: 0px; } .flexslider_slideshow .flex-control-nav { position: absolute; z-index: 50; display: block !important; width: 100%; text-align: center; } .flexslider_slideshow .flex-control-nav li { display: inline-block; margin: 0 0 0 8px; zoom: 1; *display: inline; } .flexslider_slideshow .flex-control-nav li:first-child { margin: 0; } .flexslider_slideshow .flex-control-nav li a { display: block; width: 11px; height: 11px; background-image: url(../images/slider_pagination_dark.png); background-position: -21px center; text-indent: -999em; cursor: pointer; } .flexslider_slideshow .flex-control-nav li a:hover { background-position: -42px center; } .flexslider_slideshow .flex-control-nav li a.active { background-position: 0 center; cursor: default; } .flexslider_slideshow .flex-caption { background: none; -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); zoom: 1; } .flexslider_slideshow .flex-caption { position: absolute; bottom: 30px; left: 0px; margin: 0; padding: 25px; width: 400px; background: rgba(0,0,0,.3); color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.3); } .boxed.flexslider_slideshow .flex-caption { left: 50px; } .flexslider_slideshow .flex-caption h2, .flexslider_slideshow .flex-caption p { color: #fff !important; } .flexslider_slideshow .flex-caption .button { margin: 0; } @media only screen and (max-width: 768px) { .flex-caption { display: none; } } @media only screen and (max-width: 1020px) { .boxed.flexslider_slideshow { margin: 0; } } /* LayerSlider Default Skin */ .layer_slider_responsive_wrapper { display: none; margin: 0 auto; width: 960px; } .layer_slider_responsive_wrapper img { display: block; margin: 0; padding: 0; } .ls-inner { position: relative; } .ls-inner, .ls-layer { overflow: hidden; width: 100%; height: 100%; } .ls-layer { position: absolute; display: none; background-position: center center; } .ls-active, .ls-animating { display: block !important; } .ls-layer > * { position: absolute; top: 0px; left: 0px; } .ls-layer .ls-bg { top: 50%; left: 50%; } .ls-bottom-nav-wrapper { z-index: 2; height: 0px; } .ls-nav-start, .ls-nav-stop { display: none; } .ls-bottom-nav-wrapper a, .ls-nav-prev, .ls-nav-next { outline: none; } .ls-vpcontainer { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; } .ls-videopreview { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; cursor: pointer; } .ls-playvideo { position: absolute; top: 50%; left: 50%; cursor: pointer; } /* WP plugin forceResponsive */ .ls-wp-forceresponsive-container { position: relative; width: 100%; } .ls-wp-forceresponsive-helper { position: absolute; margin-left: 50%; } #main { overflow: visible !important; } .ls-bottom-nav-wrapper { position: absolute; bottom: 12px; left: 0; width: 100%; height: 25px; text-align: left; } .ls-bottom-slidebuttons { display: inline-block; padding: 13px 10px 0 0; width: 30%; height: 30px; text-align: right; } .ls-playvideo { margin-top: -25px; margin-left: -25px; width: 50px; height: 50px; } .ls-playvideo, .ls-nav-sides, .ls-bottom-slidebuttons a { background-image: url(../images/skin.png); } .ls-nav-prev, .ls-nav-next { position: absolute; bottom: 0px; left: 30%; z-index: 1000; display: block; width: 40px; height: 40px; outline: 0; background: #f1f1f1 url('../images/slider_arrows.png') no-repeat; text-align: center; } .ls-nav-prev { margin-left: 10px; } .ls-nav-next { margin-left: 53px; } .ls-minimal-style .ls-nav-prev, .ls-minimal-style .ls-nav-next { position: absolute; top: 50%; display: block; margin-top: -40px; width: 40px; height: 40px; outline: 0; background: #f1f1f1 url('../images/slider_arrows.png') no-repeat; text-align: center; } .ls-playvideo { background-position: -300px -150px; } .ls-playvideo:hover, .ls-vpcontainer:hover .ls-playvideo { background-position: -375px -150px; } .ls-nav-prev { background-position: left bottom; } .ls-nav-prev:hover { background-position: right top; } .ls-nav-next { background-position: left top; } .ls-nav-next:hover { background-position: right bottom; } .ls-bottom-slidebuttons a { display: block; margin: 5px; background-image: url(../images/slider_pagination.png); background-position: -21px center; ; } .ls-bottom-slidebuttons a:hover { background-position: -42px center; } .ls-bottom-slidebuttons a.ls-nav-active { background-position: 0px center; } .ls-nav-sideleft { background-position: -150px -150px; } .ls-nav-sideright { background-position: -225px -150px; } .ls-bottom-slidebuttons a, .ls-bottom-nav-wrapper, .ls-nav-sides { height: 28px; } .ls-bottom-slidebuttons a, .ls-nav-sides { display: inline-block; } .ls-bottom-slidebuttons a { width: 11px; height: 11px; } .ls-nav-sides { width: 6px; } /* =============================================================================================================== 14 BLOG LAYOUT =============================================================================================================== */ ul.blog_loop { overflow: hidden; margin-left: 0; } .shortcode_blog { margin: 0 !important; padding: 0 !important; } .blog_loop article { position: relative; margin-bottom: 40px; list-style: none; } .classic.blog_loop article { margin-bottom: 60px; } .blog_loop article h1, .newspaper h1 { margin-bottom: 15px; padding: 0; font-size: 16px; line-height: 18px; } .blog_loop article h1:after { display: block; margin: 10px 0 10px 0; width: 90px; height: 3px; content: ""; } .blog_meta { display: block; border-top: 1px solid rgba(0,0,0, 0.1); } .blog_post_type, .meta_time { display: block; float: left; width: 40px; height: 40px; } .blog_post_type.document { background: url(../images/postype_icons.png) 10px 7px no-repeat; } .blog_post_type.video { background: url(../images/postype_icons.png) -45px 6px no-repeat; } .blog_post_type.sound { background: url(../images/postype_icons.png) 10px 7px no-repeat; } .blog_post_type.image { background: url(../images/postype_icons.png) -195px 5px no-repeat; } .meta_time { margin-left: 4px; padding-top: 4px; height: 36px; background: #cdcdcd; } .meta_time span { display: block; color: #fff; text-align: center; font-size: 13px; line-height: 15px; } .blog_permalink, .blog_comment { float: right; margin-top: 10px; padding: 0 20px 0 15px; } .blog_permalink { background: url(../images/permalink_icon.png) left center no-repeat; } .blog_comment { background: url(../images/comment_icon.png) left center no-repeat; } .blog_video_type { margin-bottom: 20px; } .newspaper .blog_video_type { margin: 15px 10px; } .classic_thumb .blog_info_container { float: left; margin-left: 20px; width: 320px; } .full_layout .classic_thumb .blog_info_container { margin-left: 50px; width: 510px; } .newspaper { padding-bottom: 20px; } .newspaper article { margin: 0; padding: 0 0 15px 0; border: 1px solid rgba(0,0,0, 0.2); background-color: #fafafa; -webkit-box-shadow: 0 3px 0 rgba(0, 0, 0, .06); -moz-box-shadow: 0 3px 0 rgba(0, 0, 0, .06); box-shadow: 0 3px 0 rgba(0, 0, 0, .06); -o-box-shadow: 0 3px 0 rgba(0, 0, 0, .06); } .newspaper .newspaper_column { margin: 0 14px 16px 0; padding: 0; width: 222px; } .newspaper .blog_post_type { margin-left: 10px; } .newspaper .image_container { margin: 15px 10px 0 10px; } .newspaper article h1 { font-weight: normal !important; font-size: 14px !important; line-height: 16px; } .newspaper article h1:after { width: 90px; height: 4px; } .newspaper .blog_excerpt, .newspaper h1 { margin: 0 10px; } .newspaper .blog_excerpt p { margin-bottom: 0; font-size: 11px !important; line-height: 18px; } .newspaper .blog_meta { display: block; clear: both; overflow: hidden; margin-bottom: 15px; padding: 10px 0; border-top: none; border-bottom: 1px solid rgba(0,0,0, 0.1); text-align: center; } .newspaper .blog_meta span { display: inline-block; float: none; margin-top: 0; padding-right: 5px; } .newspaper_comments { margin-top: 20px; padding: 20px 10px 0 10px; border-top: 1px solid rgba(0,0,0, 0.1); } .newspaper_comments ul, .newspaper_comments li { margin: 0; padding: 0; list-style: none; } .newspaper_comment_info { float: left; margin: 0 0 5px 10px; width: 150px; } .newspaper_comments .avatar { float: left; } .newspaper_comment_info:after { display: block; margin: 10px 0 10px 20px; width: 80px; height: 2px; background: rgba(0,0,0, 0.1); content: ""; } .newspaper_comment_content { display: block; font-size: 11px; line-height: 16px !important; } .newspaper_comment_content:after { content: " ..."; } .view_all_comments { display: block; text-align: center; } #load_more_posts { position: relative; display: block; margin: 40px 0 20px 0; padding: 10px; border: 1px solid rgba(0,0,0, 0.2); background: rgba(0,0,0, 0.1); -webkit-box-shadow: 0 3px 0 rgba(0, 0, 0, .06); box-shadow: 0 3px 0 rgba(0, 0, 0, .06); cursor: pointer; -o-box-shadow: 0 3px 0 rgba(0, 0, 0, .06); } #load_more_posts .text { padding-left: 15px; background: url(../images/loadmore_plus.png) left center no-repeat; text-transform: uppercase; font-weight: 700; font-size: 13px; } #load_more_posts:hover { background: rgba(0,0,0, 0.15); } #load_more_posts:active { margin: 42px 0 22px 0; } #infscr-loading { position: absolute; top: 12px; right: 10px; display: none; width: 16px; height: 16px; background: url(../images/loading_small.gif); } /* =============================================================================================================== 15 SINGLE POST PAGE =============================================================================================================== */ .single { padding: 10px 0; } .single .blog_title, .blog_title_heading { margin-bottom: 30px; line-height: 16px; } .single .blog_title a, .blog_title_heading a { font-weight: normal !important; font-size: 18px; line-height: 16px; } .single .blog_title:after { display: block; margin: 10px 0; width: 120px; height: 4px; content: " "; } .single.enabled_meta .single_right_section { float: right; width: 480px; } .full_layout .single.enabled_meta .single_right_section { float: right; width: 800px; } .single .blog_meta { float: left; width: 150px; } .single .blog_meta { border: none !important; } .single .blog_meta .blog_post_type { margin-left: 30px; } .single .blog_meta a,.blog_permalink a,.blog_author a, .blog_comment a { color: #aaaaaa !important; font-size: 11px; } .single .blog_meta .blog_author, .single_bottom_meta .blog_author { margin-top: 15px !important; background: url(../images/author_icon.png) left center no-repeat; } .single .blog_meta .blog_author, .single .blog_meta .blog_comment, .single .blog_meta .blog_permalink { float: left; margin: 0 0 4px 30px; padding: 0 0 0 20px; } .single .post_tags { margin-bottom: 30px; color: #aaaaaa; } .single .post_tags a { color: #aaaaaa !important; font-style: italic; font-size: 11px; } .single .post_tags { padding: 5px 0 5px 20px; background: url('../images/tags_icon.png') left 10px no-repeat; } .single_bottom_meta { margin-bottom: 40px; padding: 20px 0 10px 0; border: 1px solid rgba(0,0,0,0.1); border-right: none; border-left: none; } .single_bottom_meta .share_buttons { float: left; } .single_bottom_meta .blog_permalink, .single_bottom_meta .blog_author { float: right; margin: 0 10px 0 0 !important; padding: 0 0 0 20px; } .single_bottom_meta { } /* RELATED POSTS, POPULAR POSTS, RECENT POSTS */ .single_post_list { overflow: hidden; margin-bottom: 30px; } .single_post_list h4 { margin: 0 auto 30px auto; text-align: center; font-weight: 800 !important; font-size: 16px !important; } .single_post_list h4:after, .single_post_list h4:before { display: inline-block; margin-bottom: 5px; width: 120px; height: 1px; background: rgba(0,0,0, 0.4); content: ""; } .single_post_list h4:after { margin-left: 20px; } .single_post_list h4:before { margin-right: 20px; } .single_post_list ul { margin: 0; list-style: none; } .single_post_list li { float: left; margin: 0; padding: 0 15px 20px 0; width: 200px; list-style: none; } .full_layout .single_post_list li { padding: 0 25px 20px 0; width: 220px; } .single_post_list li:last-child { padding-right: 0 !important; } .single_post_list .image_container { margin-bottom: 15px; } .single_post_list .title { display: block; text-align: center; text-transform: uppercase; font-size: 12px; } /* ABOUT POST AUHTOR BOX */ .post_author_box { margin: 30px 0; } .post_author_box h3 { font-weight: 800 !important; font-size: 16px !important; line-height: 16px; } .post_author_box h3:after { display: block; margin: 10px 0 20px; width: 60px; height: 4px; content: ""; } .post_author_box .avatar { display: block; float: left; margin: 0 30px 10px 0; } .full_layout .post_author_box .author_info { width: 500px; } .post_author_box .author_info { width: 360px; } .post_author_box .post_author_name { font-weight: bold; } .classic .post_author_box .post_author_name a { color: #6c6c6c; } .modern .post_author_box .post_author_name a { color: #e6e6e6; } .post_author_box .author_info { display: block; float: left; padding-bottom: 10px; font-size: 12px; } .post_author_box .author_desc { margin-bottom: 25px; } .post_author_box .author_links { margin: 10px 0 0 0; padding: 0; } .post_author_box .author_links li { display: inline-block; float: left; margin: 0; padding: 0; } .post_author_box .author_links li a { display: block; margin-right: 7px; width: 16px; height: 12px; background-image: url(../images/about_author_icons.png); } .post_author_box .author_links li a.rss { background-position: -86px 0; } .post_author_box .author_links li a.email { background-position: 0px 0; } .post_author_box .author_links li a.website { background-position: -58px 0; } .post_author_box .author_links li a.twitter { background-position: -28px 0; } /* BLOG PREVIOUS & NEXT NAVIGATION */ .blog_pagination { margin-bottom: 40px; } .blog_pagination .next a, .blog_pagination .previous a { display: block; width: 42px; height: 42px; background: #afafaf url(../images/next_prev_arrows.png) no-repeat; } .blog_pagination .previous a { float: left; background-position: 16px center; } .blog_pagination .next a { float: right; background-position: -45px center; } /* WP-PAGENAVI */ .wp-pagenavi { clear: both; margin-bottom: 30px; text-align: center; letter-spacing: 1.5px; font-size: 12px; } .wp-pagenavi .pages { color: #989898; } .wp-pagenavi .page, .wp-pagenavi .current { display: block; float: left; margin: 0; padding: 0 7px; height: 25px; border-left: 1px solid rgba(0,0,0,0.1); color: #999999; line-height: 25px; } .wp-pagenavi .current { color: #000 !important; font-weight: bold; } .previouspostslink, .nextpostslink { display: block; float: left; width: 25px; height: 25px; background: rgba(0,0,0,0.1) url(../images/next_prev_arrows.png) 7px center no-repeat; text-indent: -10000px; line-height: 25px; } .nextpostslink { background-position: -54px center; } .previouspostslink:hover, .nextpostslink:hover { background-color: rgba(0,0,0,0.2); } /* =============================================================================================================== 16 COMMENT THREAD =============================================================================================================== */ #comments { padding-top: 20px; } #comments a { color: #5c5c5c; } #comments ul { list-style-type: none; } .commentlist { margin: 0 0 30px 0; padding-bottom: 30px; border-bottom: 1px dotted rgba(0,0,0,0.2); } .commentlist ul { margin-left: 20px; } .commentlist li { margin: 0; } .comment_wrap { position: relative; overflow: visible; margin-bottom: 10px; padding: 20px 0; } #comments #comments_title { margin-bottom: 15px; font-size: 16px !important; } .pings_title { margin-top: 40px; } .comment-reply-link { display: block; padding: 4px 13px; font-size: 11px; } .gravatar { position: relative; z-index: 80; float: left; margin-right: 20px; height: 66px; } .gravatar .avatar { width: 60px; height: 60px; } .comment_content { position: relative; overflow: hidden; padding-left: 20px; border-left: 1px solid rgba(0,0,0,0.1); } .commentlist li ul li { padding-left: 25px; border: none !important; } .commentlist li ul li .comment_wrap { padding: 10px 0 !important; } .nocomments { margin: 0; padding: 0; text-align: center; } .comment_author { color: #5c5c5c; font-weight: bold; font-style: normal; font-size: 12px; } .comment_author span { display: none; } .comment_time { padding-left: 10px; color: #9d9d9d; font-size: 12px; } .comment_text { clear: both; overflow: hidden; padding: 10px 0; } .comment_text p { margin: 0; font-size: 11px; } .comments_navigation { clear: both; overflow: hidden; margin: 20px 0; } .comments_navigation .nav_previous { float: left; } .comments_navigation .nav_next { float: right; } #respond { margin-top: 20px; } .fancy_arrow { display: none; } #respond #comment { width: 95%; height: 200px; } .cancel_comment_reply { margin-bottom: 6px; } .logged { display: inline-block; padding-bottom: 10px; font-size: 12px; } .unapproved { color: #ccc; text-transform: uppercase; } .comment-edit-link { float: right; font-size: 11px; } .reply { padding-top: 5px; text-align: center; } #respond label { display: block; margin-bottom: 5px; } #respond .section_row, .content .section_row { float: left; width: 33%; } #respond .section_row .text_input, .content .section_row .text_input { padding: 10px 6px; width: 90%; } #respond .comment_textarea { margin-bottom: 20px; } #respond .button { margin-left: 0; } #respond .text_input, #respond textarea.textarea, .contact_form.shortcode .text_input, .contact_form.shortcode textarea.textarea { border: 1px solid rgba(0,0,0, 0.15); background-color: rgba(0,0,0,0.02); color: #676767; } #respond .text_input:focus, #respond textarea.textarea:focus, .contact_form.shortcode .text_input:focus, .contact_form.shortcode textarea.textarea:focus { border: 1px solid rgba(0,0,0, 0.25); background-color: rgba(0,0,0,0.01); } /* ColorBox Core Style: The following CSS is consistent between example themes and should not be altered. */ #colorbox, #cboxOverlay, #cboxWrapper { position: absolute; top: 0; left: 0; z-index: 9999; overflow: hidden; } #cboxOverlay { position: fixed; width: 100%; height: 100%; } #cboxMiddleLeft, #cboxBottomLeft { clear: left; } #cboxContent { position: relative; } #cboxLoadedContent { overflow: auto; } #cboxTitle { margin: 0; } #cboxLoadingOverlay, #cboxLoadingGraphic { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow { cursor: pointer; } .cboxPhoto { display: block; float: left; margin: auto; border: 0; } .cboxIframe { display: block; width: 100%; height: 100%; border: 0; } #colorbox, #cboxContent, #cboxLoadedContent { box-sizing: content-box; } /* User Style: Change the following styles to modify the appearance of ColorBox. They are ordered & tabbed in a way that represents the nesting of the generated HTML. */ #cboxOverlay { background: #000; } #colorbox { } #cboxContent { overflow: hidden; background: #fff; } .cboxIframe { position: relative; z-index: 10; background: #f3f3f3; } #cboxError { padding: 50px; border: 1px solid #ccc; } #cboxLoadedContent { margin-bottom: 52px; } #cboxTitle { position: absolute; bottom: 15px; left: 20px; color: #151515; } #cboxCurrent { position: absolute; top: 10px; left: 14px; color: #fff; font-size: 11px; opacity: 0.6; } #cboxSlideshow { position: absolute; right: 30px; bottom: 4px; color: #0092ef; } #cboxPrevious { position: absolute; top: 50%; left: 0; z-index: 200; margin-top: -43px; width: 43px; height: 43px; background: url(../images/next_prev_arrows.png) no-repeat 16px center; text-indent: -9999px; } #cboxPrevious:hover, #cboxNext:hover { } #cboxNext { position: absolute; top: 50%; right: 0; z-index: 200; margin-top: -43px; width: 43px; height: 43px; background: url(../images/next_prev_arrows.png) no-repeat -45px center; text-indent: -9999px; } #cboxLoadingOverlay { background: #fff; } #cboxLoadingGraphic { background: url(../images/loading.gif) no-repeat center center; } #cboxClose { position: absolute; right: 20px; bottom: 15px; width: 19px; height: 19px; background: url(../images/lightbox_close.png) no-repeat left center; text-indent: -9999px; } #cboxClose:hover { background-position: right center; } .google_map { margin: 0; padding: 0; height: 100%; }