﻿@import url(http://fonts.googleapis.com/css?family=Droid+Sans);
@import url(http://fonts.googleapis.com/css?family=Droid+Serif:400,400italic);

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

	Template Name: eMotion
	Template URI: http://www.themes.shtier.com/html/emotion
	Description: HTML Template for portfolio, agencies, and what you want.
	Author: Shtier [Artem Valchuk]
	Author URI: http://www.shtier.com
	Version: 2.0

-----------------------------------------------------------------------------------

	0.	Normalize
	1.	Document Setup (body, general classes, grids)
	2.	Header and Menu
	3.  Slider Section
	4.	Services Section
	5.	Portfolio Section
	6.	About Section
	7.  Blog Section
	8.	Contacts Section
	9.	Footer Section
	10. Elements, UI, Typo

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

@font-face {
  font-family: 'MenschInline';
  src: url('../fonts/mensch-inline-webfont.eot');
  src: url('../fonts/mensch-inline-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/mensch-inline-webfont.woff') format('woff'), url('../fonts/mensch-inline-webfont.ttf') format('truetype'), url('../fonts/mensch-inline-webfont.svg#MenschMenschBoldInline') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'MenschBold';
  src: url('../fonts/mensch-bold-webfont.eot');
  src: url('../fonts/mensch-bold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/mensch-bold-webfont.woff') format('woff'), url('../fonts/mensch-bold-webfont.ttf') format('truetype'), url('../fonts/mensch-bold-webfont.svg#MenschMenschBoldbold') format('svg');
  font-weight: normal;
  font-style: normal;
}

/*-----------------------------------------------------------------------------------*/
/*	0.	Normalize based on 2011-07-06T20:20 UTC //github.com/jonathantneal/normalize.css 
/*-----------------------------------------------------------------------------------*/

article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block;}
audio,canvas,video{display:inline-block;*display:inline;*zoom:1;}
audio:not([controls]){display:none;}
[hidden]{display:none;}
html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
body{margin:0;}
a:hover,a:active{outline:0;}
abbr[title]{border-bottom:1px dotted;}
b,strong{font-weight:bold;}
dfn{font-style:italic;}
mark{background:#ff0;color:#000;}
pre,code,kbd,samp{font-family:monospace, serif;_font-family:'courier new',monospace;font-size:1em;}
pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word;}
q{quotes:none;}
q:before,q:after{content:'';content:none;}
small{font-size:90%;}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}
sup{top:-0.5em;}
sub{bottom:-0.25em;}
ul,ol{margin-left:0;padding:0 0 0 40px;}
dd{margin:0 0 0 40px;}
nav ul,nav ol{list-style:none;list-style-image:none;}
img{border:0;-ms-interpolation-mode:bicubic;}
svg:not(:root){overflow:hidden;}
figure{margin:0;}
form{margin:0;}
fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}
legend{border:0;padding:0;white-space:normal;*margin-left:-7px;}
button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle;}
button,input{line-height:normal;}
button,input[type="button"],input[type="reset"],input[type="submit"]{cursor:pointer;-webkit-appearance:button;*overflow:visible;}
button[disabled],input[disabled]{cursor:default;}
input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;*height:13px;*width:13px;}
input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}
input[type="search"]::-webkit-search-decoration,input[type="search"]::-webkit-search-cancel-button{-webkit-appearance:none;}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}
textarea{overflow:auto;vertical-align:top;}
table{border-collapse:collapse;border-spacing:0;}

/*-----------------------------------------------------------------------------------*/
/*	1.	Document Setup (body, general classes, grids)
/*-----------------------------------------------------------------------------------*/

/* 1.1 Base Style
-------------------------------------------------- */
* { outline: none }
html { overflow-x: hidden }
body {
    overflow-x: hidden;
    font: normal 16px/24px 'Droid Sans', Helvetica, Arial, sans-serif;
}
h1,
h1 span,
h2,
h2 span,
h3,
h3 span,
h4,
h4 span,
h5,
h5 span,
p,
blockquote { position: relative }
img{
	width: auto\9;
	/*height: auto;*/
	max-width: 100%;
	vertical-align: middle;
	border: 0;
	-ms-interpolation-mode: bicubic;
}
i,
cite,
em,
var,
address,
dfn {
    font-style: italic;
    font-family: "Droid Serif", Georgia, Times, serif;
}
a {
    text-decoration: none;
    outline: none;
}
a > img { vertical-align: bottom }

