/*
--------------------
Tablet
--------------------
*/ 



@media screen and (max-width: 1023px) {
   .wrapper {width: 768px; padding-left: 0; padding-right: 0;}
   .add-initiative .dodajbutton a{font-size: 20px;}
   .wyniki-wyszukiwania .dataTables_wrapper{width: 768px;}
}




/*
--------------------
Phone
--------------------
*/ 



@media screen and (max-width: 767px) {
   .wrapper {width: 100%;}

   header .wrapper{position: relative;}
   header .wrapper > .left,
   header .wrapper > .right {width: 100%; text-align: center;}
   header .wrapper > .left {padding-top: 65px;}
   header fieldset.left {float: none; width: 90%; margin: 0 5% 20px 5%; padding: 0;}
   header .login.right {position: absolute; top: 0; right: 10px;}

   .slider .wrapper {width: 90%; padding-left: 5%; padding-right: 5%;}
   .banner {text-align: center;}
   .banner h2 {font-size: 40px; margin-top: 20px;}
   .banner p {font-size: 20px; margin-top: 30px;}
   .banner h2,
   .banner p {position: inherit; text-align: center;}

   .banner .zarowka{background-position: center -85px; height: auto;}
   .banner .zarowka img{display: inherit;}
   .banner .zarowka h2{position: inherit; margin-top: 0; padding-top: 260px; text-align: center;}
   .banner .zarowka p.bottom,
   .banner .zarowka p{position: inherit; margin: 0; padding-top: 30px; text-align: center; width: 100%;}

   .banner .volunteer{height: auto; background-position: center bottom; padding-bottom: 220px;}
   .banner .volunteer h2{position: inherit; float: none;}
   .banner .volunteer p{position: inherit; float: none;}

   .add-initiative .dodajbutton a{font-size: 30px;}
   .add-initiative .sentence1,
   .add-initiative .sentence2,
   .add-initiative .dodajbutton{width: 100%; margin-bottom: 30px;}
   .add-initiative .sentence2{margin-bottom: 0;}

   .rank {padding-left: 30px; padding-right: 30px;}
   .rank h3 {text-align: center;}
   .rank ul {font-size: 20px; margin-bottom: 30px;}
   .rank .right {float: none; text-align: center;}

   .news {padding-left: 30px; padding-right: 30px;}
   .news .listnews{width: 100%; margin-bottom: 30px;}
   .news .listnews h3{text-align: center; margin-bottom: 20px;}
   .news .exclamation {width: 100%; text-align: center;}

   footer .funders {padding: 30px 0;}
   footer .funders .heading {text-align: center;}
   footer .funders .logos a{display: block; margin-bottom: 30px;}
   footer .funders .logos {padding-bottom: 0;}

   footer .social .sentence {margin-bottom: 15px; display: block; width: 100%; padding: 0;}
   footer .social .insider {width: 100%;}
   footer .social .insider .fb,
   footer .social .insider .tw {display: inline-block; float: none;}
   footer .social .insider .tw {padding-top: 5px;}
   footer .social .insider span a {display: inline-block;}

   footer .menu a{display: block; padding: 10px 0; border-bottom: 1px dashed #FFF;}
   footer .menu a.active,
   footer .menu a:hover {text-decoration: none; background-color: #C0E1FF; color: #5197ff;}

   section.login form{width: 100%;}
   section.login form input[type="text"],
   section.login form input[type="password"]{width: 80%; margin-left: 8%; margin-right: 8%;}
   section.login label{width: 100%; text-align: center; margin-bottom: 10px;}
   section.login .social .button.fb{margin-bottom: 30px;}
   section.login .social .button.goo{margin:0}

   section.static {padding: 30px 30px 0 30px;}
   section.static .right,
   section.static .left{ width: 100%; margin-bottom: 30px;}
   section.static input[type=text],
   section.static .select-wrap,
   section.static label{width: 100%; text-align: left;}
   section.static .button{float: none;margin: 0 auto; display: block;}

   /* Sections */
   .wyniki-wyszukiwania .wrapper{width: 90%; padding-left: 5%; padding-right: 5%;}
   .wyniki-wyszukiwania h2{text-align: center; overflow: hidden;}
   .wyniki-wyszukiwania .filters .display,
   .wyniki-wyszukiwania .filters .filter {margin: 0 0 30px 0; float: none;}
   .wyniki-wyszukiwania .filters div p{
      display: block;
      width: 100%;
      margin-left: 0;
      margin-right: 0;
      padding-left: 0;
      padding-right: 0;
   }
   .wyniki-wyszukiwania .filters div p.d5,
   .wyniki-wyszukiwania .filters div p.finicjatywy {
      border-radius: 5px 5px 0 0;
      border-left: 2px solid #339966;
      border-right: 2px solid #339966;
      border-top: 0 none;
      border-bottom: 0 none;
   }
   .wyniki-wyszukiwania .filters div p.d20,
   .wyniki-wyszukiwania .filters div p.fmiasta {
      border: 2px solid #339966;
   }
   .wyniki-wyszukiwania .filters div p.d50,
   .wyniki-wyszukiwania .filters div p.fuzytkownicy{
      border-radius: 0 0 5px 5px;
      border-left: 2px solid #339966;
      border-right: 2px solid #339966;
      border-top: 0 none;
      border-bottom: 2px solid #339966;
   }
   .wyniki-wyszukiwania .heading{padding-bottom: 0;}
   .wyniki-wyszukiwania .dataTables_wrapper{width: 90%;}
   .wyniki-wyszukiwania .item .thumbnail{width: 30%; padding: 0; vertical-align: middle; text-align: center;}
   .wyniki-wyszukiwania .item .description{width: 70%; padding: 0;}

   .wyniki-wyszukiwania .item .description .title{padding-bottom: 25px;}
   .wyniki-wyszukiwania .item .description .miasto,
   .wyniki-wyszukiwania .item .description .dodano,
   .wyniki-wyszukiwania .item .description .autor,
   .wyniki-wyszukiwania .item .description .signatures,
   .wyniki-wyszukiwania .item .description .comments{display: block; width: 100%; padding-bottom: 4px;}
   .wyniki-wyszukiwania .dataTables_wrapper a {padding: 10px;}
   .miasto h2, .wyniki-wyszukiwania h2 {text-align: center;}
   .dataTables_wrapper {width: 100%;}
   .panel .settings input[type="email"], .panel .settings input[type="text"], .panel .settings input[type="password"]{ width: 190px; }
   .panel .settings .fb .fblink {display: block; margin-top: 10px; margin-bottom: 10px; text-align: center;}
   .filter p.first{border-radius: 5px 5px 0 0; border-bottom: 0 none!important;}
   .filter p.mid{border-left: 2px solid #339966!important; border-right: 2px solid #339966!important;}
   .filter p.last{border-radius: 0 0 5px 5px; border-top: 0 none!important;}
   .autor .button{display: block; margin-top: 10px; padding: 10px; text-align: center;}

   .miasto-lider .okreg,
   .miasto-lider .fanpage,
   .miasto-lider .lider{float: none; width: 100%; text-align: center;}
   .miasto-lider .fanpage div{float: none;}
   .add-initiative{padding: 60px 0 25px 0;}
   .add-initiative .button{font-size: 20px;}

   .miasto .filters div p.fdata{border-radius: 5px 5px 0 0; border-bottom: 0 none;}
   .miasto .filters div p.fautor,
   .miasto .filters div p.fabc{border-left: 2px solid #339966; border-right: 2px solid #339966; border-bottom: 0 none;}
   .miasto .filters div p.fsignature{border-radius: 0 0 5px 5px}
   .miasto .filters div p.fasc{border-radius: 5px 5px 0 0;}
   .miasto .filters div p.fdesc{border-radius: 0 0 5px 5px;}
   .miasto .search input{margin: 0;}

   .idea .idea-content{float: none;width: 90%; padding-left: 5%; padding-right: 5%;}
   .idea .idea-content h4.doc, .idea .idea-content h4.img, .idea .idea-content h4.video{text-align: center;}
   .idea .attachments .youtube, .idea .attachments .vimeo,
   .miniatura {display: block; margin: 0 auto; width: 200px; float: none;}
   .idea .idea-comments{margin-top: 60px; margin-left: 0; float: none;width: 90%; padding-left: 5%; padding-right: 5%;}
   .idea .idea-comments .heading h4{margin-bottom: 15px;}
   .idea .idea-comments .icons{float: left;}
   section.login .bottom_options .button {display: block; margin: 20px 25% 0 25%; }
   section.login .social .button.fb {margin-right: 0;}
}



/* ====== Ranges ======== */

@media screen and (max-width: 767px) {
   .show-phone{display: inherit; visibility: visible;}
   .hide-phone{display: none; visibility: hidden;}
   .expander{display: none;}
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
   .show-tablet{display: inherit; visibility: visible;}
   .hide-tablet{display: none; visibility: hidden;}
}

@media screen and (min-width: 1024px) {
   .show-desktop{display: inherit; visibility: visible;}
   .hide-desktop{display: none; visibility: hidden;}
}