/* @import url(https://fonts.googleapis.com/css?family=Raleway:400,300,500,600,700,800,900,100,200); */

@import url('https://fonts.googleapis.com/css?family=Raleway:100,200,300,400,500,600,700,800,900&subset=latin-ext');

body{
    font-family: 'Raleway', sans-serif;
    font-size:14px;
    font-weight: 400;
    overflow-y:scroll;
    -webkit-font-smoothing: antialiased;
}

::selection {
    background: #000;
    color: #fff;
    text-shadow: none;
}

::-moz-selection {
    background: #000;
    color: #fff;
    text-shadow: none;
}

p{
    font-family: 'Raleway', sans-serif;
    font-size:14px;
    font-weight: 400;
}

a{
    text-decoration:none;
    -webkit-transition: all 0.2s ease-in;
    -moz-transition: all 0.2s ease-in;
    -ms-transition: all 0.2s ease-in;
    -o-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in; 
    border-bottom:1px solid #dedede;
}

a:focus {
    outline:none;
}

strong{
    font-weight:700;

}

/*
**************************
PRELOADER
**************************
*/

.preloader{
    position:fixed;
    top:0;
    width:100%;
    height:100%;
    background:white;
    z-index:999;
}

.preloader .item{
    position:absolute;
    width:50px;
    height:50px;
    left:50%;
    top:50%;
    margin-left:-25px;
    margin-top:-25px;
} 

.spinner {
    width: 40px;
    height: 40px;
    margin: 0px auto;
    background-color: #333;
    border-radius: 100%;  
    -webkit-animation: scaleout 1.0s infinite ease-in-out;
    animation: scaleout 1.0s infinite ease-in-out;
}

@-webkit-keyframes scaleout {
    0% { -webkit-transform: scale(0.0) }
    100% {
        -webkit-transform: scale(1.0);
        opacity: 0;
    }
}

@keyframes scaleout {
    0% { 
        transform: scale(0.0);
        -webkit-transform: scale(0.0);
    } 100% {
        transform: scale(1.0);
        -webkit-transform: scale(1.0);
        opacity: 0;
    }
}





/*
**************************
NAVIGATION OPACITY
**************************
*/



.opacity-nav{
    position:fixed;
    display:none;
    width:100%;
    height:100%;
    top:0;
    z-index:9999;
    background:rgba(0,0,0,0.95);
}

ul.menu-fullscreen{
    width: 100%;
    top: 50%;
    position: absolute;
    height: 280px;
    margin-top: -140px;
}

ul.menu-fullscreen li{
    font-size:35px;
    text-align:center;
    line-height:70px;
    font-weight:500;
}

ul.menu-fullscreen li > a{
    color:#999999;
    border:0;
}

ul.menu-fullscreen li > a:hover{
    color:#ffffff;
}


#full{
    width:1140px;
    position: relative;
    top:0;
    margin:0 auto;
    z-index: 9997;
}


#fullscreen{
    display:none;
    position:absolute;
    top:0;
    width:100%;
    margin:0 auto;
    height:80px;
    z-index: 9998;
}

/*
**************************
HEADER
**************************
*/

header.boxed{
    position:fixed;
    width:100%;
    margin:0 auto;
    height:80px;
    z-index:9999;
    display:none;
    background:none;
    top:0;
    -webkit-transition: background 0.2s ease-in;
    -moz-transition: background 0.2s ease-in;
    -ms-transition: background 0.2s ease-in;
    -o-transition: background 0.2s ease-in;
    transition: background 0.2s ease-in; 
}

header.boxed .header-margin{
    width:1140px;
    margin:0 auto;
}

header.boxed .header-margin-mini{
    width:90%;
    margin:0 auto;
}


ul.social-icon{
    float:right;
}

ul.social-icon a{
    float:right;
    font-size:15px;
    border-bottom:0;
    color:black;
    padding-right:0px !important;
}

ul.social-icon a:hover{
    color:#c3c3c3;
}

.menu-index{
    position: fixed;
    right: 5%;
    top: 30px;
    z-index: 99999;
    padding:20px;
    background:black;
    cursor:pointer;
}

