/*===========================================================================

    CONTENTS:

    1. CSS RESET
    2. PAGE CONTENT BACKGROUNDS (PARALLAX BACKGROUNDS)
    3. TYPOGRAPHY
    4. HEADER
        4.1. Global styling
        4.2. Main navigation
        4.3. Search
        4.4. Header style 3
        4.5. Header style 4
        4.6. Header style 5
    5. PAGE TITLES
        5.1. Page title 2
        5.2. Page title 3
    6. ELEMENTS
        6.1. Accordion
        6.2. Blockquote
        6.3. Buttons
        6.4. Client carousel
        6.5. Development process boxes
        6.6. Dropcaps
        6.7. Heading centered
        6.8. Heading with borders
        6.9. Highlighted text
        6.10. History section
        6.11. Icons list
        6.12. Information boxes
        6.13. Notes
        6.14. Portfolio carousel
        6.15. Pricing tables
        6.16. Services boxes
        6.17. Services overview list
        6.18. Services vertical tabs
        6.19. Skills circular style
        6.20. Skills rectangular style
        6.21. Stats counter
        6.22. Testimonials
        6.23. Tabs horizontal
        6.24. Tabs vertical
   7. PAGE SPECIFIC STYLES
        7.1. About pages
        7.2. Portfolio
        7.3. Blog
        7.4. Contact page
   8. WIDGETS
   9. FOOTER
        

============================================================================= */

