/* Theme Name: Sculptural Designs Theme Theme URI: http://www.sculpturaldesigns.com/ Author: Ron The Website Guy Author URI: http://www.ronswebsite.com Description: Minimalist-designed theme for architectural drafting and design company. Version: 1.3-wpcom License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: _s Domain Path: /languages/ Tags: _s is based on Underscores http://underscores.me/, (C) 2012-2013 Automattic, Inc. Resetting and rebuilding styles have been helped along thanks to the fine work of Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/ and Blueprint http://www.blueprintcss.org/ */ @font-face { font-family: 'tex'; src: url('fonts/texgyreheros-regular-webfont.eot'); src: url('fonts/texgyreheros-regular-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/texgyreheros-regular-webfont.woff') format('woff'), url('fonts/texgyreheros-regular-webfont.ttf') format('truetype'), url('fonts/texgyreheros-regular-webfont.svg#texgyreherosregular') format('svg'); font-weight: normal; font-style: normal; } body { background: url(images/noise.png) #F6F6F0; -webkit-font-smoothing:antialiased } /*#content { background: lime; }*/ ul,ol { margin:0; padding:0} #main { margin: 0 auto; /*background: salmon */} #container { width: 960px; margin: 0 auto; } @media only screen and (min-width: 1150px) { #container { width: 1150px; } } #primary { color: #666 } .clear { clear:both } a { color: #3cb24a; transition-duration: .3s; -webkit-transition-duration:.3s; font-weight:bold; text-decoration:none} a:visited { color:#3cb24a } a:hover { color: green; } h1 { font-size:2.5em; line-height: 1em; color: #333; letter-spacing: 4px} h2 { font-size:1.8em; color: #555 ; margin-bottom: .5em; letter-spacing: 2px} h3 { font-size: 1.1em; font-weight:bold; } h1,h2 { font-family:lato} .entry-header { display:none} .heading { font-size: 2em; text-align:center; display:block; margin-bottom:1em } hr { /*border: 0; height:21px; background: url(images/hr.png) center center no-repeat; opacity:.25 ; margin:2em 0 */ border:0; height:2px; background: #ccc; margin:3em 0} .cta-wrap a, input[type="submit"] { } #primary ul { margin-left:15px } #primary ul li { background: url(images/bullet.png) left 9px no-repeat; padding-left:18px; list-style:none } /* TYPOGRAPHY */ body { font-family: helvetica, tex, arial, sans-serif; color: #666} .nav-menu li:hover { } #intro-block p { font-size:.9em } #main p, #main ul, #main ol { font-size: 1em; line-height:1.75em} p strong { color: #111 } .cta-wrap { font-size: 18px } .title, .widget-title { font-family: lato } .overlayer .label { } .entry-content img { } h1 { margin-bottom: .5em; padding-bottom: .5em; border-bottom: 1px dotted #bbb} .big { text-align:center; font-size: 3em; font-weight:bold; color: #555; } .medium { text-align:center; font-size: 1.25em; color: #88a3e2; } /* ///////////////////////// LOGO ////////////////////////////////////////////////////// */ header { } .site-branding { width: 960px; margin: 2.5em auto 1em; padding: 0em 0; text-align:center} #site-logo { opacity: .85; filter:alpha(opacity=85) ; } /* ///////////////////////// MENU //////////////////////////////////////////////////// */ .menu-main-menu-container { margin-bottom: 2.5em } #menu-main-menu { text-align:center; width:960px; margin: 0 auto; padding: 15px 0;border-top: 1px dotted #ccc; border-bottom:1px dotted #ccc; text-transform:uppercase} #menu-main-menu li { font-weight:bold; display:inline-block; float:none; font-weight:bold; transition-duration:.3s; -webkit-transition-duration: .3s; margin: 0 25px } #menu-main-menu li a { color: #666; padding: 5px 10px; border-radius: 4px; -webkit-border-radius:4px; } #menu-main-menu li:hover a { background: #ddd; box-shadow: 1px 1px 1px rgba(0,0,0,.1) } #menu-main-menu .current-menu-item a { background:#111; color:white } #menu-main-menu .current-menu-item a:hover { background: #666 } /* ///////////////////////// FRONT PAGE ///////////////////////////////////////////*/ .home p { margin-bottom:0} #intro-block { width: 100%; height:600px; position:relative; clear:both } .overlay { background:url(images/fade.png) right top repeat-y; height:100%; } #intro-block-content { width:325px; padding:25px; position:absolute; left:55%; top: 7%; color: #333; padding-top:35px ; font-size: 1em; background:rgba(255,255,255,.75); background:white\9; box-shadow: 0 0 10px rgba(0,0,0,.25); border-radius: 4px } #intro-block h1 { font-size: 1.75em ; line-height:1.1em; margin-bottom:0em; font-weight:normal; border:0} #latest-works { padding: 3em 0; margin:3em 0; /*background: #fff; border-radius:6px; box-shadow: 0 1px 4px rgba(0,0,0,.2); */} #latest-works .slides { padding-left:10px } /*add room to left of slide items */ .flexslider .slides img { border:4px solid white; box-shadow: 0 0 4px rgba(0,0,0,.35); margin: 10px 0; width: 180px; height:180px; transition-duration: .3s; opacity:.85} .flexslider .slides img:hover { opacity:1} .flex-direction-nav a { background:skyblue; color:white; border-radius: 1em } .flex-viewport { margin: 0 auto; width: 870px } /* reduces slider width */ #latest-works li { } .project-title { display:none; position:absolute; background:skyblue; color: white; transition-duration:.3s } #latest-works li:hover .project-title { display:block; bottom:0} .home .quarter { width: 25%; float:left; text-align:center} .home .quarter img { border: 10px solid white; box-shadow: 0px 2px 4px rgba(0,0,0,.5); transition-duration: .3s; } .home .quarter img:hover { box-shadow: 0 2px 15px rgba(0,0,0,.6); } .home #main table { table-layout: fixed } .home #main table tr td { padding: 0 7.5px; vertical-align:top } .home #main table tr td:first-child { padding-right: 15px; padding-left:0} .home #main table tr td:last-child { padding-left:15px; padding-right:0 } .home #main table tr td img {width:100%; margin-bottom:0.5em } #latest-works2 { clear:both; padding:0; margin:0; width:100%; } #latest-works2 a { display:block;position:relative } #latest-works2 img { width:100%; height:202px; display:block } #latest-works2 tr td { padding: 0 7.5px ; vertical-align:top} #latest-works2 tr td span { opacity:0; filter:alpha(opacity=0); position:absolute; top:0; bottom:0; left:0; right:0; background:url(images/link.png) center center no-repeat; background-color: rgba(255,255,255,.75); transition-duration: .5s; -webkit-transition-duration:.5s } #latest-works2 td:hover span { opacity: 1 ; filter:alpha(opacity=100)} #latest-works2 tr td:first-child { padding-right:15px; padding-left:0 } #latest-works2 tr td:last-child { padding-left:15px; padding-right:0 } /* //////////////////////// PORTFOLIO PAGE /////////////////////////////////*/ .portfolio-box { width:33.3%;height:auto; float:left; overflow:hidden; transition-duration: .3s; position:relative; text-align:center} .portfolio-box img { display:block; width:100%; height:auto } /* so link wraps around img */ .overlayer { display:block; width:100%; height:100%; position:absolute; background: url(images/link.png) center 80% no-repeat rgba(255,255,255,.7); background-color:transparent\9;transition-duration:.35s; opacity:0; filter:alpha(opacity=0); bottom:0px; left:0; top:0; right:0} .overlayer .label { font-size: 1.5em; line-height: 1.25em; bottom:50%; position:absolute; width:80%; padding: 0 10%; font-weight:bold; display:block; color: #333; color:white\9; background: #111\9; bottom:0\9} .overlayer .cta-wrap { position:absolute; top:50%; width:100%; font-size:.9em } .portfolio-box a {display:block} .portfolio-box:hover .overlayer{ opacity:1; filter:alpha(opacity=100)} /* ////////////////////////// DEFAULT PAGE ///////////////////////////////////// */ .page-template-default #content { width: 960px; margin: 0 auto; /*background: #fcfcfc; box-shadow: 0 1px 5px rgba(0,0,0,.35); border-radius: 6px; */} .page-template-default .entry-content { margin-top:0} #left-sidebar { width: 18%; float:left; font-size: .8em } #primary { width: 48%; margin: 0 4%; padding: 2em 4%; float:left; background: #fcfcfc; box-shadow: 0 0 10px rgba(0,0,0,.15)} #secondary { width: 18%; float:right; font-size: .8em} @media only screen and (min-width:1150px) { .page-template-default #content { width:1150px} } /* ///////////////////// SINGLE /////////////////////////////////////////////// */ .breadcrumbs { font-size: .75em; padding-bottom:3em; color: #999; font-style:italic; margin: 0 auto;text-align:left } .breadcrumbs a { font-weight:normal } .single-featured { padding: 0px 0; margin-top: 1.5em; text-align:center } .single-featured img { box-shadow: 0 0 15px rgba(0,0,0,.5); border:10px solid #fff } .img-wrap { position:relative; width:960px; margin: 0 auto; } .img-wrap .single-title { position:absolute; bottom: 10%; width: 500px; left:50%; margin-left: -250px; line-height:1.25em; text-align: center; background: rgba(0,0,0,.75); color:white; padding:10px;} .single-title { font-size:2em; line-height:1em; } .single-location { font-style:italic; color: #888; font-family: "libre baskerville", georgia; padding :.5em 0; border-bottom: 2px solid; } .single-content { padding-top:1em; } .nav-previous a, .nav-next a { text-decoration:none; padding: 5px 7px; line-height:1.65em; transition-duration:.3s; font-size: .9em } .side-portfolio li { list-style:none; position:relative; overflow:hidden } .side-portfolio li a { display:block ; } .side-portfolio li img { display:block; width:173px\9; height:123px\9 } .side-portfolio li span { position:absolute; bottom:-4em; transition-duration:.5s; background:rgba(255,255,255,.85) ; background:white\9;color: #222;width:100%; text-align:center; padding:3px} .side-portfolio li:hover span { bottom:0;} #cntctfrm_thanks { background: rgba(255,255,0, .75);} /* //////////////////////// FOOTER///////////////////////////////// */ footer { padding: 2em 0 2em; margin-top: 4em; background: #111; color: #999;} #main-footer {text-align:center; width:960px; margin: 0 auto } @media only screen and (min-width:1150px) { #main-footer { width:1150px } } #menu-footer-menu li { float:left; background: url(images/bullet.png) left 7px no-repeat; padding-left:25px; margin-right:15px; list-style:none; letter-spacing:1px } #menu-footer-menu li:first-child { background:none; padding-left:0 } #menu-footer-menu li a {color: #aaa; transition-duration:.5s} #menu-footer-menu li a:hover {color:#fff} /* ///////////////////// LEFT SIDEBAR ///////////////////////*/ #left-sidebar { } /* //////////////////////// SIDEBAR ////////////////////////////// */ .widget-area { margin-bottom: 4em; } .main-aside { right:0; } #secondary { /*background: url(images/noise.png) #d3d9ea; box-shadow: inset 5px 1px 2px -4px rgba(0,0,0,.15); border-radius:0px 6px 6px 0; padding-bottom: 500em!important; margin-bottom: -500em!important; *//*css hack to make secondary bar same size as primary */} .profile-pic { border:1px solid #ccc; background:#fff;padding:5px; box-sizing:border-box; width:100%; height:auto } #secondary strong { color:#000 } /* GENRAL SIDEBR */ #secondary .widget-title, #left-sidebar .title { display:block; font-weight:bold; font-size: 1.5em; color: #333;margin-bottom: 1em ; letter-spacing: 1px} #secondary .widget, #left-sidebar .widget { border-bottom: 1px dotted #888; } #secondary .widget:last-child, #left-sidebar .widget:last-child { border-bottom:none } #secondary #cntctfrm_contact_form, #left-sidebar #cntctfrm_contact_form { border:none!important } #secondary #cntctfrm_contact_form div, #left-sidebar #cntctfrm_contact_form div { width:100% } #secondary #cntctfrm_contact_form div:nth-child(odd), #left-sidebar #cntctfrm_contact_form div:nth-child(odd) {float:none} /*portfolio items */ .cpt_item_content { margin:0 } .cpt_item { text-align:center; width:144px; margin: 0 auto} .cpt_item_content img { display:block; width:100%; height:auto } /* //////////////////// CONTACT FORM ////////////////////////////////// */ .page-id-11 #text-6 { display:none} #cntctfrm_contact_form { border-top:1px dotted #aaa; padding-top:1em; } #cntctfrm_contact_form div:nth-child(odd) { float:left; width:35% } #cntctfrm_contact_form div:nth-child(even) { margin-bottom:1em } #cntctfrm_contact_form div:last-child { width:100%; text-align:center!important } #cntctfrm_contact_form input,#cntctfrm_contact_form textarea { border-radius:4px; border:2px solid #ccc; padding: 5px 0; text-indent: 10px; box-shadow:none!important; } #cntctfrm_contact_form input[type=submit] { background: #111; color:white; text-transform:uppercase; font-family:lato; padding: 10px 40px; border:1px solid rgba(0,0,0,.3); transition-duration:.4s; -webkit-transition-duration:.4s;display:inline-block } #cntctfrm_contact_form input[type=submit]:hover { background: deepskyblue } #cntctfrm_contact_form input:focus, #cntctfrm_contact_form textarea:focus { border-color: #3cb24a } /* ////////////////////// CTA /////////////////////////////////////////////////// */ .cta-wrap {text-align:center} .cta-wrap a, #cntctfrm_contact_form input[type=submit] { font-weight:bold; text-shadow: 0 1px 1px rgba(0,0,0,.25); /*box-shadow: inset 1px 1px rgba(255,255,255,.4);*/ border-radius:4px; font-size:1em; color: white; text-decoration: none; -webkit-backface-visibility: hidden; transition-duration: .3s; -webkit-transition-duration: .3s; padding: 10px 20px; border: 1px solid rgba(0,0,0,.2); display: inline-block; margin: 0px 0 0; outline: none; background: #111; /*background: #70bc4f; background: -moz-linear-gradient(top, #70bc4f 1%, #4d9b2b 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#70bc4f), color-stop(100%,#4d9b2b)); background: -webkit-linear-gradient(top, #70bc4f 1%,#4d9b2b 100%); background: -o-linear-gradient(top, #70bc4f 1%,#4d9b2b 100%); background: -ms-linear-gradient(top, #70bc4f 1%,#4d9b2b 100%); background: linear-gradient(to bottom, #70bc4f 1%,#4d9b2b 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#70bc4f', endColorstr='#4d9b2b',GradientType=0 ); /* IE6-9 */ } .cta-wrap a:hover, #cntctfrm_contact_form input[type=submit]:hover { background:#3cb24a; }