/**********************************************************************************

	Project Name: ModernTheme
	Project Description: Responsive and modern html template
	File Name: styles.css
	Author: Thai Nguyen
	Author URI: http://www.peacethemes.com
	Version: 1.0

**********************************************************************************/

/**
  Table of content
  ================================================ 
  1. General styles
  2. Layout
  3. Typography
    3.1 Heading and title
    3.2 Bottom border
    3.2 hr tag
    3.3 Button
    3.4 List style
    3.5 Alert box
    3.6 Dropcap and highlight
    3.7 Others style
  4. Header
  5. Footer
    5.1 Footer modules
    5.2 Social icons
  6. Copyright
  7. Section-cast
  8. Section-Content
    8.1 Homepage
    8.2 Post info
    8.3 Post comment
  9. Slideshow
  10. Thumbnail effect
  11. Cotrol button
  12. Tab plugin
  13. Portlofio page
  14. Right sidebar
  15. Other styles
    15.1 Tooltip
    15.2 Contact form and Navigation
    15.3 Back to top button
    15.4 Width in percent
    15.5 Other
  16. Retina ready
  17. Responsive design
  18. Fixes for IE 8,9
  ================================================**/

/* 1. General Styles
================================================== */

body {
    background-color: #1f2933;
    background-image: url('../../images/body-bg.png');
    font: 14px/1.5em 'Open Sans', sans-serif;
    color: #afb8c0;
    -webkit-font-smoothing: antialiased; }

p { margin-bottom: 1em }

h1, h2, h3 { text-transform: uppercase }

h1 { font: 700 30px/1.5em 'Open Sans', sans-serif }

h2 { font: 700 24px/1.5em 'Open Sans', sans-serif }

h3 { font: 600 18px/1.5em 'Open Sans', sans-serif }

h4 { font: 700 16px/1.5em 'Open Sans', sans-serif }

h5 { font: 600 14px/1.5em 'Open Sans', sans-serif }

h6 { font: 600 13px/1.5em 'Open Sans', sans-serif }

a {
    text-decoration:underline;
    color: #66cad0;
    -webkit-transition: color 0.1s ease-out;
    -moz-transition: color 0.1s ease-out;
    -o-transition: color 0.1s ease-out;
    transition: color 0.1s ease-out; }

