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

	Theme Name: Quintet
	Theme URI: http://themes.semicolonweb.com/html/quintet
	Description: Responsive One Page Template
	Author: SemiColonWeb
	Author URI: http://themeforest.net/user/semicolonweb
	Version: 1.1

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

/* ----------------------------------------------------------------
    Document Reset
-----------------------------------------------------------------*/

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/



html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  	margin: 0;
  	padding: 0;
  	border: 0;
  	font-size: 100%;
  	font: inherit;
  	vertical-align: baseline;

}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
  	line-height: 1;
}
ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  	content: '';
  	content: none;
}
table {
  	border-collapse: collapse;
  	border-spacing: 0;
}

:focus { outline: 0;}

[hidden] {
    display: none;
}

html {
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    height: 0;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

textarea {
    overflow: auto;
    vertical-align: top;
}

input[type="text"],
input[type="password"],
textarea {
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

input[type="submit"],
input[type="reset"] { -webkit-appearance: none; }

.input-block-level {
    display: block;
    width: 100% !important;
    min-height: 30px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}


/* ----------------------------------------------------------------
    Basic Document Styles
-----------------------------------------------------------------*/


body {
  	color: #FFF;
  	font: 13px/20px 'Roboto', Helvetica, Arial, sans-serif;
  	background: #FFF url("images/patterns/light/pattern7.png") repeat fixed;
}

input,
select,
textarea { font: 12px/20px 'Roboto', Helvetica, Arial, sans-serif; }

.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix { display: inline-block; *zoom:1;}
* html .clearfix { height: 1%;} /* Hides from IE-mac \*/
.clearfix { display: block;}

.clear {
  	clear: both;
  	display: block;
  	font-size: 0px;
  	height: 0px;
  	line-height: 0;
  	width: 100%;
  	overflow:hidden;
}

::selection {
    background: #c81414;
    color: #fff;
}

::-moz-selection {
    background: #c81414; /* Firefox */
    color: #fff;
}

::-webkit-selection {
  	background: #c81414; /* Safari */
  	color: #fff;
}



/* ----------------------------------------------------------------
    Typography
-----------------------------------------------------------------*/


a {
  	text-decoration: none;
  	color: #FFF;
}

a:hover, .selected { color: #FFF; font-weight:bold; }



a img { border: none; }

p,
pre,
ul,
ol,
dl,
dd,
blockquote,
address,
table,
fieldset,
form { margin-bottom: 20px; }

h1,
h2,
h3,
h4,
h5,
h6 {
  	padding: 0 0 25px 0;
  	color: # FFF;
    font-family: 'Roboto', sans-serif;
}

h1 span,
h2 span,
h3 span,
h4 span,
h5 span,
h6 span { color: # FFF; }

h4,
h5,
h6 { padding-bottom: 20px; }

h1 {
  	font-size: 32px;
  	line-height: 36px;
}

h2 {
  	font-size: 28px;
  	line-height: 32px;
	margin-top:100px;
}

h3 {
  	font-size: 24px;
  	line-height: 28px;
}

h4 {
  	font-size: 20px;
  	line-height: 24px;
}

h5 {
  	font-size: 16px;
  	line-height: 20px;
}

h6 {
  	font-size: 12px;
  	line-height: 16px;
}

address { font-style: italic; }

abbr[title],
acronym[title],
dfn[title] {
  	cursor: help;
  	border-bottom: 1px dotted #555;
}

blockquote {
  	color: # FFF;
  	border-left: 3px solid #777;
    font-size: 17px;
    line-height: 1.4;
    font-family: 'Roboto', Georgia, 'Times New Roman', Times, serif;
    font-style: italic;
    padding: 5px 0 5px 20px;
    text-shadow: 1px 1px 1px #FFF;
    margin-left: 20px;
}

blockquote p { margin: 20px 0 0 0 !important; }

blockquote p:first-child { margin: 0 !important; }

strong { font-weight: 200; }

em,
dfn,
cite { font-style: italic; }

dfn { font-weight: 200; }

sup {
  	font-size: 11px;
  	vertical-align: top;
}

sub {
  	font-size: 11px;
  	vertical-align: bottom;
}

small {
    font-size: 11px;
    font-style: italic;
}

del { text-decoration: line-through; }

ins { text-decoration: underline; }

pre {
  	font: 12px/18px Consolas, "Andale Mono", Courier, "Courier New", monospace;
  	white-space: pre;
  	overflow: auto;
  	padding: 0 10px;
  	clear: both;
  	color: # FFF;
  	line-height: 19px;
}

code {
  	padding: 5px;
  	background: #F9F9F9;
}

var,
kbd,
samp,
code {
  	font: 12px/18px Consolas, "Andale Mono", Courier, "Courier New", monospace;
  	background: #F9F9F9;
}

kbd { font-weight: 200; }

samp,
var { font-style: italic; }

ul,
ol,
dl { margin-left: 20px; }

caption { text-align: left; }

img { max-width: 100%; }

.img-polaroid {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}


/* ----------------------------------------------------------------
    Basic Layout Styles
-----------------------------------------------------------------*/


.tright { text-align: right !important; }
.tleft { text-align: left !important; }
.fright { float: right !important; }
.fleft { float: left !important; }

#wrapper { width: 100%; height:200%; margin: 0 auto; position: relative; }


.container { width: 540px; margin-left:200px; position: relative; }
.containerteam { width: 440px; margin-left:200px; position: relative; }


.logobig{
	position:absolute; left:50%; top:250px;  height:264px; width:400px; margin:0px 0 0 -200px;
	}
.idiomas{
	top:47px; right:136px; position:fixed; z-index: 99;
	}
.menucuadros{
	top:95px; right:60px; position:fixed; z-index: 99;
	}
.span2b{font-size:24px; line-height:30px;}

.logo5{color:#FFF; position:fixed; z-index: 99; top:40px; left:100px; display:none;}
	
.line,
.double-line { clear: both; position: relative; width: 100%; margin: 40px 0; border-top: 1px solid #EEE;}
.double-line { border-top: 3px double #E5E5E5; }
.line a { position: absolute; left: auto; right: 0; padding-left: 5px; color: #272727; background: #F9F9F9; margin-top: -11px; border: none; }
.line a:hover { color: #575757; background: none; }
.emptydiv { display: block !important; position: relative !important;}
.allmargin { margin: 60px !important;}
.leftmargin { margin-left: 60px !important;}
.rightmargin { margin-right: 60px !important;}
.topmargin { margin-top: 60px !important;}
.bottommargin { margin-bottom: 60px !important;}
.nomargin {margin: 0 !important;}
.noleftmargin { margin-left: 0 !important;}
.norightmargin { margin-right: 0 !important;}
.notopmargin { margin-top: 0 !important;}
.nobottommargin { margin-bottom: 0 !important;}
.noborder { border: none !important; }
.noleftborder { border-left: none !important; }
.norightborder { border-right: none !important; }
.notopborder { border-top: none !important; }
.nobottomborder { border-bottom: none !important; }
.nopadding { padding: 0 !important; }
.noleftpadding { padding-left: 0 !important; }
.norightpadding { padding-right: 0 !important; }
.notoppadding { padding-top: 0 !important; }
.nobottompadding { padding-bottom: 0 !important; }
.noabsolute { position: relative !important;}
.hidden { display: none !important;}
.nothidden { display: block !important;}
.center { text-align: center !important;}
.divcenter { position: relative !important; margin-left: auto !important; margin-right: auto !important;}


a.swap { 
background-image: url(images/boton1.png);
background-position: center center !important;
background-repeat: no-repeat;
}

a.swap:hover { 
background-image: url(images/boton2.png);
background-position: center center !important;
background-repeat: no-repeat; 
}

a.swap1 { 
background-image: url(images/boton2.png);
background-position: center center !important;
background-repeat: no-repeat;
}


a.openicon { 
background-image: url(images/open.png); 
background-position:center center;
background-repeat:no-repeat;
}

a.closeicon { 
background-image: url(images/close.png);
background-position:center center;
background-repeat:no-repeat; 
}


span.page-divider { display: block; }

span.page-divider span {
    display: block;
    width: 15%;
    border-bottom: 2px solid #c81414;
}



.preloader,
.preloader2 {
  	display: block;
  	width: 100%;
  	height: 100%;
  	background: url("images/preloader.gif") center center no-repeat #FFF;
}

.preloader2 { background-color: transparent; }


.postcontent { width: 825px; }
.sidebar { width: 255px; }
.col_full { width: 100%; }
.col_half { width: 48%; }
.col_one_third { width: 30.63%; }
.col_two_third { width: 65.33%; }
.col_one_fourth { width: 22%; }
.col_three_fourth { width: 74%; }
.col_one_fifth { width: 16.8%; }
.col_two_fifth { width: 37.6%; }
.col_three_fifth { width: 58.4%; }
.col_four_fifth { width: 79.2%; }
.col_one_sixth { width: 13.33%; }
.col_five_sixth { width: 82.67%; }

.postcontent,
.sidebar,
.col_full,
.col_half,
.col_one_third,
.col_two_third,
.col_three_fourth,
.col_one_fourth,
.col_one_fifth,
.col_two_fifth,
.col_three_fifth,
.col_four_fifth,
.col_one_sixth,
.col_five_sixth {
  	display: block;
  	position: relative;
  	margin-right: 4%;
  	margin-bottom: 50px;
  	float: left;
}

.postcontent,
.sidebar { margin-right: 60px; }

.col_full {
    clear: both;
  	float: none;
  	margin-right: 0;
}

.postcontent.col_last,
.sidebar.col_last { float: right; }

.col_last {
  	margin-right: 0 !important;
  	clear: right;
}

.entry_content ul {
    clear: left;
    color: #444;
    list-style-type: disc;
    font-size: 13px;
    font-family: 'Roboto', serif;
}

.entry_content ol {
    clear: left;
    color: #444;
    list-style-type: decimal;
    font-size: 13px;
    font-family: 'Roboto', serif;
}

label {
    display: inline-block;
    font-size: 13px;
    font-family: 'Roboto', Helvetica, Arial, sans-serif;
  	font-weight: 200;
  	color: #444;
  	margin-bottom: 5px;
    cursor: pointer;
}

label.label-muted {
    color: #777;
    font-weight: normal;
    font-size: 12px;
    margin-right: 5px;
}

input[type="text"],
input[type="password"],
select,
textarea {
    display: block;
  	background: #FFF;
  	padding: 6px;
    margin: 0 0 15px;
  	border: 1px solid #E2E2E2;
  	outline: 0;
  	font: normal 11px/100%;
    color: # FFF;
}

select {
    padding: 7px;
    min-height: inherit !important;
}

#footer.footer-dark input[type="text"],
#footer.footer-dark input[type="password"],
#footer.footer-dark select,
#footer.footer-dark textarea {
  	background: #282A2B;
  	border-color: #444;
    color: #CCC;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
}

input[type="text"],
input[type="password"] { width: 45%; }

input[type="checkbox"],
input[type="radio"] {
    display: inline-block;
    position: relative;
    top: 2px;
}

textarea { 
  	width: 90%;
  	height: 150px;
  	line-height: 150%;
}

textarea.short-textarea { height: 80px; }

input[type="text"]:active,
input[type="password"]:active,
textarea:active,
select:active,
input[type="text"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus { border-color: #CCC; }

#footer.footer-dark input[type="text"]:active,
#footer.footer-dark input[type="password"]:active,
#footer.footer-dark textarea:active,
#footer.footer-dark select:active,
#footer.footer-dark input[type="text"]:focus,
#footer.footer-dark input[type="password"]:focus,
#footer.footer-dark textarea:focus,
#footer.footer-dark select:focus { border-color: #666; }

label.error {
    display: block;
    font-style: italic;
    font-weight: normal;
    font-size: 11px;
    color: #BD091B;
    margin-bottom: 15px;
}

input.error,
textarea.error,
select.error { border-color: #BD091B !important; }

#footer.footer-dark input.error,
#footer.footer-dark textarea.error,
#footer.footer-dark select.error { border-color: #CF4545 !important; }

.quick-contact-form label.error { margin: 0; }

form p {
    margin-top: 15px;
    margin-bottom: 0;
}

form p:first-child { margin-top: 0; }

form small {
    font-weight: normal;
    font-size: 10px;
    font-style: normal;
    color: # FFF;
}


table {
    max-width: 100%;
    background-color: transparent;
    border-collapse: collapse;
    border-spacing: 0;
}
.table {
    width: 100%;
    margin-bottom: 20px;
}
.table th,
.table td {
    padding: 8px;
    line-height: 20px;
    text-align: left;
    vertical-align: top;
    border-top: 1px solid #EEE;
}
.table th {
    font-weight: 200;
    font-family: 'Roboto', sans-serif;
    color: #333;
}
.table thead th {
    vertical-align: bottom;
}
.table caption + thead tr:first-child th,
.table caption + thead tr:first-child td,
.table colgroup + thead tr:first-child th,
.table colgroup + thead tr:first-child td,
.table thead:first-child tr:first-child th,
.table thead:first-child tr:first-child td {
    border-top: 0;
}
.table tbody + tbody {
    border-top: 2px solid #EEE;
}
.table .table {
    background-color: #ffffff;
}
.table-condensed th,
.table-condensed td {
    padding: 4px 5px;
}
.table-bordered {
    border: 1px solid #EEE;
    border-collapse: separate;
    *border-collapse: collapse;
    border-left: 0;
}
.table-bordered th,
.table-bordered td {
    border-left: 1px solid #EEE;
}
.table-bordered caption + thead tr:first-child th,
.table-bordered caption + tbody tr:first-child th,
.table-bordered caption + tbody tr:first-child td,
.table-bordered colgroup + thead tr:first-child th,
.table-bordered colgroup + tbody tr:first-child th,
.table-bordered colgroup + tbody tr:first-child td,
.table-bordered thead:first-child tr:first-child th,
.table-bordered tbody:first-child tr:first-child th,
.table-bordered tbody:first-child tr:first-child td {
    border-top: 0;
}
.table-striped tbody > tr:nth-child(odd) > td,
.table-striped tbody > tr:nth-child(odd) > th {
    background-color: #f9f9f9;
}
.table-hover tbody tr:hover > td,
.table-hover tbody tr:hover > th {
    background-color: #f5f5f5;
}
.table tbody tr.success > td {
    background-color: #dff0d8;
}
.table tbody tr.error > td {
    background-color: #f2dede;
}
.table tbody tr.warning > td {
    background-color: #fcf8e3;
}
.table tbody tr.info > td {
    background-color: #d9edf7;
}
.table-hover tbody tr.success:hover > td {
    background-color: #d0e9c6;
}
.table-hover tbody tr.error:hover > td {
    background-color: #ebcccc;
}
.table-hover tbody tr.warning:hover > td {
    background-color: #faf2cc;
}
.table-hover tbody tr.info:hover > td {
    background-color: #c4e3f3;
}

span.divider {
    display: block;
    text-align: center;
}


span.divider span {
    display: inline-block;
    width: 10%;
    border-bottom: 1px solid #DDD;
}


/* ----------------------------------------------------------------
    Header
-----------------------------------------------------------------*/


#side-menu {
    display: block;
    position: fixed;
    width: 260px;
    background-color: #231f20;
    height: 100%;
    z-index: 99;
    top: 0;
    right: -260px;
    box-shadow: 0 0 20px rgba(0,0,0,0.3);
    transition: right 0.2s ease-in-out;
    -ms-transition: right 0.2s ease-in-out;
    -o-transition: right 0.2s ease-in-out;
    -moz-transition: right 0.2s ease-in-out;
    -webkit-transition: right 0.2s ease-in-out;
    -webkit-perspective: 1000;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translate(0px,0px);
}

#side-menu.open-menu { right: 0; }


#logo {
    position: relative;
    margin: 100px auto 40px;
    text-align: center;
}

#logo a { display: inline-block; }

#logo img { display: block; }


#logo .retina-logo { display: none; }


span.menu-divider span {
    display: inline-block;
    width: 10%;
    border-bottom: 1px solid #DDD;
}

#menu-toggle {
    position: absolute;
    width: 43px;
    height: 43px;
    font-size: 27px;
    color: #FFF;
    line-height: 32px;
    text-align: center;
    z-index: 999;
    top: 40px;
    left: -92px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}


#side-menu.open-menu #menu-toggle {
    right: 60px;
    left: auto;
}


nav#primary-menu {
    position: relative;
    margin: 90px 0;
}


nav#primary-menu ul {
    position: relative;
    margin: 0;
	font-weight:100;
}


nav#primary-menu li {
    border-top: 0;
}

nav#primary-menu li:first-child {
    border-top: 0;
}

nav#primary-menu li a {
    display: block;
    text-align: right;
    padding-right:60px;
	padding-top:20px;
    text-transform: uppercase;
    color: #FFF;
    font-size: 19px;
	line-height:7px;
    letter-spacing: 1px;
    font-family: 'Roboto', Helvetica, Arial, sans-serif;
    transition: color 0.4s linear;
    -ms-transition: color 0.4s linear;
    -o-transition: color 0.4s linear;
    -moz-transition: color 0.4s linear;
    -webkit-transition: color 0.4s linear;
}

nav#primary-menu li a:hover { color: #FFF; font-weight:bold;}


.active1 { color: #FFF; font-weight:bold;}


/* ----------------------------------------------------------------
    SideMenu - Social
-----------------------------------------------------------------*/


#side-social {
    position: absolute;
    top: auto;
    bottom: 30px;
	right:60px;
    width: 100%;
    text-align: right;
	font-size:14px;
	line-height:17px;
	font-weight:300;
}

#side-social ul { margin: 0; }

#side-social li {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin: 0 10px;
}

#side-social li a {
    display: block;
    width: 16px;
    height: 16px;
    font-size: 16px;
    line-height: 1;
    color: #777;
    transition: color 0.6s linear;
    -ms-transition: color 0.6s linear;
    -o-transition: color 0.6s linear;
    -moz-transition: color 0.6s linear;
    -webkit-transition: color 0.6s linear;
}

