/* =================================================================================== Theme Name: Moderna Responsive Wordpress Theme Theme URI: http://pixel-industry.com/wordpress/moderna/ Description: Moderna is Responsive and Creative Wordpress Theme Author: pixel-industry Author URI: http://pixel-industry.com Version: 1.2 ====================================================================================== */ /* ----------------------------------------------------------------------------------- CSS CONTENTS 1. Basic styles 2. Header Container styles 2.1. Logo 2.2. Social icons 2.3. Navigation 2.4. Logo 2.5. Page title 3. Content wrap styles 4. About us page styles 5. Services page styles 6. Portfolio page styles 7. Blog page styles 8. Contact page styles 9. Sidebar styles 10. Pagination styles 11. Footer styles 12. Elements 13. Media 14. 960GS Illustration -------------------------------------------------------------------------------------- */ /*===================================================================================== WORDPRESS CORE CLASSES ======================================================================================*/ @font-face { font-family: 'TempusSansITCRegular'; src: url('fonts/tempsitc.eot'); src: url('fonts/tempsitc.eot') format('embedded-opentype'), url('fonts/tempsitc.woff') format('woff'), url('fonts/tempsitc.ttf') format('truetype'), url('fonts/tempsitc.svg#TempusSansITCRegular') format('svg'); } .alignnone { margin: 5px 20px 20px 0; max-width: 100%; height: auto; } .aligncenter, div.aligncenter { display: block; margin: 5px auto 5px auto; clear: both; } .alignright { float:right; margin: 5px 0 20px 20px; clear: both; } .alignleft { float: left; margin: 5px 20px 20px 0; clear: both; } .aligncenter { display: block; margin: 5px auto 5px auto; clear: both; } a img.alignright { float: right; margin: 5px 0 20px 20px; max-width: 100%; height: auto; } a img.alignnone { margin: 5px 20px 20px 0; max-width: 100%; height: auto; } a img.alignleft { float: left; margin: 5px 20px 20px 0; max-width: 100%; height: auto; } a img.aligncenter { display: block; margin-left: auto; margin-right: auto; max-width: 100%; height: auto; } .wp-caption { background: #fff; border: 1px solid #f0f0f0; max-width: 96%; /* Image does not overflow the content area */ padding: 5px 3px 10px; text-align: center; } .wp-caption.alignnone { margin: 5px 20px 20px 0; } .wp-caption.alignleft { margin: 5px 20px 20px 0; } .wp-caption.alignright { margin: 5px 0 20px 20px; } .wp-caption img { border: 0 none; height: auto; margin: 0; max-width: 98.5%; padding: 0; width: auto; } .wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; margin: 0; padding: 0 4px 5px; } .sticky{} .gallery-caption{} /*===================================================================================== 1.BASIC STYLES ======================================================================================*/ :focus { outline: 0; } body{ background: #fff; color: #505050; font: normal 14px 'Trebuchet MS', sans-serif; line-height: 22px; } /* HEADINGS */ h2, h3, h4, h6{ margin-bottom: 18px; } h1, h1 a{ font: bold 25px 'Trebuchet MS', sans-serif; line-height: 32px; color: #154565; margin-bottom: 18px; } h2, h2 a{ font: bold 24px 'Trebuchet MS', sans-serif; line-height: 33px; color: #154565; } h3, h3 a{ font: bold 22px 'Trebuchet MS', sans-serif; line-height: 28px; font-style:normal; color: #154565; text-transform:Capitalize; } h4, h4 a{ font: bold 19px 'Trebuchet MS', sans-serif; line-height: 30px; color: #154565; } h5, h5 a{ font: bold 16px 'Trebuchet MS', sans-serif; line-height: 24px; color: #8d8d8d; } h6, h6 a{ font: 16px 'Trebuchet MS', sans-serif; line-height: 22px; color: #003366; font-weight:bold; } /* PARAGRAPH */ p{ font: normal 19px 'Trebuchet MS', sans-serif; line-height: 28px; } /* LINKS */ a{ text-decoration: none; font: 19px 'Trebuchet MS', sans-serif; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } /* SPAN */ span{ font: 19px 'Trebuchet MS', sans-serif; color:#666666; } ol li{ color: #666666; font: 19px/31px 'Trebuchet MS',sans-serif; list-style: decimal outside none; margin-left: 30px; } .container_12 ol{ padding-top:0!important; } /* LIGHT COLORED TEXT */ .text-light{ color: #bbb; } /* FINDOUT MORE LINKS */ a.find-out-more{ margin-top: 20px; float: left; font: 14px 'Trebuchet MS', sans-serif; display: block; } /* BLOCKQUOTE STYLES */ blockquote{ background: #fcfcfc; font: italic bold 22px 'Times New Roman', serif; color:003366; line-height: 28px; padding: 10px 00px; margin: 15px 0; float: left; } blockquote.left{ width: 36%; margin: 10px 15px 8px 0; float: left; } blockquote.right{ width: 36%; margin: 10px 0 8px 15px; float: right; color:003366; } .block-top{ background: url("../../img/top-testi.png") no-repeat; width:700px; height:31px; float:left; margin-left: -2px; } .block-mid{ font-family: 'TempusSansITCRegular'; background: url("../../img/mid-testi.png") repeat scroll 0 0 transparent; float: left; font-size: 22px; color:#154565; line-height: 32px; padding-left: 50px; padding-right: 44px; width: 606px; margin-left: -2px; } .block-bot{ background: url("../../img/bot-testi.png") no-repeat; width:700px; height:57px; float:left; margin-left: -2px; } /* TEXT HIGHLIGHT */ .highlight-dark{ background: #8f8f8f; color: #fff; } .highlight-light{ background: #ececec; } /*===================================================================================== HEADER CONTAINER STYLES ======================================================================================*/ #header-wrapper{ width: 100%; } #header{ width: 940px; margin-top: 30px; margin-bottom: 30px; margin-right: auto; margin-left: auto; } /* LOGO */ #logo{ width: 274px; height: 55px; margin-bottom: 30px; margin-right: 30px; margin-top: -13px; float: left; } #logo a{ height: 25px; display: block; width: 490px; } #logo span{ font-size: 14px; margin-left: 229px; margin-top: -4px; padding-left: 80px; position: absolute; } #logo a img{ max-width: 450px; padding-bottom:200px; } .container_12 p, .container_12 ol, .container_12 ul{ margin-bottom:20px; } .container_12 ol, .container_12 ul{ margin-left: 15px; padding-top: 15px; } .container_12 ul li{ background: url("../../img/dark-blue/check-mark.png") no-repeat scroll 0 8px transparent; font-size: 19px; line-height: 26px; margin-bottom: 15px; padding-left: 22px; } .container_12 b, .container_12 strong{ font-size:19px; color: #505050; } ul li.list-check{ background: url("../../img/dark-blue/check-mark.png") no-repeat scroll 0 8px transparent; padding-left: 18px; } ul li.list-check span{ padding-left: 3px; } #content-wrapper .img-container ul{ margin-left:0; padding-top:0; } .titlewrap{ margin: 0 auto; width: 938px; } .titlewrap h1{ text-align: left !important; } .slide-elements ul{ } .slide-elements ul li{ background: url("../../img/dark-blue/check-mark.png") no-repeat scroll 0 8px transparent; float: left; padding-left: 17px; width: 41%; } .slide-elements h3, .slide-elements h3 span{ font-weight:bold; margin-bottom: 0; padding-bottom: 8px !important; } .container_12 .grid_6{ font-size:19px; width:445px!important; } /* SOCIAL BOOKMARKS */ .social{ width: 411px; margin-right: 10px; float: left; margin-bottom: 25px; } .social li{ float: right; width: 30px; height: 30px; margin-right: 5px; cursor: pointer; background: #f6f6f6; } .social li a{ text-indent: -9999px; display: block; } /* SOCIAL AIM */ .social li.aim{ background: #ececec url('../../img/social/aim.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.aim:hover{ background: #e6490c url('../../img/social/aim.png') no-repeat center; } /* SOCIAL BHEANCE */ .social li.behance{ background: #ececec url('../../img/social/behance.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.behance:hover{ background: #329dd5 url('../../img/social/behance.png') no-repeat center; } /* SOCIAL BLOGGER */ .social li.blogger{ background: #ececec url('../../img/social/blogger.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.blogger:hover{ background: #ff6402 url('../../img/social/blogger.png') no-repeat center; } /* SOCIAL CARGO */ .social li.cargo{ background: #ececec url('../../img/social/cargo.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.cargo:hover{ background: #00c462 url('../../img/social/cargo.png') no-repeat center; } /* SOCIAL DELICIOUS */ .social li.delicious{ background: #ececec url('../../img/social/delicious.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.delicious:hover{ background: #3274d1 url('../../img/social/delicious.png') no-repeat center; } /* SOCIAL DEVIANT ART */ .social li.deviantart{ background: #ececec url('../../img/social/deviantart.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.deviantart:hover{ background: #576d61 url('../../img/social/deviantart.png') no-repeat center; } /* SOCIAL DIGG */ .social li.digg{ background: #ececec url('../../img/social/digg.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.digg:hover{ background: #01539c url('../../img/social/digg.png') no-repeat center; } /* SOCIAL DRIBBLE */ .social li.dribbble{ background: #ececec url('../../img/social/dribbble.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.dribbble:hover{ background: #f48eb3 url('../../img/social/dribbble.png') no-repeat center; } /* SOCIAL EVERNOTE */ .social li.evernote{ background: #ececec url('../../img/social/evernote.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.evernote:hover{ background: #8dd04c url('../../img/social/evernote.png') no-repeat center; } /* SOCIAL FACEBOOK */ .social li.facebook{ background: #ececec url('../../img/social/facebook.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.facebook:hover{ background: #3b5998 url('../../img/social/facebook.png') no-repeat center; } /* SOCIAL FLICKR */ .social li.flickr{ background: #ececec url('../../img/social/flickr.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.flickr:hover{ background: #ff0084 url('../../img/social/flickr.png') no-repeat center; } /* SOCIAL FORRST */ .social li.forrst{ background: #ececec url('../../img/social/forrst.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.forrst:hover{ background: #77b045 url('../../img/social/forrst.png') no-repeat center; } /* SOCIAL GITHUB */ .social li.github{ background: #ececec url('../../img/social/github.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.github:hover{ background: #67e2ff url('../../img/social/github.png') no-repeat center; } /* SOCIAL GOOGLEPLUS */ .social li.googleplus{ background: #ececec url('../../img/social/google+.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.googleplus:hover{ background: #261124 url('../../img/social/google+.png') no-repeat center; } /* SOCIAL GOOGLE*/ .social li.google{ background: #ececec url('../../img/social/google.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.google:hover{ background: #dc3a21 url('../../img/social/google.png') no-repeat center; } /* SOCIAL GOWALLA */ .social li.gowalla{ background: #ececec url('../../img/social/gowalla.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.gowalla:hover{ background: #fd7508 url('../../img/social/gowalla.png') no-repeat center; } /* SOCIAL GROOVESHARK */ .social li.grooveshark{ background: #ececec url('../../img/social/grooveshark.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.grooveshark:hover{ background: #f67f00 url('../../img/social/grooveshark.png') no-repeat center; } /* SOCIAL HTML5 */ .social li.html5{ background: #ececec url('../../img/social/html5.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.html5:hover{ background: #e54d26 url('../../img/social/html5.png') no-repeat center; } /* SOCIAL ICLOUD */ .social li.icloud{ background: #ececec url('../../img/social/icloud.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.icloud:hover{ background: #3b6aae url('../../img/social/icloud.png') no-repeat center; } /* SOCIAL LASTFM */ .social li.lastfm{ background: #ececec url('../../img/social/lastfm.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.lastfm:hover{ background: #d21309 url('../../img/social/lastfm.png') no-repeat center; } /* SOCIAL LINKEDIN */ .social li.linkedin{ background: #ececec url('../../img/social/linkedin.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.linkedin:hover{ background: #117fb6 url('../../img/social/linkedin.png') no-repeat center; } /* SOCIAL MIXX */ .social li.mixx{ background: #ececec url('../../img/social/mixx.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.mixx:hover{ background: #c72c34 url('../../img/social/mixx.png') no-repeat center; } /* SOCIAL MYSPACE */ .social li.myspace{ background: #ececec url('../../img/social/myspace.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.myspace:hover{ background: #003399 url('../../img/social/myspace.png') no-repeat center; } /* SOCIAL NETVIBES */ .social li.netvibes{ background: #ececec url('../../img/social/netvibes.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.netvibes:hover{ background: #58b22e url('../../img/social/netvibes.png') no-repeat center; } /* SOCIAL NEWSVINE */ .social li.newsvine{ background: #ececec url('../../img/social/newsvine.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.newsvine:hover{ background: #37bd4a url('../../img/social/newsvine.png') no-repeat center; } /* SOCIAL ORKUT */ .social li.orkut{ background: #ececec url('../../img/social/orkut.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.orkut:hover{ background: #d135ad url('../../img/social/orkut.png') no-repeat center; } /* SOCIAL PAYPAL */ .social li.paypal{ background: #ececec url('../../img/social/paypal.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.paypal:hover{ background: #043262 url('../../img/social/paypal.png') no-repeat center; } /* SOCIAL PINTEREST */ .social li.pinterest{ background: #ececec url('../../img/social/pinterest.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.pinterest:hover{ background: #ad2d2c url('../../img/social/pinterest.png') no-repeat center; } /* SOCIAL PLURK */ .social li.plurk{ background: #ececec url('../../img/social/plurk.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.plurk:hover{ background: #f56b46 url('../../img/social/plurk.png') no-repeat center; } /* SOCIAL POSTEROUS */ .social li.posterous{ background: #ececec url('../../img/social/posterous.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.posterous:hover{ background: #ffe378 url('../../img/social/posterous.png') no-repeat center; } /* SOCIAL REDDIT */ .social li.reddit{ background: #ececec url('../../img/social/reddit.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.reddit:hover{ background: #a4b3b8 url('../../img/social/reddit.png') no-repeat center; } /* SOCIAL RSS */ .social li.rss{ background: #ececec url('../../img/social/rss.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.rss:hover{ background: #fe9900 url('../../img/social/rss.png') no-repeat center; } /* SOCIAL SKYPE */ .social li.skype{ background: #ececec url('../../img/social/skype.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.skype:hover{ background: #00b0f6 url('../../img/social/skype.png') no-repeat center; } /* SOCIAL STUMBLEUPON */ .social li.stumbleupon{ background: #ececec url('../../img/social/stumbleupon.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.stumbleupon:hover{ background: #ee4723 url('../../img/social/stumbleupon.png') no-repeat center; } /* SOCIAL TECHNORATI */ .social li.technorati{ background: #ececec url('../../img/social/technorati.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.technorati:hover{ background: #0fd55a url('../../img/social/technorati.png') no-repeat center; } /* SOCIAL TUMBLR */ .social li.tumblr{ background: #ececec url('../../img/social/tumblr.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.tumblr:hover{ background: #304f6c url('../../img/social/tumblr.png') no-repeat center; } /* SOCIAL TWITTER */ .social li.twitter{ background: #ececec url('../../img/social/twitter.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.twitter:hover{ background: #5dc9f2 url('../../img/social/twitter.png') no-repeat center; } /* SOCIAL VIMEO */ .social li.vimeo{ background: #ececec url('../../img/social/vimeo.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.vimeo:hover{ background: #80ceff url('../../img/social/vimeo.png') no-repeat center; } /* SOCIAL WORDPRES*/ .social li.wordpress{ background: #ececec url('../../img/social/wordpress.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.wordpress:hover{ background: #454442 url('../../img/social/wordpress.png') no-repeat center; } /* SOCIAL YAHOO */ .social li.yahoo{ background: #ececec url('../../img/social/yahoo.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.yahoo:hover{ background: #660f6e url('../../img/social/yahoo.png') no-repeat center; } /* SOCIAL YELP */ .social li.yelp{ background: #ececec url('../../img/social/yelp.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.yelp:hover{ background: #c82818 url('../../img/social/yelp.png') no-repeat center; } /* SOCIAL YOUTUBE */ .social li.youtube{ background: #ececec url('../../img/social/youtube.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.youtube:hover{ background: #c82818 url('../../img/social/youtube.png') no-repeat center; } /* SOCIAL ZERPLY */ .social li.zerply{ background: #ececec url('../../img/social/zerply.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.zerply:hover{ background: #9cbd76 url('../../img/social/zerply.png') no-repeat center; } /* SOCIAL ZOOTOOL */ .social li.zootool{ background: #ececec url('../../img/social/zootool.png') no-repeat center; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social li.zootool:hover{ background: #232122 url('../../img/social/zootool.png') no-repeat center; } /* SOCIAL GRID_12 ON PRESENTATION PAGE "MEDIA" */ .grid_12 .social.presentation{ margin-bottom: 40px; float: left; width: 100%; } .grid_12 .social.presentation li{ float: left; margin-bottom: 5px; } .grid_12 .social.presentation-loading{ margin-bottom: 40px; float: left; background: url('../../img/ajax-loader.gif') no-repeat center center; } /* SEARCH FIELD */ #search{ width: 213px; height: 28px; border: 1px solid #ececec; float: left; margin-bottom: 25px; background: #fff; overflow: hidden; position: relative; } .search-bkg{ color: #8f8f8f; background: #fff; width: 155px; height: 13px; padding: 7px 0 7px 15px; margin-right: 10px; border: none; float: left; font: 10px 'Arial', sans-serif; font-style: italic; } #search-submit{ border: none; background: #fafafa url('../../img/search.png') no-repeat center; border-left: 1px solid #ececec; width: 33px; height: 28px; padding-top: 12px; text-indent: -9999px; cursor: pointer; -webkit-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; -ms-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; } /* MAIN NAVIGATION CONTAINER */ #nav-container{ width: 938px; border: 1px solid #ececec; background: #fafafa; height: 50px; float: left; } #nav-container select{ display: none; } /* NAVIGATION */ #nav{ width: 100%; float: left; list-style: none; height: 50px; } #nav > ul{ display: block !important; padding:0; margin:0; } #nav li{ float: left; font-weight:900; list-style: none; position: relative; padding:0; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } #nav li a{ border-right: 1px solid #E5E5E5; display: block; float: none; font: 16px/12px 'Trebuchet MS',sans-serif; padding: 19px 29.5px 19px 30px; text-decoration: none; text-transform: uppercase; } #nav li:last-child a{ border-right:none; } #nav li:hover > ul{ display: block; } #nav li.current-menu-item li a{ color: #6f6f6f; border-right: none; } /* SUBMENU */ #nav li ul{ display: none; position: absolute; padding-top: 5px; margin: 0; top: 100%; left: 0; z-index: 100; } #nav li ul li{ border-top: 1px solid #ececec; border-right: 1px solid #ececec; border-left: 1px solid #ececec; background: #fafafa; padding: 12px 20px !important; } #nav li ul li:hover{ border-bottom: none; background-color:#e07317!important; } #nav li ul li:last-of-type{ border-bottom: 1px solid #ececec; } #nav li ul li a{ text-transform: none !important; font: 14px 'Trebuchet MS', sans-serif; line-height: 15px; color: #8f8f8f; padding: 0; border: none; } #nav li ul li, #nav li ul li a{ float: none; } #nav li ul li a { width: 210px; display: block; } /* THIRD LEVEL */ #nav li ul li ul { display: none; } #nav li ul li ul a{ color: #8f8f8f !important; } #nav li ul li:hover ul { left: 100%; top: -1px; padding-top: 0 !important; padding-left: 5px; } /* PAGE TITLE */ #page-title{ width: 100%; background: url('../../img/page-title.png') repeat-x; height: 70px; margin-bottom: 30px; float: left; } #page-title h1{ text-transform: uppercase; font: 24px 'trebuchet',sans-serif; text-align: center; margin: 0 auto; color: #e07317; margin-top: 24px; } /*===================================================================================== CONTENT WRAPPER STYLES ======================================================================================*/ #content-wrapper{ margin: 0 auto; padding-bottom: 10px; width: 960px; overflow: hidden; } .section-title{ margin-bottom: 20px; border-bottom: 1px solid #ececec; width: 100%; float: left; margin-right: 10px; margin-left: 10px; } .section-title h5{ float: left; margin-bottom: 9px; } .section-title h5 a{ color: #3B6E8E; font: bold 18px 'Droid Sans',sans-serif; text-decoration: none; } /* section title within a div (column grid) - no need for right margin */ .grid_1 .section-title, .grid_2 .section-title, .grid_3 .section-title, .grid_4 .section-title, .grid_5 .section-title, .grid_6 .section-title, .grid_7 .section-title, .grid_8 .section-title, .grid_9 .section-title, .grid_10 .section-title, .grid_11 .section-title, .grid_12 .section-title{ margin-left: 0 !important; margin-right: 0 !important; } .grid_12.note{ background: #f4f4f4; width: 940px; } .grid_12.note .text{ font: italic 16px 'Droid Serif', serif; padding: 35px 15px 35px 0; float: left; text-align: center; min-width: 580px; } .grid_12.note.single-row .text{ padding: 35px; min-width: 0; width: 670px; } .grid_12.note .first-part{ font: italic 16px 'Droid Serif', serif; padding: 35px 0 35px 35px; float: left; text-align: center; min-width: 45px; } .grid_12.note .divider{ background: url("../../img/note-divider.jpg") no-repeat; width: 55px; height: 89px; float: left; margin: 0 5px; } .grid_12.note .btn-big{ margin-top: 20px; margin-right: 35px; margin-bottom: 20px; width: auto; } /*===================================================================================== HOME PAGE STYLES ======================================================================================*/ .carousel{ width: 100%; float: left; } .carousel.grid_12 { margin-bottom: 18px; margin-left: 0; margin-top: -3px; overflow: hidden; width: 667px; } .carousel .caroufredsel_wrapper{ height: 190px !important; margin-bottom: 0 !important; margin-left: 0 !important; } .carousel .grid_12 { width:667px; } .carousel .carousel-nav{ margin-bottom: -15px; padding-bottom: 0; padding-top: 0; } .carousel .img-hover{ display:none!important; } .carousel .carousel-li > li { box-shadow: 0 0 6px #999999; margin-bottom: 5px; margin-left: 5px; margin-right: 15px; padding-left: 0; width: 205px; } .carousel figure.img-styled figcaption{ display:none; } .carousel .section-title h6{ display:none; } .carousel figure.img-styled img{ width: 205px; } .carousel .jcarousellite li{ background:none; } .carousel .section-title h6{ width: 50%; float: left; } .carousel .carousel-nav{ float: right; width: 50%; } .carousel .carousel-nav li{ float: right; margin-right: 5px; background: #8f8f8f; position: relative; top: -2px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .carousel .carousel-nav li:first-child{ margin-right: 0; } .carousel .carousel-nav li a.next{ background: url('../../img/next.png') no-repeat 9px center; width: 22px; height: 22px; display: block; } .carousel .carousel-nav li a.prev{ background: url('../../img/prev.png') no-repeat 8px center; width: 22px; height: 22px; display: block; } .carousel .section-title{ border-bottom: none; margin-bottom: 10px; } .carousel-li{ width: 100%; float: left; } .carousel-li > li{ width: 220px; float: left; margin-right: 20px; height: auto !important; } .carousel-li li img{ opacity: 0.7; -webkit-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; -ms-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; } .carousel-li li img:hover{ opacity: 1; } .carousel-li .img-hover{ top: 70% !important; } /*===================================================================================== ABOUT US PAGE STYLES ======================================================================================*/ .team img{ float: left; margin-right: 20px; } .team h5{ text-transform: none; color: #666; position: relative; top: -6px; } .team .social{ width: auto; float: left; } .team .social li{ float: left; margin-top: 20px; } /*===================================================================================== SERVICES PAGE STYLES ======================================================================================*/ .services-info{ width: 100%; float: left; } .services-info h6{ height: 50px; padding-top: 19px; } .home .services-wrap{ margin-bottom: 0; } .services-wrap h6.title{ padding-top: 19px; height: 50px; } .services-wrap .icon{ width: 60px; height: 60px; margin-right: 20px; display: block; float: left; text-indent: -9999px; cursor: pointer; -webkit-transition: all 0.2s ease 0s; -moz-transition: all 0.2s ease 0s; -o-transition: all 0.2s ease 0s; -ms-transition: all 0.2s ease 0s; transition: all 0.2s ease 0s; } .icon-brush{ background: #ececec url('../../img/services/brush.png') no-repeat; background-position: -60px -0px; } .icon-box{ background: #ececec url('../../img/services/box.png') no-repeat; background-position: -60px -0px; } .icon-mac{ background: #ececec url('../../img/services/mac.png') no-repeat; background-position: -60px -0px; } .icon-chart{ background: #ececec url('../../img/services/chart.png') no-repeat; background-position: -60px -0px; } .icon-pie{ background: #ececec url('../../img/services/pie.png') no-repeat; background-position: -60px -0px; } .icon-rocke-t{ background: #ececec url('../../img/services/rocke-t.png') no-repeat; background-position: -60px -0px; } .icon-android{ background: #ececec url('../../img/services/android.png') no-repeat; background-position: -60px -0px; } .icon-arrow-down{ background: #ececec url('../../img/services/arrow-down.png') no-repeat; background-position: -60px -0px; } .icon-arrow-left{ background: #ececec url('../../img/services/arrow-left.png') no-repeat; background-position: -60px -0px; } .icon-arrow-right{ background: #ececec url('../../img/services/arrow-right.png') no-repeat; background-position: -60px -0px; } .icon-arrow-up{ background: #ececec url('../../img/services/arrow-up.png') no-repeat; background-position: -60px -0px; } .icon-book{ background: #ececec url('../../img/services/book.png') no-repeat; background-position: -60px -0px; } .icon-calendar{ background: #ececec url('../../img/services/calendar.png') no-repeat; background-position: -60px -0px; } .icon-camera{ background: #ececec url('../../img/services/camera.png') no-repeat; background-position: -60px -0px; } .icon-chain{ background: #ececec url('../../img/services/chain.png') no-repeat; background-position: -60px -0px; } .icon-chain2{ background: #ececec url('../../img/services/chain2.png') no-repeat; background-position: -60px -0px; } .icon-chrome{ background: #ececec url('../../img/services/chrome.png') no-repeat; background-position: -60px -0px; } .icon-firefox{ background: #ececec url('../../img/services/firefox.png') no-repeat; background-position: -60px -0px; } .icon-safari{ background: #ececec url('../../img/services/safari.png') no-repeat; background-position: -60px -0px; } .icon-clapboard{ background: #ececec url('../../img/services/clapboard.png') no-repeat; background-position: -60px -0px; } .icon-cog{ background: #ececec url('../../img/services/cog.png') no-repeat; background-position: -60px -0px; } .icon-construction{ background: #ececec url('../../img/services/construction.png') no-repeat; background-position: -60px -0px; } .icon-cup{ background: #ececec url('../../img/services/cup.png') no-repeat; background-position: -60px -0px; } .icon-cut{ background: #ececec url('../../img/services/cut.png') no-repeat; background-position: -60px -0px; } .icon-download{ background: #ececec url('../../img/services/download.png') no-repeat; background-position: -60px -0px; } .icon-flag{ background: #ececec url('../../img/services/flag.png') no-repeat; background-position: -60px -0px; } .icon-folder{ background: #ececec url('../../img/services/folder.png') no-repeat; background-position: -60px -0px; } .icon-globe{ background: #ececec url('../../img/services/globe.png') no-repeat; background-position: -60px -0px; } .icon-graph{ background: #ececec url('../../img/services/graph.png') no-repeat; background-position: -60px -0px; } .icon-hd{ background: #ececec url('../../img/services/hd.png') no-repeat; background-position: -60px -0px; } .icon-help{ background: #ececec url('../../img/services/help.png') no-repeat; background-position: -60px -0px; } .icon-home{ background: #ececec url('../../img/services/home.png') no-repeat; background-position: -60px -0px; } .icon-idea{ background: #ececec url('../../img/services/idea.png') no-repeat; background-position: -60px -0px; } .icon-image{ background: #ececec url('../../img/services/image.png') no-repeat; background-position: -60px -0px; } .icon-lab{ background: #ececec url('../../img/services/lab.png') no-repeat; background-position: -60px -0px; } .icon-label{ background: #ececec url('../../img/services/label.png') no-repeat; background-position: -60px -0px; } .icon-lock{ background: #ececec url('../../img/services/lock.png') no-repeat; background-position: -60px -0px; } .icon-mail{ background: #ececec url('../../img/services/mail.png') no-repeat; background-position: -60px -0px; } .icon-marker{ background: #ececec url('../../img/services/marker.png') no-repeat; background-position: -60px -0px; } .icon-paperclip{ background: #ececec url('../../img/services/paperclip.png') no-repeat; background-position: -60px -0px; } .icon-pdf{ background: #ececec url('../../img/services/pdf.png') no-repeat; background-position: -60px -0px; } .icon-pencil{ background: #ececec url('../../img/services/pencil.png') no-repeat; background-position: -60px -0px; } .icon-phone{ background: #ececec url('../../img/services/phone.png') no-repeat; background-position: -60px -0px; } .icon-preview{ background: #ececec url('../../img/services/preview.png') no-repeat; background-position: -60px -0px; } .icon-rss{ background: #ececec url('../../img/services/rss.png') no-repeat; background-position: -60px -0px; } .icon-shop{ background: #ececec url('../../img/services/shop.png') no-repeat; background-position: -60px -0px; } .icon-speach-buble{ background: #ececec url('../../img/services/speach-buble.png') no-repeat; background-position: -60px -0px; } .icon-speaker{ background: #ececec url('../../img/services/speaker.png') no-repeat; background-position: -60px -0px; } .icon-tool{ background: #ececec url('../../img/services/tool.png') no-repeat; background-position: -60px -0px; } .icon-warning{ background: #ececec url('../../img/services/warning.png') no-repeat; background-position: -60px -0px; } .services-wrap.services-presentation .icon{ margin-right: 2px; margin-bottom: 2px; } /*===================================================================================== PORTFOLIO PAGE STYLES ======================================================================================*/ /* PORTFOLIO FILTER QUICKSAND STYLE */ #portfolio-filter{ float: right; display: inline; margin-left: 20px; padding-top: 8px; } #portfolio-filter li{ background: none repeat scroll 0 0 transparent; float: left; font: 12px/22px 'Droid Sans',sans-serif; margin-right: 1px; padding-left: 1px; position: relative; top: -6px; } #portfolio-filter li a{ color: #a1a3a6; padding-right: 5px; padding-left: 5px; font-size:14px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } /* PORTFOLIO IMAGE STYLE */ figure.img-styled img{ opacity: 0.7; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } figure.img-styled:hover img{ opacity: 1; } figure.img-styled .img-container{ position: relative; overflow: hidden; } figure.img-styled .img-hover{ position: absolute !important; top: 75%; width: 100%; } figure.img-styled .img-hover{ display: none; position: relative; } figure.img-styled .img-hover-container{ margin: 0 auto; float: none; display: table; height: 100%; background: none repeat scroll 0 0 transparent; } figure.img-styled .img-hover-container li{ float: left; margin-right: 10px; margin-top: 10px; margin-bottom: 10px; } figure.img-styled .img-hover li a{ background: none repeat scroll 0 0 transparent; color: #FFFFFF; display: block; text-transform: capitalize; font-size:13px; } figure.img-styled .img-hover li.title{ padding-left: 10px; } figure.img-styled .img-hover li.title a, figure.img-styled .img-hover li.portfolio-single a{ text-indent: 0; border-right: 1px solid #fff; padding-right: 10px; background: none repeat scroll 0 0 transparent; } figure.img-styled .img-hover li.portfolio-single{ /* background: url('../../img/chain.png') no-repeat center; */ background: none repeat scroll 0 0 transparent; opacity: 1; width: auto; } #filter-item figure.img-styled .img-hover li.portfolio-single:hover, #filter-item figure.img-styled .img-hover li.portfolio-zoom:hover{ background: none repeat scroll 0 0 transparent; } figure.img-styled .img-hover li.portfolio-grid{ background: url('../../img/grid.png') no-repeat center; width: 11px; } figure.img-styled .img-hover li.portfolio-zoom{ /* background: url('../../img/zoom.png') no-repeat center; */ background: none repeat scroll 0 0 transparent; } figure.img-styled .img-hover li.video-play{ background: url('../../img/play.png') no-repeat center; width: 11px; } figure.no-sliding .img-hover{ display: block; } figure.img-styled figcaption{ width: 100%; padding-top: 10px; padding-bottom: 10px; background: #f4f4f4; border-bottom: 1px solid #e5e5e5; } #content-wrapper figure.img-styled figcaption p{ font-size: 13px; margin-bottom: 0; text-align: center; text-transform: none; color:#003366; } /* PORTFOLIO WITH SHOWCASE */ .showcase-wrapper{ width: 100%; margin: 0 auto 50px; float: left; background: url('../../img/patt.png') repeat; } .showcase-wrapper .shadow-top{ width: 100%; height: 12px; background: url('../../img/shadow-top.png') repeat-x; margin-bottom: -12px; } .showcase-wrapper .shadow-bottom{ width: 100%; height: 12px; background: url('../../img/shadow-bottom.png') repeat-x; margin-top: -12px; float: left } .showcase{ width: 940px; margin: 0 auto; } .showcase .section-title{ width: 100%; margin-top: 30px; margin-bottom: 20px; margin-left: 0; margin-right: 0; border-bottom: 1px solid #fff; } .showcase .section-title h5{ width: 50%; } /* SHOWCASE NAVIGATION STYLE */ .showcase-nav{ float: right; display: inline; position: relative; } .showcase-nav li{ float: left; } .showcase-nav li a{ padding-right: 5px; color: #a1a3a6; } .showcase-nav li span{ padding-right: 5px; color: #C5C4C4; } .showcase-nav.bottom{ width: 100%; border-top: 1px solid #fff; padding-top: 5px; margin-left: 0; margin-right: 0; } .showcase-nav.bottom li{ float: right; } /*SHOWCASE ITEM STYLE */ .showcase-item{ margin-top: 10px; margin-right: 0; margin-left: 0; } .showcase-item img{ margin-right: 30px; width: 600px; float: left; height: auto; } .showcase-item .description{ width: 310px; float: left; } .showcase-item .description ul li{ font: 12px 'Droid Sans', sans-serif; line-height: 22px; border-bottom: 1px solid #fff; color: #999999; margin-bottom: 10px; } .showcase-item .description ul li a{ padding-left: 5px; } .showcase-item .description p{ margin-bottom: 20px; } .showcase-item .description .btn-big{ float: right; } /* ACTIVE IMAGE IN SHOWCASE PORTFOLIO LIST */ .showcase-li figure.img-styled img{ opacity: 0.6; } .showcase-li figure.img-styled:hover img{ opacity: 1 !important; } .img-styled.showcase-active img{ opacity: 1 !important; } /*PORTFOLIO SINGLE PROJECT WITHOUT SHOWCASE */ .showcase-wrapper.single{ background: none; } .showcase-wrapper.single .showcase .section-title{ margin-top: 0; border-bottom: 1px solid #ececec; } .showcase-wrapper.single .showcase-item .description ul li{ border-bottom: 1px solid #ececec; } /* PORTFOLIO VIDEO ITEM */ .portfolio-video-container{ float: left; margin-right: 30px; } .portfolio-video-container.full-width-video{ margin: 0; } .portfolio-video-container iframe{ width: 600px !important; height: 337px !important; } .portfolio-video-container.full-width-video iframe{ width: 940px !important; height: 627px !important; } .serv-box{ float: left; margin-bottom: 14px; margin-left: 20px; min-height: 325px; width: 47%; } .serv-box h4{ font-size: 20px; margin-bottom: 0; } .serv-box img{ border: 2px solid #EAE9DA; padding: 4px; margin-bottom:5px; } .serv-box p{ font-size: 14px; line-height: 20px; margin: 0; } /*===================================================================================== BLOG PAGE STYLES ======================================================================================*/ .grid_9.blog{ width: 670px; padding-right: 20px; float: left; } /*last post has no margin bottom nor padding bottom */ .grid_9.blog li.blog-post.last-on-page{ margin-bottom: 0px; padding-bottom: 40px; } .grid_9.blog li.blog-post.last-on-page .entry-content{ border-bottom: none; margin-bottom: 0; padding-bottom: 0; } .grid_9.blog .blog-post{ background: none repeat scroll 0 0 transparent; float: left; margin-bottom: 40px; width: 100%; } /* META STYLES ON BLOG POST*/ .grid_9.blog .meta{ width: 60px; margin-right: 20px; float: left; cursor: pointer; } .grid_9.blog .meta li{ background: none repeat scroll 0 0 transparent; float: left; margin-bottom: 10px; padding-left: 0; } .grid_9.blog .meta .category{ width: 100%; height: 60px; text-indent: -9999px; } .grid_9.blog .meta .date{ width: 100%; height: 60px; background: #ececec; text-transform: uppercase; } .grid_9.blog .meta .date p{ color: #828282; font: bold 14px 'Droid Sans', sans-serif; text-align: center; padding-top: 14px; } /* META STYLES FOR HOME PAGE BLOG BOX*/ .grid_8.blog-widget .grid_4{ margin-bottom: 0; } .grid_8.blog-widget img{ width: 300px; opacity: 0.7; } .grid_8.blog-widget img:hover{ opacity: 1; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .grid_8.blog-widget .entry-container{ width: 279px; border-right: 1px dashed #ececec; padding-right: 20px; } .grid_8.blog-widget .meta{ width: 100%; overflow: hidden; margin-bottom: 20px; } .grid_8.blog-widget .date{ width: 60px; height: 60px; background: #ececec; text-transform: uppercase; float: left; margin-right: 20px; } .grid_8.blog-widget .date p{ color: #828282; font: bold 14px 'Droid Sans', sans-serif; text-align: center; padding-top: 14px; } .grid_8.blog-widget .title{ float: left; width: 199px; } .grid_8.blog-widget .title a{ display: table; height: 60px; } .grid_8.blog-widget .title h5{ display: table-cell; vertical-align: middle; } /* STYLES FOR HOMEPAGE CONTACT INFO BOX */ .grid_4.contact-info .telephone{ background: url('../../img/contact-telephone.png') no-repeat left center; padding-left: 36px; margin-top: 10px; } .grid_4.contact-info .email{ background: url('../../img/contact-email.png') no-repeat left center; padding-left: 36px; margin-top: 10px; } /* POST CONTENT(POST IMAGE, TITLE AND TEXT) STYLING */ .grid_9.blog .entry-content{ float: left; width: 560px; position: relative; border-bottom: 1px solid #ececec; padding-bottom: 40px; } .grid_9.blog .entry-content figure{ margin-bottom: 20px; position: relative; } .entry-content figure.img-styled .img-hover li.title a{ border-right: none; } .entry-content .video-container .title a{ border-right: 1px solid #fff !important; } .entry-content .video-container{ margin-bottom: 20px; } .entry-content .video-container figure { margin-bottom: 0 !important; } /* BLOG SINGLE POST*/ .grid_9.blog.single .blog-post{ margin-bottom: 0; } .grid_9.blog.single .entry-content{ border-bottom: none; min-height: 150px; } /* BLOG POST COMMENTS */ .grid_9.blog .post-comments{ float: left; width: 600px; margin-left: 80px; margin-bottom: 40px; } .blog-post #respond h3{ border-bottom: 1px solid #ececec; padding-bottom: 5px; font: bold 14px 'Droid Sans', sans-serif; line-height: 24px; } .post-comments .comments-li{ float: left; width: 100%; margin-top: 20px; } .post-comments .comments-li > li{ float: left; width: 100%; } .post-comments .comments-li .comment{ margin-bottom: 15px; padding-left: 117px; background: #fcfcfc; padding-top: 15px; padding-right: 15px; padding-bottom: 15px; position: relative; min-height: 90px; } .wp-link-pages{ margin-top: 20px; font-weight: bold; text-transform: uppercase; } /* Comments Pagination */ .post-comments .comments-pagination{ padding-top: 40px; float: right; } .post-comments .comments-pagination .page-numbers { float: left; background: #ececec; color: #828282; height: 20px; text-align: center; margin-left: 5px; font: 12px Arial, sans-serif; padding: 6px 9px 0; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .post-comments .comments-pagination .page-numbers.prev, .post-comments .comments-pagination .page-numbers.next{ background: #8F8F8F; color: #fff; } /* COMMENT AVATAR */ .post-comments .comments-li .comment .avatar-container{ position: absolute; left: 15px; width: 87px; } /* COMMENT META */ .post-comments .comments-li .comment .comment-meta{ color: #a9a9a9; font: 12px 'Droid Sans', sans-serif; margin: 0 0 10px; } .post-comments .comments-li .comment .comment-meta h5 a{ color: #666666; font: bold 14px Arial, sans-serif; } .post-comments .comments-li .comment .comment-meta h5{ border-bottom: none; font: bold 14px Arial, sans-serif; cursor: pointer; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } /* CHILD COMMENT */ .children{ margin-left: 100px; margin-bottom: 15px; } /* COMMENT FORM */ .grid_9.blog .blog-post #respond{ margin-bottom: 20px; margin-left: 80px; } .grid_9.blog .blog-post .post-comments #respond{ margin-left: 0; } #respond #submit{ min-width: 100px; height: 30px; float: right; margin-top: 20px; box-shadow: 0 1px 2px #CCC; -webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none; transition: none; color: white; font: bold 12px 'Droid Sans',sans-serif; cursor: pointer; background: url('../img/blue-default/btn-med.png') repeat-x; background-position: -0px -0px; border: 1px solid #5BB9BF; } .grid_9.blog .blog-post #respond h5{ border-bottom: 1px solid #ececec; padding-bottom: 5px; } #respond form{ margin-top: 20px; overflow: hidden; } #respond label{ width: 100%; font: 12px 'Droid Sans', sans-serif; color: #828282; display: block; margin-bottom: 15px; margin-top: 15px; } #respond .name, #respond .email, #respond .url{ background: #fff; border: 1px solid #ccc; border-radius: 2px; width: 300px; height: 12px; font: 12px 'Droid Sans', sans-serif; padding: 10px; color: #a9a9a9; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } #respond .comment-text{ background: #fff; border: 1px solid #ccc; border-radius: 2px; width: 100%; font: 12px 'Droid Sans', sans-serif; line-height: 22px; padding: 10px; color: #a9a9a9; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } #respond .submit{ color: #fff; font: bold 12px 'Droid Sans',sans-serif; cursor: pointer; } #respond .name:focus, #respond .email:focus, #respond .url:focus, #respond .comment-text:focus{ border-color: #aaa; } /*===================================================================================== CONTACT PAGE STYLE ======================================================================================*/ .contact-form{ float: left; width: 100%; } .contact-form form{ padding-right: 20px; position: relative; top: -10px; width: 100%; } .contact-form label{ width: 100%; font: 12px 'Droid Sans', sans-serif; color: #828282; display: block; margin-bottom: 15px; margin-top: 15px; } .contact-form .name, .contact-form .email{ background: #fff; border: 1px solid #ccc; border-radius: 2px; width: 300px; height: 12px; font: 12px 'Droid Sans', sans-serif; padding: 10px; color: #a9a9a9; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .contact-form .contact-message{ background: #fff; border: 1px solid #ccc; border-radius: 2px; width: 438px; font: 12px 'Droid Sans', sans-serif; line-height: 22px; padding: 10px; color: #a9a9a9; } .contact-form .submit{ color: #fff; font: bold 12px 'Droid Sans',sans-serif; cursor: pointer; } .contact-form .name:focus, .contact-form .email:focus, .contact-form .contact-message:focus{ border-color: #aaa; } #recaptcha-div{ display: none; } /* GOOGLE MAPS CONTAINER - DEFAULT IS WIDE MAP */ #map_canvas{ float: left; width: 100%; height: 400px; margin-bottom: 30px; } /* CLASS FOR SHORT MAP VERSION ON CONTACT PAGE */ .map-short{ width: 940px; margin: 0 auto; } /*===================================================================================== SIDEBAR STYLE ======================================================================================*/ .aside{ float: right; } .aside-widgets{ float: left; } .widget{ margin-bottom: 40px; float: left; width: 100%; font: 12px 'Droid Sans', sans-serif; line-height: 20px; } .widget h6{ margin-bottom: 20px; text-decoration: none; color:003366; } .aside-widgets .widget h6{ border-bottom: 1px solid #ececec; padding-bottom: 5px; } .widget li{ padding-bottom: 10px; background:none!important; } .aside li{ background:none!important; } .widget a{ color: #828282; font: 12px 'Droid Sans', sans-serif; line-height: 20px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } /* WIDGETS LIKE CATEGORIES AND ARCHIVES */ .widget.widget_categories li, .widget.widget_archive li, .widget_recent_entries li, .widget.widget_meta li, .widget.widget_links li, .widget.widget_recent_comments li, .widget.widget_pages li, .widget.widget_nav_menu li{ padding-top: 5px; padding-bottom: 5px; color: #BBB; border-bottom: 1px dotted #EEE; background: url('../../img/aside.png') no-repeat 0 12px; } .widget.widget_categories li:first-child, .widget.widget_archive li:first-child, .widget_recent_entries:first-child, .widget.widget_meta:first-child, .widget.widget_links:first-child, .widget.widget_recent_comments:first-child, .widget.widget_pages:first-child, .widget.widget_nav_menu:child-child{ padding-top: 0; background: url('../../img/aside.png') no-repeat 0 7px; } .widget_categories li:last-child, .widget_archive li:last-child, .widget_recent_entries li:last-child, .widget.widget_meta li:last-child, .widget.widget_links li:last-child, .widget.widget_recent_comments li:last-child, .widget.widget_pages li:last-child, .widget.widget_nav_menu:last-child{ border-bottom: none; } .widget_categories a, .widget_archive a, .widget_recent_entries a, .widget.widget_meta a, .widget.widget_links a, .widget.widget_recent_comments a, .widget.widget_pages a, .widget.widget_nav_menu a{ padding-left: 15px; } /* WIDGET PAGES */ .widget.widget_pages .children{ margin: 0; padding-left: 15px; } .widget.widget_pages .children li:last-child{ padding-bottom: 0; border: none; } .widget.widget_pages .children .children li:last-child{ padding-bottom: 5px; } /* WIDGET CATEGORIES */ .widget.widget_categories select{ border: 1px solid #ececec; color: #828282; } /* NAV MENU WIDGET */ .widget.widget_nav_menu .menu .sub-menu{ padding-left: 15px; } .widget.widget_nav_menu .menu li:last-child{ padding-bottom: 0; border: none; } .widget.widget_nav_menu .menu .sub-menu .sub-menu:first-child{ padding-top: 5px; } /* ARCHIVES WIDGET */ .widget.widget_archive select{ border: 1px solid #ececec; color: #828282; } /* TEXT WIDGET */ .textwidget{ font: normal 12px 'Droid Sans', sans-serif; line-height: 20px; } /* WIDGET RECENT ENTRIES */ .widget.widget_rss ul li a{ } .widget.widget_rss .rss-date{ font-size: 75%; } /* CALENDAR WIDGET */ .widget.widget_calendar #wp-calendar{ width: 100%; } .widget.widget_calendar #wp-calendar caption{ text-align: center; font-weight: bold; text-transform: uppercase; } .widget.widget_calendar #wp-calendar thead{ background: #ececec; } .widget.widget_calendar #wp-calendar tfoot{ background: #fafafa; padding-top: 5px; } .widget.widget_calendar #wp-calendar tfoot #prev{ text-align: left; } .widget.widget_calendar #wp-calendar tfoot #next{ text-align: right; } .widget.widget_calendar #wp-calendar td, .widget.widget_calendar #wp-calendar th{ text-align: center; } /* TABS IN SIDEBAR */ .textwidget .tabs li{ padding-bottom: 0; } .textwidget .tabs li a{ display: inline; -webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none; transition: none; } /* TAGS WIDGET */ .widget_tag_cloud .tagcloud a{ background: #8f8f8f; color: #fff; padding: 5px; margin: 0 6px 6px 0; float: left; } /* Newsletter shortcode */ .textwidget .newsletter{ margin-top: 20px; overflow: hidden; width: 100%; } .textwidget .newsletter .email{ background: #fff; border: 1px solid #ececec; height: 19px; padding: 5px 7px 5px; float: left; width: 132px; color: #828282; font-size: 11px; } .textwidget .newsletter .email:focus{ border: 1px solid #d9d9d9; } .textwidget .newsletter .submit{ background: #fafafa; width: 72px; border: 1px solid #ececec; border-left: none; padding: 7px 5px 8px; float: left; color: #828282; margin: 0; font-size: 11px; } /*===================================================================================== PAGINATION STYLE ======================================================================================*/ .pagination{ width: 100%; float: right; margin-top: 40px; } .container_12 .pagination li{ float: left; background: #ececec; height: 31px; text-align: center; margin-left: 5px; font: 12px Arial, sans-serif; padding-left:0; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .pagination .page-numbers{ overflow: hidden; display: inline; float: right; } .pagination li a, .pagination li span{ color: #828282; padding-top: 6px; padding-right: 9px; padding-left: 9px; display: block; padding-bottom:6px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .pagination li .next, .pagination li .prev{ background: #8F8F8F; color: #fff; height: 19px; } .pagination li:hover a, .pagination li.active a{ color: #fff; } /* PORTFOLIO PAGE PAGINATION */ .pagination.portfolio{ margin-bottom: 40px; margin-top: 0px; margin-left: 10px; margin-right: 10px; width: 940px; } /*===================================================================================== FOOTER STYLES ======================================================================================*/ #footer{ background-color: #154565; border-top: 2px solid #E07317; clear: both; color: white; float: left; margin: 5px auto 0; padding-bottom: 10px; padding-top: 13px; width: 100%; } #footer .footwrap{ margin: 0 auto; width:960px; float:none; } #footer h6{ margin-bottom: 20px; } #footer a{ color:white; font-size:14px; } /* FOOTER COPYRIGHT INFO SECTION */ .container_12 .copyright{ padding-top: 0px; width: 940px; margin: 0 10px; } .container_12 .copyright p{ font: 11px Arial, sans-serif; color: #fff; float: left; width: 900px; margin-right: 15px; } /* bottom ruler in footer - doesn't have bottom margin */ .ruler.bottom{ margin-bottom: 0; } /* FROM FOOTER TO-TOP LINK STYLE */ .container_12 .copyright .to-top{ background: #8f8f8f; width: 25px; height: 25px; position: relative; top: -6px; cursor: pointer; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } /*===================================================================================== ELEMENTS ======================================================================================*/ /* BIG BUTTON */ .btn-big{ min-width: 143px; height: 45px; margin-top: 20px; float: right; box-shadow: 0 1px 1px #fff; -webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none; transition: none; } .btn-big span{ font: bold 17px 'Trebuchet MS', sans-serif; color: #fff; padding: 12px; display: block; text-align: center; } /* MEDIUM BUTTON STYLE */ .btn-medium{ min-width: 100px; height: 30px; float: right; margin-top: 20px; box-shadow: 0 1px 2px #ccc; -webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none; transition: none; } .btn-medium span{ font: bold 12px 'Droid Sans', sans-serif; color: #fff; padding: 9px 18px; display: block; text-align: center; } /* SMALL BUTTON STYLE */ .btn-small{ min-width: 70px; height: 26px; margin-top: 20px; float: right; box-shadow: 0 1px 2px #ccc; -webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none; transition: none; } .btn-small span{ font: bold 12px 'Droid Sans', sans-serif; color: #fff; padding: 7px; display: block; text-align: center; } /* CLASS PREVIEWN FOR STYLING BUTTONS JUST FOR TEMPLATE PREVIEW PURPOSES */ .preview{ float: left; margin-top: 0; margin-bottom: 10px; } /* CODE STYLING */ code{ float: left; width: 100%; background: #f6f6f6; padding: 5px 10px; margin-bottom: 20px; } /* DROPCAPS STYLES */ .dropcap1{ color: #666666; float: left; margin-right: 10px; font: 67px 'Droid Sans',sans-serif; line-height: 59px; } .dropcap2, .dropcap3{ color: #fff; background: #6f6f6f; float: left; margin-right: 10px; font: bold 35px 'Droid Sans',sans-serif; line-height: 35px; padding: 8px; position: relative; top: 3px; } .dropcap3{ width: 30px; height: 30px; border-radius: 30px; font: bold 32px 'Droid Sans',sans-serif; line-height: 30px; padding: 11px; text-align: center; } /* HORIZONTAL RULER STYLE */ .grid_1 .ruler, .grid_2 .ruler, .grid_3 .ruler, .grid_4 .ruler, .grid_5 .ruler, .grid_6 .ruler, .grid_7 .ruler, .grid_8 .ruler, .grid_9 .ruler, .grid_10 .ruler, .grid_11 .ruler, .grid_12 .ruler{ width:100% !important; background: #ececec; height: 1px; float: left; margin: 0; } .ruler{ width: 940px; background: #ececec; margin-bottom: 40px; margin-right: 10px; margin-left: 10px; height: 1px; float: left; } /* INFORMATION BOXES */ /*INFO BOX STYLE */ .infobox{ background: #e0f2ff; border: 1px solid #c1def2; width: 100%; float: left; margin-bottom: 10px; } .infobox p{ background: url('../../img/info-box.png') no-repeat 0 center; margin: 10px; padding-left: 25px; color: #61adb0; text-shadow: 0 1px 0 #fff; } /* WARNING BOX STYLE */ .warning-box{ background: #f3efd3; border: 1px solid #dedabd; width: 100%; float: left; margin-bottom: 10px; } .warning-box p{ background: url('../../img/warning-box.png') no-repeat 0 center; margin: 10px; padding-left: 27px; color: #a19c7a; text-shadow: 0 1px 0 #fff; } /* SHOP BOX STYLE */ .shop-box{ background: #b4dafb; border: 1px solid #9fc7eb; width: 100%; float: left; margin-bottom: 10px; } .shop-box p{ background: url('../../img/shop-box.png') no-repeat 0 center; margin: 10px; padding-left: 27px; color: #fff; text-shadow: 0 1px 0 #a3c2fc; } /* NOTE BOX STYLE */ .note-box{ background: #f8f6bc; border: 1px solid #e7e48b; border-radius: 3px; width: 100%; float: left; margin-bottom: 10px; } .note-box p{ background: url('../../img/note-box.png') no-repeat 0 center; margin: 10px; padding-left: 25px; color: #989426; text-shadow: 0 1px 0 #fff; } /* SUCCESS BOX STYLE */ .success-box{ background: #ebfdd7; border: 1px solid #cef4a4; border-radius: 3px; width: 100%; float: left; margin-bottom: 10px; } .success-box p{ background: url('../../img/success-box.png') no-repeat 0 center; margin: 10px; padding-left: 25px; color: #7eb244; text-shadow: 0 1px 0 #fff; } /* ERROR BOX STYLE */ .error-box{ background: #fadddd; border: 1px solid #fcc1c1; border-radius: 3px; width: 100%; float: left; margin-bottom: 10px; } .error-box p{ background: url('../../img/error-box.png') no-repeat 0 center; margin: 10px; padding-left: 25px; color: #d86d6d; text-shadow: 0 1px 0 #fff; } /* TABS STYLES */ .container_12 .tabs{ width: 100%; overflow: hidden; float: left; margin-left: 0; padding-top: 5px; margin-bottom: 10px; } .container_12 .tabs li{ background: #f8f8f8; float: left; border-top: 1px solid #ececec; border-right: 1px solid #ececec; border-bottom: 1px solid #ececec; overflow: hidden; position: relative; padding: 0; line-height: 32px; } .tabs li:first-child{ border-left: 1px solid #ececec; } .tabs li a{ color: #828282; padding: 0px 16px; text-shadow: 0 1px 0 #ffffff; line-height: 20px; } .tabs li.active{ border-bottom: 1px solid #fff; background: #fff; } .tabs li.active a{ line-height: 31px; } .tab-content-wrap{ float: left; margin-top: -1px; width: 100%; } .tab-content{ background: none repeat scroll 0 0 #FFFFFF; padding: 5px; } /* COLORED AND GREY LISTS STYLES */ .colored-list, .grey-list{ width: 100%; float: left; } .colored-list li, .grey-list li{ padding-bottom: 5px; padding-top: 5px; font: 12px 'Trebuchet MS', sans-serif; font-style:italic; line-height: 20px; color: #828282; border-bottom: 1px dotted #eee; } .border-list li{ border-bottom: 1px dotted #eee; background: url('../../img/aside.png') no-repeat 0 12px; } .border-list li:first-child{ background: url('../../img/aside.png') no-repeat 0 7px; } .colored-list li:first-child, .grey-list li:first-child{ padding-top: 0; } .colored-list li:last-child, .grey-list li:last-child{ border-bottom: none; } .colored-list li span, .grey-list li span{ padding-left: 30px; } .border-list{ } /* LISTS WITH GREY ICONS */ /* CHECKLIST */ .list-check.grey{ background: url('../../img/check-mark-grey.png') 0 5px no-repeat; } /* ARROW */ .list-arrow.grey{ background: url('../../img/arrow-mark-grey.png') 0 8px no-repeat; } /* ERROR */ .list-error.grey{ background: url('../../img/error-mark-grey.png') 0 11px no-repeat; } /* SQUARE */ .list-square.grey{ background: url('../../img/square-mark-grey.png') 0 11px no-repeat; } /* STAR */ .list-star.grey{ background: url('../../img/star-mark-grey.png') 0 9px no-repeat; } /* THUMBDOWN */ .list-thumbdown.grey{ background: url('../../img/thumbdown-mark-grey.png') 0 7px no-repeat; } /* THUMBUP */ .list-thumbup.grey{ background: url('../../img/thumbup-mark-grey.png') 0 7px no-repeat; } /*===================================================================================== MEDIA ======================================================================================*/ /* TWEETER WIDGET */ .tweets-list-container{ width: 100%; overflow: hidden; } .tweet-list{ position: relative; list-style-type: none; } .tweet-list li{ padding-bottom: 10px; } /* FLICKR FEED WIDGET */ .social-feed{ width: 100%; float: left; } .social-feed li{ float: left; width: 40px; height: 40px; margin-right: 5px; margin-bottom: 5px; opacity: 1; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -ms-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .social-feed li:hover{ opacity: 0.7; } .social-feed li:nth-child(5n){ margin-right: 0; } .social-feed li a img{ width: 40px; height: 40px; } /* VIDEO CONTAINER FOR VIMEO, YOUTUBE */ .video-container{ overflow: hidden; float: left; } /*===================================================================================== COLUMNS - 960 GS ILLUSTRATION ======================================================================================*/ p.big{ font-size: 14px; } .note.column-illustration{ background: #f6f6f6 !important; margin-bottom: 40px !important; } .grid_12.column-illustration{ margin-bottom: 20px; } .grid_12.column-illustration.last{ background: #f6f6f6; margin-bottom: 40px !important; cursor: pointer; } .column-illustration .grid_1, .column-illustration .grid_3, .column-illustration .grid_4, .column-illustration .grid_6, .column-illustration .grid_8, .column-illustration .grid_12{ background: #f6f6f6; margin-bottom: 0; cursor: pointer; } .column-illustration .grid_1 span, .column-illustration .grid_3 span, .column-illustration .grid_4 span, .column-illustration .grid_6 span, .column-illustration .grid_8 span, .column-illustration .grid_12 span, .grid_12.column-illustration.last span{ text-align: center; display: block; padding: 5px 0; } .column-illustration .grid_1 .hover, .column-illustration .grid_3 .hover, .column-illustration .grid_4 .hover, .column-illustration .grid_6 .hover, .column-illustration .grid_8 .hover, .column-illustration .grid_12 .hover, .grid_12.column-illustration.last .hover{ display: none; } .column-illustration .grid_1:hover .normal, .column-illustration .grid_3:hover .normal, .column-illustration .grid_4:hover .normal, .column-illustration .grid_6:hover .normal, .column-illustration .grid_8:hover .normal, .column-illustration .grid_12:hover .normal, .grid_12.column-illustration.last:hover .normal{ display: none; } .column-illustration .grid_1:hover .hover, .column-illustration .grid_3:hover .hover, .column-illustration .grid_4:hover .hover, .column-illustration .grid_6:hover .hover, .column-illustration .grid_8:hover .hover, .column-illustration .grid_12:hover .hover, .grid_12.column-illustration.last:hover .hover{ display: block; color: #fff; } /*===================================================================================== MEDIA QUERIES ======================================================================================*/ /* DEVICES BETWEEN 768PX AND 959px */ @media only screen and (min-width: 768px) and (max-width: 959px){ #header, #nav-container{ width: 724px; } #content-wrapper, .container_12, #footer{ width: 744px; } img{ max-width: 100% !important; } .ruler{ width: 724px; } .social{ width: 195px; } /* GRID SYSTEM */ .grid_1{ width: 42px !important; } .grid_2{ width: 104px !important; } .grid_3{ width: 166px !important; } .grid_4{ width: 228px !important; } .grid_5{ width: 290px !important; } .grid_6{ width: 352px !important; } .grid_7{ width: 414px !important; } .grid_8{ width: 476px !important; } .grid_9{ width: 538px !important; } .grid_10{ width: 600px !important; } .grid_11{ width: 662px !important; } .grid_12{ width: 724px !important; } /* PORTFOLIO CAROUSEL */ .carousel-li > li{ width: 232px !important; } .carousel-li .img-container{ width: 220px; } .carousel-li .img-styled{ width: 220px; } /* NOTE */ .grid_12.note .divider{ display: none; } .grid_12.note .text{ padding: 35px 25px 0 0; width: 594px !important; text-align: left; } .grid_12.note .btn-big{ display: none; } /* ABOUT US PAGE TEAM SOCIAL ICONS */ .team .social{ margin-bottom: 0; } /* PORTFOLIO WITH SHOWCASE */ .showcase{ width: 724px; } .showcase-item img{ max-width: 420px !important; } .showcase-item .description{ width: 274px; } .portfolio-video-container iframe{ max-width: 420px !important; height: 236px !important; } .portfolio-video-container.full-width-video iframe{ max-width: 724px !important; height: 483px !important; } /* BLOG PAGE */ .grid_9.blog{ width: 518px !important; } .grid_9.blog .entry-content, .grid_9.blog .post-comments, .grid_9.blog .blog-post .comment-form{ width: 438px; } .children{ margin-left: 50px; } /* Homepage blog widget */ .grid_8.blog-widget .entry-container{ width: 207px !important; border-right: 1px dashed #ececec; padding-right: 20px; } .comment-form .name, .comment-form .email{ width: 230px; } .comment-form .comment-text{ width: 416px; } .img-container li.title{ max-width: 100% !important; } .img-container img{ vertical-align: top; } /* ELEMENTS PAGE */ .tabs li:last-child{ display: none; } /* CONTACT PAGE */ .contact-form .name, .contact-form .email{ width: 230px; } .contact-form .contact-message{ width: 330px; } .map-short{ width: 724px; } /* PORTFOLIO IMAGE STYLE */ figure.img-styled img{ height: auto; } .jcarousellite figure.img-styled img{ height: auto; } .video-container{ width: 100%; } .video-container img{ width: 100%; height: auto; } .video-container .video-js{ width: 100% !important; height: 122px !important; } /* FOOTER COPYRGIHT */ .copyright{ width: 724px !important; } .copyright p{ width: 684px !important; } /* SOCIAL FEED */ .social-feed li:nth-child(3n){ margin-right: 0; } .social-feed li:nth-child(5n){ margin-right: 5px !important; } .textwidget .newsletter .submit{ border-left: 1px solid #ececec; margin-top: 5px; } } /* ALL MOBILE SIZES */ @media only screen and (min-width: 480px) and (max-width: 767px){ #content-wrapper, .container_12, #footer{ width: 460px; } #header, #nav-container{ width: 440px; } img{ max-width: 100% !important; } .ruler{ width: 440px; } .social{ width: auto; position: relative; top: 2px; float: right; margin-right: 0; } #logo a{ width: 150px; } #logo a span{ display: none; } #search{ margin: 0 auto 25px; float: none; } /* navigation */ #nav-container #nav{ display: none; } #nav-container select{ display: block; width: 330px; margin: 12px auto; height: 28px; background: #fff; border: none; color: #828282; font: italic 12px Arial, sans-serif; padding: 5px 7px; border: 1px solid #ececec; } /*GRID SYSTEM */ .grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12{ width: 440px !important; } .container_12 [class^="grid_"] [class^="grid_"]{ margin-left: 0; } /* NOTE */ .grid_12.note .divider{ display: none; } .grid_12.note .text{ padding: 35px 25px 35px 0; width: 335px !important; text-align: left; min-width: 0; } /*PORTFOLIO CAROUSEL */ .carousel-li > li{ width: 210px !important; } .caroufredsel_wrapper{ height: 195px !important; } /* NOTE */ .grid_12.note{ width: 440px !important; } .grid_12.note .btn-big{ display: none; } /*TEAM SOCIAL */ .team .social{ margin-bottom: 0; } /* PORTFOLIO WITH SHOWCASE */ .showcase-wrapper.single{ margin: 0 auto; } .showcase{ width: 440px; } .showcase-item img{ width: 100% !important; margin-bottom: 20px; } .showcase-item .description{ width: 100%; } .portfolio-video-container iframe{ max-width: 440px !important; height: 247px !important; } .portfolio-video-container.full-width-video iframe{ max-width: 440px !important; height: 247px !important; } /* PORTFOLIO */ #content-wrapper #portfolio-filter{ width: 100%; float: left; margin-left: 0; margin-bottom:0; } /* PORTFOLIO IMAGE STYLE */ figure.img-styled img{ width: 100%; height: auto; } .jcarousellite figure.img-styled img{ height: auto; } /* BLOG PAGE */ .grid_9.blog{ width: 440px !important; padding-right: 0; } .grid_9.blog .entry-content, .grid_9.blog .post-comments, .grid_9.blog .blog-post .comment-form{ width: 360px; } .children{ margin-left: 50px; } /* Homepage blog widget */ .grid_8.blog-widget img{ width: auto; } .grid_8.blog-widget .entry-container{ width: 100%; border: none; padding-right: 0; margin-top: 20px; } .comment-form .name, .comment-form .email{ width: 200px; } .comment-form .comment-text{ width: 338px; } .video-container{ width: 100%; } .video-container img{ width: 100%; height: auto; } .video-container .video-js{ width: 100% !important; } /* CONTACT PAGE */ .contact-form .name, .contact-form .email{ width: 250px; } .contact-form .contact-message{ width: 418px; } .map-short{ width: 440px; } #map_canvas{ height: 300px !important; } /* FOOTER COPYRGIHT */ .copyright{ width: 440px !important; } .copyright p{ width: 400px !important; } /* SOCIAL FEED */ .social-feed li:nth-child(10n){ margin-right: 0; } .social-feed li:nth-child(5n){ margin-right: 5px !important; } } /* SMARTPHONES */ @media only screen and (min-width: 320px) and (max-width: 479px){ #content-wrapper, .container_12, #footer{ width: 300px; } #header, #nav-container{ width: 280px; } img{ max-width: 100% !important; } .ruler{ width: 280px; } #logo{ width: 280px; margin-right: 0; } .social{ width: 280px; position: relative; top: 2px; } .social li{ float: left; } /* navigation */ #nav-container #nav{ display: none; } #nav-container select{ display: block; width: 250px; margin: 12px auto; height: 28px; background: #fff; border: none; color: #828282; font: italic 12px Arial, sans-serif; padding: 5px 7px; border: 1px solid #ececec; } #search{ display: none; } /*GRID SYSTEM */ .grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12{ width: 280px !important; } .container_12 [class^="grid_"] [class^="grid_"]{ margin-left: 0; } /*PORTFOLIO CAROUSEL */ .carousel-li > li{ width: 280px !important; } .caroufredsel_wrapper{ height: 246px !important; } /* NOTE */ .grid_12.note .first-part{ padding: 35px 0 35px 15px; } .grid_12.note .divider{ display: none; } .grid_12.note .text{ padding: 35px 15px 35px 0; width: 205px !important; text-align: left; min-width: 0; } .grid_12.note .btn-big{ display: none; } /*TEAM SOCIAL */ .team .social{ margin-bottom: 0; } .team img{ float: none; margin-bottom: 20px; } /* PORTFOLIO WITH SHOWCASE */ .showcase-wrapper.single{ margin: 0 auto; } .showcase{ width: 280px; } .showcase-item img{ width: 100% !important; margin-bottom: 20px; } .showcase-item .description{ width: 100%; } .portfolio-video-container iframe{ max-width: 280px !important; height: 157px !important; } .portfolio-video-container.full-width-video iframe{ max-width: 280px !important; height: 157px !important; } /* PORTFOLIO */ #portfolio-filter{ width: 100%; float: left; margin-left: 0; } /* PORTFOLIO IMAGE STYLE */ figure.img-styled img{ width: 100%; height: auto; } .jcarousellite figure.img-styled img{ height: auto; } /* BLOG PAGE */ .grid_9.blog{ width: 280px !important; padding-right: 0; } .grid_9.blog .entry-content, .grid_9.blog .post-comments, .grid_9.blog .blog-post .comment-form{ width: 280px; margin-left: 0; } .grid_9.blog .meta{ width: 100%; margin-right: 0; } figure.img-styled .img-hover{ top: 50%; } .children{ margin-left: 20px; } /* Homepage blog widget */ .grid_8.blog-widget .entry-container{ width: 100%; border: none; padding-right: 0; margin-top: 20px; } .comment-form .name, .comment-form .email{ width: 150px; } .comment-form .comment-text{ width: 258px; } .video-container{ width: 100%; } .video-container img{ width: 100%; height: auto; } .video-container .video-js{ width: 100% !important; } /* CONTACT PAGE */ .contact-form .name, .contact-form .email{ width: 170px; } .contact-form .contact-message{ width: 258px; } .map-short{ width: 280px; } #map_canvas{ height: 200px !important; } /* FOOTER COPYRGIHT */ .copyright{ width: 280px !important; } .copyright p{ width: 280px !important; margin-bottom: 10px !important; margin-right: 0 !important; float: left; } .container_12 .copyright .to-top-link{ width: 280px; float: right; } .container_12 .copyright .to-top-link img{ float: right; } /* social feed */ .social-feed li{ margin-right: 5px !important; } .social-feed li:nth-child(6n){ margin-right: 0 !important; } } .tomb{ float: left; height: 282px; margin-right: 23px; width: 217px; cursor:pointer; } .tomb a{ height: 282px; position: absolute; width: 217px; } .tomb.ppc{ background: url("../../img/pay-per-click.png") no-repeat; } .tomb.ppc:Hover{ background: url("../../img/pay-per-click-on.png") no-repeat; } .tomb.seo{ background: url("../../img/seo.png") no-repeat; } .tomb.seo:Hover{ background: url("../../img/seo-on.png") no-repeat; } .tomb.social{ background: url("../../img/social-media.png") no-repeat; } .tomb.social:Hover{ background: url("../../img/social-media-on.png") no-repeat; } .tomb.web{ background: url("../../img/web-design.png") no-repeat; } .tomb.web:Hover{ background: url("../../img/web-design-on.png") no-repeat; } .wrap{ width:960px; margin: 0 auto; } .testim{ clear: both; float: left; width: 100%; background:#FFF; } .foottop{ background: url("../../img/quote.png") no-repeat scroll 0 23px transparent; color: #7D7D7D; } .foottop .testimonials-widget-testimonial{ padding-left: 97px; width: 72%; } .testimonials-widget-testimonial .credit{ float: right; clear:both; color: #7D7D7D; font-family:century gothic; font-size:18px; } .foottop .testimonials-widget-testimonial cite:before, .foottop .testimonials-widget-testimonial div.credit:before { content: " "; } .foottop span, .foottop blockquote { font-family:century gothic; font-size:18px; font-weight:normal; } .foottop h6{ display:none; } .foottop .testimonialswidget_testimonials{ margin-left: 86px; width: 701px; font-family:century gothic; font-size:18px; font-style:normal; } .join_title,.testimonialswidget_testimonial cite:before, .testimonialswidget_testimonial div.credit:before{ display:none; } .testimonialswidget_testimonial div.credit{ float: right; text-align: left; width: 250px; clear:both; } .testimonialswidget_testimonial .author, .testimonialswidget_testimonial .email, .testimonialswidget_testimonial .title, .testimonialswidget_testimonial .location, .testimonialswidget_testimonial .company, .testimonialswidget_testimonial .url{ clear: both; float: left; margin-bottom:6px; } .testimonialswidget_testimonial .open_quote:before{ content: ""; } .testimonialswidget_testimonial .close_quote:after{ content: ""; } #header .social{ display:none; } .pnum{ color: #154565; float: right; font-size: 22px; font-weight: bold; margin-top: 4px; padding-left:6px; } .pnum a{ font-size:14px; } .pnum .phonenumber{ float: right; margin-top: 3px; } .pnum #phonenumberp1{ font-size: 22px; font-weight: bold; } .blog .btn-medium.style-color{ background: none repeat scroll 0 0 #E07317; border: 1px solid #3B6E8E; } .blog .btn-medium.style-color:hover{ background: none repeat scroll 0 0 #E07317; } .blog a.btn-medium.style-color:hover{ text-decoration:none; } .rev_slider_wrapper .tp-caption{ background: none repeat scroll 0 0 transparent; } .rev_slider_wrapper .tp-caption.big_orange{ font-family: 'Trebuchet MS',sans-serif !important; font-size: 28px !important; letter-spacing: 0; } #wrapslide .tp-caption.small_text{ font-size: 16px !important; font-weight: normal; line-height: 21px !important; } #wrapslide{ background: url("http://smartmarketer.net/wp-content/themes/moderna/img/patt.png") repeat scroll 0 0 transparent; height: 340px; list-style: none outside none; margin: 0 auto 30px; overflow: hidden; padding: 30px 0 0; position: relative; } .page-id-468 .grid_12{ width:720px; } .trigger span{ color: #154565; font-size: 23px; font-weight: bold; cursor:pointer; } .toggle_container{ display:none; } .toggle_container .block{ float:left; margin-left:40px; } .toggle_container .block h3{ } .clear{ clear:both; } .nop{ } #phonenumber1{ } #phonenumberp, #phonenumberp1{ float:left; font: 19px/28px 'Trebuchet MS',sans-serif; } .pleft{ font: 19px/28px 'Trebuchet MS',sans-serif; float:left; } .cphone{ float:left; font-weight:bold; } .parent-pageid-373 .wpcf7, .pagecf .wpcf7{ float:left; width:698px; color:#154565; clear:both; } .parent-pageid-373 .wpcf7 h3, .pagecf .wpcf7 h3{ background-color: #154565; color: #E07317; font-family: tahoma; font-size: 24px; font-style: normal; font-weight: bold; letter-spacing: 1px; padding: 12px 0 12px 15px; text-transform: none; width: 97.8%; } .parent-pageid-373 .wpcf7 ul, .pagecf .wpcf7 ul{ margin: 0; padding:0; float:left; width:100%; } .parent-pageid-373 .wpcf7 li, .pagecf .wpcf7 li{ background: none repeat scroll 0 0 transparent; float: left; margin-left: 31px; padding-left: 0; width: 45%; } .parent-pageid-373 .wpcf7 input[type="text"],.parent-pageid-373 .wpcf7 select,.pagecf .wpcf7 input[type="text"],.pagecf .wpcf7 select{ border: 1px solid #B3B3B3; color: #AAAAAA; font-size: 19px; font-weight: bold; height: 37px; margin-left: -17px; margin-top: 6px; padding-bottom: 5px; padding-left: 5px; padding-top: 4px; width: 101%; } .parent-pageid-373 .wpcf7 select, .pagecf .wpcf7 select{ background: url("http://smartmarketer.net/wp-content/themes/moderna/img/down.png") no-repeat scroll 268px center #FFFFFF; height: 48px; margin-left: 0; margin-top: 0; padding-top: 11px; width: 341px; -webkit-appearance: none; } .parent-pageid-373 .wpcf7 option{ } .parent-pageid-373 .wpcf7 .swrap, .pagecf .wpcf7 .swrap{ border-right: 1px solid #B3B3B3; margin-left: -17px; margin-top: 6px; overflow: hidden; width: 323px; } .parent-pageid-373 .wpcf7 input[type="submit"], .pagecf .wpcf7 input[type="submit"] { background-color: #154565; border: 2px solid #E07317; border-radius: 3px 3px 3px 3px; color: white; font-size: 26px; font-weight: bold; margin-left: 14px; margin-top: 10px; padding-bottom: 6px; padding-top: 7px; text-align: center; width: 96%; cursor:pointer; } .parent-pageid-373 .wpcf7 p, .pagecf .wpcf7 p{ margin-bottom:0; }