a:hover { color: #ffffff }

hr {
    border: none;
    margin: 0;
    height: 1px;
    background: #364757; }

blockquote {
    display: block;
    width: 80%;
    max-width: 620px;
    color: #ffffff;
    padding: 1em 4em 1em 2em;
    margin: 0 0 1em 3em;
    border-bottom: 2px solid #66bed0;
    font: 12px/2em 'Open Sans', sans-serif;
    background: #364757; }

ul, li {
	text-align:left;
	list-style-type:disc;
	list-style:disc;
	list-style-position: outside;
	padding-left:20px;
}

li {
	margin-bottom:10px;
}

cite {
    display: block;
    font-style: italic;
    color: #66bed0;
    font-size: 13px; }

cite:before { content: "-- " }

img { max-width: 100% }

table {
    border-collapse: collapse;
    border-spacing: 0px; }

	table tr td, table tr th { border: 1px solid #2c3a47 }

	table tr th {
	    font-weight: 700;
	    background: #18212b;
	    padding: 9px 24px;
	    text-align: left; }

	table tr td { padding: 9px 24px }

textarea { overflow: auto }

.sprite {
    display: block;
    cursor: pointer;
    background: url('images/sprites.png') no-repeat; }

/*Placehoder style*/

:-moz-placeholder {
    color: #afb8c0;
    font: 13px/1.5em 'Open Sans', sans-serif; }

::-moz-placeholder {
    color: #afb8c0;
    font: 13px/1.5em 'Open Sans', sans-serif; }

:-ms-input-placeholder {
    color: #afb8c0;
    font: 13px/1.5em 'Open Sans', sans-serif; }

::-webkit-input-placeholder {
    color: #afb8c0;
    font: 13px/1.5em 'Open Sans', sans-serif; }

/* 2. Layout
================================================== */

.padding3em { padding: 3em 0 }

.padding2em { padding: 2em 0 }

.padding1em { padding: 1em 0 }

.top1em { padding-top: 1em }

.top2em { padding-top: 2em }

.top3em { padding-top: 3em }

.top4em { padding-top: 4em }

.top5em { padding-top: 5em }

.bottom1em { padding-bottom: 1em }

.bottom2em { padding-bottom: 2em }

.bottom3em { padding-bottom: 3em }

.bottom4em { padding-bottom: 4em }

.bottom5em { padding-bottom: 5em }

.align-center {
    display: block;
    margin-left: auto;
    margin-right: auto; }

.text-left { text-align: left }

.text-right { text-align: right }

.align-left { float: left }

.align-right { float: right }

img.align-left { margin: 8px 16px 8px 0 }

img.align-right { margin: 8px 0 8px 16px }

h3.align-top { margin-top: -6px }

/* 3. Typography
================================================== */

.small { font: 13px/1.75em 'Open Sans', sans-serif }

.smaller { font: 12px/1.75em 'Open Sans', sans-serif }

.tiny { font: 11px/1.5em 'Open Sans', sans-serif }

.semibold { font-weight: 600 }

.bold { font-weight: 700 }

.italic { font-style: italic }

/*3.1 Heading and title
*/

.heading {
    color: #ffffff;
    text-shadow: 0px 1px 0px #b3b3b3;
    /* Chrome, Firefox 3.5+, IE 10+, Opera 9+, Safari 1+ */ }

	.heading a:hover {
	    text-shadow: 0px 1px 0px #8dcfdc;
	    /* Chrome, Firefox 3.5+, IE 10+, Opera 9+, Safari 1+ */ }

.heading.big { font: 700 16px/1.5em 'Open Sans', sans-serif }

.heading.small { font: 600 14px/1.5em 'Open Sans', sans-serif }

.light, ul.light a, a.light { color: #afb8c0 }

ul.light a:hover, a.light:hover { color: #66bed0 }

.white, ul.white a, a.white { color: #ffffff }

ul.white a:hover, a.white:hover { color: #66bed0 }

.title {
    font-weight: 600;
    text-transform: none; }

.title.feature { font: 600 24px/1.5em 'Open Sans', sans-serif }

/*3.2 Bottom border
*/

.border2px { border-bottom: 2px solid #66bed0 }

.border5px { border-bottom: 5px solid #66bed0 }

.border8px { border-bottom: 8px solid #66bed0 }

/*3.2 hr tag
*/

hr.strong {
    margin: 0 0 1em 0;
    border-top: 1px solid #000000;
    -webkit-box-shadow: 0px 1px 1px 0px #2d363f;
    /* Android 2.3+, iOS 4.0.2-4.2, Safari 3-4 */
    box-shadow: 0px 1px 1px 0px #2d363f;
    /* Chrome 6+, Firefox 4+, IE 9+, iOS 5+, Opera 10.50+ */ }

hr.weaken {
    height: 2px;
    margin: 0 0 1em 0;
    -webkit-box-shadow: inset 0 1px 2px #151d23;
    box-shadow: inset 0 1px 2px #151d23;
    background: url('../../images/top-line.png') center bottom no-repeat; }

hr.short {
    height: 3px;
    background: url('../../images/top-line.png') center bottom no-repeat; }

hr.double {
    height: 4px;
    background: none;
    border-top: 1px solid #364757;
    border-bottom: 1px solid #364757; }

.underline {
    width: 100%;
    display: block;
    background: #364757;
    margin: 0.5em 0 2em 0; }

	.underline em {
	    display: block;
	    background: #66bed0; }

.underline.big em {
    width: 285px;
    height: 5px; }

.underline.grand em {
    width: 90px;
    height: 5px; }

.underline.medium { margin: 0.25em 0 1em 0 }

	.underline.medium em {
	    width: 90px;
	    height: 4px; }

.underline.small em {
    width: 50px;
    height: 2px; }
    
.underline.custom em{ height: 5px;}

/*3.3 Button
*/

.button {
    display: inline-block;
    font: 600 13px/1.5em 'Open Sans', sans-serif;
    text-transform: uppercase;
    margin: 0.5em 1em 0.5em 0;
    padding: 12px 25px;
    border: none;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    -ms-border-radius: 6px;
    border-radius: 6px;
    background-clip: padding-box;
    -webkit-transition: background 0.2s ease-out;
    -moz-transition: background 0.2s ease-out;
    -o-transition: background 0.2s ease-out;
    transition: background 0.2s ease-out; }

.button.big {
    padding: 10px 52px;
    font-size: 15px; }

.button.medium {
    padding: 12px 25px;
    font-size: 13px; }

.button.small {
    padding: 10px 20px;
    font-size: 11px; }

.button-dark {
    color: #ebebeb;
    background-color: #334555;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#334555), to(#0b1117));
    /* Chrome, Safari 4+ */
    background-image: -webkit-linear-gradient(top, #334555, #0b1117);
    /* Chrome 10-25, iOS 5+, Safari 5.1+ */
    background-image: -moz-linear-gradient(top, #334555, #0b1117);
    /* Firefox 3.6-15 */
    background-image: -o-linear-gradient(top, #334555, #0b1117);
    /* Opera 11.10-12.00 */
    background-image: linear-gradient(to bottom, #334555, #0b1117);
    /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr= #334555 , EndColorStr= #0b1117 );
    /*For IE7-8-9*/
    zoom: 1;
    -webkit-box-shadow: 0px 1px 0px #0d0d0d, inset 0px 1px 0px #5a646f;
    box-shadow: 0px 1px 0px #0d0d0d, inset 0px 1px 0px #5a646f; }

.button-dark:hover {
    color: #ffffff;
    background-color: #314252;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#314252), to(#080c10));
    /* Chrome, Safari 4+ */
    background-image: -webkit-linear-gradient(top, #314252, #080c10);
    /* Chrome 10-25, iOS 5+, Safari 5.1+ */
    background-image: -moz-linear-gradient(top, #314252, #080c10);
    /* Firefox 3.6-15 */
    background-image: -o-linear-gradient(top, #314252, #080c10);
    /* Opera 11.10-12.00 */
    background-image: linear-gradient(to bottom, #314252, #080c10);
    /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr= #314252 , EndColorStr= #080c10 );
    /*For IE7-8-9*/
    zoom: 1;
    -webkit-box-shadow: 0px 1px 0px #000, inset 0px 1px 0px #65717d;
    box-shadow: 0px 1px 0px #000, inset 0px 1px 0px #65717d; }

.button-light {
    color: #305619;
    background-color: #a2e8ee;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#a2e8ee), to(#328aa2));
    /* Chrome, Safari 4+ */
    background-image: -webkit-linear-gradient(top, #a2e8ee, #328aa2);
    /* Chrome 10-25, iOS 5+, Safari 5.1+ */
    background-image: -moz-linear-gradient(top, #a2e8ee, #328aa2);
    /* Firefox 3.6-15 */
    background-image: -o-linear-gradient(top, #a2e8ee, #328aa2);
    /* Opera 11.10-12.00 */
    background-image: linear-gradient(to bottom, #a2e8ee, #328aa2);
    /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr= #a2e8ee , EndColorStr= #328aa2 );
    /*For IE7-8-9*/
    zoom: 1;
    -webkit-box-shadow: 0px 1px 0px #000, inset 0px 1px 0px #bdeff3;
    box-shadow: 0px 1px 0px #000, inset 0px 1px 0px #bdeff3; }

.button-light:hover {
    color: #233e12;
    background-color: #8de3ea;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#8de3ea), to(#296f83));
    /* Chrome, Safari 4+ */
    background-image: -webkit-linear-gradient(top, #8de3ea, #296f83);
    /* Chrome 10-25, iOS 5+, Safari 5.1+ */
    background-image: -moz-linear-gradient(top, #8de3ea, #296f83);
    /* Firefox 3.6-15 */
    background-image: -o-linear-gradient(top, #8de3ea, #296f83);
    /* Opera 11.10-12.00 */
    background-image: linear-gradient(to bottom, #8de3ea, #296f83);
    /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr= #8de3ea , EndColorStr= #296f83 );
    /*For IE7-8-9*/
    zoom: 1;
    -webkit-box-shadow: 0px 1px 0px #000, inset 0px 1px 0px #bdeff3;
    box-shadow: 0px 1px 0px #000, inset 0px 1px 0px #bdeff3; }

/*3.4 List style
*/

.list-triangle li, .list-square li, .list-eclipse li, .list-stick li, .list-arrow li, .list-circle li, .list-dotted li {
    padding: 0 0 0 12px;
    background: url('images/list-icons.png') no-repeat; }

.list-triangle.light li { background-position: -64px -664px }

.list-square.light li { background-position: -384px -343px }

.list-eclipse.light li { background-position: -320px -407px }

.list-stick.light li {
    padding: 0 0 0 16px;
    background-position: -192px -538px; }

.list-arrow.light li { background-position: -128px -599px }

.list-circle.light li { background-position: -256px -472px }

.list-dotted.light li { background-position: -448px -282px }

.list-triangle li, .list-triangle.light li:hover { background-position: -96px -632px }

.list-square li, .list-square.light li:hover { background-position: -416px -311px }

.list-eclipse li, .list-eclipse.light li:hover { background-position: -352px -375px }

.list-stick li, .list-stick.light li:hover {
    padding: 0 0 0 16px;
    background-position: -224px -506px; }

.list-arrow li, .list-arrow.light li:hover { background-position: -160px -567px }

.list-circle li, .list-circle.light li:hover { background-position: -288px -440px }

.list-dotted li, .list-dotted.light li:hover { background-position: -480px -250px }

/*3.5 Alert box
*/

.alert-box {
    position: relative;
    display: inline-block;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    -ms-border-radius: 7px;
    border-radius: 7px;
    background-clip: padding-box;
    padding: 0.75em 4em 0.75em 3em;
    background: url('images/list-icons.png') no-repeat; }

	.alert-box p { margin: 0 }

.alert-box.success {
    color: #57b52b;
    background-color: #e3fbd9;
    border: 1px solid #c3f0ad;
    background-position: -496px -211px; }

.alert-box.warning {
    color: #eeb939;
    background-color: #fcf7d9;
    border: 1px solid #e6cc6f;
    background-position: -561px -147px; }

.alert-box.notice {
    color: #73c1c5;
    background-color: #e7fbfc;
    border: 1px solid #bcf0fb;
    background-position: -625px -83px; }

.alert-box.error {
    color: #e17572;
    background-color: #fdebeb;
    border: 1px solid #ffc3c3;
    background-position: -690px -19px; }

/*3.6 Dropcap and highlight
*/

.dropcap, .dropcap-square, .dropcap-circle {
    float: left;
    display: block;
    color: #66bed0;
    font: 600 3em/1em 'Open Sans', sans-serif;
    text-transform: capitalize;
    margin: 0 6px 0 0; }

.dropcap-square, .dropcap-circle {
    background: #364757;
    width: 1.4em;
    height: 1.4em;
    line-height: 1.4em;
    text-align: center;
    margin-top: 3px; }

.dropcap-circle {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    background-clip: padding-box; }

.small .dropcap { margin-top: 3px }

.smaller .dropcap { margin-top: 5px }

.tiny .dropcap { margin-top: -1px }

.small .dropcap-circle, .small .dropcap-square { margin-top: 7px }

.smaller .dropcap-circle, .smaller .dropcap-square { margin-top: 8px }

.tiny .dropcap-circle, .tiny .dropcap-square { margin-top: 2px }

.highlight { color: #66c7d0 }

.highlight1 {
    background: #66bed0;
    color: #ffffff; }

.highlight2 { border-bottom: 1px dotted #66bed0 }

/*3.7 Others style
*/

.readmore {
    display: block;
    margin: -0.5em 0 0 0;
    font: 600 14px/1.5em 'Open Sans', sans-serif;
    text-transform: uppercase;
    text-decoration: underline; }

.hide-text {
    font: 0/0 'Open Sans', sans-serif;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0; }

blockquote.highlight {
    padding: 0;
    margin: 0;
    border: none;
    width: auto;
    background: none;
    color: #afb8c0;
    font: italic 14px/1.5em 'Open Sans', sans-serif;
    text-shadow: 0px 1px 0px #000000;
    /* Chrome, Firefox 3.5+, IE 10+, Opera 9+, Safari 1+ */ }

	blockquote.highlight cite { font-size: 14px }

.texture { background: url('../../images/body-bg.png') }

/* 4. Header
================================================== */

.section-header {
    background-color: #192229;
    background-image: -webkit-gradient(radial, center top, 0, center top, 140, from(#597794), to(#212b35));
    /* old WebKit Syntax */
    background-image: -webkit-radial-gradient(center top, 25% 110%, #597794, #212b35);
    /* New WebKit syntax */
    background-image: -moz-radial-gradient(center top, 25% 110%, #597794, #212b35);
    background-image: -ms-radial-gradient(center top, 25% 110%, #597794, #212b35);
    /* IE10+ */
    background-image: -o-radial-gradient(center top, 25% 110%, #597794, #212b35);
    /* Opera (13?) */
    background-image: -moz-radial-gradient(center top, ellipse cover, #597794, #212b35);
    /*Fix for Firefox*/ }

.logo {
    display: block;
    width: 100%;
    height: 82px;
    background: url('../../images/logo.png') left center no-repeat; }

.sf-menu li {
    position: relative;
    display: inline-block;
    padding: 31px 16px;
    text-transform: uppercase;
    font: 700 13px/20px 'Open Sans', sans-serif; }

.sf-menu .current {
    background: #26383c;
    -webkit-box-shadow: inset 0 3px 0 #66bed0;
    box-shadow: inset 0 3px 0 #66bed0; }

.sf-menu ul {
    position: absolute;
    display: none;
    top: 100%;
    left: 0;
    z-index: 10000;
    background: #202d3e;
    padding: 0 5px 0.5em 8px;
    border-top: 1px solid #66bed0; }

	.sf-menu ul li {
	    padding: 10px 12px 10px 8px;
	    text-transform: none;
	    font: 600 13px/20px 'Open Sans', sans-serif;
	    border-top: 1px solid #3d4a5a; }

	.sf-menu ul li:hover { background: #293545 }

.sf-menu li:hover > ul, .sf-menu li.sfHover > ul { display: block }

.js #main-nav { position: relative }

#nav-toggle { display: none }

/* 5. Footer
================================================== */

.partner { text-align: center }

	.partner img {
	    opacity: 0.4;
	    filter: alpha(opacity=40);
	    /* IE8 and earlier */ }

.section-footer {
    background-color: #0e1318;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#0e1318), to(#161f27));
    /* Chrome, Safari 4+ */
    background-image: -webkit-linear-gradient(top, #0e1318, #161f27);
    /* Chrome 10-25, iOS 5+, Safari 5.1+ */
    background-image: -moz-linear-gradient(top, #0e1318, #161f27);
    /* Firefox 3.6-15 */
    background-image: -o-linear-gradient(top, #0e1318, #161f27);
    /* Opera 11.10-12.00 */
    background-image: linear-gradient(to bottom, #0e1318, #161f27);
    /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr= #0e1318 , EndColorStr= #161f27 );
    /*For IE7-8-9*/
    zoom: 1; }

/* 5.1 Footer modules
*/

.photo-flicker { margin: -4px }

	.photo-flicker .thumb {
	    float: left;
	    width: 68px;
	    height: 53px;
	    margin: 4px; }

.list-category li { font: 12px/2em 'Open Sans', sans-serif }

.form-email { position: relative }

	.form-email input[type='text'], .form-email input[type='email'] {
	    font: 13px/1.5em 'Open Sans', sans-serif;
	    height: 24px;
	    width: 100%;
	    border: none;
	    outline: 0;
	    padding: 0 5px;
	    color: #ffffff;
	    background: #364757; }

	.form-email input[type='submit'] {
	    width: 35px;
	    height: 24px;
	    position: absolute;
	    top: 0;
	    right: 0;
	    background-color: #66bed0;
	    background-position: -52px -314px; }

.list-tag li {
    display: inline-block;
    font: 10px/14px 'Open Sans', sans-serif;
    padding: 5px 8px;
    margin: 2px 0;
    background: #364757;
    -webkit-transition: background 0.5s ease-out;
    -moz-transition: background 0.5s ease-out;
    -o-transition: background 0.5s ease-out;
    transition: background 0.5s ease-out; }

	.list-tag li a { color: #afb8c0 }

.list-tag li:hover { background: #66bed0 }

	.list-tag li:hover a { color: #ffffff }

/* 5.2 Social icons
*/

.list-social li {
    display: block;
    float: left;
    margin: 0 8px 8px 0; }

.icon-social {
    width: 33px;
    height: 33px;
    -webkit-transition: background 0.3s ease-out;
    -moz-transition: background 0.3s ease-out;
    -o-transition: background 0.3s ease-out;
    transition: background 0.3s ease-out; }

.facebook { background-position: 0 0 }

.twitter { background-position: -64px 0 }

.dribbble { background-position: -128px 0 }

.behance { background-position: -192px 0 }

.wordpress { background-position: -256px 0 }

.facebook:hover { background-position: 0 -35px }

.twitter:hover { background-position: -64px -35px }

.dribbble:hover { background-position: -128px -35px }

.behance:hover { background-position: -192px -35px }

.wordpress:hover { background-position: -256px -35px }

.icon-social-nb {
    width: 24px;
    height: 24px; }

.facebook-nb { background-position: -320px 0 }

.twitter-nb { background-position: -320px -127px }

.skype-nb { background-position: -320px -256px }

.facebook-nb:hover { background-position: -320px -64px }

.twitter-nb:hover { background-position: -320px -191px }

.skype-nb:hover { background-position: -320px -320px }

/* 6. Copyright
================================================== */

.list-menu-bottom { margin-bottom: 0.5em }

	.list-menu-bottom li {
	    display: inline;
	    font: 12px/1.5em 'Open Sans', sans-serif;
	    margin-left: 2px; }

		.list-menu-bottom li a { padding-left: 2px }

	.list-menu-bottom li:before { content: " / " }

	.list-menu-bottom li:first-child { margin: 0 }

		.list-menu-bottom li:first-child a { padding: 0 }

	.list-menu-bottom li:first-child:before { content: "" }

	.list-menu-bottom li.current a { color: #66bed0 }

.text-copyright {
    font: italic 12px/21px 'Open Sans', sans-serif;
    color: #66bed0; }

/* 7. Section-cast
================================================== */

.section-cast { text-align: center }

	.section-cast hr.weaken {
	    height: 3px;
	    margin: 0;
	    background-size: 100% 3px; }

.cast {
    margin-top: 0.25em;
    margin-bottom: 0.25em;
    position: relative; }

	.cast h2 {
	    font: italic 24px/60px 'Open Sans', sans-serif;
	    padding: 0 60px; }

/* 8. Section-Content
================================================== */

/* 8.1 Homepage
*/

.featured-service {
    position: relative;
    text-align: center;
    margin-top: 0.5em;
    margin-bottom: 1em;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    background-clip: padding-box;
    height: 300px;
    -webkit-transition: box-shadow 0.25s ease-out;
    -moz-transition: box-shadow 0.25s ease-out;
    -o-transition: box-shadow 0.25s ease-out;
    transition: box-shadow 0.25s ease-out;
    box-shadow: 0 0 12px #2c3a47;
    -moz-box-shadow: 0 0 12px #2c3a47;
    -webkit-box-shadow: 0 0 12px #2c3a47;
    background: url('images/service-bg.png') no-repeat;
    background-size: 100%; }

	.featured-service .circle {
	    position: absolute;
	    top: 18px;
	    left: 18px;
	    right: 18px;
	    bottom: 18px;
	    z-index: 50;
	    padding: 0.5em 2em; }

	.featured-service h1 {
	    color: #2c3947;
	    font: 54px/140px 'Economica', sans-serif; }

	.featured-service p {
	    height: 4.5em;
	    overflow: hidden; }

.featured-service:hover {
    box-shadow: 0 0 18px #405467;
    -moz-box-shadow: 0 0 18px #405467;
    -webkit-box-shadow: 0 0 18px #405467; }

.tagline {
    position: relative;
    background-image: url('../../images/tagline-bg.png');
    border-left: 6px solid #66bed0;
    padding: 20px 150px 20px 15px; }

	.tagline h2 {
	    font: 21px/1.8em 'Open Sans', sans-serif;
	    color: #ffffff; }

	.tagline h3 { font: 15px/1.5em 'Open Sans', sans-serif }

	.tagline .button {
	    position: absolute;
	    right: 18px;
	    bottom: 10px; }

.news-feature {
    position: relative;
    border-bottom: 5px solid #66bed0; }

	.news-feature hr {
	    margin: 0 0 1em 0;
	    width: 80%; }

	.news-feature p {
	    font: 400 13px/1.5em 'Open Sans', sans-serif;
	    height: 10.6em;
	    overflow: hidden; }

	.news-feature .icon-zoom { left: 22.5% }

	.news-feature .icon-link { right: 77.5% }

	.news-feature .content {
	    position: absolute;
	    top: 0;
	    right: 0;
	    bottom: 0;
	    z-index: 50;
	    width: 300px;
	    padding: 0 0.5em 0 1em;
	    background-color: transparent;
	    /* The Fallback */
	    background-color: rgba(30, 40, 50, 0.5);
	    background-image: url('../../images/body-bg.png'); }

.icon-play {
    width: 78px;
    height: 85px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -42px;
    margin-left: -34px;
    background-position: -128px -256px; }

/* 8.2 Post info
*/

.post-info {
    display: block;
    font: italic 11px/15px 'Open Sans', sans-serif;
    line-height: 15px; }

.post-info.first-line { margin: 1em 0 0.75em 0 }

.post-info.second-line {
    line-height: 40px;
    height: 40px;
    width: 100%;
    margin-bottom: 1.5em;
    border-top: 1px solid #364757;
    border-bottom: 1px solid #364757; }

.post-view, .post-comment, .post-time, .post-tag {
    display: inline-block;
    margin-bottom: -3px;
    height: 15px; }

.post-view {
    padding-left: 28px;
    background: url('images/sprites.png') no-repeat;
    background-position: -250px -190px; }

.post-comment {
    padding-left: 28px;
    width: 28px;
    background: url('images/sprites.png') no-repeat;
    background-position: -250px -126px; }

.post-time {
    padding-left: 20px;
    background: url('images/sprites.png') no-repeat;
    background-position: -128px -382px; }

.post-tag {
    padding-left: 28px;
    background: url('images/sprites.png') no-repeat;
    background-position: -182px -382px; }

/* 8.3 Post comment
*/

.comment { margin-bottom: 2em }

	.comment img {
	    width: 60px;
	    height: 50px;
	    float: left;
	    margin-top: 4px; }

	.comment .content {
	    margin-left: 70px;
	    border-bottom: 1px solid #364757; }

.comment-author {
    font: italic 12px/1.5em 'Open Sans', sans-serif;
    text-transform: uppercase;
    margin-bottom: 0.5em; }

.comment-date {
    font: italic 12px/1.5em 'Open Sans', sans-serif;
    margin-bottom: 0; }

.comment-content { margin-bottom: 0.5em }

.level-two { margin-left: 70px }

.level-three { margin-left: 140px }

/* 9. Slideshow
================================================== */

.section-slideshow {
    background-color: #0f1419;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#0f1419), to(#141b22));
    /* Chrome, Safari 4+ */
    background-image: -webkit-linear-gradient(top, #0f1419, #141b22);
    /* Chrome 10-25, iOS 5+, Safari 5.1+ */
    background-image: -moz-linear-gradient(top, #0f1419, #141b22);
    /* Firefox 3.6-15 */
    background-image: -o-linear-gradient(top, #0f1419, #141b22);
    /* Opera 11.10-12.00 */
    background-image: linear-gradient(to bottom, #0f1419, #141b22);
    /* Chrome 26, Firefox 16+, IE 10+, Opera 12.10+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr= #0f1419 , EndColorStr= #141b22 );
    /*For IE7-8-9*/
    zoom: 1; }

.gradient-slideshow {
    background-image: -webkit-gradient(radial, 25% center, 0, 25% center, 300, from(#455f7a), to(#1a242e));
    /* old WebKit Syntax */
    background-image: -webkit-radial-gradient(25% center, 30% 60%, #455f7a, #1a242e);
    /* New WebKit syntax */
    background-image: -moz-radial-gradient(25% center, 30% 60%, #455f7a, #1a242e);
    background-image: -ms-radial-gradient(25% center, 30% 60%, #455f7a, #1a242e);
    /* IE10+ */
    background-image: -o-radial-gradient(25% center, 30% 60%, #455f7a, #1a242e);
    /* Opera (13?) */
    background-image: -moz-radial-gradient(25% center, ellipse closest-side, #455f7a, #1a242e);
    /*Fix for Firefox*/ }

.shadow {
    background: url('../../images/shadow.png') right bottom no-repeat;
    background-size: 100% 20px;
    padding-bottom: 20px; }

.slide h1 {
    background: #000;
    font: 40px/1em 'Economica', sans-serif;
    padding: 2px 5px; }

.slide h2 {
    font: 32px/1.5em 'Economica', sans-serif;
    color: #ffffff; }

.slide p { width: 460px }

/* 10. Thumbnail effect
================================================== */

.thumb {
    position: relative;
    overflow: hidden;
    text-align: center; }

	.thumb img { width: 100% }

	.thumb a { line-height: 0 }

.dark-mask {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 50;
    background: url('../../images/body-bg.png'); }

.icon-zoom, .icon-link {
    width: 55px;
    height: 54px;
    position: absolute;
    top: 50%;
    margin-top: -27px; }

.icon-zoom {
    left: 50%;
    margin-left: 50%;
    z-index: 100;
    background-position: -64px -256px; }

.icon-link {
    right: 50%;
    margin-right: 50%;
    z-index: 75;
    background-position: 0 -256px; }

.triangle-top {
    width: 20px;
    height: 15px;
    position: absolute;
    bottom: 0;
    left: 18px;
    z-index: 100;
    background-position: 0 -320px; }

.triangle-right {
    width: 25px;
    height: 30px;
    position: absolute;
    right: 300px;
    top: 24px;
    z-index: 100;
    background-position: -256px -256px; }

/* 11. Cotrol button
================================================== */

h3 .icon-control { float: right }

/* Big icons for section-cast*/

.icon-prev.big, .icon-next.big {
    position: absolute;
    top: 50%;
    width: 60px;
    height: 60px;
    margin-top: -30px;
    z-index: 200; }

.icon-prev.big {
    left: 0;
    background-position: 0 -128px; }

.icon-next.big {
    right: 0;
    background-position: -64px -128px; }

.icon-prev.big.inactive { background-position: 0 -192px }

.icon-next.big.inactive { background-position: -64px -192px }

/* Small icons*/

.icon-prev.small, .icon-next.small {
    display: inline-block;
    width: 24px;
    height: 24px; }

.icon-prev.small { background-position: -192px -123px }

.icon-next.small { background-position: -128px -187px }

.icon-prev.small.inactive { background-position: -128px -123px }

.icon-next.small.inactive { background-position: -192px -187px }

/* Long icons for single portfolio page*/

.icon-prev.long, .icon-next.long {
    display: inline-block;
    width: 36px;
    height: 24px; }

.icon-group {
    display: inline-block;
    width: 36px;
    height: 24px;
    background-position: -384px -251px; }

.icon-prev.long { background-position: -384px -123px }

.icon-next.long { background-position: -384px 5px }

.icon-prev.long:hover { background-position: -384px -187px }

.icon-next.long:hover { background-position: -384px -59px }

.icon-group:hover { background-position: -384px -315px }

/* Control icons for thumbnail gallery*/

.thumb-gallery { position: relative }

	.thumb-gallery .NextPrev {
	    overflow: hidden;
	    text-align: center; }

	.thumb-gallery .icon-prev, .thumb-gallery .icon-next {
	    display: none;
	    position: absolute;
	    top: 50%;
	    width: 60px;
	    height: 44px;
	    margin-top: -22px; }

	.thumb-gallery .icon-prev {
	    left: 0;
	    background-position: -64px -384px; }

	.thumb-gallery .icon-next {
	    right: 0;
	    background-position: 0 -384px; }

	.thumb-gallery .icon-prev.inactive { background-position: -384px -384px }

	.thumb-gallery .icon-next.inactive { background-position: -320px -384px }

/*
 * NextPrev
 */

.NextPrev-box {
    overflow: hidden;
    position: relative; }

.NextPrev-content {
    width: 10000px;
    clear: both; }

.NextPrev { float: left }

.patch {
    display: block;
    top: 0;
    width: 10px;
    height: 100%;
    z-index: 150;
    position: absolute;
    background-color: #1f2933;
    background-image: url('../../images/body-bg.png'); }

.patch-left { left: 0 }

.patch-right { right: 0 }

/* 12. Tab plugin
================================================== */

.tab-control li {
    display: block;
    float: left;
    z-index: 50; }

	.tab-control li a {
	    display: inline-block;
	    color: #afb8c0;
	    font: 700 12px/1.5em 'Open Sans', sans-serif;
	    margin: 0 -1px -1px 0;
	    padding: 10px 24px;
	    min-width: 120px;
	    text-align: center;
	    background: #1d2730;
	    border: 1px solid #2c3b48; }

	.tab-control li .current {
	    color: #66bed0;
	    background: #07111a;
	    border-bottom: 1px solid #07111a; }

.tab-content {
    padding: 15px;
    background: #07111a;
    border: 1px solid #2c3b48;
    border-bottom: 3px solid #66bed0; }

.list-tab li { border-bottom: 1px solid #364757 }

	.list-tab li * { padding: 0 0 0 25px }

	.list-tab li .control {
	    background: url('images/list-icons.png') no-repeat;
	    color: #7b8d9e;
	    font: bold 11px/28px 'Open Sans', sans-serif;
	    background-position: 0 -733px; }

	.list-tab li .current {
	    color: #ffffff;
	    font: bold 14px/28px 'Open Sans', sans-serif;
	    background-position: -32px -701px; }

.control {
    -webkit-transition: color 0.5s ease-out, font 0.5s ease-out;
    -moz-transition: color 0.5s ease-out, font 0.5s ease-out;
    -o-transition: color 0.5s ease-out, font 0.5s ease-out;
    transition: color 0.5s ease-out, font 0.5s ease-out; }

/* 13. Portlofio
================================================== */

#MixItUp .mix {
    display: none;
    opacity: 0;
    float: left; }

.list-portlofio li {
    cursor: pointer;
    display: inline-block;
    margin-right: 0.5em;
    font: 11px/1.5em 'Open Sans', sans-serif;
    padding: 6px 12px;
    background: #141b21; }

.list-portlofio .active {
    color: #ffffff;
    background: #66bed0; }

.icon-portlofio {
    width: 36px;
    height: 36px;
    margin: 15px auto;
    background-position: -256px -320px; }

.caption {
    padding: 2em;
    color: #ffffff;
    font: 13px/1.5em 'Open Sans', sans-serif;
    text-overflow: ellipsis; }

	.caption h4 {
	    color: #ffffff;
	    font: 700 16px/1.5em 'Open Sans', sans-serif;
	    margin-bottom: 0.5em; }

.four .icon-portlofio { margin: 12px auto }

.four .caption {
    padding: 1em;
    font: 12px/1.5em 'Open Sans', sans-serif; }

	.four .caption h4 { font: 600 13px/1.5em 'Open Sans', sans-serif }

.three .icon-portlofio { margin: 0 auto 8px auto }

.three .caption {
    padding: 1em;
    font: 11px/1.5em 'Open Sans', sans-serif; }

	.three .caption h4 { font: 600 12px/1.5em 'Open Sans', sans-serif }

/* 14. Right sidebar
================================================== */

.module-right { padding: 1em 0 2em 0 }

	.module-right h3 {
	    color: #ffffff;
	    font: 700 12px/1.5em 'Open Sans', sans-serif; }

.recent-popular .tab-control li { width: 50% }

.recent-popular .control {
    width: 100%;
    min-width: 0;
    background: none; }

.recent-popular .tab-control li .current {
    background: none;
    border-bottom: 1px solid #1d2730; }

.recent-popular .tab-content { background: none }

.news-small img { margin: 6px 10px 5px 0 }

.news-blog { margin: 1em 0 4em 0 }

/* 15. Other styles
================================================== */

/*15.1 Tooltip*/

.ui-tooltip, .arrow:after {
    background: #364757;
    border: 1px solid #324251; }

.ui-tooltip {
    position: absolute;
    z-index: 200;
    padding: 8px 12px;
    min-width: 150px;
    max-width: 300px;
    color: #ffffff;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
    -ms-border-radius: 7px;
    border-radius: 7px;
    background-clip: padding-box;
    font: 13px/1.5em 'Open Sans', sans-serif;
    box-shadow: 0 0 7px #192028; }

.arrow {
    width: 70px;
    height: 16px;
    overflow: hidden;
    position: absolute;
    left: 25%;
    margin-left: -35px;
    bottom: -16px; }

.arrow.top {
    top: -16px;
    bottom: auto; }

.arrow.left { left: 25% }

.arrow:after {
    content: "";
    position: absolute;
    left: 20px;
    top: -20px;
    width: 25px;
    height: 25px;
    box-shadow: 0 0 7px #192028;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    tranform: rotate(45deg); }

.arrow.top:after {
    bottom: -20px;
    top: auto; }

/*15.2 Contact form and Navigation*/

.form-contact textarea, .form-contact input[type="text"] {
    outline: none;
    padding: 0.5em;
    background: #07111a;
    margin-bottom: 1.5em;
    color: #afb8c0;
    border: 1px solid #364757;
    font: 13px/1.5em 'Open Sans', sans-serif; }

.form-contact input[type="submit"] {
    padding: 12px 36px;
    cursor: pointer; }

.contact-error {
    display: none;
    color: #c63632;
    padding-left: 20px;
    background: url('images/list-icons.png') no-repeat;
    background-position: -704px -30px; }

.contact-success {
    display: none;
    color: #4c9d26;
    padding-left: 20px;
    background: url('images/list-icons.png') no-repeat;
    background-position: -512px -222px; }

.navigation {
    font: 12px/1.5em 'Open Sans', sans-serif;
    text-align: right; }

	.navigation .number {
	    font: 11px/1.5em 'Open Sans', sans-serif;
	    padding: 3px 8px;
	    color: #ffffff;
	    background: #364757;
	    -webkit-transition: background 0.3s ease-out;
	    -moz-transition: background 0.3s ease-out;
	    -o-transition: background 0.3s ease-out;
	    transition: background 0.3s ease-out; }

	.navigation .number:hover, .navigation .number.current { background: #66bed0 }

/*15.3 Back to top - Only show on touch device*/

.back-to-top {
    display: none;
    z-index: 200;
    position: fixed;
    right: -40px;
    bottom: 25px;
    width: 40px;
    height: 40px;
    cursor: pointer;
    background: url('images/list-icons.png') no-repeat; }

.back-to-top:hover { background-position: -64px 0 }

/*15.4 Width in percent for skill bar and others*/

.width10 { width: 10% }
.width15 { width: 15% }
.width20 { width: 20% }
.width25 { width: 25% }
.width30 { width: 30% }
.width35 { width: 35% }
.width40 { width: 40% }
.width45 { width: 45% }
.width50 { width: 50% }
.width60 { width: 60% }
.width65 { width: 65% }
.width70 { width: 70% }
.width75 { width: 75% }
.width80 { width: 80% }
.width85 { width: 85% }
.width90 { width: 90% }
.width95 { width: 95% }
.width100 { width: 100% }

.block { display: block }
.inline-block { display: inline-block }

/*15.5 Other*/

.percent {
    display: block;
    width: 100%;
    margin-bottom: 1em;
    color: #364757;
    background: #364757;
    font: 11px/1.5em 'Open Sans', sans-serif; }

	.percent span {
	    display: block;
	    padding: 1em;
	    background: #96a8b9; }

.profile {
    background: #07111a;
    border-bottom: 2px solid #66bed0; }

	.profile .detail { padding: 0.5em 1.5em 1em 0.5em }

	.profile .name { font: bold 12px/1.75em 'Open Sans', sans-serif }

	.profile .position { font: italic 11px/2.25em 'Open Sans', sans-serif }

/*Button width in portfolio single page*/

.two .button { width: 120px }

#cboxLoadingGraphic { background: url('images/cb.loading.gif') no-repeat center center }

/* 16. Retina ready
================================================== */

@media screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { 
	.sprite, .post-view, .post-comment, .post-time, .post-tag, #nav-toggle {
	    background: url('images/sprites-retina.png') no-repeat;
	    background-size: 448px 448px; }

	.alert-box, .list-triangle, .list-square, .list-eclipse, .list-stick, .list-arrow, .list-circle, .list-dotted, .back-to-top, .list-tab li .control {
	    background: url('images/list-icons-retina.png') no-repeat;
	    background-size: 768px 768px; }

	.logo {
	    background: url('../../images/logo-retina.png') left center no-repeat;
	    background-size: 208px 53px; }

	#cboxLoadingGraphic {
	    background: url('images/cb.loading-retina.gif') no-repeat center center;
	    background-size: 40px 40px; }
}

/* 17. Responsive design
================================================== */

/* Smaller than standard 960 (devices and browsers) */

@media only screen and (max-width: 959px) { 
	.tab-control li a {
	    font-size: 11px;
	    padding: 10px 15px; }

	.back-to-top { right: 25px }
}

/* Tablet Portrait size to standard 960 (devices and browsers) */

@media only screen and (min-width: 768px) and (max-width: 959px) { 
	.featured-service { height: 236px }

		.featured-service h1 { font: 50px/100px 'Economica', sans-serif }

		.featured-service p { font-size: 13px }

	.news-feature p { height: 7.2em }

	.news-feature .icon-zoom { left: 14.5% }

	.news-feature .icon-link { right: 85.5% }

	.sf-menu li {
	    padding: 31px 10px;
	    font: 700 12px/20px 'Open Sans', sans-serif; }

	/*Portfolio fixes*/

	.icon-portlofio { margin: 12px auto }

	.caption {
	    padding: 1em;
	    font: 12px/1.5em 'Open Sans', sans-serif; }

		.caption h4 { font: 600 13px/1.5em 'Open Sans', sans-serif }

	.four .icon-portlofio, .three .icon-portlofio { margin: 0 auto }

	.four .caption { font: 11px/1.5em 'Open Sans', sans-serif }

		.four .caption h4 { font: 600 12px/1.5em 'Open Sans', sans-serif }
}

/* All Mobile Sizes (devices and browser) */

@media only screen and (max-width: 767px) { 
	.cast h2 { font: italic 18px/48px 'Open Sans', sans-serif }

	blockquote {
	    width: auto;
	    padding: 1em 1em 1em 2em;
	    margin: 0 0 1em 2em; }

	.tagline { padding: 20px 15px 10px 15px }

		.tagline h2 {
		    font: 18px/1.5em 'Open Sans', sans-serif;
		    margin-bottom: 0.5em; }

		.tagline h3 {
		    font: 13px/1.5em 'Open Sans', sans-serif;
		    margin-bottom: 0.5em; }

		.tagline .button {
		    position: static;
		    float: right; }

	.tab-control li { width: 50% }

		.tab-control li a {
		    width: 100%;
		    text-align: center; }

	.patch { display: none }

	.list-portlofio li { margin-bottom: 1em }

	.module-footer { margin-bottom: 2em }

	.form-email input[type='text'], .form-email input[type='email'] { width: 80% }

	.form-email input[type='submit'] { right: 20% }

	.section-copyright { text-align: center }

		.section-copyright .align-left, .section-copyright .align-right { float: none }

	/*Responsive nav*/

	.js #main-nav {
	    clip: rect(0 0 0 0);
	    max-height: 0;
	    position: absolute;
	    display: block;
	    overflow: hidden;
	    zoom: 1; }

	#nav-toggle {
	    display: block;
	    float: right;
	    width: 50px;
	    height: 40px;
	    font: 0/0 'Open Sans', sans-serif;
	    margin-bottom: 10px;
	    margin-top: -60px;
	    background: url('images/sprites.png') no-repeat;
	    background-position: -234px -376px; }

	#main-nav.opened { margin-bottom: 65px }

	#main-nav.closed { float: left }

	.sf-menu li {
	    width: 100%;
	    padding: 8px 0;
	    border-bottom: 1px solid #26383c; }

		.sf-menu li a { padding-left: 20px }

	.sf-menu li.current {
	    background: none;
	    box-shadow: none;
	    -webkit-box-shadow: none; }

	.sf-menu li:first-child { border-top: 1px solid #26323c }

	.sf-menu ul {
	    position: static;
	    display: block!important;
	    border: none;
	    width: 100%!important;
	    padding: 0;
	    background: none;
	    padding-top: 8px;
	    margin-bottom: -9px; }

		.sf-menu ul li {
		    background: none;
		    border-top: none;
		    padding: 8px 0 8px 10px; }
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */

@media only screen and (min-width: 480px) and (max-width: 767px) { 
	.news-feature p { height: 7.2em }

	.news-feature .title.feature { font-size: 22px }

	.news-feature .icon-zoom { left: 14.5% }

	.news-feature .icon-link { right: 85.5% }

	.featured-service {
	    width: 300px!important;
	    margin-left: 60px; }

	.profile {
	    width: 205px!important;
	    margin: 0 10px 1.5em 0; }

	/*Portfolio fixes*/

	.four .icon-portlofio, .three .icon-portlofio { margin: 12px auto }

	.four .caption, .three .caption {
	    padding: 2em;
	    font: 13px/1.5em 'Open Sans', sans-serif; }

		.four .caption h4, .three .caption h4 { font: 600 16px/1.5em 'Open Sans', sans-serif }
}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */

@media only screen and (max-width: 479px) { 
	.news-feature .content { display: none }

	.news-feature .icon-zoom { left: 50% }

	.news-feature .icon-link { right: 50% }

	.cast h2 { padding: 0 }

	.cast .icon-prev.big, .cast .icon-next.big { display: none }

	.level-three { margin-left: 70px }

	.comment img { margin: 4px 10px 5px 0 }

	.comment .content { margin-left: 0px }

	/*Portfolio fixes*/

	.six .icon-portlofio, .four .icon-portlofio, .three .icon-portlofio { margin: 10px auto }

	.six .caption, .four .caption, .three .caption {
	    padding: 1em;
	    font: 12px/1.5em 'Open Sans', sans-serif; }

		.six .caption h4, .four .caption h4, .three .caption h4 { font: 600 13px/1.5em 'Open Sans', sans-serif }
}

/* 18. Fixes for IE 8,9
================================================== */

/*IE9: Gradient bleeds out border-radius*/
.ie9 .button-dark {
  filter: none;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc2MCIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj4KPHN0b3Agc3RvcC1jb2xvcj0iIzMzNDU1NSIgb2Zmc2V0PSIwIi8+PHN0b3Agc3RvcC1jb2xvcj0iIzBCMTExNyIgb2Zmc2V0PSIxIi8+CjwvbGluZWFyR3JhZGllbnQ+CjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzYwKSIgLz4KPC9zdmc+);
}
	.ie9 .button-dark:hover {
	  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc5NzciIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiMzMTQyNTIiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiMwODBDMTAiIG9mZnNldD0iMSIvPgo8L2xpbmVhckdyYWRpZW50Pgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2c5NzcpIiAvPgo8L3N2Zz4=);
	}
	
.ie9 .button-light {
  filter: none;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc5NTQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiNBMkU4RUUiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiMzMjhBQTIiIG9mZnNldD0iMSIvPgo8L2xpbmVhckdyYWRpZW50Pgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2c5NTQpIiAvPgo8L3N2Zz4=);
}
	.ie9 .button-light:hover {
	  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9ImczMiIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj4KPHN0b3Agc3RvcC1jb2xvcj0iIzhERTNFQSIgb2Zmc2V0PSIwIi8+PHN0b3Agc3RvcC1jb2xvcj0iIzI5NkY4MyIgb2Zmc2V0PSIxIi8+CjwvbGluZWFyR3JhZGllbnQ+CjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzMyKSIgLz4KPC9zdmc+);
	}

/*IE9: Radial gradient*/
.ie9 .section-header {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8cmFkaWFsR3JhZGllbnQgaWQ9Imc2MjUiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiBjeD0iNTAlIiBjeT0iMCUiIHI9IjUwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiM1OTc3OTQiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiMyMTJCMzUiIG9mZnNldD0iMSIvPgo8L3JhZGlhbEdyYWRpZW50Pgo8cmVjdCB4PSItNTAiIHk9Ii01MCIgd2lkdGg9IjEwMSIgaGVpZ2h0PSIxMDEiIGZpbGw9InVybCgjZzYyNSkiIC8+Cjwvc3ZnPg==);
}

.ie9 .gradient-slideshow {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8cmFkaWFsR3JhZGllbnQgaWQ9ImczMjAiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiBjeD0iMCUiIGN5PSI1MCUiIHI9Ijc1JSI+CjxzdG9wIHN0b3AtY29sb3I9IiM0NTVGN0EiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiMxQTI0MkUiIG9mZnNldD0iMSIvPgo8L3JhZGlhbEdyYWRpZW50Pgo8cmVjdCB4PSItNTAiIHk9Ii01MCIgd2lkdGg9IjEwMSIgaGVpZ2h0PSIxMDEiIGZpbGw9InVybCgjZzMyMCkiIC8+Cjwvc3ZnPg==);
}

/*IE8: Box shadows*/
.ie8 .sf-menu .current {
  padding-top: 28px;
  border-top: 3px solid #66bed0;}

.ie8 .arrow { display: none;}
.ie8 .shadow { background: none;}
.ie8 .shadowfix { height: 20px;}
.ie8 .sf-menu { display: block;}
.ie8 .button { padding: 12px 20px;}
.ie8 .button.small { padding: 10px 20px;}
.ie8 .button.medium { padding: 12px 20px;}
.ie8 .button.big { padding: 10px 52px;}