#side-social li a:hover { color: #c81414; }



/* ----------------------------------------------------------------
    Dark Header
-----------------------------------------------------------------*/


#side-menu.dark { background-color: #333; }

#side-menu.dark span.divider span { border-bottom: 1px solid #555; }

#side-menu.dark nav#primary-menu li a,
#side-menu.dark #side-social li a {
    color: #FFF;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}

#side-menu.dark nav#primary-menu li a:hover { color: #FFF; }


#side-menu.dark #side-social li a:hover { color: #FFF; }


/* ----------------------------------------------------------------
    Slider
-----------------------------------------------------------------*/


#slider .container {
    position: absolute;
    width: 100%;
    top: 0;
}


.slider-caption {
    display: block;
    position: absolute;
    width: 100%;
    height: 120px;
    z-index: 8;
    top: 50%;
    margin-top: -60px;
    left: 0;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    letter-spacing: 2px;
    font-size: 40px;
    text-transform: uppercase;
    line-height: 120px;
    color: #FFF;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
    background-color: rgba(0,0,0,0.4);
}

.slider-caption span { color: #c81414; }


.slides-pagination { bottom: 20px !important; }

.slides-pagination a {
    width: 8px;
    height: 8px;
    border-radius: 8px;
    margin: 3px;
    text-indent: -9999px;
    border-color: rgba(255,255,255,0.8) !important;
}

.slides-pagination a.current {
    background-color: rgba(255,255,255,0.8) !important;
    border-color: transparent !important;
}


.fslider,
.fslider .flexslider,
.fslider .slider-wrap,
.fslider .slide,
.fslider .slide a,
.fslider .slide img {
    position: relative;
    width: 100%;
    height: auto;
    overflow: hidden;
}

.fslider { min-height: 32px; }


/* ----------------------------------------------------------------
    Flex Slider
-----------------------------------------------------------------*/


.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  { outline: none; border: none; }
.slider-wrap,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none; border: none;} 

.flexslider {position: relative;margin: 0; padding: 0;}
.flexslider .slider-wrap > .slide {display: none; -webkit-backface-visibility: hidden;}
.flexslider .slider-wrap img {width: 100%; display: block;}
.flex-pauseplay span {text-transform: capitalize;}

.slider-wrap:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slider-wrap {display: block;} 
* html .slider-wrap {height: 1%;}

.no-js .slider-wrap > .slide:first-child {display: block;}

.flex-viewport {
    max-height: 2000px;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    transition: all 1s ease;
}


/* ----------------------------------------------------------------
    Slider Navigation
-----------------------------------------------------------------*/


.flex-prev,
.flex-next {
    display: block;
    position: absolute !important;
    z-index: 10;
    cursor: pointer;
    top: auto;
    left: -32px;
    top: 50%;
    margin-top: -28px;
    right: 38px;
    width: 32px !important;
    height: 56px !important;
    text-indent: -9999px;
    background-image: url("images/icons/flex-arrow.png");
    background-color: #666;
    background-color: rgba(11,11,11,0.6);
    border-radius: 0 5px 5px 0;
    -moz-border-radius: 0 5px 5px 0;
    -webkit-border-radius: 0 5px 5px 0;
    transition: all .2s linear;
    -moz-transition: all .2s linear;
    -webkit-transition: all .2s linear;
    -ms-transition: all .2s linear;
    -o-transition: all .2s linear;
    opacity: 0;
}

