/*  xs (phones, up to 480px)
    sm (tablets, 768px and up)
    md (desktops, 992px and up)
    lg (large desktops, 1200px and up)
*/

/*szare napisy: #626262
szary jasny w tle (na wizytówce gminy): #f7f5f5
różowy/koralowy: #e96656
niebieski (prawie wszędzie): #478dff
niebieski (tylko na wizytówce gminy): #7fafff*/

/*@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,600&subset=latin,latin-ext);*/

html, body{
    margin: 0;
    padding: 0;
}

#my-scroll {

}

/***** NAVBAR SECTION *****/
.navbar{
    border-radius: 0px;
    box-shadow: none !important;
    background: #fff;
    margin-bottom: 0px;
    z-index: 1201;
    border-bottom: 1px solid #d0d4d9;
    box-shadow: 0px 1px 1px #d0d4d9;
}

.navbar img{
    height: 44px;
    display: inline-block;
    margin-top: -12px;
}

@media screen and (max-width: 480px){
    .navbar img{
        margin-left: 10px;
    }
}

@media screen and (min-width: 481px){
    .navbar img{
        margin-left: 50px;
    }
}

@media screen and (min-width: 767px) {
    #menu {
        float: right;
    }
}

#menu {

}

#menu a:hover, #menu a:focus, #menu a:active{
    color: #e96656 !important;
}

#menu.in, #menu.collapsing{
    float: none !important;
}

.navbar p{
    opacity: 0;
    position: relative;
    display: inline-block;
    font-size: 1.5em;
    color: rgba(0,0,0,0.6);
    top: 3px;
}

/***** /NAVBAR SECTION *****/



/***** CONTENT SECTION *****/
#my-scroll{

}

#desc{
    background-color: #fff;
    z-index: 1;
}

.container-fluid{
    padding: 0px;
}

.container-fluid.commune-lg-image{
    height: 400px;
    color: #fff;
    text-align: center;
    background-color: transparent !important;
}

.commune-fixed-bg{
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    height: 450px;
    z-index: -1;
    background-size: cover;
    background-position: center;
}

.commune-lg-image{
    margin-top: 50px;
}

#commune-name{
    font-family: 'Maritime' !important;
    margin-bottom: 0px;
    margin-top: 70px;
    font-size: 3.5em;
    color: #fff;
}

.commune-lg-image .welcome-text{
    margin-top: 0px;
    font-size: 2.7em;
    color: #fff;
}

#show-map{
    box-shadow: none !important;
    background: #7fafff;
    text-shadow: none;
    color: #fff;;
    border: 0px;
    font-size: 1.4em;
    font-weight: 300;
    padding-top: 8px;
    padding-bottom: 8px;
}

@media screen and (max-width: 991px){
    #show-map{
        margin-top: 50px;
        font-size: 1.1em;
    }
}

@media screen and (min-width: 992px){
    #show-map{
        margin-top: 80px;
    }
}

#show-map:focus, #show-map:active, #show-map:hover, #show-map.active{
    outline: 0 !important;
}

@media screen and (max-width: 1199px){
    .weather-row{
        height: 200px !important;
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .weather-row > div{
        position: inherit !important;
        float: none !important;
        max-width: 400px;
        margin: auto;
    }
}

.weather-row{
    display: none; /* weather off temporary */
    height: 100px;
}

.weather-row > div{
    position: relative;
    float: right;
    top: -70px;
    padding-top: 0px;
    padding-bottom: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
    max-width: 400px;
}

#weather{
    display: none;
    height: 225px;
    border: 1px solid #dcdcdc;
    border-radius: 5px;
    background: rgb(253,253,253);
    padding: 10px;
    box-shadow: 5px 5px 10px rgba(0,0,0,0.2);
}

#weather h4{
    margin: 0px;
    font-size: 1.4em;
}

#weather h5{
    margin-top: 3px;
}

#weather > div{
    position: relative;
    padding: 0px;
}

#weather .today i{
    display: inline-block;
    color: #7fafff;
    font-family: weather !important;
    font-size: 6em;
    font-weight: normal;
    font-style: normal;
    line-height: 1.0;
    margin-right: 15px;
}

#weather > div > div > div{
    display: inline-block;
    text-align: center;
    position: relative;
}

#weather > div > div > div > h2{
    font-size: 2em;
    margin: 0px;
    text-align: left;
}

#weather > div > div > div > h3{
    margin: 0px;
    font-size: 1.5em;
}

#weather .forecast > div{
    display: inline-block;
    width: 20%;
}

#weather .forecast i{
    color: #7fafff;
    font-family: weather !important;
    font-size: 2.5em;
    font-weight: normal;
    font-style: normal;
    line-height: 1.0;
}

#weather .forecast{
    text-align: center;
}

