/* ***************************************************** ** Custom Stylesheet ** Any custom styling you want to apply should be defined here. ***************************************************** */ body {margin:0px;} body, table, input, textarea {font-family:'Gudea', Arial, sans-serif!important;font-size:16px;color:#222222;} img {border:0px;} strong {font-weight:700;} .sidr {display:none;} ul, li {margin:0px;padding:0px;} a:link, a:active, a:visited {color:#739c28;} a:hover {color:#4f6d18;} h1, h2, h3, h4, h5 {} h1 {font-weight:normal;font-size:30px;color:#fff;margin:0px;} h2 {color:#a1d04b;font-size:24px;} h3 {color:#929292;font-size:20px;} .button, #topinside, #navigationtop { -webkit-transition: All 0.3s ease; -moz-transition: All 0.3s ease; -o-transition: All 0.3s ease; -ms-transition: All 0.3s ease; transition: All 0.3s ease;} #servicespage h2, #aboutpage h2 {margin-bottom:10px;} #servicespage h3, #aboutpage h3 {margin-bottom:14px;} .nowrap {white-space:nowrap;} .clear {clear:both;} .error {padding:15px;margin:0px 0px;background:#f0c7c7;border:solid #da0000 1px;color:#da0000;font-weight:bold;} .success {padding:15px;margin:0px 0px;background:#ddead5;border:solid #56aa1d 1px;color:#56aa1d;font-weight:bold;} .input {font-size:14px;height:21px;border:solid #bebebe 1px;background:url(/images2013/inputgrad.jpg) top left repeat-x #fff;padding:7px 7px 0 7px;border:solid #ccc 1px;} .input:focus {border:solid #a1d04b 1px;outline:none;} .button {background:#222;float:left;cursor:pointer;text-decoration:none;border:0px;padding:10px 25px;color:#fff;display:block;color:#fff;text-transform:uppercase;font-size:13px;letter-spacing:1px;font-weight:700;} .button:hover {background:#373737;} .buttoncentered{float:none;text-align:center;margin:auto;} .quicklink {background:url(/images2013/linkarrow.png) 0 8px no-repeat;padding-left:15px;text-decoration:none;} a.homeboxhover {z-index:600;position:absolute;top:0px;background:url(/images2013/hoverbgblack.png);width:100%;height:100%;text-decoration:none;display:none;} .homeboxhoverinside {display: table; position: absolute; overflow: hidden;text-align:center;padding:0 20%;height:100%;} .hoverhelper {display:block;#position:absolute;#top:50%;display: table-cell; vertical-align: middle;;height:100%;} .hovercontent {display:block;#position:absolute;#top:-50%;height:auto;width:100%;} .hovericon {display:block;} .hovertext {display:block;color:#fff;} .deskmenu a {font-weight:700;letter-spacing:1px;text-transform:uppercase;text-decoration:none;font-size:13px;padding:8px 10px 10px 10px;color:#fff;display:block;} a.linkbutton {text-align:center;margin-top:20px;text-decoration:none;border:solid #85b32f 1px;padding:10px;color:#5c7b20;display:block;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;} .deskmenu a, .gradientgreen {color:#fff;} .notdesktop {display:none!important;} .show {display:block!important;} #headerarea h1 {position:absolute;text-indent:-999;width:1px;height:1px;overflow:hidden;} #headerareagradient {display:none;} #servicesmenu ul, #servicesmenu li {margin:0px;padding:0px;list-style-type:none;} .deskmenu a { -webkit-transition: All 0.3s ease; -moz-transition: All 0.3s ease; -o-transition: All 0.3s ease; -ms-transition: All 0.3s ease; transition: All 0.3s ease;} #servicesmenu a, a.navarrow, .gradientgreen {background: #a0ca4f; /*Transition*/ -webkit-transition: All 0.3s ease; -moz-transition: All 0.3s ease; -o-transition: All 0.3s ease; -ms-transition: All 0.3s ease; transition: All 0.3s ease;} #logindivarea {width:220px;margin:auto;padding:30px;-webkit-border-radius: 10px;border-radius: 10px;-webkit-box-shadow: 0 0 15px 0 rgba(0,0,0,.3);box-shadow: 0 0 15px 0 rgba(0,0,0,.3);} #logindivarea .button {width:100%;text-align:center;padding:6px 0px;} .deskmenu a:hover, a.linkbutton:hover {color: #779e31 ;} .arrowdown {position:absolute;bottom:0px;left:50%;margin:auto 0 auto -30px;width:60px;display:block;height:36px;overflow:hidden;padding-top:5px;} a.navarrow {color:#739c28;position:absolute;bottom:40px;left:50%;margin:0 0 0 -15px;z-index:800;display:block;width:17px;padding:10px 7px;height:11px;text-decoration:none; border:solid #85b32f 1px;display:block;-webkit-border-radius: 99px;-moz-border-radius: 99px;border-radius: 99px;} a.navarrow div, a.navarrow span {display:block;margin-left:32px;margin-top:-15px;width:140px;} a.bottomnavarrow {margin:-16px auto -17px auto;position:relative;left:auto;bottom:auto;} a.navarrow:hover {background-color: #779e31;/* Old browsers */ } #social a {text-align:center;float:left;margin-left:10px;display:block;width:17px;padding:10px 10px;height:17px;text-decoration:none; border:solid #000 1px; color:#fff;display:block;-webkit-border-radius: 99px;-moz-border-radius: 99px;border-radius: 99px;color:#fff;background: #222222; /* Old browsers */ background-image: -webkit-linear-gradient(bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, .3)); background-image: -moz-linear-gradient(bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, .3)); background-image: -o-linear-gradient(bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, .3)); background-image: -ms-linear-gradient(bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, .3)); background-image: linear-gradient(bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, .3)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff ', endColorstr='#ffffff ',GradientType=0 ); /* IE6-9 */ /*Transition*/ -webkit-transition: All 0.3s ease; -moz-transition: All 0.3s ease; -o-transition: All 0.3s ease; -ms-transition: All 0.3s ease; transition: All 0.3s ease; } #social a#facebook:hover {background-color: #00429b ;} #social a#twitter:hover {background-color: #11c0df ;} #social a#google:hover {background-color: #db2602 ;} #siteMenu {text-align:center;font-size:13px;} #siteMenu li {padding-top:5px;} #siteMenu a {color:#999;} #siteMenu a:hover {color:#fff;} #siteMenu1 {float:left;text-align:left;margin-left:5%;} #siteMenu2 {float:right;text-align:right;margin-right:5%;} .clearthis:before, .clearthis:after {content: "";display: table;} .clearthis:after {clear: both;} .clearthis {zoom: 1; /* For IE 6/7 (trigger hasLayout) */} #mobile-header {display: block;float:right;margin-right:0px;margin-top:15px;margin-left:20px;} #mobile-header a {display:block;width:38px;height:51px;background:url(/images2013/menubutton.png) top left no-repeat;} #mobile-header a span {display:none;} #top {width:100%;position:fixed;z-index:999;height:62px;} #topinside {background:#222222;padding:22px 0px;} .fixedmenu #topinside {padding:8px 0px 8px 0;} #topgradient {background:url(/images2013/gradvert.png) top left repeat-x;height:10px;} #logoimage.fixedlogo {height:40px;width:auto;margin:3px 0px 5px 0;} .wrap {width:92%;padding:0 4%;} .fullwhite {background:#fff;padding:40px 0px 40px;} .fullwhite img {max-width:100%;height:auto;} .fullgreen {background:#333;padding:40px 0px 40px;color:#ccc} .fullgreen h2 {color:#fff;} .fullgreen h3 {color:#ccc;} .fullgrey {background:#f3f3f3;padding:40px 0px 40px;} .fullwhite.contactoncontact {padding-top:0px;} .textfull {text-align:left;} .imageleft {text-align:center;display:none;} .imageright {text-align:center;display:none;} .textright {text-align:left;} .textleft {margin-bottom:20px;text-align:left;} .logosright {background:#fff;padding:20px 0px 0px 0px;text-align:center;-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.25);-moz-box-shadow:0px 0px 8px rgba(0, 0, 0, 0.25);box-shadow:0px 0px 8px rgba(0, 0, 0, 0.25);border:solid #b8b8b8 1px;} .logosright div {margin-bottom:20px;} .mobileimageright {margin-top:30px;} .mobileimageright img, .imageright.contactir img {width: auto !important;max-width: 100%;height:auto;} .white {color:#fff;} p {margin:0 0 10px 0;} #headerareainside {background-color:#8fc224!important;position:relative;height:auto;text-align:center;} #headerareainside .wrap {background:url(/images2013/headerbordertop.png) top left repeat-x;height:100%;} #insideheadertext {margin:auto;} a.cta-phone {width:100px;-webkit-border-radius: 30px;-moz-border-radius: 30px;border-radius: 30px;display:block;text-decoration:none;font-weight:700;font-size:14px;padding:15px 20px 15px 40px;background:url(/images/icon-mobile20.png) 15px 50% no-repeat #eee;color:#333!important;height:20px;display:inline-block;margin:auto;} a.cta-linkedin {-webkit-border-radius: 30px;-moz-border-radius: 30px;border-radius: 30px;display:block;text-decoration:none;font-weight:700;font-size:14px;background:url(/images/icon-linkedin.png) 50% 50% no-repeat #2273a7;color:#fff!important;width:50px;height:50px;text-indent:-999px;overflow:hidden;display:inline-block;margin:auto;} a.cta-phone:hover {background-color:#ddd;} a.cta-linkedin:hover {background-color:#5097c5;} .cta-natasha {width:230px;display:inline-block;margin:auto;} .cta-natasha a.cta-phone {display:block;float:left;} .cta-natasha a.cta-linkedin {display:block;float:right;} #pagecover {position:fixed;width:100%;height:100%;background:#000;background:rgba(0,0,0,0.75);display:none;cursor:pointer;left:0px;top:0px;z-index:1001;} #navigationtop {position:absolute;width:100%;z-index:1003;} .flexnav, .flexnav ul {padding:0px;} /* ------------------Flexnav Base Styles---------------------- */ .flexnav {position: fixed;height:100%;padding:80px 0 0 0px;width: 250px;right:0px;top: 0px;background: #222;-webkit-box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.3);-moz-box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.3);box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.3);-webkit-transition: none;-moz-transition: none;-ms-transition: none;transition: none;-webkit-transform-style: preserve-3d;overflow-y:auto;margin: 0 auto;max-height: 0; } .flexnav::-webkit-scrollbar { width:0px;opacity:0 } .flexnav::-webkit-scrollbar-button { /* 2 */ } .flexnav::-webkit-scrollbar-track { /* 3 */ } .flexnav::-webkit-scrollbar-track-piece { /* 4 */ } .flexnav::-webkit-scrollbar-thumb { /* 5 */ } .flexnav::-webkit-scrollbar-corner { /* 6 */ } .flexnav::-webkit-resizer { /* 7 */ } .flexnav.opacity {opacity: 0; } .flexnav.flexnav-show {max-height: 2000px;opacity: 1;-webkit-transition: all .5s ease-in-out;-moz-transition: all .5s ease-in-out;-ms-transition: all .5s ease-in-out;transition: all .5s ease-in-out; } .flexnav.one-page {position: fixed;top: 50px;right: 5%;max-width: 200px; } .flexnav li {font-size: 100%;position: relative;overflow: hidden; } .flexnav li a {position: relative;display: block;padding: 10px 15px;z-index: 2;overflow: hidden;color: #fff;font-weight:700;font-size:14px;text-transform:uppercase;text-decoration:none;border-bottom: 1px solid rgba(0, 0, 0, 0.15); } .flexnav li ul {width: 100%; } .flexnav li ul li {font-size: 100%;position: relative;overflow: hidden; } .flexnav li ul.flexnav-show li {overflow: visible; } .flexnav li ul li a {padding-left:30px;display: block;background: #444; } .flexnav ul li ul li a {padding-left:45px;background: #777; } .flexnav ul li ul li ul li a {background: #ccc; } .flexnav .touch-button {position: absolute;z-index: 999;top: 0;right: 0;width: 50px;height: 43px;display: inline-block;background: #acaca1;background: rgba(0, 0, 0, 0.075);text-align: center; } .flexnav .touch-button:hover {cursor: pointer; } .flexnav .touch-button .navicon {position: relative;top: 13px;font-size: 12px;color: #666; } .menu-button {z-index:10;position:absolute;right:4%;top:18px;text-indent:-9999px;overflow:hidden;display: block;color: #fff;text-transform: uppercase;cursor: pointer;background: url(/images/menu.png) 100% 50% no-repeat;font-weight: 700;font-size: 14px;width:50px;height:50px;text-align: center;} .menucloser {height:50px;display: block;color: #fff;text-transform: uppercase;cursor: pointer;background: url(/images/menucloser.png) 94% 50% no-repeat;font-weight: 700;font-size: 14px;text-align: center;} .menu-button.one-page {position: fixed;top: 0;right: 5%;padding-right: 45px; } .menu-button .touch-button {display:none!important;background: transparent;position: absolute;z-index: 999;top: 0;left: 50%;margin-left:50px;width: 50px;height: 50px;display: inline-block;text-align: center; } .menu-button .touch-button .navicon {font-size: 16px;position: relative;top: 1em;color: #666;} /* ------------------END Flexnav Base Styles---------------------- */ #servicesmenu {position:absolute;bottom:0px;width:70%;left:50%;margin-left:-35%;} #servicesmenu a {text-align:center;padding:15px;display:block;color:#ffffff;text-decoration:none;font-size:20px; border:solid #85b32f 1px;color:#fff;} #servicesmenu a:hover {background-color: #779e31;color:#fff; } #servicesmenu a.active {cursor:default;display:block;color:#222222!important;text-decoration:none; color:#fff;background: #ffffff; /* Old browsers */ background-image: -webkit-linear-gradient(top, rgba(231, 232, 230, 1), rgba(231, 232, 230, 0)); background-image: -moz-linear-gradient(top, rgba(231, 232, 230, 1), rgba(231, 232, 230, 0)); background-image: -o-linear-gradient(top, rgba(231, 232, 230, 1), rgba(231, 232, 230, 0)); background-image: -ms-linear-gradient(top, rgba(231, 232, 230, 1), rgba(231, 232, 230, 0)); background-image: linear-gradient(top, rgba(231, 232, 230, 1), rgba(231, 232, 230, 0)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e7e8e6 ', endColorstr='#ffffff ',GradientType=0 ); /* IE6-9 */} #servicesmenu a.active:hover {color:#222222;} #headerarea, #headerareamobile {background-color:#ccc!important;position:relative;height:705px;} #headerarea .wrap, #headerareamobile .wrap {background:url(/images2013/headerbordertop.png) top left repeat-x;} #headerarea #homebox1 .wrap {background:none;} /* HOME BOXES : 1 */ #homebox1 {position:relative;padding-bottom:70px;} #headerarea a.navarrow {bottom:10px;} #contactpagebox1.fullwhite {padding-bottom:0px;} .homeboxinsideedge {background:#fff;position:relative;-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.25);-moz-box-shadow:0px 0px 8px rgba(0, 0, 0, 0.25);box-shadow:0px 0px 8px rgba(0, 0, 0, 0.25);border:solid #b8b8b8 1px;} .homebox1_1, .homebox1_2, .homebox1_3 {margin-bottom:20px;} .homebox1_icon1 {width:35px;height:54px;background:url(/images/icon-lightbulb.png) top left no-repeat;margin:20px auto;} .homebox1_icon2 {width:49px;height:54px;background:url(/images/icon-cart.png) top left no-repeat;margin:20px auto;} .homebox1_icon3 {width:32px;height:54px;background:url(/images/icon-mobile.png) top left no-repeat;margin:20px auto;} .homebox1_heading h2 {margin:0px 0 10px 0;padding:0px;color:#a1d04b;font-size:22px;} .homebox1_heading {text-align:center;padding:0px 6%;} .homebox1_content {text-align:center;padding:0px 6% 20px 6%;} /* HOME BOXES : 2 */ #homebox2 {background-color:#fff!important;position:relative;text-align:center;color:#333;} #homebox2 .wrap {padding:40px 0px 40px 0;} #homebox2_icons {margin-top:30px;} #homebox2_icons a {display:block;text-decoration:none;color:#333;text-align:center;float:left;} #homebox2_icons img {margin-top:22px;} a#homebox2_icon1 {width:15%;padding:0px 1%;} a#homebox2_icon1 img {margin-top:24px;} a#homebox2_icon2 {width:14%;padding:0px 1%;} a#homebox2_icon2 img {margin-top:20px;} a#homebox2_icon3 {width:14%;padding:0px 1%;} a#homebox2_icon3 img {margin-top:23px;} a#homebox2_icon4 {width:14%;padding:0px 1%;} a#homebox2_icon5 {width:14%;padding:0px 1%;} a#homebox2_icon6 {width:15%;padding:0px 1%;} a#homebox2_icon6 img {margin-top:27px;} .homebox2_iconbubble {display:block;-webkit-border-radius: 50px;-moz-border-radius: 50px;border-radius: 50px;background:#333;width:80px;margin:0 auto 10px auto;height:80px;} .growimage, .grow {position:relative;} /* HOME BOXES : 3 */ #homebox3 {position:relative;} .contactstrip {margin-top:-51px;z-index:900;position:relative;} .contactstrip a {display:block;width:100%;height:109px;background:url(/images2013/contactbutton.png) top center no-repeat;} .contactstrip a span {display:none;} /* HOME BOXES : 4 */ #homebox4 {position:relative;} #homebox4.fullwhite {padding:40px 0 100px 0;} .homebox4_icon1 {width:148px;height:22px;background:url(/images2013/icon-flow.jpg) top left no-repeat;margin:37px auto 38px auto;} .homebox4_icon2 {width:52px;height:51px;background:url(/images2013/icon-edit.jpg) top left no-repeat;margin:23px auto;} .homebox4_icon3 {width:52px;height:57px;background:url(/images2013/icon-grow.jpg) top left no-repeat;margin:20px auto;} /* HOME BOXES : 5 */ .contactbox1 {float:left;width:31%;margin-right:3%;} .contactboxcol2 {float:right;width:56%;} .contactbox2 {float:left;width:47%;margin-right:6%;} .contactbox3 {float:right;width:47%;} .contactphone {font-size:26px;line-height:150%;} .contactphone small {font-size:15px;} .contactemail {font-size:22px;} .contactemail a {text-decoration:none;color:#222222;} #homebox5 h2 {padding:0px;height:30px;margin:0px 0px 20px 0px;font-size:30px;} #homebox5 .input {width:95%;padding:7px 2%;margin-bottom:15px;} #homebox5 .textarea {height:104px;} /* BACK TO TOP STRIP */ #btt {background:#222222;} #bttlink {} a.btt_button {width:100px;text-align:center;display:block;margin:auto;padding:20px 0px 15px 0;text-decoration:none;text-transform:uppercase;color:#fff;font-weight:bold;font-size:12px;} /* PORTFOLIO PAGE */ #portfoliopage h2 {margin-bottom:15px;} .pitem {float:left;padding-right:100px;white-space:nowrap;} .pitemgroup {margin:25px 0px 0px 0;} .picon {background:#a1d04b;-webkit-border-radius: 500px;-moz-border-radius: 500px;border-radius: 500px;float:left;text-align:center;width:36px;height:36px;margin:-7px 10px 15px 0px;} .ptextleft, .ptextright {margin-bottom:20px;} .pimageright img, .pimageleft img, .pimagesplitleft img, .pimagesplitright img {width: auto !important;max-width: 100%;height:auto;} .testimonial {font-style:italic;color:#666;} .piconLogo, .piconCustom {margin-top:10px;} .piconWebsite, .piconSocial {margin-top:9px;} .piconCms, .piconSeo, .piconResponsive {margin-top:6px;} .pimagesplitleft {text-align:center;margin-bottom:20px;} .pimagesplitright {text-align:center;margin-bottom:20px;} /* 1 - 320: Portrait smartphones */ @media all and (min-width: 1px) { #headerareamobile {display:block;} #headerareainside {height:auto;} #insideheadertext {font-size:20px;padding-top:30px;padding-bottom:30px;} #insideheadertext.servicesheadertext {padding-bottom:180px;} .headerareainsidesml {height:auto!important;} .headerareainsidesml #insideheadertext {padding-top:40px;} #headerareainside #servicesmenu {width:90%;left:50%;margin-left:-45%;} #servicemenu li {} #servicesmenu a {padding:8px;font-size:16px;margin-bottom:6px; display:block;-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;} #servicesmenu {width:80%;left:50%;margin-left:-40%;} #headerarea {height: 320px!important;overflow: visible; margin-bottom: 560px;} #deskmenuplaceholder {height:92px;background:#000;} .deskmenu {display:none;} .sidr{display:none;position:absolute;position:fixed;top:0;height:100%;z-index:999999;width:260px;overflow-x:none;overflow-y:auto;font-size:15px;background:url(/images2013/shadowbgflip.png) top left repeat-y;color:#fff;margin-left:-7px;} .sidr .sidr-inner{padding:0px 0 0px;background:#333;height:100%;margin-left:7px;} .sidr .sidr-inner>p{margin-left:15px;margin-right:15px;} .sidr.right{left:auto;right:-260px} .sidr.left{left:-260px;right:auto} .sidr p{font-size:13px;margin:0px 0 12px} .sidr p a{color:rgba(255,255,255,0.9)} .sidr>p{margin-left:15px;margin-right:15px} .sidr ul{display:block;margin:0 0 15px;padding:0px 0 0 0;border-top:1px solid #1a1a1a;border-bottom:1px solid #4d4d4d} .sidr ul li{display:block;margin:0;line-height:48px;border-top:1px solid #4d4d4d;border-bottom:1px solid #1a1a1a} .sidr ul li:hover,.sidr ul li.active,.sidr ul li.sidr-class-active{border-top:none;line-height:49px} .sidr ul li:hover>a,.sidr ul li:hover>span,.sidr ul li.active>a,.sidr ul li.active>span,.sidr ul li.sidr-class-active>a,.sidr ul li.sidr-class-active>span{-webkit-box-shadow:inset 0 0 15px 3px #222;-moz-box-shadow:inset 0 0 15px 3px #222;box-shadow:inset 0 0 15px 3px #222} .sidr ul li a,.sidr ul li span{padding:0 15px;display:block;text-decoration:none;color:#fff} .sidr ul li ul{border-bottom:none;margin:0} .sidr ul li ul li{line-height:40px;font-size:13px} .sidr ul li ul li:last-child{border-bottom:none}.sidr ul li ul li:hover,.sidr ul li ul li.active,.sidr ul li ul li.sidr-class-active{border-top:none;line-height:41px} .sidr ul li ul li:hover>a,.sidr ul li ul li:hover>span,.sidr ul li ul li.active>a,.sidr ul li ul li.active>span,.sidr ul li ul li.sidr-class-active>a,.sidr ul li ul li.sidr-class-active>span{-webkit-box-shadow:inset 0 0 15px 3px #222;-moz-box-shadow:inset 0 0 15px 3px #222;box-shadow:inset 0 0 15px 3px #222} .sidr ul li ul li a,.sidr ul li ul li span{color:rgba(255,255,255,0.8);padding-left:30px} .sidr-class-responsivemenubuttonclose {display:block;width:23px;height:24px;background:url(/images2013/menuclose.png) top left no-repeat!important;position:absolute;top:10px;right:10px;} .sidr-class-responsivemenubuttonclose span {display:none;} .sequence-prev, .sequence-next {visibility:hidden;} #logo {float:left;} #social {margin:auto;width:100px;padding:8px 7px 8px 0px;} .homeboxinsideedge .linkbutton {margin:0px 20px 20px 20px;} .navarrow.notmobile {display:none;} /* HOME BOXES : 1 */ .homebox1_icon1, .homebox1_icon2, .homebox1_icon3, .homebox4_icon1, .homebox4_icon2, .homebox4_icon3 {display:none;} .homebox1_heading h2 {margin:20px 0 10px 0;} #homebox1.fullwhite {padding:20px 0 0px 0;} /* HOME BOXES : 2 */ #homebox2_icons {display:none;} #homebox2 .wrap {padding:40px 0px 40px 0;} #homebox2 h2 {font-size:20px;margin:0px 0px 20px 0px;} #homebox2 p {width:90%;margin-left:auto;margin-right:auto;} /* HOME BOXES : 4 */ #homebox4.fullwhite {padding:20px 0 0px 0;} /* HOME BOXES : 5 */ .contactbox1 {float:none;width:auto;margin:0;} .contactboxcol2 {float:none;width:auto;margin:0;padding:30px 0 0 0;} .contactbox2 {float:none;width:auto;margin:0;} .contactbox3 {float:none;width:auto;} } a.portitem img {width:100%;height:auto;} a.portitem {margin: 0 0 20px 0;} @media all and (min-width:360px) { #headerareainside {} #insideheadertext {font-size:30px;padding-top:30px;} #servicesmenu li {float:left;margin:0 1%;} #servicesmenu li.service1 {width:48%;} #servicesmenu li.service2 {width:48%;} #servicesmenu li.service3 {width:48%;} #servicesmenu li.service4 {width:48%;} #insideheadertext.servicesheadertext {padding-bottom:100px;} } /* 460 - 580: Landscape smartphones */ @media all and (min-width:460px) { #servicesmenu a { margin-bottom:0px; border-bottom:0px; display:block;-webkit-border-bottom-left-radius: 0px; -webkit-border-bottom-right-radius: 0px; -moz-border-radius-bottomleft: 0px; -moz-border-radius-bottomright: 0px; border-bottom-left-radius: 0px; border-bottom-right-radius: 0px; } #servicesmenu li {float:left;margin:0 1%;} #servicesmenu li.service1 {width:18%;} #servicesmenu li.service2 {width:38%;} #servicesmenu li.service3 {width:18%;} #servicesmenu li.service4 {width:18%;} #insideheadertext.servicesheadertext {padding-top:50px;padding-bottom:60px;} a.portitem {float: left;width: 45%;margin: 0 2.5% 20px 2.5%;} #headerarea {margin-bottom:490px;} /* HOME BOXES : 4 */ #homebox4.fullwhite {padding:20px 0 20px 0;} /* HOME BOXES : 5 */ .contactbox2 {float:left;width:47%;margin-right:6%;margin-left:0px;} .contactbox3 {float:right;width:47%;} #social {float:right;padding:8px 0px;margin-top:-48px;} #siteMenu {float:left;margin-top:-38px;text-align:left;padding-bottom:10px;} #siteMenu ul li ul {margin-left:0px;} #siteMenu1 {float:left;margin-right:40px;text-align:left;margin-left:0px;} #siteMenu2 {float:left;margin-right:30px;text-align:left;margin-right:0px;} #slogo-cfcms {} #slogo-magento, #slogo-wordpress, #slogo-drupal, #slogo-joomla {float:left;width:25%;} #slogo-magento {margin-top:-10px;} #slogo-wordpress {margin-top:-5px;} .imageleft {float:left;width:35%;display:block;margin-bottom:-40px;} .imageright {float:right;width:35%;display:block;margin-bottom:-40px;} .imageright.contactir {float:none;width:auto;margin-bottom:0px;} .textright {float:right;width:60%;margin-left:5%;text-align:left;} .imageleft img, .imageright img, .mobileimageright img {width: auto !important; /*override the width below*/ max-width: 100%;height:auto;} .textfull {text-align:center;} .mobileimageright {width:70%;margin-left:auto;margin-right:auto;} #servicesWebsite1 .navarrow, #about1 .navarrow {margin-left:0;position:auto;left:auto;bottom:auto;} /* PORTFOLIO PAGE */ #homebox5.fullgrey, #homebox5.fullwhite {padding-bottom:40px;} } /* 580 - 780: Portrait Ipad */ @media all and (min-width:580px) { #headerareainside {} #headerareainside #servicesmenu {width:90%;left:50%;margin-left:-45%;} #insideheadertext {font-size:46px;padding-top:100px;} #servicesmenu a {padding:10px;font-size:18px;} .halftextleft {float:left;width:50%;text-align:center;} .halftextright {float:right;width:50%;text-align:center;} #insideheadertext.servicesheadertext {padding-top:50px;padding-bottom:70px;} #headerareamobile {display:none;} #headerarea {display:block;} .navarrow.notmobile {display:block;} .textleft.contactir {width:50%;float:left;text-align:left;} .imageright.contactir {width:45%;float:right;} .pimagesplitleft {float:left;width:48%;text-align:left;margin-bottom:40px;} .pimagesplitright {float:right;width:48%;text-align:right;margin-bottom:40px;} a.portitem {float: left;width: 30%;margin: 0 1.5% 40px 1.5%;} a.portitem img {position:relative;-webkit-transition: All 0.3s ease; -moz-transition: All 0.3s ease; -o-transition: All 0.3s ease; -ms-transition: All 0.3s ease; transition: All 0.3s ease;} a.portitem:hover img {margin-top:-10px;margin-bottom:10px;} /* HOME BOXES : 1 */ #homebox1 .homeboxinsideedge { height:430px;} #homebox1 .homeboxinsideedge.mobileheight { height:490px;} #homebox1.fullwhite {padding:20px 0 20px 0;} .homebox1_heading h2 {margin:0px 0 10px 0;font-size:22px;height:auto;} .homebox1_icon1, .homebox1_icon2, .homebox1_icon3, .homebox4_icon1, .homebox4_icon2, .homebox4_icon3 {display:block;} #homebox1 .homebox1_1 {width:33%;float:left;} #homebox1 .homebox1_2 {width:34%;float:left;} #homebox1 .homebox1_3 {width:33%;float:right;} #homebox1 .homebox1_1 .homeboxinsideedge {margin-right:6%;} #homebox1 .homebox1_2 .homeboxinsideedge {margin:0 3%;} #homebox1 .homebox1_3 .homeboxinsideedge {margin-left:6%;} #homebox1 .homebox1_1, #homebox1 .homebox1_2, #homebox1 .homebox1_3 {margin-bottom:0px;} /* HOME BOXES : 2 */ #homebox2 .wrap {padding:70px 0px 70px 0;} #homebox2 .notdesktop {margin-top:40px;} #homebox2 h2 {font-size:40px;margin-bottom:30px;} /* HOME BOXES : 4 */ #homebox4.fullwhite {padding:40px 0 70px 0;} } @media all and (min-width:630px) { /* HOME BOXES : 1 */ #homebox1 .homeboxinsideedge { height:440px;} #homebox1 .homeboxinsideedge.mobileheight { height:430px;} } @media all and (min-width:710px) { /* HOME BOXES : 1 */ #homebox1 .homeboxinsideedge { height:320px;} #homebox1 .homeboxinsideedge.mobileheight { height:350px;} } /* 780 - 960: Landscape IPad and Small Desktop Browser */ @media all and (min-width:780px) { #headerarea {height: 470px!important;overflow: visible; margin-bottom: 240px;} #headerareainside #servicesmenu {width:80%;left:50%;margin-left:-40%;} #servicesmenu a {padding:15px;font-size:20px;} #insideheadertext.servicesheadertext {padding-top:50px;padding-bottom:90px;} .textfull {width:70%;margin:auto;} .textleft {float:left;width:58%;margin-right:5%;margin-bottom:0px;text-align:left;} .textleft.contactir {width:50%;} .imageright.contactir {width:45%;} .logosright {padding:20px 0px 0px 0px;float:right;width:35%;} .mobiletextleft {float:left;width:43%;margin-right:5%;margin-bottom:0px;text-align:left;} .mobileimageright {float:right;width:50%;margin-top:-150px;} .responsive1 .textleft {width:55%;} #slogo-cfcms {} #slogo-magento, #slogo-wordpress, #slogo-drupal, #slogo-joomla {float:none;width:auto;margin-top:0px;} #logo {float:left;} /* HOME BOXES : 1 */ #homebox1 .homeboxinsideedge { height:300px;} #homebox1 .homeboxinsideedge.mobileheight { height:330px;} /* HOME BOXES : 2 */ #homebox2_icons {display:block;} #homebox2 .linkbutton {display:none;} #homebox2 p {width:60%;} /* HOME BOXES : 4 */ #homebox4 .homeboxinsideedge { height:410px;} #homebox4 .homeboxinsideedge.mobileheight { height:410px;} #homebox4 .homebox1_1 {width:33%;float:left;} #homebox4 .homebox1_2 {width:34%;float:left;} #homebox4 .homebox1_3 {width:33%;float:right;} #homebox4 .homebox1_1 .homeboxinsideedge {margin-right:6%;} #homebox4 .homebox1_2 .homeboxinsideedge {margin:0 3%;} #homebox4 .homebox1_3 .homeboxinsideedge {margin-left:6%;} #homebox4 .homebox1_1, #homebox4 .homebox1_2, #homebox4 .homebox1_3 {margin-bottom:0px;} /* HOME BOXES : 5 */ .contactbox1 {float:left;width:31%;margin-right:3%;} .contactboxcol2 {float:right;width:66%;padding-top:0px;} .contactbox2 {float:left;width:47%;margin-right:6%;margin-left:0px;} .contactbox3 {float:right;width:47%;} /* SERVICES PAGE */ /* PORTFOLIO PAGE */ .ptextleft {margin-bottom:0px;float:left;width:35%;} .ptextright {margin-bottom:0px;float:right;width:35%;} .pimageright {float:right;width:60%;} .pimageleft {float:left;width:60%;} .pimageright img, .pimageleft img {width: auto !important;max-width: 100%;height:auto;} .pitem {float:none;} } /* 820: Desktop Full Size*/ @media all and (min-width: 850px) { #mobile-header {display: none;} .deskmenu {display:block;float:right;margin-top:10px;} .fixedmenu2 .deskmenu{margin-top:14px;} .deskmenu ul {margin:0px;padding:0px;list-style-type:none;} .deskmenu li {float:left;margin-left:7px;} #navigationtop { position: fixed;right: 4%;width: auto;top: 18px;} #navigationtop.fixed {top:4px;} /* ------------------Flexnav FULLSIZE---------------------- */ body.one-page {padding-top: 70px; } .flexnav {padding-top:0px;background:none;width:100%;top:0px;position:relative;overflow: visible; } .flexnav.opacity {opacity: 1; } .flexnav.one-page {top: 0;right: auto;max-width: 1080px; } .flexnav li {position: relative;list-style: none;float: left;display: block;overflow: visible; } .flexnav li a {border-bottom: none;color:#fff;text-transform:uppercase;font-weight:700;padding:16px 14px 24px 14px; font-size:13px;} .flexnav li.last a {padding-right:0px;} .flexnav li.menuitem1 a {padding-left:0px;} .flexnav li ul {width:220px;} .flexnav li a:hover {color:#ccc;} .flexnav li > ul {border-top:solid #a1d04b 3px;display:none;position: absolute;top: auto;left: 0; } .flexnav li > ul li {width: 100%; } .flexnav li ul li > ul {margin-left: 100%;top: 0; } .flexnav li ul li a {padding: 10px 16px;} .flexnav li ul li ul li a {background:#197ebf;border-bottom: solid #3193d2 1px; text-transform: none;font-weight: 400;padding: 10px 16px;} .flexnav li ul.open {display: block;opacity: 1;visibility: visible;z-index: 1; } .flexnav li ul.open li {overflow: visible;max-height: 100px; } .flexnav li ul.open ul.open {margin-left: 100%;top: 0; } .flexnav .touch-button {display:none!important;} .menu-button {display: none; } .oldie body.one-page {padding-top: 70px; } .oldie .flexnav {overflow: visible; } .oldie .flexnav.one-page {top: 0;right: auto;max-width: 1080px; } .oldie .flexnav li {position: relative;list-style: none;float: left;display: block;background-color: #a6a6a2;width: 20%;min-height: 50px;overflow: visible; } .oldie .flexnav li:hover > ul {display: block;width: 100%;overflow: visible; } .oldie .flexnav li:hover > ul li {width: 100%;float: none; } .oldie .flexnav li a {border-left: 1px solid #acaca1;border-bottom: none;overflow: visible; } .oldie .flexnav li > ul {background: #acaca1;position: absolute;top: auto;left: 0;display: none;z-index: 1;overflow: visible; } .oldie .flexnav li ul li ul {top: 0; } .oldie .flexnav li ul li a {border-bottom: none; } .oldie .flexnav li ul.open {display: block;width: 100%;overflow: visible; } .oldie .flexnav li ul.open li {width: 100%; } .oldie .flexnav li ul.open ul.open {margin-left: 100%;top: 0;display: block;width: 100%;overflow: visible; } .oldie .flexnav ul li:hover ul {margin-left: 100%;top: 0; } .oldie .menu-button {display: none; } .oldie.ie7 .flexnav li {width: 19.9%; } /* ------------------END Flexnav FULLSIZE---------------------- */ } } /* 880: Desktop Full Size*/ @media all and (min-width: 880px) { /* HOME BOXES : 4 */ #homebox4 .homeboxinsideedge { height:390px;} #homebox4 .homeboxinsideedge.mobileheight { height:390px;} } @media all and (min-width: 960px) { /* HOME BOXES : 1 */ #homebox1 .homeboxinsideedge { height:320px;} #homebox1 .homeboxinsideedge.mobileheight { height:330px;} #homebox4 .homeboxinsideedge.mobileheight { height:420px;} } /* 1000-1290: Desktop Full Size*/ @media all and (min-width: 1000px) { #homebox1 {z-index:10;} #headerarea {height: auto!important;overflow: visible; margin-bottom: 0;} #headerarea a.navarrow {color:#fff;background:#fff;border:solid #333 1px;} #headerareainside #servicesmenu {} .homeboxinsideedge {background:rgba(255,255,255,0.9);} #headerareagradient {opacity:0.5;display:block;background:url(/images/gradbottom.png) bottom left repeat-x;width:100%;height:100px;bottom:0px;left:0px;position:absolute;z-index:1;} .wrap, #headerarea .wrap, #headerareamobile .wrap {width:84%;padding:0 8%;margin:auto;} .sequence-prev, .sequence-next {visibility:visible;} .title, .subtitle {padding-left:0%;} } @media all and (min-width: 1080px) { #homebox1 .homeboxinsideedge { height:290px;} } /* 1290+: Desktop Full Size*/ @media all and (min-width: 1290px) { #headerareainside #servicesmenu {width:800px;left:50%;margin-left:-400px;} #headerareainside {} #insideheadertext {font-size:46px;padding-top:30px;} .wrap, #headerarea .wrap, #headerareamobile .wrap {width:1100px;padding:0px;margin:auto;} #navigationtop { right: 50%; margin-right: -550px;} .textfull {width:60%;} #homebox1 .homeboxinsideedge.mobileheight {border:solid red 1px;background:#da0000;} /* HOME BOXES : 4 */ #homebox4 .homeboxinsideedge { height:350px;} }