@media screen and (max-width: 380px) {
    .menu-index {
        padding: 10px;
    }
}


.menu-index i{
    float:right;
    font-size:18px;
    color:white;
    padding-right:0px !important;
}

.menu-index i:hover{
    color:#c3c3c3;
}


ul.menu-icon{
    float:right;
}

ul.menu-icon a{
    float:right;
    font-size:19px;
    color:white;
    padding-right:0px !important;
}

ul.menu-icon i{
    padding:20px;
    background:black;
}

ul.menu-icon a:hover{
    color:#c3c3c3;
}

header a{
    color:#000000;
}

ul.header-nav{
    width:60%;
    float:left;
}

header .logo > a{
    font-size:23px;
    font-weight:800;
    float:left;
    line-height:80px;
    padding-right:40px;
    border-bottom: 1px solid #f1f1f1;
}

header .logo > a:hover{
    color:#c3c3c3;
}

header li{
    text-transform:uppercase;
    list-style-type: none; margin: 0 auto; float: left;
}

header li > a{
    font-size:13px;
    color:#c3c3c3;
    padding-right:25px;
    padding-left:25px;
    font-weight:800;
    line-height:80px;
    display:inline-block;  
    border-bottom:0;
}

header li > a:hover{
    color:#000000;
}

header li > a #active{
    color:#000000;
}

header li ul{
    overflow: hidden; display: none; background: #f9f9f9; z-index:20;
}

header li ul li a{
    line-height:50px;
    padding-left:30px; 
    width:260px;
}

header li:hover ul{
    position: absolute; padding: 0; display: block; width: 260px;
}



/*
**************************
CONTENT
**************************
*/

.hero-image{
    position:relative; 
    width:100%; 
    top:0; 
    height:400px; 
    background: url('../img/full/full.jpg') center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;  

}

.one-column{
    width:40%;
    position:relative;
    float:left;
}

.two-column{
    width:60%;
    position:relative;
    float:left;
}

.one-column p{
    width:70% !important;
}

.two-column p{
    width:100% !important;
}

.three-column p{
    width:100% !important;
}

.clear{
    clear:both;
}

.content{
    position:relative;
    width:1140px;
    margin:50px auto;
}


.content .text-intro{
    width: 1140px;
    margin-top: 150px;
    margin: 150px auto 0;
}

.content .text-intro h1{
    font-size:38px;
    width:40%;
    text-transform:uppercase;
    color:#000000;
    font-weight:900;
    line-height:70px;
}

.content .text-intro p{
    font-size:13px;
    color:#8d8d8d;
    margin-top:30px;
    font-weight:400;
    line-height:22px;
    letter-spacing:1px;
    width:40%;
}

.typed-cursor{
    opacity: 1;
    font-weight: 900;
    -webkit-animation: blink 0.7s infinite;
    -moz-animation: blink 0.7s infinite;
    -ms-animation: blink 0.7s infinite;
    -o-animation: blink 0.7s infinite;
    animation: blink 0.7s infinite;
}
@-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-webkit-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-moz-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-ms-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-o-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}

/*
**************************
HOME SIDEBAR
**************************
*/

.home-sidebar{
    top:0;
    position:absolute;
    width:33.3333%;
    right:0;
    height:100%;
    background:#f4f4f4;
    z-index:9;
    overflow:hidden;
    background-size:100%;
}

.parallax{
    position:absolute;
}

.parallax-option{
    position:absolute; width:100%; height:100%;
}

/*
**************************
PORTFOLIO GRID
**************************
*/

.prev-next{
    width:100%;
    max-width:1170px;
    margin:0 auto;
    padding-top:100px;
}

.prev-next a{
    color:black;
    font-weight:500;
    padding-bottom: 15px;
}

.prev-next a:hover{
    border-bottom:1px solid black;
}

.prev-button{
    width:50%;
    position:relative;
    float:left;
    text-align:left;
}

.next-button{
    width:50%;
    position:relative;
    float:left;
    text-align:right;
}


#ajax-content{width:100%;}

.portfolio-grid{
    width:1170px;
    position:relative;
    margin: 30px auto;
    overflow:hidden;
}