#weather .forecast p{
    margin: 0px;
    font-size: 0.9em;
}

.icon-0:before { content: ":"; }
.icon-1:before { content: "p"; }
.icon-2:before { content: "S"; }
.icon-3:before { content: "Q"; }
.icon-4:before { content: "S"; }
.icon-5:before { content: "W"; }
.icon-6:before { content: "W"; }
.icon-7:before { content: "W"; }
.icon-8:before { content: "W"; }
.icon-9:before { content: "I"; }
.icon-10:before { content: "W"; }
.icon-11:before { content: "I"; }
.icon-12:before { content: "I"; }
.icon-13:before { content: "I"; }
.icon-14:before { content: "I"; }
.icon-15:before { content: "W"; }
.icon-16:before { content: "I"; }
.icon-17:before { content: "W"; }
.icon-18:before { content: "U"; }
.icon-19:before { content: "Z"; }
.icon-20:before { content: "Z"; }
.icon-21:before { content: "Z"; }
.icon-22:before { content: "Z"; }
.icon-23:before { content: "Z"; }
.icon-24:before { content: "E"; }
.icon-25:before { content: "E"; }
.icon-26:before { content: "3"; }
.icon-27:before { content: "a"; }
.icon-28:before { content: "A"; }
.icon-29:before { content: "a"; }
.icon-30:before { content: "A"; }
.icon-31:before { content: "6"; }
.icon-32:before { content: "1"; }
.icon-33:before { content: "6"; }
.icon-34:before { content: "1"; }
.icon-35:before { content: "W"; }
.icon-36:before { content: "1"; }
.icon-37:before { content: "S"; }
.icon-38:before { content: "S"; }
.icon-39:before { content: "S"; }
.icon-40:before { content: "M"; }
.icon-41:before { content: "W"; }
.icon-42:before { content: "I"; }
.icon-43:before { content: "W"; }
.icon-44:before { content: "a"; }
.icon-45:before { content: "S"; }
.icon-46:before { content: "U"; }
.icon-47:before { content: "S"; }

.blue-bg{
    position: relative;
    background-color: #7fafff;
    background-image: url(../img/commune/blue_bg.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding-top: 20px;
    color: #fff;
}

#custom-img{
    position: absolute;
    top: -220px;
    left: 0px;
}

.blue-bg > .container > .row{
    position: relative;
}

#commune-sm-image{
    height: 270px;
    width: 300px;
    border-radius: 5px;
    border: 2px solid #fff;
    background-size: cover;
    background-position: center;
    box-shadow: 5px 5px 12px rgba(0,0,0,0.4);
}

#custom-text-1{
    margin-top: 60px;
}

#custom-text-2{
    margin-top: 10px;
    margin-bottom: 30px;
	color: #fff;
}

#custom-text-2 p.partial-hidden-text {
    color: #fff;
}

#custom-text-2 .show-hidden-text mark, #custom-text-2 .hide-shown-text {
    background-color: transparent;
    color: #fff;
    font-weight: 600;
    cursor: pointer;
}

#custom-text-2 .hide {
    display: none;
}

#commune-icons{
    height: 50px;
    text-align: center;
    z-index: 1;
}

#commune-icons:before{
    content: '';
    position: absolute;
    width: 100%;
    height: 50px;
    background-color: #7fafff;
    left: 0;
    border-top: 1px solid #fff;
}

#commune-icons img{
    display: inline-block;
    margin: 10px;
    border: 1px solid #fff;
    z-index: 2;
}

.items-container .row > .col-lg-8{
    display: none;
}

.object-name {
    position: absolute;
    bottom: -30px;
    background: rgba(0,0,0, 0.3);
    width: 100%;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 10px;
}

.object-name p {
    color: #fff !important;
    padding-bottom: 10px;
}

.showplace .object-name p, .track .object-name p, .event .object-name p {
    width: calc(100% - 40px) !important;
    display: inline-block;
}

@media screen and (max-width: 991px){
    .object-name{
        margin-bottom: 30px;
    }
}

@media screen and (min-width: 992px){
    .object-name{
        margin-bottom: 30px;
    }
}

.tight-container{
    max-width: 900px;
    margin-bottom: 50px;
    margin-top: 50px;
}

.headers{
    text-align: center;
    margin-bottom: 30px;
}

#available {
    padding-top: 20px;
    padding-bottom: 40px;
}

#available .headers h3{
    margin: auto;
    max-width: 200px;
    margin-bottom: 0px;
}

#available .headers h3#lgd{
    max-width: none;
}

#available .headers h5{
    margin: auto;
    margin-top: 0px;
    max-width: 200px;
    color: #e96656;
    text-align: right;
}

#available .item{
    text-align: center;
    margin-bottom: 10px;
}