p { margin: 15px 0 }
h1 {
    margin: 70px 0 50px 0;
    text-align: center;
}
h2 {
    font: normal 36px/1em 'MenschBold', Helvetica, Arial, sans-serif;
    margin: 0 0 26px 0;
}
h3 {
    font: normal 30px/1em 'MenschBold', Helvetica, Arial, sans-serif;
    margin: 0 0 10px 0;
}
h4 {
    font: normal 18px/24px 'Droid Sans', Helvetica, Arial, sans-serif;
    margin: 0 0 26px 0;
}
h5 {
    font: normal 16px/24px "Droid Serif", Georgia, Times, serif;
    margin: 0;
}
h6 {
    font: italic normal 16px/28px "Droid Serif", Georgia, Times, serif;
    margin: 0;
}
blockquote small {
    display: block;
    margin: 17px 0 0 0;
    color: #ed8280;
}
blockquote small:before { content: '\2014 \00A0' }
blockquote {
    padding-left: 60px;
    margin: 0;
    font: italic 16px/24px "Droid Serif", Georgia, Times, serif;
}
.dark a { color: #ffc9c2 }
.light a { color: #5e464a }
a:hover { color: #ed8280 }
.dark p { text-shadow: 0 2px 0 rgba(0, 0, 0, 0.16) }
.light p { text-shadow: 0 1px 0 #ffffff }
.light h1,
.light h2,
.light h3,
.light h4,
.light h5,
.light h6 { text-shadow: 0 1px 0 #ffffff }
.light h1 {
    font: normal 72px/1em 'MenschBold', Helvetica, Arial, sans-serif;
    text-shadow: none;
}
.dark h1 {
    font: normal 72px/1em 'MenschInline', Helvetica, Arial, sans-serif;
    text-shadow: 0 4px 0 rgba(0, 0, 0, 0.16);
}
.dark h2 { text-shadow: 0 3px 0 rgba(0, 0, 0, 0.16) }
.dark h3 { text-shadow: 0 3px 0 rgba(0, 0, 0, 0.16) }
.dark h4,
.dark h5,
.dark h6 { text-shadow: 0 2px 0 rgba(0, 0, 0, 0.16) }
.light blockquote {
    background: url(../images/quote-l.png) no-repeat 14px 0;
    text-shadow: 0 1px 0 #ffffff;
}
.dark blockquote {
    background: url(../images/quote-d.png) no-repeat 14px 0;
    text-shadow: 0 2px 0 rgba(0, 0, 0, 0.16);
}
.section { padding: 100px 0 }
.lightsep {
    background: url(../images/sep-l.png) repeat-x;
    height: 14px;
    margin: 15px 0 30px 0;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/sep-l.png", sizingMethod='crop');
}
.darksep {
    background: url(../images/sep-d.png) repeat-x;
    height: 14px;
    margin: 15px 0 30px 0;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../images/sep-d.png", sizingMethod='crop');
}
.sep-section {
    background: #423134;
    height: 8px;
}
.light {
    color: #5e464a;
    background: #ffffff url(../images/lightbg.jpg);
    position: relative;
}
.dark {
    color: #ffffff;
    background: #5e464a url(../images/darkbg.jpg);
    background-attachment: fixed;
    position: relative;
}

/* 1.2 Helpers
-------------------------------------------------- */

.clearfix { *zoom: 1 }
.clearfix:before,
.clearfix:after {
    display: table;
    content: "";
    line-height: 0;
}
.clearfix:after { clear: both }
.pull-right { float: right }
.pull-left { float: left }
.hide-text {
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0;
}
.pull-right { float: right }
.pull-left { float: left }
.hide {
    display: none;
    opacity: 0;
}
.show {
    display: block;
    opacity: 1;
}
.invisible { visibility: hidden }
.affix { position: fixed }
.text-left { text-align: left }
.text-right { text-align: right }
.text-center { text-align: center }

/* 1.3 Grids
-------------------------------------------------- */

.container { width: 940px }
.container {
    margin-right: auto;
    margin-left: auto;
    *zoom: 1;
}
.container:before,
.container:after {
    display: table;
    line-height: 0;
    content: "";
}
.container:after { clear: both }
.row div > p:first-child {margin-top:0}
.row {
    margin-left: -20px;
    *zoom: 1;
}
.row:before,
.row:after {
    display: table;
    line-height: 0;
    content: "";
}
.row:after { clear: both }
[class*="span"] {
    float: left;
    min-height: 1px;
    margin-left: 20px;
}
.span12 { width: 940px }
.span11 { width: 860px }
.span10 { width: 780px }
.span9 { width: 700px }
.span8 { width: 620px }
.span7 { width: 540px }
.span6 { width: 460px }
.span5 { width: 380px }
.span4 { width: 300px }
.span3 { width: 220px }
.span2 { width: 140px }
.span1 { width: 60px }

/* 1.4 Offset for Grids
-------------------------------------------------- */

.offset12 { margin-left: 980px }
.offset11 { margin-left: 900px }
.offset10 { margin-left: 820px }
.offset9 { margin-left: 740px }
.offset8 { margin-left: 660px }
.offset7 { margin-left: 580px }
.offset6 { margin-left: 500px }
.offset5 { margin-left: 420px }
.offset4 { margin-left: 340px }
.offset3 { margin-left: 260px }
.offset2 { margin-left: 180px }
.offset1 { margin-left: 100px }

/* 1.5 Grids fluid
-------------------------------------------------- */

.row-fluid {
    width: 100%;
    *zoom: 1;
}
.row-fluid:before,
.row-fluid:after {
    display: table;
    line-height: 0;
    content: "";
}
.row-fluid:after { clear: both }
.row-fluid [class*="span"] {
    display: block;
    float: left;
    width: 100%;
    min-height: 30px;
    margin-left: 2.127659574468085%;
    *margin-left: 2.074468085106383%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.row-fluid [class*="span"]:first-child { margin-left: 0 }
.row-fluid .controls-row [class*="span"] + [class*="span"] { margin-left: 2.127659574468085% }
.row-fluid .span12 {
    width: 100%;
    *width: 99.94680851063829%;
}
.row-fluid .span11 {
    width: 91.48936170212765%;
    *width: 91.43617021276594%;
}
.row-fluid .span10 {
    width: 82.97872340425532%;
    *width: 82.92553191489361%;
}
.row-fluid .span9 {
    width: 74.46808510638297%;
    *width: 74.41489361702126%;
}
.row-fluid .span8 {
    width: 65.95744680851064%;
    *width: 65.90425531914893%;
}
.row-fluid .span7 {
    width: 57.44680851063829%;
    *width: 57.39361702127659%;
}
.row-fluid .span6 {
    width: 48.93617021276595%;
    *width: 48.88297872340425%;
}
.row-fluid .span5 {
    width: 40.42553191489362%;
    *width: 40.37234042553192%;
}
.row-fluid .span4 {
    width: 31.914893617021278%;
    *width: 31.861702127659576%;
}
.row-fluid .span3 {
    width: 23.404255319148934%;
    *width: 23.351063829787233%;
}
.row-fluid .span2 {
    width: 14.893617021276595%;
    *width: 14.840425531914894%;
}
.row-fluid .span1 {
    width: 6.382978723404255%;
    *width: 6.329787234042553%;
}
.row-fluid .offset12 {
    margin-left: 104.25531914893617%;
    *margin-left: 104.14893617021275%;
}
.row-fluid .offset12:first-child {
    margin-left: 102.12765957446808%;
    *margin-left: 102.02127659574467%;
}
.row-fluid .offset11 {
    margin-left: 95.74468085106382%;
    *margin-left: 95.6382978723404%;
}
.row-fluid .offset11:first-child {
    margin-left: 93.61702127659574%;
    *margin-left: 93.51063829787232%;
}
.row-fluid .offset10 {
    margin-left: 87.23404255319149%;
    *margin-left: 87.12765957446807%;
}
.row-fluid .offset10:first-child {
    margin-left: 85.1063829787234%;
    *margin-left: 84.99999999999999%;
}
.row-fluid .offset9 {
    margin-left: 78.72340425531914%;
    *margin-left: 78.61702127659572%;
}
.row-fluid .offset9:first-child {
    margin-left: 76.59574468085106%;
    *margin-left: 76.48936170212764%;
}
.row-fluid .offset8 {
    margin-left: 70.2127659574468%;
    *margin-left: 70.10638297872339%;
}
.row-fluid .offset8:first-child {
    margin-left: 68.08510638297872%;
    *margin-left: 67.9787234042553%;
}
.row-fluid .offset7 {
    margin-left: 61.70212765957446%;
    *margin-left: 61.59574468085106%;
}
.row-fluid .offset7:first-child {
    margin-left: 59.574468085106375%;
    *margin-left: 59.46808510638297%;
}
.row-fluid .offset6 {
    margin-left: 53.191489361702125%;
    *margin-left: 53.085106382978715%;
}
.row-fluid .offset6:first-child {
    margin-left: 51.063829787234035%;
    *margin-left: 50.95744680851063%;
}
.row-fluid .offset5 {
    margin-left: 44.68085106382979%;
    *margin-left: 44.57446808510638%;
}
.row-fluid .offset5:first-child {
    margin-left: 42.5531914893617%;
    *margin-left: 42.4468085106383%;
}
.row-fluid .offset4 {
    margin-left: 36.170212765957444%;
    *margin-left: 36.06382978723405%;
}
.row-fluid .offset4:first-child {
    margin-left: 34.04255319148936%;
    *margin-left: 33.93617021276596%;
}
.row-fluid .offset3 {
    margin-left: 27.659574468085104%;
    *margin-left: 27.5531914893617%;
}
.row-fluid .offset3:first-child {
    margin-left: 25.53191489361702%;
    *margin-left: 25.425531914893618%;
}
.row-fluid .offset2 {
    margin-left: 19.148936170212764%;
    *margin-left: 19.04255319148936%;
}
.row-fluid .offset2:first-child {
    margin-left: 17.02127659574468%;
    *margin-left: 16.914893617021278%;
}
.row-fluid .offset1 {
    margin-left: 10.638297872340425%;
    *margin-left: 10.53191489361702%;
}
.row-fluid .offset1:first-child {
    margin-left: 8.51063829787234%;
    *margin-left: 8.404255319148938%;
}
[class*="span"].hide,
.row-fluid [class*="span"].hide { display: none }
[class*="span"].pull-right,
.row-fluid [class*="span"].pull-right { float: right }
.container-fluid {
    padding-right: 20px;
    padding-left: 20px;
    *zoom: 1;
}
.container-fluid:before,
.container-fluid:after {
    display: table;
    line-height: 0;
    content: "";
}
.container-fluid:after { clear: both }

/* 1.6 Grids for Forms
-------------------------------------------------- */

input,
textarea { margin-left: 0 }
.controls-row [class*="span"] + [class*="span"] { margin-left: 20px }
input.span12,
textarea.span12 { width: 926px }
input.span11,
textarea.span11 { width: 846px }
input.span10,
textarea.span10 { width: 766px }
input.span9,
textarea.span9 { width: 686px }
input.span8,
textarea.span8{ width: 606px }
input.span7,
textarea.span7 { width: 526px }
input.span6,
textarea.span6 { width: 446px }
input.span5,
textarea.span5 { width: 366px }
input.span4,
textarea.span4{ width: 286px }
input.span3,
textarea.span3{ width: 206px }
input.span2,
textarea.span2{ width: 126px }
input.span1,
textarea.span1{ width: 46px }

/*-----------------------------------------------------------------------------------*/
/*	2.	Header and Menu
/*-----------------------------------------------------------------------------------*/

.navbar {
    overflow: visible;
    margin-bottom: 20px;
    color: #ffffff;
    *position: relative;
    *z-index: 2;
}
.navbar-inner {
    min-height: 40px;
    padding-left: 20px;
    padding-right: 20px;
    *zoom: 1;
}
.navbar-inner:before,
.navbar-inner:after {
    display: table;
    content: "";
    line-height: 0;
}
.navbar-inner:after { clear: both }
.navbar .container { width: auto }
.navbar .logo {
    display: block;
    float: left;
    width: 119px;
    height: 38px;
    margin-top: 22px;
    background: url(../images/logo.png) no-repeat;
}
.navbar-fixed-top {
    position: fixed;
    right: 0;
    left: 0;
    z-index: 1030;
    margin-bottom: 0;
}
.navbar-fixed-top .navbar-inner {
    border-width: 0 0 1px;
    padding-left: 0;
    padding-right: 0;
}
.navbar-fixed-top .container { width: 940px }
.navbar-fixed-top { top: 0; position: fixed; }
.navbar .nav {
    position: relative;
    left: 0;
    display: block;
    float: left;
    margin: 0 10px 0 0;
	padding:0
}
.navbar .nav.pull-right {
    float: right;
    margin-right: 0;
}
.navbar .nav > li {
    float: left;
    font-family: 'MenschBold', Helvetica, Arial, sans-serif;
    text-shadow: 0 2px 0 rgba(0, 0, 0, 0.16);
}
.navbar .nav > li > a {
    float: none;
    padding: 10px 15px 10px;
    text-decoration: none;
}
.navbar-inverse .nav > li > a:focus,
.navbar-inverse .nav > li > a:hover,
.navbar-inverse .nav .active > a,
.navbar-inverse .nav .active > a:hover,
.navbar-inverse .nav .active > a:focus { color: #ffc9c2 }
.nav {
    margin-left: 0;
    margin-bottom: 20px;
    list-style: none;
}
.nav > li > a { display: block }
.navbar .nav > li,
.navbar-inner {
    line-height: 60px;
    font-size: 20px;
	*height: 80px;

}
.navbar-inverse .navbar-inner {
	background: #423134; /* Old browsers */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQyMzEzNCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzMzI2MjgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  #423134 0%, #332628 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#423134), color-stop(100%,#332628)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #423134 0%,#332628 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #423134 0%,#332628 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #423134 0%,#332628 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #423134 0%,#332628 100%); /* W3C */
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.3);
   -webkit-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.3);
   -moz-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.3);
   -webkit-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.3);
   -moz-box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.3);
 -pie-background: linear-gradient(#423134, #332628  100%);
    behavior: url(pie/PIE.php);
	position:relative
}
.navbar-inverse .nav > li > a { color: #ffffff }
.navbar .btn-navbar {
	display: none;
	float: right;
	background: #ed8280 url(../images/menu.png) center no-repeat;
	width: 32px;
	height: 32px;
	margin: 20px 0;
}
/*-----------------------------------------------------------------------------------*/
/*	3.	Slider Section
/*-----------------------------------------------------------------------------------*/

/* 3.1 General
-------------------------------------------------- */

#welcome { padding: 0 }
#slideshow {
    position: relative;
    height: 640px;
    width: 100%;
    overflow: hidden;
    margin-top: 80px;
}

#slideshow ul.slides {
    list-style: none;
    padding: 0;
    height: 640px;
    width: 100%;
    margin: 0;
	clear: left;
}
#slideshow li.slide {
    padding: 100px 0;
    height: 540px;
    width: 100%;
    margin: 0;
    overflow: hidden;
}
#welcome .head_animation,
#welcome .head2_animation,
#welcome .descr_animation {
    display: none;
    opacity: 0;
}
.img_animation,
.descr_animation,
.descr_animation ul,
.descr_animation p,
.descr_animation h2 { position: relative }

