/**

 * Support: web-master72@yandex.ru;

 * Author: web-master72

 * 

 *

/* ---------------------------------------------- /*

 * General styles

/* ---------------------------------------------- */



@import url(http://fonts.googleapis.com/css?family=Raleway:100,200,300,400);

@import url(http://fonts.googleapis.com/css?family=Ubuntu:400,700);





body {

	font: 200 15px/1.6 'Raleway', serif, sans-serif;

	color: #545454;

}



img {

	max-width: 100%;

	height: auto;

}



a {

	color: #808080;

}



a:hover {

	color: #C4C4C4;

}



/* ---------------------------------------------- /*

 * Typography

/* ---------------------------------------------- */



h1, h2, h3, h4, h5, h6 {

	font: 300 46px/1.2 'Raleway', serif, sans-serif;

	margin: 5px 0 5px;

	color: #222;

}



h1 {

	font-size: 64px;

	font-weight: 400;

	margin: 5px 0 15px;

}



h2 {

	font-size: 40px;

	font-weight: 400;

}



h3 {

	font-size: 22px;

	text-transform: uppercase;

	margin: 5px 0 15px;

}



h4 {

	font-size: 16px;

	margin: 5px 0 10px;

}



h5 {

	font-size: 14px;

}



h6 {

	font-size: 13px;

}



/* ---------------------------------------------- /*

 * Transition elsements

/* ---------------------------------------------- */



a,

.btn,

.navbar,

.form-control,

.portfolio-item-description {

	-webkit-transition: all 0.125s ease-in-out 0s;

	   -moz-transition: all 0.125s ease-in-out 0s;

		-ms-transition: all 0.125s ease-in-out 0s;

		 -o-transition: all 0.125s ease-in-out 0s;

			transition: all 0.125s ease-in-out 0s;

}



.portfolio-item-preview {

	-webkit-transition: all 0.3s ease-in-out 0s;

	   -moz-transition: all 0.3s ease-in-out 0s;

		-ms-transition: all 0.3s ease-in-out 0s;

		 -o-transition: all 0.3s ease-in-out 0s;

			transition: all 0.3s ease-in-out 0s;

}



/* ---------------------------------------------- /*

 * Reset box-shadow

/* ---------------------------------------------- */



.btn,

.panel,

.progress,

.form-control,

.modal-content,

.form-control:hover, 

.form-control:focus {

	-webkit-box-shadow: none;

			box-shadow: none;

}



/* ---------------------------------------------- /*

 * Reset border-radius

/* ---------------------------------------------- */



.btn,

.label,

.alert,

.avatar,

.progress,

.form-control,

.modal-content,

.panel-group .panel,

.widget-social li a {

	-webkit-border-radius: 3px;

	   -moz-border-radius: 3px;

		 -o-border-radius: 3px;

			border-radius: 3px;

}



/* ---------------------------------------------- /*

 * Inputs styles

/* ---------------------------------------------- */



.form-control {

	background: #FFF;

	border: 2px solid #C4C4C4;

	height: 54px;

	font-size: 14px;

	padding: 15px;

	color: #777;

}



.input-lg, .form-horizontal .form-group-lg .form-control {

	height: 62px;

}



.input-sm, .form-horizontal .form-group-sm .form-control {

	height: 40px;

	font-size: 12px;

}



/* ---------------------------------------------- /*

 * Custom button style

/* ---------------------------------------------- */



.btn {

	font-weight: 700;

	font-size: 14px;

	padding: 17px 27px;

	border: 0;

}



.btn:hover, .btn:focus, .btn:active, .btn.active {

	outline: inherit !important;

}



/* Button icons */



.btn .icon-before {

	margin-right: 6px;

}



.btn .icon-after {

	margin-left: 6px;

}



/* Button size */



.btn-lg, .btn-group-lg > .btn {

	padding: 22px 24px;

	font-size: 14px;

}



.btn-sm, .btn-group-sm > .btn {

	padding: 11px 18px;

	font-weight: 400;

	font-size: 12px;

}



.btn-xs, .btn-group-xs > .btn {

	padding: 7px 14px;

	font-size: 10px;

}



.btn-list .btn {

	margin-bottom: 5px;

}



/* Button types*/



.btn-default {

	background: #EEEEEE;

}



.btn-custom-1, .btn-custom-2 {

	background: transparent;

	border: 2px solid #808080;

	padding: 15px 25px;

}



.btn-custom-2 {

	border: 2px solid #222;

}



.btn-custom-1:hover, .btn-custom-1:focus, .btn-custom-1:active, .btn-custom-1.active {

	background: #808080;

	border: 2px solid #808080;

	color: #FFF;

}



.btn-custom-2:hover, .btn-custom-2:focus, .btn-custom-2:active, .btn-custom-2.active {

	background: #222;

	border: 2px solid #222;

	color: #FFF;

}



/* ---------------------------------------------- /*

 * Alerts style

/* ---------------------------------------------- */



.alert {

	border: 0;

}



/* ---------------------------------------------- /*

 * Skill-bars

/* ---------------------------------------------- */



.skill-bar {

	background: #C4C4C4;

	display: table;

	height: 4px;

	width: 100%;

	margin: 10px -2px 20px -2px;

}



.skill-bar .skill-rate-on {

	background: #353535;

}



.skill-rate-on, .skill-rate-off {

	display: table-cell;

	border-left: 2px solid #FFF;

	border-right: 2px solid #FFF;

}



/* ---------------------------------------------- /*

 * Progress bars

/* ---------------------------------------------- */



.progress {

	background: #E5E5E5;

	margin-top: 10px;

	margin-bottom: 20px;

}



.progress-bar {

	background: #353535;

	box-shadow: none;

}



/* ---------------------------------------------- /*

 * Tabs

/* ---------------------------------------------- */



.nav-pills, .nav-tabs {

	margin-bottom: 20px;

}



.nav-pills > li > a {

	border-radius: 3px;

}



.nav-tabs > li > a {

	border-radius: 3px 3px 0 0;

}



/* ---------------------------------------------- /*

 * Panels

/* ---------------------------------------------- */



.panel {

	border: 0;

}



.panel-body {

	background: #f5f5f5;

}



.panel-group .panel-heading + .panel-collapse > .panel-body {

	border: 0;

}



/* ---------------------------------------------- /*

 * Modal

/* ---------------------------------------------- */



.modal-content {

	border: 0;

}



/* ---------------------------------------------- /*

 * Labels

/* ---------------------------------------------- */



.label {

	padding: .2em .6em .2em;

	font-size: 70%;

}



.label-custom-1 {

	background: #808080;

}



.label-custom-2 {

	background: #222;

}



/* ---------------------------------------------- /*

 * General

/* ---------------------------------------------- */



.wrapper {

	overflow: hidden;

}



.section, .callout {

	position: relative;

	padding: 120px 0;

}



.callout {

	background: #F5F5F5;

}



.headline {

	margin: 0 0 60px;

}



.headline p {

	font-weight: 700;

	color: #C4C4C4;

}



.callout-btn {

	margin-top: 10px;

}



.rotate {

	text-shadow: 0 0 0 !important;

}



.nomargin {

	margin: 0 !important;

}



.long-down {

	margin-bottom: 40px;

}



.icon-list {

	list-style: none;

	padding: 0px;

}



.icon-list > li > i {

	margin-right: 6px;

}



h3 > .fa {

	font-size: 24px;

	margin-right: 6px;

}



.mouse-icon {

	position: relative;

	border: 2px solid #fff;

	border-radius: 16px;

	height: 50px;

	width: 30px;

	margin: 0 auto;

	display: block;

	z-index: 10;

}



.mouse-icon .wheel {

	-webkit-animation-name: drop;

	-webkit-animation-duration: 1s;

	-webkit-animation-timing-function: linear;

	-webkit-animation-delay: 0s;

	-webkit-animation-iteration-count: infinite;

	-webkit-animation-play-state: running;

	animation-name: drop;

	animation-duration: 1s;

	animation-timing-function: linear;

	animation-delay: 0s;

	animation-iteration-count: infinite;

	animation-play-state: running;

}



.mouse-icon .wheel {

	position: relative;

	border-radius: 10px;

	background: #fff;

	width: 4px;

	height: 10px;

	top: 4px;

	margin-left: auto;

	margin-right: auto;

}



@-webkit-keyframes drop	{

	0%   { top:5px;  opacity: 0;}

	30%  { top:10px; opacity: 1;}

	100% { top:25px; opacity: 0;}

}



@keyframes drop	{

	0%   { top:5px;  opacity: 0;}

	30%  { top:10px; opacity: 1;}

	100% { top:25px; opacity: 0;}

}



/* ---------------------------------------------- /*

 * Navigation

/* ---------------------------------------------- */



.navbar {

	background: none;

	border-radius: 0;

	border: 0;

	padding: 20px 0;

	text-transform: uppercase;

	color: #FFF !important;

}



.navbar-custom .nav li a:hover, 

.navbar-custom .nav li a:focus, 

.navbar-custom .nav li.active {

	background: none;

	outline: 0;

	color: #808080;

}



.navbar-custom .navbar-brand {

	font: 400 18px/1.2 'Raleway', serif, sans-serif;

	color: #FFF;

}



.navbar-custom .navbar-nav > li.active {

	border-bottom: 3px solid #FFF;

}



.navbar-custom .navbar-toggle .icon-bar {

	background: #FFF;

}



.navbar-custom .navbar-nav > li > a,

.navbar-custom .navbar-nav .dropdown-menu > li > a {

	color: #FFF;

	font-size: 12px;

}



.navbar-color,

.custom-collapse {

	background: #FFF;

	box-shadow: 0 0 4px rgba(0, 0, 0, .2);

	padding: 0;

}



.navbar-color .navbar-brand,

.custom-collapse .navbar-brand,

.navbar-color .navbar-nav > li > a,

.navbar-color .navbar-nav .dropdown-menu > li > a,

.custom-collapse .navbar-nav > li > a,

.custom-collapse .navbar-nav .dropdown-menu > li > a {

	color: #222;

}



.navbar-color .navbar-nav > li.active {

	border-bottom: 3px solid #222;

}



.custom-collapse .navbar-nav {

	text-align: left;

}



.custom-collapse .navbar-nav > li.active {

	border: 0;

}



.navbar-color .navbar-toggle .icon-bar,

.custom-collapse .navbar-toggle .icon-bar {

	background: #222;

}



/* ---------------------------------------------- /*

 * Intro

/* ---------------------------------------------- */



#intro {

	padding: 260px 0 160px 0;

	text-align: center;

	color: #FFF;

}



#intro h1, #intro h2, #intro h3, #intro h4, #intro h5, #intro h6 {

	color: #FFF;

}