.map-container{
    position: relative;
    margin-top: 50px;
}

.map-container .row {
    margin: 0px;
}

#map{
    height: 600px;
}

@media screen and (max-width: 767px) {
    #map{
        height: 400px;
    }
}

#map-arrow {
    position: absolute;
    top: -50px;
    left: 10px;
    background: transparent;
    z-index: 120;
}

#map-arrow > *:not(.hidden-lg) {
    display: inline-block;
}

#map-arrow img.hidden-lg {
    margin-left: 50px;
    margin-top: 15px;
    width: 120px;
    -ms-transform: rotate(15deg); /* IE 9 */
    -moz-transform: rotate(15deg); /* FF */
    -webkit-transform: rotate(15deg); /* Chrome, Safari, Opera */
    transform: rotate(15deg);
}

#map-arrow img {
    width: 150px;
}

#map-arrow span {
    vertical-align: top;
    font-size: 1.5em;
    color: #8f8f8f;
}

#statistics{
    position: relative;
    padding-bottom: 40px;
}

/*#statistics:after{
    content: '';
    position: absolute;
    width: calc(100% - 30px);
    height: 1px;
    bottom: 0px;
    left: 15px;
    border-bottom: 1px solid #b9b9b9;
}*/

.single-stat{
    position: relative;
}

.chart{
    position: relative;
    width: 150px;
    margin: auto;
    margin-bottom: 10px;
}

#statistics canvas{
    width: 150px;
    height: 150px;
}

.circle-chart{
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 2px solid #d9d9d9;
}

@media screen and (max-width: 767px){
    .circle-chart{
        margin-top: 20px;
    }
}

@media screen and (min-width: 768px){
    .circle-chart{
        top: 30px;
    }
}

.circle-chart img{
    top: -15px !important;
    left: 25px !important;
}

.circle-chart span.percentage{
    top: 30px !important;
}

.circle-chart span:last-child{
    top: 50px !important;
}

.single-stat span, .single-stat img{
    position: absolute;
}

.single-stat:nth-child(2) img{
    left: 62px;
}

.single-stat img{
    top: 30px;
    left: 50px;
}

#statistics span.percentage{
    top: 80px;
    left: 0px;
    width: 100%;
    font-size: 1.3em;
    text-align: center;
    color: #e96656;
    font-weight: 300;
}

#statistics span:last-child{
    display: block;
    top: 102px;
    width: 100%;
    text-align: center;
    font-size: 0.9em;
}

.additional-stats{
    min-height: 150px;
}

@media screen and (max-width: 767px){
    .additional-stats{
        min-height: auto;
    }

    .additional-stats .text-stat{
        margin-top: auto;
    }
}

.additional-stats p{
    text-align: center;
    margin: 0px;
}

.additional-stats p.area-number{
    font-size: 1.2em;
    font-weight: 300;
    color: #e96656;
}

.additional-stats .text-stat{
    position: relative;
    margin-top: 60px !important;
    margin: auto;
    width: 150px;
}

.additional-stats .text-stat p{
    font-size: 1em !important;
}

@media screen and (min-width: 745px) and (max-width: 850px) {
    .additional-stats .height-stat {
        display: none;
    }
}

.additional-stats .height-stat{
    position: absolute;
    top: -50px;
    left: 8px;
}

.additional-stats .height-stat img{
    -webkit-transform: scale(1.2);  /* Saf3.1+, Chrome */
     -moz-transform: scale(1.2);  /* FF3.5+ */
      -ms-transform: scale(1.2);  /* IE9 */
       -o-transform: scale(1.2);  /* Opera 10.5+ */
          transform: scale(1.2);
}

.additional-stats .height-stat span.height-value{
    position: absolute;
    width: auto !important;
    color: #7fafff;
    font-size: 1.0em !important;
    text-align: left !important;
}

@media screen and (max-width: 300px) {
    .additional-stats .height-stat span.height-value {
        display: none !important;
    }
}

.additional-stats .height-stat span.height-value.min{
    position: absolute;
    right: -95px;
    top: 85px !important;
}

.additional-stats .height-stat span.height-value.max{
    position: absolute;
    right: -100px;
    top: -2px;
}

/* description panel */

#description-panel {
	padding: 0px;
	background-image: url(/img/commune/tree3.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

#description-panel .container {
	margin-top: 0px;
	margin-bottom: 0px;
}

#description-panel .col-xs-12 {
	background: #fff;
	padding: 30px;
}

#description-panel h3 {
	margin-top: 0px;
}

/*/ description panel */

/* turistic objects */

.tracks-container{
    position: relative;
}

.tracks-container .long-img-container p {
    font-size: 1.1em;
}