.flex-next {
    left: auto;
    right: -32px;
    background-position: -32px 0;
    border-radius: 5px 0 0 5px;
    -moz-border-radius: 5px 0 0 5px;
    -webkit-border-radius: 5px 0 0 5px;
}


.flex-prev:hover,
.flex-next:hover {
    background-color: #222;
    background-color: rgba(11,11,11,0.8);
}

.flexslider:hover .flex-prev,
.flexslider:hover .flex-next { opacity: 1; }

.flexslider:hover .flex-prev { left: 0; }

.flexslider:hover .flex-next { right: 0; }

.flex-control-nav {
    position: absolute;
    z-index: 10;
    text-align: center;
    top: 14px;
    right: 10px;
    margin: 0;
}

.flex-control-nav li {
    float: left;
    display: block;
    margin: 0 3px;
    width: 12px;
    height: 12px;
}

.flex-control-nav li a {
    display: block;
    cursor: pointer;
    text-indent: -9999px;
    width: 12px !important;
    height: 12px !important;
    background-color: #666;
    background-color: rgba(11,11,11,0.5);
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    transition: background-color .2s linear;
    -moz-transition: background-color .2s linear;
    -webkit-transition: background-color .2s linear;
    -ms-transition: background-color .2s linear;
    -o-transition: background-color .2s linear;
}

.flex-control-nav li:hover a,
.flex-control-nav li a.flex-active {
    background-color: #333;
    background-color: rgba(11,11,11,0.8);
}



/* ----------------------------------------------------------------
    Content
-----------------------------------------------------------------*/


.page-title {
    padding: 100px 0;
    font-weight: 200;
}


.page-title h2 {
    font-weight: 400;
    font-size: 56px;
    line-height: 1;
    padding-bottom: 0;
}

.page-title .container > span {
    display: block;
    margin-top: 20px;
    font-family: 'Roboto', Helvetica, Arial, sans-serif;
    font-size: 19px;
    line-height: 25px;
    letter-spacing: 1px;
    color: # FFF;
}


/* ----------------------------------------------------------------
    Content
-----------------------------------------------------------------*/


#content {
    position: relative;
    background-color: #FFF;
    overflow: hidden;
    margin-bottom: -20px;
}

#content span.divider span { width: 7%; }

.content-wrap {
    padding: 60px 0;
}

#slider { position: relative; }



span.divider2 {
    display: block;
    text-align: center;
    margin-bottom: 60px;
}

span.divider2 span {
    display: inline-block;
    width: 5%;
    border-bottom: 4px solid #c81414;
}


.description {
    font-size: 16px;
    line-height: 24px;
    color: #555;
}

.description span { color: #c81414; }



/* ----------------------------------------------------------------
    Portfolio
-----------------------------------------------------------------*/


#portfolio-filter {
    position: relative;
    margin: 0 0 40px 0;
    text-align: center;
}

#portfolio-filter li {
    display: inline-block;
    position: relative;
    font-family: "Roboto", sans-serif;
    font-size: 14px;
}

#portfolio-filter li a {
    display: inline-block;
    position: relative;
    color: #444;
    font-weight: 500;
    text-transform: uppercase;
}

#portfolio-filter li span {
    display: inline-block;
    color: #BBB;
    font-weight: 500;
    margin: 0 12px;
}

#portfolio-filter li:first-child a { border-left: none; }

#portfolio-filter li a:hover,
#portfolio-filter li.activeFilter a { color: #c81414; }


/* ----------------------------------------------------------------
    Portfolio - Items
-----------------------------------------------------------------*/


#portfolio {
    position: relative;
    margin: 0 0 60px 0;
}

.portfolio-item {
    position: relative;
    float: left;
    margin: 0 0 0 0;
    width: 20%;
}

.portfolio-item .portfolio-image,
.portfolio-item .portfolio-image > a,
.portfolio-item .portfolio-image img {
    display: block;
    position: relative;
    width: 100%;
    height: auto;
}

.portfolio-item .portfolio-image { overflow: hidden; }


.portfolio-item .portfolio-image img {
    transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
}

.portfolio-item:hover .portfolio-image img {
    transform: scale(1.2);
    -moz-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
}


/* ----------------------------------------------------------------
    Portfolio Overlay
-----------------------------------------------------------------*/


.portfolio-overlay,
.portfolio-overlay-wrap {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,0.85);
    width: 100%;
    height: 100%;
    z-index: 5;
}

.portfolio-overlay-wrap {
    display: block;
    text-align: center;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
    background-color: transparent;
}

.portfolio-overlay-wrap h3 {
    position: absolute;
    width: 100%;
    top: 37%;
    color: #FFF;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 18px;
    letter-spacing: 1px;
}

.portfolio-overlay-wrap span {
    display: block;
    position: absolute;
    width: 100%;
    top: auto;
    bottom: 37%;
    color: #999;
    font-size: 14px;
}


/* ----------------------------------------------------------------
    Portfolio AJAX
-----------------------------------------------------------------*/

#portfolio-ajax-wrap {
    position: relative;
    background-color: #F9F9F9;
    margin-top: -6px;
}

#portfolio-ajax-show .container { padding: 60px 0; }


/* ----------------------------------------------------------------
    Portfolio Single
-----------------------------------------------------------------*/

#portfolio-single-wrap { position: relative; }


/* ----------------------------------------------------------------
    Portfolio Single - Slider
-----------------------------------------------------------------*/


#portfolio-single-wrap #slider { float: left; }

#portfolio-single-wrap.portfolio-single-left #slider { float: right; }

#portfolio-single-wrap.portfolio-single-full #slider,
.postcontent #portfolio-single-wrap #slider {
    float: none;
    margin-bottom: 30px;
}

#portfolio-single-wrap #slider {
    width: 720px;
    height: auto;
    background-color: transparent;
}

.postcontent #portfolio-single-wrap #slider { width: 100%; }

#portfolio-single-wrap .slider-wrap,
#portfolio-single-wrap .slide,
#portfolio-single-wrap #slider a,
#portfolio-single-wrap #slider img {
    display: block;
    width: 100%;
    height: auto;
}

#portfolio-single-wrap #slider iframe { display: block; }

#portfolio-single-wrap.portfolio-single-full #slider {
    width: 1140px;
    height: auto;
}

#portfolio-single-wrap.portfolio-single-full .slider-wrap,
#portfolio-single-wrap.portfolio-single-full .slide,
#portfolio-single-wrap.portfolio-single-full .slide a,
#portfolio-single-wrap.portfolio-single-full .slide img {
    width: 100%;
    height: auto;
}


#portfolio-single-wrap .flex-prev,
#portfolio-single-wrap .flex-next,
.entry_image .flex-prev,
.entry_image .flex-next,
.fslider .flex-prev,
.fslider .flex-next {
    top: 50%;
    bottom: auto;
    margin-top: -28px;
}

.portfolio-item .portfolio-image .flex-prev,
.portfolio-item .portfolio-image .flex-next { margin-top: -14px; }


/* ----------------------------------------------------------------
    Portfolio Single - Details
-----------------------------------------------------------------*/


#portfolio-details-wrap {
    float: right;
    width: 380px;
    margin-left: 40px;
}

#portfolio-single-wrap.portfolio-single-left #portfolio-details-wrap {
    float: left;
    margin: 0 40px 0 0;
}

#portfolio-single-wrap.portfolio-single-full #portfolio-details-wrap,
.postcontent #portfolio-single-wrap #portfolio-details-wrap {
    float: none;
    margin: 0;
    width: auto;
}

#portfolio-details-wrap h3 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 200;
    text-transform: uppercase;
    letter-spacing: 0;
    font-family: 'Open Sans', sans-serif;
}

#portfolio-details-wrap span.page-divider { margin-top: 10px; }

#portfolio-details-wrap .port-details { margin-top: 10px; }

.port-desc { font-size: 13px; }

#portfolio-single-wrap.portfolio-single-full .port-desc,
#portfolio-single-wrap.portfolio-single-full.portfolio-single-full-left .port-desc,
.postcontent #portfolio-single-wrap .port-desc {
    float: right;
    margin: 0;
    width: 800px;
}

.postcontent #portfolio-single-wrap .port-desc { width: 440px; }

#portfolio-single-wrap.portfolio-single-full .port-details,
#portfolio-single-wrap.portfolio-single-full.portfolio-single-full-left .port-details,
.postcontent #portfolio-single-wrap .port-details {
    float: left;
    margin: 0 40px 0 0;
    width: 300px;
}

#portfolio-single-wrap.portfolio-single-full.portfolio-single-full-left .port-desc,
.postcontent #portfolio-single-wrap.portfolio-single-left .port-desc { float: left; }

#portfolio-single-wrap.portfolio-single-full.portfolio-single-full-left .port-details,
.postcontent #portfolio-single-wrap.portfolio-single-left .port-details {
    float: right;
    margin: 0 0 0 40px;
}

#portfolio-single-wrap.portfolio-details-sidebar-right .port-desc {
    float: left;
    margin: 0;
}

#portfolio-single-wrap.portfolio-details-sidebar-right .port-details {
    float: right;
    margin: 0 0 0 40px;
}

#portfolio-details-wrap .port-details h4 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 200;
}

#portfolio-details-wrap .port-terms,
.product-terms {
    position: relative;
    border-bottom: 1px dotted #EEE;
    margin-bottom: 10px;
    padding-bottom: 10px;
}


#portfolio-details-wrap .port-terms h5,
.product-terms h5 {
    color: #333;
    margin: 0 !important;
    float: left;
    width: 130px;
    font-size: 12px;
    line-height: 20px;
    padding: 0;
}

#portfolio-details-wrap .port-terms span,
.product-terms span {
    display: block;
    position: relative;
    overflow: hidden;
}

.word-wrap {
    white-space: -moz-pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word;
    white-space: pre-wrap;
    white-space: pre-line;
}


/* ----------------------------------------------------------------
    Portfolio Navigation
-----------------------------------------------------------------*/


#portfolio-navigation {
    position: absolute;
    top: 50%;
    left: auto;
    right: 0;
    max-width: 106px;
    height: 32px;
    margin-top: -16px;
}

#portfolio-navigation a {
    display: block;
    float: left;
    margin-left: 5px;
    width: 16px;
    height: 16px;
    padding: 6px;
    text-align: center;
    color: #333;
    border: 2px solid #333;
    transition: border-color .2s linear, color .2s linear;
    -moz-transition: border-color .2s linear, color .2s linear;
    -webkit-transition: border-color .2s linear, color .2s linear;
    -ms-transition: border-color .2s linear, color .2s linear;
    -o-transition: border-color .2s linear, color .2s linear;
    border-radius: 16px;
    -moz-border-radius: 16px;
    -webkit-border-radius: 16px;
}

#portfolio-navigation a i {
    position: relative;
    top: -1px;
    font-size: 16px;
    line-height: 1;
}