#portfolio-sidebar{
    width: 780px !important;
    padding-right: 390px;

}

li.grid-item{
    width:360px;
    position:relative;
    float:left;
    padding:15px;
}

.grid-hover{
    position: absolute;
    width:360px;
    height: 100%;
    top:0;
    background: white;
    z-index: 2;
    opacity: 0;
    -webkit-transition: all 0.2s ease-in;
    -moz-transition: all 0.2s ease-in;
    -ms-transition: all 0.2s ease-in;
    -o-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in; 
}

.grid-hover:hover{
    opacity: 0.9;
}

.grid-hover h1{
    font-size:16px;
    bottom:80px;
    left:40px;
    position:absolute;
    text-transform:uppercase;
    color:#000000;
    letter-spacing:1px;
    font-weight:900;
    line-height:50px;
}

.grid-hover p{
    font-size:13px;
    bottom:40px;
    left:40px;
    position:absolute;
    color:#686868;
    letter-spacing:1px;
    font-weight:400;
    line-height:50px;
}

li.grid-item img{
    width:360px;
}

/*
**************************
FOOTER
**************************
*/

#footer-box{height:150px; margin-top:75px;}

footer{
    background: #f1f1f1;
    width:100%;
/*    margin-top:150px;*/
    height:300px;
    overflow:hidden;
    position:relative;
    z-index:10;
}

.footer-margin{
    width:1140px;
    margin: 30px auto;
    line-height: 100px;
}

#footer-left{text-align:left;}

.footer-margin .copyright{
    color: #686868;
    letter-spacing: 1px;
    font-size: 12px;
    width: 100%;
    text-align:center;
    float: left;
}

.footer-margin .social-footer{
    color: #686868;
    letter-spacing: 1px;
    font-size: 13px;
    width: 100%;
    text-align:center;
    float: left;
}

.footer-margin .social-footer a{
    font-size:15px;
    color:black;
    padding: 20px;
}

.footer-margin .social-footer a:hover{
    color:#c3c3c3;
}


/*
**************************
CONTACT
**************************
*/

.contact-one, .contact-two{
    width:30%;
    padding-right:3%;
    position:relative;
    float:left;
}

.contact-three{
    width:33%;
    position:relative;
    float:left;
}

.contact-one p, .contact-two p, .contact-three p{
    width:100% !important;
}