.hello {

	margin: 0 0 100px;

}



/* ---------------------------------------------- /*

 * Profile-contact

/* ---------------------------------------------- */



#profile-contact {

	box-shadow: 0 0 4px rgba(0, 0, 0, .2);

	padding: 20px 0;

}



.profile-item i {

	display: block;

	line-height: 42px;

	font-size: 32px;

	color: #222;

}



.profile-widget {

	margin-bottom: 40px;

}



.widget-social {

	padding: 0;

	margin: 0;

}



.widget-social li {

	display: inline-block;

	margin-right: 5px;

}



.widget-social li a {

	background: #2e2e2e;

	text-align: center;

	display: block;

	width: 40px;

	height: 40px;

	line-height: 40px;

	font-size: 1.25em;

	color: #FFF;

}



.widget-social li a:hover {

	background: #808080;

}



.stat .stat-icon {

	margin-bottom: 10px;

	font-size: 32px;

	color: #222;

}



.stat .stat-icon i {

	margin-right: 10px;

}



/* ---------------------------------------------- /*

 * Service

/* ---------------------------------------------- */



.service {

	margin: 0 0 40px;

}



.service .icon {

	font-size: 32px;

	margin: 0 0 5px;

	color: #222;

}



/* ---------------------------------------------- /*

 * Resume

/* ---------------------------------------------- */



