@font-face {font-family: MicrosoftTaiLe; src: url('../fonts/taile.ttf'); }
@font-face {font-family: MicrosoftTaiLeb; font-weight:bold; src: url('../fonts/taileb.ttf'); }
@font-face {font-family: Modern20; src: url('../fonts/mod20.ttf'); }

body, html { overflow-x:hidden; }
html {
	background:#161616;
	font-family: MicrosoftTaiLe;
}
body {
	font-style: normal; 
	-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
	-webkit-text-size-adjust: 100%;
	background-color:#161616;
	background-position:top center;
	background-repeat:no-repeat;
	margin: 0 auto;
	background-image: url('../img/portfolio.jpg');
}
h1, h2, h3, h4, h5, h6, span, p { font-family: 'Open Sans', Arial, Helvetice Neue, sans-serif; }
* {
  -webkit-border-radius: 0 !important;
     -moz-border-radius: 0 !important;
          border-radius: 0 !important;
}
h4 {
	color: white !important;
}
h1, h2, h3 {
	color: #777 !important;
}
p {
	color: white !important;
}
a {
	color: #999 !important;
}
.text-primary {color: red !important;}
.fixer {clear: both;}
#main {
width:100%;
margin: 0px auto;
}
#wrap {
	max-width: 1170px;
	margin: 0px auto;
	overflow:hidden;
	display:block;
	position: relative;
	z-index: 300;

}

.Modern20 {
	font-family: Modern20;
}

/* zmiana wyglądu buttonów menu */
.btn-menu {
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#444444+1,000000+100&0.9+1,0.9+100 */
	background: -moz-linear-gradient(top, rgba(68,68,68,1) 1%, rgba(0,0,0,0.9) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(68,68,68,1) 1%,rgba(0,0,0,0.9) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(68,68,68,1) 1%,rgba(0,0,0,0.9) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6444444', endColorstr='#e6000000',GradientType=0 ); /* IE6-9 */	color: #fff !important;

	-webkit-box-shadow: 0px 4px 29px -2px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 4px 29px -2px rgba(0,0,0,0.75);
	box-shadow: 0px 4px 29px -2px rgba(0,0,0,0.75);

	height: 95px !important;
	font-family: MicrosoftTaileb;
	font-size: 11pt;
	margin-top: 15px !important;
	border-radius: 0px !important;

	border-width:0px 1px 1px 1px;
	border-style:solid solid solid solid;
	border-color:#017283 #1e1e1e #202020 #474747;

	-webkit-transition: all 0.5s ease !important;
 	-moz-transition: all 0.5s ease !important;
    transition: all 0.5s ease !important;
}
.btn-menu.active, .btn-menu:hover {
	-webkit-box-shadow: inset 0px 30px 85px 11px rgba(0,0,0,0.79);
	-moz-box-shadow: inset 0px 30px 85px 11px rgba(0,0,0,0.79);
	box-shadow: inset 0px 30px 85px 11px rgba(0,0,0,0.79);

    border-width:0px 1px 1px 10px;
	border-style:solid solid solid solid;
	border-color:#017283 #1e1e1e #202020 #ff0000;

	-webkit-transition: all 0.5s ease !important;
 	-moz-transition: all 0.5s ease !important;
    transition: all 0.5s ease !important;

}
.btn-menu.active, .btn-menu:active, .open>.dropdown-toggle.btn-menu {
	-webkit-box-shadow: inset 0px 30px 85px 11px rgba(0,0,0,0.79) !important;
	-moz-box-shadow: inset 0px 30px 85px 11px rgba(0,0,0,0.79) !important;
	box-shadow: inset 0px 30px 85px 11px rgba(0,0,0,0.79) !important;


    border-width:0px 1px 1px 10px !important;
	border-style:solid solid solid solid !important;
	border-color:#017283 #1e1e1e #202020 #ff0000 !important;

	background-color: rgba(0,0,0,0) !important;
}
.btn-menu.focus, .btn-menu:focus {
	border: 0px;
	background-color: rgba(0,0,0,0) !important;

	-webkit-transition: all 0.5s ease !important;
 	-moz-transition: all 0.5s ease !important;
    transition: all 0.5s ease !important;
}

a.btn-menu {padding-top: 40px;}
/* zmiana wyglądu buttonów menu - END */

/* położenie headera LEFT & RIGHT */
.topheader-left {
	float: left;
	width: 50%;
	height: auto;
	display: block;
}
.topheader-right {
	float: left;
	width: 50%;
	height: 100%;
	display: block;
	position: relative;
}
/* położenie headera LEFT & RIGHT END */

/* Carousel */
.laptop-frame {
	z-index: 200;
	background-image: url('../img/laptop_frame.png');
	background-repeat: no-repeat;
	background-size: 100%;
	display: block;
	margin-top: 30px;
	position: absolute;
	padding: 4.5% 4.5% 0% 4.5%;
	width: 100%;
	height: 100%;
}
.laptop-frame-margins {
	z-index: 100;
	margin-top: 30px;
	padding: 4.5% 4.5% 0% 4.5%;
	position: relative;
}

/* Carousel END */

/* Informacje - jasny pasek z przywitaniem */

.info{
	color: #fff;
	width: 100%;
	margin: 0px;
	padding: 25px 10px;
	border-left: 25px solid #ff0000;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fcfff4+0,dfe5d7+37,b3bead+100 */
	background: rgb(252,255,244); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(252,255,244,0.3) 0%, rgba(179,190,173,0) 70%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(252,255,244,0.3) 0%, rgba(179,190,173,0) 70%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(252,255,244,0.3) 0%,rgba(179,190,173,0) 70%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 ); /* IE6-9 */

    border-width: 0px 0px 0px 10px;
    border-style: solid;

    -webkit-border-image: 
      -webkit-linear-gradient(red, rgba(0, 0, 0, 0)) 1 100%;
    -moz-border-image:
      -moz-linear-gradient(red, rgba(0, 0, 0, 0)) 1 100%;    
    -o-border-image:
      -o-linear-gradient(red, rgba(0, 0, 0, 0)) 1 100%;
    border-image:
      linear-gradient(to bottom, red, rgba(0, 0, 0, 0)) 1 100%;
}
.portfolio_item{
	color: #fff;
	margin: 0px;
	border-left: 25px solid #ff0000;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fcfff4+0,dfe5d7+37,b3bead+100 */
	background: rgb(252,255,244); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(252,255,244,0.3) 0%, rgba(179,190,173,0) 70%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(252,255,244,0.3) 0%, rgba(179,190,173,0) 70%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(252,255,244,0.3) 0%,rgba(179,190,173,0) 70%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 ); /* IE6-9 */

    border-width: 0px 0px 0px 10px;
    border-style: solid;

    -webkit-border-image: 
      -webkit-linear-gradient(red, rgba(0, 0, 0, 0)) 1 100%;
    -moz-border-image:
      -moz-linear-gradient(red, rgba(0, 0, 0, 0)) 1 100%;    
    -o-border-image:
      -o-linear-gradient(red, rgba(0, 0, 0, 0)) 1 100%;
    border-image:
      linear-gradient(to bottom, red, rgba(0, 0, 0, 0)) 1 100%;
}
.skills {
	background-image: url('../img/bg_skills.png');
	background-repeat: no-repeat;
	background-size: 100%;
	height: 350px;
}
.skills span {
	color: #ccc;
}
.skills1 {
	background-image: url('../img/bg_skills.png');
}
.skills2 {
	background-image: url('../img/bg_skills2.png');
}
.skills3 {
	background-image: url('../img/bg_skills3.png');
}
.skills4 {
	background-image: url('../img/bg_skills4.png');
}
.img_right {
	float: right;
	width: 40%;
}
.textleft {	text-align: left !important;}
.textcenter { text-align: center !important;}

