/*************************************
 * Style modulu utrudnien
 *************************************/
div#panelTop {
    width:100%;
    height:43px;
    background-color:#211f2d;
}

#mapAlert, 
#mapInfo {
    position:absolute;
    width:280px;
    text-align:center;
    left:50%;
    margin:60px auto 0 -140px;
    z-index:99999;
    display:none;
}

/* Lista utrudnień na dole strony */
.diffListContainer {

    min-height:120px;
    width:100%;
    border-top:2px solid #DEE3E6;
}

ul#diffList {
    list-style-type:none;
    font-size:12px;
    color:#000;
    margin:10px 0 0 15px;
    padding:0;
}
ul#diffList li {
    color:#211f2d;
    vertical-align:middle;
    background-repeat:no-repeat;
    background-position:left top;
    margin:0 10px 10px 0;
    padding:5px 0 15px 50px;
}

li.tag-car {
    background-image:url('../img/maptag-car.png');
}
li.tag-ped {
    background-image:url('../img/maptag-ped.png');
}
li.tag-bike {
    background-image:url('../img/maptag-bike.png');
}
li.tag-bus {
    background-image:url('../img/maptag-bus.png');
}
li.tag-water {
    background-image:url('../img/maptag-water.png');
}
li.tag-winter {
    background-image:url('../img/maptag-winter.png');
}
li.tag-all {
    background-image:url('../img/maptag-all.png');
}
/*li.tag-all2 {
    background-image:url('../img/maptag-all2.png');
}
li.tag-all3 {
    background-image:url('../img/maptag-all3.png');
}
li.tag-all4 {
    background-image:url('../img/maptag-all4.png');
}*/

ul#diffList li.selected {
    color:#DF531D;
}

div.diffHeader {
    font-size:15px;
    font-weight:bold;
    margin:0 0 5px 0;
    padding:0;
}
p.diffLead {
    color:#2A3C64;
    font-size:15px;
    padding:0;
    margin:0 0 5px 0;
    width:85%;
}
p.diffLead.selected {
    color:#e31f23;
}
img.diffMore {
    margin:5px 8px 0 0;
    float:right;
    width:40px;
    height:40px;
}
p.diffDesc {
    border-top:1px solid #B8C0CC;
    text-align:justify;
    font-weight:normal;
    font-size:14px;
    color:#505F81;
    width:85%;
    margin-top:8px;
    padding-top:10px;
}

.article {
    cursor:pointer;
    border-bottom:1px solid #B8C0CC;
}
.article:last-child {
    border:none;
}
.liCategories {
    font-weight:bold;
    font-size:13px;
    color:#505F81;
    margin:23px 0 0 0;
    height:20px;
}
.liCategories span {
    float:left;
}
.liCategories img {
    float:left;
    margin-left:15px;
}

ul#diffMenu {
    list-style:none;
    margin:0;
    padding:0;
}

ul#diffMenu li {
    float:left;
    display:block;
    font-size:15px;
}

a.closeBtn {
    float:right;
    width:46px;
    height:46px;
}

ul#diffMenu li a,
ul#diffMenu li a:link,
ul#diffMenu li a:visited {
    display:block;
    text-decoration:none;
    color:#FFFFFD;
    font-weight:bold;
    background-color:#211f2d;
    background-repeat:no-repeat;
    background-position:7px -45px;
    padding:12px 19px 11px 54px;
}
ul#diffMenu li a:hover {
    color:#2B3B55;
    background-color:#e3e8eb;
    background-position:7px 0;
}
ul#diffMenu li a.selected {
    text-decoration:none;
    color:#FFFFFD;
    background-color:#e31f23;
    background-position:7px -45px;
}

ul#diffMenu li a.car {
    background-image:url('../img/menu-icon-car.png');
}
ul#diffMenu li a.ped {
    background-image:url('../img/menu-icon-ped.png');
    padding-right:20px;
}
ul#diffMenu li a.bike {
    background-image:url('../img/menu-icon-bike.png');
    padding-left:72px;
    background-position:14px -45px;
}
ul#diffMenu li a.bike:hover {
    background-position:14px 0;
}
ul#diffMenu li a.bike.selected {
    background-position:14px -45px;
}

ul#diffMenu li a.bus {
    background-image:url('../img/menu-icon-bus.png');
}
ul#diffMenu li a.water {
    background-image:url('../img/menu-icon-water.png');
    padding-left:52px;
    padding-right:20px;
}

ul#diffMenu li a.winter {
    background-image:url('../img/menu-icon-winter.png');
}
ul#diffMenu li a.all {
    background-image:url('../img/menu-icon-all.png');
}

#featurePopup {
    position:fixed;
    width:560px;
    height:540px;
    margin-left:-280px;
    margin-top:-270px;
    background-color:#DEE3E6;
    padding:15px 20px 15px 20px;
    text-align:left;
    z-index:999999999;
}

#featurePopup img.loader {
    width:42px;
    height:42px;
    position:absolute;
    left:50%;
    top:50%;
    margin:-21px 0 0 -21px;
}

#featurePopup {
    -moz-box-shadow:4px 4px 8px 4px rgba(0,0,0,0.2);
    -webkit-box-shadow:4px 4px 8px 4px rgba(0,0,0,0.2);
    box-shadow:4px 4px 8px 4px rgba(0,0,0,0.2);
    border-radius:8px;
    -webkit-border-radius:8px;
    -moz-border-radius:8px;
}

.fpClose {
    position:absolute;
    top:10px;
    right:10px;
    width:42px;
    height:42px;
    cursor:pointer;
}

@media screen and (max-width: 960px) {
	
	div#panelTop {
		float:left;
		width:100%;
		height:100%;
		background:#211f2d;
	}

	
	div#panelMap {
		height:500px;
	}
	
	ul#diffMenu li {
		display:table;
		width:auto;
		height:30px;
		float:left;
		margin:0;
		padding:0;
		background:#211f2d;
		vertical-align:middle;
		font-size:13px;
	}
	
}

@media screen and (max-width: 524px) {
	div#panelMap {
		height:300px;
	}
	
	div#panelTop,
	ul#diffMenu {
		display:none;
	}
}