cartodb-4.42/lib/assets/javascripts/cdb/examples/TheHobbitLocations/css/style.css
2024-04-06 05:25:13 +00:00

220 lines
4.4 KiB
CSS

@font-face {
font-family: 'robotoregular';
src: url('../fonts/roboto-regular-webfont.eot');
src: url('../fonts/roboto-regular-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/roboto-regular-webfont.woff') format('woff'),
url('../fonts/roboto-regular-webfont.ttf') format('truetype'),
url('../fonts/roboto-regular-webfont.svg#robotoregular') format('svg');
font-weight: normal;
font-style: normal;
}
body{
background-color: #99BDBC;
}
div#map{
position: absolute;
z-index: 0;
bottom: 0;
top: 0;
right: 0;
left: 350px;
background-color: #99BDBC;
}
div#overlay{
position: absolute;
z-index: 2;
bottom: 0;
top: 0;
right: 0;
left: 0;
background: url(../img/overlay.png) no-repeat center center fixed;
background-size: cover;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
filter: progrid:DXImageTransform.Microsoft.AlphaImage(src='.../img/overlay.png', sizingMethod='scale');
-ms-filter: "progrid:DXImageTransform.Microsoft.AlphaImage(src='../img/overlay.png', sizingMethod='scale')";
pointer-events: none;
}
div#leftBkg{
background: url(../img/leftBkg.png) repeat-y;
width: 619px;
position: absolute;
left: 0px;
top: 0px;
bottom: 0px;
pointer-events: none;
}
div.left{
position: absolute;
left: 60px;
top: 60px;
z-index: 3;
}
div.left div#title{
width: 428px;
height: 195px;
background: url(../img/title.png) no-repeat;
}
div.left p{
font-family: "robotoregular", Helvetica, Arial, Sans-serif;
font-size: 17px;
width: 320px;
margin: 30px 0 0 10px;
opacity: .5;
}
div.left p a,
div.left p a:visited{
color:#000;
}
div.left div#legendBox{
background: url(../img/legendBullets.png) 0 0 no-repeat;
margin: 30px 0 0 10px;
}
div.left div#legendBox ul li{
list-style: none;
font-family: "robotoregular", Helvetica, Arial, Sans-serif;
font-size: 15px;
margin: 7px 0 0 22px;
opacity: .5;
}
div.cartodb_tooltip {
position: absolute;
z-index: 5;
display: none;
}
div.cartodb_tooltip p {
font-family: "robotoregular", Helvetica, Arial, Sans-serif;
font-size: 15px;
color: #333;
text-shadow:
-1px -1px 0 #FFF,
1px -1px 0 #FFF,
-1px 1px 0 #FFF,
1px 1px 0 #FFF;
}
/*SYLES FOR THE CUSTOM INFOWINDOW*/
div.cartodb-popup {
background: none;
width: 240px;
padding: 0;
-moz-border-radius-topright: 4px;
border-top-right-radius: 4px;
-moz-border-radius-toplleft: 4px;
border-top-left-radius: 4px;
box-shadow: 0 0 9px rgba(0,0,0,0.4);
}
div.cartodb-popup a.cartodb-popup-close-button{
top: -12px;
right: -13px;
}
div.cartodb-popup div.cartodb-popup-content-wrapper{
padding: 0;
width: 240px;
max-width: none;
background: none;
background-color: #FFF;
-moz-border-radius-topright: 4px;
border-top-right-radius: 4px;
-moz-border-radius-toplleft: 4px;
border-top-left-radius: 4px;
}
div.cartodb-popup div.cartodb-popup-cont{
width: 248px;
max-width: none;
max-height: none;
}
div.cartodb-popup div.cartodb-popup-cont h4{
font-family: Times New Roman, Times, serif;
font-size: 25px;
color:#FFF;
position: absolute;
text-transform: none;
font-weight: normal;
z-index: 5px;
top:98px;
left: 14px;
text-shadow: 0 1px 0 #000;
letter-spacing: -1px;
}
div.cartodb-popup div.cartodb-popup-cont a.videoButton{
background: url(../img/videoButton.png) 0 0 no-repeat;
width: 20px;
height: 17px;
position: absolute;
z-index: 6px;
top:105px;
right: 14px;
}
div.cartodb-popup div.cartodb-popup-cont a.videoButton:hover{
background: url(../img/videoButton.png) 0 -17px no-repeat;
}
div.cartodb-popup div.cartodb-popup-cont p{
font-family: "robotoregular", Helvetica, Arial, Sans-serif;
font-size: 14px;
padding: 12px 15px 0 15px;
opacity: .5;
}
div.cartodb-popup div.cartodb-popup-tip-container{
background: none;
background-color: #FFF;
width: 240px;
height: 15px;
-moz-border-radius-bottomright: 4px;
border-bottom-right-radius: 4px;
-moz-border-radius-bottomlleft: 4px;
border-bottom-left-radius: 4px;
margin-bottom: 10px;
}
div.cartodb-popup div.cartodb-popup-tip-container::after {
position: absolute;
bottom: -10px;
left: 26px;
content: '';
border: 5px solid white;
border-color: white transparent transparent white;
width: 0;
height: 0;
z-index: 1;
}
div.cartodb-infobox {
bottom:35px!important;
font-family: "Helvetica",Arial;
}
div.cartodb-infobox h3 {
color:#333333;
font-size:15px;
}
div.cartodb-infobox p {
display:block;
margin:10px 0 0 0;
color:#788787;
font-size:13px;
line-height:16px;
}