#portfolio-navigation a:first-child { margin-left: 0; }

#portfolio-navigation a:hover {
    color: #c81414;
    border-color: #c81414;
}

#portfolio-ajax-show #portfolio-navigation {
    top: 55px;
    margin-top: 0;
}


/* ----------------------------------------------------------------
    Isotope
-----------------------------------------------------------------*/

.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:         top, left, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}



/* ----------------------------------------------------------------
    Clients
-----------------------------------------------------------------*/


.clients {
    position: relative;
    margin: 0 0 60px;
}

.clients li {
    float: left;
    margin-left: 40px;
}

.clients li,
.clients li a,
.clients li img {
    display: block;
    width: 156px;
    height: 69px;
}

.clients li:first-child { margin-left: 0; }



/* ----------------------------------------------------------------
    Features
-----------------------------------------------------------------*/


.product-feature {
    position: relative;
    padding-left: 80px;
    margin-top: 30px;
}

.product-feature:first-child { margin-top: 0; }

.product-feature h3 {
    font-size: 20px;
    line-height: 24px;
    color: #444;
    padding-bottom: 7px;
}

.product-feature p { margin: 0 !important; }

.product-feature img,
.product-feature > span {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    margin: 0;
    padding: 12px;
    width: 24px;
    height: 24px;
    background-color: #c81414;
    border-radius: 24px;
    -moz-border-radius: 24px;
    -webkit-border-radius: 24px;
}

.product-feature > span {
    font-size: 24px;
    color: #FFF;
    text-align: center;
    line-height: 22px;
}

.product-feature2 { padding-left: 52px; }

.product-feature2 img,
.product-feature2 > span,
.product-feature3 img,
.product-feature3 > span {
    padding: 0;
    width: 40px;
    height: 40px;
    background-color: transparent !important;
    border-radius: 0;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    font-size: 40px;
    color: #333;
    text-align: center;
    line-height: 1;
}

.product-feature3 {
    padding: 15px;
    background-color: #F5F5F5;
    text-align: center;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    box-shadow: inset 0 0 15px rgba(0,0,0,0.1);
    -moz-box-shadow: inset 0 0 15px rgba(0,0,0,0.1);
    -webkit-box-shadow: inset 0 0 15px rgba(0,0,0,0.1);
}

.product-feature3 img,
.product-feature3 > span {
    position: relative;
    margin: 0 auto 15px;
    width: 96px;
    height: 96px;
    font-size: 95px;
}

.product-feature3:hover span { color: #c81414; }


/* ----------------------------------------------------------------
    Icons
-----------------------------------------------------------------*/


.i-rounded,
.i-plain,
.i-circled {
    display: block !important;
    float: left !important;
    margin: 12px 12px 12px 0;
    text-align: center !important;
    font-size: 24px;
    line-height: 29px !important;
    color: #FFF;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
    cursor: pointer;
}

.i-rounded,
.i-circled {
    width: 32px !important;
    height: 32px !important;
    padding: 8px;
    background-color: #444;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.i-plain {
    width: 40px !important;
    height: 40px !important;
    font-size: 40px;
    line-height: 1;
    color: #444;
    text-shadow: 1px 1px 1px #FFF;
}

.i-plain:hover { color: #777; }

.i-circled {
    border-radius: 24px;
    -moz-border-radius: 24px;
    -webkit-border-radius: 24px;
}

.i-light {
    background-color: #F5F5F5;
    color: #444;
    text-shadow: 1px 1px 1px #FFF;
    box-shadow: inset 0 0 15px rgba(0,0,0,0.2);
    -moz-box-shadow: inset 0 0 15px rgba(0,0,0,0.2);
    -webkit-box-shadow: inset 0 0 15px rgba(0,0,0,0.2);
}


.i-rounded:hover,
.i-circled:hover {
    background-color: #c81414;
    color: #FFF;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
    box-shadow: 0 0 0 rgba(0,0,0,0.2);
    -moz-box-shadow: 0 0 0 rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 0 0 rgba(0,0,0,0.2);
}


.dropcap {
    float: left;
    display: block;
    margin: 3px 8px 3px 0;
    padding: 8px;
    font-size: 36px;
    line-height: 1;
    border: 1px solid #BBB;
    color: #666;
    box-shadow: 0 0 8px #BBB;
}

.highlight {
    display: inline;
    padding: 0 5px;
    color: #FFF;
    background-color: #444;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
}


/* ----------------------------------------------------------------
    Animated Icon Hovers
-----------------------------------------------------------------*/


.hi-icon {
    display: block !important;
    font-size: 32px;
    line-height: 53px !important;
    cursor: pointer;
    width: 56px !important;
    height: 56px !important;
    border-radius: 50% !important;
    padding: 0 !important;
    margin: 0 20px 20px 0;
    text-align: center;
    position: absolute;
    z-index: 1;
    color: #FFF;
    top: 0;
    left: 0;
}

.hi-icon:after {
    pointer-events: none;
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    content: '';
    -webkit-box-sizing: content-box; 
    -moz-box-sizing: content-box; 
    box-sizing: content-box;
}

/* Effect 1 */
.hi-icon-effect-1.hi-icon {
    background: #c81414;
    -webkit-transition: background 0.3s, color 0.3s;
    -moz-transition: background 0.3s, color 0.3s;
    transition: background 0.3s, color 0.3s;
}

.hi-icon-effect-1.hi-icon:after {
    top: -3px;
    left: -3px;
    padding: 3px;
    box-shadow: 0 0 0 3px #444;
    -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
    -webkit-transform: scale(.8);
    -moz-transition: -moz-transform 0.3s, opacity 0.3s;
    -moz-transform: scale(.8);
    -ms-transform: scale(.8);
    transition: transform 0.3s, opacity 0.3s;
    transform: scale(.8);
    opacity: 0;
}

/* Effect 1a */
.no-touch .hi-icon-effect-1a.hi-icon:hover,
.no-touch .product-feature:hover .hi-icon-effect-1a.hi-icon {
    background: #444;
    color: #FFF;
}

.no-touch .hi-icon-effect-1a.hi-icon:hover:after,
.no-touch .product-feature:hover .hi-icon-effect-1a.hi-icon:after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

/* Effect 1b */
.no-touch .hi-icon-effect-1b.hi-icon:hover,
.no-touch .product-feature:hover .hi-icon-effect-1b.hi-icon {
    background: #444;
    color: #FFF;
}

.hi-icon-effect-1b.hi-icon:after,
.product-feature:hover .hi-icon-effect-1b.hi-icon:after {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}

.no-touch .hi-icon-effect-1b.hi-icon:hover:after,
.no-touch .product-feature:hover .hi-icon-effect-1b.hi-icon:after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}


/* Effect 2 */
.hi-icon-effect-2.hi-icon {
    color: #FFF;
    box-shadow: 0 0 0 3px #c81414;
    -webkit-transition: color 0.3s, box-shadow 0.3s, background 0.3s, background 0.3s;
    -moz-transition: color 0.3s, box-shadow 0.3s, background 0.3s;
    transition: color 0.3s, box-shadow 0.3s, background 0.3s;
}

.hi-icon-effect-2.hi-icon:after {
    top: -2px;
    left: -2px;
    padding: 2px;
    z-index: -1;
    background: #c81414;
    -webkit-transition: -webkit-transform 0.3s, opacity 0.3s, background 0.3s;
    -moz-transition: -moz-transform 0.3s, opacity 0.3s, background 0.3s;
    transition: transform 0.3s, opacity 0.3s, background 0.3s;
}

/* Effect 2a */
.no-touch .hi-icon-effect-2a.hi-icon:hover,
.no-touch .product-feature:hover .hi-icon-effect-2a.hi-icon {
    color: #FFF;
    box-shadow: 0 0 0 3px #444;
    background: transparent;
}

.no-touch .hi-icon-effect-2a.hi-icon:hover:after,
.no-touch .product-feature:hover .hi-icon-effect-2a.hi-icon:after {
    background: #444;
    -webkit-transform: scale(0.85);
    -moz-transform: scale(0.85);
    -ms-transform: scale(0.85);
    transform: scale(0.85);
}

/* Effect 2b */
.no-touch .hi-icon-effect-2b.hi-icon:hover:after,
.no-touch .product-feature:hover .hi-icon-effect-2b.hi-icon:after {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    opacity: 0;
    -webkit-transition: -webkit-transform 0.6s, opacity 0.3s;
    -moz-transition: -moz-transform 0.6s, opacity 0.3s;
    transition: transform 0.6s, opacity 0.3s;
}

.no-touch .hi-icon-effect-2b.hi-icon:hover,
.no-touch .product-feature:hover .hi-icon-effect-2b.hi-icon {
    color: #444;
    box-shadow: 0 0 0 3px #444;
    background: transparent;
}


/* Effect 3 */
.hi-icon-effect-3.hi-icon {
    box-shadow: 0 0 0 3px #c81414;
    -webkit-transition: color 0.5s, box-shadow 0.5s, background 0.5s;
    -moz-transition: color 0.5s, box-shadow 0.5s, background 0.5s;
    transition: color 0.5s, box-shadow 0.5s, background 0.5s;
}

.hi-icon-effect-3.hi-icon:after {
    top: -2px;
    left: -2px;
    padding: 2px;
    z-index: -1;
    background: #c81414;
    -webkit-transition: -webkit-transform 0.5s, opacity 0.5s, background 0.5s;
    -moz-transition: -moz-transform 0.5s, opacity 0.5s, background 0.5s;
    transition: transform 0.5s, opacity 0.5s, background 0.5s;
}

/* Effect 3a */
.hi-icon-effect-3a.hi-icon {
    color: #FFF;
    box-shadow: 0 0 0 3px #c81414;
}

.no-touch .hi-icon-effect-3a.hi-icon:hover,
.no-touch .product-feature:hover .hi-icon-effect-3a.hi-icon {
    color: #444;
    box-shadow: 0 0 0 3px #444;
    background: transparent;
}

.no-touch .hi-icon-effect-3a.hi-icon:hover:after,
.no-touch .product-feature:hover .hi-icon-effect-3a.hi-icon:after {
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
    opacity: 0;
    background: #444;
}

/* Effect 3b */
.hi-icon-effect-3b.hi-icon {
    color: #c81414;
    background: transparent;
}

.no-touch .hi-icon-effect-3b.hi-icon:hover,
.no-touch .product-feature:hover .hi-icon-effect-3b.hi-icon {
    color: #FFF;
    box-shadow: 0 0 0 3px #444;
}

.hi-icon-effect-3b.hi-icon:after {
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
    opacity: 0;
    background: #444;
}

.no-touch .hi-icon-effect-3b.hi-icon:hover:after,
.no-touch .product-feature:hover .hi-icon-effect-3b.hi-icon:after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}