input{

    width:100%;
    height:40px;
    background:#f8f7f7;
    border:0;
    color:#000000;
    font-weight:500;
    line-height:40px;
    font-family: 'Raleway', sans-serif;
    margin-bottom:10px;
    font-size:13px;
    padding-left:15px;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

input.button-submit{

    width:220px;
    height:40px;
    background:#f8f7f7;
    font-weight:500;
    border:0;
    font-family: 'Raleway', sans-serif;
    color:#000000;
    float:right;
    font-weight:900;
    line-height:40px;
    font-size:13px;
}

input:focus{
    background:#f4f4f4; 
}

textarea{

    width:100%;
    height:40px;
    border:0;
    line-height:40px;
    background:#f8f7f7;
    color:#000000;
    font-size:13px;
    font-family: 'Raleway', sans-serif;
    font-weight:500;
    margin-bottom:10px;
    padding:0 0 0 15px;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    -webkit-transition: all 0.2s ease-in;
    -moz-transition: all 0.2s ease-in;
    -ms-transition: all 0.2s ease-in;
    -o-transition: all 0.2s ease-in;
    transition: all 0.2s ease-in; 
}

textarea:focus{background:#f4f4f4; height:250px;}




/*
**************************
additional settings
**************************
*/

.justify {
    text-align: justify;
    text-justify: inter-word;
}

.contactContent {
    color: #000000;
    font-size: 23px;
    font-weight: 400;
    float: left;
    line-height: 40px;
    padding-right: 40px;
    padding-bottom: 100px;
}

.footerLink,
.footerLink:focus,
.footerLink:active,
.footerLink:visited
{
    color: black;
    font-size: 13px;
    background: transparent;
    transition: all 1s;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    -o-transition: all 1s;
}
.footerLink:hover {
    font-size:15px;
    color:black;
    padding: 20px;
    color: #c3c3c3;
}

.phoneMail {
    color: #000000;
    font-size: 23px;
    font-weight: 400;
    float: left;
    padding-right: 40px;
    border-bottom: none;
}

.underline {
    position: relative;
    color: #000;
}

.underline:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    bottom: 2px;
    left: 0;
    background-color: #dedede;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

.underline:hover:before {
    visibility: visible;
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}
.fa-navicon:before, .fa-reorder:before, .fa-bars:before {
    content: "\f0c9";
}

/*TAGS*/

.tags {
    font-size: 12px;
    margin: 25px;
    list-style: none;
    margin: 0;
    overflow: hidden;
    padding: 0;
}

.tags li {
    float: left;
}

.tag {
    background: #eee;
    border-radius: 3px 0 0 3px;
    color: #999;
    display: inline-block;
    height: 26px;
    line-height: 26px;
    padding: 0 20px 0 23px;
    position: relative;
    margin: 0 10px 10px 0;
    text-decoration: none !important;
    -webkit-transition: color 0.2s;
}

.tag::before {
    background: #fff;
    border-radius: 10px;
    box-shadow: inset 0 1px rgba(0, 0, 0, 0.25);
    content: '';
    height: 6px;
    left: 10px;
    position: absolute;
    width: 6px;
    top: 10px;
}

.tag::after {
    background: #fff;
    border-bottom: 13px solid transparent;
    border-left: 10px solid #eee;
    border-top: 13px solid transparent;
    content: '';
    position: absolute;
    right: 0;
    top: 0;
}

.tag:hover {
    background-color: crimson;
    color: white;
}

.tag:hover::after {
    border-left-color: crimson; 
}


/*mapa google wymaga lepszego ustawienia na stronie*/

@media (max-width: 800px) {
    .map {
        width:320px;
        height: 350px;
    }
}
/*@media (max-width: 800px) {
    .map {
        width:350px;
        height: 350px;
    }
}*/

/***co-workers***/

/*.center {
    text-align: center;
    color: #8d8d8d;
    font-size: 13px;
    letter-spacing: 1px;
}

.whoiswho {
    padding: 0;
    margin: 0;
    list-style: none;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-wrap: wrap; FF
    justify-content: space-around;
}

.whoiswho li{
    background-color: rgba(0,0,0,0.1);
    padding: 00px;
    margin: 45px;
    font-weight: 400;
    color: #8d8d8d;
    font-size: 13px;
    letter-spacing: 1px;
    text-align: center;
}

.whoiswho li i {
    display: block;
    margin-top: 10px;
}

.whoiswho li:before{
    display:block;
    border-radius: 50%;
    width: 160px;
    height: 160px;
    content:" ";
    border: 5px solid RGBA(238, 238, 238, 1); you could play with the transparency
    margin: 0 auto;
    margin-bottom: 20px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 150%;
}

 in case or diff pic/person
.whoiswho li.personA:before {
  background-image: url("");
}

.whoiswho li:before {
    background-image: url("http://cdn.grindtv.com/wp-content/uploads/2013/09/cookiemonster.jpeg");
}*/




.at-section__title {
  margin: 0 0 70px;
  margin-top: 30px;
  color: #000;
  font-size: 2.7rem;
  font-weight: 300;
  line-height: 2.625rem;
  text-align: center;
}
.at-grid {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  background: #fff;
  border: 1px solid #e2e9ed;
}
.at-grid[data-column="1"] .at-column {
  width: 100%;
  max-width: 100%;
  min-width: 100%;
  flex-basis: 100%;
}
.at-grid[data-column="2"] .at-column {
  width: 50%;
  max-width: 50%;
  min-width: 50%;
  flex-basis: 50%;
}
.at-grid[data-column="3"] .at-column {
  width: 33.3333333333%;
  max-width: 33.3333333333%;
  min-width: 33.3333333333%;
  flex-basis: 33.3333333333%;
}
.at-grid[data-column="4"] .at-column {
  width: 25%;
  max-width: 25%;
  min-width: 25%;
  flex-basis: 25%;
}
.at-grid[data-column="5"] .at-column {
  width: 20%;
  max-width: 20%;
  min-width: 20%;
  flex-basis: 20%;
}
.at-grid[data-column="6"] .at-column {
  width: 16.6666666667%;
  max-width: 16.6666666667%;
  min-width: 16.6666666667%;
  flex-basis: 16.6666666667%;
}
.at-grid[data-column="7"] .at-column {
  width: 14.2857142857%;
  max-width: 14.2857142857%;
  min-width: 14.2857142857%;
  flex-basis: 14.2857142857%;
}
.at-grid[data-column="8"] .at-column {
  width: 12.5%;
  max-width: 12.5%;
  min-width: 12.5%;
  flex-basis: 12.5%;
}
.at-grid[data-column="9"] .at-column {
  width: 11.1111111111%;
  max-width: 11.1111111111%;
  min-width: 11.1111111111%;
  flex-basis: 11.1111111111%;
}
.at-column {
  z-index: 0;
  position: relative;
  background: #fff;
  box-shadow: 0 0 0 1px #e2e9ed;
  padding: 10px;
  box-sizing: border-box;
  transition: box-shadow 0.2s ease, z-index 0s 0.2s ease, -webkit-transform 0.2s ease;
  transition: box-shadow 0.2s ease, transform 0.2s ease, z-index 0s 0.2s ease;
  transition: box-shadow 0.2s ease, transform 0.2s ease, z-index 0s 0.2s ease, -webkit-transform 0.2s ease;
}
.at-column:before {
  content: "";
  display: block;
  padding-top: 100%;
}
.at-column:hover {
  z-index: 1;
  box-shadow: 0 8px 50px rgba(0, 0, 0, 0.2);
  -webkit-transform: scale(1.05);
          transform: scale(1.05);
  transition: box-shadow 0.2s ease, z-index 0s 0s ease, -webkit-transform 0.2s ease;
  transition: box-shadow 0.2s ease, transform 0.2s ease, z-index 0s 0s ease;
  transition: box-shadow 0.2s ease, transform 0.2s ease, z-index 0s 0s ease, -webkit-transform 0.2s ease;
}
.at-column:hover .at-social {
  margin: 16px 0 0;
  opacity: 1;
}
@media (max-width: 800px) {
  .at-column {
    width: 50% !important;
    max-width: 50% !important;
    min-width: 50% !important;
    flex-basis: 50% !important;
  }
}
@media (max-width: 600px) {
  .at-column {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 100% !important;
    flex-basis: 100% !important;
  }
}
.at-user {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  -webkit-transform: translate(0, -50%);
          transform: translate(0, -50%);
  text-align: center;
}
.at-user__avatar {
  width: 98px;
  height: 98px;
  border-radius: 100%;
  margin: 0 auto 20px;
  overflow: hidden;
}
.at-user__avatar img {
  display: block;
  width: 100%;
  max-width: 100%;
}
.at-user__name {
  color: #313435;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 2.625rem;
}
.at-user__title {
  color: #6f808a;
  font-size: 0.875rem;
  line-height: 2.375rem;
}
.at-social {
  margin: 0 0 -18px;
  opacity: 0;
  transition: margin 0.2s ease, opacity 0.2s ease;
}
.at-social__item {
  display: inline-block;
  margin: 0 10px;
}
.at-social__item a {
  display: block;
}
.at-social__item svg {
  fill: #515f65;
  display: block;
  height: 18px;
  transition: fill 0.2s ease;
}
.at-social__item svg:hover {
  fill: #788d96;
}

.container {
  max-width: 1170px;
  width: 100%;
  margin: 100px auto;
  padding: 0 20px;
  box-sizing: border-box;
  -webkit-transform-origin: top center;
          transform-origin: top center;
  -webkit-transform: scale(0.8);
          transform: scale(0.8);
}

/*
**************************
single pages
**************************
*/

.lista_pp {
    font-family: 'Raleway', sans-serif !important;
    font-size:14px !important;
    font-weight: 400 !important;
}