/* 3.2 Navigation
-------------------------------------------------- */

#PausePlay{ 
    width: 32px;
    height: 32px;
	background: #5e464a url(../images/pauseplay.png) 0 -32px no-repeat;
	padding:0;
}
#PausePlay.pause{ 
    width: 32px;
    height: 32px;
	background-position: 0 0px;
	padding:0;
}
#welcome .next,
#welcome .prev {
	behavior: url(pie/PIE.php);
    cursor: pointer;
    position: absolute;
    top: 295px;
    background: #5e464a url(../images/arrows.png);
    width: 53px;
    height: 50px;
    line-height: 50px;
    color: #ffffff;
    border: none;
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;
    border-radius: 3px;
    z-index: 999;
}
#welcome .next { right: -3px }
#welcome .prev { background-position: 0 -50px; left: -3px }
#welcome .next:hover,
#welcome .prev:hover { background-color: #ed8280 }
#welcome .navslider {
	list-style: none;
	position: relative;
	bottom: 80px;
	margin: 0 auto;
	height: 32px;
	text-align: center;
	padding: 0;
}
#welcome .navslider li {
	display: inline;
	margin-right: 2px;
	*margin-right:0;
}
/* 3.3 Slide 1 (Section 1)
-------------------------------------------------- */

#section1 h1 {
    font-size: 240px;
    color: #ed8280;
    line-height: 210px;
    margin: 40px 0;
}
#section1 h2 {
    font-size: 60px;
    text-align: center;
    z-index: 10;
}
#section1 .head_animation { font-family: 'MenschInline', Helvetica, Arial, sans-serif }
.emotion {
    font-size: 40px;
    font-family: arial;
    font-weight: bold;
    top: -30px;
    color: #ed8280;
}
/* 3.4 Slide 2 (Section 2)
-------------------------------------------------- */