/* ==========================================================================
    1. CSS RESET
============================================================================= */
@import url(https://fonts.googleapis.com/css?family=Pacifico);

a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, meter, nav, object, ol, output, p, pre, progress, q, rp, rt, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video, xmp {
	border: 0;
	margin: 0;
	padding: 0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
b, strong {
	font-weight: bold;
}
img {
	color: transparent;
	font-size: 0;
	vertical-align: middle;
	-ms-interpolation-mode: bicubic;
	max-width: 100%;
}
ol, ul {
	list-style: none;
}
li {
	display: list-item;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
th, td, caption {
	font-weight: normal;
	vertical-align: top;
	text-align: left;
}
q {
	quotes: none;
}
q:before, q:after {
	content: '';
	content: none;
}
sub, sup, small {
	font-size: 75%;
}
sub, sup {
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sub {
	bottom: -0.25em;
}
sup {
	top: -0.5em;
}
svg {
	overflow: hidden;
}
a {
	list-style: none;
	text-decoration: none;
}
a:active {
	outline: none;
}
a:focus {
	outline: none;
}
:focus {
	outline: 0;
}
.clearfix {
	clear: both;
}
body {
	font-family: 'Raleway', sans-serif;
	font-size: 13px;
	line-height: 1.428571429;
	color: #fff;

}
.add-margin {
	display: block;
	margin-bottom: 30px !important;
	float: left;
}
.no-bottom-margin {
	margin-bottom: -80px;
}

/* ==========================================================================
    3. TYPOGRAPHY
============================================================================= */
p, a {
	color: #ccc;
	font-family: 'Slabo 27px', serif;
	line-height: 25px;
}
a.read-more {
	float: left;
	font-family: 'Raleway', sans-serif;
	position: relative;
	font-size: 14px!important;
	padding-top: 0px;
	color: #3e97e9!important;
	font-weight: 700;
}
.comment_box {
	float: right!important;
	margin-top: 10px;
	padding-right: 0px!important;
}
a.read-more span {
	padding-left: 5px;
}
.blog-publish-date {
	position: absolute;
	top: 15px;
	left: 15px;
	background-color: rgba(40,41,46,0.7);
	color: #ffffff;
	font-size: 13px;
	font-style: italic;
	padding: 5px 10px;
	font-weight: 700;
}
.blog-publish-date {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
	-webkit-transition: all .5s;
	-moz-transition: all .5s;
	-ms-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
}
a {
	-webkit-transition: all 0.2s ease 0s;
	-moz-transition: all 0.2s ease 0s;
	-o-transition: all 0.2s ease 0s;
	-ms-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
}
.underlined {
	text-decoration: underline;
}
h1, h2, h3, h4, h5, h6 {
	font-weight: 400;
	color: #39414b;
	margin-bottom: 30px;
}
h1 {
	font: 38px 'Montserrat', sans-serif;
	font-family: 'Slabo 27px', serif;
	line-height: 1.3;
}
h2 {
	font: 34px 'Montserrat', sans-serif;
	font-family: 'Slabo 27px', serif;
	line-height: 1.3;
}
h3 {
	font: 28px 'Montserrat', sans-serif;
	font-family: 'Slabo 27px', serif;
	line-height: 1.3;
}
h4 {
	font: 23px 'Montserrat', sans-serif;
	line-height: 1.3;
}
h5 {
	font: 19px 'Montserrat', sans-serif;
	line-height: 1.3;
}
h6 {
	font: 17px 'Montserrat', sans-serif;
	line-height: 1.3;
}
img.float-left {
	float: left;
	margin: 12px 12px 12px 0;
}
img.float-right {
	float: right;
	margin: 12px 0px 12px 12px;
}
img + p, p+img {
	display: block;
	margin-top: 15px;
}
.bottom-fixed {
	margin-bottom: -80px;
	position: absolute;
	bottom: 0;
}
span.strong, b {
	font-weight: 600;
}
.text-red {
	color: #ce292d;
}
p.center-side {
	text-align:center;
	display: block;
	font: 18px 'Montserrat', sans-serif;
	line-height: 25px;
}
p.center-side img {
	padding: 5px;
	border: #ccc 1px solid;
}
span.red {
	color: #fd0207;
}
span.red-quote {
	color: #fd0207;
	font-size: 20px;
	margin-bottom: -15px!important;
	display: block;
	font-family: 'Pacifico', cursive;
}
span.blue {
	color: #0071c1;
}
span.blue-small{
	color: #0071c1;
	font-size: 15px;
}
/* ========================================================================== 
    4. HEADER 
============================================================================= */

/* 4.1. GLOBAL STYLING 
----------------------------------------------------------------------------- */
#header-wrapper {
	width: 100%;
	margin: 0 auto;
	z-index: 1000;
	position: relative;
	background: #fff;
	-webkit-transition: height 0.2s ease 0s;
	-moz-transition: height 0.2s ease 0s;
	-ms-transition: height 0.2s ease 0s;
	-o-transition: height 0.2s ease 0s;
	transition: height 0.2s ease 0s;
	background: #000 url(../images/headerbar.jpg) top center;
}
#header-wrapper.static {
	position: fixed;
	top: 0;
	z-index: 9999;
}

.social-links.presentation li a {
	float: left;
	width: 45px;
	height: 45px;
	margin-right: 2px;
	margin-bottom: 2px;
	font-size: 18px;
}
#header {
	width: 1170px;
	margin: 0 auto;
	
}
#logo {
	float: left;
	/*width: 200px;*/
	display: block;
	position: relative;
}
#menu-menu1 li {
	list-style: none!important;
}
/* 4.2. MAIN NAVIGATION 
----------------------------------------------------------------------------- */
#nav-container {
	width: 65%;
	height: 100px;
	margin-left: 20px;
	z-index: 1000;
	position: relative;
	float: right;
}
#nav {
	height: 100%;
	list-style: none;
	max-width: 100%;
	float: right;
}
#nav > ul {
	display: block !important;
}
#nav li {
	float: left;
	position: relative;
	cursor: pointer;
}
#nav > ul > li > a {
	/*font: 13px 'Raleway', sans-serif;*/
	font-size:15px;
	font-family: 'Arvo', serif;
	/*padding: 26px 17px;*/
	padding: 0 17px;
	font-weight: 600;
	color: #fff;
	line-height: 97px;
	/*padding-top: 0;
	padding-bottom: 0;*/
}
#nav > ul > li.current-menu-item > a, #nav > ul > li:hover > a {
	background: #930606;
	color: #fff!important;
	border-bottom: 3px solid #fff;
}
#nav > ul > li > a {
	text-transform: uppercase;
}
#nav > ul > li {
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}
#nav li a {
	float: none;
	display: block;
	/*font: 13px 'Raleway', sans-serif;*/
	font-size:15px;
	font-family: 'Arvo', serif;
	color: #fff;
}
#nav > ul > li.no-sub:hover {
	border-bottom: 4px solid #eee;
}
/* MAIN NAVIGATION SECOND LEVEL
----------------------------------------------------------------------------- */
#nav li ul {
	display: none;
	position: absolute;
	margin: 0;
	top: 100%;
	left: 0;
	z-index: 100;
	width: 200px;
}
#nav li ul li {
	background: #333;
	border-right: 0px solid #eee;
	border-bottom: 1px solid #eee;
	-webkit-transition: all 0.2s ease 0s;
	-moz-transition: all 0.2s ease 0s;
	-o-transition: all 0.2s ease 0s;
	-ms-transition: all 0.2s ease 0s;
	transition: all 0.2s ease 0s;
	
}
#nav li ul li:first-child {
	border-top: 0px solid #eee;
}
#nav li ul li:last-child {
	border-bottom: 0px solid #eee;
}
#nav li ul li:hover {
	background: #fff;
}
#nav li ul li a {
	text-transform: none !important;
	font: 13px 'Droid Sans', sans-serif;
	line-height: 15px;
	color: #fff !important;
	padding: 10px 15px !important;
	transition-property: text-indent;
	transition-duration: 0.2s;
	-webkit-transition-property: text-indent;
	-webkit-transition-duration: 0.2s;
	-moz-transition-property: text-indent;
	-moz-transition-duration: 0.2s;
	-o-transition-property: text-indent;
	-o-transition-duration: 0.2s;
}
#nav li ul li:hover > a {
	text-indent: 3px;
	background:#999!important;
	color: #fff!important;
}
#nav li ul li, #nav li ul li a {
	float: none;
}
#nav li.current-menu-item ul li.current-menu-item {
	background: #f6f6f6;
}
/* MAIN NAVIGATION THIRD LEVEL
----------------------------------------------------------------------------- */
#nav li ul li ul {
	display: none;
}
#nav li ul li:hover ul {
	left: 100%;
	top: -2px;
	padding-top: 0 !important;
	padding-left: 5px;
	position: absolute;
	display: block !important;
}
/* 4.3. SEARCH 
------------------------------------------------------------------------------*/
#search {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	position: relative;
	cursor: pointer;
	margin-left: 30px;
	top: 20px;
	float: right;
	z-index: 1005;
}
.search-submit {
	background: url('../img/search.png') no-repeat;
	width: 40px;
	height: 40px;
	border: none;
	text-indent: -9999px;
	position: absolute;
	cursor: pointer;
}
#m_search {
	background: #fff;
	border: 1px solid #ddd;
	padding: 8px 10px;
	position: absolute;
	top: 105%;
	width: 135px;
	margin-left: -112px;
	font: italic 11px 'Raleway', sans-serif;
	color: #777;
	display: none;
}
/* ========================================================================== 
    4.4. HEADER STYLE 3 (grey colored top bar)
============================================================================= */
.header-style-3 #top-bar-wrapper {
	background: #333;
	border-bottom: none;
}
.header-style-3 #top-bar .contact-info li, .header-style-3 #top-bar .contact-info li a {
	color: #bbb;
}
.header-style-3 #top-bar .social-links li {
	background: #444;
	border-left: 1px solid #555;
	border-right: 1px solid #333;
}
.header-style-3 #top-bar .social-links li:last-child {
	border-right: none;
}
/* ========================================================================== 
    4.5. HEADER STYLE 4 
============================================================================= */
.header-style-4 .social-links {
	float: right;
	margin-left: 30px;
	max-width: 1030px;
	margin-top: 25px;
}
.header-style-4 .social-links li {
	float: left;
	margin-left: 10px;
	background-color: #eee;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}
.header-style-4 .social-links li:hover a {
	color: #fff !important;
}
.header-style-4 .social-links li a {
	width: 30px;
	font-size: 10px;
	height: 30px;
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	-webkit-transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}
.header-style-4 #nav-container {
	width: 100%;
	margin-left: 0;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
}
.header-style-4 #nav-container #nav {
	max-width: 1100px;
	float: left;
}
/* ========================================================================== 
    4.6. HEADER STYLE 5
============================================================================= */
.header-style-5 #logo {
	width: 100%;
	max-width: 100%;
	margin: 20px auto;
	float: none;
}
.header-style-5 #logo a {
	display: table;
	margin: 0 auto;
}
.header-style-5 #nav-container {
	width: 100%;
	margin-left: 0;
	border-top: 1px solid #eee;
	border-bottom: 1px solid #eee;
}
.header-style-5 #nav-container #nav {
	max-width: 1100px;
	float: left;
}