/* Effect 4 */
.hi-icon-effect-4.hi-icon {
    width: 60px !important;
    height: 60px !important;
    color: #c81414;
    box-shadow: 0 0 0 3px #c81414;
    background: transparent;
}

.hi-icon-effect-4a.hi-icon {
    -webkit-transition: box-shadow 0.2s, color 0.2s;
    -moz-transition: box-shadow 0.2s, color 0.2s;
    transition: box-shadow 0.2s, color 0.2s;
}

.hi-icon-effect-4.hi-icon:before {
    line-height: 56px;
}

.hi-icon-effect-4.hi-icon:after {
    top: -3px;
    left: -3px;
    padding: 0;
    z-index: 10;
    border: 3px dashed #c81414;
}

.no-touch .hi-icon-effect-4.hi-icon:hover,
.no-touch .product-feature:hover .hi-icon-effect-4.hi-icon {
    box-shadow: 0 0 0 0 #444;
    color: #444;
}

.no-touch .hi-icon-effect-4.hi-icon:hover:after,
.no-touch .product-feature:hover .hi-icon-effect-4.hi-icon:after { border: 3px dashed #444; }

/* Effect 4b */
.no-touch .hi-icon-effect-4b.hi-icon:hover,
.no-touch .product-feature:hover .hi-icon-effect-4b.hi-icon {
    -webkit-transition: box-shadow 0.2s;
    -moz-transition: box-shadow 0.2s;
    transition: box-shadow 0.2s;
}

.no-touch .hi-icon-effect-4b.hi-icon:hover:after,
.no-touch .product-feature:hover .hi-icon-effect-4b.hi-icon:after {
    -webkit-animation: spinAround 9s linear infinite;
    -moz-animation: spinAround 9s linear infinite;
    animation: spinAround 9s linear infinite;
}

@-webkit-keyframes spinAround {
    from {
        -webkit-transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(360deg);
    }
}
@-moz-keyframes spinAround {
    from {
        -moz-transform: rotate(0deg)
    }
    to {
        -moz-transform: rotate(360deg);
    }
}
@keyframes spinAround {
    from {
        transform: rotate(0deg)
    }
    to {
        transform: rotate(360deg);
    }
}


/* Effect 5 */
.hi-icon-effect-5.hi-icon {
    box-shadow: 0 0 0 3px #FF8300;
    color: #FF8300;
    overflow: hidden;
    background: transparent;
    -webkit-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
    -moz-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
    transition: background 0.3s, color 0.3s, box-shadow 0.3s;
}

.hi-icon-effect-5.hi-icon:after {
    display: none;
}

.no-touch .hi-icon-effect-5.hi-icon:hover,
.no-touch .product-feature:hover .hi-icon-effect-5.hi-icon {
    background: #444;
    color: #FFF;
    box-shadow: 0 0 0 6px rgba(11,11,11,0.3);
}

.no-touch .hi-icon-effect-5a.hi-icon:hover:before,
.no-touch .product-feature:hover .hi-icon-effect-5a.hi-icon:before {
    -webkit-animation: toRightFromLeft 0.3s forwards;
    -moz-animation: toRightFromLeft 0.3s forwards;
    animation: toRightFromLeft 0.3s forwards;
}

@-webkit-keyframes toRightFromLeft {
    49% {
        -webkit-transform: translate(100%);
    }
    50% {
        opacity: 0;
        -webkit-transform: translate(-100%);
    }
    51% {
        opacity: 1;
    }
}
@-moz-keyframes toRightFromLeft {
    49% {
        -moz-transform: translate(100%);
    }
    50% {
        opacity: 0;
        -moz-transform: translate(-100%);
    }
    51% {
        opacity: 1;
    }
}
@keyframes toRightFromLeft {
    49% {
        transform: translate(100%);
    }
    50% {
        opacity: 0;
        transform: translate(-100%);
    }
    51% {
        opacity: 1;
    }
}

.no-touch .hi-icon-effect-5b.hi-icon:hover:before,
.no-touch .product-feature:hover .hi-icon-effect-5b.hi-icon:before {
    -webkit-animation: toLeftFromRight 0.3s forwards;
    -moz-animation: toLeftFromRight 0.3s forwards;
    animation: toLeftFromRight 0.3s forwards;
}

@-webkit-keyframes toLeftFromRight {
    49% {
        -webkit-transform: translate(-100%);
    }
    50% {
        opacity: 0;
        -webkit-transform: translate(100%);
    }
    51% {
        opacity: 1;
    }
}
@-moz-keyframes toLeftFromRight {
    49% {
        -moz-transform: translate(-100%);
    }
    50% {
        opacity: 0;
        -moz-transform: translate(100%);
    }
    51% {
        opacity: 1;
    }
}
@keyframes toLeftFromRight {
    49% {
        transform: translate(-100%);
    }
    50% {
        opacity: 0;
        transform: translate(100%);
    }
    51% {
        opacity: 1;
    }
}

.no-touch .hi-icon-effect-5c.hi-icon:hover:before,
.no-touch .product-feature:hover .hi-icon-effect-5c.hi-icon:before {
    -webkit-animation: toTopFromBottom 0.3s forwards;
    -moz-animation: toTopFromBottom 0.3s forwards;
    animation: toTopFromBottom 0.3s forwards;
}

@-webkit-keyframes toTopFromBottom {
    49% {
        -webkit-transform: translateY(-100%);
    }
    50% {
        opacity: 0;
        -webkit-transform: translateY(100%);
    }
    51% {
        opacity: 1;
    }
}
@-moz-keyframes toTopFromBottom {
    49% {
        -moz-transform: translateY(-100%);
    }
    50% {
        opacity: 0;
        -moz-transform: translateY(100%);
    }
    51% {
        opacity: 1;
    }
}
@keyframes toTopFromBottom {
    49% {
        transform: translateY(-100%);
    }
    50% {
        opacity: 0;
        transform: translateY(100%);
    }
    51% {
        opacity: 1;
    }
}

.no-touch .hi-icon-effect-5d.hi-icon:hover:before,
.no-touch .product-feature:hover .hi-icon-effect-5d.hi-icon:before {
    -webkit-animation: toBottomFromTop 0.3s forwards;
    -moz-animation: toBottomFromTop 0.3s forwards;
    animation: toBottomFromTop 0.3s forwards;
}

@-webkit-keyframes toBottomFromTop {
    49% {
        -webkit-transform: translateY(100%);
    }
    50% {
        opacity: 0;
        -webkit-transform: translateY(-100%);
    }
    51% {
        opacity: 1;
    }
}
@-moz-keyframes toBottomFromTop {
    49% {
        -moz-transform: translateY(100%);
    }
    50% {
        opacity: 0;
        -moz-transform: translateY(-100%);
    }
    51% {
        opacity: 1;
    }
}
@keyframes toBottomFromTop {
    49% {
        transform: translateY(100%);
    }
    50% {
        opacity: 0;
        transform: translateY(-100%);
    }
    51% {
        opacity: 1;
    }
}


/* Effect 6 */
.hi-icon-effect-6.hi-icon {
    box-shadow: 0 0 0 3px #FF8300;
    color: #FF8300;
    background: transparent;
    -webkit-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
    -moz-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
    transition: background 0.3s, color 0.3s, box-shadow 0.3s;
}

.no-touch .hi-icon-effect-6.hi-icon:hover,
.no-touch .product-feature:hover .hi-icon-effect-6.hi-icon {
    background: #444;
    color: #FFF;
    box-shadow: 0 0 0 3px #444;
}

.no-touch .hi-icon-effect-6.hi-icon:hover:before,
.no-touch .product-feature:hover .hi-icon-effect-6.hi-icon:before {
    -webkit-animation: spinAround 2s linear infinite;
    -moz-animation: spinAround 2s linear infinite;
    animation: spinAround 2s linear infinite;
}


/* Effect 7 */
.hi-icon-effect-7.hi-icon {
    box-shadow: 0 0 0 3px #FF8300;
    color: #FF8300;
    background: transparent;
    -webkit-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
    -moz-transition: background 0.3s, color 0.3s, box-shadow 0.3s;
    transition: background 0.3s, color 0.3s, box-shadow 0.3s;
}

.no-touch .hi-icon-effect-7.hi-icon:hover,
.no-touch .product-feature:hover .hi-icon-effect-7.hi-icon {
    color: #444;
}

.hi-icon-effect-7.hi-icon:after {
    top: -6px;
    left: -6px;
    padding: 6px;
    z-index: -1;
    opacity: 0;
}

/* Effect 7a */
.hi-icon-effect-7a.hi-icon:hover,
.product-feature:hover .hi-icon-effect-7a.hi-icon { box-shadow: 0 0 0 3px #444; }

.hi-icon-effect-7a.hi-icon:after {
    box-shadow: 0 0 0 #FF8300;
    -webkit-transition: opacity 0.3s, box-shadow 0.3s;
    -moz-transition: opacity 0.3s, box-shadow 0.3s;
    transition: opacity 0.3s, box-shadow 0.3s;
}

.no-touch .hi-icon-effect-7a.hi-icon:hover:after,
.no-touch .product-feature:hover .hi-icon-effect-7a.hi-icon:after {
    opacity: 1;
    box-shadow: 3px 2px 0 #444;
}

.hi-icon-effect-7a.hi-icon:before {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 1;
    -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
    -moz-transition: -moz-transform 0.3s, opacity 0.3s;
    transition: transform 0.3s, opacity 0.3s;
}

.no-touch .hi-icon-effect-7a.hi-icon:hover:before,
.no-touch .product-feature:hover .hi-icon-effect-7a.hi-icon:before {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}

/* Effect 7b */
.hi-icon-effect-7b.hi-icon:hover,
.product-feature:hover .hi-icon-effect-7b.hi-icon { box-shadow: 0 0 0 3px #444; }

.hi-icon-effect-7b.hi-icon:after {
    box-shadow: 3px 2px #444;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    -moz-transition: opacity 0.3s, -moz-transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
}

.no-touch .hi-icon-effect-7b.hi-icon:hover:after,
.no-touch .product-feature:hover .hi-icon-effect-7b.hi-icon:after {
    opacity: 1;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

.hi-icon-effect-7b.hi-icon:before {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -ms-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 1;
    -webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
    -moz-transition: -moz-transform 0.3s, opacity 0.3s;
    transition: transform 0.3s, opacity 0.3s;
}

.no-touch .hi-icon-effect-7b.hi-icon:hover:before,
.no-touch .product-feature:hover .hi-icon-effect-7b.hi-icon:before {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1;
}


/* Effect 8 */
.hi-icon-effect-8.hi-icon {
    background: #FF8300;
    -webkit-transition: -webkit-transform ease-out 0.1s, background 0.2s;
    -moz-transition: -moz-transform ease-out 0.1s, background 0.2s;
    transition: transform ease-out 0.1s, background 0.2s;
}

.hi-icon-effect-8.hi-icon:after {
    top: 0;
    left: 0;
    padding: 0;
    z-index: -1;
    box-shadow: 0 0 0 2px #444;
    opacity: 0;
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
}

.no-touch .hi-icon-effect-8.hi-icon:hover,
.no-touch .product-feature:hover .hi-icon-effect-8.hi-icon {
    background: #444;
    -webkit-transform: scale(0.93);
    -moz-transform: scale(0.93);
    -ms-transform: scale(0.93);
    transform: scale(0.93);
    color: #FFF;
}

.hi-icon-effect-8.hi-icon:hover:after,
.product-feature:hover .hi-icon-effect-8.hi-icon:after {
    -webkit-animation: sonarEffect 1.3s ease-out 75ms;
    -moz-animation: sonarEffect 1.3s ease-out 75ms;
    animation: sonarEffect 1.3s ease-out 75ms;
}

@-webkit-keyframes sonarEffect {
    0% {
        opacity: 0.3;
    }
    40% {
        opacity: 0.5;
        box-shadow: 0 0 0 2px rgba(11,11,11,0.1), 0 0 10px 10px #FFF, 0 0 0 10px rgba(11,11,11,0.5);
    }
    100% {
        box-shadow: 0 0 0 2px rgba(11,11,11,0.1), 0 0 10px 10px #FFF, 0 0 0 10px rgba(11,11,11,0.5);
        -webkit-transform: scale(1.5);
        opacity: 0;
    }
}
@-moz-keyframes sonarEffect {
    0% {
        opacity: 0.3;
    }
    40% {
        opacity: 0.5;
        box-shadow: 0 0 0 2px rgba(11,11,11,0.1), 0 0 10px 10px #FFF, 0 0 0 10px rgba(11,11,11,0.5);
    }
    100% {
        box-shadow: 0 0 0 2px rgba(11,11,11,0.1), 0 0 10px 10px #FFF, 0 0 0 10px rgba(11,11,11,0.5);
        -moz-transform: scale(1.5);
        opacity: 0;
    }
}
@keyframes sonarEffect {
    0% {
        opacity: 0.3;
    }
    40% {
        opacity: 0.5;
        box-shadow: 0 0 0 2px rgba(11,11,11,0.1), 0 0 10px 10px #FFF, 0 0 0 10px rgba(11,11,11,0.5);
    }
    100% {
        box-shadow: 0 0 0 2px rgba(11,11,11,0.1), 0 0 10px 10px #FFF, 0 0 0 10px rgba(11,11,11,0.5);
        transform: scale(1.5);
        opacity: 0;
    }
}


/* Effect 9 */
.hi-icon-effect-9.hi-icon {
    color: #FF8300;
    background: transparent;
    -webkit-transition: box-shadow 0.3s, color 0.3s;
    -moz-transition: box-shadow 0.3s, color 0.3s;
    transition: box-shadow 0.3s, color 0.3s;
}

.hi-icon-effect-9.hi-icon:after {
    top: 0;
    left: 0;
    padding: 0;
    box-shadow: 0 0 0 3px #FF8300;
    -webkit-transition: -webkit-transform 0.3s, opacity 0.3s, box-shadow 0.3s;
    -moz-transition: -moz-transform 0.3s, opacity 0.3s, box-shadow 0.3s;
    transition: transform 0.3s, opacity 0.3s, box-shadow 0.3s;
}

/* Effect 9a */
.no-touch .hi-icon-effect-9a.hi-icon:hover:after,
.no-touch .product-feature:hover .hi-icon-effect-9a.hi-icon:after {
    -webkit-transform: scale(0.84);
    -moz-transform: scale(0.84);
    -ms-transform: scale(0.84);
    transform: scale(0.84);
    opacity: 0.5;
    box-shadow: 0 0 0 3px #444;
}

.no-touch .hi-icon-effect-9a.hi-icon:hover,
.no-touch .product-feature:hover .hi-icon-effect-9a.hi-icon {
    box-shadow: 0 0 0 6px #444;
    color: #444;
}

/* Effect 9b */
.no-touch .hi-icon-effect-9b.hi-icon:hover:after,
.no-touch .product-feature:hover .hi-icon-effect-9b.hi-icon:after {
    -webkit-transform: scale(0.84);
    -moz-transform: scale(0.84);
    -ms-transform: scale(0.84);
    transform: scale(0.84);
    box-shadow: 0 0 0 3px #444;
}

.no-touch .hi-icon-effect-9b.hi-icon:hover,
.no-touch .product-feature:hover .hi-icon-effect-9b.hi-icon {
    box-shadow: 0 0 0 6px rgba(11,11,11,0.4);
    color: #444;
}


/* ----------------------------------------------------------------
    Accordions
-----------------------------------------------------------------*/


.acctitle,
.acctitlec {
    display: block;
    position: relative;
    cursor: pointer;
    border-top: 1px dotted #DDD;
    line-height: 24px;
    padding: 10px 0 10px 24px;
    margin: 0;
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    color: #222;
    background: url("images/icons/toggle-plus.png") no-repeat left;
}

.acctitlec {
  background: url("images/icons/toggle-minus.png") no-repeat left;
  cursor: auto;
}

.acctitle:first-child {
  border-top: none;
}

.acc_content {
  position: relative;
  padding: 0 0 15px 24px;
}


/* ----------------------------------------------------------------
    Tabs
-----------------------------------------------------------------*/


.tabs {
    position: relative;
    margin: 0 0 30px 0;
}

ul.tab-nav {
    margin: 0;
    border-bottom: 1px solid #DDD;
    list-style: none;
}

ul.tab-nav li {
    float: left;
    border: 1px solid #DDD;
    border-bottom: 0;
    border-left: 0;
    height: 40px;
}

ul.tab-nav li:first-child {
    margin-left: 15px;
    border-left: 1px solid #DDD;
}

ul.tab-nav li a {
    display: block;
    padding: 0 15px;
    color: #444;
    height: 40px;
    line-height: 40px;
    background-color: #F2F2F2;
    font-size: 13px;
    font-family: 'Roboto', sans-serif;
    font-weight: 200;
}

ul.tab-nav li.ui-tabs-active a {
    position: relative;
    top: 1px;
    background-color: #FFF;
}


/* ----------------------------------------------------------------
    Tab Navigation Style 2
-----------------------------------------------------------------*/


ul.tab-nav.tab-nav2 {
    margin: 0;
    border-bottom: 0;
}

ul.tab-nav.tab-nav2 li {
    float: left;
    border: 0;
    height: 40px;
    margin-left: 10px;
}

ul.tab-nav.tab-nav2 li:first-child {
    margin-left: 0;
    border-left: 0;
}

ul.tab-nav.tab-nav2 li a {
    display: block;
    padding: 0 15px;
    color: #444;
    height: 40px;
    line-height: 40px;
    background-color: #F5F5F5;
    font-size: 13px;
    font-family: 'Roboto', sans-serif;
    font-weight: 200;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
}

ul.tab-nav.tab-nav2 li.ui-state-active a {
    position: relative;
    top: 0;
    background-color: #FF8300;
    color: #FFF;
}


.tab-container {
    position: relative;
    padding: 15px 0 0;
}

ul.tab-nav li a i {
    position: relative;
    top: 1px;
    font-size: 16px;
    margin-right: 3px;
}



/* ----------------------------------------------------------------
    Toggle
-----------------------------------------------------------------*/


.toggle {
  display: block;
  position: relative;
  margin: 0 0 20px 0;
}

.toggle .togglet,
.toggle .toggleta {
  display: block;
  position: relative;
    line-height: 24px;
    padding: 0 0 0 24px;
    margin: 0;
    font-size: 14px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 200;
    color: #333;
  cursor: pointer;
  background: url("images/icons/toggle-plus.png") no-repeat left;
}

.toggle .toggleta {
    font-weight: 200;
    background: url("images/icons/toggle-minus.png") no-repeat left;
}

.toggle .togglec {
  display: block;
  position: relative;
    padding: 10px 0 0 24px;
}


/* ----------------------------------------------------------------
    Alert Messages
-----------------------------------------------------------------*/


.style-msg,
.style-msg2 {
    display: block;
    border-left: 4px solid rgba(0,0,0,0.1);
}

.style-msg2 { border-left: 4px solid rgba(0,0,0,0.2); }

.successmsg {
    background: #C1FFCC;
    color: #184B21;
}

.errormsg {
    background: #F9BBB9;
    color: #740D0A;
}

.infomsg {
    background: #B9DFF4;
    color: #124F70;
}

.alertmsg {
    background: #FCE0B6;
    color: #975E06;
}

.style-msg .sb_msg,
.style-msg2 .msgtitle,
.style-msg2 .sb_msg {
    display: block;
    padding: 10px 15px;
    border-left: 1px solid rgba(255,255,255,0.5);
    font-size: 13px;
    text-shadow: 1px 1px 1px rgba(255,255,255,0.6);
}

.style-msg2 .msgtitle {
    background: rgba(0,0,0,0.1);
    border-top: none;
    border-bottom: none;
    font-size: 13px;
    border-bottom: 1px solid rgba(255,255,255,0.6);
}

.style-msg2 .sb_msg { font-weight: normal; }

.style-msg2 ol,
.style-msg2 ul { margin: 0 0 0 30px; }

.style-msg2 ol { list-style-type: decimal; }

.style-msg2 ul { list-style-type: disc; }




/* ----------------------------------------------------------------
    Animated Numbers
-----------------------------------------------------------------*/


.counter {
    color: #FF8300;
    margin: 5px 0;
    min-height: 52px;
}

.digit-con {
    height: 52px;
    overflow: hidden;
    display: inline-block;
    margin: 0 1px;
    font-family: 'Roboto', sans-serif;
}

.digit-con span {
    display: block;
    text-align: center;
    font-size: 52px;
    line-height: 1;
    position: relative;
    top: 0;
}


/* ----------------------------------------------------------------
    Skills Bar
-----------------------------------------------------------------*/


.skills { margin: 0; }

.skills li {
    position: relative;
    margin-top: 30px;
    height: 25px;
    background-color: #F2F2F2;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    font-family: "Roboto", sans-serif;
}

.skills li:first-child { margin-top: 0; }

.skills li .progress {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    overflow: visible !important;
}

.skills li .progress-percent {
    position: absolute;
    top: -27px;
    right: 0;
    background-color: #444;
    color: #E5E5E5;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
    height: 22px;
    line-height: 22px;
    padding: 0px 5px;
    font-size: 11px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.progress-percent:after, .progress-percent:before {
    top: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.progress-percent:after {
    border-top-color: #444;
    border-width: 4px;
    left: 50%;
    margin-left: -4px;
}

.progress-percent:before {
    border-top-color: #444;
    border-width: 5px;
    left: 50%;
    margin-left: -5px;
}

.skills li span {
    position: absolute;
    top: 0;
    left: 0;
    padding-left: 10px;
    height: 25px;
    line-height: 25px;
    font-size: 13px;
    color: #FFF;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.1);
}



/* ----------------------------------------------------------------
    Sections
-----------------------------------------------------------------*/


.section,
.content-section {
    margin: 60px 0;
    padding: 60px 0;
    background-color: #F9F9F9;
    box-shadow: inset 0 10px 10px -10px rgba(0,0,0,0.07);
    -moz-box-shadow: inset 0 10px 10px -10px rgba(0,0,0,0.07);
    -webkit-box-shadow: inset 0 10px 10px -10px rgba(0,0,0,0.07);
    text-align: center;
}

.content-section {
    font-size: 14px;
    text-align: left;
    padding: 60px 0;
    box-shadow: inset 0 10px 10px -10px rgba(0,0,0,0.07), inset 0 -10px 10px -10px rgba(0,0,0,0.07);
    -moz-box-shadow: inset 0 10px 10px -10px rgba(0,0,0,0.07), inset 0 -10px 10px -10px rgba(0,0,0,0.07);
    -webkit-box-shadow: inset 0 10px 10px -10px rgba(0,0,0,0.07), inset 0 -10px 10px -10px rgba(0,0,0,0.07);
}

.section-icon,
.section-testi-icon {
    display: block;
    height: 48px;
    font-size: 48px;
    line-height: 1;
    color: #444;
    margin: 0 auto;
}

.section-testi-icon {
    width: 64px;
    height: 64px;
    font-size: 64px;
    border: 3px solid #666;
    border-radius: 35px;
    -moz-border-radius: 35px;
    -webkit-border-radius: 35px;
}

.section-testi-icon img {
    display: block;
    height: 64px;
    font-size: 64px;
    border-radius: 32px;
    -moz-border-radius: 32px;
    -webkit-border-radius: 32px;
}

.section-desc {
    display: block;
    font-size: 22px;
    line-height: 1.5;
    color: #555;
    margin: 25px auto 15px;
    max-width: 700px;
}

.section-desc a,
.section-meta a {
    display: inline !important;
    width: auto !important;
    height: auto !important;
}

.section-meta {
    display: block;
    font-size: 13px;
    line-height: 1;
    color: #AAA;
    margin: 0 auto;
    max-width: 700px;
}

.section-meta a { color: #AAA; }

.section-meta a:hover { color: #000; }

.section .fslider { padding-bottom: 45px; }

.section .fslider,
.section .fslider .flexslider,
.section .fslider .slider-wrap,
.section .fslider .slide { overflow: visible !important; }

.section .flex-control-nav {
    position: absolute;
    width: 100%;
    z-index: 10;
    text-align: center;
    top: auto;
    right: 0;
    bottom: -45px;
    margin: 0;
}

.section .flex-control-nav li {
    float: none;
    display: inline-block;
    margin: 0 3px;
    width: 12px;
    height: 12px;
}


.content-section h2 {
    font-size: 26px;
    line-height: 32px;
    padding-bottom: 25px;
}


.content-section p { margin-bottom: 25px; }

.light h1,
.light h2,
.light h3,
.light h4,
.light h5,
.light h6,
.light p,
.light .button,
.light .section-icon,
.light .section-testi-icon,
.light .section-desc,
.light .section-meta {
    color: #FFF !important;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.2) !important;
}

.light .button { border-color: #FFF; }

.light .section-testi-icon { border-color: rgba(0,0,0,0.2); }

.light .button:hover { text-shadow: 0px 0px 0px rgba(0,0,0,0); }

.light .section-meta { color: #EEE; }

.light a { color: #EEE; }

.light a:hover { color: #CCC; }

.light .section-desc a:not(.button) { border-bottom: 1px dotted #EEE; }

.light .section-desc a:not(.button):hover { border-bottom: 1px solid #CCC; }

.light .preloader2 { background-image: url("images/preloader-dark.gif"); }



/* ----------------------------------------------------------------
    Google Maps
-----------------------------------------------------------------*/


#google-map {
    position: relative;
    width: 100%;
    height: 500px;
}

.gmap img { max-width: none !important; }

.gm-style .gm-style-iw h3 span {
    font-size: inherit;
    font-family: inherit;
}


.preloader,
.preloader2 {
  display: block;
  width: 100%;
  height: 100%;
  background: url("images/preloader.gif") center center no-repeat #FFF;
}

.preloader2 { background-color: transparent; }


.portfolio-item .preloader2 {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("images/preloader-dark.gif");
    background-color: rgba(0,0,0,0.9);
    z-index: 999;
}



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


.button {
    display: inline-block;
    position: relative;
    cursor: pointer;
    outline: none;
    white-space: nowrap;
    margin: 5px;
    padding: 0;
    font-family: 'Roboto', sans-serif;
    font-weight: 200;
    font-size: 14px;
    border: 2px solid #444;
    line-height: 24px;
    padding: 5px 10px;
    color: #444;
    transition: color .2s linear, border-color .2s linear;
    -moz-transition: color .2s linear, border-color .2s linear;
    -webkit-transition: color .2s linear, border-color .2s linear;
    -ms-transition: color .2s linear, border-color .2s linear;
    -o-transition: color .2s linear, border-color .2s linear;
}



.button.mini {
    font-size: 12px;
    line-height: 20px;
    padding: 4px 8px;
}

.button.large {
    font-size: 16px;
    line-height: 30px;
    padding: 7px 14px;
}

.button:hover,
.button.inverse {
    border-color: #FF8300 !important;
    color: #FF8300 !important;
}

.button.inverse:hover {
    border-color: #444;
    color: #444;
}

.button:active,
.simple-button:active { top: 1px; }


button.button {
    margin: 5px 0 !important;
    background-color: #F6F6F6 !important;
}

button.button:hover { background-color: #F6F6F6 !important; }

button.button span {
    color: #555 !important;
    text-shadow: 1px 0 1px rgba(255,255,255,0.8) !important;
}

.simple-button {
    display: inline-block;
    position: relative;
    cursor: pointer;
    outline: none;
    white-space: nowrap;
    margin: 5px;
    color: #FFF;
    font-size: 13px;
    font-family: "Roboto", sans-serif;
    padding: 0 15px;
    font-weight: 200;
    line-height: 36px;
    background: #333;
    border: none;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
    transition: background-color .2s linear;
    -moz-transition: background-color .2s linear;
    -webkit-transition: background-color .2s linear;
    -ms-transition: background-color .2s linear;
    -o-transition: background-color .2s linear;
}

.simple-button.inverse { background: #FF8300; }

.simple-button.large {
    line-height: 48px;
    font-size: 16px;
}

.simple-button i,
.button i {
    position: relative;
    top: 1px;
    margin: 0 3px 0 0;
    font-size: 16px;
}

.simple-button.large i,
.button.large i {
    top: 0px;
    font-size: 16px;
    line-height: 20px;
    width: 20px;
    height: 20px;
}

.footer-dark .simple-button,
.footer-dark .simple-button.inverse:hover { background: #282A2B; }

.simple-button:hover {
    background: #FF8300;
    color: #FFF;
}

.simple-button.inverse:hover { background: #333; }



.pace-inactive {
  display: none;
}

.pace {
  -webkit-pointer-events: none;
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.pace .pace-progress {
  position: fixed;
  z-index: 999999;
  top: 0;
  right: 0;
  height: 100%;
  width: 100% !important;
  background: #FFF;
}

.pace .pace-progress:after {
  display: block;
  position: absolute;
  top: 50%;
  width: 100%;
  height: 96px;
  margin-top: -48px;
  content: attr(data-progress-text);
  font-weight: 300;
  font-size: 96px;
  line-height: 1;
  text-align: center;
  color: #444;
}



/* ----------------------------------------------------------------
    Animated Rounded Skills
-----------------------------------------------------------------*/

.rounded-skill {
    display: inline-block;
    margin: 0 15px 15px;
}

.easyPieChart {
    display: inline-block;
    position: relative;
    text-align: center;
    font-size: 18px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 200;
    color: #444;
}

.easyPieChart i { font-size: 32px; }

.easyPieChart canvas {
    position: absolute;
    top: 0;
    left: 0;
}


/* ----------------------------------------------------------------
    Team Members
-----------------------------------------------------------------*/


.team-member {
    position: relative;
    width: 100%;
}

.team-member .team-image {
    position: relative;
    margin-bottom: 20px;
}

.team-image,
.team-image img {
    display: block;
    width: 100%;
}

.team-rounded .team-image img {
    border-radius: 500px;
    -moz-border-radius: 500px;
    -webkit-border-radius: 500px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.team-rounded .team-image { text-align: center; }

.team-image span {
    display: block;
    position: absolute;
    background-color: #FF8300;
    color: #FFF;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
    top: auto;
    bottom: 30px;
    left: 0;
    padding: 0 10px;
    line-height: 26px;
    font-size: 12px;
    text-transform: uppercase;
    font-family: "Roboto";
}

.team-rounded .team-image span {
    display: inline-block;
    position: relative;
    top: auto;
    bottom: 35px;
    z-index: 2;
}

.team-member .team-desc { position: relative; }

.team-desc h4 {
    font-size: 20px;
    line-height: 26px;
    font-weight: 500;
    padding-bottom: 0;
    margin-bottom: 15px;
    border-bottom: 1px dotted #DDD;
}

.team-desc h4 span {
    display: block;
    font-size: 14px;
    line-height: 22px;
    font-weight: normal;
    color: #AAA;
    margin-top: 2px;
    padding-bottom: 15px;
}

.team-desc p { margin-bottom: 0; }

.team-social {
    position: absolute;
    top: 4px;
    left: auto;
    right: 0;
}

.team-social a {
    float: left;
    margin-left: 10px;
}

.team-social a:first-child { margin-left: 0; }

.team-social a,
.team-social img,
.team-social i {
    display: block;
    width: 16px;
    height: 16px;
    text-align: center;
    line-height: 1;
}

.team-social i {
    position: relative;
    color: #666;
    font-size: 16px;
}

.team-social i:hover { color: #888; }

.team-skills {
    margin: 15px 0 0;
    padding: 7px 0 2px;
    border-top: 1px dotted #DDD;
    border-bottom: 1px dotted #DDD;
}

.team-skills li {
    display: inline-block;
    margin: 0 15px 5px 0;
    line-height: 22px;
    font-size: 12px;
    text-transform: uppercase;
    font-family: "Roboto";
}

.team-skills li i {
    position: relative;
    font-size: 12px;
    color: #444;
    margin-right: 2px;
}


/* ----------------------------------------------------------------
    Pricing Boxes
-----------------------------------------------------------------*/


.pricing {
  	display: block;
  	position: relative;
    margin-bottom: 50px;
    padding-top: 30px;
}

.pricing .pricing-wrap {
	float: left;
	width: 25%;
	position: relative;
}

.pricing3 .pricing-wrap { width: 33.33%; }

.pricing5 .pricing-wrap { width: 20%; }

.pricing .pricing-wrap.best-price { margin-left: -1px; }

.pricing-wrap .pricing-inner {
	position: relative;
	border: 1px solid #EEE;
	border-left: none;
	text-align: center;
}

.pricing-wrap:first-child { margin-left: 1px; }

.pricing-wrap:first-child .pricing-inner { border-left: 1px solid #EEE; }

.best-price .pricing-inner {
    margin: -30px 0 0;
    border-left: 1px solid #EEE;
    box-shadow: 0 0 20px rgba(0,0,0,0.1);
}

.pricing-inner .pricing-title {
    position: relative;
	padding: 20px 0;
    background-color: #F9F9F9;
    border-bottom: 1px solid #EEE;
    text-shadow: 1px 1px 1px #FFF;
}

.pricing-title h4 {
	font-size: 22px;
	line-height: 24px;
    font-weight: 200;
    padding-bottom: 0;
	color: #444;
}

.best-price .pricing-title {
    padding: 25px 0;
    margin: -1px -1px 0;
    border-bottom: 1px solid #EEE;
    background-color: #FF8300;
    text-shadow: 1px 1px 1px rgba(0,0,0,0.1);
}

.best-price .pricing-title h4 {
    font-size: 24px;
    line-height: 28px;
    color: #FFF;
}


.pricing-inner .pricing-price {
	padding: 20px 0;
	font-size: 36px;
	line-height: 40px;
    font-family: 'Roboto', sans-serif;
    color: #444;
    border-bottom: 1px solid #EEE;
}

.best-price .pricing-price {
    color: #FF8300;
    font-weight: 200;
    padding: 25px 0;
    font-size: 44px;
    line-height: 48px;
}

.pricing-price .price-sub {
	display: inline-block;
	position: relative;
	font-size: 16px;
	vertical-align: top;
	top: -7px;
	margin-left: 2px;
}

.pricing-price .price-tenure {
    display: block;
	font-size: 13px;
    line-height: 20px;
    font-weight: normal;
    font-family: "Roboto", sans-serif;
    color: #AAA;
}

.pricing-inner .pricing-features {
	padding: 10px 15px;
    text-shadow: 1px 1px 1px #FFF;
}

.pricing-features ul { margin: 0; }

.pricing-features li {
    position: relative;
    font-size: 13px;
	padding: 7px 0;
    font-family: 'Roboto', sans-serif;
}

.best-price .pricing-features li {
    font-size: 14px;
    padding: 8px 0;
}

.pricing-features li span {
    font-weight: 200;
    color: #333;
}

.pricing-features li:first-child { border-top: 0; }

.pricing-action {
    border-top: 1px solid #EEE;
    padding: 20px 0;
}

.best-price .pricing-action { padding: 25px 0; }

.pricing-action a { margin: 0 !important; }


/* ----------------------------------------------------------------
    Contact Info
-----------------------------------------------------------------*/


.contact-info {
    font-size: 28px;
    line-height: 1.4;
    color: #FF8300;
    border-right: 1px solid #EEE;
}

.contact-info span {
    display: block;
    color: #333;
    font-size: 16px;
    text-transform: uppercase;
    margin-bottom: 5px;
}


/* ----------------------------------------------------------------
    Go To Top
-----------------------------------------------------------------*/


#gotoTop {
    display: none;
    z-index: 999;
    position: fixed;
    width: 40px;
    height: 40px;
    border: 3px solid #444;
    font-size: 12px;
    line-height: 36px;
    text-align: center;
    color: #444;
    top: auto;
    left: auto;
    right: 30px;
    bottom: 30px;
    cursor: pointer;
    border-radius: 23px;
    -moz-border-radius: 23px;
    -webkit-border-radius: 23px;
    transition: color .2s linear, border-color .2s linear;
    -moz-transition: color .2s linear, border-color .2s linear;
    -webkit-transition: color .2s linear, border-color .2s linear;
    -ms-transition: color .2s linear, border-color .2s linear;
    -o-transition: color .2s linear, border-color .2s linear;
}

#gotoTop:hover {
    border-color: #FF8300;
    color: #FF8300;
}


/* ----------------------------------------------------------------
    Footer
-----------------------------------------------------------------*/


#footer-social {
    position: relative;
    margin: 0;
    text-align: center;
}

#footer-social li {
    display: inline-block;
    margin: 0 8px;
    width: 48px;
    height: 48px;
}

#footer-social li a {
    display: block;
    font-size: 24px;
    line-height: 44px;
    color: #444;
    width: 44px;
    height: 44px;
    border: 2px solid #444;
    -webkit-border-radius: 24px;
     -moz-border-radius: 24px;
     -ms-border-radius: 24px;
     -o-border-radius: 24px;
     border-radius: 24px;
    transition: color 0.2s linear, border-color 0.2s linear;
    -ms-transition: color 0.2s linear, border-color 0.2s linear;
    -o-transition: color 0.2s linear, border-color 0.2s linear;
    -moz-transition: color 0.2s linear, border-color 0.2s linear;
    -webkit-transition: color 0.2s linear, border-color 0.2s linear;
}


#footer-social li a:hover {
    color: #FF8300;
    border-color: #FF8300;
}


#copyrights { text-align: center; }


#copyrights p {
    font-size: 15px;
    text-transform: uppercase;
    color: #BBB;
}


/* MOVING BG -  TESTIMONIALS */       
.bganimate {
  -webkit-animation:BgAnimated 30s infinite linear;
     -moz-animation:BgAnimated 30s infinite linear;
      -ms-animation:BgAnimated 30s infinite linear;
       -o-animation:BgAnimated 30s infinite linear;
          animation:BgAnimated 30s infinite linear;  
          }
 @-webkit-keyframes BgAnimated {
  from  {background-position:0 0;}
  to    {background-position:0 400px;}
  }
 @-moz-keyframes BgAnimated {
  from  {background-position:0 0;}
  to    {background-position:0 400px;}
  }
 @-ms-keyframes BgAnimated {
  from  {background-position:0 0;}
  to    {background-position:0 400px;}
  }
 @-o-keyframes BgAnimated {
  from  {background-position:0 0;}
  to    {background-position:0 400px;}
  }
 @keyframes BgAnimated {
  from  {background-position:0 0;}
  to    {background-position:0 400px;}
  }




/* ----------------------------------------------------------------
    Tipsy
-----------------------------------------------------------------*/


.tipsy { font-size: 12px; position: absolute; padding: 5px; z-index: 1000000; opacity: 0.8; }
.tipsy-inner { background-color: #000; color: #FFF; max-width: 300px; padding: 5px 8px 4px 8px; text-align: center; }

/* Rounded corners */
.tipsy-inner { border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }

/* Uncomment for shadow */
/*.tipsy-inner { box-shadow: 0 0 5px #000000; -webkit-box-shadow: 0 0 5px #000000; -moz-box-shadow: 0 0 5px #000000; }*/

.tipsy-arrow { position: absolute; width: 0; height: 0; line-height: 0; border: 5px dashed #000; }

/* Rules to colour arrows */
.tipsy-arrow-n { border-bottom-color: #000; }
.tipsy-arrow-s { border-top-color: #000; }
.tipsy-arrow-e { border-left-color: #000; }
.tipsy-arrow-w { border-right-color: #000; }

.tipsy-n .tipsy-arrow { top: 0px; left: 50%; margin-left: -5px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent; }
.tipsy-nw .tipsy-arrow { top: 0; left: 10px; border-bottom-style: solid; border-top: none; border-left-color: transparent; border-right-color: transparent;}
.tipsy-ne .tipsy-arrow { top: 0; right: 10px; border-bottom-style: solid; border-top: none;  border-left-color: transparent; border-right-color: transparent;}
.tipsy-s .tipsy-arrow { bottom: 0; left: 50%; margin-left: -5px; border-top-style: solid; border-bottom: none;  border-left-color: transparent; border-right-color: transparent; }
.tipsy-sw .tipsy-arrow { bottom: 0; left: 10px; border-top-style: solid; border-bottom: none;  border-left-color: transparent; border-right-color: transparent; }
.tipsy-se .tipsy-arrow { bottom: 0; right: 10px; border-top-style: solid; border-bottom: none; border-left-color: transparent; border-right-color: transparent; }
.tipsy-e .tipsy-arrow { right: 0; top: 50%; margin-top: -5px; border-left-style: solid; border-right: none; border-top-color: transparent; border-bottom-color: transparent; }
.tipsy-w .tipsy-arrow { left: 0; top: 50%; margin-top: -5px; border-right-style: solid; border-left: none; border-top-color: transparent; border-bottom-color: transparent; }


/* padding-bottom and top for image */
.mfp-no-margins img.mfp-img {
    padding: 0;
}
/* position of shadow behind the image */
.mfp-no-margins .mfp-figure:after {
    top: 0;
    bottom: 0;
}
/* padding for main container */
.mfp-no-margins .mfp-container {
    padding: 0;
}


/* 

for zoom animation 
uncomment this part if you haven't added this code anywhere else

*/

.mfp-with-zoom .mfp-container,
.mfp-with-zoom.mfp-bg {
    opacity: 0;
    -webkit-backface-visibility: hidden;
    -webkit-transition: all 0.3s ease-out; 
    -moz-transition: all 0.3s ease-out; 
    -o-transition: all 0.3s ease-out; 
    transition: all 0.3s ease-out;
}

.mfp-with-zoom.mfp-ready .mfp-container {
    opacity: 1;
}
.mfp-with-zoom.mfp-ready.mfp-bg {
    opacity: 0.8;
}

.mfp-with-zoom.mfp-removing .mfp-container, 
.mfp-with-zoom.mfp-removing.mfp-bg {
    opacity: 0;
}


.mfp-fade.mfp-bg {
    opacity: 0;
    -webkit-transition: all 0.15s ease-out; 
    -moz-transition: all 0.15s ease-out; 
    transition: all 0.15s ease-out;
}
.mfp-fade.mfp-bg.mfp-ready {
    opacity: 0.8;
}
.mfp-fade.mfp-bg.mfp-removing {
    opacity: 0;
}

.mfp-fade.mfp-wrap .mfp-content {
    opacity: 0;
    -webkit-transition: all 0.15s ease-out; 
    -moz-transition: all 0.15s ease-out; 
    transition: all 0.15s ease-out;
}
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
    opacity: 1;
}
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
    opacity: 0;
}