.resume-items {

	margin-bottom: 40px;

}



.resume-place {

	margin-bottom: 20px;

}



.resume-place > i,

.resume-place > h4 > i {

	color: #C4C4C4;

	font-size: 14px;

	margin-right: 5px;

}



/* ---------------------------------------------- /*

 * Clients

/* ---------------------------------------------- */



.owl-theme .owl-item {

	text-align: center;

}



.owl-theme .owl-controls .owl-page span {

	margin: 0 4px;

}



.owl-theme .owl-controls .owl-page span {

	border-radius: 0;

	width: 40px;

	height: 4px;

}



.owl-theme .owl-controls .owl-pagination {

	margin-top: 20px;

}



/* ---------------------------------------------- /*

 * Portfolio

/* ---------------------------------------------- */



.portfolio-item {

	margin-bottom: 20px;

	overflow: hidden;

}



.portfolio-item-preview {

	position: relative;

}



.portfolio-item:hover .portfolio-item-preview {

	-webkit-transform: scale(1.1);

	   -moz-transform: scale(1.3);

		-ms-transform: scale(1.3);

		 -o-transform: scale(1.3);

			transform: scale(1.2);

}



.portfolio-item:hover .portfolio-item-description {

	opacity: 1;

	bottom: 0;

}



.portfolio-item-description {

	background: rgba(255, 255, 255, .85);

	position: absolute;

	right: 0;

	bottom: -70px;

	left: 0;

	padding: 25px;

	text-align: center;

	opacity: 0;

	color: #222;

}



