/*

	Style.css

	01. Basics
	02. Top bar
	03. Home
	04. Intro
	05. Work
	06. Call to action
	07. Services
	08. Process
	09. About
	10. Contact
	11. Footer
	12. 404 Page
	13. Responsive settings

*/


/* ==================== 01. Basics ==================== */

@font-face { font-family: 'BodoniLT'; src: url('../fonts/BodoniLT-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/BodoniLT-Bold.woff') format('woff'), url('../fonts/BodoniLT-Bold.ttf') format('truetype'), url('../fonts/BodoniLT-Bold.svg#BodoniLT-Bold') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'ArcherPro-Book'; src: url('../fonts/ArcherPro-Book.eot?#iefix') format('embedded-opentype'), url('../fonts/ArcherPro-Book.otf') format('opentype'), url('../fonts/ArcherPro-Book.woff') format('woff'), url('../fonts/ArcherPro-Book.ttf') format('truetype'), url('../fonts/ArcherPro-Book.svg#ArcherPro-Book') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'BodoniLT'; src: url('../fonts/BauerBodoniStd-Roman.eot?#iefix') format('embedded-opentype'), url('../fonts/BauerBodoniStd-Roman.otf') format('opentype'), url('../fonts/BauerBodoniStd-Roman.woff') format('woff'), url('../fonts/BauerBodoniStd-Roman.ttf') format('truetype'), url('../fonts/BauerBodoniStd-Roman.svg#BauerBodoniStd-Roman') format('svg'); font-weight: 100; font-style: normal; }
@font-face { font-family: 'BauerBodoniStd-Bold'; src: url('../fonts/BauerBodoniStd-Bold.eot?#iefix') format('embedded-opentype'), url('../fonts/BauerBodoniStd-Bold.otf') format('opentype'),  url('../fonts/BauerBodoniStd-Bold.woff') format('woff'), url('../fonts/BauerBodoniStd-Bold.ttf') format('truetype'), url('../fonts/BauerBodoniStd-Bold.svg#BauerBodoniStd-Bold') format('svg'); font-weight: 900; font-style: normal; }
body { font-family: 'ArcherPro-Book'; font-size: 16px; font-weight: 400; line-height: 25px; color: #404040; height: auto!important; background-color: #1c140e; }
p, ul { margin-bottom: 15px; }
p.author { font-style: normal; margin-bottom: 0; }
section { z-index: 5 }
/* Headings */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: 'ArcherPro-Book'; font-style: normal; font-weight: 100; text-transform: uppercase; color: #111111; }
h1, .h1 { font-size: 34px; line-height: 1.5em; margin-bottom: 25px; }
h2, .h2 { font-size: 28px; line-height: 1.5em; margin-bottom: 25px; }
h3, .h3 { font-size: 16px; line-height: 25px; margin-bottom: 0; }
h4, .h4 { font-size: 18px; line-height: 25px; margin-bottom: 0; }
h5, .h5 { font-size: 17px; line-height: 25px; margin-bottom: 0; }
h6, .h6 { font-size: 17px; line-height: 20px; margin-bottom: 0; }
h6.h2 { font-size: 25px; line-height: 1.4; margin-bottom: 25px; color: #371d03; }
/* Responsive headings */
.bigtext h1, h1.bigtext, .bigtext h2, h2.bigtext, .bigtext h3, h3.bigtext, .bigtext h4, h4.bigtext, .bigtext h5, h5.bigtext, .bigtext h6, h6.bigtext { margin-bottom: 10px; }
.bigtext h1, h1.bigtext { font-size: 90px; line-height: 1em; }
.bigtext h2, h2.bigtext { font-size: 75px; line-height: 1em; }
.bigtext h3, h3.bigtext { font-size: 60px; line-height: 1em; }
.bigtext h4, h4.bigtext { font-size: 48px; line-height: 1.25em; }
.bigtext h5, h5.bigtext { font-size: 36px; line-height: 1.25em; }
.bigtext h6, h6.bigtext { font-size: 24px; line-height: 1.5em; }
.logo-mobile { display: none; }
.twelve.col.text-left .bg-padding { padding: 150px 25px 80px; }
#inner .twelve.col.text-left .bg-padding { padding: 80px 25px; }
#gallery .bx-wrapper .bx-pager, #gallery .bx-wrapper .bx-controls-auto { position: absolute; margin: 0; }
.bx-wrapper .bx-pager.bx-default-pager a { width: 9px; height: 9px; }

.beginner { width:100%; height:1px; background-color:#a26f02; max-width:970px; padding:0; margin:70px auto 65px auto; }
.clear{ clear:both;}
@media only screen and (max-width: 767px) {
/* Responsive headings */
.bigtext h1, h1.bigtext { font-size: 60px; }
.bigtext h2, h2.bigtext { font-size: 48px; }
.bigtext h3, h3.bigtext { font-size: 36px; }
.bigtext h4, h4.bigtext { font-size: 30px; }
.bigtext h5, h5.bigtext { font-size: 24px; }
.bigtext h6, h6.bigtext { font-size: 18px; }
}

@media only screen and (max-width: 479px) {
/* Responsive headings */
.bigtext h1, h1.bigtext { font-size: 36px; }
.bigtext h2, h2.bigtext { font-size: 30px; }
.bigtext h3, h3.bigtext { font-size: 24px; }
.bigtext h4, h4.bigtext { font-size: 18px; }
.bigtext h5, h5.bigtext { font-size: 16px; }
.bigtext h6, h6.bigtext { font-size: 14px; }
}
/* Links */
a { color: inherit; text-decoration: none; }
a:hover { color: #111111; }
.follower #gallery { margin: 0 -15px; }
.follower #gallery .large { height: 600px; }
.gallery-link a { cursor: pointer; }
.testimonials .bx-wrapper .bx-pager, .testimonials .bx-wrapper .bx-controls-auto { bottom: 0; }
/* Smooth hover effects */
a, a i, button, input[type="submit"] { -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
a:hover, a i:hover, button:hover, input[type="submit"]:hover { -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
/* Cursor styling for icons */
i { cursor: default; }
a i { cursor: pointer; }
/* Lists */
.ol { list-style-type: decimal-leading-zero; list-style-position: outside; margin-left: 2em; margin-bottom: 25px; }
.ol ol, .ul ol { list-style-type: decimal-leading-zero; list-style-position: outside; }
.ul { list-style-type: disc; list-style-position: outside; margin-left: 1em; margin-bottom: 25px; }
.ol ul, .ul ul { list-style-type: disc; list-style-position: outside; }
.ol ol, .ol ul, .ul ol, .ul ul { margin-left: 2em; }
/* Typographic styles */
.italic, em { font-style: italic; }
.bold, b, strong { font-weight: 600; }
.thin { font-weight: 300; }
.x-thin { font-weight: 100; }
.serif { font-family: 'BodoniLT'; font-style: italic; letter-spacing: 0; text-transform: none; font-weight: 100; }
.uber { font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif; font-style: normal; font-weight: 700; text-transform: uppercase; }
/* Text colors */
.text-color { color: #ff4800; }
.text-light { color: #bbbbbb; }
.text-dark { color: #111111; }
.text-white { color: #ffffff; }
.page-pic { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; max-height: 969px; }
/* Dropcap */
.dropcap { float: left; color: #111111; font-size: 50px; line-height: 50px; padding-right: 8px; padding-left: 3px; }
/* Quotes */
blockquote { font-family: Georgia, serif; font-style: italic; font-weight: 400; font-size: 1.25em; padding: 25px; background: #fafafa; border-left: 5px solid #eeeeee; margin-bottom: 25px; }
blockquote small { display: block; font-family: 'ArcherPro-Book'; font-size: 0.75em; font-weight: 400; font-style: normal; }
blockquote small:before { content: '\2014 \00A0'; }
q { quotes: "\"" "\"" """ """; }
q:before { content: '\201C'; }
q:after { content: '\201D'; }
.row .five p:last-child { margin: 0; }
.bx-wrapper .bx-pager { margin-bottom: 0; }
/* Buttons */
/* Buttons styling */
.btn, button, input[type="submit"] { display: inline-block; font-size: 18px; font-weight: 900; text-transform: uppercase; line-height: 25px; padding: 12px 25px; color: #ffffff; background: #111111; text-decoration: none; white-space: nowrap; }
a.btn:hover, button:hover, input[type="submit"]:hover, a .icon:hover { color: #ffffff; background: #ff4800; text-decoration: none; }
button:hover, input[type="submit"]:hover, a i:hover { cursor: pointer; }
/* Icon inside a button */
.btn > i { font-size: 14px; margin-right: 0.5em; }
/* Button outline style */
.btn.outline { color: #371d03; background: none; border: 2px solid #371d03; padding: 10px 45px; }
a.btn.outline:hover, button.outline:hover, input[type="submit"].outline:hover { color: #ffffff; background: #371d03; border: 2px solid #371d03; border: 2px solid rgba(55,29,3,1); }
/* Button colors */
.btn.color { background: #ff4800; }
.btn.outline.color { color: #ff4800; /*background: none;*/ border: 2px solid #ff4800; }
.btn.light { color: #ffffff; background: #cccccc; background: rgba(255,255,255,0.3); }
.btn.outline.light { color: #ffffff; /*background: none;*/ border: 2px solid #cccccc; border: 2px solid rgba(255,255,255,0.5); }
.btn.dark { color: #111111; background: #aaaaaa; background: rgba(17,17,17,0.3); }
.btn.outline.dark { color: #111111; /*background: none;*/ border: 2px solid #aaaaaa; border: 2px solid rgba(17,17,17,0.5); }
.btn.white { color: #111111; background: #ffffff; }
.btn.outline.white { color: #ffffff; background: none; border: 2px solid #ffffff; }
/* Buttons reset */
button, input[type="submit"] { -webkit-appearance: none; }
 button::-moz-focus-inner, input::-moz-focus-inner {
 padding: 0;
}
input[type="submit"] { border: 0; width: auto; }

/* Fixing the broken lineheight model in FF */
input::-moz-focus-inner {
 border: 0;
 padding: 0;
 margin-top: 5px;
 margin-bottom: 5px;
}
 @-moz-document url-prefix() {
 input[type="submit"] {
 line-height: 15px;
}
}
/* Headers */
.header { position: relative; display: block; width: 100%; min-height: 100%; height: 100vh; max-height: 969px; }
.contact .bg-white { background-color: #f4f4f4; }
.contact h5 { font-weight: 900; font-size: 19px }

/*.header.large { height: 745px; }
.header.medium { height: 480px; }
.header.small { height: 320px; }*/

@media only screen and (max-width: 768px) {
.header.large { height: 320px; }
.header.medium { height: 320px; }
ul.menu li:hover > a { background: none!important }
ul.menu li > ul li { margin: 0 0 0 20px }
ul.menu li > ul li.active > a { background: none!important }
#about { padding-top: 60px }
}
@media only screen and (max-width: 640px) {
.header { height: 420px; }
}
/* Video */
#video h2 { font-family: 'BodoniLT'; font-weight: normal; font-size: 39px; line-height: 1.3; color: #371d03; margin: 0 }
#video h2:before { background-image: url("/templates/home/images/h2.png"); background-repeat: no-repeat; background-position: left center; content: ""; display: block; width: 100px; height: 79px; margin-bottom: 10px; }
#video .bg-padding { padding: 80px 20px; }
/* Header with centered content */
.header-inner { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 100%; max-width: 500px; min-width: 300px; text-align: center; z-index: 60; margin-top: -80px; }
/* Background image */
.bg-img { background-repeat: no-repeat; background-size: cover; background-position: top center; }
.bg-img:before { content: ""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 20%; background: -moz-linear-gradient(top, rgba(28,20,14,1) 0%, rgba(0,0,0,0) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(28,20,14,1)), color-stop(100%, rgba(0,0,0,0))); background: -webkit-linear-gradient(top, rgba(28,20,14,1) 0%, rgba(0,0,0,0) 100%); background: -o-linear-gradient(top, rgba(28,20,14,1) 0%, rgba(0,0,0,0) 100%); background: -ms-linear-gradient(top, rgba(28,20,14,1) 0%, rgba(0,0,0,0) 100%); background: linear-gradient(to bottom, rgba(28,20,14,1) 0%, rgba(0,0,0,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c140e', endColorstr='#00000000', GradientType=0 );
}
.bg-img:after { content: ""; display: block; position: absolute; left: 0; bottom: 0; width: 100%; height: 20%; background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(28,20,14,1) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0,0,0,0)), color-stop(100%, rgba(28,20,14,1))); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(28,20,14,1) 100%); background: -o-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(28,20,14,1) 100%); background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(28,20,14,1) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(28,20,14,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#1c140e', GradientType=0 );
}
.home-bgc-slider li:after { content: ""; display: block; position: absolute; right: 0; top: 0; width: 20%; height: 100%; background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(28,20,14,1) 100%); background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(0,0,0,0)), color-stop(100%, rgba(28,20,14,1))); background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(28,20,14,1) 100%); background: -o-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(28,20,14,1) 100%); background: -ms-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(28,20,14,1) 100%); background: linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(28,20,14,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#1c140e', GradientType=1 );
}
.home-bgc-slider li:before { content: ""; display: block; position: absolute; left: 0; top: 0; width: 20%; height: 100%; background: -moz-linear-gradient(left, rgba(28,20,14,1) 0%, rgba(0,0,0,0) 100%); background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(28,20,14,1)), color-stop(100%, rgba(0,0,0,0))); background: -webkit-linear-gradient(left, rgba(28,20,14,1) 0%, rgba(0,0,0,0) 100%); background: -o-linear-gradient(left, rgba(28,20,14,1) 0%, rgba(0,0,0,0) 100%); background: -ms-linear-gradient(left, rgba(28,20,14,1) 0%, rgba(0,0,0,0) 100%); background: linear-gradient(to right, rgba(28,20,14,1) 0%, rgba(0,0,0,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c140e', endColorstr='#00000000', GradientType=1 );
}
/* Fixed backgrounds only on non-touch devices */
.bg-img.fixed { background-attachment: scroll; }
.bg-img.fixed .overlay { position: static; top: 0; left: 0; width: 100%; padding-top: 250px; padding-bottom: 250px; }
.no-touch .bg-img.fixed { background-attachment: fixed; }
/* Background images */
.background-one { background-image: url('../images/placeholder-1800x1200.png'); }
.background-two { background-image: url('../images/placeholder-1800x1200.png'); }
.background-three { background-image: url('../images/bg-piano.jpg'); }
.background-four { background-image: url('../images/bg-quickquote.jpg'); }
.background-five { background-image: url('../images/placeholder-1800x1200.png'); }
/* Title */
.title { text-align: center; }
.title h1, .title h2 { font-size: 20px; line-height: 25px; margin-bottom: 15px; }
.title hr { display: inline-block; width: 40px; height: 2px; background: #cccccc; margin-bottom: 75px; }
.title.title-light h1, .title.title-light h2 { color: #ffffff; }
.title.title-light hr { background: #555555; }
/* Title on headers */
.header hr { display: inline-block; width: 40px; height: 2px; background: #ffffff; filter: alpha(opacity=50); opacity: 0.5; margin-bottom: 25px; }
/* Underline link */
a.underline { padding-bottom: 1px; border-bottom: 1px dotted #cccccc; }
a.underline:hover { border-bottom: 1px dotted #111111; }
/* Links for dark backgrounds */
a.inverted:hover { color: #ffffff; }
a.inverted.underline { padding-bottom: 1px; border-bottom: 1px dotted #555555; }
a.inverted.underline:hover { border-bottom: 1px dotted #ffffff; }
/* Arrow link */
a.arrow-link { font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif; font-weight: 700; text-transform: uppercase; color: #111111; }
a.arrow-link:before { font-family: 'FontAwesome'; content: '\f054'; color: #aaaaaa; margin-right: 7px; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
a.arrow-link:hover, a.arrow-link:hover:before { color: #ff4800; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
/* Positioning for the owlCarousel controls (oc) */
.oc-left, .oc-right { position: absolute; top: 50%; margin-top: -30px; }
.oc-left { left: 0; margin-left: -60px; }
.oc-right { right: 0; margin-right: -60px; }

@media only screen and (max-width: 1220px) {
.oc-left, .oc-right { top: 100%; margin-top: 20px; }
.oc-left { left: 50%; margin-left: -40px; }
.oc-right { right: 50%; margin-right: -40px; }
}
/* Styling for the owlCarousel icon controls */
.oc-left i, .oc-right i { display: inline-block; width: 60px; height: 60px; line-height: 60px; font-size: 42px; text-align: center; color: #cccccc; }
.oc-left i:hover, .oc-right i:hover { color: #aaaaaa; }

@media only screen and (max-width: 1220px) {
.oc-left i, .oc-right i { width: 40px; height: 40px; line-height: 40px; font-size: 28px; }
}
/* Overlay item that is used for portfolio thumbnails and employee images */
.overlay-item { position: relative; color: #ffffff; line-height: 0; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
.overlay-item a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; z-index: 500; cursor: pointer }
/* The hover effect */
.o-hover { position: absolute; width: 100%; height: 100%; overflow: hidden; color: rgba(255,255,255,0.0); background: rgba(0,0,0,0.0); visibility: visible; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
.overlay-item:hover > .o-hover, .overlay-item a:hover > .o-hover { color: rgba(255,255,255,1); background: rgba(0,0,0,0.5); -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
/* The information inside the hover */
.o-hover span { font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif; font-style: normal; font-size: 13px; font-weight: 700; text-transform: uppercase; text-align: center; line-height: 20px; display: inline-block; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.o-hover em { font-family: 'ArcherPro-Book'; font-style: normal; font-size: 13px; font-weight: 400; letter-spacing: 0; text-transform: none; color: rgba(255,255,255,0); display: inline-block; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
.overlay-item:hover > .o-hover em, .overlay-item a:hover > .o-hover em { color: rgba(255,255,255,1); -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
.o-hover i { font-size: 14px; font-weight: 400; letter-spacing: 0; text-transform: none; color: rgba(255,255,255,0); display: inline-block; width: 30px; height: 30px; line-height: 30px; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
.overlay-item:hover > .o-hover i, .overlay-item a:hover > .o-hover i { color: rgba(255,255,255,1); -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
.overlay-item:hover > .o-hover i:hover, .overlay-item a:hover > .o-hover i:hover { color: #111111; background: #ffffff; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
.o-hover i.fa-2x { font-size: 2em; }
.overlay-item:hover > .o-hover i.fa-2x:hover, .overlay-item a:hover > .o-hover i.fa-2x:hover { color: #ffffff; background: none; }
/* Extra info below images used for portfolio thumbnails and employee images */
.e-info { position: relative; display: block; background: #ffffff; padding: 15px; text-align: center; }
.e-info h3 { font-size: 18px; font-weight: bold; line-height: 20px; margin-bottom: 0; }
.e-info p { color: #000; line-height: 20px; margin-top: 5px; margin-bottom: 0; }
/* ==================== 02. Top bar ==================== */
.top-bar { position: fixed; top: 0; display: block; width: 100%; background: #111111; background: rgba(7,7,7,0.9); z-index: 99; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
/* Typographic logo for the top bar */
.tb-logo { font-size: 13px; margin-left: 20px; }
.tb-large .tb-logo h1 { font-size: 24px; line-height: 25px; margin-top: 11px }
.tb-large .tb-logo img { max-height: 40px; margin: 0 10px 0 0 }
.tb-logo h1 { float: left; text-align: left; font-size: 13px; line-height: 25px; color: #ffffff; margin-top: 15px; margin-bottom: 0; }
.tb-logo h1 a { text-decoration: none; color: #ffffff; }
.tb-logo h1 a:hover { color: #ffffff; }
/* Image logo for the top bar */
.tb-logo img { float: left; text-align: left; width: auto; max-height: 30px; margin: 10px 10px 0 0; }
/* Hiding the the toggle */ 
#toggle, .toggle { display: none; }
/* Hiding and showing the submenu items */
ul.menu ul { display: none; }
ul.menu li:hover > ul { display: block; }
/* Styling for the main menu items */
nav { text-align: left; font-family: 'ArcherPro-Book'; font-size: 16px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; line-height: 25px; display: table; margin: 0 auto; }
ul.menu { position: relative; display: table-cell; list-style: none; }
ul.menu:after { content: ""; clear: both; display: block; }
ul.menu li { display: inline-block; white-space: nowrap; vertical-align: middle; }
/* Hover effect */
ul.menu li > a { display: block; padding: 10px 25px; color: #777777; text-decoration: none; font-family: 'BodoniLT'; font-weight: 100 }
ul.menu li:hover > a { color: #ffffff; }
ul.menu li.active > a { color: rgba(255,255,255,1)!important }
ul.menu li > ul li.active > a { color: rgba(255,255,255,0.7); background: rgba(7,7,7,0.9); }

/* Less padding on smaller screens */
@media only screen and (max-width: 1024px) {
ul.menu li a { padding: 15px 10px; }
}
/* Styling for the sub menu items */
ul.menu ul { position: absolute; top: 100%; background: #111111; background: rgba(7,7,7,0.9); padding: 0; min-width: 150px; }
ul.menu ul li { float: none; position: relative; }
ul.menu ul li a { padding: 10px 20px; color: #777777!important; }
ul.menu ul li a:hover { color: #ffffff!important; }
ul.menu ul ul { position: absolute; top: 0; left: 100%; }

/* Responsive settings for the menu */
@media only screen and (max-width: 768px) {
.top-bar { padding-top: 0; }
/* The toggle */
.toggle { display: block; position: relative; cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; color: #777777; float: right; font-family: 'FontAwesome'; text-align: center; font-size: 14px; width: 50px; height: 50px; line-height: 50px; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
.toggle:hover { color: #ffffff; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
.toggle:after { content: '\f0c9'; }
#toggle:checked ~ nav { display: block; filter: alpha(opacity=100); opacity: 1; }
#toggle:checked + .toggle:after { content: '\f077'; }
/* The menu items */
nav { display: none; filter: alpha(opacity=0); opacity: 0; margin-top: 50px; width: 100%; position: absolute; right: 0; height: auto; text-align: left; background: #111111; background: rgba(7,7,7,0.9); padding-bottom: 10px; padding-left: 30px; }
ul.menu li { display: block; width: 100%; line-height: 30px; margin: 0; }
ul.menu li a { display: block; width: 100%; padding: 0; }
/* Styling for the sub menu items */
ul.menu ul { display: block; position: relative; top: 0; background: none; padding: 0; }
ul.menu ul li a { padding: 0; }
ul.menu ul ul { position: relative; top: 0; left: 0; }
.follower #gallery .large { height: 550px; }
}

@media only screen and (max-width: 480px) {
.tb-logo { margin-left: 5px; }
.toggle { margin-right: -10px; }
nav { padding-left: 15px; }
}
/* Dynamic height of the menu */
.tb-large { padding-top: 25px; padding-bottom: 25px; }
.tb-small { padding-top: 0; padding-bottom: 0; background: #1c140e!important }

@media only screen and (max-width: 768px) {
.tb-large { padding-top: 0; padding-bottom: 0; }
}
/* Transparent top bar */
.top-bar.tb-transp { background: none; background: rgba(7,7,7,0.0); }
.tb-transp ul.menu li a { color: #ffffff; color: rgba(255,255,255,0.7); }
.tb-large ul.menu li.logo { display: none; }
.tb-transp ul.menu li:hover a { color: #ffffff; }
.tb-small.tb-transp { background: -moz-linear-gradient(top, rgba(0,0,0,0.8) 0%, rgba(7,6,5,0) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0,0,0,0.8)), color-stop(100%, rgba(7,6,5,0))); background: -webkit-linear-gradient(top, rgba(0,0,0,0.8) 0%, rgba(7,6,5,0) 100%); background: -o-linear-gradient(top, rgba(0,0,0,0.8) 0%, rgba(7,6,5,0) 100%); background: -ms-linear-gradient(top, rgba(0,0,0,0.8) 0%, rgba(7,6,5,0) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0.8) 0%, rgba(7,6,5,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc000000', endColorstr='#001c140e', GradientType=0 );
}
.follower #top { margin-top: 175px; }
.tb-small ul.menu li.logo, .follower .tb-large ul.menu li.logo { display: inline-block; }
.tb-small ul.menu li.logo a, .follower .tb-large ul.menu li.logo a { display: block; padding: 5px 25px; }
.work .qs-wrap { margin-top: 30px; }
ul.menu li.logo a { width: 180px; }

/* Responsive settings for the transparent top bar */
@media only screen and (max-width: 768px) {
.top-bar.tb-transp { background: #111111; background: rgba(7,7,7,0.9); }
.logo-mobile { display: block; position: absolute; width: 80px; left: 8px; top: 4px; }
.logo-mobile img { width: 100%; }
}
/* ==================== 03. Home ==================== */
.home { z-index: -1; overflow: hidden }
.home .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(7,7,7,0.2); background-image: url('../images/pattern.png'); background-repeat: repeat; z-index: 1 }
.topspace { padding-top: 105px; background: #111111; }

@media only screen and (max-width: 768px) {
.topspace { padding-top: 50px; }
.home .bx-wrapper .bx-controls-direction a { top: 100%; margin-top: -53px; }
}
/* ==================== 04. Introduction ==================== */
.intro { padding-top: 100px; padding-bottom: 100px; }
/* Icon navigation */
.icon-nav { text-align: center; margin-bottom: 25px; }
.icon-nav a { display: inline-block; }
.icon-nav i { display: block; margin: 0 auto 10px; width: 100px; height: 100px; line-height: 100px; text-align: center; font-size: 36px; color: #cccccc; background: none; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; }

@media only screen and (max-width: 768px) {
.icon-nav i { width: 80px; height: 80px; line-height: 80px; font-size: 24px; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; }
}
.icon-nav a:hover > i { color: #ffffff; background: #ff4800; }
.icon-nav b { font-family: 'Raleway', 'Open Sans', Helvetica, Arial, sans-serif; font-style: normal; font-size: 16px; font-weight: 700; text-transform: uppercase; line-height: 20px; color: #111111; display: block; }
.icon-nav em { font-style: normal; font-size: 14px; font-weight: 400; line-height: 20px; color: #aaaaaa; display: block; }
/* ==================== 05. Work ==================== */
.work .relative { background: #ebebeb; padding-top: 80px; padding-bottom: 80px; }
/* Positioning for the arrow controls for the work slider */
.work .oc-left, .work .oc-right { margin-top: -65px; }

@media only screen and (max-width: 1220px) {
.work .oc-left, .work .oc-right { margin-top: 20px; }
}
/* ==================== 06. Call to action ==================== */
.cta { padding-top: 100px; padding-bottom: 100px; }
/* ==================== 07. Services ==================== */
.services { background: #ffffff; padding-top: 100px; padding-bottom: 100px; }
/* Service item */
.service-item { position: relative; display: block; text-align: center; background: #ffffff; padding-bottom: 35px; }
.service-item .subline { font-style: normal; font-size: 13px; font-weight: 400; line-height: 20px; color: #aaaaaa; }
.service-item .serif { color: #aaaaaa; }
.service-item hr { display: inline-block; width: 30px; height: 2px; background: #cccccc; margin-bottom: 20px; }
.service-item ul { margin-bottom: 25px; }
.service-item i { display: inline-block; width: 80px; height: 80px; line-height: 80px; text-align: center; font-size: 48px; color: #cccccc; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
.service-item:hover > i { color: #ff4800; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
.service-item:hover > a.arrow-link:before { color: #ff4800; }
/* Positioning for the arrow controls for the services slider */
.services .oc-left, .services .oc-right { top: 70px; margin-top: 0; }
.text-center.width { max-width:820px; margin:0 auto 30px auto; }
.text-center.width strong { text-transform:uppercase; }

@media only screen and (max-width: 1220px) {
.services .oc-left, .services .oc-right { top: 100%; margin-top: 0; }
}
/* ==================== 08. Process ==================== */
.process { background: #222222; padding-top: 100px; padding-bottom: 100px; }
.bg-white.bg-padding .five.col ul li:before { width: 4px; height: 4px; border-radius: 50%; background-color: #000; content: ""; display: inline-block; margin-right: 10px; position: relative; top: -3px; }
.about ul:not(.quote) li:before { width: 4px; height: 4px; border-radius: 50%; background-color: #000; content: ""; display: inline-block; margin-right: 10px; position: relative; top: -3px; }
.about ul.quote-slider li:before { display: none; }
.bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto { position: relative; }
.bx-wrapper .bx-pager { padding-top: 0; height: 10px; }
.about ul li, .service ul li { padding: 5px 10px; position: relative }
.service ul li:before { width: 4px; height: 4px; border-radius: 50%; background-color: #000; content: ""; display: inline-block; margin-right: 10px; position: relative; top: -3px; position: absolute; left: 0; top: 17px; }
/* Icon circles */
.icon-circle { display: block; text-align: center; margin-bottom: 50px; }
.icon-circle i { display: block; margin: 0 auto 20px; width: 80px; height: 80px; line-height: 80px; text-align: center; font-size: 36px; color: #555555; background: none; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
.icon-circle:hover > i { font-size: 48px; color: #ffffff; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
.icon-circle p { -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
.icon-circle:hover > p { color: #aaaaaa; -webkit-transition: all .2s; -moz-transition: all .2s; -ms-transition: all .2s; -o-transition: all .2s; transition: all .2s; }
/* ==================== 09. About ==================== */
#about { margin-top: -250px; position: relative; }
#about h1, #inner h1 { font-family: 'BodoniLT'; font-weight: normal; text-align: right; font-size: 39px; line-height: 1.3; font-weight: normal; color: #371d03; }
#about h1, #inner h1 { top: -6px; position: relative; }
/*.bx-wrapper ul li:before { display: none; }*/
#about h1:before { background-image: url('/templates/home/images/h1.png'); background-repeat: no-repeat; background-position: center right; content: ""; display: block; width: 100%; height: 51px; position: absolute; top: -55px; right: 0; }
.contact .title h2 { font-family: 'BodoniLT'; text-align: left; font-size: 40px; margin-bottom: 30px; line-height: 1; font-weight: normal; color: #371d03; }
.work .title h2 { font-family: 'BodoniLT'; text-align: center; font-size: 40px; margin-bottom: 30px; line-height: 1; font-weight: normal; color: #371d03; }
.service .title h4 { font-family: 'BodoniLT'; text-align: left; font-size: 40px; margin-bottom: 30px; line-height: 1; font-weight: normal; color: #371d03; }
#about .bg-white.bg-padding { padding: 135px 20px 0 20px; }
#about .eight.col.offset-by-two { position: relative; }
#about .eight.col.offset-by-two:before { position: absolute; top: -75px; left: 0; content: ""; width: 100%; height: 1px; background-color: #a16e02; }
.about .slogan.title { padding-bottom: 50px; }
.about .slogan.title h2 { font-size: 18px; line-height: 1; }
.about .slogan.title h4 { font-size: 16px; text-transform: none; font-weight: normal; }
.about .slogan.title h2, .about .slogan.title h4 { color: #fff; margin: 0; padding: 0; }
.about .slogan.title hr { width: 340px; background: #FFF; margin: 0; padding: 0; }
.follower .about { background: #f4f4f4; padding-top: 140px; padding-bottom: 100px; }
.follower .about ul { margin: 0 40px 30px; list-style: disc }
.bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:hover { background: #a16e02; border-color: #a16e02; }
.bg-white { background: #ffffff; }
.bg-padding { padding: 80px 20px; }
/* Quote slider */
.qs-wrap ul { margin: 0!important }
.qs-wrap p { color: #aaaaaa; }
.qs-wrap { margin-top: 2px; }
.qs-wrap .bx-wrapper .bx-pager { bottom: -25px; }
/* Styling for the pagination for the quote slider */
.qs-wrap .bx-wrapper .bx-pager.bx-default-pager a { border: 1px solid #cccccc; filter: alpha(opacity=100); opacity: 1; }
.qs-wrap .bx-wrapper .bx-pager.bx-default-pager a.active, .qs-wrap .bx-wrapper .bx-pager.bx-default-pager a:hover { background: #cccccc; filter: alpha(opacity=100); opacity: 1; }
.qs-wrap .bx-controls-direction { display: none!important }
.follower .pagepix ul { margin: 0; padding: 0; display: block }
.follower .pagepix ul::after { content: ''; display: block; clear: both }
.follower .pagepix ul li { margin: 0; padding: 0; display: inline-block; float: left }
.follower .pagepix ul li img { width: 100%; height: auto }
/* Positioning for the arrow controls for the employee slider */
.about .oc-left, .about .oc-right { margin-top: -50px; }

@media only screen and (max-width: 1220px) {
.about .oc-left, .about .oc-right { margin-top: 20px; }
}
/* ==================== 10. Contact ==================== */
/*.contact { background: #f4f4f4; padding-top: 100px; padding-bottom: 100px; }*/
/* Contact form */
.c-form { text-align: left; }
.c-form .input { margin: 0 0 15px }
.c-form input, .c-form select, .c-form textarea, .c-form .input .inputbox { font-size: 16px; margin: 0!important; background: #fff }
.c-form .input .inputbox.error { border: solid 1px #e9322d; color: #e9322d }
.c-form .input label.error { font-size: 10px; display: block; color: #e9322d; margin: 2px 0 0 0!important; padding: 0!important; line-height: 10px!important; display: none!important }
/* Contact form feedback messages */
.c-message { text-align: left; }
.error_message { text-align: left; color: tomato; margin-bottom: 10px; }
/* Loader image */
.loader { margin-left: 10px; }
/* Contact details */
.c-details a { color: #111; display: inline-block; }
.c-details a:hover, .c-details a:hover i { color: #ff4800; }
.c-details i { float: left; width: 15px; line-height: 25px; font-size: 14px; text-align: center; color: #111111; }
.c-details i.fa-mobile { font-size: 22px; }
.c-details span { display: block; width: auto; margin-bottom: 20px; margin-left: 30px; }
#location-map { width: 100%; height: 400px }
/* ==================== 11. Footer ==================== */
/* Back to top button */
.back-top-wrap { text-align: center; height: 0; }
.back-top { position: relative; top: -25px; display: inline-block; width: 50px; height: 50px; line-height: 48px; text-align: center; font-size: 14px; color: #ffffff; background: #ff4800; background: rgba(255,72,0,0.9); -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; z-index: 2; }
.back-top:hover { background: rgba(255,72,0,1); }
/* Social footer */
.social-footer { padding-top: 25px; padding-bottom: 50px; text-align: center; color: #FFF; }
.social-footer a { margin: 0 10px; font-weight: 600; }
.social-footer a:hover { color: #FFF; text-decoration: underline; }
/* Social icons */
.sf-icons { width: 100%; position: relative; text-align: center; margin-bottom: 25px; }
.sf-icons i { display: inline-block; width: 40px; height: 40px; line-height: 40px; text-align: center; font-size: 28px; color: #888888; margin: 10px; }
.sf-icons i:hover { color: #ffffff; }
.sf-icons p { margin-top: 15px; margin-bottom: 0; }
/* Footer */
.footer { padding-top: 0; padding-bottom: 0; text-align: center; color: #fffefe; font-size: 13px; }
.footer a:hover { color: #fff }
.footer a { display: inline-block; }
.footer img { max-width: 280px; margin-bottom: 40px; display: block; }
/* Footer promo */
.footer-promo { display: none; background: #111111; padding-top: 60px; padding-bottom: 60px; text-align: center; }
.promo-control { position: relative; top: -25px; text-align: center; height: 0; }
.promo-control a { padding-top: 10px; cursor: pointer; color: #333333; }
.promo-control a:hover { color: #777777; }
/* ==================== 12. 404 Page ==================== */
.fourofour { height: 100%; }
.fourofour .header { height: 100%; }
.error-circle { display: inline-block; margin: 0 auto; width: 300px; height: 300px; border-radius: 150px; background: #ffffff; padding: 25px; }
.error-circle h1 { font-size: 90px; line-height: 1em; margin-top: 30px; margin-bottom: 15px; }
.error-circle h5 { margin-bottom: 15px; }
.error-circle hr { display: inline-block; width: 40px; height: 2px; background: #cccccc; margin-bottom: 10px; }
.banners { background: #ffffff; padding-top: 100px; padding-bottom: 100px; }
.banners .oc-left, .banners .oc-right { top: 70px; margin-top: 0; }
.banners-slider .owl-item { display: table; vertical-align: middle }
.banners-slider a { height: 140px; display: table-cell; vertical-align: middle }
.banners-slider a img { width: 100%; height: auto; display: block; vertical-align: middle; -webkit-filter: grayscale(100%); filter: grayscale(100%); filter: gray; filter: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' height='0'><filter id='greyscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0' /></filter></svg>#greyscale"); -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; opacity: 0.5; filter: alpha(opacity=50) }
.banners-slider a:hover img { zoom: 1; -webkit-filter: none; filter: none; opacity: 1; filter: alpha(opacity=100) }
.answers { margin: 0 0 20px; padding: 0 0 20px; border-bottom: 1px dotted #ccc }
.answers:last-child { border-bottom: none }
.answers h3 strong { color: #a2c43b }
.answers .answer { margin-top: 20px; display: none }
.answers .answer p { margin: 0 }
.casestudies-slider .e-info { background: #f4f4f4; margin-bottom: 30px; height:95px; }
.casestudies-slider .owl-wrapper { width: 100%!important; overflow: hidden!important; transform: none!important }
.gallery-slider { padding-left: 0; padding-right: 0 }
.gallery-slider::after { content: ''; display: block; clear: both }
.gallery-slider .image { float: left; display: inline-block; width: 20%; height: auto }

/* ==================== 13. Responsive settings ==================== */
/* Tablet portrait - Medium */
@media only screen and (max-width: 768px) {
.title hr { margin-bottom: 50px; }
.bg-padding { padding: 50px 15px; }
.intro, .work, .cta, .services, .process, .about, .contact, .social-footer { padding-top: 75px; padding-bottom: 75px; }
.process, .social-footer { padding-top: 75px; padding-bottom: 50px; }
.footer, .footer-promo { padding-top: 40px; padding-bottom: 40px; }
.section-slider { padding-top: 75px; padding-bottom: 100px; }
.c-form { margin-bottom: 25px; }
.follower #top { margin-top: 0; }
.section-slider { padding-top: 0px; padding-bottom: 0px; }
#inner .work .row .three, .owlcarousel.casestudies-slider .three { width: 50%; margin-bottom: 30px; }
#about h1, #inner h1 { text-align: left; }
.tb-small ul.menu li.logo { display: none; }
.social-footer a:nth-child(3) { display: block; margin: 5px 0; }
#about img.margin { margin-bottom: 15px; }
.intro, .work, .cta, .services, .process, .about, .contact { padding-top: 0px; padding-bottom: 0px; }
#about h1::before { background-position: left center; position: relative; top: 0; }
#about .row .five { width: 66.6666%; }
#about .row .three { width: 33.3333%; }
#about .eight.col.offset-by-two::before { top: -50px; }
#video .bg-padding, .work .relative, .twelve.col.text-left .bg-padding { padding: 50px 25px; }
#work .row .three { width: 50%; margin-top: 30px; }
.social-footer { padding-top: 50px; padding-bottom: 50px; }
.footer, .footer-promo { padding-bottom: 30px; }
}
@media screen and (max-height: 680px) {
.header-inner { display: none!important; }
}
@media screen and (max-width: 640px) {
.header-inner { display: none!important; }
}
/* Smartphone landscape - Small */
@media only screen and (max-width: 480px) {
#work .row .three { width: 100%; margin-top: 30px; }
#inner .twelve.col.text-left .bg-padding, .twelve.col.text-left .bg-padding, #video .bg-padding { padding: 30px 10px; }
.title hr { margin-bottom: 25px; }
.bg-padding { padding: 30px 10px; }
.intro, .work, .cta, .services, .process, .about, .contact { padding-top: 50px; padding-bottom: 50px; }
.social-footer { padding-top: 50px; padding-bottom: 25px; }
.footer, .footer-promo { padding-top: 25px; padding-bottom: 25px; }
.section-slider { padding-top: 50px; padding-bottom: 100px; }
.error-circle { width: 220px; height: 220px; border-radius: 110px; padding: 15px; }
.error-circle h1 { font-size: 60px; line-height: 1em; margin-top: 25px; margin-bottom: 10px; }
.error-circle h5 { font-size: 12px; margin-bottom: 5px; }
.error-circle hr { display: inline-block; width: 40px; height: 2px; background: #cccccc; margin-bottom: 5px; }
.gallery-slider .image { width: 50% }
.tb-large .tb-logo h1 { font-size: 16px; line-height: 16px; margin-top: 16px }
.banners-slider .owl-item { padding: 0 20px!important }
.banners-slider .owl-item a { position: relative; width: 100%!important; max-width: 280px!important; height: auto; margin: 0 auto!important; display: block }
.banners-slider .owl-item img { position: relative; width: 100%!important; max-width: 280px!important; height: auto; margin: 0 auto!important; display: block }
.follower .pagepix { height: auto }
.mobile { display: none; }
#about img.margin { margin-bottom: 30px; }
#about h1, #inner h1 { text-align: left; }
#about h1::before { background-position: left center; position: relative; top: 0; left: 0; margin-bottom: 10px; }
.logo-mobile { display: block; position: absolute; width: 80px; left: 8px; top: 4px; }
.logo-mobile img { width: 100%; }
.about .slogan.title h2 { line-height: 1.6; }
.intro, .work, .cta, .services, .process, .about, .contact { padding-top: 0; padding-bottom: 0; }
#inner .work .row .three, .owlcarousel.casestudies-slider .three { width: 100%; margin-bottom: 30px; }
.follower #gallery .large { height: 320px; }
.section-slider { padding-top: 0px; padding-bottom: 0px; }
.follower #top { margin-top: 50px; }
.tb-small ul.menu li.logo, .follower .tb-large ul.menu li.logo { display: none!important; }
.eight.col.offset-by-two::before { top: -40px; }
.work .relative { padding-top: 30px; padding-bottom: 30px; }
address { margin-bottom: 0px; }
.social-footer a:nth-child(3) { display: block; margin: 5px 0; }
.footer { font-size: 12px; }
.social-footer { padding-top: 30px; }
.footer, .footer-promo { padding-bottom: 10px; }
#about .row .three, #about .row .five { width: 100%; }
#about .eight.col.offset-by-two::before { top: -25px; }
#location-map { height: 200px }
}