/* Theme Name: The A-Theme Description: This theme was built using all best practice from Potter & Web Ltd. Version: 3.1 Author: Potter & Web Ltd Author URI: http://potterandweb.com */ /*//////////- HTML5 tags-//////////*/ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; } audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; } audio:not([controls]) { display: none; } [hidden] { display: none; } /*//////////- Reset -//////////*/ abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}blockquote{margin:1em 40px}dfn{font-style:italic}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}ins{background:#ff9;color:#000;text-decoration:none}mark{background:#ff0;color:#000;font-style:italic;font-weight:700}pre,code,kbd,samp{font-family:monospace, serif;_font-family:'courier new', monospace;font-size:1em}pre{white-space:pre-wrap;word-wrap:break-word}q{quotes:none}q:before,q:after{content:none}small{font-size:85%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}ul,ol{margin:1em 0;padding:0 0 0 40px}dd{margin:0 0 0 40px}nav ul,nav ol{list-style:none;list-style-image:none;margin:0;padding:0}img{border:0;-ms-interpolation-mode:bicubic;vertical-align:middle}svg:not(:root){overflow:hidden}fieldset{border:0;margin:0;padding:0}label{cursor:pointer}legend{border:0;margin-left:-7px;white-space:normal;padding:0}button,input,select,textarea{font-size:100%;vertical-align:middle;margin:0}button,input{line-height:normal}button,input[type=button],input[type=reset],input[type=submit]{cursor:pointer;-webkit-appearance:button;overflow:visible}button[disabled],input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;width:13px;height:13px;padding:0}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top;resize:vertical}input:invalid,textarea:invalid{background-color:#f0dddd}table{border-collapse:collapse;border-spacing:0}td{vertical-align:top}.chromeframe{background:#ccc;color:#000;margin:.2em 0;padding:.2em 0}figure,form{margin:0} /*//////////- Base -//////////*/ html { height: 100%; font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; overflow-y:scroll; behavior: url(/PIE.htc); } html, button, input, select, textarea { font-family: 'Karla', sans-serif; color: #999; } body { height: 100%; margin: 0; font-size: 1em; line-height: 1.4; background-image: url(../img/site/wallpaper_10px.jpg); background-color: #eee} ::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; } ::selection { background: #fe57a1; color: #fff; text-shadow: none; } a { color: grey; text-decoration: none; transition: color 0.4s ease;} a:visited { color: #999; } a:hover { color: #bbb; } a:active { color: black;} a:hover, a:active { outline: 0; } img{max-width: 100%; height: auto; width: auto\9;} div,section,article,aside,nav,footer,header,ul,li {box-sizing: border-box;} /*//////////- Extras -//////////*/ #browsehappy{background-color:#f1f1f1;color:#000; width:100%; height:60px; padding:20px 10px;font-size:11px; text-align: center;} /* ////////////////////////////////// CUSTOM ///////////////////////////////////*/ /* type */ p{font-size:15px; text-align: justify;} li{font-size:14px;} h1, h2, h3, h4{margin:2px 0px 5px 0px; padding:0px 0px 0px 0px; font-family: 'Karla', sans-serif; color: #fff; font-weight: bold; text-transform: uppercase; text-align: left;} h1{font-size:46px;} h2{font-size:40px; line-height: 30px;} h3{font-size:20px;} h4{font-size:14px;} /* main blocks */ #head, #navigation, #isomobnav, #stage, #foot{margin:0px auto;padding:10px;border:0px solid #000;} #head, #stage {max-width: 1920px; } #foot {padding: 20px 50px;} #head{height:auto; padding: 0 50px; height: 161px;} #navigation{padding: 0;} #stage{height:auto; min-height: 400px; padding: 5px 50px; } #foot{height:auto;} /* wraps */ #head_wrap,#nav_wrap,#stage_wrap,#foot_wrap, #dropdown{width:100%; text-align: center; } #head_wrap{ background-color: #fff} #nav_wrap{height:auto; float: left; padding: 0; margin:80px 0 0 25px; list-style: none; text-align: left; width: auto;} #search_wrap{background-color: #aaa;height:auto; } #stage_wrap{ height:auto; min-height: 400px; background-color: #eee; position: relative;} #foot_wrap{background-color: #fff;height:auto; min-height: 60px; clear: both; text-align: left; position: relative;} /* grid widths*/ .one, .two, .four, .eight{padding:5px 5px 5px 5px; float:left; text-align: left;} /* header */ #logo{width:450px; float:left; background-color: #fff;height:auto; min-height:80px; text-align: center; padding: 20px 0; margin-left: -3px;} #logo a {display: block; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; transition: opacity ease 0.4s;} #logo a:hover {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; filter: alpha(opacity=40); opacity: 0.4;} #social_media_block{border:0px solid black; float: left; height:30px;width:100%; margin: -5px 0 30px 0;} .social_media_icon{float:left; height:40px; width:40px; padding:10px; background-color: #bbb; margin-right:1px; border-radius: 40px; margin-right: 10px; transition: background-color ease 0.4s; } .social_media_icon:hover {background-color: #ccc} .social_media_icon img {display: block;} .mobiletoggle {display: none; width:60px; height:60px; background-color: white; position:absolute; top: 0; right: 0; padding:20px 10px; margin-left: 1px;} #menutoggle img{width: 50px; height: 50px; margin-top: 5px; } #menutoggle img:hover {cursor: pointer;} #search_box{height:40px; float:right;text-align: left; padding:0px; display:none; } #search_icon{height:40px; width:40px; float:right; background-color: #fff; margin-right:1px; padding:10px;} #search_box input[type=search]{box-sizing: border-box; border:0px solid black; background-color: #333; outline: none;padding:12px; color:#fff; font-size: 12px;height:40px;float:left; display:block;} #search_box input[type=submit]{box-sizing: border-box; border:0px solid black; background-color: #333; outline: none;padding:12px; color:#fff; font-size: 12px; width:80px; height:40px;float:left; display:block; border-left: 1px solid #eee;} #search_box input[type=search]{width: 396px;} /* navigation */ #navigation {float:left;} #main_navigation{width:200px; float:left; border:1px solid red; } #navigation li{display:block; float: left; font-family: 'Karla', sans-serif; text-transform: uppercase; margin-right: 15px} #navigation li a {color: #999;} #navigation li a:hover {color: #666;} #navigation li.current-menu-item a {color: #000;} #navigation ul{padding:0px; margin: 0;} #isonav {display: none; padding: 0 0 0 20px; } .home #isonav, .category-portfolios #isonav {display: block; clear: both; float: left;} #isonav ul {padding: 0; margin: 0;} #isonav ul li {list-style-type: none; text-align: left; float: left; display: block; margin-right: 3px; text-transform: capitalize; padding: 5px; /* background-color: #eee; border-radius: 3px; */} #isonav a {color: #999;} #isonav a:hover {color: #666;} #isonav a.current {color: #000;} #mobilenav {display: none;} #mobilewrap #mobilenav li{padding: 10px 0; border-top: 1px solid white; background-color: #737477;} #mobilewrap #mobilenav li:first-child {border-top: 0px solid white;} #mobilewrap #mobilenav li:last-child {} #mobilewrap #mobilenav li:hover {background-color: #ccc} #mobilewrap #mobilenav li:hover a{color: #000;} #mobilewrap #mobilenav li.current-menu-item {background-color: #ccc;} #mobilewrap #mobilenav li.current-menu-item a{color: #000;} #mobilewrap #mobilenav li a{color: white; text-align: center; display: block; text-transform: uppercase;} #isomobnav {display: none; margin-top: 0px; padding: 10px 20px 5px; border-top: 1px solid #eee; background-color: #fff} #isomobnav ul {padding: 0; margin: 0;} #isomobnav ul li {list-style-type: none; text-align: left; float: left; display: block; text-transform: capitalize; padding: 5px; margin: 0 3px 3px 0; background-color: #eee; border-radius: 3px;} #isomobnav a {color: #999;} #isomobnav a:hover {color: #666;} #isomobnav li.current a{color: #000;} /* sticky footer */ #wrapper {min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -75px; } #push {height: 75px; clear: both; } /* footer */ .home #foot_wrap, .archive #foot_wrap {display: none;} #foot p, #foot small {font-size: 11px;} #foot p {margin: 2px 0 0 0;} #foot_wrap { padding-bottom:10px; } #foot_wrap .footer_social_media { display: none; width: 210px; padding-left: 10px; margin:0 auto 0; padding-bottom:20px; } #tag{ position: absolute; z-index: 100; height: 25px; width: 50px; padding-left: 24px; left: -22px; top: 27px; background-color: rgba(155,155,155,1); border-radius: 5px; z-index: 600; transition: left 0.4s ease; } #tag:hover{ left:-10px; } #tag:active{ left:-10px; } /* #social_media_block{ border:0px solid black; float: none; position: absolute; top: 0; right: 60px; height:40px; width:200px; margin: 0; } */ #social_media_block{ border:0px solid black; right: 60px; height:40px; width:auto; margin: -5px 0 0 0; } .social_media_icon{ float:left; height:30px; width:30px; padding:6px; background-color: #ccc; margin-right:1px; border-radius: 40px; margin:0 0 0 5px; transition: background-color ease 0.4s; } #foot .social_media_icon:hover {background-color: #ddd} #foot .social_media_icon img {display: block;} #scrolltop {width: 70px; margin: 20px auto 0; text-align: center; position: fixed; bottom: 10px; right: 10px; z-index: 1000; } #scrolltop a {display: block; padding: 20px 0; background-color: #ddd; text-transform: uppercase; transition: background-color 0.4s ease; border-radius: 10px;} #scrolltop a:hover {background-color: #888; text-transform: uppercase;} #scrolltop a img {width:30px; height: 30px;} /* ////////////////////////////////// PAGES ///////////////////////////////////*/ /*home*/ .home #head, .home #head #logo, .home #head #nav_wrap {display: block;} .home #head #logo, .home #head #nav_wrap {display: none;} #loading {display: none;} .home #loading, .archive #loading { display: block; font-size: 50px; left: 50%; margin-left: -28px; position: absolute; top: 50%; } .no-js #loading { display: none; } @-webkit-keyframes opacity { 0% { opacity: 1; } 100% { opacity: 0; } } @-moz-keyframes opacity { 0% { opacity: 1; } 100% { opacity: 0; } } #loading span { -webkit-animation-name: opacity; -webkit-animation-duration: 1s; -webkit-animation-iteration-count: infinite; -moz-animation-name: opacity; -moz-animation-duration: 1s; -moz-animation-iteration-count: infinite; } #loading span:nth-child(2) { -webkit-animation-delay: 100ms; -moz-animation-delay: 100ms; } #loading span:nth-child(3) { -webkit-animation-delay: 300ms; -moz-animation-delay: 300ms; } /* work */ .home #stage,.archive #stage {padding: 45px 50px} .photo {width: 280px; height: 350px; margin: 0 10px 10px 0; background-color: #fff; overflow:hidden; color: #fff} #isotopegallery {display: none;} #isotopegallery .landscape {width: 280px; height: 170px;} #isotopegallery .square {width: 280px; height: 280px;} .photo img { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; transition: opacity ease 0.4s; /* color: #fff; */ border: none; outline: none; border-style: none;} .photo a {display: block; } .photo:hover img{-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter: alpha(opacity=80); opacity: 0.8;} .photo img:-webkit-loading {visibility: hidden;} /* archive work sitemap */ .archive h2 {padding: 0px 0 20px 0;} /* single work */ .single .post {padding: 40px 0;} #single_image {float: left; width: 450px} #single_text {float: left; width: 425px; padding-left: 20px} #single_text h2 {margin-bottom: 18px} #single_text h3 {color: #999} #single_text p {margin: 5px 0;} #single_text span a {display: block; text-align: left; margin-top: 20px; font-size: 14px;} /* clients & bio */ #clients_list { padding:40px 0} #clients_text_wrap {width: 50%;} .clients_text {width: 33.3%; float: left; text-align: left;} .clients_text ul {padding: 0;} .clients_text ul li {list-style: none; text-transform: uppercase; font-size: 18px;} #bio {padding: 0 0 40px 0; margin-bottom: 10px;} #bio_text {width: 50%; text-align: left;} /*links*/ #links_list { padding:40px 0} #links_list h2 { margin-bottom: 25px} .links_item {width: 23%; float: left; margin: 0 2% 2% 0; background-color: #ccc; transition: opacity ease 0.4s} .links_item:hover {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter: alpha(opacity=80); opacity: 0.8;} #links_list.show_five #links_item_six, #links_list.show_five #links_item_seven, #links_list.show_five #links_item_eight, #links_list.show_five #links_item_nine, #links_list.show_five #links_item_ten {display: none;} #links_list.show_six #links_item_seven, #links_list.show_six #links_item_eight, #links_list.show_six #links_item_nine, #links_list.show_six #links_item_ten {display: none;} #links_list.show_seven #links_item_eight, #links_list.show_seven #links_item_nine, #links_list.show_seven #links_item_ten {display: none;} #links_list.show_eight #links_item_nine, #links_list.show_eight #links_item_ten {display: none;} #links_list.show_nine #links_item_ten {display: none;} /* contact */ #studio_section { padding:40px 0; width: 450px; float: left;} #studio_text {width: 80%; margin: 0;} #studio_text p {text-transform: uppercase; font-size: 18px; } #contact_section { padding:40px 0 40px 22px; width: 425px; float: left;} #contact_text {width: 100%; margin: 20px 0 0;} #contact_text p {text-transform: uppercase; font-size: 18px; } #booking_text {width: 80%; margin: 0;} #booking_text p {text-transform: uppercase; font-size: 18px;} #contact_text input[type=email], #contact_text input[type=text] {height:40px; width:100%; padding:10px; background-color: #fff; border:0px solid grey; box-sizing: border-box; background-image: url('img/site/wallpaper_1.jpg');margin:2px; font-size: 12px; color: #999;} #contact_text input[type=submit] {height:40px; width:100%; padding:10px; text-transform: uppercase; font-size: 14px; color: #ccc; text-shadow: 0px 1px 0px #fff; background-color: #fff; border:0px solid grey; box-sizing: border-box;margin:2px; background-image: url('img/site/wallpaper_2.jpg'); border-left:1px dotted #ccc;} #contact_text input[type=email]:focus, input[type=text]:focus, .page-template-contactmobtemp-php #contact_text textarea:focus{background-image: url('img/site/texture_3.png'); outline: 2px solid black;color:#000;} #contact_text textarea{height:160px; width:100%; padding:10px; font-size: 12px; background-color: #fff; border:0px solid grey; box-sizing: border-box; background-image: url('img/site/wallpaper_1.jpg');margin:2px;} #contact_text #follow{height:60px;padding:20px 0;width:165px; float:left; display:block;box-sizing: border-box;} #contact_text .follow_btn{box-sizing: border-box;float:left; height:20px; width:20px; border:0px solid lime;margin:0 5px 0 0; font-size: 8px;} #contact_text ::-moz-selection { background: #0f8884; color: #fff; text-shadow: none; } #contact_text ::selection { background: #0f8884; color: #fff; text-shadow: none; } #contact_text a { color: #555; text-decoration: none;} #contact_text a:visited { color: #555; } #contact_text a:hover { color: #0cbeb9; } #contact_text a:active { color: #555;} #contact_text a:hover, a:active { outline: 0; } #contact_text img{max-width: 100%; height: auto; width: auto\9;} #contact_text div,section,article,aside,nav,footer,header,ul {box-sizing: border-box;} #contact_text hr{margin:5px 0px 5px 0px; padding:0px;} #contact_text p{font-size:15px;color: #555;} #contact_text li{font-size:15px;color: #555; } #contact_text h1, h2, h3, h4{margin:2px 0px 0px 0px; padding:0px 0px 0px 0px; } #contact_text h1{font-size:28px; line-height: 28px; margin-top:15px; color: #000; text-transform: uppercase; font-weight: 400;} #contact_text h2{font-size:24px;color:#555;padding:0px 0px 0px 0px;} #contact_text h3{font-size:14px;} #contact_text h4{font-size:12px;color: #000; text-transform: lowercase;} /* cookie policy */ .general-post {padding: 40px 0;} /* sitemap */ .page-template-temp-sitemap-page-php h2 {padding: 40px 0 20px 0;} .page-template-temp-sitemap-page-php h3 {color: #999} .page-template-temp-sitemap-page-php #stage ul li {text-align: left;} #sitemap_main{width: 450px; float: left; padding-bottom: 40px} #sitemap_pf {width: 450px; float: left; padding-left: 20px; padding-bottom: 40px} #sitemap_ts {width: auto; float: left; padding-bottom: 40px;} /* ////////////////////////////////// PLUGINS ///////////////////////////////////*/ /**** Isotope Filtering ****/ .isotope-item { z-index: 2; } .isotope-hidden.isotope-item { pointer-events: none; z-index: 1; } /**** Isotope CSS3 transitions ****/ .isotope, .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 .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; -ms-transition-property: -ms-transform, opacity; -o-transition-property: -o-transform, opacity; transition-property: transform, opacity; } /**** disabling Isotope CSS3 transitions ****/ .isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition { -webkit-transition-duration: 0s; -moz-transition-duration: 0s; -ms-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; } /**** FANCYBOX ****/ /*! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license */ .fancybox-wrap, .fancybox-skin, .fancybox-outer, .fancybox-inner, .fancybox-image, .fancybox-wrap iframe, .fancybox-wrap object, .fancybox-nav, .fancybox-nav span, .fancybox-tmp { padding: 0; margin: 0; border: 0; outline: none; vertical-align: top; } .fancybox-wrap { position: absolute; top: 0; left: 0; z-index: 8020; } .fancybox-skin { position: relative; background: #f9f9f9; color: #444; text-shadow: none; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .fancybox-opened { z-index: 8030; } .fancybox-opened .fancybox-skin { -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); } .fancybox-outer, .fancybox-inner { position: relative; } .fancybox-inner { overflow: hidden; } .fancybox-type-iframe .fancybox-inner { -webkit-overflow-scrolling: touch; } .fancybox-error { color: #444; font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; margin: 0; padding: 15px; white-space: nowrap; } .fancybox-image, .fancybox-iframe { display: block; width: 100%; height: 100%; } .fancybox-image { max-width: 100%; max-height: 100%; } #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url('./img/fancybox/fancybox_sprite.png'); } #fancybox-loading { position: fixed; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; opacity: 0.8; cursor: pointer; z-index: 8060; background-image: none; background-color: black; } #fancybox-loading div { width: 44px; height: 44px; background: url('./img/fancybox/fancybox_loading.gif') center center no-repeat; } .fancybox-close { position: absolute; top: -15px; right: -20px; width: 40px; height: 30px; cursor: pointer; z-index: 8040; background-size: cover; } .fancybox-nav { position: absolute; top: 0; width: 40%; height: 100%; cursor: pointer; text-decoration: none; background: transparent url('./img/fancybox/blank.gif'); /* helps IE */ -webkit-tap-highlight-color: rgba(0,0,0,0); z-index: 8040; } .fancybox-prev { left: 0; } .fancybox-next { right: 0; } .fancybox-nav span { position: absolute; top: 50%; width: 36px; height: 34px; margin-top: -18px; cursor: pointer; z-index: 8040; visibility: hidden; } .fancybox-prev span { left: 10px; background-position: 0 -36px; } .fancybox-next span { right: 10px; background-position: 0 -72px; } .fancybox-nav:hover span { visibility: visible; } .fancybox-tmp { position: absolute; top: -99999px; left: -99999px; visibility: hidden; max-width: 99999px; max-height: 99999px; overflow: visible !important; } /* Overlay helper .fancybox-lock { overflow: hidden !important; width: auto; } .fancybox-lock body { overflow: hidden !important; } .fancybox-lock-test { overflow-y: hidden !important; } */ .fancybox-overlay { position: absolute; top: 0; left: 0; overflow: hidden; display: none; z-index: 8010; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#50FFFFFF,endColorstr=#50FFFFFF); background-color: rgba(255,255,255,0.8); } .fancybox-overlay-fixed { position: fixed; bottom: 0; right: 0; } .fancybox-lock .fancybox-overlay { overflow: auto; overflow-y: scroll; } /* Title helper */ .fancybox-title { visibility: hidden; font: normal 13px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; position: relative; text-shadow: none; z-index: 8050; } .fancybox-opened .fancybox-title { visibility: visible; } .fancybox-title-float-wrap { position: absolute; bottom: 0; right: 50%; margin-bottom: -35px; z-index: 8050; text-align: center; } .fancybox-title-float-wrap .child { display: inline-block; margin-right: -100%; padding: 2px 20px; background: transparent; /* Fallback for web browsers that doesn't support RGBa */ background: rgba(0, 0, 0, 0.8); -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; text-shadow: 0 1px 2px #222; color: #FFF; font-weight: bold; line-height: 24px; white-space: nowrap; } .fancybox-title-outside-wrap { position: relative; margin-top: 10px; color: #fff; } .fancybox-title-inside-wrap { padding-top: 10px; } .fancybox-title-over-wrap { position: absolute; bottom: 0; left: 0; color: #fff; padding: 10px; background: #000; background: rgba(0, 0, 0, .8); } /*Retina graphics!*/ @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5){ #fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span { background-image: url('./img/fancybox/fancybox_sprite.png'); background-size: 44px 152px; /*The size of the normal image, half the size of the hi-res image*/ } #fancybox-loading div { background-image: url('./img/fancybox/fancybox_loading@2x.gif'); background-size: 24px 24px; /*The size of the normal image, half the size of the hi-res image*/ } } /*///////////////////////////// MEDIA QUERIES /////////////////////////////*/ /* Smartphones (portrait) ----------- */ @media only screen and (min-width : 320px) and (max-width : 479px){ #head, #isomobnav, #stage, #foot { /* width:290px; */} #loading {visibility: none;} #head {padding: 0 20px; height: auto;} #stage {padding: 5px 20px} .home #stage,.archive #stage {padding: 45px 20px} #foot {padding: 20px 20px} #logo{width: 175px; min-height: 40px;} .mobiletoggle {padding:25px 10px 15px;display: block; cursor: pointer;} #navigation, #isonav, .home #isonav {display: none;} .home #isomobnav, .archive #isomobnav {display: block; } .category-tearsheets #isomobnav {display: none; } .photo {width: 265px; height: 330px; margin: 0 0 10px 0;} #isotopegallery .landscape {width: 265px; height: 160px;} #isotopegallery .square {width: 262px; height: 262px;} .archivetitle {display: none;} .links_item {width: 100%; margin-right: 0;} #clients_text_wrap, #bio_text {width: 100%;} .clients_text {width: 100%} .clients_text ul {margin: 0} .clients_text:first-child {margin-top: 20px;} #studio_section {padding-bottom: 0; width: auto} #studio_text {width: 100%} #studio_text p {font-size: 17px;} #contact_section{padding-left:0; width: auto; padding-top: 0; clear: both;} #single_image {padding-bottom: 0; width: 100%; text-align: left;} #single_text {padding-left:0; width: auto; padding-top: 40px; clear: both;} #sitemap_main{width: 100%; float: left; padding-bottom: 0px} #sitemap_pf {width: 100%; float: left; padding-left: 0px; padding-bottom: 0px; } #sitemap_ts {width: 100%; float: left; padding-left: 0px; padding-bottom: 40px; } /* Footer */ #foot_wrap .footer_social_media {display: block;} #search_icon{display:none;} #tag {display: none;} #foot p {text-align: center} #nav_wrap {display:none !important;} #social_media_block { float: none; position: relative; top: 0px; right: 0px; margin: 10px auto 0;} #social_media_block .social_media_icon {margin: 0 10px 0 0;} #wrapper {margin: 0 auto -89px;} #push {height: 89px;} #foot span:after{content:'Smartphones'} } /* smartphones (landscape) ----------- */ @media only screen and (min-width : 480px) and (max-width : 767px){ #head, #stage, #isomobnav, #foot { /* width:450px; */} #loading {visibility: none;} #head {padding: 0 20px; height: auto;} #stage {padding: 5px 20px} .home #stage,.archive #stage {padding: 45px 20px} #foot {padding: 20px 20px} /* Header */ .home #isonav, .category-portfolios #isonav {display: block; clear: none; float: none;} #logo{width: 200px;} #search_box input[type=search]{width: 390px;} #navigation, #isonav, .home #isonav {display: none;} .home #isomobnav, .archive #isomobnav {display: block; } .category-tearsheets #isomobnav {display: none; } .mobiletoggle {display: block; cursor: pointer; margin-top: 10px;} #search_icon{width:80px;height:80px; padding:20px;} .photo {width: 200px; height: 250px; } #isotopegallery .landscape {width: 200px; height: 120px;} #isotopegallery .square {width: 200px; height: 200px;} .archivetitle {display: none;} .links_item {width: 48%} #clients_text_wrap, #bio_text {width: 100%;} .clients_text {width: 100%} .clients_text ul {margin: 0} .clients_text:first-child {margin-top: 20px;} #studio_section {padding-bottom: 0; width: auto;} #studio_text {width: 100%} #studio_text p {font-size: 17px;} #contact_section{padding-left:0; width: 400px; padding-top: 0; clear: both;} #single_image {padding-bottom: 0; width: 100%; text-align: left;} #single_text {padding-left:0; width: 400px; padding-top: 40px; clear: both;} .page-template-temp-portfolios-page-php .entry, .page-template-temp-tearsheet-page-php .entry{margin: 0 auto; width: 388px;} #tag {display: none;} #foot p {text-align: center} #nav_wrap {display:none !important; } #social_media_block{ float: none; position: relative; top: 0px; right: 0px; margin: 10px auto 0;} #social_media_block .social_media_icon {margin: 0 10px 0 0;} #wrapper {margin: 0 auto -89px;} #push {height: 89px;} #sitemap_main{width: 100%; float: left; padding-bottom: 0px} #sitemap_pf {width: 100%; float: left; padding-left: 0px; padding-bottom: 0px; } #sitemap_ts {width: 100%; float: left; padding-left: 0px; padding-bottom: 40px; } /* Footer */ #foot_wrap .footer_social_media {display: block;} #foot span:after{content:'Smartphones'} } /* iPads (portrait) ----------- */ @media only screen and (min-width : 768px) and (max-width : 1023px){ #head, #stage, #foot { /* width:730px; */} #head {padding: 0 35px; height: auto;} #stage {padding: 5px 35px} .home #stage,.archive #stage {padding: 45px 35px} #foot {padding: 20px 35px} #logo {width: 400px; padding-bottom: 10px;} #nav_wrap {margin: 0px 0 10px 0px; clear: both;} .home #nav_wrap { margin: 0px 0 10px 0px;} #isonav {margin-top: 0px; padding-top: 3px;} #search_box input[type=search]{width: 172px;} /* Header */ #social_media_block {height:30px; } .home #isonav, .category-portfolios #isonav {display: block; clear: none; float:none; padding-bottom:10px; margin-top:10px; padding-left:0;} #isonav ul li {padding-left:0; padding-right:10px;} .photo {width: 215px; height: 270px; } #isotopegallery .landscape {width: 215px; height: 130px;} #isotopegallery .square {width: 215px; height: 215px;} .links_item {width: 31.33%} #clients_text_wrap, #bio_text {width: 100%;} #studio_section {width: 400px; padding-bottom: 0;} #contact_section{padding-left:0; width: 400px; padding-top: 0; clear: both;} #single_image {width: 400px; padding-bottom: 0;x} #single_text {padding-left:0; width: 400px; padding-top: 40px; clear: both;} .page-template-temp-portfolios-page-php .entry, .page-template-temp-tearsheet-page-php .entry{margin: 0 auto; width: 591px;} #sitemap_main{width: 400px; float: left; padding-bottom: 40px} #sitemap_pf {width: 280px; float: left; padding-left: 0px; padding-bottom: 0px} #sitemap_ts {width: auto; float: left; padding-left: 0px; padding-bottom: 40px; } #tag:hover {left: -18px;} #foot #social_media_block{ float: left; position: relative; top: 0px; right: 0px;margin: 10px 0 0 0;} #foot #social_media_block .social_media_icon {margin: 0 10px 0 0;} #wrapper {margin: 0 auto -84px;} #push {height: 84px;} /* Footer */ #foot_wrap .footer_social_media {display: none;} #foot span:after{content:'Tablets'} } /* iPads (landscape) ----------- */ @media only screen and (min-width : 1024px) and (max-width : 1279px){ #head, #stage, #foot { /* width:1000px; */ } /* Header */ #social_media_block {height:30px;} #head {padding: 0 35px; height: 142px;} #stage {padding: 5px 35px} .home #stage,.archive #stage {padding: 45px 35px} #foot {padding: 20px 35px} #logo {width: 380px; } #nav_wrap {margin: 70px 0 0 20px;} .ie9 #nav_wrap, .ie10 #nav_wrap {margin-top: 95px;} #isonav { padding: 3px 0 0 20px; } .photo {width: 220px; height: 280px; } #isotopegallery .landscape {width: 220px; height: 140px;} #isotopegallery .square {width: 220px; height: 220px;} .links_item {width: 31.33%} #clients_text_wrap, #bio_text {width: 100%;} #studio_section {width: 380px; } #contact_section{padding-left:17px} #single_image {width: 380px} #single_text {padding-left: 17px} #sitemap_main{width: 380px; float: left; padding-bottom: 40px} #sitemap_pf {width: 433px; float: left; padding-left: 17px; padding-bottom: 0px} #sitemap_ts {width: auto; float: left; padding-left: 17px; padding-bottom: 40px;} #foot #social_media_block{right: 45px;} #search_box input[type=search]{width: 296px;} #tag:hover {left: -18px;} #foot span:after{content:'Tablets'} } /* Desktops and laptops ----------- */ @media only screen and (min-width : 1280px) { #head, #stage, #foot { /* width:1200px; */ } #search_box input[type=search]{width: 396px;} .ie9 #nav_wrap, .ie10 #nav_wrap {margin-top: 95px;} #foot span:after{content:'Laptops'} #foot_wrap .footer_social_media {display: none;} } /* "I can't believe they don't fucntion properly" ie9 + ie10 */ .ie9 .social_media_icon img, .ie10 .social_media_icon img {width: 20px; height: 20px;} /* pesky ie 7 + 8 */ .lt-ie9 #head {padding: 0 35px;} .lt-ie9 #stage {padding: 5px 35px} .lt-ie9 .home #stage, .lt-ie9 .archive #stage {padding: 45px 35px} .lt-ie9 #foot {padding: 20px 35px} .lt-ie9 #logo {width: 380px;} .lt-ie9 #nav_wrap {margin: 72px 0 0 20px;} .lt-ie9 #isonav {padding: 8px 0 0 20px; } .lt-ie9 .photo {width: 220px; height: 280px; } .lt-ie9 #isotopegallery .landscape {width: 220px; height: 140px;} .lt-ie9 #isotopegallery .square {width: 220px; height: 220px;} .lt-ie9 .links_item {width: 31.33%} .lt-ie9 #clients_text_wrap, .lt-ie9 #bio_text {width: 100%;} .lt-ie9 #studio_section {width: 380px; } .lt-ie9 #contact_section{padding-left:17px} .lt-ie9 #single_image {width: 380px} .lt-ie9 #single_text {padding-left: 17px} .lt-ie9 #sitemap_main{width: 380px; float: left; padding-bottom: 40px} .lt-ie9 #sitemap_pf {width: 433px; float: left; padding-left: 17px; padding-bottom: 0px} .lt-ie9 #sitemap_ts {width: auto; float: left; padding-left: 17px; padding-bottom: 40px;} .lt-ie9 #foot #social_media_block{right: 45px;} .lt-ie9 #search_box input[type=search]{width: 296px;} .lt-ie9 #tag:hover {left: -18px;} /* uber pesky ie 7 */ .ie7 #isonav ul li {margin-right: 0; padding-right: 2px;} .ie7 #browsehappy{height: 30px;} .ie7 #studio_text, .ie7 #booking_text {width: auto;} .ie7 #studio_text p a, .ie7 #booking_text p a, #foot p a {color: #808080;} .ie7 #stage #social_media_block {margin-top: 15px;} .ie7 .social_media_icon, .ie7 #foot .social_media_icon {width: 20px; height: 20px;} /*//////////- Help -//////////*/ .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; }