/* @license * MyFonts Webfont Build ID 2614593, 2013-08-03T12:27:31-0400 * * The fonts listed in this notice are subject to the End User License * Agreement(s) entered into by the website owner. All other parties are * explicitly restricted from using the Licensed Webfonts(s). * * You may obtain a valid license at the URLs below. * * Webfont: Trade Gothic by Linotype * URL: http://www.myfonts.com/fonts/linotype/trade-gothic/trade-gothic-63882/ * Copyright: Part of the digitally encoded machine readable outline data for producing the Typefaces provided is copyrighted (c) 1989, 1992, 2003 Linotype Library GmbH, www.linotype.com. All rights reserved. This software is the property of Linotype Library GmbH, and * Licensed pageviews: 250,000 * * Webfont: Trade Gothic Condensed No. 18 by Linotype * URL: http://www.myfonts.com/fonts/linotype/trade-gothic/condensed-no-18-63882/ * Copyright: Part of the digitally encoded machine readable outline data for producing the Typefaces provided is copyrighted (c) 1989, 1992, 2003 Linotype Library GmbH, www.linotype.com. All rights reserved. This software is the property of Linotype Library GmbH, and * Licensed pageviews: 250,000 * * Webfont: Trade Gothic Bold Condensed No. 20 by Linotype * URL: http://www.myfonts.com/fonts/linotype/trade-gothic/bold-condensed-no-20-63882/ * Copyright: Part of the digitally encoded machine readable outline data for producing the Typefaces provided is copyrighted © 2002 - 2007 Linotype GmbH, www.linotype.com. All rights reserved. This software is the property of Linotype GmbH, and may not be repro * Licensed pageviews: 500,000 * * Webfont: Trade Gothic Light by Linotype * URL: http://www.myfonts.com/fonts/linotype/trade-gothic/light-63882/ * Copyright: Part of the digitally encoded machine readable outline data for producing the Typefaces provided is copyrighted (c) 1989, 1992, 2003 Linotype Library GmbH, www.linotype.com. All rights reserved. This software is the property of Linotype Library GmbH, and * Licensed pageviews: 250,000 * * Webfont: Trade Gothic Bold by Linotype * URL: http://www.myfonts.com/fonts/linotype/trade-gothic/bold-63882/ * Copyright: Part of the digitally encoded machine readable outline data for producing the Typefaces provided is copyrighted (c) 1989, 1992, 2003 Linotype Library GmbH, www.linotype.com. All rights reserved. This software is the property of Linotype Library GmbH, and * Licensed pageviews: 500,000 * * * License: http://www.myfonts.com/viewlicense?type=web&buildid=2614593 * * © 2013 MyFonts Inc */ /* @import must be at top of file, otherwise CSS will not work */ @import url("//hello.myfonts.net/count/27e541"); @font-face {font-family: 'TradeGothicLT';src: url('27E541_0_0.eot');src: url('27E541_0_0.eot?#iefix') format('embedded-opentype'),url('27E541_0_0.woff') format('woff'),url('27E541_0_0.ttf') format('truetype');} @font-face {font-family: 'TradeGothicLT-CondEighteen';src: url('27E541_1_0.eot');src: url('27E541_1_0.eot?#iefix') format('embedded-opentype'),url('27E541_1_0.woff') format('woff'),url('27E541_1_0.ttf') format('truetype');} @font-face {font-family: 'TradeGothicLTCom-BdCn20';src: url('27E541_2_0.eot');src: url('27E541_2_0.eot?#iefix') format('embedded-opentype'),url('27E541_2_0.woff') format('woff'),url('27E541_2_0.ttf') format('truetype');} @font-face {font-family: 'TradeGothicLT-Light';src: url('27E541_3_0.eot');src: url('27E541_3_0.eot?#iefix') format('embedded-opentype'),url('27E541_3_0.woff') format('woff'),url('27E541_3_0.ttf') format('truetype');} @font-face {font-family: 'TradeGothicLT-Bold';src: url('27E541_4_0.eot');src: url('27E541_4_0.eot?#iefix') format('embedded-opentype'),url('27E541_4_0.woff') format('woff'),url('27E541_4_0.ttf') format('truetype');} /* * HTML5 Boilerplate * * What follows is the result of much research on cross-browser styling. * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal, * Kroc Camen, and the H5BP dev community and team. */ /* ========================================================================== Base styles: opinionated defaults ========================================================================== */ html, button, input, select, textarea { color: #222; } body { font-size: 1em; line-height: 1.4; } /* * Remove text-shadow in selection highlight: h5bp.com/i * These selection rule sets have to be separate. * Customize the background color to match your design. */ ::-moz-selection { background: #b3d4fc; text-shadow: none; } ::selection { background: #b3d4fc; text-shadow: none; } /* * A better looking default horizontal rule */ hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } /* * Remove the gap between images and the bottom of their containers: h5bp.com/i/440 */ img { vertical-align: middle; } /* * Remove default fieldset styles. */ fieldset { border: 0; margin: 0; padding: 0; } /* * Allow only vertical resizing of textareas. */ textarea { resize: vertical; } /* ========================================================================== Chrome Frame prompt ========================================================================== */ .chromeframe { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; } /* ========================================================================== Author's custom styles ========================================================================== */ /* ========================================================================== Helper classes ========================================================================== */ /* * Image replacement */ .ir { background-color: transparent; border: 0; overflow: hidden; /* IE 6/7 fallback */ *text-indent: -9999px; } .ir:before { content: ""; display: block; width: 0; height: 150%; } /* * Hide from both screenreaders and browsers: h5bp.com/u */ .hidden { display: none !important; visibility: hidden; } /* * Hide only visually, but have it available for screenreaders: h5bp.com/v */ .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } /* * Extends the .visuallyhidden class to allow the element to be focusable * when navigated to via the keyboard: h5bp.com/p */ .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } /* * Hide visually and from screenreaders, but maintain layout */ .invisible { visibility: hidden; } /* * Clearfix: contain floats * * For modern browsers * 1. The space content is one way to avoid an Opera bug when the * `contenteditable` attribute is included anywhere else in the document. * Otherwise it causes space to appear at the top and bottom of elements * that receive the `clearfix` class. * 2. The use of `table` rather than `block` is only necessary if using * `:before` to contain the top-margins of child elements. */ .clearfix:before, .clearfix:after { content: " "; /* 1 */ display: table; /* 2 */ } .clearfix:after { clear: both; } /* * For IE 6/7 only * Include this rule to trigger hasLayout and contain floats. */ .clearfix { *zoom: 1; } /* ========================================================================== EXAMPLE Media Queries for Responsive Design. These examples override the primary ('mobile first') styles. Modify as content requires. ========================================================================== */ @media only screen and (min-width: 35em) { /* Style adjustments for viewports that meet the condition */ } @media print, (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) { /* Style adjustments for high resolution devices */ } /* ========================================================================== Print styles. Inlined to avoid required HTTP connection: h5bp.com/r ========================================================================== */ @media print { * { background: transparent !important; color: #000 !important; /* Black prints faster: h5bp.com/s */ box-shadow: none !important; text-shadow: none !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } /* * Don't show links for images, or javascript/internal links */ .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; /* h5bp.com/t */ } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } } /* animations */ @-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translateY(-25px)}100%{opacity:1;-webkit-transform:translateY(0)}}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translateY(25px)}100%{opacity:1;-webkit-transform:translateY(0)}}@-moz-keyframes fadeInDown{0%{opacity:0;-moz-transform:translateY(-25px)}100%{opacity:1;-moz-transform:translateY(0)}}@-moz-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-moz-keyframes fadeInUp{0%{opacity:0;-moz-transform:translateY(25px)}100%{opacity:1;-moz-transform:translateY(0)}}@-ms-keyframes fadeInDown{0%{opacity:0;-ms-transform:translateY(-25px)}100%{opacity:1;-ms-transform:translateY(0)}}@-ms-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-ms-keyframes fadeInUp{0%{opacity:0;-ms-transform:translateY(25px)}100%{opacity:1;-ms-transform:translateY(0)}}@-keyframes fadeInDown{0%{opacity:0;-ms-transform:translateY(-25px)}100%{opacity:1;-ms-transform:translateY(0)}}@-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-keyframes fadeInUp{0%{opacity:0;-transform:translateY(25px)}100%{opacity:1;-transform:translateY(0)}} .fadeInDown{ -webkit-animation: fadeInDown 0.5s 0.3s ease both; -moz-animation: fadeInDown 0.5s 0.3s ease both; -ms-animation: fadeInDown 0.5s 0.3s ease both; -o-animation: fadeInDown 0.5s 0.3s ease both; animation: fadeInDown 0.5s 0.3s ease both; } .fadeIn{ -webkit-animation: fadeIn 1s 0s ease both; -moz-animation: fadeIn 1s 0s ease both; -ms-animation: fadeIn 1s 0s ease both; -o-animation: fadeIn 1s 0s ease both; animation: fadeIn 1s 0s ease both; } .fadeInUp{ -webkit-animation: fadeInUp 0.5s 0.3s ease both; -moz-animation: fadeInUp 0.5s 0.3s ease both; -ms-animation: fadeInUp 0.5s 0.3s ease both; -o-animation: fadeInUp 0.5s 0.3s ease both; animation: fadeInUp 0.5s 0.3s ease both; } /* fadeInDown fadeIn fadeInUp */ body,html,.wrapper{ position:absolute; height:100%; width:100%; font-family:'TradeGothicLTCom-BdCn20'; } html{ overflow:hidden; } body{ background:#000; } .work.wrapper { overflow:hidden; overflow-x: scroll; } h1,h2,h3,h4,h5,h6{ font-weight: normal; } h1 { margin:0.4em 0; color:#fff; font-size:3em; line-height:1em; text-transform: uppercase; } h2 { font-size:2em; font-weight:normal; } img,.building,.animate_container,.wrapper{ -webkit-transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; -webkit-perspective: 1000; } .background,.wrapper, .details .building, .building img{ position:absolute; bottom:0px; left:0px; width:100%; z-index:0; } .header{ position:fixed; z-index:10; width:100%; } .top-corners{ position:fixed; top:0; z-index: 10; width: 288px; height: 168px; background:url('../img/Shadow_TopCorners.png') top left no-repeat; background-size:100%; display:none; } .top-corners.left{ left:0; } .top-corners.right{ right:0; -moz-transform: scaleX(-1); -o-transform: scaleX(-1); -webkit-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH"; } #logo{ width:159px; height:37px; position:absolute; z-index: 10; top:18px; left:41px; background:url('../img/vesolutions.png') no-repeat center; } #logo a{ display:block; position:absolute; top:0; left:0; width:100%; height:100%; } #nav{ position:fixed; z-index: 10; top: 18px; right: 41px; text-shadow:1px 1px #000; text-shadow:1px 1px rgba(0,0,0,0.4) } #nav li{ display:inline; } #nav li a{ color:#fff; font-weight:normal !important; padding:3px 12px; margin:0 5px; text-decoration:none; font-size:16px; } #nav li.active a, #nav li a:hover{ background-color: #FFF; filter: alpha(opacity= 65); -moz-opacity: .65; opacity: .65; color: rgb(3,3,3); color: rgba(3,3,3,0.95); text-shadow: none; } .content { display:block; position:absolute; left:40px; bottom:25px; z-index:1; display:none; color:#fff; max-width:350px; } .home .sloganWrapper { display: table; height: 40%; width: 100%; position: absolute; margin-top: 0; margin-left: 0; bottom: 30%; left: 0; vertical-align: middle; z-index:5; } .home .sloganInner{ display: table-cell; vertical-align: middle; text-align: center; } .home .sloganWrapper .prev,.home .sloganWrapper .next{ width: 100px; height: 28px; display: inline-block; position: relative; z-index: 200; opacity:0.7; -webkit-transition: all .2s linear; -moz-transition: all .2s linear; -ms-transition: all .2s linear; transition: all .2s linear; } .home .sloganWrapper .prev:hover,.home .sloganWrapper .next:hover{ opacity:1; } .home .sloganWrapper .prev{ top:-30px; background: url('../img/arrow-up.png') no-repeat center; } .home .sloganWrapper .next{ top:30px; background: url('../img/arrow-down.png') no-repeat center; } .home .slogan { display:inline; padding: 10px 20px; margin: 0 auto; background-color: #FFF; filter: alpha(opacity= 65); -moz-opacity: .65; opacity: .65; color: rgb(3,3,3); color: rgba(3,3,3,0.95); } .wrapper.slider{ overflow:hidden; } .slider .building{ width:100%; height:100%; position:absolute; top:0; left:0; overflow:hidden; } .contentItem{ margin-top:2px; padding:10px 30px; background:rgba(0,0,0,0.7); } .contentItem h2{ padding:7px 10px; font-size:1em; } .contentItem p{ padding:2px 10px; font-size:0.7em; } .description { position: absolute; bottom: 0; left: 0; z-index: 3; width: 100%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; color:#1a1a1a; } .description .plus{ position:relative; margin:0 40px; top:-40px; font-family: 'TradeGothicLT-Light'; color: #fff; font-size: 29px; line-height:20px; display: inline-block; } .subTitle{ color:#fff; display:none; padding:0; font-size:26px; font-family:'TradeGothicLTCom-BdCn20'; text-shadow:1px 1px #000; text-shadow:1px 1px rgba(0,0,0,0.4); } .subTitle h2{ font-size:inherit; padding:0 15px; margin:0; } .subTitle span{ color:orange; font-family:'TradeGothicLT-CondEighteen'; } .toggleContent{ cursor:pointer; padding: 5px 15px; } .quote .author { color:orange; font-size:10px; } .contentItem h2 span.plus { position:relative; top:-1px; margin-left:-25px; padding:0 9px 0 0; background:none; } .building_selector{ position:absolute; height:100%; width:1401px; -webkit-transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; -webkit-perspective: 1000; } .building_selector .building{ float:left; position:absolute; -webkit-transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; -webkit-perspective: 1000; height:100%; width:auto; border-right:1px solid #fff; cursor:pointer; } .building_selector .building img{ position:static; height:100%; width:auto; } .building_selector .building .work_text{ position:absolute; bottom:0; left:0; font-size:12px; padding:30px 30px 50px; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjAxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjMzJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjU2Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ1JSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjU5Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC43Ii8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=); background: -moz-linear-gradient(top, rgba(0,0,0,0.01) 0%, rgba(0,0,0,0.56) 33%, rgba(0,0,0,0.59) 45%, rgba(0,0,0,0.7) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.01)), color-stop(33%,rgba(0,0,0,0.56)), color-stop(45%,rgba(0,0,0,0.59)), color-stop(100%,rgba(0,0,0,0.7))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(0,0,0,0.01) 0%,rgba(0,0,0,0.56) 33%,rgba(0,0,0,0.59) 45%,rgba(0,0,0,0.7) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(0,0,0,0.01) 0%,rgba(0,0,0,0.56) 33%,rgba(0,0,0,0.59) 45%,rgba(0,0,0,0.7) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(0,0,0,0.01) 0%,rgba(0,0,0,0.56) 33%,rgba(0,0,0,0.59) 45%,rgba(0,0,0,0.7) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(0,0,0,0.01) 0%,rgba(0,0,0,0.56) 33%,rgba(0,0,0,0.59) 45%,rgba(0,0,0,0.7) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#03000000', endColorstr='#b3000000',GradientType=0 ); /* IE6-8 */ } .building_selector .building .work_text h1{ font-size:26px; font-family:'TradeGothicLTCom-BdCn20'; } .building_selector .building .work_text span{ display:block; font-family:'TradeGothicLT-CondEighteen'; color:orange; font-size:26px; } .building_selector .building .work_text .view_more { background: url('../img/view-more.png') left top no-repeat; display:block; padding-left:30px; padding-top:3px; height:22px; color:#fff; text-decoration:none; display:none; } .details, .expertise, .firm{ color:#fff; overflow:hidden; } .details .building, .expertise .building, .firm .building{ height:100%; } .details .prevProject,.details .nextProject{ position:absolute; top:50%; margin-top:-28px; height:56px; width:35px; z-index:5; } .details .nextProject{ right:10px; background:url('../img/arrow-right.png') no-repeat center; } .details .prevProject{ left:10px; background:url('../img/arrow-left.png') no-repeat center; } .description .title{ width:32%; float:left; text-indent: -11px; } .description h1,.description h4,.description h5,.description p,.description h6 { font-family: 'TradeGothicLTCom-BdCn20'; text-transform: none; font-weight: normal; color:#1a1a1a; } .description h4,.description h5,.description h6 { display:inline; } .description h1{ margin-top:0; font-family: 'TradeGothicLTCom-BdCn20'; font-size:35px; padding:0 0 10px 0; line-height: 1.1em; } .description h4, .description h5,.description h6{ padding:0; margin:0; font-size:14px; } .description h4{ font-family: 'TradeGothicLTCom-BdCn20'; padding-right:4px; font-size:18px; } .description h5,.description h6{ font-family: 'TradeGothicLT-CondEighteen'; font-size:18px; } .description p{ font-family: 'TradeGothicLT'; font-size:14px; line-height:1.5em; margin:9px 0; } .description p strong{ font-family: 'TradeGothicLT-Bold'; } .description .desc { margin:0; width:68%; float:left; padding: 0 20px 0 40px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; } .description .desc p:first-child{ padding-top:0; margin-top:0; } .description .desc p:last-child{ padding-bottom:0; margin-bottom:0; } .building_bottom_content{ padding: 41px; background: #fff; background: rgba(255,255,255,0.95); bottom:0; left:0; width:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; display: none; filter: alpha(opacity= 95); -moz-opacity: .95; opacity: .95; } .building_title, .subTitle{ -webkit-transition:top 0.2s linear; -moz-transition:top 0.2s linear; transition:top 0.2s linear; margin: 0 40px; padding-right:30px; position: relative; cursor: pointer; top: -40px; text-transform:uppercase; } .building_title{ display: inline; background:url('../img/arrow-up-down.png') no-repeat 100% 5px ; } .building_title.open,.subTitle.open { top:-10px; padding-right:30px; background:url('../img/arrow-up-down.png') no-repeat 100% -41px ; } .contact { background:white; } .contact a{ color:inherit; text-decoration: none; } .contact a:hover { text-decoration: underline; } ::-webkit-scrollbar { width: 4px; height: 7px; } ::-webkit-scrollbar-track { width: 4px; height: 7px; background:#c1c1c1; } ::-webkit-scrollbar-thumb { border-radius: 10px; background:orange; } .visible{ display:block !important; } .twocolumns { -moz-column-count:2; /* Firefox */ -webkit-column-count:2; /* Safari and Chrome */ column-count:2; } .firm_menu{ margin:0 40px; position:relative; top:-10px; font-family:'TradeGothicLTCom-BdCn20'; font-size:16px; } .firm_menu div, .firm_menu a{ color:#fff; display:inline; margin:0 10px; text-decoration:none; cursor:pointer; } .firm_menu div:hover, .firm_menu a:hover, .firm_menu .active{ color:orange; } .firm_menu .brochure{ padding-left:20px; background:url('../img/download_icon.png') no-repeat 0 2px; } .principals .title h1{ cursor:pointer; color:#888; } .principals .title h1.active, .principals .title h1:hover{ color:#000; } .principals .title .first{ padding: 0; margin: 30px 5px 10px; } .principals .title .last{ padding:0; margin:0 5px 30px; } .contactcontent{ padding:10px 0; } .contact_col{ width:32%; padding:18px 40px; display:inline-block; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } .contact_col.first-child{ padding-left:30px; } .contact_col.last-child{ padding-left:50px; } .map{ overflow:hidden; } .map img { position:absolute; } body { overflow: hidden; } .iframe-rwd { position: absolute; height: 100%; top:0px; left:0; overflow: hidden; width:33.33%; } #map-canvas { position: relative; top: 0; width: 100%; height: 100%; } .iframe-rwd2 { position: absolute; height: 100%; overflow: hidden; top:0px; left:33.44%; width:33.33%; } #map-canvas2 { position: relative; top: 0; width: 100%; height: 100%; } .iframe-rwd3 { position: absolute; height: 100%; overflow: hidden; top:0px; left:66.86%; width:33.33%; } #map-canvas3 { position: relative; top: 0; width: 100%; height: 100%; } @media all and (max-height: 600px){ .building_selector .building .work_text{ font-size:8px; } .building_selector .building .work_text .view_more { padding-top:7px; } } @media only screen and (min-width: 740px){ .building_bottom_content .desc{ -moz-column-count:2; /* Firefox */ -webkit-column-count:2; /* Safari and Chrome */ column-count:2; -moz-column-width: 35px; -webkit-column-width: 35px; column-width: 35px; -moz-column-gap: 35px; -webkit-column-gap: 35px; column-gap: 35px; } } @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and ( min--moz-device-pixel-ratio: 2), only screen and ( -o-min-device-pixel-ratio: 2/1), only screen and ( -moz-device-pixel-ratio: 2), only screen and ( min-device-pixel-ratio: 2), only screen and ( min-resolution: 192dpi), only screen and ( min-resolution: 2dppx) { /* Retina-specific stuff here */ .top-corners{ background:url('../img/Shadow_TopCorners_2x.png') top left no-repeat; background-size:100% 100%; } #logo{ background:url('../img/vesolutions_x2.png') no-repeat center; background-size:100% 100%; } }