#section2 .descr_animation ul { margin-left: 10px; margin-top: 40px; }
#section2 .head1_animation { font-size: 120px; margin-top: 40px;}
#section2 .p_animation {
    text-align: right;
	margin-top: 40px;
}
#section2 .descr_animation ul li { position: relative ; }
#section2 h1 {
    font-size: 85px;
    margin: 0;
    text-align: right;
}


/*-----------------------------------------------------------------------------------*/
/*	5.	Portfolio Section
/*-----------------------------------------------------------------------------------*/

.portfolionav {
	margin: 0 0 50px 0;
	text-align: center;
}
.portfolionav button {
	margin: 6px 6px;
}
.portfolionav button.active {
	color: #ed8280;
}
.portfolio h3 {
	margin: 0 0 20px 0;
}
.portfolio h3 + p {
	margin: -20px 0 20px 0;
}

/*-----------------------------------------------------------------------------------*/
/*	6.	About Section
/*-----------------------------------------------------------------------------------*/

#about .social > *{position:relative}
.team h3 + h5 {
    margin: -5px 0;
    color: #ffc9c2;
}
.tweet-img {
	display: block;
	padding: 0;
	width: 86px;
	float: left;
	height: 86px;
	margin: 0;
	position: relative;
	background: url(../images/tweet.png);
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='tweet.png',sizingMethod='crop');
}
#tweets { min-height: 100px }
.tweets ul.tweetList {
    min-height: 86px;
    list-style: none;
    margin: 0;
    padding: 0;
}
.tweets .timestamp { line-height: 12px }
.tweets .tweetList a { text-decoration: underline }
.tweets .tweetList li > p {
    font: normal 18px/24px 'Droid Sans', Helvetica, Arial, sans-serif;
    padding: 0;
    text-align: right;
    margin: 0;
}
.tweets time { font: normal 16px/24px "Droid Serif", Georgia, Times, serif }

/*-----------------------------------------------------------------------------------*/
/*	7.	Blog Section
/*-----------------------------------------------------------------------------------*/

#blogposts { z-index: 1 }
.post{position: relative}
.post p {
    line-height: 24px;
    font-size: 15px;
}
.post h2 {
    margin-bottom: 6px;
    margin-top: 20px;
    color: #5e464a;
}
.meta {
    margin: 0;
    color: #ed8280;
}
.meta + p {
	margin: 0 0 15px 0;
}
.PaginationsBlog {
    text-align: center;
    position: relative;
}
.PaginationsBlog .btn {
	margin: 0 2px;
}
.blog .posts h2 {
    margin-top: 0;
    margin-bottom: 5px;
}
.blog .posts h3 {
	margin: 20px 0;
}
.ajax{ position:relative; }
.loading { text-align: center; }

/*-----------------------------------------------------------------------------------*/
/*	8.	Contacts Section
/*-----------------------------------------------------------------------------------*/

/* 8.1 Contact form
-------------------------------------------------- */