.tracks-container .long-img-container mark {
    background-color: transparent;
    font-size: 1.2em;
    color: #e96656;
}

.tracks-container .long-img-container span {
    position: relative;
    top: 5px;
    float: right;
    margin-left: 5px;
}

.tracks-container .long-img-container img.bicycle-icon {
    float: right;
}

.long-img-container{
    margin-bottom: 20px;
}

.showplaces-container{

}

#events-container-bg {
	//background-image: url(/img/commune/tlo_wydarzenia.jpg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.track, .event, .showplace{
    position: relative;
    padding-left: 2px;
    padding-right: 2px;
}

.object-desc {
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
}

.object-pic{
    position: relative;
    height: 250px;
    background-size: cover;
    background-position: center;
    border: 1px solid #dcdcdc;
    margin-bottom: 20px !important;
}

@media screen and (max-width: 767px){
    .showplace, .track, .event{
        text-align: left;
    }

    .object-pic{
        margin: auto;
        max-width: 400px;
    }
}

.category-label{
    position: absolute;
    display: block;
    bottom: 0px;
    left: 0px;
    right: 0px;
    margin: auto;
}

.category-label p{
    text-align: center;
    color: #fff;
    font-size: 1.4em;
    padding: 5px;
    background-color: rgba(0,0,0,0.1);
}

.category-map-icon{
    position: absolute;
    margin-bottom: 5px;
    margin-right: 5px;
    z-index: 5;
    right: 0px;
    bottom: 0px;
}

.more-btn-container{
    text-align: center;
    margin-top: 25px;
}

.more-btn{
    color: #fff;
    background-color: #e96656 !important;
    -webkit-transition: all linear .3s;
    -moz-transition: all linear .3s;
    -o-transition: all linear .3s;
    transition: all linear .3s;
    background: none;
    border: 0px;
    box-shadow: none !important;
    text-shadow: none !important;
    color: #fff;
    padding: 8px;
    border-radius: 3px;
}

.more-btn-container .more-btn:hover, .more-btn-container .more-btn:focus, .more-btn-container .more-btn:active{
    background-color: #e96656 !important;
}

/* /turistic objects */

#showplaces{
    position: relative;
    background-image: url(../img/commune/aparat.png);
    background-size: cover;
    background-position: center;
}

.bg-transp{
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,0.5);
}

.rooms{
    text-align: center;
    margin-bottom: 20px;
}

.rooms .rooms-part{
    display: inline-block;
}

.rooms .rooms-part p{
    margin: 0px;
}

.rooms-part.left span, .rooms-part.left img{
    display: inline-block;
    vertical-align: bottom;
    margin-bottom: 5px;
}

.rooms-part.left span{
    font-size: 3em;
    line-height: 40px;
    margin-left: 5px;
    color: #e96656;
}

.rooms-part.left p:nth-child(3){
    font-size: 0.7em;
}

.rooms-part.left p:nth-child(4){
    font-size: 1.3em;
}

.rooms-part.right{
    margin-left: 10px;
}

.rooms-part.right p{
    text-align: left;
}

.rooms-part.right .rooms-number{
    color: #e96656;
    font-size: 1.5em;
}

.rooms-part.right .rooms-desc{
    font-size: 0.7em;
}

#showplaces .round-item{
    text-align: center;
}

#showplaces .round{
    position: relative;
    width: 50px;
    height: 50px;
    background-color: rgba(255,255,255,0.6);
    border-radius: 50%;
    margin: auto;
    margin-bottom: 10px;
}

#showplaces .round span{
    position: absolute;
    width: 100%;
    left: 0px;
    top: 4px;
    font-size: 2em;
    color: #e96656;
    left: 0px;
    font-weight: 300;
}
/***** /CONTENT SECTION *****/


/***** FOOTER SECTION *****/
.footer-fluid{
    background-color: #fff;
    z-index: 1;
}

.footer{
    padding-top: 20px;
    border-top: 1px solid rgba(0,0,0,0.1);
    text-align: center;
}

.footer > * > i{
    font-size:2.2em;
    margin-bottom: 15px;
}

.footer > div{
    margin-bottom: 20px;
}

.footer > div:nth-child(1) i{
    color: #ef6b6b;
}

.footer > div:nth-child(2) i{
    color: #69c492;
}

.footer > div:nth-child(3) i{
    color: #41a6df;
}

.footer > div:nth-child(4) i{
    color: #ddd444;
}

#desc-fluid {
    border-top: 1px solid #d1d1d1;
    padding-top: 0px;
    background: #fff;
}

#website-desc {
    text-align: left;
}

#website-desc p{
	color: #adadad !important;
    font-size: .9em;
}

.langPanel-wrapper {
  padding-top: 10px;
  padding-right: 10px;
}
/***** /FOOTER SECTION *****/