.czysc{clear:both;}
.centro {text-align: center; }
.srodek {margin:auto; }

body {	font-family: 'Signika', Tahoma,Helvetica,Arial CE,sans-serif; font-size:17px;  line-height: 1.55em; 	text-align: center;	background: #eee;}
.text-justify { text-indent: 2em; margin-bottom:1.5rem; }
.tekst {text-align: left;	color: #666;	position:0 155px; margin-left: 8px; }
.tekst ul li {list-style-type: square; margin:0 0 0 10px; }
ul, label {  margin: 0;    padding: 0;}
ul {  text-align: left;	}

a { text-decoration:none; color: #777;}
a:hover { color: #f93;}

h1,  h2  {margin-bottom:1.5em; }
h3   { margin-bottom:1em; }
h4,  h5   { margin-bottom:1em; }

h1 {color:#f93;}
h2 {margin-top:1.5em; color:#f93;}
h3 {margin-top:1.3em; color:#f93;}
h4 {margin-top:1.1em; color:#f93;}
h5 {font-weight: 700; margin-top:1.5em; font-size: 1.1em;}
h6 {	font-weight: 700; 	color: #f93; 	font-size: 2.2em;}

p {padding-bottom:1em;}
p.italic {  font-style: italic;}
p.oblique {  font-style: oblique;}
p.just { text-align: justify;}
li {	line-height: 1.85em; padding-left: 1rem; margin-left: 1rem; list-style-position: inside;}

/*   ---obrazki img-- */
.img-responsive, .skaluj-img { display: block; max-width: 100%; height: auto;}

.nowiny > ul > li {list-style-type: none; }
.nowiny {padding:0 10px;}

.odsun-tekst{}
.bezwciec{margin-top:12px; text-align: justify; text-indent: 0; }
.contener {padding:1rem;}
#container  {padding:2rem; }
#zawartosc p{margin-top:10px; font-size: small; text-align: justify; text-indent: 3em; }
#zawartosc .bezwciec{margin-top:12px; text-align: justify; text-indent: 0; }

.podpis {width:100% ; display: block;  margin:-30px 0 0 0; font-size: smaller; font-style: italic;  color:#999; text-align:right; border-bottom: 1px solid #f93;}

.ogloszenie {background:#f93; color:#fff;}
.ogloszenie h4{margin-top:0; color:#fff;}
div .ogloszenie {margin-top:10px;padding:10px}
.skaluj-img {display: block; max-width: 100%; height: auto;}

/*   ---top-- */
.header { padding: 0; }


.ciemny {background: #f93; border-bottom: 1px solid #db8127;}
.ciemny p {color:#fff; margin-top:4px; font-size:1.4em;}
.ciemny div {padding:10px 15px 0 15px;}
.ciemny h1 {color: #eee; font-size:1.6em; margin: 0 auto 24px auto; }
.bialy {background:#fff; margin-top: -22px;}

.oferta, .oferta2 {width: 15%; height:236px; margin:1rem 5%; float:left; } 
.oferta img, .oferta2 img {padding-bottom:1rem; }
@media screen and (max-width: 900px)
{.oferta, .oferta2 {width: 20%; margin:1rem 9%; float:left; }}
@media screen and (max-width: 600px)
{.oferta, .oferta2 {width: 45%; margin:0.75rem 9%; float:left; }}

/*   ---footer -- */
footer { position:relative;  background-color:#fff }
footer .wrapper { padding-top:95px; padding-bottom:60px; margin-right:auto; margin-left:auto; display:flex; flex-flow:row wrap; justify-content:space-between; align-items:flex-start}
@media screen and (min-width:700px) and (max-width:1250px) { footer .wrapper {  width:100%;  padding-right:50px;  padding-left:50px }}
@media screen and (max-width:700px) {
 footer .wrapper {  width:100%;  padding-right:25px;  padding-left:25px }
}
@media screen and (min-width:1250px) {
 footer .wrapper {  width:1200px }
}
footer .logo { width:120px; display:block}
footer .logo svg { width:100%}
footer .container-list { display:flex; flex-flow:row wrap; align-items:flex-start}
footer .container-list ul { width:120px; list-style:none}
footer .container-list ul:not(:last-child) { margin-right:60px}
footer .container-list ul li:not(:last-child) { margin-bottom:8px}
footer .container-list ul li a { text-decoration:none; color:#7b7b7b; transition:all .25s ease}
@media screen and (min-width:2000px) {
 footer .container-list ul li a {  font-size:14px;  line-height:21px }
}
@media screen and (min-width:1250px) and (max-width:2000px) {
 footer .container-list ul li a {  font-size:14px;  line-height:21px }
}
@media screen and (min-width:700px) and (max-width:1250px) {
 footer .container-list ul li a {  font-size:14px;  line-height:21px }
}
@media screen and (max-width:700px) {
 footer .container-list ul li a {  font-size:14px;  line-height:21px }
}
@media screen and (min-width:700px) and (max-width:1250px) {
 footer .logo {  width:180px }
 footer .container-list ul:not(:last-child) {  margin-right:20px }
 footer .container-contact {  margin-top:35px }
}
@media screen and (max-width:700px) {
 footer .wrapper {
  padding-top:45px;
  border:none
 }
 footer .wrapper:before {
  content:"";
  background-color:#eaeaea;
  position:absolute;
  left:50%;
  top:0;
  height:1px;
  width:calc(100% - 50px);
  transform:translateX(-50%)
 }
 footer .logo {
  width:130px
 }
}
footer .logo { width:195px;  display:block; margin-bottom: 60px;}

footer .container-list {
 display:flex;
 flex-flow:row wrap;
 align-items:flex-start
}
footer .container-list ul {
 width:120px;
 list-style:none
}
footer .container-list ul:not(:last-child) {
 margin-right:60px
}
footer .container-list ul li:not(:last-child) {
 margin-bottom:8px
}
footer .container-list ul li a {
 text-decoration:none;
 color:#7b7b7b;
 transition:all .25s ease
}
@media screen and (min-width:2000px) {
 footer .container-list ul li a {
  font-size:14px;
  line-height:21px
 }
}
@media screen and (min-width:1250px) and (max-width:2000px) {
 footer .container-list ul li a {
  font-size:14px;
  line-height:21px
 }
}
@media screen and (min-width:700px) and (max-width:1250px) {
 footer .container-list ul li a {
  font-size:14px;
  line-height:21px
 }
}
@media screen and (max-width:700px) {
 footer .container-list ul li a {
  font-size:14px;
  line-height:21px
 }
}
footer .container-list ul li:hover a {
 color:#101010
}

.copyright{color:#777; font-size: smaller; }


/*-- social-icons --*/

.soc-icon {display: flex; justify-content: flex-end; flex-wrap: wrap; margin-top: -8px;}
.soc-icon div {margin:0 0.7rem; padding:0; }
.soc-icon div a {display: inline-block;	width: 28px;	height: 28px;  }

/*   ---logo----------------------------------------------------------  */
.navbar-brand  p {    line-height: 1em;    font-size: 1.0em;    text-align: left;   padding: 14px 0 0 65px;}
.navbar-brand span {color: #f93; padding: 6px 0 0 0;}

/*   ---nav-----------------------------------------------------------  */
.header-bottom {    position: relative;  }
.navbar-default {    border-color: #fff;     padding: 2em 0;}
.navbar-default .navbar-collapse, .navbar-default .navbar-form {    border: 0 solid   #fff;}
.navbar-brand {    padding: 0 0 0 1em;    background: url(/img/logo-tworze_com1.svg) no-repeat;    height: 65px;}


/*-- nav-effect --*/
.cl-effect-1 a::before, .cl-effect-1 a::after {	display: inline-block;	opacity: 0;	-webkit-transition: -webkit-transform 0.3s, opacity 0.2s;	-moz-transition: -moz-transform 0.3s, opacity 0.2s;	transition: transform 0.3s, opacity 0.2s;}
.cl-effect-1 a::before {	margin-right: 10px;	content: '[';	-webkit-transform: translateX(20px);	-moz-transform: translateX(20px);	transform: translateX(20px);}
.cl-effect-1 a::after {	margin-left: 10px;	content: ']';/*-- w3layouts --*/	-webkit-transform: translateX(-20px);	-moz-transform: translateX(-20px);	transform: translateX(-20px);}
.cl-effect-1 a:hover::before,
.cl-effect-1 a:hover::after,
.cl-effect-1 a:focus::before,
.cl-effect-1 a:focus::after,.navbar-nav li.active a::before,.navbar-nav li.active a::after,
.navbar-nav li.active a:focus::before,
.navbar-nav li.active a:focus::after{	opacity: 1;	-webkit-transform: translateX(0px);	-moz-transform: translateX(0px);	transform: translateX(0px);}

.navbar-default {    background: none; border: none;}
.navbar {    margin-bottom: 0;}
.navbar-collapse {    padding: 0;    box-shadow: none;}
.navbar-default .navbar-collapse, .navbar-default .navbar-form {    border: none;}
.navbar-nav {    float: left;    margin:0 0 0 10em;}
.navbar-default .navbar-brand,.navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus {    color: #212121;}
.navbar-brand > p{ line-height: 1em;    font-size: 1.0em;    text-align: left;    padding-left: 61px;}
.navbar-brand span {color: #f93;}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {    background: none;	color:#f93;}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus, .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus  {    color:#f93;}
.open .dropdown-menu > li > a:hover, .open .dropdown-menu > li > a:focus  {    color:#f93;}
.navbar-default .navbar-nav .open .dropdown-menu>li> a:focus, .navbar-default .navbar-nav .open .dropdown-menu>li> a:hover{    color: #f93;}
.navbar-nav > li > a {    font-size: 14px;    text-transform: uppercase;    padding: 20px 15px 0;}

/*-- service-breadcrumb --*/
.breadcrumb{background:none; padding-top:2px; border-bottom:1px solid #ddd; border-radius: 0; margin-bottom: 3em;}
.breadcrumb_left{	float:left;}
.breadcrumb_left ul {    padding: .5em 0 0;}
.breadcrumb_left ul li{	display:inline-block;	color:#999;	font-size:0.9em;}
.breadcrumb_left ul li i{	padding:0 1.5em;}
.breadcrumb_left ul li a{	color: #999;	text-decoration:none;}
.breadcrumb_left ul li a:hover{	color: #f93;}
.breadcrumb_left h3{	font-size:1.5em;	color: #f93; margin:0;}

/* --- kolumna news ---- */
div .fotoblog-new {border-bottom:2px solid #f93; margin:10px auto; padding:0 0 10px 0;}
.fotoblog-new h3 { margin-top:1.3em; color:#f93;}

/* --- podgląd grafiki powiększenie ---- */
#grafika-poglad {margin:0 auto; text-align: left;}

/* --- lalki wyjątki ---- */
.obrazki-dystans img{margin:17px 17px 0 0;}

/* --- pędzle photoshop wyjątki ---- */
#pobierz-pedzelki {height: 26px; margin:26px 0 0 0; background: url(/img/download-brushes.gif) top left no-repeat; position: relative;  padding:0 0 0 28px; font-size:13px; }
#pobierz-pedzelki a{position: relative;  top:5px; font-weight: 800; }
#pobierz-pedzelki a:hover{color:#000; }
#pobierz-pedzelki:hover {background: url(/img/download-brushes.gif) bottom left no-repeat;  }

/* --- mega portfolio wyjątki ---- */
.d-plastyk {margin:20px 0 0 0; color:#999; border-bottom:2px dotted #999; position: relative;}
.d-plastyk .numer {width: 80px; height: 80px;  border-radius: 15px; background-color: rgba(255, 255, 255, 0.3); float: right;  display: block;   margin-bottom: 1rem; }
.d-plastyk .numer span{display: block; position: absolute; top:32px; width: inherit;  text-align: center; font-size:42px; }
.d-plastyk img{  }
.nav-justified a{font-size:1.8rem;}
#folio  {width:500px; height: 128px; padding:100px 0 0 0; background: url(/grafika/portfolio-top.jpg) top left no-repeat; position: relative;}
#folio a {text-decoration:none; font-size:x-large; }
#folio .margin-r {margin:0 9px 0 2px }

/*gallery   */
.gallery {  overflow: hidden; margin-bottom:16px;  border: 1px solid #eee; }
div.gallery:hover {  border: 1px solid #777;}
div.gallery img {  width: 100%;  height: auto;}
div.desc {  padding: 15px;  text-align: center;}

.gallery a{display: block;  position: relative; padding-top: 100%; background-color: white;  position: relative;}
.gallery img{position:  absolute;  top: 0;   text-align: center;}
.desc a {display: initial; background: none}

.gallery a{  position: relative;   width: 100%;  height: 0;  padding-top: 100%; }

.gallery a img {  position: absolute;  top: 50%;   left: 50%;  transform: translate(-50%, -50%);   width: auto;  height: auto;   max-width: 100%;   max-height: 100%;  }

.gallery a { background: linear-gradient(#eeece0, #d5d3c7);}
.gallery .desc a {  background: none;}

div.srodek {  display: flex;  justify-content: center;}

/* --- inne wyjątki ---- */
.wspolpraca { max-width: 500px;    margin: auto;}
.wspolpraca img{ vertical-align: bottom; float:left;  margin:6px 16px 0 0;}
.wspolpraca span{color:#777;}

input[type="button"], input[type="reset"], input[type="submit"] { background-color: #f93;  padding: 0.75rem 2rem; border: 0; margin-top: 1em;}

.imgcontener {border-radius: 25px; padding: 20px; width: 90%; height: max-content;text-align: center; background-color:#fff; Margin:1em 0;}
.imgcontener img {  width: 100%;  max-width: max-content;  display: table-cell;}

.grupa-miniatur {display: inline-flex; flex-wrap: wrap;}
.grupa-miniatur div {margin: 2em;}

.grupa-na-stronie {display: inline-flex; flex-wrap: wrap; align-content: flex-start}
.grupa-na-stronie svg {margin:10px 1rem;}
.grupa-na-stronie div {margin-bottom:2rem;}
.grupa-n {}
.grupa-n img {min-width:300px;  height: auto; padding:0 2em 0 1rem;}

.link-dalej {  display: inline-block;  height: 2rem;  line-height: 2rem;}
.link-dalej  .arrow-icon {  position: relative;  top: -1px;  transition: transform 0.3s ease;  vertical-align: middle;}
.link-dalej  .arrow-icon--circle {  transition: stroke-dashoffset 0.3s ease;  stroke-dasharray: 95;  stroke-dashoffset: 95;}
.link-dalej:hover .arrow-icon {  transform: translate3d(5px, 0, 0);}
.link-dalej:hover .arrow-icon--circle {  stroke-dashoffset: 0;}