.form_contacts { margin-top: -9px }
.form_contacts .controls { margin: 0px 0 }
.form_contacts .control-label {
    margin: 0;
    line-height: 42px;
}
.form_contacts .controls textarea,
.form_contacts .controls input[type="text"] {
    behavior: url(pie/PIE.php);
    font: normal 14px/14px 'Droid Sans', Helvetica, Arial, sans-serif;
    margin: 0;
    color: #ffffff;
    border: 1px solid #b09b95;
    background: #b09b95;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    box-shadow: inset 2px 2px 6px 0px rgba(0, 0, 0, 0.08);
    -webkit-box-shadow: inset 2px 2px 6px 0px rgba(0, 0, 0, 0.08);
    -moz-box-shadow: inset 2px 2px 6px 0px rgba(0, 0, 0, 0.08);
    float: left;
    position: relative;
}
.form_contacts .controls input[type="text"] {

    padding: 10px 0 10px 15px;
}
.form_contacts .controls textarea {

    padding: 10px 0 10px 15px;
    position: relative;
}
.form_contacts .controls textarea:focus,
.form_contacts .controls input[type="text"]:focus,
.form_contacts .controls input[type="email"]:focus {
	behavior: url(pie/PIE.php);
    outline: 0;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #423134;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #423134;
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #423134;
}
.form_contacts input[placeholder] { color: #ffffff!important }
.form_contacts ::-webkit-input-placeholder { color: #ffffff!important }
.form_contacts :-moz-placeholder { color: #ffffff!important }
.form_contacts .btn {
    margin-top: 10px;
    margin-left: 0;
}

/* 8.2 Validate fields  + 10.1 Alerts ˅
-------------------------------------------------- */

.form_contacts .controls span.alert.alert-error {
	float: right;
	margin: -36px 0 0 0;
	padding: 4px 8px;
	position: relative;
	text-align: right;
}
.form_contacts span.required {
	margin-left: 5px;
	color: #ed8280;
}
#fc_message {
	text-align: center;
	padding: 20px 0;
}

/* 8.3 Rich Snippet (Contact Info)
-------------------------------------------------- */

div [itemtype="http://schema.org/Organization"] {
	font-weight: bold;
	color: #ffc9c2;
	margin-top: 30px;
}
[itemprop="name"] {
	font: normal 24px/32px 'MenschBold', Helvetica, Arial, sans-serif;
	display: block;
	margin: 0 0 15px 0;
	color: #ffffff;
}
[itemprop="streetAddress"],
[itemprop="postalCode"],
[itemprop="addressLocality"],
[itemprop="telephone"],
[itemprop="faxNumber"],
[itemprop="email"] {
	font-weight: normal;
	line-height: 36px;
	margin-left: 5px;
	color: #ffffff;
}

/* 8.4 Google Map (color map in js)
-------------------------------------------------- */

#GoogleMap {
	width: 100%;
	height: 600px;
	position: relative;
	margin-bottom: -100px;
}

/* 8.5 Popup Window at Google Map
-------------------------------------------------- */

.marker {
	behavior: url(pie/PIE.php);
	font: normal 15px/24px 'Droid Sans', Helvetica, Arial, sans-serif;
	cursor: default;
	position: absolute;
	top: -150px;
	left: -105px;
	color: #5e464a;
	box-shadow: 0 0 10px #000;
    -webkit-box-shadow: 0 0 10px #000;
    -moz-box-shadow: 0 0 10px #000;
	background: #b09b95;
	border-radius: 4px;
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
   width: 300px
}
.marker img {
	padding: 0;
	border-bottom: none;
}
.marker .contentmarker {
	background: #ffffff;
}
.contentmarker p {
	text-shadow: none;
	padding: 0 15px;
}
.footermarker p {
	margin: 0;
	padding: 15px 0;
	color: #ffffff;
	font-size: 14px;
	text-align: right;
}
.marker .footermarker .btn {
	margin: 20px 17px;
}
.marker .contentmarker span {
	font: normal 18px/24px 'MenschBold', Helvetica, Arial, sans-serif;
}

/*-----------------------------------------------------------------------------------*/
/*	9.	Footer Section
/*-----------------------------------------------------------------------------------*/

.footer {
	padding: 6px 0;
}
.footer .social {
	float: right;
	margin-top: 16px;
}
#footer .copyright{
	font: normal 20px/24px 'MenschBold', Helvetica, Arial, sans-serif;
	margin: 10px 0px;
}

/*-----------------------------------------------------------------------------------*/
/*	10. Elements, UI 
/*-----------------------------------------------------------------------------------*/

/* 10.1 Alerts 
-------------------------------------------------- */

.alert {
    margin: 20px 0;
    font-size: 14px;
}
.alert h3 { margin: 0 }
.alert .close {
    position: relative;
    top: -2px;
    right: -21px;
    line-height: 20px;
}
.alert-success {
    color: #ffffff;
    font-size: 16px;
}
.alert-success h3 {
    color: #ffffff;
    margin: 0;
    line-height: 28px;
}
.alert-error {
    color: #ed8280;
    font-size: 14px;
}
.alert-error h3 { color: #ed8280 }

/* 10.2 Image Shadow 
-------------------------------------------------- */

.image {
    position: relative;
    width: 100%;
    z-index: 1;
    margin: 0 0 20px 0;
    padding: 0;
}
.image:before,
.image:after {
    content: "";
    position: absolute;
    z-index: -1;
    bottom: 10px;
    left: 20px;
    width: 50%;
    height: 20%;
    max-width: 300px;
    box-shadow: 0 9px 9px rgba(0, 0, 0, 0.4);
    -webkit-box-shadow: 0 9px 9px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0 9px 9px rgba(0, 0, 0, 0.4);
    -webkit-transform: skew(-15deg) rotate(-4deg);
    -moz-transform: skew(-15deg) rotate(-4deg);
    -ms-transform: skew(-15deg) rotate(-4deg);
    -o-transform: skew(-15deg) rotate(-4deg);
    transform: skew(-15deg) rotate(-4deg);
}
.image:after {
    left: auto;
    right: 20px;
    -webkit-transform: skew(15deg) rotate(4deg);
    -moz-transform: skew(15deg) rotate(4deg);
    -ms-transform: skew(15deg) rotate(4deg);
    -o-transform: skew(15deg) rotate(4deg);
    transform: skew(15deg) rotate(4deg);
}

/* 10.3 Hover Effect
-------------------------------------------------- */

.overlay-block > * {
    margin-bottom: -7px;
    margin-bottom: -10px \0/;
}
.overlay-block > .overlay { margin-bottom: 0 }
.overlay-block {
    position: relative;
    overflow: hidden;
    background: #151515 url(../images/hover/progress.gif) no-repeat center center;
    border: 4px solid #b09b95;
    cursor: pointer;
}
.overlay {
    display: none;
    z-index: 5;
    position: absolute;
    width: 100%;
    height: 100%;
    background: #5e464a;
}
.circle .overlay {
    background: url(../images/hover/hover-magnify.png) no-repeat center center;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=00)";
    filter: alpha(opacity=00);
    display: none;
}
.fades .overlay {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=00)";
    filter: alpha(opacity=00);
    background: url(../images/hover/overlay.png);
}
.bar .overlay {
    bottom: -100px;
    height: 100px;
    background: url(../images/hover/overlay.png);
}
.bar2 .overlay {
    bottom: -50px;
    height: 100px;
    opacity: 0.8;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
    filter: alpha(opacity=80);
}
.bar2 .overlay:hover {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
}
.bar3 .overlay {
    top: -100px;
    height: 100px;
    background: url(../images/hover/overlay.png);
}
.details,
.details h3,
.details p {
    color: white;
    text-align: center;
    text-shadow: none;
    margin: 5px 0;
    padding: 4px;
}
.details h3 + p { margin-top: -10px }
.fades .details { 
	padding: 0;
	height: 100%;
	top: 35%;
	position: absolute;
	margin: 0 auto;
	width: 100%;
 }