/* ---------------------------------------------- /*

 * Contact

/* ---------------------------------------------- */



#contact {

	background: #18191a;

	color: #FFF;

}



#contact h1, #contact h2, #contact h3, #contact h4, #contact h5, #contact h6 {

	color: #FFF;

}



#contact .form-control {

	border: 0;

}



.ajax-response {

	margin-top: 15px;

}



#footer {

	background: #141414;

	padding: 20px 0;

	color: #FFF;

}



#footer .copy {

	font-size: 12px;

	margin: 5px 0;

}



/* ---------------------------------------------- /*

 * Preloader

/* ---------------------------------------------- */



#preloader {

	background: #FFF;

	bottom: 0;

	left: 0;

	position: fixed;

	right: 0;

	top: 0;

	z-index: 9999;

}



#status, .status-mes {

	background-image: url(../images/488.GIF);

	background-position: center;

	background-repeat: no-repeat;

	height: 200px;

	left: 50%;

	margin: -100px 0 0 -100px;

	position: absolute;

	top: 50%;

	width: 200px;

}



.status-mes {

	background: none;

	left: 0;

	margin: 0;

	text-align: center;

	top: 65%; 

}



.status-mes h4 {

	color: #222;

	margin-top: 30px;

}



/* ---------------------------------------------- /*

 * Media

/* ---------------------------------------------- */



@media (max-width: 767px) {



	.wrapper {

		text-align: center;

	}



	#profile-contact .profile-item {

		margin: 0 0 20px;

	}



	#stats .stat {

		margin: 0 0 20px;

	}



}



.dol {

    padding-top: 2em;

}



.small {

    background-color: none;

    max-height: 1em;

}



.navbar-right {

    font-weight: 300;

}



.intervjuji {

	text-align: center;

}



.nov

{

    position: absolute;

    width: 100%;

    left: 0;

    text-align: center;

    margin: auto;

}



.my {

	background-color: white;

	height: 4em;

}

.odmik {

	margin-right: 2em;

}



.levi {

	font-size: 17px;

	font-weight: 300;

}



.glyphicon {

	color: black;

}







.nova-vrsta {

	text-align: center;

	padding-top: 8em;

}



.razdalja {

	padding: 3em 3em;

}