/****************************************************************** Theme Name: Fenton Theme URI: http://www.fenton.com/ Description: Fenton website Author: Fenton Author URI: http://www.fenton.com License: WTFPL License URI: http://sam.zoy.org/wtfpl/ ******************************************************************/ body{margin:0;font-family:"Titillium Web","Lucida Grande","Arial",sans-serif;font-size:14px;line-height:24px;color:#ffffff;background-color:#4b4b4b;} a{color:#FF9933;text-decoration:none;} a:hover,a:focus{color:#fff;text-decoration:none;} .navbar-fixed-top,.navbar-fixed-bottom{position:fixed;right:0;left:0;z-index:1030;margin-bottom:0;top:0;} h1 {font-size: 25px;} h2 {font-size: 22px;} h1, h2, h3 {line-height: 34px;font-family:"Titillium Web","Lucida Grande","Arial",sans-serif;} body {padding: 98px 20px 40px;} .container{position: relative;z-index: 10;} .page-template-post_dynamic-php h1 {margin-top:0 !important;} .navbar .container{min-height: 170px; background: url("img/bkg_mobile_header.png") no-repeat right bottom transparent;z-index: 9999;} .backgroundsize .navbar .container{background-image: url("img/Fenton-Header-Dark-mobile.png"); background-size: 1170px 800px; } .nav-collapse .nav{text-transform: uppercase; font-size: 18px;text-transform: uppercase; font-style: italic; font-weight: 600;letter-spacing: 1px;} .nav-collapse .nav ul.dropdown-menu {font-size: 14px;font-style: italic; font-weight: 600;} .navbar .nav .dropdown-toggle .caret{margin-left: 8px;} .logo{display: block; height: 70px; margin-top: 35px; width: 210px; text-indent: -9999em; position: absolute; right: 10px;} .flex-caption h4{font-size: 22px;font-style: italic;font-weight: normal;line-height: 27px;margin: 0;padding-left: 15px; text-indent: 0;} .flex-caption h4 .client{font-style: normal; font-size: 17px; text-transform: uppercase; font-weight: normal; font-family:"Titillium Web","Lucida Grande","Arial",sans-serif;} .flex-control-nav {text-align: left; margin-top: 15px !important;} .ipost{cursor: pointer;} .ipost img {width: 100%;margin-top: 20px;} .item-title, .item-exerpt{width: 100%; bottom: 0px; background: rgb(113, 114, 113); background: rgba(113, 114, 113,0.8); font-size: 17px; line-height: 19px;} .homepage .item-title, .page-template-page_works-php .item-title, .page-template-post_dynamic-php .item-title, .page-template-post_studio-php .item-title, .page-template-post_blog-php .item-title{visibility: visible !important; display: block !important; position: absolute;} .homepage .span4:hover, .page-template-page_works-php .ipost.span3:hover, .page-template-post_dynamic-php .ipost.span3:hover, .page-template-post_studio-php .ipost.span3:hover, .page-template-post_blog-php .ipost.span2:hover{opacity: 0.6; filter:alpha(opacity=60);} .item-exerpt{display: none; position: absolute;} .item-exerpt h2 a{color: #fff;} .item-exerpt h2 a:hover{color: #ccc;} .item-title div, .item-exerpt div{padding: 10px;} .icon-article{background: url("img/icon-article.png") no-repeat center center transparent; width:24px; height: 24px; float: right; margin-right: 5px;} .isotope .span4:hover .item-title, .isotope .span2:hover .item-title{display: block !important; position: absolute;} .isotope .span8 .item-exerpt{display: block;} .isotope .span8 .item-title{display: none !important;} .ipost img.image {margin-top: 9px;} .isotope,.isotope .item {-webkit-transition-duration: 0.8s;-moz-transition-duration: 0.8s;-ms-transition-duration: 0.8s;-o-transition-duration: 0.8s;transition-duration: 0.8s;} .isotope {-webkit-transition-property: height, width;-moz-transition-property: height, width;-ms-transition-property: height, width;-o-transition-property: height, width;transition-property: height, width;} .isotope .item {-webkit-transition-property: -webkit-transform, opacity;-moz-transition-property:-moz-transform, opacity;-ms-transition-property:-ms-transform, opacity;-o-transition-property: top, left, opacity;transition-property: transform, opacity;} .mq {-webkit-transition: width 0.001ms;-moz-transition: width 0.001ms;-o-transition: width 0.001ms;transition: width 0.001ms;width: 0;} .breadcrumbs{color: #afb1b4; padding-top: 0px; position: relative;font-size: 16px;line-height: 35px;font-family: "Titillium Web","Lucida Grande","Arial",sans-serif;font-style: italic;text-transform: lowercase; text-align: right;} .breadcrumbs a, .breadcrumbs a:hover{color: #999;} .breadcrumbs .current{color: #fff; padding-left: 10px;} .breadcrumbs .menu-item{display: none;} .breadcrumbs .current-menu-parent, .breadcrumbs .current-menu-item {display: inline;} .breadcrumbs .current-menu-parent ul{float: right;} .breadcrumbs .menu-menu-container{display: inline;} .wp-prev-next{margin-top: 15px;} .prev-link a, .next-link a, .prev-link a:hover, .next-link a:hover{text-transform: uppercase; font-weight: bold; color: #fff;} /* BLOG POST */ .post-title, .studio-roll .works-content h1{text-transform: lowercase;} .blog-post-wrap, .team-post-wrap{position: relative;} .content-wrap img.attachment-bones-masonry{width: 100%; height: auto !important;} #blog-sidebar{border-top: 1px solid #FFFFFF;margin-top: 30px;padding-top: 30px;} .row-sidebar{margin-left: -15px;} #blog-sidebar .item{margin-left: 5px; margin-bottom: 5px; float: left; position: relative;} #blog-sidebar .item:hover .item-title{display: block !important; } #blog-sidebar .item .item-title{font-size: 11px; font-weight: bold; position: absolute;line-height: 13px; } #blog-sidebar .item .item-title a{color: #fff;} .post-date{margin-bottom: 15px; font-size: 12px;} .related-posts{display: none; margin-top: 30px; padding-top: 30px; border-top: 1px solid #fff;} .related-posts h3{margin: 0px 0px 15px 10px;} .related-item{width: 18%; float: left; margin-left: 2%; font-size: 11px; line-height: 13px;} .related-item img{width: 100% !important; height: auto !important;} .related-item p{margin: 10px 0;} .related-item a{color: #fff;} /* SHARE LINKS*/ .taf{margin-left: -10px;margin-top:15px;} .share-btn{width: 19px; height: 18px; background: url("img/share_sprite.png") no-repeat 0 0 transparent; margin-left: 10px; float: left;} .fb-btn{background-position: 0 0;} .tw-btn{background-position: -20px 0px;} /* TEAM PAGE and Careers page */ #team-accordion .filter-header{cursor: pointer;color: #dddddd;} #team-accordion .accordion-group, .jobs .accordion-group{border: none;} #team-accordion .accordion-heading .accordion-toggle, .jobs .accordion-heading .accordion-toggle{padding: 0px; color: #dddddd;} .jobs .accordion-heading .accordion-toggle{font-size: 16px line-height: 24px; color: #fff;} #team-accordion .accordion-inner, .jobs .accordion-inner{border: none; padding:0px;} .jobs .accordion-inner{padding: 5px 20px 40px 20px;} #team-accordion .accordion-inner ul {margin: 0 0 10px 10px; list-style:none;} #team-accordion .accordion-inner ul a:hover, .jobs .accordion-inner ul a:hover{color: #dddddd;} .jobs .accordion-inner ul{margin: 0 0 10px 30px; list-style: disc outside none;} #team-accordion span.divider, .jobs span.divider{color:#FF9933;} #alphabetical li{float: left; } #alphabetical li a{display: block; padding: 0px 10px 0px 0px;} footer.page-footer{position: relative; background: url("img/bkg_footer2.jpg") no-repeat right top rgb(55,55,55); margin-top: 30px; overflow: hidden; min-height: 300px;} .footer-links{padding: 110px 20px 0;} .footer-links h4{font-size: 18px; line-height: 28px; color: #999; margin: 0 0 35px;} .row-fluid .footer-links span9{margin-left:0;} .footer-links ul{margin:0; list-style: none;} .row-fluid .span20{width: 30%; float: left; margin-bottom: 20px;} .page-contact .inner-page .span20{width: 100%; float: none;} .page-contact h4.subtitle {font-family: "Titillium Web","Lucida Grande","Arial",sans-serif;font-style: italic; text-transform: lowercase;} .page-template-page_team-php h2{font-size: 28px; line-height: 34px; } #cat-search{margin-top: 0px;} .accordion .typeahead {z-index: 9;} .accordion .typeahead li{left: 0px; margin-bottom: 0; background: #404545;} .filter-header{text-transform: uppercase;} .accordion .selected, .accordion .selected a{color: #FF9933 !important;} .accordion-inner li a.selected {color:#dddddd !important;} .vid-wrapper{position: relative;} #people .item{cursor: pointer; float:left;} #people .item img{margin: 0px;} #people .item .item-title{position: absolute; font-size: 14px; font-weight: 600;} #people .item .item-exerpt{position: relative;} #people .span8, #people .span2{margin:0px;} #people #iposts .span2{width:100px;} #people .span2:hover img{filter: url("data:image/svg+xml;utf8,#grayscale"); filter: gray; -webkit-filter: grayscale(100%); -o-filter: grayscale(100%); transition: all .6s ease; -webkit-transition: all .6s ease; -webkit-backface-visibility: hidden; cursor: pointer;} #people .item:hover .item-title, #people .span8 .item-exerpt{display: block !important;} #people .span8:hover .item-title{display: none !important;} #people .taf{padding: 10px 0px;} #people .taf .share-btn{padding:0px;} #people .taf .fb-btn{background-position: 0 -18px;} #people .taf .tw-btn{background-position: -20px -18px;} #people .taf .in-btn{background-position: 0 -36px;} #people .taf .pin-btn{background-position: 0 -54px;} #people .taf .lin-btn{background-position: -20px -54px;} .page-clients .inner-page .span3 h4{font-family: "Titillium Web","Lucida Grande","Arial",sans-serif; font-size: 22px; line-height: 27px; font-style: normal;} .page-clients .span3 ul{margin-left: 15px; list-style: disc outside none;} .page-clients .span3 li{line-height: 24px;} h2.biocontent {margin-bottom:5px !important;} h4.biocontent {margin-top:0 !important;} /*************ACTIVE IDEA*****************/ .page-active-idea, .page-active-idea .cancel-diagonal{background: #000;} .page-active-idea .navbar .container{ background: url("img/bkg_mobile_header_blk.png") no-repeat scroll right bottom transparent;} .backgroundsize .page-active-idea .navbar .container{background-image: url("img/Fenton-Header-Activeidea-mobile.png"); background-size: 1170px 800px; } .inner-page{position: relative;} .page-active-idea-selected .inner-page, .page-active-idea .inner-page{height: 600px;} .page-active-idea .inner-page .page-title, .page-active-idea-selected .inner-page .page-title{display: none;} .page-active-idea footer.page-footer {background: url("img/bkg_footer2-activeidea.png") no-repeat scroll right top rgb(55,55,55);} .active-idea{display: none; z-index: 99;} .display{display: block; -webkit-animation: smallToBig 30ms ease; -moz-animation: smallToBig 30ms ease;-ms-animation: smallToBig 30ms ease;} .idea{z-index: 98;} .idea, .active-idea{cursor: pointer; position: absolute; width: 100%; top: 0; left: 0px;text-align: center;} @-webkit-keyframes smallToBig{ from {-webkit-transform: scale(0.1);} to {-webkit-transform: scale(1);} } @-moz-keyframes smallToBig{ from {-moz-transform: scale(0.1);} to {-moz-transform: scale(1);} } @-ms-keyframes smallToBig{ from {-ms-transform: scale(0.1);} to {-ms-transform: scale(1);} } @-webkit-keyframes bigToSmall{ from {-webkit-transform: scale(1);} to {-webkit-transform: scale(0.7);} } @-moz-keyframes bigToSmall{ from {-moz-transform: scale(1);} to {-moz-transform: scale(0.7);} } @-ms-keyframes bigToSmall{ from {-ms-transform: scale(1);} to {-ms-transform: scale(0.7);} } /********** WORKS *********/ /********* DYNAMIC *********/ #team-accordion{padding: 20px 0px 0px 5px;} .fluid-width-video-wrapper{} #homepage .fluid-width-video-wrapper{padding-top: 50% !IMPORTANT;} .work-feature{position: relative;} .work-feature div, .vid-play-btn{position: absolute; left:0; top: 0; width: 100%; height: 100%; background: url("img/play-white.png") no-repeat center center transparent; } .work-feature div:hover, .vid-play-btn:hover{background: url("img/play-orange.png") no-repeat center center transparent; } #works .span8, #works .span3, #dynamic .span8, #dynamic .span3{margin-bottom: 30px;} #works .works-content, #dynamic .works-content{display:none;} #works .span8 .works-content, #dynamic .span8 .works-content, #works .span3:hover .item-title, #dynamic .span3:hover .item-title{display: block !important;} #works .span3:hover .item-title, #dynamic .span3:hover .item-title{position: absolute;} #works .span8 .work-feature, #dynamic .span8 .work-feature{display: none;} .works-content .pad20{background: #373737;} #works .ipost img{margin:0;} .works-content h5{font-family: "Titillium Web","Lucida Grande","Arial",sans-serif; font-size: 16px; line-height: 20px; font-style: normal; font-weight: bold;} .works-content .close, .service-content .close{background: url("img/share_sprite.png") no-repeat scroll 0 -76px transparent; height: 25px; margin-right: 10px;margin-top: 10px; width: 25px;position: relative;z-index: 999;} .close{opacity: 1; filter:alpha(opacity=100);} .works_thumb{margin-bottom: 20px;} .page-work .close, .page-fenton-studios .close{margin: -5px -5px 0px 0px;} .single-works .post-title {line-height: 26px !important;padding-top:10px;} /*************THOUGHT LEADERS*************/ .subtitle, .bigger-subtitle{font-family: "Titillium Web","Lucida Grande","Arial",sans-serif; font-size: 15px; line-height: 20px; font-style: normal; font-weight: bold; text-transform: uppercase; text-align: left;} .bigger-subtitle{font-size: 22px; line-height: 22px;} h2.bigger-subtitle{font-size: 31px; line-height: 38px;} .nametext{margin-top: 30px; font-size: 15px;line-height: 15px;font-family: "Titillium Web","Lucida Grande","Arial",sans-serif;font-style: italic;} .titletext{font-size: 14px; line-height: 15px;font-weight: normal;} .thought-leader{padding: 6px 10px; background: #FF9933; color: #fff; margin-bottom: 10px;line-height: 20px;} .thought-leader a{color: #fff;} .thought-leader a:hover{opacity: 0.5; filter:alpha(opacity=50);} /**************************************/ .dark .subtitle{margin-top: 6px;} #dynContent .span3{background: #373737;} #dynContent .span5{background: #888988;} .page-template-post_dynamic-php .works-content .dark{position: absolute; bottom: 0px; right: 0px; left: 0px; background: none repeat scroll 0px 0px rgb(113, 114, 113); background: none repeat scroll 0px 0px rgba(113, 114, 113, 0.8);} .additionalclients img {margin-bottom:20px;} .additionalclients a:hover img {opacity: .5; filter:alpha(opacity=50);} /***************SERVICES***************************/ .service-content h4{padding: 0px 40px 0px 0px;} .service, .service-content{margin-bottom: 30px;} .service-content .dark{cursor: default;} .corner-stamp{min-height: 240px; margin-bottom: 30px;} .services .outerContainer{display: table;width:100%; height: 100px; overflow: hidden;background-color: #c18248; background-color: rgba(250, 141, 41, 0.59); cursor:pointer;} .services .outerContainer:hover{background-color: #FF9933;} .services .outerContainer .innerContainer{display: table-cell;vertical-align: middle;width: 100%;margin: 0 auto;text-align: center;} .services .outerContainer .innerContainer .element a{text-decoration: none;padding: 0px 10px;display: block;} .services .outerContainer:Hover .innerContainer .nametext{font-size: 24px; line-height: 32px; -webkit-animation: smallToBig 400ms ease; -moz-animation: smallToBig 400ms ease;-ms-animation: smallToBig 400ms ease;} .lt-ie8 .services .outerContainer{position: relative;} .lt-ie8 .services .outerContainer .innerContainer{position: absolute;top: 50%;} .lt-ie8 .services .outerContainer .innerContainer .element{position: relative;top: -50%;} .case-study img, .case-study h4{margin: 0px !important;} .case-study h4.subtitle .normal, h4.subtitle .normal{font-weight: normal;} .case-study h4.subtitle a, .case-study h4.subtitle a:hover{color: #fff;} .span3 .service-content, .span6 .service{display: none;} .span6 .service-content, .span3 .service{display: block;} .innerContainer .nametext{margin-top:0px;} .corner-stamp{cursor: default;} .ipost img.service-icon{width: auto; display: block; margin: 0px auto 15px;-webkit-animation: bigToSmall 400ms ease; -moz-animation: bigToSmall 400ms ease;-ms-animation: bigToSmall 400ms ease;} .services .outerContainer:Hover .innerContainer img.service-icon{ -webkit-transform: scale(0.7); /* Saf3.1+, Chrome */ -moz-transform: scale(0.7); /* FF3.5+ */ -ms-transform: scale(0.7); /* IE9 */ -o-transform: scale(0.7); /* Opera 10.5+ */ transform: scale(0.7); -ms-transform: scale(0.7); /* IE8+ - must be on one line, unfortunately */ -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.7, M12=0, M21=0, M22=0.7, SizingMethod='auto expand')"; /* IE6 and 7 */ filter: progid:DXImageTransform.Microsoft.Matrix( M11=0.7, M12=0, M21=0, M22=0.7, SizingMethod='auto expand'); } #iposts.services .isotope-item{min-height: 120px;} /**************************/ #dynamic .span3:hover {opacity: 0.8 !important; filter: alpha(opacity=80) !important;} /*****************PROGRESS ACCELERATED******************/ #post-77 .span12 {background: url('http://fenton.progressaccelerated.com/wp-content/uploads/pa-bg.jpg') no-repeat center top;} #post-77 .span7 {margin:20px 10px 120px 20px;} #post-77 h2 {font-family:"Titillium Web","Lucida Grande","Arial",sans-serif;font-style:normal;} /****************TEAMS PAGE ********/ #teams_sidebar .widget_text{margin-bottom: 10px; position: relative;} #teams_sidebar .widget_text img{width: 100%;} .pic-title{display:none; background: none repeat scroll 0 0 rgb(113, 114, 113); background: none repeat scroll 0 0 rgba(113, 114, 113, 0.8);bottom: 0; left: 0; margin: 0;padding: 5px 0; position: absolute; right: 0; text-indent: 20px;} #teams_sidebar .widget_text:hover .pic-title{display:block;} /****************** ELEVATOR PAGE **************************/ .skrollable {position:fixed;z-index:100;} .skrollable .skrollable {position:static;} .skrollable .skrollable .skrollable {position:static;} .elevator-headers{height: 40px; position: relative !important;} .elevator-headers h4{position: absolute !important; top:0; left: 0px;} #progress, #intro, #easing_wrapper{top: 200px;} #progress{width: 100px;} #intro {text-align: center;-webkit-transform-origin: 0 0;-moz-transform-origin: 0 0;-ms-transform-origin: 0 0;-o-transform-origin: 0 0;transform-origin: 0 0;-webkit-border-radius: 1em;-moz-border-radius: 1em;border-radius: 1em;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;top: 200px;margin-left: 130px;} #intro .bigger-subtitle,#easing_wrapper .bigger-subtitle {text-align: center; font-size: 26px; font-weight: normal; line-height: 40px; color: #FF9933; background: #4b4b4b;} #intro .bigger-subtitle, #easing_wrapper .drop .bigger-subtitle{font-size: 20px; text-align: left;} #easing_wrapper .drop .bigger-subtitle{text-align: center;} #intro .arrows {font-size: 2em;color: #09f;} #easing_wrapper {top: 200px;margin-left: 130px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;} #easing {top: 10%;z-index: 101;} .drop {background: #4b4b4b; text-transform: lowercase;} .drop .text-center{margin-top: 30px;} .flrs{font-size: 12px;font-weight: bold; height: 65px; line-height: 1em;/*padding: 20px 10px 0; */text-align: center; width: 65px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px;margin-bottom: 10px; background: #373737; border: 3px solid #aaa;} .flrs a{display: block; padding: 20px 10px 0; height: 45px;} .flrs:hover{opacity: 0.5; filter:alpha(opacity=50);} .office-location{height: 450px;} .office-location img{position: absolute !important; top:0; } /*******************FOOTER***********************/ .footer-links ul li{font-size: 13px; line-height: 25px; font-weight: 700;text-transform: uppercase;} .footer-links ul li ul li{font-size: 13px; line-height: 20px; font-weight: 400;text-transform: none;} .footer-bottom{padding: 20px; border-top: 1px solid #676868;} .footer-bottom form{margin-bottom:0px;} .footer-bottom .span3{font-size:13px; line-height:20px;} .footer-bottom li.span20{text-transform:uppercase;} .footer-bottom input[type="text"]{background: #737373; color: #fff; border-color: #444;} .copyright{font-size: 13px; line-height: 20px; color: #999999;} .footer-links .contact-icon{min-height: 30px;padding-left: 25px; background: url("img/contact_icons.png") no-repeat 0 5px transparent;} .footer-links .fb-icon{background-position: 0 -73px;} .footer-links .em-icon{background-position: 0 5px;} .footer-links .tw-icon{background-position: 0 -115px;} .footer-links .tel-icon{background-position: 0 -33px;} /* Landscape phones and down */ @media (max-width: 480px) { .row-fluid .span20{width: 47%; float: left; margin-bottom: 20px;} .footer-links{padding: 50px 20px 20px;} .page-contact .inner-page .span20{width: 100%; float: none;} } @media (min-width: 480px) { } /* Landscape phone to portrait tablet */ @media (max-width: 767px) { .nav-collapse.in.collapse{margin: 0px 20px 175px; background: none repeat scroll 0 0 #404545;} .flexslider{margin-bottom: 30px !important;} .flex-control-nav.flex-control-paging{position: absolute; bottom: -40px; left: 10px;} .flex-direction-nav .flex-disabled {opacity: .3!important; filter:alpha(opacity=30) !important; cursor: default;} .services .isotope .item {position: static ! important;-webkit-transform: translate(0px, 0px) !important;-moz-transform: translate(0px, 0px) ! important;transform: translate(0px, 0px) ! important;} #blog-sidebar .item{width: 200px;} #works .span3, #dynamic .span3 {width: 100%;} #progress, #intro, #easing_wrapper{top: 150px;} #progress{display: none;} #intro, #easing_wrapper{margin-left: 0px;} #easing_wrapper h3{font-size: 18.5px; line-height: 25px;} #easing_wrapper h4{font-size: 12.5px; line-height: 25px;} .row-fluid .controls-row [class*="span"] + [class*="span"]{ margin-left: 0;} .footer-bottom .span3{font-size:13px;} .row-fluid .footer-bottom .controls-row .span9, .row-fluid .footer-bottom .controls-row .span3{margin-left: 0px; margin-bottom:5px;} .footer-links{padding: 80px 20px 20px;} } @media (min-width: 768px) { .navbar .container{height: 198px;} .nav-collapse.collapse{position: absolute; bottom: 32%;} .navbar .nav > li > a{padding: 0 12px;} .dropdown-menu li{background: none repeat scroll 0 0 #FF9933; margin-bottom: 3px;} .dropdown-menu li{position: relative; left:-999px} .diagonal{height: 50px;position: fixed;top: 60px;left: -5px;width: 100%;z-index: -2; background: #FF9933; } /*.nav-collapse.collapse*/ .navbar-inner .container .nav-collapse, .diagonal{-moz-transform: skewY(-4.8deg);-o-transform: skewY(-4.8deg);-webkit-transform: skewY(-4.8deg);transform: skewY(-4.8deg);-ms-transform: skewY(-4.8deg);} .cancel-diagonal{height: 1000px;position: fixed;top:0px;width: 50%;z-index: -1;right: 0px;background: #4b4b4b;} .page-active-idea, .page-active-idea .cancel-diagonal{background: #000;} .related-posts{display: block;} #blog-sidebar{border-top: none;margin-top: 0px;padding-top: 0px;} #people #iposts .span8 {width: 400px;} .services .span3 {width: 160px;} .services .outerContainer{height: 160px;} #iposts.services .isotope-item.corner-stamp, .service-content .dark{min-height: 160px;} .case-study{/*position: absolute;*/ margin-top: 60px;} .office_imgs{display: block;} .page-contact .inner-page .span20{width: 23%; float: left;} .flex-control-nav {left: 10px; position: absolute; bottom:10px; text-align: center; margin:0px !important;} .flex-caption h4{float: left; padding-left: 180px;text-transform: lowercase;} } /* Portrait tablet to landscape and desktop */ @media (min-width: 768px) and (max-width: 979px) { #iposts .span2 {width: 220px;} #iposts .span4 {width: 350px;} #iposts .span8 {width: 724px;} #people #iposts .span8 {width: 400px;} .diagonal{top: 64px;} .nav-collapse.collapse{bottom: 40%;} .breadcrumbs{padding-top: 30px;} #blog-sidebar .item{width: 105px;} #works .span3, #dynamic .span3{width: 140px;} #works .studio-roll .span3 {width: 160px;} #dynamic .span3 {width: 220px;} #works .span8,#dynamic .span8 {width: 460px;} #works .studio-roll .span8 {width: 520px;} #works .dynamic-roll .span8, #dynamic .span8 {width: 476px;} .services .span3 {width: 160px;} .services .outerContainer{height: 160px;} #iposts.services .isotope-item.corner-stamp{min-height: 160px;} .service-content .dark{min-height: 320px;} .services .span6 {width: 340px;} .footer-links{padding: 100px 20px 20px;} #easing_wrapper {width: 64%;} } /* Large desktop */ @media (min-width: 980px) { .navbar .container{background: url("img/bkg_header.png") no-repeat right bottom transparent; height: 198px; z-index: 9999;} .backgroundsize .navbar .container{background-image: url("img/Fenton-Header-Dark.png"); background-size: 1170px 800px; } .page-active-idea .navbar .container{ background: url("img/bkg_header_blk.png") no-repeat scroll right bottom transparent;} .backgroundsize .page-active-idea .navbar .container{background-image: url("img/Fenton-Header-Activeidea.png"); background-size: 1170px 800px; } .diagonal{top: 73px;} .nav-collapse.collapse{bottom: 33%;} .breadcrumbs{padding-top: 45px; } .row-fluid .span20{width: 17.4%; float: left;} #blog-sidebar .item{width: 143px;} #works .span3 {width: 190px;} #works .studio-roll .span3 {width: 210px;} #works .dynamic-roll .span3, #dynamic .span3 {width: 300px;} #works .span8 {width: 612px;} #works .studio-roll .span8 {width: 685px;} #works .dynamic-roll .span8, #dynamic .span8 {width: 620px;} #people #iposts .span8 {width: 400px;} .services .span3 {width: 220px;} .services .outerContainer{height: 220px;} #iposts.services .isotope-item.corner-stamp{min-height: 220px;} .service-content .dark{min-height: 440px;} .services .span6 {width: 460px;} .service, .service-content, .corner-stamp{margin-bottom: 20px;} #easing_wrapper {width: 72%;} } @media (min-width: 1200px) { #iposts .span2 {width: 170px;} #iposts .span4 {width: 270px;} #iposts .span8 {width: 570px;} #works #iposts .span8 {width: 490px;} #works #iposts.studio-roll .span8 {width: 545px;} #works #iposts.dynamic-roll .span8, #dynamic .span8{width: 770px;} #people #iposts .span8 {width: 400px;} .diagonal{top: 83px;} .ie9 .diagonal{top: 83px;} .nav-collapse.collapse{bottom: 22%;} .breadcrumbs{padding-top: 60px;margin-bottom: 10px;} #blog-sidebar .item{width: 180px;} #works .span3{width: 230px;} #works .studio-roll .span3{width: 260px;} #works .dynamic-roll .span3, #dynamic .span3{width: 370px;} .services .span3 {width: 270px;} .services .outerContainer{height: 270px;} #iposts.services .isotope-item.corner-stamp{min-height: 270px;} .service-content .dark{min-height: 350px;} .services .span6 {width: 570px;} .service, .service-content, .corner-stamp{margin-bottom: 30px;} #easing_wrapper {width: 82%;} } /*********************** SLIDER ****************************/ .flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus {outline: none;} .slides, .flex-control-nav, .flex-direction-nav {margin: 0; padding: 0; list-style: none;} /* FlexSlider Necessary Styles *********************************/ .flexslider {margin: 0; padding: 0;} .flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */ .flexslider .slides img {width: 100%; display: block;} .flex-pauseplay span {text-transform: capitalize;} /* Clearfix for the .slides element */ .slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} html[xmlns] .slides {display: block;} * html .slides {height: 1%;} /* No JavaScript Fallback */ /* If you are not using another script, such as Modernizr, make sure you * include js that eliminates this class on page load */ .no-js .slides > li:first-child {display: block;} /* FlexSlider Default Theme *********************************/ .flexslider {margin: 0 0 10px; background: transparent; position: relative; zoom: 1;} .flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;} .loading .flex-viewport {max-height: 300px;} .flexslider .slides {zoom: 1;} .carousel li {margin-right: 5px} /* Direction Nav */ .flex-direction-nav {*height: 0;} .flex-direction-nav a {width: 30px; height: 30px; margin: -20px 0 0; display: block; background: url("img/bg_direction_nav.png") no-repeat 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 0; filter:alpha(opacity=1); -webkit-transition: all .3s ease;} .flex-direction-nav .flex-next {background-position: 100% 0; right: -36px; } .flex-direction-nav .flex-prev {left: -36px;} .flexslider:hover .flex-next {opacity: 0.8; filter:alpha(opacity=80); right: 5px;} .flexslider:hover .flex-prev {opacity: 0.8; filter:alpha(opacity=80); left: 5px;} .flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {opacity: 1; filter:alpha(opacity=100);} .flex-direction-nav .flex-prev {opacity: 1; filter:alpha(opacity=100); left: 0;} .flex-direction-nav .flex-next {opacity: 1; filter:alpha(opacity=100); right: 0;} /* Control Nav */ .flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;} .flex-control-paging li a {width: 11px; height: 11px; display: block; border: 1px solid #FF9933; cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; } .flex-control-paging li a:hover { background: #FF9933; background: rgba(250,141,41,0.6);} .flex-control-paging li a.flex-active { background: #FF9933; cursor: default; } .flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;} .flex-control-thumbs li {width: 25%; float: left; margin: 0;} .flex-control-thumbs img {width: 100%; display: block; opacity: .7; filter:alpha(opacity=70); cursor: pointer;} .flex-control-thumbs img:hover {opacity: 1; filter:alpha(opacity=100);} .flex-control-thumbs .flex-active {opacity: 1; filter:alpha(opacity=100); cursor: default;} .flex-caption{padding: 10px 0; text-indent: 10px; background: #373737; margin: 0px;} /* ========================================================================== Helper classes ========================================================================== */ .ir {display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; width: 100%; height: 100%; *text-indent: -9999px;} .ir:before {content: ""; display: block; width: 0; height: 100%;} .ir br {display: none;} .relative{position: relative;} .orange{color: #FF9933 !important;} .page-fenton-studios h2.bigger-subtitle {margin-top:0 !important;} .page-fenton-studios h1 {margin-bottom:0 !important;} .pad20{padding: 20px ;} .pad10{padding:10px;} .pad5{padding: 0px 0px 0px 5px;} .dark{padding: 10px; background: #373737;} .light{padding: 10px; background: #888988;} .ipost.light{padding: 0px} .aligncenter{text-align: center;} /**************IE STYLES******************/ .lt-ie9 .navbar .container{height: 198px;} .lt-ie9 .navbar-inner .container .nav-collapse{position: absolute; bottom: 32%;font-size: 20px;text-transform: uppercase; z-index: 999; background: transparent;} .lt-ie9 .navbar-inner .container .nav-collapse li{margin-right: 5px;} .lt-ie9 .navbar .nav > li > a{padding: 0 15px;} .lt-ie9 .dropdown-menu li{background: none repeat scroll 0 0 #FF9933; margin-bottom: 3px;} .lt-ie9 .dropdown-menu li{position: relative; left:-999px} .lt-ie9 #menu-item-32{top: 5px;} .lt-ie9 #menu-item-33{top: 0px;} .lt-ie9 #menu-item-34{margin-top: -15px;} .lt-ie9 .diagonal{height: 49.8px;position: fixed;top: 73px;right: 50%;width: 100%;z-index: -2; background: #FF9933; } .lt-ie9 .cancel-diagonal{height: 1000px;position: fixed;top:0px;width: 50%;z-index: -1;right: 0px;background: #4b4b4b;} .lt-ie9 .page-active-idea, .lt-ie9 .page-active-idea .cancel-diagonal{background: #000;} .lt-ie9 .related-posts{display: block;} .lt-ie9 #blog-sidebar{border-top: none;margin-top: 0px;padding-top: 0px;} .lt-ie9 .case-study{/*position: absolute;*/ margin-top: 120px;} .lt-ie9 .office_imgs{display: block;} .lt-ie9 .page-contact .inner-page .span20{width: 17.4%; float: left;} .lt-ie9 .flex-control-nav {left: 10px; position: absolute; bottom:10px; text-align: center; margin:0px !important;} .lt-ie9 .flex-caption h4{float: left; padding-left: 140px;text-transform: lowercase;} .lt-ie9 .navbar .container{background: url("img/bkg_header.png") no-repeat right bottom transparent; height: 198px; z-index: 9999;} .lt-ie9 .page-active-idea .navbar .container{ background: url("img/bkg_header_blk.png") no-repeat scroll right bottom transparent;} .lt-ie9 .navbar-inner .container .nav-collapse{} .lt-ie9 .breadcrumbs{padding-top: 30px;} .lt-ie9 .row-fluid .span20{width: 17.4%; float: left;} .lt-ie9 #blog-sidebar .item{width: 143px;} .lt-ie9 #works .span3 {width: 190px;} .lt-ie9 #works .studio-roll .span3 {width: 210px;} .lt-ie9 #works .dynamic-roll .span3, .lt-ie9 #dynamic .dynamic-roll .span3 {width: 300px;} .lt-ie9 #works .span8 {width: 612px;} .lt-ie9 #works .studio-roll .span8 {width: 685px;} .lt-ie9 #works .dynamic-roll .span8 {width: 620px;} .lt-ie9 #people #iposts .span8 {width: 400px;} .lt-ie9 .services .span3 {width: 220px;} .lt-ie9 .services .outerContainer{height: 220px;} .lt-ie9 .corner-stamp{min-height: 220px;} .lt-ie9 .service-content .dark{min-height: 440px;} .lt-ie9 .services .span6 {width: 460px;} .lt-ie9 .service, .lt-ie9 .service-content, .lt-ie9 .corner-stamp{margin-bottom: 20px;} .lt-ie9 #easing_wrapper {width: 72%;} /*.lt-ie9 .navbar-inner .container .nav-collapse,*/ .lt-ie9 .diagonal, .lt-ie9 .navbar-inner li{ -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=0, M21=-0.08397234616948197, M22=1, SizingMethod='auto expand')"; filter: progid:DXImageTransform.Microsoft.Matrix( M11=1, M12=0, M21=-0.08397234616948197, M22=1, SizingMethod='auto expand'); background: #FF9933; } p.wp-caption-text {font-size:12px;line-height: 120%;margin-top:5px;} .alignright {float:right;margin:10px 0 10px 10px;} .alignleft {float:left; margin: 10px 10px 10px 0;} /* custom CSS for Timeline page */ .vco-storyjs {font-family:"Titillium Web","Lucida Grande","Arial",sans-serif !important;} .vco-storyjs {background-color:#4b4b4b !important;} .vco-storyjs .vco-feature p{color:#ffffff !important;} .vco-timeline .vco-navigation .timenav-background {background-color:#646564 !important;} .timenav-interval-background {background-color:#4b4b4b !important;} .vco-timeline .vco-navigation {border-top-color:#4b4c4b !important;} .vco-navigation {border-left-color:#4b4c4b !important;} .vco-timeline .time-interval {color:#ffffff !important;} .vco-storyjs h3 {font-family: "Titillium Web","Lucida Grande","Arial",sans-serif; color:#fff !important; font-style:italic !important;} .vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .caption {color: #ffffff !important;} .vco-storyjs p {font-family:"Titillium Web","Lucida Grande","Arial",sans-serif; color:#fff !important;} .vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .caption {color: #ffffff !important;} .vco-timeline .vco-navigation .timenav .time .time-interval {color:#ffffff !important;} .vco-timeline .vco-navigation .timenav .content .marker.active .flag .flag-content h3, .vco-timeline .vco-navigation .timenav .content .marker.active .flag-small .flag-content h3 {color: #FF9933 !important;} .timenav-line {background-color: #FF9933 !important;} .vco-timeline .dot {background: #FF9933 !important;} .vco-timeline .flag-content h3 {color: #666666 !important;} .vco-slider .box-shadow -webkit-box-shadow .media-image .media-shadow {0 15px 10px #333 !important;} .vco-timeline .time-interval {color: #4b4c4b !important;} .vco-timeline p {font-family:"Titillium Web","Lucida Grande","Arial",sans-serif !important; color:#fff !important;} .vco-slider .slider-item .content .content-container .media .media-wrapper .media-container .media-image img {border:0px solid !important;} .tp-button.orange, .tp-button:hover.orange, .purchase.orange, .purchase:hover.orange {background-color:#FF9933 !important; -webkit-box-shadow:0px 3px 0px 0px #e67300 !important; box-shadow:0px 3px 0px 0px #e67300 !important;} .tp-button orange small {font-family:"Titillium Web","Lucida Grande","Arial",sans-serif; color:#fffff !important;} .tp-caption a {color:#fff !important; text-decoration:none !important;} h3 {color: #FF9933 !important; text-transform:uppercase; font-family:"Titillium Web","Lucida Grande","Arial",sans-serif !important; font-style: normal; font-size:18px; font-weight:200;} .tp-caption {white-space: normal !important;} .home .item-exerpt h2 {display:none !important;} .home_slides a:hover, .item-text a:hover {color: #FF9933 !important;} .powered-by-jobadder a {display: none !important;} #ja-jobs-widget .ja-apply-iframe #logo img {display: none !important;} .ja-job-list h2.title a {font-style: normal;color:#FF9933;} .ja-job-details a.back-link {display: block;margin-bottom: 20px;} #form-wrapper {background-color: #4b4b4b !important;color: #ffffff !important;} #form-wrapper form h1 {color: #ffffff !important;} #ja-jobs-widget .ja-apply-iframe iframe body {padding-top: 0 !important;} #ja-jobs-widget p.date-posted {display: none;} @media (max-width: 767px) { .wp-caption {width:100% !important;} .alignright, .alignleft {margin:10px 0 10px 0;} .textwidget h4 {font-family: "Titillium Web","Lucida Grande","Arial",sans-serif !important;} }