.overlay .social {
    margin: 0 auto;
    width: 168px;
    height: 40px;
}
.details h3,
.details h2 {
    font-size: 22px;
    line-height: 24px;
}

/* 10.4 Social Icons
-------------------------------------------------- */

ul.social {
    padding: 0;
    margin: 0;
    list-style-type: none;
}
.social li {
    float: left;
    margin: 0 1px;
    margin-bottom: 2px;
    padding: 0px;
    display: inline;
    width: auto;
}
.social li a {
    -moz-transition: all 0.3s ease 0s;
    display: block!important;
    float: left!important;
    height: 100%!important;
    margin: 0!important;
    padding: 0!important;
    width: 40px!important;
    height: 40px!important;
    text-indent: -9999px !important;
}
/*white*/
.social li.facebook a { background: url(../images/social_icon/facebook.png) no-repeat 0 0 }
.social li.twitter a { background: url(../images/social_icon/twitter.png) no-repeat 0 0 }
.social li.googleplus a { background: url(../images/social_icon/googleplus.png) no-repeat 0 0 }
.social li.linkedin a { background: url(../images/social_icon/linkedin.png) no-repeat 0 0 }
.social li.youtube a { background: url(../images/social_icon/youtube.png) no-repeat 0 0 }
.social li.dribbble a { background: url(../images/social_icon/dribbble.png) no-repeat 0 0 }
.social li.vimeo a { background: url(../images/social_icon/vimeo.png) no-repeat 0 0 }
.social li.flickr a { background: url(../images/social_icon/flickr.png) no-repeat 0 0 }
.social li.forrst a { background: url(../images/social_icon/forrst.png) no-repeat 0 0 }
.social li.rss a { background: url(../images/social_icon/rss.png) no-repeat 0 0 }
.social li.behance a { background: url(../images/social_icon/behance.png) no-repeat 0 0 }
.social li.skype a { background: url(../images/social_icon/skype.png) no-repeat 0 0 }
.social li.deviantart a { background: url(../images/social_icon/deviantart.png) no-repeat 0 0 }
/*color*/
.social.color li.facebook a { background: url(../images/social_icon/color/facebook.png) no-repeat 0 0 }
.social.color li.twitter a { background: url(../images/social_icon/color/twitter.png) no-repeat 0 0 }
.social.color li.googleplus a { background: url(../images/social_icon/color/googleplus.png) no-repeat 0 0 }
.social.color li.linkedin a { background: url(../images/social_icon/color/linkedin.png) no-repeat 0 0 }
.social.color li.youtube a { background: url(../images/social_icon/color/youtube.png) no-repeat 0 0 }
.social.color li.dribbble a { background: url(../images/social_icon/color/dribbble.png) no-repeat 0 0 }
.social.color li.vimeo a { background: url(../images/social_icon/color/vimeo.png) no-repeat 0 0 }
.social.color li.flickr a { background: url(../images/social_icon/color/flickr.png) no-repeat 0 0 }
.social.color li.forrst a { background: url(../images/social_icon/color/forrst.png) no-repeat 0 0 }
.social.color li.rss a { background: url(../images/social_icon/color/rss.png) no-repeat 0 0 }
.social.color li.behance a { background: url(../images/social_icon/color/behance.png) no-repeat 0 0 }
.social.color li.skype a { background: url(../images/social_icon/color/skype.png) no-repeat 0 0 }
.social.color li.deviantart a { background: url(../images/social_icon/color/deviantart.png) no-repeat 0 0 }

/* 10.5 Buttons
-------------------------------------------------- */

