/* Font Imports */ @import url("https://fast.fonts.net/t/1.css?apiType=css&projectid=72254c74-d3d5-4fd6-9032-9e6d88063a88"); @font-face { font-family: "Core Serif N W01_35 Regular"; src: url("../Fonts/3929e35b-456d-4985-a62c-bd6374a7d97e.eot?#iefix"); src: url("../Fonts/3929e35b-456d-4985-a62c-bd6374a7d97e.eot?#iefix") format("eot"), url("../Fonts/fbbeee41-c576-4f14-89fd-f32e86984181.woff2") format("woff2"), url("../Fonts/4ec12606-e113-4d84-820d-6b7c2ea4ec6d.woff") format("woff"), url("../Fonts/9f124d12-fb00-48a8-8f18-0271c66fb3ee.ttf") format("truetype"); } @font-face { font-family: "Hank BT W01 Roman"; src: url("../Fonts/6d1f3254-bfcc-423f-9fa9-f98d60dc025f.eot?#iefix"); src: url("../Fonts/6d1f3254-bfcc-423f-9fa9-f98d60dc025f.eot?#iefix") format("eot"), url("../Fonts/655f1010-5401-4b83-8ab5-cdca4c9b0dc4.woff2") format("woff2"), url("../Fonts/31e0a33b-5414-4fc8-a006-65ff963a6ac0.woff") format("woff"), url("../Fonts/b2f2bcbb-7e12-4e3b-8de7-5f37daec6d15.ttf") format("truetype"); } @font-face { font-family: "Limon Script W05 Regular"; src: url("../Fonts/2534a803-34dd-44db-ac16-897718cf1e76.eot?#iefix"); src: url("../Fonts/2534a803-34dd-44db-ac16-897718cf1e76.eot?#iefix") format("eot"), url("../Fonts/14bef9be-0d62-4ea7-b612-60d61fb4353c.woff2") format("woff2"), url("../Fonts/306dbcb0-2fe1-4cb6-9153-2a43d7b5f4aa.woff") format("woff"), url("../Fonts/df5c32d2-793b-4212-a1fa-20149f1544f0.ttf") format("truetype"); } @font-face { font-family: "Liorah BT W01 Regular"; src: url("../Fonts/8bb532c7-d02e-4724-9615-d8a32068611f.eot?#iefix"); src: url("../Fonts/8bb532c7-d02e-4724-9615-d8a32068611f.eot?#iefix") format("eot"), url("../Fonts/95f1f230-021c-4ce2-b8a6-40155411ad9e.woff2") format("woff2"), url("../Fonts/f4318f3d-6509-4b68-bb3e-5a3733735d02.woff") format("woff"), url("../Fonts/439480d9-c9c4-4eb3-91a4-a6de67d0835e.ttf") format("truetype"); } @font-face { font-family: "High Tower Text Regular"; src: url("Fonts/HTowerT_0.TTF"); } *{box-sizing: border-box;} html{width:100%; height:100%; padding:0px; margin:0px; overflow-x: hidden;} body{width:100%; min-height: 100%; padding:0px; margin:0px; letter-spacing: 1px; font-size: 16px; color:#343434; font-family: 'Neutro W01', sans-serif; font-weight: 400;} img{max-width: 100%; height:auto;} figure img{max-width: 100%;} figure.left{margin:0px 24px 16px 0px;} figure.right{margin:0px 0px 16px 24px;} figure.aside{float:left; width:300px; max-width: 50%; margin:0px 24px 16px 0px;} figure.aside.right{float:right; width:300px; max-width: 50%; margin:0px 0px 16px 24px;} figure.aside.center{float:none; margin:0px auto 16px auto; width:500px;} figure.aside.fifty{width:50%;} figure.aside.golden-large{width:62%;} figure.aside.golden-small{width:38%;} .smaller{font-size: 0.8em;} .larger{font-size: 1.5em;} p.indent{text-indent: 32px;} .em-underline em{text-decoration: underline; font-style: normal;} .no-wrap{white-space: nowrap;} .warning{color:#a20202; font-weight: 700; line-height: 1.4em;} .content-wrap{width:100%; max-width: 1280px; margin:0px auto; position: relative; display: block; } .content-wrap:after{content:''; display: block; clear: both;} .content-wrap.padding-bottom{padding-bottom: 64px;} .content-wrap.padding-top{padding-top:64px;} .container-table{display: table; table-layout: fixed; width:100%; min-height: 100%;} .container-table > .LSidebar{display: table-cell; vertical-align: top; background-color:#ffd923; box-shadow: inset 0px -5px 5px rgba(0, 0, 0, 0.6); padding:64px 24px 48px 32px; animation: slideRight 0.5s ease-in-out 0s 1; width:265px;} .container-table > .LSidebar:after{content:''; display: block; clear: both;} .container-table > .LSidebar nav{ font-size: 20pt; font-family: 'Hank BT W01 Roman', 'Times New Roman', Times, serif;} .container-table > .LSidebar nav ul{list-style: none; margin:0px; padding:0px;} .container-table > .LSidebar nav li{padding:10px 0px;} .container-table > .LSidebar nav a{text-decoration: none; color:#ec008c; font-size: 24px;} .container-table > .LSidebar nav a.larger{font-size: 28px; font-weight: 700; font-family: "Core Serif N W01_35 Regular";} .LSidebar nav h2{color:#ec008c;} .LSidebar nav h2:before{content: ''; display: block; position:relative; width: auto; background-color: #ffd923; border-bottom: 2px solid #ec008c; height: 8px; box-shadow: rgba(0,0,0,0.5) 0px -5px 5px; margin: 24px -24px 12px -32px;} .Content nav a{text-decoration: none; color:#ec008c; font-size: 24px; font-family: 'Hank BT W01 Roman', 'Times New Roman', Times, serif;} .container-table > .Content{display: table-cell; width:1400px; vertical-align: top; padding:64px 48px 24px 72px;} .container-table > .RSidebar{display: table-cell; min-height: 100%; vertical-align: top;} /*IE UGLYNESS*/ .container-table > .Content{display: block;} .container-table > .RSidebar{display: none;} @supports (display: flex){ .container-table > .Content{display: table-cell; width:1400px; vertical-align: top; padding:64px 48px 24px 72px;} .container-table > .RSidebar{display: table-cell; min-height: 100%; vertical-align: top;} } hr.strong{border-style: solid; border-width: 1px;} p{line-height: 1.4em; margin-bottom: 2em;} .astrisk{font-size: 0.8em; font-style: italic; line-height: 1.2em;} .larger{font-size: 1.5em;} .smaller{font-size: 0.8em;} .center{text-align: center; margin-left:auto; margin-right: auto; display: block;} .table-content{display: table; width:100%;} .table-content .spacer{display: table-cell;} .table-row{display: table-row;} .table-cell{display: table-cell; vertical-align: top;} .twelve{width:100%;} .eleven{width:91.66%} .ten{width:83.32%} .nine{width:75%;} .eight{width:66.66%;} .six{width:50%; } .four{width:33.33%;} .three{width:25%;} .two{width:16.66%;} .one{width:8.333%;} .right{float:right;} .left{float:left;} .center{float:none; margin-left:auto; margin-right:auto;} .clear{clear:both;} .learn-more{} .red-text{color:#803022;} .pad-left{padding-left:16px;} .pad-right{padding-right: 16px;} .pad-both{padding-left: 16px; padding-right: 16px;} /*Form Styling */ label{ display: inline-block; padding:4px 8px; } input[type="text"], input[type="number"], input[type="email"], input[type="password"], input[type="tel"]{display: block; width:100%; font-size:18px; padding:8px 12px; border:1px solid #999; border-radius: 3px; margin:4px 0px 12px 0px; } input[type="text"].six, input[type="number"].six, input[type="email"].six, input[type="tel"].six{width:49%; margin-right: 2%; display: inline-block; vertical-align: top;} input[type="text"].six:last-child, input[type="number"].six:last-child, input[type="email"].six:last-child, input[type="tel"].six:last-child{margin-right: 0px;} textarea{display: block; width:100%; height:250px; font-size:18px; padding:8px 12px; border:1px solid #888; border-radius: 3px; margin:4px 0px 12px 0px;} .radio label{display: inline-block; margin-right:12px;} input[type="radio"]{margin-right:12px;} input[type="date"], input[type="time"]{display: inline-block; font-size: 18px; padding:8px 12px; border:1px solid #666; color:#999; border-radius: 3px; margin:4px 0px 12px 0px;} fieldset{border:1px solid #666; margin:0px 0px 32px;} select{font-size: 18px; padding:8px 12px; border-radius: 4px; color:#999; margin:4px 0px 12px 0px; display: inline-block;} input[type="submit"]{font-size: 18px; display: inline-block; padding:8px 16px; border:1px solid #999; background:none; background-color:#eee; box-shadow: rgba(0,0,0,0.4) 1px 1px 0px 0px; margin-top:18px; transition:all 0.3s ease-out; color:#666; cursor: pointer;} input[type="submit"]:hover{ box-shadow: rgba(0,0,0,0.4) 1px 1px 1px 1px; } textarea.invalid, input[type="text"].invalid, input[type="number"].invalid, input[type="tel"].invalid, input[type="password"].invalid, input[type="date"].invalid, input[type="email"].invalid, input[type="time"].invalid{border-color:#a12d3a; background-color:#f7b1b8;} meter{/*-webkit-appearance: none; -moz-appearance: none; appearance: none;*/ margin:0 auto 1em; width:100%; height: 0.5em; background:none; background-color:rgba(0,0,0,0.1); } meter::-webkit-meter-bar{background:none; background-color:rgba(0,0,0,0.1);} meter[value="1"]::-webkit-meter-optimum-value { background: red; } meter[value="2"]::-webkit-meter-optimum-value { background: yellow; } meter[value="3"]::-webkit-meter-optimum-value { background: orange; } meter[value="4"]::-webkit-meter-optimum-value { background: green; } meter[value="1"]::-moz-meter-bar { background: red; } meter[value="2"]::-moz-meter-bar { background: yellow; } meter[value="3"]::-moz-meter-bar { background: orange; } meter[value="4"]::-moz-meter-bar { background: green; } #contentLoad{min-height: 50vh;} .call-to-action{display: block; max-width: 600px; margin:78px auto; border:4px solid #ffd923; padding:0px;} .call-to-action .sub{display: block; border:1px solid #ec008c; padding:24px 32px; text-align: center; background-color:#ffd923;} .call-to-action h3{ text-transform: uppercase; font-weight: 700; color: #333;} .call-to-action .button{} .call-to-action .message{color:#ec008c;} .call-to-action label{color:#fff;} .call-to-action #password-strength-text{color:#fff;} body.waiting #session_message{position: fixed; display: block; top:0px; left:0px; width:100%; height: 100%; background-color:rgba(0,0,0,0); transition:all 0.5s ease-in-out;} body.waiting.on #session_message{background-color:rgba(0,0,0,0.2);} body.waiting #session_message #waiting_message{width:90%; max-width: 500px; height: 300px; position: absolute; top:0px; left:0px; right:0px; bottom:0px; margin:auto; padding:36px 24px; text-align: center; opacity: 0; transition:all 0.5s ease-in-out; transform: translateY(800px); transition-delay: 0.5s; background-image:url(../images/icons/gears.svg); background-size: contain; background-repeat: no-repeat; background-position: center;} body.waiting.on #session_message #waiting_message{transform: translateY(0); opacity: 1; } input[type="submit"].button, .button{ color:#333; text-decoration: none; padding:2px; box-shadow: rgba(0,0,0,0.4) 1px 1px 1px 1px; border:2px solid #fff; text-transform: uppercase; overflow: hidden; position: relative; display: inline-block; vertical-align: middle; transition:all 0.3s ease-in-out; background-color:#ffd923;} input[type="submit"].button{padding:12px 16px; font-size: 14px;} a.button > span{color:#fff;} /*.button:before{height: 200%; width:8px; border-left:22px solid rgba(255,255,255,0.1); border-right:5px solid rgba(255,255,255,0.2); transform: rotate(40deg) translateX(-500px); transform-origin: center; transition:all 0.3s ease-in-out; position: absolute; left:15px; top:-50%; display: block; content:'';}*/ .button > span{position: relative; cursor: pointer; width:auto; display: inline-block; padding:8px 14px; font-size: 14px;} .button:hover{box-shadow: rgba(0,0,0,0.4) 1px 1px 2px 2px;} /*.button:hover:before{transform: rotate(40deg) translateX(0px);}*/ .submit-wrap input[type="submit"].button{position: static; margin:0px; padding:8px 32px;} .submit-wrap{display: inline-block; position: relative; overflow: hidden; box-shadow: rgba(0,0,0,0.4) 1px 1px 1px 1px;} /*.submit-wrap:before{height: 200%; width:8px; border-left:22px solid rgba(255,255,255,0.1); border-right:5px solid rgba(255,255,255,0.2); transform: rotate(40deg) translateX(-500px); transform-origin: center; transition:all 0.3s ease-in-out; position: absolute; left:15px; top:-50%; display: block; content:''; cursor: pointer;}*/ .submit-wrap:hover{box-shadow: rgba(0,0,0,0.4) 1px 1px 2px 2px;} /*.submit-wrap:hover:before{transform: rotate(40deg) translateX(0px);}*/ hr.style2{height:7px; border-top:1px solid #868686; border-right: none; border-bottom: 1px solid #868686; border-left: none; } #mainNav{animation: slideRight 0.5s ease-in-out 0s 1; background-color:#ffd923; box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.6); } #mainNav .content-wrap{z-index: 999;} #mainNav nav{font-family: 'Hank BT W01 Roman', 'Times New Roman', Times, serif; font-size: 18pt; text-align: center;} #mainNav nav a{white-space: nowrap; width:140px; display: inline-block; color:#ec008c; text-decoration: none; padding:8px 10px; text-align: center;} #mainNav nav a:hover{color:#fff;} #mainContact{color:#2a37cb; text-align: right; font-size: 16px; font-family: 'Hank BT W01 Roman', 'Times New Roman', Times, serif; position: absolute; right:0px; bottom:-24px;} #mainContact ul{list-style: none; margin: 0px !important; padding: 0px;} #mainContact li{display: inline-block; margin-right: 10px; margin-bottom: 0px;} #mainContact li::before{content:"\2022"; color:#ec008c; font-weight: bold; margin-right: 10px; display: inline-block; vertical-align: middle;} #mainContact li:nth-child(1):before{display: none;} #mainContact a{color:#2a37cb; text-decoration: none;} #mainNav #social{position: absolute; top:0px; right:0px;} #mainNav #social a{display: inline-block; margin-left: 16px; width:34px; height: 44px; background-size: contain; background-position: center; background-repeat: no-repeat;} #mainNav #social a.facebook{background-image: url(../images/Facebook-Logo-for-Website.png);} #mainNav #social a.instagram{background-image: url(../images/Instagram-Logo-for-Website.png);} .home-wrap{ width:100%; height: 100%; background-image: linear-gradient(175deg, #010406 10%, #24577a, #ffffff 75%); background-repeat: no-repeat; background-position: right top; overflow-x: hidden; } .home header{padding-top:40px; position: relative; z-index: 2;} .home header h1{ font-family: 'Hank BT W01 Roman', 'Times New Roman', Times, serif; color:#ffd923; font-size: 59pt; font-weight: 100; padding-left: 40px; align-self: center; animation: slideLeft 0.5s ease-in-out 0s 1; margin-bottom: 0px; margin-top: 40px;} .home header .subtitleContainer{ display: table; width:100%; animation: slideLeft 0.5s ease-in-out 0s 1;} .home header .leftHR, .home header .rightHR{display: table-cell; vertical-align: middle;} .home header .leftHR:before{ content:''; display: block; width:100%; height: 8px; background-color: #00aeef; position: relative; top:1px; } .home header .rightHR:before{ content:''; display: block; width:100%; height: 8px; background-color: #00aeef; position: relative; top:1px; } .home header .subtitleContent{ display: table-cell; width:1280px; vertical-align: middle; overflow: hidden; font-family: 'Hank BT W01 Roman', 'Times New Roman', Times, serif; color:#ffd923; white-space: nowrap; font-size: 20pt; position: relative; bottom: 3px; line-height: 20pt; } .home header .subtitleContent:before{content:''; display: inline-block; width:170px; height: 8px; background-color:#00aeef; border-top-right-radius: 5px; border-bottom-right-radius: 5px; vertical-align: middle; margin-right: 10px; transition: all 0.5s ease-in-out;} .home header .subtitleContent:after{content:''; display: inline-block; width:auto; height: 8px; background-color:#00aeef; border-top-left-radius: 5px; border-bottom-left-radius: 5px; vertical-align: middle; position: absolute; left:569px; right:0px; top:13px; transition: all 0.5s ease-in-out; } /*.home.on header .subtitleContent:before{width:170px} .home.on header .subtitleContent:after{left:559px;}*/ .home header ul.contactInfo{list-style: none; color:#fff; font-family: 'Hank BT W01 Roman', 'Times New Roman', Times, serif; font-size: 14pt; margin:0px 0px 5px 0px; padding:0px 0px 0px 40px; animation: slideLeft 0.5s ease-in-out 0s 1} .home header .contactInfo li{margin-right: 10px; display: inline-block;} .home header .contactInfo li:before{content:"\2022"; color:#ffd923; font-weight: bold; margin-right: 10px; display: inline-block; vertical-align: middle;} .home header .contactInfo li:first-child:before{ display: none;} .home header .contactInfo a{color:#fff; text-decoration: none;} .home #Content{} .home #Content h2{font-family: "Hank BT W01 Roman"; font-size: 24pt; padding-top: 80px; animation: slideUp 0.5s ease-in-out 0s 1; padding-bottom: 100px; color:#111; float:right; font-weight: 100; position: relative; z-index: 999;} .home #copyright{padding:80px 40px 40px; text-align: right; font-family: "Hank BT W01 Roman"; font-size: 12pt; clear: both;} /*.home-wrap:before{width:100%; height: 560px; position: absolute; bottom:0px; left:0px; background-image: url(../images/home-background-dec18.png); background-size: contain; background-position: center bottom; background-repeat: no-repeat; content:''; display: block;}*/ .home-wrap:after{width:242px; height: 700px; max-height: 100vh; position: absolute; top:0px; right:0px; background-size: contain; background-position: right -30px top; background-image: url(../images/pencils_main2.png); background-repeat: no-repeat; content: ''; display: block; z-index: 4;} .home-wrap:before{width:352px; height: 240px; max-height: 100vh; position: absolute; top:0px; right:184px; background-size: contain; background-position: right top; background-image: url(../images/pencils_main1.png); background-repeat: no-repeat; content: ''; display: block; z-index: 4;} /*.home-wrap:after{width:550px; height: 700px; position: absolute; top:0px; right:0px; max-height: 100vh; max-width: 30%; background-image: url(../images/pencils_main.png); background-size: contain; background-repeat: no-repeat; background-position: top right; content: ''; display: block; z-index: 3; background-position: left 30px top;}*/ .home #Content{background-image: url(../images/home-background-dec182.png); background-size: 100% auto; background-position: center bottom; padding-top:51%; background-repeat: no-repeat; position: relative; z-index: 1; margin-top:-215px;} .interior{min-height: 100vh; position: relative; padding-top:44px;} .interior #mainNav{position: fixed; width:100%; z-index: 2; top:0px;} .interior > .content-wrap{padding-top: 64px; padding-bottom: 64px;} .interior h1{font-size: 54pt; font-weight: 100; font-family:'Hank BT W01 Roman', 'Times New Roman', Times, serif; margin:0px 0px 32px 0px; padding: 0px; } .interior h2{font-size: 28px; font-weight: 700; font-family:'Hank BT W01 Roman', 'Times New Roman', Times, serif; margin:20px 0px; padding: 0px; } .interior footer{background-color:#ffd923; padding-top:4px;} .interior footer:before{content:''; display: block; width:100%; margin-top: 5px; border-top:1px solid #ec008c; margin-bottom: 12px;} footer .disclaimer, footer .copyright, footer .design-by{font-size: 14px; text-align: center; padding-bottom: 16px;} #pricingContent{background-image:linear-gradient(0deg, #ffffff 50%, #41ad49 98%); background-repeat: no-repeat; background-size: cover;} /*#pricingContent:before{width:700px; height: 200px; max-width: 50%; background-size: contain; background-position: top right; background-repeat: no-repeat; background-image: url(../images/pencils_grb.png); display: block; content:'';position: absolute; top:0px; right:0px;}*/ #pricingContent h1{ color:#fff;} #pricingContent .layoutContainer{display: flex; flex-wrap: wrap;} #pricingContent .layoutContainer .groupOne, #pricingContent .layoutContainer .groupTwo{width:50%;} #pricingContent .layoutContainer .groupOne{padding-right: 24px;} #pricingContent .layoutContainer .groupTwo{padding-left: 24px;} #freebiesContent{background-image: linear-gradient(0deg, #f2ed82 50%, #f7aa16 98%);} #freebiesContent:before{background-image: url(../images/Full-Pony-Graphic-yellow.png); background-repeat: no-repeat; background-size: contain; display: block; content:''; position: absolute; top:102px; left:30%; right:0px; padding-top:50%;} #freebiesContent h1{color:#fff; text-shadow: rgba(0,0,0,0.8) -4px 4px 3px;} #freebiesContent .Content{} #freebiesContent #glossary{position: relative; top:-111px; left:284px; font-family:'Hank BT W01 Roman', 'Times New Roman', Times, serif; font-size: 42px; color:#5800ad; text-decoration: none; background:none; background-color:none;} #freebiesContent #glossary:before{content:'\000B7'; display: inline-block; color:#fff; margin-right: 24px; font-size: 94px; vertical-align: middle; position: relative; top:-13px;} #freebiesContent h2{color:#fff; font-size: 42px; text-shadow: rgba(0,0,0,0.8) -3px 3px 3px; font-weight: 400; position: relative;} #freebiesContent h2:before{display: block; content:''; position: absolute; width:128px; height:128px; background-size: contain; background-repeat: no-repeat; left:-48px; top:-48px;} #freebiesContent h2 span{position: relative;} #freebiesContent .article_section li{color:#fff;} #freebiesContent .article_section a{color:#5800ad;} #freebiesContent .article_section:nth-child(1) h2:before{background-image: url(../images/Green%20Pony%20Head.png);} #freebiesContent .article_section:nth-child(2) h2:before{background-image: url(../images/Magenta%20Pony%20Head.png);} #freebiesContent .article_section:nth-child(3) h2:before{background-image: url(../images/Magenta%20Pony%20Head.png);} #freebiesContent .article_section:nth-child(4) h2:before{background-image: url(../images/Cyan%20Pony%20Head.png);} @media screen and (max-width:800px){ #freebiesContent #glossary{top:-81px} } @media screen and (max-width:670px){ #freebiesContent h1{font-size: 54pt;} #freebiesContent #glossary{top:0px; left: 0px;} } #infoContent{background-image: linear-gradient(0deg, #5992d2 50%, #093daf 98%);} #infoContent:before{background-image: url(../images/Full-Pony-Graphic-blue.png); background-repeat: no-repeat; background-size: contain; display: block; content:''; position: absolute; top:102px; left:30%; right:0px; padding-top:50%;} #freebiesContent h1{color:#fff; text-shadow: rgba(0,0,0,0.8) -4px 4px 3px;} #infoContent h1{color:#fff; text-shadow: rgba(0,0,0,0.8) -4px 4px 3px;} #infoContent .Content{position: relative; padding-bottom: 34px; min-height: 90vh;} #infoContent .Content:before{} #infoContent #mainContact, #infoContent #mainContact a{color:#fff;} #infoContent .article_section{width:30%; margin-right: 3%;} #infoContent .article_section:nth-child(2n){margin-right: 3%;} #infoContent .article_section:nth-child(3n){margin-right: 0;} #infoContent .article_section{color:#92d304} #infoContent .article_section a{color:#fff;} #infoContent .article_section:nth-child(1) a{font-size: 42px; color:#ffd924;} #infoContent .article_section h2{color:#ffd924; font-size: 42px; text-shadow: rgba(0,0,0,0.8) -3px 3px 3px; font-weight: 400; position: relative;} #infoContent h2:before{display: block; content:''; position: absolute; width:128px; height:128px; background-size: contain; background-repeat: no-repeat; left:-48px; top:-48px; background-image: url(../images/Green%20Pony%20Head.png);} #infoContent h2 span{position: relative;} #aboutContent { overflow: hidden; background-image:linear-gradient(180deg, #ffffff 50%, #2a37cb 98%); } #aboutContent .imgContainer { float: right; clear: right; margin: 0px 10px 10px 64px; text-align: center; vertical-align: middle; max-width: 600px; position: relative; } #aboutContent .imgContainer img { -webkit-box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.5); box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.5); margin-bottom: 10px; } #aboutContent .imgContainer.twoimg img{max-width: 50%; display: inline-block; vertical-align: middle;} #aboutContent .imgContainer.img1{padding-right: 160px; max-width: 424px;} #aboutContent .imgContainer.img1 .caption{position: absolute; right:0px; top:93px; width:140px; text-align: left;} #aboutContent .imgContainer.img1 img{} #aboutContent .imgContainer .moveLeft { position: relative; right: 15px; } #aboutContent .imgContainer .moveRight { position: relative; left: 15px; } #aboutContent .imgContainer .moveUp { position: relative; bottom: 10px; } #aboutContent .imgContainer .moveDown { position: relative; top: 10px; } #aboutContent .imgContainer .caption { max-width: 200px; font-style: italic; font-size: 14px; margin-left: auto; margin-right: auto; } #aboutContent .imgContainer.img2 .caption{max-width: none;} #aboutContent .imgContainer.gem-world{} #aboutContent .imgContainer.gem-world img:nth-of-type(1){width: 250px; float:left; box-shadow: none; position: relative; left:24px;} #aboutContent .imgContainer.gem-world img:nth-of-type(2){width: 350px; float:right; box-shadow: none;} #aboutContent .imgContainer.gem-world .caption{width: 326px; margin-left: 24px; float:right; text-align: left; max-width: none;} #aboutContent .imgContainer.willis{padding-left: 160px;} #aboutContent .imgContainer.willis .caption{position: absolute; left:0px; top:88px; width:140px; text-align: left;} #aboutContent .imgContainer.wildlife{ width:500px;} #aboutContent .imgContainer.wildlife img{width:250px;} #aboutContent .imgContainer.wildlife img:nth-of-type(1){float:left;} #aboutContent .imgContainer.wildlife img:nth-of-type(2){float:right; margin-top:70px;} #aboutContent .imgContainer.wildlife .caption{ width:224px; float:left; text-align: left; padding-left: 14px;} #aboutContent .imgContainer.children1{padding-right: 160px;} #aboutContent .imgContainer.children1 .caption{position: absolute; right:0px; top:141px; width:140px; text-align: left;} #aboutContent .creek{clear: right; padding-right: 450px;} #aboutContent .imgContainer.portraits{max-width:800px; right:-70px; margin-left: 32px;} #aboutContent .imgContainer.portraits img.elizabeth{width:350px; float:left;} #aboutContent .imgContainer.portraits img.mary{width:250px; float:right; margin-top:-120px; margin-right: 160px;} #aboutContent .imgContainer.portraits img.alex{width:350px; float:right; margin-top: 24px;} #aboutContent .imgContainer.portraits img.newman{width:350px; float:left; margin-top:24px; margin-right: 24px; margin-left:76px; } #aboutContent .imgContainer.portraits .caption{text-align: left; float:left; color:#fff;} #procedureContent{background-image: linear-gradient(180deg, #00aeef 0, #fff 460px);} /*#procedureContent:before{width:700px; height: 200px; max-width: 50%; background-size: contain; background-position: top right; background-repeat: no-repeat; background-image: url(../images/pencils_ygb.png); display: block; content:'';position: absolute; top:0px; right:0px;}*/ #procedureContent h1 {color: #fff;} #procedureContent ul { margin-top: 16px;} #procedureContent ol {margin-bottom: 64px;list-style: none; padding-right: 510px; } #procedureContent ol li { background-repeat: no-repeat; min-height: 50px; padding-left: 60px; margin-bottom: 24px; } #procedureContent ol li li { padding-left:0px; margin-bottom: 12px; min-height: 0px;} #procedureContent ol > li:nth-child(1) { background-image: url(../images/piggyOne.png); padding-right: 120px; } #procedureContent ol > li:nth-child(2) { background-image: url(../images/piggyTwo.png); } #procedureContent ol > li:nth-child(3) { background-image: url(../images/piggyThree.png); } #procedureContent ol > li:nth-child(4) { background-image: url(../images/piggyFour.png); } #procedureContent ol > li:nth-child(5) { background-image: url(../images/piggyFive.png); } #procedureContent ol > li:nth-child(6) { background-image: url(../images/piggySix.png); } #procedureContent ol > li:nth-child(7) { background-image: url(../images/piggySeven.png); } #procedureContent ol > li:nth-child(8) { background-image: url(../images/piggyEight.png); } #procedureContent ol > li:nth-child(9) { background-image: url(../images/piggyNine.png); } #procedureContent > .content-wrap{padding-bottom: 1040px;} #procedureContent .proposed-layout{ background-color:#ffd923; position: absolute; top:78px; right:80px; width:530px; height: 267px; border:3px solid #2a36cb; border-radius: 64px; background-image: url(../images/procedure-graphics/proposed-layout.png); background-position: bottom 18px left 18px; background-repeat: no-repeat; background-size: 192px auto; } #procedureContent .proposed-layout .l{background-color:#fff; border:2px solid #00aeef; position: absolute; width:300px; height: 150px; background-size: cover; background-position: center; background-repeat: no-repeat; box-shadow: rgba(0,0,0,0.6) 3px 3px 10px 3px;} #procedureContent .proposed-layout .item1{background-image: url(../images/procedure-graphics/Proposed1.jpg); top:-20px; left:-50px; transform: rotate(-12deg);} #procedureContent .proposed-layout .item2{background-image: url(../images/procedure-graphics/Proposed2.jpg); top:-10px; left:190px; transform: rotate(-12deg);} #procedureContent .proposed-layout .item3{background-image: url(../images/procedure-graphics/Proposed3.jpg); bottom:-2px; right:-73px; transform: rotate(0deg);} #procedureContent .proposed-layout .arrow{background-image: url(../images/procedure-graphics/Arrow-Graphic2.png); background-size: contain; width:140px; height: 140px; position: absolute; top:217px; left:352px; z-index: 2; background-repeat: no-repeat; background-position: center; } #procedureContent .drawing-layout{ background-color:#ffce04; border:5px solid #fff; position: absolute; top:390px; right:0px; width:380px; height: 465px; border-radius: 64px; background-image: url(../images/procedure-graphics/drawing-layout.png); background-position: top 12px right 24px; background-repeat: no-repeat; background-size: 170px auto; } #procedureContent .drawing-layout .l{background-color:#fff; border:2px solid #00aeef; position: absolute; width:300px; height: 140px; background-size: cover; background-position: center; background-repeat: no-repeat; box-shadow: rgba(0,0,0,0.6) 3px 3px 10px 3px;} #procedureContent .drawing-layout .item1{ background-image: url(../images/procedure-graphics/Drawing1.jpg); top:-24px; left:-124px;} #procedureContent .drawing-layout .item2{ background-image: url(../images/procedure-graphics/Drawing2.jpg); top:105px; left:-84px;} #procedureContent .drawing-layout .item2:before, #procedureContent .drawing-layout .item3:before, #procedureContent .drawing-layout .item4:before{display: block; content:''; position: absolute; width:140px; height: 140px; background-size: contain; background-repeat: no-repeat; background-position: center; background-image: url(../images/procedure-graphics/Arrow-Graphic.png); top:-48px; left:-100px;} #procedureContent .drawing-layout .item3{ background-image: url(../images/procedure-graphics/Drawing3.jpg); top:224px; left:-41px;} #procedureContent .drawing-layout .item4{ background-image: url(../images/procedure-graphics/Drawing4.jpg); top: 343px; left:4px} #procedureContent .rendering-layout{background-color:#2a36cb; position: absolute; bottom:190px; left:50%; margin-left:-420px; width:840px; height: 830px; border:5px solid #fff; border-radius: 64px; color:#fad91f; background-image: url(../images/procedure-graphics/book-title.png); background-position: left 48px bottom 48px; background-size: 360px auto; background-repeat: no-repeat;} #procedureContent .rendering-layout .l{background-color:#fff; border:2px solid #00aeef; position: absolute; width:400px; height: 200px; background-size: cover; background-position: center; background-repeat: no-repeat; box-shadow: rgba(0,0,0,0.6) 3px 3px 10px 3px;} #procedureContent .rendering-layout .l:after{position: absolute; background-size: contain; display: block; content:''; width:380px; height: 125px; background-repeat: no-repeat; right:-412px; bottom:24px;} #procedureContent .rendering-layout .item1{ background-image: url(../images/procedure-graphics/RenderingA.jpg); top:-30px; left:-124px;} #procedureContent .rendering-layout .item2{ background-image: url(../images/procedure-graphics/RenderingB.jpg); top:155px; left:6px;} #procedureContent .rendering-layout .item3{ background-image: url(../images/procedure-graphics/RenderingC.jpg); top:331px; left:99px;} #procedureContent .rendering-layout .item4{ background-image: url(../images/procedure-graphics/RenderingD.jpg); top: 433px; left:474px} #procedureContent .rendering-layout .item1:after{background-image: url(../images/procedure-graphics/RenderingA-Label.png);} #procedureContent .rendering-layout .item2:after{background-image: url(../images/procedure-graphics/RenderingB-Label.png); bottom:60px;} #procedureContent .rendering-layout .item3:after{background-image: url(../images/procedure-graphics/RenderingC-Label.png); bottom:90px;} #procedureContent .rendering-layout .item4:after{background-image: url(../images/procedure-graphics/RenderingD-Label.png); bottom:-88px; right:-36px;} #procedureContent .rendering-layout .repeat-layout{ width:740; background-color:#ffe923; border:3px solid #fff; padding:16px 75px 16px 129px; color:#2a36cb; font-weight: 700; position: absolute; bottom: -135px; left:90px; border-radius: 48px; font-size: 24px;} #procedureContent .rendering-layout .repeat-layout p{margin:0px 0px 0px 40px; text-indent: -40px;} #procedureContent .rendering-layout .copyright{position: absolute; bottom:28px; left:0px; width:100%; font-size: 12px; padding-left: 115px; } #procedureContent .rendering-layout .arrow{background-image: url(../images/procedure-graphics/Arrow-Graphic3.png); background-size: contain; width:140px; height: 140px; position: absolute; bottom:-100px; right:1px; z-index: 2; background-repeat: no-repeat; background-position: center; transform: rotate(55deg);} #procedureContent .final-note{ padding-right: 0px;} #procedureContent .final-note p{margin-left: 20px; text-indent: -20px;} #booksContent { position: relative; background-image: linear-gradient(0deg, #ffffff 50%, #f7d066 98%);} #booksContent:before{width:700px; height: 200px; max-width: 50%; background-size: contain; background-position: top right; background-repeat: no-repeat; background-image: url(../images/pencils_ygb.png); display: block; content:'';position: absolute; top:43px; right:0px;} #booksContent .pageIntro { color: #2a37cb; font-size: 16pt; font-family: 'Hank BT W01 Roman', 'Times New Roman', Times, serif; vertical-align: top; padding-left: 80px; padding-top: 40px; } #booksContent .pageIntro h1 { color: #2a37cb; font-weight: 100; font-size: 65pt; line-height: 28pt; padding: 0px; margin: -10px 5px 5px -80px; } #booksContent .pageIntro h1 span { display: inline-block; font-size: 36pt; margin-right: -20px; vertical-align: 20px; } .bookTitles{padding:48px 0px} .bookTitles nav#books{text-align: center;} .bookTitles nav#books a{display: inline-block; width:22.5%; margin-right: 2%; margin-bottom: 5%; vertical-align: top; color:#111; text-decoration: none;} .bookTitles nav#books a:before{content:''; display: block; width:100%; height: auto; padding-top:94%; background-size: contain; background-position: center; background-repeat: no-repeat; margin-bottom: 16px;} .bookTitles nav#books a:hover{animation: shake 1.2s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;} .bookTitles nav#books a .title{display: none;} .bookTitles nav#books a .author{text-align: center; font-size: 14px; font-style: italic; font-weight: 300;} #books a.abner:before{background-image: url(../images/title-abner.png);} #books a.lemon-shark:before{background-image: url(../images/title-lemon.png);} #books a.christian-kritters:before{background-image: url(../images/title-kritters.png);} #books a.tate-tucker:before{background-image: url(../images/title-tate.png);} #books a.maxwell:before{background-image: url(../images/title-maxwell.png);} #books a.love-you-more:before{background-image: url(../images/title-love.png);} #books a.ponder:before{background-image: url(../images/title-things.png);} #books a.chipmunk:before{background-image: url(../images/title-chipmunk.png);} #books a.words:before{background-image: url(../images/title-words.png);} #books a.snap:before{background-image: url(../images/title-snap.png);} #books a.jack-creekside:before{background-image: url(../images/book-graphics/jack-creekside-title.png);} #books a.when-i-was-younger:before{background-image: url(../images/book-graphics/when-i-was-younger/title.webp);} #books a.christmas-mummy:before{background-image: url(../images/book-graphics/christmas-mummy/The-Christmas-Mummy.webp);} #books a.little-lopsys:before{background-image: url(../images/book-graphics/little-lopsys/Little-Lopsy-TITLE.webp);} #books a.pizza-parlor:before{background-image: url(../images/book-graphics/pizza-parlor/Asset\ 2x800.webp);} #books a.big-brother:before{background-image: url(../images/book-graphics/brother-menu.png);} .bookTitles #books a.big-brother:before{background-image: url(../images/book-graphics/brother-Books-Page-Title.png);} #books a.lift:before{background-image: url(../images/book-graphics/Lift-TITLES.png);} .bookTitles #books a.lift:before{background-image: url(../images/book-graphics/Lift-TITLES-noauthor.png);} #books a.three-in-me:before{background-image: url(../images/book-graphics/3-in-Me-TITLES.png);} .bookTitles #books a.three-in-me:before{background-image: url(../images/book-graphics/Lift---3-in-Me-MENU-TITLES-noauthor.png);} #books a.gadfly:before{background-image: url(../images/book-graphics/gadyfly/Gadfly-Books-Title-w-author.png);} .bookTitles #books a.gadfly:before{background-image: url(../images/book-graphics/gadyfly/Gadfly-Books-Title.png);} .bookTitles #books a.christmas-mummy:before{background-image: url(../images/book-graphics/christmas-mummy/The-Christmas-Mummy.webp);} .bookTitles #books a.little-lopsys:before{background-image: url(../images/book-graphics/little-lopsys/Little-Lopsy-TITLE.webp);} .bookTitles #books a.pizza-parlor:before{background-image: url(../images/book-graphics/pizza-parlor/Asset\ 2x800.webp);} .container-table > .LSidebar nav#books a{display: block; padding:16px; border-bottom: 1px solid #ec008c;} .container-table > .LSidebar nav#books a:before{width:100%; height: 160px; background-size: contain; background-position: center; background-repeat: no-repeat; margin-bottom: 16px; content:''; display: block;} .container-table > .LSidebar nav#books a .title, .container-table > .LSidebar nav#books a .author{display: none;} #booksContent{} #singleBookContent .container-table > .LSidebar{} #singleBookContent #books{height: 800px;} .authorTitle{display: inline-block; width:71px; height:17px; background-image: url(../images/author.png); background-repeat: no-repeat;} .authorsTitle { display: inline-block; width: 81px; height: 17px; background-image: url(../images/authors.png); background-repeat: no-repeat; } .authorBlock .author{font-size: 18pt; font-weight: 200;} .authorBlock .isbn{font-size: 11pt;} .authorBlock .logoXulon { margin-top: 8px; margin-left: auto; margin-right: auto; } .purchaseBlock { margin-right: auto; } .purchaseBlock h1 { font-size: 28pt; color: #2a37cb; } .purchaseBlock a { display: inline-block; } .purchaseBlock a div { display: inline-block; margin-left: 20px; } .purchaseBlock a:hover { animation: grow 0.5s ease-in-out 0s 1; } .purchaseBlock a.no-bounce:hover { animation: none; } .purchaseBlock a.no-bounce{color:#333; text-decoration: none;} .logoAmazon { width: 120px; height: 69px; background-image: url(../images/logo-amazon.png); background-repeat: no-repeat; background-size: contain; background-position: center; } .logoXulon { width: 120px; height: 85px; background-image: url(../images/logo-xulon.png); background-repeat: no-repeat; background-size: contain; background-position: center; } .logoWestbow { width: 170px; height: 85px; background-image: url(../images/logo-westbow.png); background-repeat: no-repeat; background-size: contain; background-position: center; } .logoBarnesNoble { width: 170px; height: 85px; background-image: url(../images/barnesandnoble_logo%2002.png); background-repeat: no-repeat; background-size: contain; background-position: center; } .logoClocca{ width:170px; height: 170px; background-image: url(../images/logo-clocca.png); background-repeat: no-repeat; background-position: center; background-size: contain; } .logoCarpenter{ width:170px; height: 84px; background-image: url(../images/book-graphics/CarpentersSon-logos.png); background-repeat: no-repeat; background-position: center; background-size: contain; } .feather{ background-image: url(../images/feather.png); background-size: contain; background-repeat: no-repeat; background-position: center; padding:40px; margin-top: -32px;} .imgBorder { border: 2px solid #000000; box-sizing: border-box; } .imgShadow{box-shadow: rgba(0,0,0,0.6) 2px 2px 3px 1px;} .deepShadow{box-shadow: rgba(0,0,0,0.7) 3px 3px 6px 2px;} #freebiesContent .articles_list{padding-bottom: 84px} .article_section{display: inline-block; vertical-align: top; width:48%; margin-right: 4%; padding-bottom: 32px;} .article_section:nth-child(2n){margin-right: 0px;} .article_section a{line-height: 1.2em;} .article_section li{margin-bottom: 16px; height: auto;} #infoContent.article{background-image: none;} .article .Content{padding-bottom: 64px; padding-top:64px;} .article h1{ font-family: "Core Serif N W01_35 Regular"; font-size: 32px; text-align: center;} .article h2{ font-family: "Core Serif N W01_35 Regular";} .article h1 .subtitle{} .article h1 .subtitle:before{display: inline; content:' - ';} .article h1 .small-subtitle{display: block; font-size: 0.8em;} .article.hireme aside{width:900px; max-width: 80%; float:left; border:5px solid #333; padding:24px 24px 32px; margin:0px 24px 24px 0px;} .article.hireme aside figure{float:right; clear: right; margin-right: 0px;} .article.hireme aside figure img{box-shadow: rgba(0,0,0,0.5) 1px 1px 24px 4px; border:1px solid #333; height: 300px; width:auto;} .article.hireme aside figcaption{font-size: 14px;text-align: right;} .article.hireme aside figure#LoveYouMoreSample{margin-top:0px;} .article aside.center{border:5px solid #333; padding:24px;margin:24px 0px;} .article aside.right{border:5px solid #333; padding:24px 24px 32px; float:right; width:350px; margin:0px 0px 24px 24px; } .article ol li{margin-bottom: 1.2em;} .article ul li{margin-bottom: 1.2em;} .article#CMYKRGB .table-content{width:auto;} .article#CMYKRGB .table-cell{width:50%; text-align: center;} .article#CMYKRGB .table-cell:nth-child(1){padding-right: 12px;} .article#CMYKRGB .table-cell:nth-child(2){padding-left: 12px;} .article#CMYKRGB figure{display: table;} .article#CMYKRGB figcaption{display: table-caption; caption-side: top; font-size: 16px;} .article#CMYKRGB #afterword{border:none;} /*IE UGLYNESS */ .article#CMYKRGB .table-content.twocolumns{display: block; max-width: 786px; float:left;} .article#CMYKRGB figure{display: block; margin:0px;} .article#CMYKRGB figcaption{display: block;} .article#CMYKRGB .table-cell{display: block; width:50%; float:left;} .article .borderline{border:2px solid #232323; padding:8px 12px; display: block; margin:0px auto;} @supports (display:flex){ .article#CMYKRGB aside.right{border:5px solid #333; padding:24px 24px 32px; float:right; width:350px; margin:0px 0px 24px 24px; } .article#CMYKRGB .table-content{width:auto;} .article#CMYKRGB .table-cell{width:50%; text-align: center;} .article#CMYKRGB .table-cell:nth-child(1){padding-right: 12px;} .article#CMYKRGB .table-cell:nth-child(2){padding-left: 12px;} .article#CMYKRGB figure{display: table;} .article#CMYKRGB figcaption{display: table-caption; caption-side: top; font-size: 16px;} } .article figure.aside.small{width:125px;margin-left: 0px;} .article figure.aside.large{width:50%;} .article blockquote{font-family: "Core Serif N W01_35 Regular"; } .article#blackwhite figure img{border:3px solid #666;} .article#blackwhite figure.moveup{position: relative; margin-top:-32px;} .article#blackwhite figure.moveleft{position: relative; margin-left:-72px;} .article#blackwhite .instructions{clear: both; padding-top:48px;} .article#blackwhite .instructions figure:nth-child(1){display: inline-block; width:30%; margin:0px; padding:0px 24px 0px 24px; vertical-align: top;} .article#blackwhite .instructions figure:nth-child(1) img{margin-bottom: 24px; max-width: 350px;} .article#blackwhite .instructions figure:nth-child(2){display: inline-block; width:70%; margin:0px; padding:0px 24px; vertical-align: top;} .article#blackwhite .instructions figure:nth-child(2) img{display: inline-block; width: 350px; margin-right: 24px;margin-bottom: 24px;} .article#blackwhite .afterword{border:3px solid #666; padding:16px 32px; margin:72px 72px 48px 72px;} .article#blackwhite .afterword:before{width:450px; height: 450px; background-image: url(../images/articles/Flyer-A-Final.png); background-size: contain; background-repeat: no-repeat; background-position: center; float:right; margin:-72px -72px 24px 24px; display: block; content:'';} blockquote.pad20{padding-left: 10%; font-style: italic;} .article#creative{} .article#creative h1{background-image: url(../images/articles/I-Murdered.jpg); background-size: 40% auto; background-position: right top; background-repeat: no-repeat;padding-right: 50%; text-align: center;} .article#creative h1 .larger{font-size: 48px; font-weight: 800;} .article#creative h1 strong{font-family:'Neutro W01', sans-serif; font-weight: 900; font-size: 36px; letter-spacing: 0px;} .article#creative h1 em{font-size: 24px;} .article#creative h1 em u{font-size: 32px;} .article#creative .firstcharacter{float:left; font-family:"Core Serif N W01_35 Regular"; font-size: 44px; line-height: 36px; padding-top: 4px; padding-right: 3px; padding-left: 3px; } .article#creative h2{margin-bottom: 0px;} .article#creative p.pony:before{content:''; display: block; float:right; width:40%; height: auto; padding-top:40%; background-image: url(../images/articles/Pony.jpg); background-size: contain; position: relative; background-repeat: no-repeat; background-position: center;} .article#creative #pony-amok{width:60%; max-width: none; border:2px solid #000; padding:8px;} .article#creative blockquote.comp{ max-width: 1020px; margin:0px auto;} .article#creative blockquote.comp:after{content:''; display: block; width:50%; border-bottom: 1px solid #000;} .article#creative blockquote.comp p:nth-of-type(2){padding-left: 20%;} .article#creative table#examples{border-collapse: collapse;} .article#creative table#examples td{border:2px solid #000; padding:24px; border-collapse: collapse;} .article#creative table#examples h2{text-align: center; margin-top: 0px;} .article#creative table#examples table.time-line td{border:none; vertical-align: top;} .article#creative table.time-line td:nth-child(1){width:130px;} .article#creative table#examples h5{font-size: 27px; font-weight: 800; margin:0px;} .article .post-body{max-width: 1024px; margin-left:auto; margin-right: auto;} .article .post-body p{text-indent: none;} .article .post-body > p:first-child:first-letter{float:left; font-family:"Core Serif N W01_35 Regular"; font-size: 44px; line-height: 36px; padding-top: 4px; padding-right: 3px; padding-left: 3px; } .image-strip{text-align: center;} .image-strip img{display: inline-block; vertical-align: bottom; max-width:25%;} .post-archive{list-style: none; padding-left:8px;} .post-archive ul{list-style: none; display: none; margin:0px; padding:0px 0px 0px 8px;} .post-archive li.on > ul{display: block;} .post-archive .year{margin-bottom: 8px;} .post-archive .year:before{content:''; display: inline-block; width:12px; height: 12px; margin-right: 8px; background-size: contain; background-position: center; background-image: url(../images/icons/folder_closed_icon.png); background-repeat: no-repeat; cursor: pointer;} .post-archive .year.on:before{background-image: url(../images/icons/folder_open_icon.png);} .post-archive .months > li:before{ content:''; display: inline-block; width:12px; height: 12px; margin-right: 8px; background-size: contain; background-position: center; background-repeat: no-repeat; cursor: pointer;} .post-archive .months > li.has_posts{cursor: pointer;} .post-archive .months > li.has_posts:before{background-image: url(../images/icons/folder_closed_icon.png);} .post-archive .months > li.has_posts.on:before{background-image: url(../images/icons/folder_open_icon.png);} .post-archive .months .month{color:#999;} .post-archive .months > li > em{font-size: 0.7em; font-weight: bold;} .post-archive .months .has_posts .month{color:#a00000;} .post-archive .post_list{padding-left: 32px; padding-top:12px;} .post-archive .post_list li{margin-bottom: 12px;} .blogpost{max-width:1024px; margin:32px auto; } .blogpost h1{color:#222; font-family:"Core Serif N W01_35 Regular"; font-size: 44px; padding-left:200px; position: relative;} .blogpost h1:before{content:''; display: block; position: absolute; left:0px; top:-42px; width:190px; height: 100px; background-image: url(../images/Pony-Silhoette-CYAN.png); background-size: contain; background-repeat: no-repeat; background-position: top left;} .blogpost h1 .date{font-size: 18px; display: inline-block; margin-right: 12px;} .blogpost .post-body{} .blogpost .post-body > p:first-of-type:first-letter{float:left; font-family:"Core Serif N W01_35 Regular"; font-size: 44px; line-height: 36px; padding-top: 4px; padding-right: 3px; padding-left: 3px; } .blogpost .post-body > p:first-of-type{text-indent: 0px;} .blogpost .post-body p{text-indent: 32px;} .blogpost .post-body .no-indent p{text-indent: 0px;} .blogpost .post-body ul li{margin-bottom: 1.2em;} .blogpost .post-body ol li{margin-bottom: 1.2em;} .blogpost .post-body blockquote.small-quote{max-width:600px; margin-left:auto; margin-right: auto;} @media screen and (max-width:664px) { .blogpost .post-body blockquote.small-quote{margin-left:32px; margin-right: 32px;} } #blogroll #comment-form{max-width:1024px; margin:80px auto;} #blogroll ul.comments{list-style: none; border-top:2px solid #999; padding-left:0px; padding-top: 16px; max-width:1024px; margin:32px auto; } #blogroll ul.comments li{margin-bottom:16px; border-bottom: 1px solid #999; padding:0px 32px 18px 32px;} #blogroll ul.comments li.page-off{display: none;} #blogroll ul.comments li .author{ color:#999; font-size: 0.8em; margin-top:8px;} #blogroll ul.comments li .author strong{color:#777;} #blogroll ul.comments li .timestamp{color:#999; font-size: 0.8em; font-style: italic;} #blogroll ul.comments li .comment{padding:16px 0px; } #blogroll ul.comments li .response{padding-left: 120px; border-top:1px dashed #999; padding-top:12px; margin-top:12px; font-style: italic;} #new-comment{height:0px; overflow: hidden; opacity: 0; transition:all 0.3s ease;} #new-comment.on{height:auto; opacity: 1;} #blogroll .pagination{clear:both; float:none; margin-top:0px; text-align: center;} #blogroll .pagination h5{text-transform: uppercase; font-weight: 400; font-size: 16px; color:#676767; margin:0px;} #blogroll .pagination span{display: inline-block; text-decoration: none; color:#676767; padding:6px 12px; cursor: pointer;} #blogroll .pagination span.active{color:#bd2615; font-weight:800;} #blogroll .pagination span.outofrange{display: none;} #blogroll .pagination span.prev{width:30px; height: 30px; vertical-align: middle; border-radius: 50%; background-color:#676767; position: relative;} #blogroll .pagination span.prev:before{content:''; display: block; width:16px; height: 1px; border-color:#fff; border-top:2px solid #fff; position: absolute; transform: rotate(0deg); top:14px; left:7px; transition:all 0.3s ease-in-out; transform:rotate(-135deg); height: 14px; width:14px; top:8px; left:7px; border-right:2px solid #fff; } #blogroll .pagination span.prev:after{content:''; display: block; width:16px; height: 1px; border-color:#fff; border-top:2px solid #fff; position: absolute; transform: rotate(90deg); top:14px; left:7px; transition:all 0.3s ease-in-out; transform:rotate(0deg); top:15px; left:7px;} #blogroll .pagination span.next{width:30px; height: 30px; vertical-align: middle; border-radius: 50%; background-color:#676767; position: relative;} #blogroll .pagination span.next:before{content:''; display: block; width:16px; height: 1px; border-color:#fff; border-top:2px solid #fff; position: absolute; transform: rotate(0deg); top:14px; left:7px; transition:all 0.3s ease-in-out; transform:rotate(45deg); height: 14px; width:14px; top:8px; left:7px; border-right:2px solid #fff; } #blogroll .pagination span.next:after{content:''; display: block; width:16px; height: 1px; border-color:#fff; border-top:2px solid #fff; position: absolute; transform: rotate(90deg); top:14px; left:7px; transition:all 0.3s ease-in-out; transform:rotate(0deg); top:15px; left:7px;} #blogroll .pagination .breaker{ padding:6px 6px;} #blogroll .blogolul ul{margin:1.2em 0px;} #blogroll .blogolul ul li{margin-bottom: 0.2em;} ol.marked-text{list-style: none; counter-reset: my-awesome-counter; padding-left: 40px;margin-top: 24px; margin-bottom: 24px;} ol.marked-text li{ counter-increment: my-awesome-counter; position: relative;} ol.marked-text li::before{ content: counter(my-awesome-counter); color:#fff; background-color:#333; border-radius: 50%; width:24px; height: 24px; text-align: center; line-height: 24px; display: inline-block; position: absolute; left:-40px; top:-4px;} ol.marked-text li.red{color:#d4232b;} ol.marked-text li.red:before{background-color:#d4232b;} ol.marked-text li.blue{color:#3f53a4;} ol.marked-text li.blue:before{background-color:#3f53a4;} ol.marked-text li.green{color:#40ae49;} ol.marked-text li.green:before{background-color:#40ae49;} ol.marked-text li.orange{color:#f05323;} ol.marked-text li.orange:before{background-color:#f05323;} ol.marked-text li.lblue{color:#26ace2;} ol.marked-text li.lblue:before{background-color:#26ace2;} ol.marked-text li.pink{color:#b21f63;} ol.marked-text li.pink:before{background-color:#b21f63;} .article .gallery-images{text-align: center;} .article .gallery-images img{display: inline-block; vertical-align: top; width:32%; margin-right: 2%; margin-bottom: 2%;} .article .gallery-images img:nth-child(3n){margin-right: 0px;} .article .gallery-images img.verticle{width:23.5%; margin-right: 2%;} .article .gallery-images img.verticle:nth-child(3n){margin-right: 2%;} .article .gallery-images img.verticle:nth-child(7){margin-right: 0px;} .article .gallery-images .caption{display: block;text-align: center; font-size: 0.8em; font-style: italic; font-weight: 600;} .zanook{ text-align: center;} .zanook img:nth-child(1){width:15.18%;} .zanook img:nth-child(2){width:32.48%;} .zanook img:nth-child(3){width:52.30%;} html{scroll-behavior: smooth;} :target:before{content:''; display: block; height: 100px; margin:-100px 0 0;} #glossary{ background: linear-gradient(180deg, #ffd923 0%, #FFF 526px); } #glossary .title{height: 606px; background-image: url(../images/glossary/Header.png); background-size: 1190px auto;; background-repeat: no-repeat; background-position: center bottom; border-bottom: 5px solid #999; } #glossary h1{text-align: center;} #glossary a.header{text-align: center; display: block; width:100%; height:239px; background-size: contain; background-position: center; background-repeat: no-repeat; clear:both; overflow: hidden; text-indent: 100%; white-space: nowrap; color:#fff;} #glossary a#A.header{background-image: url(../images/glossary/A%20400.png)} #glossary a#B.header{background-image: url(../images/glossary/B%20400.png)} #glossary a#C.header{background-image: url(../images/glossary/C%20400.png)} #glossary a#D.header{background-image: url(../images/glossary/D%20400.png)} #glossary a#E.header{background-image: url(../images/glossary/E%20400.png)} #glossary a#F.header{background-image: url(../images/glossary/F%20400.png)} #glossary a#G.header{background-image: url(../images/glossary/G%20400.png)} #glossary a#H.header{background-image: url(../images/glossary/H%20400.png)} #glossary a#I.header{background-image: url(../images/glossary/I%20400.png)} #glossary a#J.header{background-image: url(../images/glossary/J%20400.png)} #glossary a#KL.header{background-image: url(../images/glossary/K-L%20400.png)} #glossary a#M.header{background-image: url(../images/glossary/M%20400.png)} #glossary a#N.header{background-image: url(../images/glossary/N%20400.png)} #glossary a#O.header{background-image: url(../images/glossary/O%20400.png)} #glossary a#P.header{background-image: url(../images/glossary/P%20400.png)} #glossary a#QR.header{background-image: url(../images/glossary/Q-R%20400.png)} #glossary a#S.header{background-image: url(../images/glossary/S%20400.png)} #glossary a#T.header{background-image: url(../images/glossary/T%20400.png)} #glossary a#UVW.header{background-image: url(../images/glossary/U-V-W%20400.png)} #glossary a#XYZ.header{background-image: url(../images/glossary/X-Y-Z%20400.png)} #glossary .layoutContainer a{font-weight: 600;} #glossary_nav{background-color:#ffd923; display: block; text-align: center; padding:24px; border-radius:16px; width:415px; position: fixed; right:24px; transition:all 0.5s ease-in-out;} #glossary_nav:before{content:''; display: block; position: absolute; top:12px; left:12px; right:12px; bottom:12px; border:2px solid #ec008c; border-radius: 12px;} #glossary_nav a{font-family: 'Hank BT W01 Roman', 'Times New Roman', Times, serif; color:#ec008c; display: inline-block; padding:8px 16px;font-size: 24px; position: relative; text-decoration: none;} .offtop #glossary_nav{right:-410px; bottom:24px;} .offtop #glossary_nav.on{right:24px;} #glossary_nav .toggle{position: absolute; right:100%; top:84px; width:0px; height: 58px; background-color:#ffd923; border-top-left-radius: 16px; border-bottom-left-radius: 16px; overflow: hidden; transition: all 0.5s ease-in-out; cursor: pointer;} #glossary_nav .toggle:before{position: absolute; display: block; content:''; border-top:2px solid #ec008c; border-left: 2px solid #ec008c; background-color:#ffd923; border-top-left-radius: 4px; transform: rotate(-45deg); transform-origin: center; width:16px; height: 16px; top:20px; left:16px;} #glossary_nav .toggle:after{content: 'A B C'; font-family:'Hank BT W01 Roman', 'Times New Roman', Times, serif; color:#ec008c;transform: rotate(-90deg); transform-origin: center bottom; position: absolute; display: block; top:11px; right:-24px; width:48px;} .offtop #glossary_nav .toggle{width:48px;} .story-inset{background-color:#eff3f3; padding:48px 32px; border:1px solid #999; margin-bottom: 48px; box-shadow: rgb(0 0 0 / 40%) 1px 1px 27px 0px;} @media screen and (min-width:1789px){ #glossary_nav{bottom:24px;} } @media screen and (max-width:1024px){ #glossary .title{background-size: contain; height: auto; padding-top:47%; margin-top:24px;} #glossary_nav{width:90%; right:5%;} .offtop #glossary_nav{width:415px; left:auto; bottom:24px;} #glossary .layoutContainer{padding-top:1px;} #glossary #A{margin-top:115px;} } @media screen and (max-width:400px){ #glossary #A{margin-top:235px;} .offtop #glossary_nav.on{width:90%; right:5%;} } @media screen and (max-height:800px){ .home #Content h2{padding-bottom: 24px;} #freebiesContent .Content{padding-bottom: 280px} #singleBookContent #books{} } @media screen and (max-height:700px){ #singleBookContent #books{height: 560px;} } @media screen and (max-width:1757px){ .container-table > .Content{width:auto; padding-right:64px;} .container-table > .RSidebar{display: none;} .article#CMYKRGB .table-content.twocolumns{width:70%;} .article#CMYKRGB aside.right{width:24%;} } @media screen and (max-width:1627px){ .home-wrap:after{background-position: right -80px top -90px;} } @media screen and (max-width:1590px){ .article#CMYKRGB #afterword{display: block; float:none; width:auto; clear: both;} } @media screen and (max-width:1464px){ .content-wrap{width:auto; margin-left:32px; margin-right: 32px;} /*.home header h1 .subtitleContainer{display: table; width:auto; margin-left: -32px; margin-right: -32px;} .home header h1 .leftHR{width:auto; margin-left: 0px; display: table-cell;} .home header h1 .rightHR{width:auto; margin-right: 0px;}*/ } @media screen and (max-width:1420px){ .article.hireme aside{max-width: 60%;} .article.hireme aside figure{float: none; margin-left: auto; margin-right: auto; display: block; margin-top:27px;} .article.hireme aside figure img{display: block; margin:0px auto; height: auto;} .article.hireme aside figure figcaption{text-align: center;} } @media screen and (max-width:1400px){ #aboutContent .imgContainer.img2{max-width:400px;} #aboutContent .imgContainer.gem-world{max-width: 400px;} #aboutContent .imgContainer.gem-world img:nth-of-type(1){width:190px;} #aboutContent .imgContainer.gem-world img:nth-of-type(2){width:210px;} #aboutContent .imgContainer.gem-world .caption{width:186px;} #aboutContent .imgContainer.willis{max-width: 400px;} #aboutContent .imgContainer.willis .caption{top:22px;} #aboutContent .imgContainer.children1{max-width: 400px;} #aboutContent .imgContainer.children1 .caption{top:61px;} #aboutContent .imgContainer.portraits{width:500px; height: 580px; right:0px;} #aboutContent .imgContainer.portraits img.elizabeth{position: absolute; top:-124px; right:0px; float:none; } #aboutContent .imgContainer.portraits img.mary{position: absolute; top:0px; right:250px; float:none; margin:0px; z-index: 1;} #aboutContent .imgContainer.portraits img.alex{float:none; margin:0px; position: absolute; top:320px; right:0px; z-index: 1;} #aboutContent .imgContainer.portraits img.newman{float:none; margin:0px; position: absolute; top:120px; right:-24px; } #aboutContent .imgContainer.portraits .caption{float:none; position: absolute; bottom:80px; left:0px;} } @media screen and (max-width:1200px){ .home-wrap{/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#020f19+0,05273f+100 */ background: rgb(2,15,25); /* Old browsers */ background: -moz-linear-gradient(left, rgba(2,15,25,1) 0%, rgba(5,39,63,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, rgba(2,15,25,1) 0%,rgba(5,39,63,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, rgba(2,15,25,1) 0%,rgba(5,39,63,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#020f19', endColorstr='#05273f',GradientType=1 ); /* IE6-9 */} .home #Content{background-image: url(../images/home-background-dec18-tablet2.png); padding-top:107%; margin-top:0px;} .home-wrap:before{display: none;} .home-wrap:after{background-image: url(../images/pencils_main_tablet-DEC18.png); width:303px; height: 306px; z-index: 1;} .container-table > .LSidebar{width:275px; padding:48px 16px;} .LSidebar nav h2:before{margin:24px -16px 12px;} .container-table > .Content{width:100vw; margin:0px; padding-left: 32px; padding-right: 32px;} .container-table{transform: translateX(-275px); transition:all 0.3s ease-in-out;} .container-table.on{transform: translateX(0px);} .slide-toggle{background-color:#ffd923; box-shadow: rgba(0,0,0,0.3) 1px 1px 1px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; color:#ec008c; position: fixed; top:24px; left:275px; font-family: 'Hank BT W01 Roman', 'Times New Roman', Times, serif; font-size: 14px; padding:8px 12px; transition:all 0.3s ease-in-out;} .slide-toggle:before{content:'MORE';} .container-table.on .slide-toggle{background-color:#ec008c; color:#fff; left:208px; border-top-right-radius: 0px; border-top-left-radius: 4px; border-bottom-left-radius: 4px; border-bottom-right-radius: 0px;} .container-table.on .slide-toggle:before{content:'CLOSE';} .interior .container-table h1{margin-top:24px;} /*Procedure Changes*/ #procedureContent > .content-wrap{padding-bottom: 0px;} #procedureContent ol{padding-right: 0px;} #procedureContent .proposed-layout{position: relative; top:0px; right:auto; left:-10px; margin-top:50px; margin-bottom: 80px; margin-left: auto; margin-right: auto; } #procedureContent .proposed-layout .arrow{left:auto; right:-132px;} #procedureContent .drawing-layout{position: relative; top:0px; right:auto; margin:50px auto; } #procedureContent .rendering-layout{position: relative; width:auto; bottom:auto; left:auto; margin:50px -32px 60px -132px; background-position: top 24px right 24px; background-size: 390px auto; border-radius: 0px; border-right:none; border-left: none;} #procedureContent .rendering-layout .item1{top:-30px; left:26px;} #procedureContent .rendering-layout .item2{top:145px; left:16%;} #procedureContent .rendering-layout .item3{top:321px; left:auto; right:18%;} #procedureContent .rendering-layout .item4{top:493px; left:auto; right:32px;} #procedureContent .rendering-layout .l:after{display: none;} #procedureContent .rendering-layout .repeat-layout{width:auto; bottom:65px; left:auto; margin-left:32px; margin-right: 464px; padding:16px 32px;} #procedureContent .rendering-layout .arrow{bottom:70px; right:360px;} #procedureContent .final-note{padding-right: 0px;} #procedureContent .rendering-layout .copyright{padding-left: 32px; padding-right: 32px; text-align: center;} /*end Procedure Changes*/ #infoContent .Content{} .article h1{font-size: 24px;} .article h2{font-size: 22px;} .container-table > .LSidebar nav a.larger{font-size: 22px;} .article#blackwhite .instructions figure:nth-child(1) img{max-width: 100%;} .article#blackwhite .instructions figure:nth-child(2) img{max-width: 48%; margin-right: 2%;} #mainNav nav a{width:123px;} } @media screen and (max-width:1024px){ .home header #mainNav{position: fixed; top:0px; left:0px; width:100%; z-index: 999; } .interior > .content-wrap{padding-top: 24px;} .bookTitles{padding:0px;} #booksContent .pageIntro p{line-height: 1.2em;} } @media screen and (max-width:961px){ #mainNav{height: 36px;} #mainNav nav{position: absolute; top: 0px; right:8px; padding-top:36px; height: 36px; width:208px; overflow: hidden; background-color:#ffd923; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; transition:all 0.4s ease-in-out; z-index: 1;} #mainNav.on nav{height: 352px;} #mainNav nav:before, #mainNav:after, #mainNav nav:after {width:35px; height: 4px; background-color:#ec008c; border-radius: 2px; position: absolute; right:1px; transition:all 0.3s linear; display: block; content:''; z-index: 999; transform-origin: center;} #mainNav nav:before{top:7px;} #mainNav:after{top:16px; right:41px; opacity: 1;} #mainNav nav:after{top:25px;} #mainNav.on nav:before{transform: rotate(45deg); top:17px; } #mainNav.on nav:after{transform: rotate(-45deg); top:18px;} #mainNav.on:after{opacity: 0;} #mainContact{bottom:-66px;} #mainNav #social{right:auto; left:0px;} #mainNav #social a{height: 36px; margin-left: 0px; margin-right: 12px;} #infoContent .article_section{width:48%;} #infoContent .article_section:nth-child(1){width:auto; display: block;} } @media screen and (max-width:890px){ .article#creative h1{padding-right: 0px; padding-bottom: 200px; background-size: auto 200px; background-position: center bottom;} } @media screen and (max-width:800px){ #procedureContent .proposed-layout{left:-110px;} #procedureContent .proposed-layout .arrow{display: none;} #procedureContent .rendering-layout .repeat-layout{font-size: 26px;} #procedureContent .rendering-layout .copyright{text-align: center; padding:0px 32px;} #procedureContent .rendering-layout .l{width:440px; height: 240px;} #procedureContent .rendering-layout .item3{top:401px;} #procedureContent .rendering-layout .item4{top:623px;} #procedureContent .rendering-layout{height: 1100px;} .bookTitles nav#books a{width:32%;} .bookTitles nav#books a:nth-child(3n){margin-right: 0px;} .interior h1{margin-bottom: 0px;} #aboutContent .imgContainer.wildlife{width:400px;} #aboutContent .imgContainer.wildlife img{width:200px;} .zanook{} .zanook img:nth-child(1){width:30.36%;} .zanook img:nth-child(2){width:64.96%;} .zanook img:nth-child(3){width:auto;} } @media screen and (max-width:770px){ .home-wrap:after{right:0px; width:150px; height: 150px; top:35px; background-position: left 30px top;} .home header{position: relative; z-index: 2;} .home header h1{text-shadow: rgba(0,0,0,0.8) 1px 1px 1px; } .home #Content h2{float:none;} .article#CMYKRGB .table-content{clear: both;} .article#CMYKRGB aside{width:auto; height: auto; overflow: hidden; padding:24px 24px 0px; border:none; max-height: 39px; max-width: 111px; transition: all 0.3s ease-in-out; position: relative;} .article#CMYKRGB aside .toggle{background-color:#ffd923; display: block; width:100px; height: 32px; text-align: center; position: absolute; top:3px; left:4px; box-shadow: rgba(0,0,0,0.3) 1px 1px 1px; border-radius: 4px; color:#ec008c; font-family: 'Hank BT W01 Roman', 'Times New Roman', Times, serif; font-size: 14px; line-height: 32px; } .article#CMYKRGB .toggle:before{content:'Examples';} .article#CMYKRGB aside.on{max-width: 100%; max-height: 3000px; border:3px solid #333; margin-right: 0px; } .article#CMYKRGB aside.right{border:none; padding:24px 24px 0px; max-width: 142px; width:auto;} .article#CMYKRGB aside.on{max-width: 100%; border:3px solid #333;} .article#CMYKRGB aside .toggle{width:140px; left:auto; right:2px;} .article#CMYKRGB aside .toggle:before{content:'Why this Matters';} .article#blackwhite figure.aside{width:200px;} .article#blackwhite .instructions figure:nth-child(1){width:34%; padding-left: 15px;} .article#blackwhite .instructions figure:nth-child(2){width:66%;} .article#blackwhite .instructions{padding-top:24px;} .article#blackwhite .afterword{margin:72px 0px;} .article#blackwhite .afterword:before{margin-right: -56px;} } @media screen and (max-width:769px){ /*.home #Content{margin-top:-168px;}*/ #procedureContent .proposed-layout{position: relative; width:auto; margin:0px 0px 0px -30px; left:auto; right:auto; padding:85% 0px 0px 0px; background:none; border:none; height:auto;} #procedureContent .proposed-layout .item1{background-image: url(../images/procedure-graphics/procedure-layout-1-800.png); background-size: contain; background-repeat: no-repeat; background-position: center; position: absolute; top:0px; left:0px; width:100%; height: 100%; transform: none; border:none; box-shadow: none;} #procedureContent .proposed-layout .item2{display: none;} #procedureContent .proposed-layout .item3{display: none;} #procedureContent .drawing-layout{position: relative; width:auto; height: auto; margin:0px 0px 0px -30px; left:auto; right:auto; padding:125% 0px 0px 0px; background:none; border:none; } #procedureContent .drawing-layout .l{display: none;} #procedureContent .drawing-layout .item1{ display: block;background:none; background-image: url(../images/procedure-graphics/procedure-drawing-1-800.png); background-size: contain; background-repeat: no-repeat; background-position: center; width:100%; height: 100%; top:0px; left:0px; transform: none; border:none; box-shadow: none;} #procedureContent .rendering-layout{width:auto; height: auto; margin:50px -32px 60px -132px; background-image: none; padding:84% 0px 0px 0px; border-right: none; border-left: none; } #procedureContent .rendering-layout .l{display: none;} #procedureContent .rendering-layout .item1{display: block; width:100%; height: 97%; background:none; box-shadow: none; border:none;background-image: url(../images/procedure-graphics/procedure-rendering-1-800.png); background-size: contain; background-repeat: no-repeat; background-position: center; left:0px; top:0px;} #procedureContent .rendering-layout .repeat-layout{position: static; width:auto; margin-bottom: 16px; font-size: 22px;} #procedureContent .rendering-layout .copyright{position: static; width:auto; display: block; margin-bottom: 12px;} #procedureContent .rendering-layout .repeat-layout p{text-indent: 0px; margin-left: 0px;} #procedureContent .rendering-layout .arrow{display: none;} #procedureContent ol > li:nth-child(1){padding-right: 0px;} #mainContact{right:auto; left:98px; bottom:-29px; z-index: 1;} #infoContent #mainContact, #infoContent #mainContact a{color:#2a37cb;} #freebiesContent .Content{padding-bottom: 280px} } @media screen and (max-width:750px){ #aboutContent .imgContainer{margin-left: 8px;} #aboutContent .imgContainer.img1{float:none; margin:0px auto 12px;} #aboutContent .creek{padding-right: 270px;} #aboutContent .imgContainer.portraits{width:300px;} #aboutContent .imgContainer.portraits img.elizabeth{width:230px; top:-164px;} #aboutContent .imgContainer.portraits img.mary{width:170px; right:160px; top:-48px;} #aboutContent .imgContainer.portraits img.newman{width:220px; top:30px;right:-14px;} #aboutContent .imgContainer.portraits img.alex{top:180px;} #aboutContent .imgContainer.portraits{height: 450px; margin-left: 34px;} #aboutContent .imgContainer.portraits .caption{bottom:170px; left: -120px;} } @media screen and (max-width:670px){ .content-wrap{margin-left: 16px; margin-right: 16px;} .container-table > .Content{padding-left: 16px; padding-right: 22px;} #mainNav:after{right:25px;} .home header h1{font-size: 38px; padding-left: 0px;} .home header .subtitleContainer{display: block;} .home header .leftHR{display: none;} .home header .rightHR{display: none;} .home header .subtitleContent{padding-left: 16px; padding-right: 16px; white-space: normal; display: block; width:auto;} .home header .subtitleContent:before{display: none;} .home header .subtitleContent:after{display: block; position: relative; left:0px; right:0px; top:0px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; margin-top:4px;} .home-wrap:before{display: none;} .home #Content h2{font-size: 24px; color:#fff; padding-top:24px;} .home #copyright{padding-right: 0px;} #pricingContent .layoutContainer .groupOne, #pricingContent .layoutContainer .groupTwo{width:auto;} .interior h1{font-size: 38px;} .interior h2{font-size: 24px;} .article h1{font-size: 24px;} .article h2{font-size: 22px;} .container-table > .LSidebar nav a.larger{font-size: 22px;} #procedureContent ol{padding-left: 0px;} #procedureContent .rendering-layout{margin-right:-16px; margin-left: -76px;} #procedureContent .rendering-layout .repeat-layout p br{display: none;} #procedureContent .rendering-layout .arrow{right:-9px;} .article.hireme aside{ width:auto; height: auto; overflow: hidden; padding:24px 24px 0px; border:none; max-height: 39px; max-width: 111px; transition: all 0.3s ease-in-out; position: relative;} .article.hireme aside .toggle{background-color:#ffd923; display: block; width:100px; height: 32px; text-align: center; position: absolute; top:3px; left:4px; box-shadow: rgba(0,0,0,0.3) 1px 1px 1px; border-radius: 4px; color:#ec008c; font-family: 'Hank BT W01 Roman', 'Times New Roman', Times, serif; font-size: 14px; line-height: 32px; } .article.hireme aside .toggle:before{content:'Examples';} .article.hireme aside.on{max-width: 100%; max-height: 3000px; border:3px solid #333; margin-right: 0px; } .article aside.right{width:auto; height: auto; overflow: hidden; padding:24px 24px 0px; border:none; max-height: 39px; max-width: 111px; transition: all 0.3s ease-in-out; position: relative;} .article aside{width:auto; height: auto; overflow: hidden; padding:24px 24px 0px; border:none; max-height: 39px; max-width: 111px; transition: all 0.3s ease-in-out; position: relative;} .article aside .toggle{background-color:#ffd923; display: block; width:100px; height: 32px; text-align: center; position: absolute; top:3px; left:4px; box-shadow: rgba(0,0,0,0.3) 1px 1px 1px; border-radius: 4px; color:#ec008c; font-family: 'Hank BT W01 Roman', 'Times New Roman', Times, serif; font-size: 14px; line-height: 32px; } .article_section{display: block; width:auto; margin-right: 0px;} .article aside.center{width:auto; height: auto; max-height: none; max-width: none; border:2px solid #333;} .article .toggle:before{content:'Examples';} .article#producingyourbook2 .toggle.imp:before{content:'Important Note';} .article aside.on{max-width: 100%; max-height: 3000px; border:3px solid #333; margin-right: 0px; } .article#CMYKRGB aside.right{border:none; padding:24px 24px 0px; max-width: 142px;} .article#CMYKRGB aside.on{max-width: 100%; border:3px solid #333;} .article#CMYKRGB aside .toggle{width:140px; left:auto; right:2px;} .article#CMYKRGB aside .toggle:before{content:'Why this Matters';} #booksContent .pageIntro{padding-top:16px;} #infoContent .Content{} #infoContent .article_section{width:auto; display: block;} .article figure.aside.small{width:75px;} .article figure.aside.large{width:40%;} .article#CMYKRGB aside.right{ margin-top:24px; margin-left: 0px;} .article#CMYKRGB .table-content{display: block;} .article#CMYKRGB .table-cell{width:auto; display: block;} .article#CMYKRGB figure{max-width:340px; width:100%; margin:1em auto;} .article#producingyourbook3 .table-content.responsive{display: block;} .article#producingyourbook3 .table-content.responsive .table-row{display: block;} .article#producingyourbook3 .table-content.responsive .table-cell{display: block; width:auto;} .article#producingyourbook3 figure.aside.right{float:none; width:auto; max-width: none; margin-left: 0px;} } @media screen and (max-width:570px){ #procedureContent .rendering-layout .arrow{display: none;} #procedureContent .rendering-layout{padding-top:210%} #procedureContent .rendering-layout .item1{background-image: url(../images/procedure-graphics/procedure-rendering-1-550.png); height: 87%;} #procedureContent .rendering-layout .repeat-layout{font-size: 18px; margin-left:16px; margin-right: 16px; padding:16px;} #procedureContent .rendering-layout .repeat-layout p{margin:0px; text-indent: 0px;} #infoContent .Content{padding-right: 0px; padding-bottom: 220px; background-size: auto 290px;} #freebiesContent:before{background-size: auto 100%; padding-top:120%;} #introCMYK figure.aside.large{float:none; width:100%; max-width: 100%;} #introCMYK figure.aside.small{display: none;} .article#blackwhite figure.moveleft{margin-left: 0px;} .article#blackwhite .instructions{padding-top: 0px;} .article#blackwhite .instructions figure:nth-child(1){width:100%; display: block;margin-bottom: 24px;} .article#blackwhite .instructions figure:nth-child(2){width:100%; display: block;} .article#blackwhite .afterword:before{width:100%; padding-top:100%; height: auto; margin:0px;} .article#blackwhite .afterword ul{padding-left: 12px;} .article.finding ul{padding-left: 12px;} .article.finding li{margin-bottom: 12px;} .article.finding li ul{ padding-top:12px;} #aboutContent .imgContainer.img2{max-width: 270px;} #aboutContent .imgContainer.gem-world{max-width: 310px; position: relative;} #aboutContent .imgContainer.gem-world img:nth-of-type(1){width:170px;} #aboutContent .imgContainer.gem-world img:nth-of-type(2){width:220px; margin-top:-44px;} #aboutContent .imgContainer.gem-world .caption{position: absolute; top:9px; right:0px; width:116px;} #aboutContent .imgContainer.willis{max-width: 200px; padding-left: 0px;} #aboutContent .imgContainer.willis .caption{position: static; width:auto; max-width: none;} #aboutContent .imgContainer.wildlife{width:300px;} #aboutContent .imgContainer.wildlife img{width:150px;} #aboutContent .imgContainer.wildlife .caption{width:144px;} #aboutContent .imgContainer.children1{width:200px; padding-right: 0px;} #aboutContent .imgContainer.children1 .caption{position: static; width:auto; max-width: none;} #aboutContent .imgContainer.portraits img.mary{right:140px;} #aboutContent .imgContainer.portraits img.elizabeth{top:-194px;} .blogpost h1{padding-left: 0px; text-align: center; padding-top:120px;} .blogpost h1:before{width:100%; top:0px; background-position: center;} .blogpost h1 .date{display: block;} #loneliest-pencil .table-content{display: block;} #loneliest-pencil .table-cell.six{display: block; text-align: center; padding:0px; width:auto; margin-bottom: 18px;} figure.aside.golden-small{width:auto; max-width: none; display: block; float:none; text-align: center;} figure.aside.golden-small img{display: block; margin:0px auto;} figure.aside.fifty{display: block; width:auto; max-width: none; float:none; text-align: center;} .article .gallery-images img:nth-child(1), .article .gallery-images img:nth-child(2), .article .gallery-images img:nth-child(3){width:auto; display: block; margin:0px auto 2%; max-width: 100%;} .article .gallery-images img:nth-child(4), .article .gallery-images img:nth-child(6){width:49%; margin-right: 2%;} .article .gallery-images img:nth-child(5), .article .gallery-images img:nth-child(7){width:49%; margin-right: 0px;} } @media screen and (max-width:450px){ .home header ul.contactInfo{padding-left: 0px;} #procedureContent ol > li{background-size: 24px auto; padding-left: 30px;} #procedureContent ul{padding-left: 0px;} #procedureContent .rendering-layout{margin-left: -46px;} #mainNav nav{right:-8px;} #mainNav:after{right:9px;} #procedureContent .proposed-layout{padding-top: 175%;} #procedureContent .proposed-layout .item1{background-image: url(../images/procedure-graphics/procedure-layout-1-550.png);} #procedureContent .drawing-layout{padding-top:169%;} #procedureContent .drawing-layout .item1{background-image: url(../images/procedure-graphics/procedure-drawing-1-550.png);} #procedureContent .rendering-layout{padding-top:240%} #procedureContent .rendering-layout .item1{ height: 75%;} .home #Content{background-image: url(../images/home-background-dec18-phone2.png); padding-top:115%;} .home header .contactInfo li:before{display: none;} .home{background-color:#02101a; background-image: linear-gradient(90deg, #02101a 10%, #05273e 75%);} #mainContact{position: relative; width:auto; text-align: left;bottom:auto; z-index: 1} #mainContact li{display: block;} #mainContact li::before{display: none;} .interior #mainNav{position: fixed; top:0px; left:0px; width:100%; } .interior > .content-wrap{padding-top:64px;} .bookTitles nav#books a{width:48%; margin-right: 4%;} .bookTitles nav#books a:nth-child(3n){margin-right: 4%;} .bookTitles nav#books a:nth-child(2n){margin-right: 0px;} #booksContent .pageIntro{padding-left: 24px; padding-top: 0px;} #booksContent .pageIntro h1{font-size: 64px; margin-left: -30px;} #booksContent .pageIntro h1 span{font-size: 34px;} .slide-toggle{top:44px; z-index: 1;} #aboutContent{background-image: none;} #aboutContent .imgContainer.img2{float:none; margin:0px auto 10px;} #aboutContent .imgContainer.gem-world{float:none; margin:0px auto 10px;} #aboutContent .imgContainer.wildlife:after, #aboutContent .imgContainer.gem-world:after{content:''; display: block; clear: both;} #aboutContent .imgContainer.gem-world img:nth-of-type(1){left:0px;} #aboutContent .imgContainer.gem-world .caption{width:136px;} #aboutContent .imgContainer.wildlife, #aboutContent .imgContainer.children1, #aboutContent .imgContainer.willis{float:none; margin:0px auto 10px;} #aboutContent .creek{padding-right: 0px;} #aboutContent .imgContainer.portraits{margin-left: auto; margin-right: auto; height: 490px; float:none;} #aboutContent .imgContainer.portraits img.elizabeth{top:-24px;} #aboutContent .imgContainer.portraits img.mary{width:170px; right:140px; top:135px;} #aboutContent .imgContainer.portraits img.alex{width:200px; top:330px;} #aboutContent .imgContainer.portraits img.newman{width:200px; top:160px; right: -14px;} #aboutContent .imgContainer.portraits .caption{bottom:20px; left: -14px; color:#343434;} #aboutContent .imgContainer.img1{padding-right: 0px; max-width: 200px; } #aboutContent .imgContainer.img1 .caption{position: static; width:auto; max-width: none;} .article#creative h1 .larger{font-size: 32px;} .article#creative p.pony:before{float:none; width:100%; padding-top:70%;} .article#creative #pony-amok{width:100%;margin:0px 0px 24px;} .article#creative table#examples td{padding:16px; } .article#creative table#examples table.time-line td:nth-child(1){padding-left: 0px; padding-right: 8px; width:107px;} .article#creative table#examples table.time-line td:nth-child(2){padding-left: 0px; padding-right: 0px;} .image-strip img{display: inline-block; vertical-align: bottom; max-width:50%;} figure.twelve, figure.eleven, figure.ten, figure.nine, figure.eight, figure.six, figure.four, figure.three, figure.two, figure.one{ display: block; width:auto; max-width: 100%; float:none; margin-left:auto; margin-right: auto;} } /* Animation */ @keyframes grow { 0% { transform: scale(1); } 25% { transform: scale(0.8); } 50% { transform: scale(1.3); } 100% { transform: scale(1); } } @keyframes spin { 0% { transform: rotateZ(0); } 100% { transform: rotateZ(360deg); } } @keyframes slideLeft { 0% { transform: translateX(400px); } 100% { transform: translateX(0); } } @keyframes slideRight { 0% { transform: translateX(-400px); } 100% { transform: translateX(0); } } @keyframes slideUp { 0% { transform: translateY(-400px); } 100% { transform: translateY(0); } } @keyframes shake { 10%, 90% { transform: translate3d(-1px, 0, 0); } 20%, 80% { transform: translate3d(2px, 0, 0); } 30%, 50%, 70% { transform: translate3d(-4px, 0, 0); } 40%, 60% { transform: translate3d(4px, 0, 0); } }