/* Theme Name: Showoff Theme URI: http://themeforest.net/user/ThemesLab Description: A Premium Theme for Wordpress. Author: ThemesLab Author URI: http://themeforest.net/user/ThemesLab Version: 1.0 License: GNU General Public License version 3.0 License URI: http://www.gnu.org/licenses/gpl-3.0.html Tags: gallery, photography, portfolio, modern, jquery, ajax, fullscreen, animations, wordpress theme, responsive, grid, powerful, stylish, creative, isotope */ /* WordPress Default Classes */ /* Body Classes */ .rtl {} .home {} .blog {} .archive {} .date {} .search {} .paged {} .attachment {} .error404 {} .single postid-(id) {} .attachmentid-(id) {} .attachment-(mime-type) {} .author {} .author-(user_nicename) {} .category {} .category-(slug) {} .tag {} .tag-(slug) {} .page-parent {} .page-child parent-pageid-(id) {} .page-template page-template-(template file name) {} .search-results {} .search-no-results {} .logged-in {} .paged-(page number) {} .single-paged-(page number) {} .page-paged-(page number) {} .category-paged-(page number) {} .tag-paged-(page number) {} .date-paged-(page number) {} .author-paged-(page number) {} .search-paged-(page number) {} /* Post styles */ .post-id {} .post {} .page {} .attachment {} .sticky {} .hentry {} .category-misc {} .category-example {} .tag-news {} .tag-wordpress {} .tag-markup {} .format-image {} .format-gallery {} .format-chat {} .format-link {} .format-quote {} .format-status {} .format-video {} /* Menu Items */ #header .main-menu{} // container class #header .main-menu ul {} // container class first unordered list #header .main-menu ul ul {} //unordered list within an unordered list #header .main-menu li {} // each navigation item #header .main-menu li a {} // each navigation item anchor #header .main-menu li ul {} // unordered list if there is drop down items #header .main-menu li li {} // each drop down navigation item #header .main-menu li li a {} // each drap down navigation item anchor .current_page_item{} // Class for Current Page .current-cat{} // Class for Current Category .current-menu-item{} // Class for any other current Menu Item .menu-item-type-taxonomy{} // Class for a Category .menu-item-type-post_type{} // Class for Pages .menu-item-type-custom{} // Class for any custom item that you added .menu-item-home{} // Class for the Home Link /* WYSIWYG */ .entry-content img {} .alignleft, img.alignleft {} .alignright, img.alignright {} .aligncenter, img.aligncenter {} .alignnone, img.alignnone {} .wp-caption {} .wp-caption img {} .wp-caption p.wp-caption-text {} .wp-smiley {} blockquote.left {} blockquote.right {} .gallery dl {} .gallery dt {} .gallery dd {} .gallery dl a {} .gallery dl img {} .gallery-caption {} .size-full {} .size-large {} .size-medium {} .size-thumbnail {} /* Widgets */ .widget {} #searchform {} .widget_search {} .screen-reader-text {} .widget_meta {} .widget_meta ul {} .widget_meta ul li {} .widget_meta ul li a {} .widget_links {} .widget_links ul {} .widget_links ul li {} .widget_links ul li a {} .widget_archive {} .widget_archive ul {} .widget_archive ul li {} .widget_archive ul li a {} .widget_archive select {} .widget_archive option {} .widget_pages {} .widget_pages ul {} .widget_pages ul li {} .widget_pages ul li a {} .widget_links {} .widget_links li:after {} .widget_links li:before {} .widget_tag_cloud {} .widget_tag_cloud a {} .widget_tag_cloud a:after {} .widget_tag_cloud a:before {} .widget_calendar {} #calendar_wrap {} #calendar_wrap th {} #calendar_wrap td {} #wp-calendar tr td {} #wp-calendar caption {} #wp-calendar a {} #wp-calendar #today {} #wp-calendar #prev {} #wp-calendar #next {} #wp-calendar #next a {} #wp-calendar #prev a {} .widget_categories {} .widget_categories ul {} .widget_categories ul li {} .widget_categories ul ul.children {} .widget_categories a {} .widget_categories select{} .widget_categories select#cat {} .widget_categories select.postform {} .widget_categories option {} .widget_categories .level-0 {} .widget_categories .level-1 {} .widget_categories .level-2 {} .widget_categories .level-3 {} .recentcomments {} #recentcomments {} #recentcomments li {} #recentcomments li a {} .widget_recent_comments {} .widget_recent_entries {} .widget_recent_entries ul {} .widget_recent_entries ul li {} .widget_recent_entries ul li a {} .textwidget {} .widget_text {} .textwidget p {} .widget_pages ul, .widget_archive ul {} /* Comments */ .commentlist .reply {} .commentlist .reply a {} .commentlist .alt {} .commentlist .odd {} .commentlist .even {} .commentlist .thread-alt {} .commentlist .thread-odd {} .commentlist .thread-even {} .commentlist li ul.children .alt {} .commentlist li ul.children .odd {} .commentlist li ul.children .even {} .commentlist .vcard {} .commentlist .vcard cite.fn {} .commentlist .vcard span.says {} .commentlist .vcard img.photo {} .commentlist .vcard img.avatar {} .commentlist .vcard cite.fn a.url {} .commentlist .comment-meta {} .commentlist .comment-meta a {} .commentlist .commentmetadata {} .commentlist .commentmetadata a {} .commentlist .parent {} .commentlist .comment {} .commentlist .children {} .commentlist .pingback {} .commentlist .bypostauthor {} .commentlist .comment-author {} .commentlist .comment-author-admin {} .commentlist {} .commentlist li {} .commentlist li p {} .commentlist li ul {} .commentlist li ul.children li {} .commentlist li ul.children li.alt {} .commentlist li ul.children li.byuser {} .commentlist li ul.children li.comment {} .commentlist li ul.children li.depth-{id} {} .commentlist li ul.children li.bypostauthor {} .commentlist li ul.children li.comment-author-admin {} #cancel-comment-reply {} #cancel-comment-reply a {} /* WordPress Default Classes end */ /* Fonts ============================*/ @import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700); h1, h2, h3, h4, h5, h6, .blog_header a { font-family: 'Open Sans Condensed', 'HelveticaNeue', Helvetica, Arial, sans-serif; color: #5b5b5b; text-transform: uppercase; clear: both; } p, .work, .count, li, a, time, .dm { font-family: 'HelveticaNeue', Helvetica, Arial, sans-serif; color: #5b5b5b; line-height: 22px; } a { text-decoration: none; transition:opacity 0.3s; -moz-transition:opacity 0.3s; -webkit-transition:opacity 0.3s; -o-transition:opacity 0.3s !important; } #container a { transition: color 0.3s; -moz-transition: color 0.3s; -webkit-transition: color 0.3s; -o-transition: color 0.3s !important; } #container .emm-page a { color: #5B5B5B; } #container .emm-page a:hover { color: white; } #container a:hover { color: #5b5b5b; } .emm-page a:hover { color: white; } .icon > a:hover { background-color: transparent !important; } p > a { text-decoration: underline; } h1 { font-size: 28px; margin-bottom: 2px; } h2 { font-size: 24px; margin-bottom: 3px; margin-top: 20px; } h3 { font-size: 20px; margin-bottom: 4px; margin-top: 20px; } h4 { font-size: 16px; margin-bottom: 5px; margin-top: 20px; } h5 { font-size: 13px; margin-bottom: 6px; margin-top: 20px; } h6 { font-size: 11px; margin-bottom: 7px; margin-top: 20px; } p { font-size: 13px; } time { font-size: 12px; } span.work { font-size: 13px; color: #5b5b5b; text-transform: uppercase; } span.count { font-size: 11px; color: #5b5b5b; } .dm { font-size: 13px; } hr { border: none; border-bottom: 1px solid #cccccc; box-shadow: 0px 1px 1px rgba(255, 255, 255, 0.5); } *::selection { background: #df8259; /* Safari */ color: #f5f5f5; } *::-moz-selection { background: #df8259; /* Firefox */ color: #f5f5f5; } /* Reset ============================*/ * { margin: 0; } html { height: auto !important; } header, nav { display: block; } table { width: 100%; } table tr { background-color: #fff; } table tr:first-child { background-color: #EBEBEB; } /* Global ============================*/ body { background: #3f3f3f url(images/noise.png) repeat; position: relative; } #container { height: 100%; visibility: hidden; position: relative; overflow: hidden; } #container img { max-width: 100%; height: auto; } #container figure img { max-width: inherit; } #content { height: 100%; } .clearBoth { clear:both; } #primary { padding-bottom: 1px; } input:focus, textarea:focus { border: 1px solid #df8259; } .background-image { display: none; } /* Header ============================*/ header { background-color: #f5f5f5; border-top: 4px solid #df8259; border-bottom: 4px solid #E9E9E9; height: 70px; position: relative; box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1); z-index: 100; } #logo { float: left; margin-top: 25px; margin-left: 31px; opacity: 1.0; transition:opacity 0.3s; -moz-transition:opacity 0.3s; -webkit-transition:opacity 0.3s; -o-transition:opacity 0.3s; } #logo:hover { opacity: 0.5; } #menu-main_menu { font-size: 15px; position: relative; z-index: 3; margin-top: 5px; } #menu-main_menu > li { height: 36px; } #menu-select-menu { display: none; width: 160px; height: 40px; position: absolute; top: 3px; right: 10px; } #active_follow { position: absolute; background-color: #df8259; height: 4px; top: 41px; z-index: 2; } #not_active_follow { top: 42px; right: 0px; height: 2px; position: absolute; background-color: #E4E4E4; z-index: 1; display: block; } #active_menu { height: 4px; background: #DF8259; position: absolute; z-index: 2; top: 41px; } nav { position: absolute; right: 10px; top: 13px; z-index: 1000; } nav li { background-color: #f5f5f5; list-style: none; float: left; } nav li a { display: block; padding: 6px 14px; text-decoration: none; } nav li ul { position: absolute; font-size: 13px; margin-left: -40px; display: none; width: 180px; /* Width to help Opera out */ padding-top: 16px; } nav li ul li { border-bottom: 1px solid #e9e9e9; box-shadow: none; display: block; position: relative; } nav li ul li:last-child { border: none; } nav li ul li a { margin: 0; } nav li:hover ul { /*display: block;*/ } nav li:hover li { float: none; } nav li:hover li a { } nav li li a:hover { color: #f5f5f5; background-color: #df8259; } nav li ul li ul { position: absolute; top: -16px; left: -180px; /*display: none !important;*/ } nav li ul li:hover ul { /*display: block !important;*/ } .current-menu-item { box-shadow: none; } .current-menu-item > a { font-weight: bold; background: #f5f5f5 url(images/menu_arrow_active.png) no-repeat right 16px; } .current-submenu-item { background-color: #df8259; } .current-submenu-item a { color: #f5f5f5 !important; } .current-page-ancestor { border-bottom: solid 4px #df8259; box-shadow: none; } .current-page-ancestor ul > .current-page-ancestor { border: none; } nav .menu-item a { color: #5b5b5b; } nav .menu_arrow { background: #f5f5f5 url(images/menu_arrow.png) no-repeat right 14px; margin-right: 14px; } nav .menu_arrow_active { background: #f5f5f5 url(images/menu_arrow_active.png) no-repeat right 14px; } nav .submenu_arrow { background: #f5f5f5 url(images/submenu_arrow.png) no-repeat 7px center; } nav .submenu_arrow_active > a { background: #df8259 url(images/submenu_arrow_active.png) no-repeat 7px center; color: #f5f5f5; } nav li > ul li a { padding: 12px 18px; line-height: 16px; } .current-menu-item > ul .current-menu-item { border-bottom: none !important; } .current-menu-item > ul li.current-menu-item a { background-image: none !important; color: #fff; font-weight: normal; } /* Footer ============================*/ footer { background-color: #ffffff; border-bottom: 4px solid #df8259; height: 67px; margin-bottom: -70px; width: 100%; position: absolute; bottom: 0; left: 0; font-family: 'HelveticaNeue', Helvetica, Arial, sans-serif; font-size: 12px; color: #5b5b5b; box-shadow: 0px -1px 1px rgba(0,0,0,0.2); z-index: 100; } /* Gallery ============================*/ .thumbnail { float: left; } /* Isotope Filtering ============================*/ .isotope-item { z-index: 2; } .isotope-hidden.isotope-item { pointer-events: none; z-index: 1; } /* Isotope CSS3 transitions ============================*/ .isotope, .isotope .isotope-item { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -ms-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; } .isotope { -webkit-transition-property: height, width; -moz-transition-property: height, width; -ms-transition-property: height, width; -o-transition-property: height, width; transition-property: height, width; } .isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; -ms-transition-property: -ms-transform, opacity; -o-transition-property: top, left, opacity; transition-property: transform, opacity; } /* disabling Isotope CSS3 transitions ============================*/ .isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition { -webkit-transition-duration: 0s; -moz-transition-duration: 0s; -ms-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; } /* Portfolio ============================*/ .folio_item { float: left; overflow: hidden; } .folio_content { position: relative; } #folio_item_wrap { background-color: #f1f1f1; box-shadow: 0px -1px 1px rgba(0,0,0,0.1); } .folio_item_content { min-height: 250px; padding: 2%; width: 61%; float: left; border-right: 1px solid #cccccc; background-color: #fff; } .folio_item_navigation { width: 30.9%; float: right; padding: 2%; text-transform: capitalize; font-size: 13px; line-height: 22px; } .folio_overlay_hidden { display: none; } .folio_overlay { position: absolute; top: 0; left: 0; height: 100%; width: 100%; background-color: #000; opacity: 0.9; } .folio_overlay_text { position: absolute; top: 0; left: 0; height: 100%; width: 100%; text-align: center; } .folio_overlay_text h1 { color: #fff; font-size: 22px; } .folio_title { position: absolute; width: 100%; top: 50%; margin-top: -22px; } .folio_permalink { position: absolute; left: 50%; top: 85px; margin-left: -25px; height: 50px; width: 50px; background: url(images/link.png) center no-repeat; background-color: rgba(255, 255, 255, 0.2); } .folio_desc_icon { position: absolute; bottom: 23px; left: 20px; height: 17px; width: 17px; } .folio_one { background: url(images/photograph.png) center no-repeat; } .folio_two { background: url(images/gallery.png) center no-repeat; } .folio_three { background: url(images/video.png) center no-repeat; } .prev_post { height: 27px; width: 27px; background: url(images/next_prev_active.png) 11px 10px no-repeat; } .next_post { height: 27px; width: 27px; background: url(images/next_prev_active.png) -23px 10px no-repeat; } .back_post { height: 27px; width: 27px; background: url(images/portfolio.png) center no-repeat; } .square { background-color: #a0a1a3; margin: auto; } .squareActive { background-image: url(images/next_prev_active.png); } .post_navigation_text { display: block; width: 50px; text-align: center; margin: auto; padding-top: 5px; opacity: 0.65; } .folio_title_text { margin-top: -60px; display: block; opacity: 0.0; } .work { margin-top: 120px; display: block; opacity: 0.0; } #folio_graphic { position: relative; max-height: 80%; text-align: center; margin: auto; overflow: hidden; min-height: 400px; } .folio_fullsize_image { width: auto; height: auto; max-height: 80%; max-width: 100%; margin-bottom: -5px; display: none; } #folio_video_wrap { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .folio_fullsize_video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .folio_item_navigation a { font-size: 10px; color: #434343; width: 67px; float: left; display: block; margin-top: 23px; line-height: 14px; } .folio_single_navigation { margin-left: -12px; } /* Likes ============================*/ .post-like{ position: absolute; bottom: 20px; right: 20px; } span.count { display: block; float: left; } .like{ background:url(images/like.png) no-repeat 0 0; width: 13px; height: 13px; display: block; float:left; margin-right: 4px; opacity: 1.0; margin-top: 5px; } .liked{ background:url(images/liked.png) no-repeat 0 0; width: 12px; height: 12px; display: block; float:left; margin-right: 4px; opacity: 1.0; margin-top: 5px; } .post-like a:hover .like{ } .voted .liked, .post-like .alreadyvoted{ background: url(images/liked.png) no-repeat !important; } .portfolio_like_single { position: relative; } .portfolio_like_single .post-like { position: absolute; top: 0px; left: 37px; } .portfolio_like_single .post-like span { font-size: 13px; } .portfolio_like_single a { float: none; margin: 0; } .portfolio_like_single .like { background:url(images/like_single.png) no-repeat 0 0; } /* Columns ============================*/ .onehalf { width: 48%; padding: 4px 4% 0 0; float: left; } .onethird { width: 30.6%; padding: 4px 4% 0 0; float: left; } .onefourth { width: 22%; padding: 4px 4% 0 0; float: left; } .twothird { width: 65.4%; padding: 4px 4% 0 0; float: left; } .threefourth { width: 74%; padding: 4px 4% 0 0; float: left; } .last { padding-right: 0; } /* * jQuery Nivo Slider v3.0 * http://nivo.dev7studios.com * * Copyright 2012, Dev7studios * Free to use and abuse under the MIT license. * http://www.opensource.org/licenses/mit-license.php */ /* The Nivo Slider styles */ .nivoSlider { position:relative; width:100%; height:auto; overflow: hidden; max-height: 800px; } .nivoSlider img { height: auto !important; position:absolute; top:0px; left:0px; } .nivo-main-image { display: block !important; position: relative !important; width: 100% !important; } /* If an image is wrapped in a link */ .nivoSlider a.nivo-imageLink { position:absolute; top:0px; left:0px; width:100%; height:100%; border:0; padding:0; margin:0; z-index:6; display:none; } /* The slices and boxes in the Slider */ .nivo-slice { display:block; position:absolute; z-index:5; height:100%; top:0; } .nivo-box { display:block; position:absolute; z-index:5; overflow:hidden; } .nivo-box img { display:block; } /* Caption styles */ .nivo-caption { font-family: 'HelveticaNeue', Helvetica, Arial, sans-serif; color: #5b5b5b; line-height: 22px; font-size: 13px; position:absolute; left:0px; bottom:0px; background:#000; color:#fff; width:100%; z-index:8; padding: 5px 10px; opacity: 0.8; overflow: hidden; display: none !important; -moz-opacity: 0.8; filter:alpha(opacity=8); -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ } .nivo-caption p { padding:5px; margin:0; } .nivo-caption a { display:inline !important; } .nivo-html-caption { display:none; } /* Direction nav styles (e.g. Next & Prev) */ .nivo-directionNav a { position:absolute; top:50%; z-index:9; cursor:pointer; } .nivo-prevNav { margin-top: -33.5px; background: url(images/sliderNavigation.png) no-repeat; height: 67px; width: 67px; left:0px; opacity: 0.7; } .nivo-nextNav { margin-top: -33.5px; background: url(images/sliderNavigation.png) -67px 0px no-repeat; height: 67px; width: 67px; right:0px; opacity: 0.7; } .nivo-prevNav:hover { background-color: transparent !important; background: url(images/sliderNavigation.png) no-repeat; } .nivo-nextNav:hover { background-color: transparent !important; background: url(images/sliderNavigation.png) -67px 0px no-repeat; } /* Control nav styles (e.g. 1,2,3...) */ .nivo-controlNav { text-align:center; padding: 15px 0; position: relative; margin-top: -50px; z-index: 10; } .nivo-controlNav a { cursor:pointer; text-indent: -9999px; display: inline-block; background: url(images/slider_not_active.png); width: 13px; height: 13px; margin-right: 7px; } .nivo-controlNav a.active { background: url(images/slider_active.png); } .nivo-controlNav a:hover { background-color: transparent !important; } /* tab pane styling ======================*/ /* root element for tabs */ ul.tabs { list-style:none; margin:0 !important; margin-top: 10px !important; padding:0; height:30px; } /* single tab */ ul.tabs li {-webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none; cursor: pointer; padding: 5px 10px; margin-right: 5px; height: 19px; border: solid 1px #C2C2C2; background-color: #fff; float:left; text-indent:0; list-style-image:none !important; } ul.tabs li p { color: #c2c2c2; } ul.tabs li p:hover { color: #5B5B5B; } /* initially all panes are hidden */ .panes { border: 1px solid #C2C2C2; } .panes .pane { display:none; } .panes div { display:none; padding: 20px; background-color:#fff; } /* Toggle */ .toggle_wrap { margin: 10px 0; } .toggle_title { cursor: pointer; padding: 10px; border: solid 1px #C2C2C2;-webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none; } .toggle_title p { color: #9d9d9d; } .toggle_title p:hover { color: #5B5B5B; } .toggle_show { background: url(images/show.png) 97% center no-repeat #fff; } .toggle_show:hover { background: url(images/show_hover.png) 97% center no-repeat #fff; } .toggle_hide { background: url(images/hide.png) 97% center no-repeat #fff; } .toggle_hide:hover { background: url(images/hide_hover.png) 97% center no-repeat #fff; } .toggle { display: none; background-color: white; padding: 20px; border: solid 1px #C2C2C2; border-top: none; } /* Accordion */ .toggle_active { color: #5B5B5B !important; } .accordionToggle { margin-top: -1px; padding: 10px; background-color: white; border: solid 1px #C2C2C2; cursor: pointer; } .accordionToggle p { color: #9d9d9d; } .accordionToggle p:hover { color: #5B5B5B } .accordion { display: none; background-color: white; padding: 20px; border: solid 1px #C2C2C2; border-top: none; } /* Displaying Messages */ .dm { width: 100%; margin: 10px 0; padding: 8px 0px 8px 0px; font-weight: bold; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; background-repeat: no-repeat; background-position: 12px center; cursor: pointer; } .dm strong { margin-left: 36px } .warning { background-color: #fff2b5; border: 1px solid #c8ad5b; color: #92792a; background-image: url("images/warning.png"); } .info { background-color: #b4e0ff; border: 1px solid #6fa5cb; color: #266a9a; background-image: url("images/info.png"); } .succes { background-color: #ccedb8; border: 1px solid #6fad46; color: #4d7b2f; background-image: url("images/succes.png"); } .error { background-color: #edb8b8; border: 1px solid #c87373; color: #953c3c; background-image: url("images/error.png"); } /* Table */ table { text-align: center; border-collapse: collapse; } table td { padding: 10px; border: solid 1px #cccccc; margin: -1px; } td.header { background-color: #ebebeb; font-weight: bold; } /* Fullscreen slider */ #fs_slider { position: relative; } .fs_slide { display: none; position: absolute; left: 0; top: 0; width: 100%; } .fs_slide img { width: 100%; } /* Page ===========================*/ #background-img { display: none; background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; overflow: hidden; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; } #page { max-width: 880px; padding: 25px 35px 28px 35px; margin: 43px auto; background-color: rgba(255,255,255,0.92); outline: 5px solid rgba(233,233,233,0.6); } #page_graphic { outline: 5px solid rgba(233, 233, 233, 0.6); width: 950px; margin: 40px auto 2px auto; overflow: hidden; } #page_graphic .nivoSlider { max-height: 400px; } #page section { width: 67%; float: left; } #page article { margin-bottom: 20px; border-bottom: 1px solid #cccccc; } #page figure { margin-bottom: 19px; } #page time { display: block; margin-bottom: 17px; margin-top: 7px; } #page aside { width: 250px; float: right; display: block; font-size: 13px; margin-top: -16px; } #page aside h3 { font-size: 14px; border-bottom: 1px solid #cccccc; text-transform: uppercase; height: 28px; margin-bottom: 12px; } #page aside li { list-style: none; margin-bottom: 20px; } #page aside li ul { padding: 0; } #page aside li ul li { text-transform: capitalize; margin-bottom: 10px; background: url(images/square.png) 0px 9px no-repeat; padding-left: 10px; } #page iframe { width: 100%; } /* Blog ===========================*/ #blog_content { max-width: 880px; padding: 25px 35px 28px 35px; margin: 43px auto; background-color: rgba(255,255,255,0.92); outline: 5px solid rgba(233,233,233,0.6); } #blog_content section { width: 67%; float: left; } #blog_content article { margin-bottom: 20px; border-bottom: 1px solid #cccccc; } .blog_posts article img:hover { opacity: 0.8; } .blog_posts article img { opacity: 1; transition:opacity 0.3s; -moz-transition:opacity 0.3s; -webkit-transition:opacity 0.3s; -o-transition:opacity 0.3s; } .blog_header a { color: #5b5b5b !important; transition:opacity 0.3s; -moz-transition:opacity 0.3s; -webkit-transition:opacity 0.3s; -o-transition:opacity 0.3s !important; } .blog_header a:hover { color: #DF8259 !important; transition:opacity 0.3s; -moz-transition:opacity 0.3s; -webkit-transition:opacity 0.3s; -o-transition:opacity 0.3s !important; } #blog_content figure { margin-bottom: 19px; } #blog_content figure a:hover { /*border-bottom: none;*/ background-color: transparent !important; } #blog_content time { display: block; margin-bottom: 17px; margin-top: 7px; } #blog_content aside { width: 250px; float: right; display: block; font-size: 13px; margin-top: -16px;} #blog_content aside h3 { font-size: 14px; border-bottom: 1px solid #cccccc; text-transform: uppercase; height: 28px; margin-bottom: 12px; } #blog_content aside li { list-style: none; margin-bottom: 20px; } #blog_content aside li ul { padding: 0; } #blog_content aside li ul li { background: url(images/square.png) 0px center no-repeat; padding-left: 10px; text-transform: capitalize; margin-bottom: 10px; } #blog_content iframe { width: 100%; } .blog_content { padding-bottom: 30px; } .readmore { display: block; margin-top: 26px; margin-bottom: 27px; font-weight: bold; } .readmore_arrow { font-size: 15px; } .capitalize { text-transform: capitalize; } /* Tag ===========================*/ .tag > figure img { width: 100%; } /* * emm_paginate - WordPress Pagination Function * Version: 1.0 * * Copyright (c) 2009 Eric Martin http://www.ericmmartin.com/ * Link: http://www.ericmmartin.com/pagination-function-for-wordpress * */ .emm-paginate { text-align: center; font-family: 'HelveticaNeue', Helvetica, Arial, sans-serif; font-size: 13px; } .emm-paginate a {font-weight: bold; border-radius: 3px; background-color: #e8e8e8; border: solid 1px #b1b1b1; box-shadow: inset 0px 1px 0px #f5f5f5, 0px 1px 0px #DEDDDD; color: #616161; text-shadow: 0px 1px 0px #f5f5f5; margin-right:4px; padding:3px 6px; text-align:center; text-decoration:none; } .emm-paginate a:hover, .emm-paginate a:active { background-color: #DF8259; border: solid 1px #B66947; box-shadow: inset 0px 1px 0px #E69F7F, 0px 1px 0px #DEDDDD; color: white; text-shadow: 0px 1px 0px #B26847; } .emm-paginate .emm-title { color:#555; margin-right:4px; } .emm-paginate .emm-gap { color:#999; margin-right:4px; } .emm-paginate .emm-current { font-weight: bold; border-radius: 3px; background-color: #df8259; border: solid 1px #b66947; box-shadow: inset 0px 1px 0px #e69f7f, 0px 1px 0px #DEDDDD; color: #fff; text-shadow: 0px 1px 0px #B26847; margin-right:4px; padding:3px 6px; } #container .emm-next, #container .emm-prev { color: #5B5B5B; } #container .emm-next:hover, #container .emm-prev:hover { color: white; } #container .emm-page:hover { color: white; } #container .emm-page { color: #5B5B5B; } #container .emm-page.emm-current { color: white; } #folio_loadmore .emm-paginate .emm-page { display: none; } .emm-paginate .emm-prev, .emm-paginate .emm-next {} #folio_loadmore .emm-paginate { padding-bottom: 1px; } #folio_loadmore .emm-paginate .emm-next { display: block; height: 22px; font-size: 13px; background: rgba(255,255,255,0.16) center no-repeat; border: 1px solid rgba(0,0,0,0.5); border-radius: 3px; color: #ffffff; padding: 10px 10px; text-align: center; text-decoration: none; text-shadow: #202020 0 -1px 0; font-weight: bold; box-shadow: inset 0px 1px 0px rgba(255,255,255,0.15), 0px 1px 0px rgba(0,0,0,0.06); margin: auto; width: 100px; margin-bottom: 50px; margin-top: 30px; } #folio_loadmore .emm-paginate .emm-next:hover { background: rgba(255,255,255,0.2) center no-repeat; border: 1px solid rgba(0,0,0,0.53); box-shadow: inset 0px 1px 0px rgba(255,255,255,0.15), 0px 1px 0px rgba(0,0,0,0.06); } #folio_loadmore .emm-paginate .emm-next:active { box-shadow: inset 0px 1px 0px rgba(255,255,255,0.15), 0px 0px 0px rgba(0,0,0,0.06); margin-bottom: 50px; margin-top: 31px; } /* Widgets ============================*/ /* Twitter Feeds */ ul.tweets { font-style: italic; } ul.tweets li { background: transparent !important; text-transform: none !important; padding: 0 !important; } .screen_name { font-weight: bold; margin-bottom: 5px; margin-top: -3px; display: block; } .timesince { display: block; font-size: 11px; } /* Search */ .searchBox { padding: 0 10px 0px 30px; height: 33px; width: 208px; border: solid 1px #C9C5C2; outline: none; color: #979797; font-style: italic; } .searchBtn { display: block; margin-top: -34px; padding: 8px; } .searchform { position: relative; } .searchsubmit { position: absolute; top: 0px; left: 0px; border: none; background: url(images/search.png) center no-repeat; text-indent: -9999px; width: 34px; height: 34px; padding: 0; } #searchform { position: relative; } #searchsubmit { position: absolute; top: 0px; left: 0px; border: none; background: url(images/search.png) center no-repeat; text-indent: -9999px; width: 34px; height: 34px; padding: 0; } .fourfour_search .searchBox { width: 92% !important; padding: 0 2% 0 6% !important; } .fourfour_search { margin-top: 10px; } /* Icons */ .social_wrap { position: relative; float: left; margin-right: 10px; max-width: 200px; margin-bottom: 10px; } .social_text { display: none; position: absolute; right: 0; top: -40px; padding: 5px 10px; border: solid 1px rgba(0, 0, 0, 0.3); background: rgba(255, 255, 255, 0.9); white-space: nowrap; font-size: 12px; font-family: 'HelveticaNeue', Helvetica, Arial, sans-; color: #5B5B5B; } .social_text img { position: absolute; right: 6px; bottom: -6px; } .icon { width: 24px; height: 24px; opacity: 0.8; } .icon a { display: block; height: 100%; width: 100%; } .right_widget { width: 33.3%; position: absolute; right: 20px; top: 22px; text-align: right; } .middle_widget { width: 33.3%; position: absolute; left: 50%; top: 28px; margin-left: -16.65%; text-align: center; } .right_widget .social_wrap { position: relative; float: right; margin-left: 10px; max-width: 200px; } .right_widget .social_text { display: none; position: absolute; right: 0; top: -35px; padding: 5px 10px; border: solid 1px rgba(0, 0, 0, 0.3); background: rgba(255, 255, 255, 0.9); white-space: nowrap; } .right_widget .social_text img { position: absolute; right: 6px; bottom: -6px; } .right_widget .icon { width: 24px; height: 24px; opacity: 0.8; } .right_widget .icon a { display: block; height: 100%; width: 100%; } .facebook { background: url(images/icons/facebook.png); } .twitter { background: url(images/icons/twitter.png); } .dribbble { background: url(images/icons/dribbble.png); } .amazon { background: url(images/icons/amazon.png); } .apple { background: url(images/icons/apple.png); } .blogger { background: url(images/icons/blogger.png); } .delicious { background: url(images/icons/delicious.png); } .deviantart { background: url(images/icons/deviantart.png); } .digg { background: url(images/icons/digg.png); } .flickr { background: url(images/icons/flickr.png); } .forrst { background: url(images/icons/forrst.png); } .google { background: url(images/icons/google.png); } .htmlFive { background: url(images/icons/html5.png); } .lastfm { background: url(images/icons/lastfm.png); } .linkedin { background: url(images/icons/linkedin.png); } .myspace { background: url(images/icons/myspace.png); } .paypal { background: url(images/icons/paypal.png); } .picasa { background: url(images/icons/picasa.png); } .rss { background: url(images/icons/rss.png); } .skype { background: url(images/icons/skype.png); } .stumbleupon { background: url(images/icons/stumbleupon.png); } .tumblr { background: url(images/icons/tumblr.png); } .twitterTwo { background: url(images/icons/twitter2.png); } .vimeo { background: url(images/icons/vimeo.png); } .windows { background: url(images/icons/windows.png); } .wordpress { background: url(images/icons/wordpress.png); } .yahoo { background: url(images/icons/yahoo.png); } .youtube { background: url(images/icons/youtube.png); } .technorati { background: url(images/icons/technorati.png); } /* Recent Projects */ .widget_squares { width: 261px; } .recent_project_item { margin-left: 1px; margin-right: 12px; margin-bottom: 13px; border: solid 2px white; outline: solid 1px #D4D4D4; width: 70px; height: 70px; float: left; overflow: hidden; } .recent_project_item .recent_project_item_hoz img { max-width: initial !important; height: 100% !important; } .recent_project_item .recent_project_item_vert img { width: 100%; } .recent_project_item a { opacity: 1; transition:opacity 0.3s !important; -moz-transition:opacity 0.3s !important; -webkit-transition:opacity 0.3s !important; -o-transition:opacity 0.3s !important; } .recent_project_item a:hover { opacity: 0.5; } /* Contact */ .textwidget .wpcf7-form { height: 450px; } /* Comments ============================*/ #commentform input { height: 34px; width: 400px; padding: 0 10px; outline: none; border: 1px solid #C9C5C2; display: block; margin-top: 4px; margin-bottom: 14px; color: #5b5b5b; } #commentform textarea { height: 130px; width: 70%; padding: 10px 10px; outline: none; border: 1px solid #CCCCCC; display: block; margin-top: 4px; margin-bottom: 14px; color: #5b5b5b; } #comments h3 { text-transform: uppercase; } #submit { width: auto !important; background-color: #df8259; border: solid 1px #b66947 !important; border-radius: 3px; color: white; box-shadow: inset 0px 1px 0px #e69f7f, 0px 1px 0px #DEDDDD; text-shadow: 0px 1px 0px #df8259; font-weight: bold; cursor: pointer; } .required { color: #c73737; } .comment-form-author { margin-top: 12px; } #commentform .form-submit input { color: white !important; text-shadow: 0px 1px 0px #B26847 !important;} .comment_replies li { list-style: none; margin-bottom: 20px; } .children { background: url(images/comment_child.png) no-repeat 14px -34px } .comment-body { padding: 20px; background-color: #fff; border: 1px solid #b1b1b1; margin-bottom: 20px; position: relative; min-height: 139px; } .comment-author { width: 80px; text-align: center; font-size: 11px; float: left; margin-right: 20px; } .comment-body p { padding-bottom: 25px; min-height: 105px; } .comment-meta { position: absolute; bottom: 0px; left: 0px; font-size: 11px; background-color: #f5f5f5; border-top: 1px solid #b1b1b1; width: 100%; height: 29px; padding-top: 7px; } .comment-meta a { margin-left: 14px; } .comment_replies { margin-top: 14px; } .comment-reply-link { position: absolute; display: inline-block; right: -10px; font-size: 12px; } .comment-meta { padding-bottom: 0; min-height: initial; } .reply a { display: block; } .says { display: none; } cite.fn { margin-top: 0px; display: block; font-weight: bold; font-style: normal; line-height: 14px !important; } .reply { text-align: right; font-size: 13px; font-weight: bold; clear: both; margin-bottom: 9px; position: relative; } .reply img { width: auto; height: auto; margin-right: 5px; margin-bottom: -1px; } #reply-title { font-size: 12px !important; text-transform: none; font-weight: bold; font-family: 'HelveticaNeue', Helvetica, Arial, sans-serif; } #reply-title small { display: block; font-size: 12px; } /* Highlighted Text */ .text_highlight { padding: 2px 3px; } .text_orange { background-color: #df8259; color: #fff; } .text_red { background-color: #cb4444; color: #fff; } .text_blue { background-color: #3e95de; color: #fff; } .text_purple { background-color: #c36aba; color: #fff; } .text_black { background-color: #484848; color: #fff; } .text_green { background-color: #90ca52; color: #fff; } .text_default { background-color: #df8259; color: #fff; } /* Buttons ===========================*/ .showoff_button { display: inline-block; border-radius: 3px; font-size: 13px; font-weight: bold; margin: 10px 10px 4px 0px; position: relative; } .showoff_button a { display: inline-block; padding: 5px 10px; } .showoff_button a:hover { background-color: transparent !important; } .button_default_black { background-color: #df8259; border: solid 1px #b66947; box-shadow: inset 0px 1px 0px #e69f7f, 0px 1px 0px #DEDDDD; color: #713f29; text-shadow: 0px 1px 0px #B26847; } .button_default_white { background-color: #df8259; border: solid 1px #b66947; box-shadow: inset 0px 1px 0px #e69f7f, 0px 1px 0px #DEDDDD; color: #fff; text-shadow: 0px 1px 0px #b26847; } .button_orange_black { background-color: #EB9E39; border: solid 1px #C38500; box-shadow: inset 0px 1px 0px #F0B467, 0px 1px 0px #DEDDDD; color: #6e4100; text-shadow: 0px 1px 0px #f1bb75; } .button_orange_white { background-color: #EB9E39; border: solid 1px #C38500; box-shadow: inset 0px 1px 0px #F0B467, 0px 1px 0px #DEDDDD; color: #fff; text-shadow: 0px 1px 0px #BC7E2E; } .button_red_black { background-color: #cb4444; border: solid 1px #aa3636; box-shadow: inset 0px 1px 0px #d56969, 0px 1px 0px #DEDDDD; color: #691d1d; text-shadow: 0px 1px 0px #d56969; } .button_red_white { background-color: #cb4444; border: solid 1px #aa3636; box-shadow: inset 0px 1px 0px #d56969, 0px 1px 0px #DEDDDD; color: #fff; text-shadow: 0px 1px 0px #a23636; } .button_purple_black { background-color: #c36aba; border: solid 1px #a65191; box-shadow: inset 0px 1px 0px #cf88c8, 0px 1px 0px #DEDDDD; color: #621f52; text-shadow: 0px 1px 0px #cf88c8; } .button_purple_white { background-color: #c36aba; border: solid 1px #a65191; box-shadow: inset 0px 1px 0px #cf88c8, 0px 1px 0px #DEDDDD; color: #fff; text-shadow: 0px 1px 0px #9c5595; } .button_blue_black { background-color: #3e95de; border: solid 1px #3f5e9e; box-shadow: inset 0px 1px 0px #65aae5, 0px 1px 0px #DEDDDD; color: #233f77; text-shadow: 0px 1px 0px #65aae5; } .button_blue_white { background-color: #3e95de; border: solid 1px #3f5e9e; box-shadow: inset 0px 1px 0px #65aae5, 0px 1px 0px #DEDDDD; color: #fff; text-shadow: 0px 1px 0px #3277b2; } .button_green_black { background-color: #90ca52; border: solid 1px #68994a; box-shadow: inset 0px 1px 0px #a6d575, 0px 1px 0px #DEDDDD; color: #316511; text-shadow: 0px 1px 0px #a6d575; } .button_green_white { background-color: #90ca52; border: solid 1px #68994a; box-shadow: inset 0px 1px 0px #a6d575, 0px 1px 0px #DEDDDD; color: #fff; text-shadow: 0px 1px 0px #73a242; } .button_white_black { background-color: #e8e8e8; border: solid 1px #b1b1b1; box-shadow: inset 0px 1px 0px #f5f5f5, 0px 1px 0px #DEDDDD; color: #616161; text-shadow: 0px 1px 0px #f5f5f5; } .button_black_white { background-color: #484848; border: solid 1px #3c3c3c; box-shadow: inset 0px 1px 0px #5b5b5b, 0px 1px 0px #DEDDDD; color: #fff; text-shadow: 0px 1px 0px #2e2e2e; } .button_default_black a:hover { color: #713f29 !important; } .button_default_white a:hover { color: #fff !important; } .button_orange_black a:hover { color: #6e4100 !important; } .button_orange_white a:hover { color: #fff !important; } .button_red_black a:hover { color: #691d1d !important; } .button_red_white a:hover { color: #fff !important; } .button_purple_black a:hover { color: #621f52 !important; } .button_purple_white a:hover { color: #fff !important; } .button_blue_black a:hover { color: #233f77 !important; } .button_blue_white a:hover { color: #fff !important; } .button_green_black a:hover { color: #316511 !important; } .button_green_white a:hover { color: #fff !important; } .button_white_black a:hover { color: #616161 !important; } .button_black_white a:hover { color: #fff !important; } .button_default_black a { color: #713f29 !important; } .button_default_white a { color: #fff !important; } .button_orange_black a { color: #6e4100 !important; } .button_orange_white a { color: #fff !important; } .button_red_black a { color: #691d1d !important; } .button_red_white a { color: #fff !important; } .button_purple_black a { color: #621f52 !important; } .button_purple_white a { color: #fff !important; } .button_blue_black a { color: #233f77 !important; } .button_blue_white a { color: #fff !important; } .button_green_black a { color: #316511 !important; } .button_green_white a { color: #fff !important; } .button_white_black a { color: #616161 !important; } .button_black_white a { color: #fff !important; } /* Quote ===========================*/ .quote { margin: 10px 0; background: url(images/quote.png) left center no-repeat; } .quoteText { font-style: italic; margin-left: 35px; padding: 20px 20px 35px 25px; border-left: solid 3px #DF8259; border-right: 1px solid #ccc; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #ffffff } .quoteText p { font-size: 13px; } .author { float: right; } .author p { font-size: 13px; } /* Audio Player ===========================*/ /* * Skin for jPlayer Plugin (jQuery JavaScript Library) * http://www.happyworm.com/jquery/jplayer * * Skin Name: Blue Monday * * Copyright (c) 2010-2012 Happyworm Ltd * Dual licensed under the MIT and GPL licenses. * - http://www.opensource.org/licenses/mit-license.php * - http://www.gnu.org/copyleft/gpl.html * * Author: Silvia Benvenuti * Skin Version: 4.1 (jPlayer 2.2.0) * Date: 11th September 2012 */ div.jp-audio, div.jp-video { /* Edit the font-size to counteract inherited font sizing. * Eg. 1.25em = 1 / 0.8em */ font-size:13px; /* 1.25em for testing in site pages */ /* No parent CSS that can effect the size in the demos ZIP */ font-family: 'HelveticaNeue', Helvetica, Arial, sans-serif; color: #5b5b5b; background: url(images/player_background.png) repeat-x; -moz-box-shadow: 0px 1px 0px #e0e0e0; -webkit-box-shadow: 0px 1px 0px #e0e0e0; box-shadow: 0px 1px 0px #e0e0e0; } div.jp-audio a:hover, div.jp-video a:hover { background-color: transparent !important; border: none; } div.jp-audio { width: 100%; } div.jp-video-270p { width: 100%; } div.jp-video-360p { width: 100%; } div.jp-video-full { /* Rules for IE6 (full-screen) */ width: 480px; height:270px; /* Rules for IE7 (full-screen) - Otherwise the relative container causes other page items that are not position:static (default) to appear over the video/gui. */ position:static !important; position:relative } /* The z-index rule is defined in this manner to enable Popcorn plugins that add overlays to video area. EG. Subtitles. */ div.jp-video-full div div { z-index:1000; } div.jp-video-full div.jp-jplayer { top: 0; left: 0; position: fixed !important; position: relative; /* Rules for IE6 (full-screen) */ overflow: hidden; } div.jp-video-full div.jp-interface { width: 100%; } div.jp-video-full div.jp-gui { position: fixed !important; position: static; /* Rules for IE6 (full-screen) */ top: 0; left: 0; width:100%; height:100%; z-index:1001; /* 1 layer above the others. */ } div.jp-video-full div.jp-interface { position: absolute !important; position: relative; /* Rules for IE6 (full-screen) */ bottom: 0; left: 0; } div.jp-interface { background: url(images/player_background.png) repeat-x; height: 38px; position: relative; width:99.6%; border: 1px solid #AEAEAE; } div.jp-audio div.jp-type-single div.jp-interface { height:38px; } div.jp-audio div.jp-type-playlist div.jp-interface { height:80px; } div.jp-video div.jp-interface { margin-top: 8px; border-top:0px solid #009be3; } /* @group CONTROLS */ div.jp-controls-holder { clear: both; margin:0 auto; position: relative; overflow:hidden; height: 100%; } div.jp-interface ul.jp-controls { list-style-type:none; margin:0; padding: 0; overflow:hidden; } ul.jp-controls a { outline: none; } div.jp-audio ul.jp-controls { padding: 13px 20px 0 17px; } div.jp-video div.jp-type-single ul.jp-controls { padding: 13px 20px 0 17px; } div.jp-video div.jp-type-playlist ul.jp-controls { width: 134px; margin-left: 172px; } div.jp-video ul.jp-controls, div.jp-interface ul.jp-controls li { display:inline; float: left; } div.jp-interface ul.jp-controls a { display:block; overflow:hidden; text-indent:-9999px; } a.jp-play, a.jp-pause { width:13px; height:15px; } a.jp-play { opacity: 0.8; background: url("images/playercontrol.png") 0 -18px no-repeat; margin-top: -1px; } a.jp-play:hover { opacity: 1.0; background: url("images/playercontrol.png") 0px -18px no-repeat; } a.jp-pause { opacity: 0.8; background: url("images/playercontrol.png") -20px -18px no-repeat; display: none; } a.jp-pause:hover { opacity: 1.0; background: url("images/playercontrol.png") -20px -18px no-repeat; } a.jp-stop, a.jp-previous, a.jp-next { width:28px; height:28px; margin-top:6px; } a.jp-stop { background: url("images/playercontrol.png") 0 -83px no-repeat; margin-left:10px; } a.jp-stop:hover { background: url("images/playercontrol.png") -29px -83px no-repeat; } a.jp-previous { background: url("images/playercontrol.png") 0 -112px no-repeat; } a.jp-previous:hover { background: url("images/playercontrol.png") -29px -112px no-repeat; } a.jp-next { background: url("images/playercontrol.png") 0 -141px no-repeat; } a.jp-next:hover { background: url("images/playercontrol.png") -29px -141px no-repeat; } /* @end */ /* @group progress bar */ div.jp-progress { overflow:hidden; background-color: #ddd; } div.jp-audio div.jp-progress { position: absolute; top:15px; height:9px; } div.jp-audio div.jp-type-single div.jp-progress { z-index: 15; left: -1px; width: 100%; top: -9px; padding: 0 1px; } div.jp-audio div.jp-type-playlist div.jp-progress { z-index: 15; position: absolute; top: -8px; left: 0px; width: 100%; height: 9px; } div.jp-video div.jp-progress { position: absolute; top: -8px; left: -1px; width: 100%; height: 9px; z-index: 15; padding: 0 1px; } div.jp-seek-bar { position: absolute; top: 0px; left: -2px; background: #ACACAC; border: solid 1px #8D8D8D; width:0px; height: 7px; cursor: pointer; } div.jp-play-bar { background: #707070; border: solid 1px #5C5C5C; width:0px; height: 7px; margin-top: -1px; } /* The seeking class is added/removed inside jPlayer */ div.jp-seeking-bg { background: url("jplayer.blue.monday.seeking.gif"); } /* @end */ /* @group volume controls */ a.jp-mute, a.jp-unmute, a.jp-volume-max { position: absolute; right: 43px; width:9px; height:15px; margin-top: -1px; } div.jp-audio div.jp-type-single a.jp-mute, div.jp-audio div.jp-type-single a.jp-unmute { } div.jp-audio div.jp-type-playlist a.jp-mute, div.jp-audio div.jp-type-playlist a.jp-unmute { margin-left: 154px; } div.jp-audio a.jp-volume-max { margin-left: 56px; } div.jp-video a.jp-mute, div.jp-video a.jp-unmute, div.jp-video a.jp-volume-max { position: absolute; right: 65px; top: 14px; } div.jp-video a.jp-mute, div.jp-video a.jp-unmute { } div.jp-video a.jp-volume-max { left: 134px; } a.jp-mute { opacity: 0.8; background: url("images/playercontrol.png") -39px -18px no-repeat; } a.jp-mute:hover { opacity: 1.0; background: url("images/playercontrol.png") -39px -18px no-repeat; } a.jp-unmute { opacity: 0.8; background: url("images/playercontrol.png") -39px -18px no-repeat; display: none; } a.jp-unmute:hover { opacity: 1.0; background: url("images/playercontrol.png") -39px -18px no-repeat; } a.jp-volume-max { background: url("images/playercontrol.png") 0 -186px no-repeat; } a.jp-volume-max:hover { background: url("images/playercontrol.png") -19px -186px no-repeat; } div.jp-volume-bar { position: absolute; overflow:hidden; background: url("images/playercontrol.png") -25px 0px repeat-x; width:23px; height:11px; cursor: pointer; } div.jp-audio div.jp-volume-bar { top:14px; right:15px; } div.jp-video div.jp-volume-bar { top:15px; right:38px; } div.jp-volume-bar-value { background: url("images/playercontrol.png") 0 0px repeat-x; width:0px; height:11px; } /* @end */ /* @group current time and duration */ div.jp-audio div.jp-time-holder { z-index: 10; position:absolute; top:11px; } div.jp-audio div.jp-type-single div.jp-time-holder { left:46px; width:473px; } div.jp-audio div.jp-type-playlist div.jp-time-holder { left:54px; width: 440px; } div.jp-current-time, div.jp-duration { font-size:12px; text-shadow: 0 1px 0 #FFFFFF; font-weight: bold; } div.jp-current-time { float: left; display:inline; } div.jp-duration { float: left; display:inline; text-align: right; color: #888888; } div.jp-video div.jp-current-time { top: 11px; position: absolute; left: 46px; } div.jp-video div.jp-duration { top: 11px; position: absolute; left: 93px; } /* @end */ /* @group playlist */ div.jp-title { display: none; font-weight:bold; text-align:center; } div.jp-title, div.jp-playlist { width:100%; background-color:#ccc; border-top:1px solid #009be3; } div.jp-type-single div.jp-title, div.jp-type-playlist div.jp-title, div.jp-type-single div.jp-playlist { border-top:none; } div.jp-title ul, div.jp-playlist ul { list-style-type:none; margin:0; padding:0 20px; font-size:.72em; } div.jp-title li { padding:5px 0; font-weight:bold; } div.jp-playlist li { padding:5px 0 4px 20px; border-bottom:1px solid #eee; } div.jp-playlist li div { display:inline; } /* Note that the first-child (IE6) and last-child (IE6/7/8) selectors do not work on IE */ div.jp-type-playlist div.jp-playlist li:last-child { padding:5px 0 5px 20px; border-bottom:none; } div.jp-type-playlist div.jp-playlist li.jp-playlist-current { list-style-type:square; list-style-position:inside; padding-left:7px; } div.jp-type-playlist div.jp-playlist a { color: #333; text-decoration: none; } div.jp-type-playlist div.jp-playlist a:hover { color:#0d88c1; } div.jp-type-playlist div.jp-playlist a.jp-playlist-current { color:#0d88c1; } div.jp-type-playlist div.jp-playlist a.jp-playlist-item-remove { float:right; display:inline; text-align:right; margin-right:10px; font-weight:bold; color:#666; } div.jp-type-playlist div.jp-playlist a.jp-playlist-item-remove:hover { color:#0d88c1; } div.jp-type-playlist div.jp-playlist span.jp-free-media { float:right; display:inline; text-align:right; margin-right:10px; } div.jp-type-playlist div.jp-playlist span.jp-free-media a{ color:#666; } div.jp-type-playlist div.jp-playlist span.jp-free-media a:hover{ color:#0d88c1; } span.jp-artist { font-size:.8em; color:#666; } /* @end */ div.jp-video-play { width:100%; overflow:hidden; /* Important for nested negative margins to work in modern browsers */ cursor:pointer; background-color:rgba(0,0,0,0); /* Makes IE9 work with the active area over the whole video area. IE6/7/8 only have the button as active area. */ } div.jp-video-270p div.jp-video-play { margin-top:-270px; height:270px; } div.jp-video-360p div.jp-video-play { margin-top:-360px; height:360px; } div.jp-video-full div.jp-video-play { height:100%; } a.jp-video-play-icon { position:relative; display:block; width: 80px; height: 80px; margin-left:-40px; margin-top:-40px; left:50%; top:50%; background: url("images/videoplayer_play.png") 0 0 no-repeat; text-indent:-9999px; } div.jp-video-play:hover a.jp-video-play-icon { background: url("images/videoplayer_play_hover.png") 0 0 no-repeat; } .jp-video img { opacity: 1 !important; } div.jp-jplayer a:hover, div.jp-audio a:hover { background-color: transparent !important; } div.jp-jplayer audio, div.jp-jplayer { width:0px; height:0px; } div.jp-jplayer { background-color: #000000; } /* @group TOGGLES */ /* The audio toggles are nested inside jp-time-holder */ ul.jp-toggles { list-style-type:none; padding:0; margin:0 auto; overflow:hidden; } div.jp-audio .jp-type-single ul.jp-toggles { width:25px; } div.jp-audio .jp-type-playlist ul.jp-toggles { width:55px; margin: 0; position: absolute; left: 325px; top: 50px; } div.jp-video ul.jp-toggles { right: 7px; top: 12px; position: absolute; } ul.jp-toggles li { display:block; float:right; } ul.jp-toggles li a { display:block; width:16px; height:17px; text-indent:-9999px; line-height:100%; /* need this for IE6 */ outline: none; } a.jp-full-screen { background: url("images/playercontrol.png") -54px -17px no-repeat; opacity: 0.8; margin-left: 20px; margin-right: 3px; } a.jp-full-screen:hover { background: url("images/playercontrol.png") -54px -17px no-repeat; opacity: 1.0; } a.jp-restore-screen { background: url("images/playercontrol.png") -76px -17px no-repeat; opacity: 0.8; margin-left: 20px; margin-right: 3px; } a.jp-restore-screen:hover { background: url("images/playercontrol.png") -76px -17px no-repeat; opacity: 1.0; } a.jp-repeat { background: url("images/playercontrol.png") 0 -290px no-repeat; } a.jp-repeat:hover { background: url("images/playercontrol.png") -30px -290px no-repeat; } a.jp-repeat-off { background: url("images/playercontrol.png") -60px -290px no-repeat; } a.jp-repeat-off:hover { background: url("images/playercontrol.png") -90px -290px no-repeat; } a.jp-shuffle { background: url("images/playercontrol.png") 0 -270px no-repeat; margin-left: 5px; } a.jp-shuffle:hover { background: url("images/playercontrol.png") -30px -270px no-repeat; } a.jp-shuffle-off { background: url("images/playercontrol.png") -60px -270px no-repeat; margin-left: 5px; } a.jp-shuffle-off:hover { background: url("images/playercontrol.png") -90px -270px no-repeat; } /* @end */ /* @group NO SOLUTION error feedback */ .jp-no-solution { position:absolute; width:390px; margin-left:-202px; left:50%; top: 10px; padding:5px; font-size:.8em; background-color:#eee; border:2px solid #009be3; color:#000; display:none; } .jp-no-solution a { color:#000; } .jp-no-solution span { font-size:1em; display:block; text-align:center; font-weight:bold; } /* @end */ /* Contact Form */ span.wpcf7-form-control-wrap { width: 100%; display: block; position: absolute; } .wpcf7-form-control { width: 550px; height: 33px; outline: none; color: #5B5B5B; border: solid 1px #CCC; margin-bottom: 10px; padding: 0 10px 0 10px; } aside .wpcf7-form-control { width: 228px; } .wpcf7-textarea { height: 155px; padding: 10px; } .wpcf7-submit { display: inline-block; padding: 5px 18px; border-radius: 3px; font-size: 13px; font-weight: bold; position: relative; background-color: #df8259; border: solid 1px #b66947; box-shadow: inset 0px 1px 0px #e69f7f, 0px 1px 0px #DEDDDD; color: #fff; text-shadow: 0px 1px 0px #B26847 !important; width: auto !important; cursor: pointer; float: left; } span.wpcf7-not-valid-tip { position: absolute; height: 33px; width: 30px !important; padding: 0 !important; margin-right: 5px; text-indent: -9999px; top: 1px !important; right: 1px !important; border: none !important; border-left: 1px solid #CCC !important; left: auto !important; background: url(images/cferror.png) center no-repeat !important; } aside span.wpcf7-not-valid-tip { margin-right: 0px; } .wpcf7-validation-errors { display: none !important; } .wpcf7-mail-sent-ok { width: 204px; border: 1px solid #CCC !important; border-radius: 3px; background: #fff url(images/cfsucces.png) 9px center no-repeat; padding-left: 35px !important; margin-left: 0 !important; font-family: 'HelveticaNeue', Helvetica, Arial, sans-serif; color: #5B5B5B; display: inline-block !important; padding: 8px 10px 7px 35px !important; margin-top: 0 !important; font-size: 13px; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.05); } .ajax-loader { margin-left: 10px !important; margin-top: 8px !important; float: left; } /* Filter ==============================*/ #filterWrap { background-color: #3E3E3E; } #filters { list-style: none; text-transform: capitalize; margin-left: -40px; font-size: 13px; } #filters li { float: left; } #filters li a { color: #fff; display: block; padding: 9px 10px; } #filters li:hover { background-color: #df8259; } #filters .filter_active { background-color: #df8259; } #filters a:hover { color: white; } /* List */ .list_ul { list-style: none; padding: 0; font-size: 13px; } .list_ul li { padding-left: 20px; } .list_dot li { background: url(images/dot.png) 5px center no-repeat; } .list_arrow li { background: url(images/arrow.png) 5px center no-repeat; } .list_doublearrow li { background: url(images/doublearrow.png) 5px center no-repeat; } .list_plus li { background: url(images/plus.png) 5px center no-repeat; } .list_check li { background: url(images/check.png) left center no-repeat; } .list_longarrow li { background: url(images/longarrow.png) left center no-repeat; } /* Drop Caps */ .dropcap { margin-top: 11px; margin-right: 5px; font-size: 39px; float: left; } /* Line break */ hr { margin: 10px 0; } /* ==============================*/ .lightBox img { border: 4px solid white; outline: 1px solid #D1D0D0; outline-offset: 0px; } .lightBox a { float: left; display: block; height: 100%; margin: 7px 18px 7px 0px; opacity: 1; transition:opacity 0.3s !important; -moz-transition:opacity 0.3s !important; -webkit-transition:opacity 0.3s !important; -o-transition:opacity 0.3s !important; } .lightBox a:hover { opacity: 0.5; } /* Responsive */ @media screen and (max-width: 1024px) { /* Header */ #menu-main_menu { display: none; } #not_active_follow { display: none; } #active_menu { display: none; } #active_follow { display: none; } #menu-select-menu { display: block; width: 250px; height: 30px; position: absolute; top: 60px; left: 50%; margin-left: -125px; } header { height: 100px; } #logo { float: none; width: 100%; text-align: center; margin-top: 25px; margin-left: 0; } #logo img { border: none; } /* Blog/Page */ section { width: 100% !important; float: none !important; } .lightBox img { width: 100%; } .lightBox a { width: 27%; } aside { width: 100% !important; float: none !important; } section img { width: 100%; height: auto; } #page_graphic { width: 100%; height: auto; } .social_text img { width: auto; } .social_text { display: none !important; } div.jp-jplayer { width: 99.9% !important; } /* Portfolio */ .folio_item_wrap { position: relative; } .folio_item_content { padding: 4%; border: none; width: 92%; } .folio_item_navigation { padding: 3% 4%; width: 92%; } .folio_item_description { float: left; } .folio_single_navigation { float: right; } /* Widgets */ aside { margin-top: 50px; } .widget_squares { width: 100%; } /* Contact */ .wpcf7-form-control { padding: 0 1.5%; width: 96%; } /* Footer */ .left_widget, .right_widget { display: none; } .middle_widget { width: 100%; left: 0; top: 28px; margin-left: 0; } } @media screen and (max-width: 600px) { /* Columns */ .onehalf { width: 100%; padding: 4px 0 20px 0; float: none; } .onethird { width: 100%; padding: 4px 0 20px 0; float: none; } .onefourth { width: 100%; padding: 4px 0 20px 0; float: none; } .twothird { width: 100%; padding: 4px 0 20px 0; float: none; } .threefourth { width: 100%; padding: 4px 0 20px 0; float: none; } .folio_overlay_text h1 { font-size: 17px; } span.work { font-size: 11px; padding-top: -10px; line-height: 10px; } } @media screen and (max-width: 640px){ .folio_single_navigation { width: 201px; margin: auto; margin-top: -200px; float: none; } .folio_item_description { margin-top: 90px; display: block; float: none; } .folio_item_navigation { height: 180px; } }