.white {color: #fff !important;}
.img-fluid {
-webkit-box-shadow: 0px 0px 29px 6px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 29px 6px rgba(0,0,0,0.75);
box-shadow: 0px 0px 29px 6px rgba(0,0,0,0.75);
}

.portfoliobutton {
	box-shadow: rgb(207, 134, 108) 0px 1px 0px 0px inset;
    background: linear-gradient(rgb(207, 27, 27) 5%, rgb(186, 23, 23) 100%) rgb(207, 27, 27);
    border-radius: 3px;
    border: 1px solid rgb(148, 41, 17);
    display: inline-block;
    margin: 0 auto !important;
    cursor: pointer;
    color: rgb(255, 255, 255) !important;
    font-family: Arial;
    font-size: 17px;
    padding: 15px 40px;
    text-decoration: none;
    text-shadow: rgb(133, 70, 41) 0px 1px 0px;
   	-webkit-transition: all 0.5s ease !important;
 	-moz-transition: all 0.5s ease !important;
    transition: all 0.5s ease !important;
}
.portfoliobutton:hover {
	-webkit-box-shadow: inset 0px 30px 85px 11px rgba(0,0,0,0.79);
	-moz-box-shadow: inset 0px 30px 85px 11px rgba(0,0,0,0.79);
	box-shadow: inset 0px 30px 85px 11px rgba(0,0,0,0.79);

	background: -moz-linear-gradient(top, rgba(68,68,68,1) 1%, rgba(0,0,0,0.9) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(68,68,68,1) 1%,rgba(0,0,0,0.9) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(68,68,68,1) 1%,rgba(0,0,0,0.9) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6444444', endColorstr='#e6000000',GradientType=0 ); /* IE6-9 */	color: #fff !important;

	border-style:solid solid solid solid;

	-webkit-transition: all 0.5s ease !important;
 	-moz-transition: all 0.5s ease !important;
    transition: all 0.5s ease !important;
}