/** * CartoDB header with-image popup styles */ div.cartodb-popup.header.with-image div.cartodb-popup-header { position:relative; background:url('../img/headers.png') no-repeat -1008px 0; height:138px; max-height:104px; } div.cartodb-popup.header.with-image div.cartodb-popup-header .cover { display:block; position:absolute; overflow:hidden; width: 218px; height:135px; top: 4px; left: 4px; border-radius: 4px 4px 0 0; } div.cartodb-popup.header.with-image div.cartodb-popup-header .cover .shadow { position:absolute; width: 218px; height:55px; bottom: 0; left: 0; background:url('../img/shadow.png') no-repeat; z-index: 100; } div.cartodb-popup.header.with-image div.cartodb-popup-header .cover #spinner { position:absolute; top: 67px; left: 109px; } div.cartodb-popup.header.with-image div.cartodb-popup-header .cover img { position:absolute; border-radius: 4px 4px 0 0; display:none; } div.cartodb-popup.header.with-image div.cartodb-popup-header .image_not_found { position:absolute; top: 15px; left: 15px; width: 200px; display:none; } div.cartodb-popup.header.with-image div.cartodb-popup-header .image_not_found a { display:-moz-inline-stack;display:inline-block;vertical-align:top;*vertical-align:auto;zoom:1;*display:inline; margin: 3px 0 0 -2px; color: #888888; font-size:13px; font-family: "Helvetica", "Helvetica Neue", Arial, sans-serif; text-decoration: underline; } div.cartodb-popup.header.with-image div.cartodb-popup-header .image_not_found a:hover { color: #888888; text-decoration:underline; } div.cartodb-popup.header.with-image div.cartodb-popup-header .cover .image_not_found i { display:-moz-inline-stack;display:inline-block;vertical-align:top;*vertical-align:auto;zoom:1;*display:inline; width: 31px; height: 22px; background:transparent url('../img/image_not_found.png'); } div.cartodb-popup.header.with-image div.cartodb-popup-header h1 { position:absolute; bottom: 13px; left: 18px; width: 188px; z-index: 150; } div.cartodb-popup.header.with-image div.cartodb-popup-header h4 { color:#CCC; } div.cartodb-popup.header.with-image div.cartodb-popup-header span.separator { background:#CCC; } div.cartodb-popup.header.with-image a.cartodb-popup-close-button { background:url('../img/headers.png') no-repeat -226px -40px; } div.cartodb-popup.header.with-image a.cartodb-popup-close-button:hover { background-position:-226px -66px; } div.cartodb-popup.header.with-image .cartodb-popup-header h1 { display:none; } div.cartodb-popup.header.with-image .cartodb-popup-header h1.order1 { display:block; } div.cartodb-popup.header.with-image .cartodb-popup-content-wrapper .order1 { display:none; } /* NEW CartoDB 2.0 image header popups */ div.cartodb-popup.v2.header.with-image div.cartodb-popup-header { background: #2C2C2C; background: -ms-linear-gradient(top, #535353, #2C2C2C); background: -o-linear-gradient(right, #535353, #2C2C2C); background: -webkit-linear-gradient(top, #535353, #2C2C2C); background: -moz-linear-gradient(right, #535353, #2C2C2C); -ms-filter: "progid:DXImageTransform.Microsoft.Gradient(startColorStr='#535353',endColorStr='#2C2C2C',GradientType=0)"; } div.cartodb-popup.v2.header.with-image div.cartodb-popup-header h1 { width:85%; } div.cartodb-popup.v2.header.with-image div.cartodb-popup-header span.separator { left:0; right:0; background:#CCC; } div.cartodb-popup.v2.header.with-image a.cartodb-popup-close-button { background:white; } div.cartodb-popup.v2.header.with-image div.cartodb-popup-header .cover { display:block; width:100%; height:138px; top:0; left:0; -moz-border-radius:2px 2px 0 0; -webkit-border-radius:2px 2px 0 0; border-radius:2px 2px 0 0; overflow:hidden; } div.cartodb-popup.v2.header.with-image div.cartodb-popup-header .cover .shadow { width: 100%; height:57px; background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(0,0,0,0)), color-stop(100%, rgba(0,0,0,0.8))); background: -webkit-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.8)); background: -moz-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.8)); background: -o-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.8)); background: linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.8)); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 ); } div.cartodb-popup.v2.header.with-image div.cartodb-popup-header .cover img { -moz-border-radius:2px 2px 0 0; -webkit-border-radius:2px 2px 0 0; border-radius:2px 2px 0 0; }