.btn.btn-big { padding: 8px 30px }
.btn.btn-small {
    padding: 3px 11px;
    font-size: 13px;
}
.light .btn.btn-light { background: #b09b95 }
.dark .btn.btn-light { background: #b09b95 }
.btn {
    behavior: url(pie/PIE.php);
    display: inline-block;
    *display: inline;
    border-radius: 4px;
   -webkit-border-radius: 4px;
   -moz-border-radius: 4px;
    padding: 6px 12px;
    margin: 0;
    text-shadow: none;
    border: none;
    position: relative;
    *zoom: 1;
    font-size: 14px;
    line-height: 20px;
    *line-height: 16px;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    *margin-left: .3em;
}
.light .btn {
    background: #5e464a;
    color: #ffffff;
}
.light .btn:hover,
.light .btn.active,
.light .btn:active {
    background: #ed8280;
    color: #ffffff;
}
.dark .btn {
    background: #ed8280;
    color: #ffffff;
}
.dark .btn a { color: #ffffff }
.dark .btn a:hover,
.dark .btn.active,
.dark .btn:hover {
    background: #423134;
    color: #ffffff;
}

/* 10.6 List Style
-------------------------------------------------- */

ul.list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.list li {
    padding: 0 0 0 40px;
    line-height: 24px;
    margin-bottom: 14px;
    min-height: 24px;
}
.list.check li { background: url(../images/icons/check.png) no-repeat }
.list.plus li { background: url(../images/icons/plus.png) no-repeat }
.list.minus li { background: url(../images/icons/minus.png) no-repeat }
.list.close li { background: url(../images/icons/close.png) no-repeat }
.list.warning li { background: url(../images/icons/warning.png) no-repeat }
.list.num li[data-num="num1"] { background: url(../images/icons/num1.png) no-repeat }
.list.num li[data-num="num2"] { background: url(../images/icons/num2.png) no-repeat }
.list.num li[data-num="num3"] { background: url(../images/icons/num3.png) no-repeat }
.list.num li[data-num="num4"] { background: url(../images/icons/num4.png) no-repeat }
.list.num li[data-num="num5"] { background: url(../images/icons/num5.png) no-repeat }
.list.num li[data-num="num6"] { background: url(../images/icons/num6.png) no-repeat }
.list.num li[data-num="num7"] { background: url(../images/icons/num7.png) no-repeat }
.list.num li[data-num="num8"] { background: url(../images/icons/num8.png) no-repeat }
.list.num li[data-num="num9"] { background: url(../images/icons/num9.png) no-repeat }

/* 10.7 Label
-------------------------------------------------- */

.label {
    display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: middle;
    padding: 2px 4px;
    font-size: 13px;
    font-weight: bold;
    line-height: 14px;
    color: #ffffff;
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.14);
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #ed8280;
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;
    border-radius: 3px;
	position: relative;
}
.label.labeldark { background: #b09b95 }
.label:empty { display: none }
a.label:hover,
a.label:focus {
    color: #ffffff;
    text-decoration: none;
    cursor: pointer;
}
.label a:hover { color: #423134 }
.label a {
    color: #ffffff;
    text-decoration: underline;
}

/* 10.8 PrettyPhoto 'emotion_theme'
-------------------------------------------------- */

div.emotion_theme .pp_bottom .pp_left,
div.emotion_theme .pp_bottom .pp_middle,
div.emotion_theme .pp_bottom .pp_right,
div.emotion_theme .pp_content_container .pp_left ,
div.emotion_theme .pp_content_container .pp_right,
div.emotion_theme .pp_top .pp_left ,
div.emotion_theme .pp_top .pp_middle,
div.emotion_theme .pp_top .pp_right,
div.emotion_theme .pp_content {
    background: #ffffff;
}
div.emotion_theme .pp_content_container .pp_details { position: relative }
div.emotion_theme .pp_close {
    width: 30px;
    height: 30px;
    background: url(../images/prettyPhoto/default/sprite.png) 2px 1px no-repeat;
    cursor: pointer;
}
div.emotion_theme .pp_bottom {
    position: relative;
    top: -2px;
}
div.emotion_theme .pp_expand {
    background: url(../images/prettyPhoto/default/sprite.png) 0 -29px no-repeat;
    cursor: pointer;
    width: 28px;
    height: 28px;
}
div.emotion_theme .pp_nav {
    clear: none;
    height: 30px;
    width: 110px;
    position: relative;
}
div.emotion_theme .pp_nav .pp_play,
div.emotion_theme .pp_nav .pp_pause {
    background: url(../images/prettyPhoto/default/sprite.png) -51px 1px no-repeat;
    height: 30px;
    width: 30px;
}
div.emotion_theme a.pp_arrow_previous,
div.emotion_theme a.pp_arrow_next {
    background: url(../images/prettyPhoto/default/sprite.png) -31px -3px no-repeat;
    height: 20px;
    width: 20px;
    margin: 4px 0 0;
}
div.emotion_theme .pp_nav .currentTextHolder {
    font-family: "Droid Serif", Georgia, Times, serif;
    font-style: italic;
    color: #999;
    font-size: 11px;
    left: 75px;
    line-height: 25px;
    position: absolute;
    top: 2px;
    margin: 0;
    padding: 0 0 0 10px;
}
div.emotion_theme a.pp_arrow_next {
    left: 52px;
    background-position: -82px -3px;
}
div.emotion_theme .pp_description {
    font-size: 11px;
    font-weight: 700;
    line-height: 14px;
    margin: 5px 50px 5px 0;
}
div.emotion_theme .pp_content_container .pp_left { padding-left: 20px }
div.emotion_theme .pp_next:hover {
    background: url(../images/prettyPhoto/default/sprite_next.png) center right no-repeat;
    cursor: pointer;
}
div.emotion_theme .pp_previous:hover {
    background: url(../images/prettyPhoto/default/sprite_prev.png) center left no-repeat;
    cursor: pointer;
}
div.emotion_theme .pp_content_container .pp_social .facebook { width: 100px }
div.emotion_theme .pp_expand:hover {
    background: url(../images/prettyPhoto/default/sprite.png) 0 -56px no-repeat;
    cursor: pointer;
}
div.emotion_theme .pp_contract {
    background: url(../images/prettyPhoto/default/sprite.png) 0 -84px no-repeat;
    cursor: pointer;
    width: 28px;
    height: 28px;
}
div.emotion_theme .pp_contract:hover {
    background: url(../images/prettyPhoto/default/sprite.png) 0 -113px no-repeat;
    cursor: pointer;
}
div.emotion_theme .pp_gallery ul li a {
    background: url(../images/prettyPhoto/default/default_thumb.png) center center #f8f8f8;
    border: 1px solid #aaa;
}
div.emotion_theme .pp_social { margin-top: 7px }
div.emotion_theme .pp_gallery a.pp_arrow_previous,
div.emotion_theme .pp_gallery a.pp_arrow_next {
    position: static;
    left: auto;
}
div.emotion_theme .pp_nav .pp_pause { background-position: -51px -29px }
div.emotion_theme a.pp_arrow_next {
    left: 52px;
    background-position: -82px -3px;
}
div.emotion_theme .pp_content_container .pp_details { margin-top: 5px }
div.emotion_theme .pp_nav {
    clear: none;
    height: 30px;
    width: 110px;
    position: relative;
}
div.emotion_theme .pp_close:hover,
div.emotion_theme .pp_nav .pp_play:hover,
div.emotion_theme .pp_nav .pp_pause:hover,
div.emotion_theme .pp_arrow_next:hover,
div.emotion_theme .pp_arrow_previous:hover { opacity: 0.7 }
div.emotion_theme .pp_description {
    font-size: 11px;
    font-weight: 700;
    line-height: 14px;
    margin: 5px 50px 5px 0;
}
div.emotion_theme .pp_loaderIcon { background: url(../images/prettyPhoto/default/loader.gif) center center no-repeat }
div.emotion_theme .pp_top,div.emotion_theme .pp_top .pp_middle,div.emotion_theme .pp_top .pp_left,div.emotion_theme .pp_top .pp_right,div.emotion_theme .pp_bottom,div.emotion_theme .pp_bottom .pp_left,div.emotion_theme .pp_bottom .pp_middle,div.emotion_theme .pp_bottom .pp_right{height:20px}
div.emotion_theme .pp_gallery ul li a:hover,div.emotion_theme .pp_gallery ul li.selected a{border-color:#fff}
div.emotion_theme .pp_details{position:relative}

/* 10.9 Progress Bar
-------------------------------------------------- */

@-webkit-keyframes progress-bar-stripes {
  from {
    background-position: 40px 0;
  }
  to {
    background-position: 0 0;
  }
}

@-moz-keyframes progress-bar-stripes {
  from {
    background-position: 40px 0;
  }
  to {
    background-position: 0 0;
  }
}

@-ms-keyframes progress-bar-stripes {
  from {
    background-position: 40px 0;
  }
  to {
    background-position: 0 0;
  }
}

@-o-keyframes progress-bar-stripes {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 40px 0;
  }
}

@keyframes progress-bar-stripes {
  from {
    background-position: 40px 0;
  }
  to {
    background-position: 0 0;
  }
}
.progress {
	height: 26px;
	margin-bottom: 18px;
	overflow: hidden;
	background-repeat: repeat-x;
	-webkit-border-radius: 4px;
	 -moz-border-radius: 4px;
		  border-radius: 4px;
	-webkit-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.05);
	 -moz-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.05);
		  box-shadow: 0 1px 1px rgba(255, 255, 255, 0.05);
		  position:relative
}
.dark .progress {
	background: #423134; 
}
.light .progress{
	background: #b09b95;
}
.progress {
	height: 26px;
	margin-bottom: 18px;
	overflow: hidden;
	background-repeat: repeat-x;
	-webkit-border-radius: 4px;
	 -moz-border-radius: 4px;
		  border-radius: 4px;
	-webkit-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.05);
	 -moz-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.05);
		  box-shadow: 0 1px 1px rgba(255, 255, 255, 0.05);
		      position: relative;
}
.dark .progress {
	background: #423134; 
}
.light .progress{
	background: #b09b95;
}
.progress .bar {
  float: left;
  width: 0;
  height: 100%;
  font-size: 12px;
  color: #ffffff;
  text-align: center;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
      -pie-background: linear-gradient(#ed8280, #ea6c6a 70%);
    behavior: url(pie/PIE.php);
  background-color: #ed8280;
	background: -moz-linear-gradient(top,  #ed8280 0%, #e47472 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ed8280), color-stop(100%,#e47472)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ed8280 0%,#e47472 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ed8280 0%,#e47472 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ed8280 0%,#e47472 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ed8280 0%,#e47472 100%); /* W3C */
  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
     -moz-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
          box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-transition: width 0.6s ease;
     -moz-transition: width 0.6s ease;
       -o-transition: width 0.6s ease;
          transition: width 0.6s ease;
		      position: relative;
}
.progress-striped .bar {
  background-color: #ed8280;
  background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(0.25, rgba(255, 255, 255, 0.15)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.15)), color-stop(0.75, rgba(255, 255, 255, 0.15)), color-stop(0.75, transparent), to(transparent));
  background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -moz-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
  -webkit-background-size: 40px 40px;
     -moz-background-size: 40px 40px;
       -o-background-size: 40px 40px;
          background-size: 40px 40px;
}
.progress.active .bar {
  -webkit-animation: progress-bar-stripes 2s linear infinite;
     -moz-animation: progress-bar-stripes 2s linear infinite;
      -ms-animation: progress-bar-stripes 2s linear infinite;
       -o-animation: progress-bar-stripes 2s linear infinite;
          animation: progress-bar-stripes 2s linear infinite;
}

/* 10.11 Video Responsive
-------------------------------------------------- */

.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
.video-container iframe,  
.video-container object,  
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.overlay-block .video-container {
	margin-bottom: 0;
}

/* 10.12 Code Style
-------------------------------------------------- */

code,
pre {
	padding: 0 3px 2px;
	font-family: Monaco, Menlo, Consolas, "Courier New", monospace;
	font-size: 12px;
	color: #333333;
	-webkit-border-radius: 3px;
	 -moz-border-radius: 3px;
		  border-radius: 3px;
}
code {
	padding: 2px 4px;
	color: #d14;
	white-space: nowrap;
	background-color: #f7f7f9;
	border: 1px solid #e1e1e8;
}
pre {
	display: block;
	padding: 9.5px;
	margin: 0 0 10px;
	font-size: 13px;
	line-height: 20px;
	word-break: break-all;
	word-wrap: break-word;
	white-space: pre;
	white-space: pre-wrap;
	background-color: #f5f5f5;
	border: 1px solid #ccc;
	border: 1px solid rgba(0, 0, 0, 0.15);
	-webkit-border-radius: 4px;
	 -moz-border-radius: 4px;
		  border-radius: 4px;
}
pre.prettyprint {
	margin-bottom: 20px;
}
pre code {
	padding: 0;
	color: inherit;
	white-space: pre;
	white-space: pre-wrap;
	background-color: transparent;
	border: 0;
}
.com { color: #93a1a1; }
.lit { color: #195f91; }
.pun, .opn, .clo { color: #93a1a1; }
.fun { color: #dc322f; }
.str, .atv { color: #D14; }
.kwd, .prettyprint .tag { color: #1e347b; }
.typ, .atn, .dec, .var { color: teal; }
.pln { color: #48484c; }

.prettyprint {
  padding: 8px;
  background-color: #f7f7f9;
  border: 1px solid #e1e1e8;
}
.prettyprint.linenums {
  -webkit-box-shadow: inset 40px 0 0 #fbfbfc, inset 41px 0 0 #ececf0;
     -moz-box-shadow: inset 40px 0 0 #fbfbfc, inset 41px 0 0 #ececf0;
          box-shadow: inset 40px 0 0 #fbfbfc, inset 41px 0 0 #ececf0;
}
/* Specify class=linenums on a pre to get line numbering */
ol.linenums {
  margin: 0 0 0 33px; /* IE indents via margin-left */
  padding: 0;
}
ol.linenums li {
  padding-left: 12px;
  color: #bebec5;
  line-height: 20px;
  text-shadow: 0 1px 0 #fff;
}

/* 10.13 Special grid styles
-------------------------------------------------- */

.show-grid {
	margin-top: 10px;
	margin-bottom: 20px;
}
.show-grid [class*="span"] {
	color: #fff;
	background-color: #5e464a;
	text-align: center;
	-webkit-border-radius: 3px;
	 -moz-border-radius: 3px;
		  border-radius: 3px;
	min-height: 40px;
	line-height: 40px;
}
.show-grid [class*="span"]:hover {
	background-color: #ed8280;
}
.show-grid .show-grid {
	margin-top: 0;
	margin-bottom: 0;
}
.show-grid .show-grid [class*="span"] {
	margin-top: 5px;
}