/* Compass Reset Yeah! */
/* line 17, ../../../../../compass.app/Contents/Resources/lib/ruby/compass_0.12/compass-0.12.2/frameworks/compass/stylesheets/compass/reset/_utilities.scss */
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: inherit;
	font-size: 100%;
	vertical-align: baseline;
}
html {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
	vertical-align: middle;
}
q, blockquote {
	quotes: none;
}
q:before, q:after, blockquote:before, blockquote:after {
	content: "";
	content: none;
}
a img {
	border: none;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
	display: block;
}
/*** Heading styles ***/

h1 {
	font: 24px 'Ubuntu Condensed', sans-serif;
	color: #333;
	margin-bottom: 15px;
}
h2 {
	font: 24px 'Ubuntu Condensed', sans-serif;
	color: #999;
}
h3 {
	font: 24px 'Ubuntu', sans-serif;
	color: #333;
	margin: 10px 0px 25px 0px;
}
h4 {
	font: 22px 'Ubuntu Condensed', sans-serif;
	color: #d91720;
}
h5 {
	font: 24px 'Ubuntu Condensed', sans-serif;
	color: #FFF;
}
h6 {
	font: 17px 'Ubuntu', sans-serif;
	color: #666;
	-moz-transition: all .4s ease-in;
	-webkit-transition: all .4s ease-in;
	-o-transition: all .4s ease-in;
	transition: all .4s ease-in;
}
::selection {
	background: #25AAE1; /* Safari */
	color: #FFF;
}
::-moz-selection {
 background: #25AAE1; /* Firefox */
 color: #FFF;
}
p {
	font: 13px/22px 'Open Sans', sans-serif;
	color: #666;
	margin-top: 15px;
}
.modal-body p{
	color: #333;
}

/* Preloader */
#preloader {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #fff; /* change if the mask should have another color then white */
	z-index: 999999 !important; /* makes sure it stays on top */
}
#status {
	width: 225px;
	height: 78px;
	position: absolute;
	left: 50%; /* centers the loading animation horizontally one the screen */
	top: 50%; /* centers the loading animation vertically one the screen */
	background-image: url(../img/pre-loader.gif); /* path to your loading animation */
	background-repeat: no-repeat;
	background-position: center;
	margin: -100px 0 0 -100px; /* is width and height divided by two */
}
/*****************************
**** GENERAL Layout styles ***
******************************/

body {
	background: #FFF;
	font: 13px 'Open Sans', sans-serif;
	overflow-x: hidden !important;
}
.container {
	position: relative;
}
header {
	width: 100%;
	background-color: #FFF;
	position: fixed;
	z-index: 9;
	border-bottom: 1px #ebebeb solid;
}

/*** top-bar ***/
.top-bar {
	width: 100%;
	height: 43px;
	background: #231f20;
	font: 14px 'Open Sans', sans-serif;
	padding: 10px 0px;
}
.top-bar a.e-mail {
	padding: 3px 0px;
	display: block;
	color: #FFF;
	line-height: 15px;
	float: left;
	-moz-transition: all .4s ease-in;
	-webkit-transition: all .4s ease-in;
	-o-transition: all .4s ease-in;
	transition: all .4s ease-in;
	margin: 0px 30px 0px 0px !important;
}
.top-bar a.e-mail:hover {
	color: #b71319;
	text-decoration: none;
}
.e-mail-icon {
	width: 15px;
	height: 15px;
	background: url(../img/icons.png) no-repeat 0 3px;
	float: left;
	margin-right: 10px;
}
.phone-icon {
	width: 15px;
	height: 15px;
	background: url(../img/icons.png) no-repeat 0 -24px;
	float: left;
	margin-right: 10px;
}
.download-icon {
	width: 19px;
	height: 25px;
	background: url(../img/contact-icons.png) no-repeat 0 -114px;
	float: left;
	margin-right: 10px;
}
/* SOCIAL ICONS - GENERAL */
.social {
	list-style: none;
	margin: 0px auto;
	float: right;
}
.social li {
	display: inline;
	float: left;
	background: url(../img/social-media-icons.png) no-repeat;
	margin-left: 15px;
	opacity: .8;
	-moz-transition: all .4s ease-in;
	-webkit-transition: all .4s ease-in;
	-o-transition: all .4s ease-in;
	transition: all .4s ease-in;
}
.social li:hover{
	margin-top: -3px;
	opacity: 1;
}
.social li a {
	display: block;
	width: 26px;
	height: 26px;
	padding-right: 10px;
	position: relative;
	text-decoration: none;
}
li.facebook {
	background-position: 0px 0px;
}
li.yt {
	background-position: -39px 0px;
}
li.twitter {
	background-position: -76px 0px;
}
li.googleplus {
	background-position: -116px 0px;
}
li.linkedin {
	background-position: -156px 0px;
}

/*** Logo And Menu part ***/
header #logo {
	display: inline-block;
	float: left;
	margin-bottom: 20px;
	margin-top: 25px;
}
header #logo a {
	display: block;
}
header #logo a img {
	max-width: 237px;
}
header .main-nav {
	float: right;
	width: 100%;
	max-width: 480px;
}

/* SLIDER STYLES */
	
.slider-wrapper{
	position:relative;
	overflow:hidden;
	width:100%;
	background: url(../img/slider-bg.jpg) top center no-repeat;
	box-shadow: inset 0px 0px 10px rgba(153,153,153,.3);
	margin:0 auto;
	max-height:600px !important;
	margin-top: 145px;
	background-size:contain;
}
.slider{
	position:relative;
	max-width:100%; 
	margin:0 auto;
}
.second{
	width:100%  !important;
	background: url(../img/slider-bg-1.jpg) top center no-repeat !important;
	box-shadow: inset 0px 0px 10px rgba(153,153,153,.3);
	margin:0 auto;
	background-size:contain !important;
}

.third{
	width:100%  !important;
	background: url(../img/slider-bg2.jpg) top center no-repeat !important;
	box-shadow: inset 0px 0px 10px rgba(153,153,153,.3);
	margin:0 auto;
	background-size:contain !important;
}

/** Fraction Slider **/

.fraction-slider{
	position:relative;
	width:100%; height:100%;
	overflow:visible;
}

.fraction-slider .slide{
	display:none; 
	width:100%; 
	height:100%;
	position:absolute;
	z-index:5000;
}

.fraction-slider .active-slide{
	z-index:9999;
}

.fraction-slider .fs_obj{
	display:block; display:none;
	position:absolute;
	top:0px; left:100%;
	z-index:7000;
}

.fraction-slider .fs_fixed_obj{
	z-index:6000;
	left:0;
}

.fraction-slider .fs_obj *{
	display:inline-block;
	position:relative;
	top:0px; left:0px;
}

.fs_loader{
	width:100%; 
	height:400px;
	background:url(images/fs.spinner.gif) center center no-repeat transparent;
}

/** CONTROLS **/

.fraction-slider .prev,
.fraction-slider .next{
	display:none;
	position:absolute;
	width:45px; height:45px;
	z-index:9999;
	display: none;
}

.fraction-slider .prev{
	left:10px; top:48%;
	background:url(images/fs.prevnext.png) 0px 0px no-repeat transparent;
	
}
.fraction-slider .prev:hover{
	background:url(images/fs.prevnext.png) 0px -45px no-repeat transparent;
}

.fraction-slider .next{
	right:10px; top:48%;
	background:url(images/fs.prevnext.png) -45px 0px no-repeat transparent;
}
.fraction-slider .next:hover{
	background:url(images/fs.prevnext.png) -45px -45px no-repeat transparent;
}

.fraction-slider:hover .prev,
.fraction-slider:hover .next{
	display:block;
}

/** PAGER **/

.fs-pager-wrapper{
	position:absolute;
	left:10px; bottom:10px;
	z-index:9999;	
}

.fs-pager-wrapper a,
.fs-custom-pager-wrapper a{
	display:inline-block;
	width:28px; 
	height:4px;
	margin:0 8px 0 0;
	background: #999;
}
.fs-pager-wrapper .active,
.fs-custom-pager-wrapper .active{
	background: #bb2127;
}

.content-area{
	margin-bottom: 50px;
}
.main-boxes{
	position: relative;
	width: 100%;
	font: 13px/20px 'Open Sans', sans-serif;
	color: #999;
	border: 1px #ebebeb solid;
	background: #FFF;
	margin-top: 120px;
	padding: 25px;
	text-align: center;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.main-boxes p{
	margin-bottom: 40px;
	padding: 0px 15px;
}
.main-icons{
	position: relative;
	width: 107px;
	height: 107px;
	margin: 0 auto;
	margin-top: -80px;
	margin-bottom: 15px;
}
.read-more{
	width: 100px;
	height: 33px;
	background: #cc3333;
	font: 14px/33px 'Ubuntu', sans-serif;
	color: #FFF;
	display: block;
	margin:0 auto;
	margin-bottom: -40px;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.read-more:hover{
	text-decoration: none;
	color: #e37165;
	background: #850e13;
}
.main-boxes:hover{
	background: #CCC;
	margin-top: 115px;
}
.creative:hover{
	background: url(../img/creative-pattern.jpg) repeat;
}
.production:hover{
	background: url(../img/production-pattern.jpg) repeat;
}
.printing:hover{
	background: url(../img/printing-pattern.jpg) repeat;
}
.main-boxes:hover > .read-more{
	color: #e37165;
	background: #850e13;
}

footer{
	width: 100%;
	background: url(../img/footer-bg.jpg) repeat-x #7e0d12;
}
footer address{
	font: 12px/22px 'Open Sans', sans-serif;
	color: #FFF;
	margin: 15px 0px;
	padding-left: 50px;
	background: url(../img/havison-address-fo.png) no-repeat 0px 5px;
}
footer address span{
	font-weight: bold;
}
.footer-heading{
	padding: 20px 0px;
	background: url(../img/footer-holder.png) no-repeat left bottom;
}
.detail-row{
	width: 100%;
	font: 13px/30px 'Open Sans', sans-serif;
	color: #FFF;
	float: left;
	margin-bottom: 10px;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.detail-row:hover{
	text-decoration: none;
	color: #000;
}

.fax-icon, .mob-icon, .mail-icon{
	width: 37px;
	height: 32px;
	margin-right: 12px;
	background: url(../img/contact-icons.png) no-repeat 10px 7px #7c0d11;
	float: left;
	border-radius: 5px 0px 0px 5px;
}
.mob-icon{
	background: url(../img/contact-icons.png) no-repeat 10px -33px #7c0d11;
}
.mail-icon{
	background: url(../img/contact-icons.png) no-repeat 10px -74px #7c0d11;
}
.footer-link-1{
	width: 100%;
	padding-left: 65px !important;
	margin-top: 20px;
	min-height: 45px;
}
.footer-link-1 a{
	font: 11px 'Open Sans', sans-serif;
	color: #FFF;
	width: 100%;
	float: left;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.footer-link-1 a:hover{
	text-decoration: none;
	color: #000;
}
.creative-service{
	background: url(../img/service-icons/creative.png) no-repeat;
	padding: 10px 0px;
	background-size: 52px;
}
.web-service{
	background: url(../img/service-icons/web.png) no-repeat;
	padding: 0px;
	background-size: 48px;
}
.offset-printing{
	background: url(../img/service-icons/offset-printing.png) no-repeat;
	padding: 0px;
	background-size: 48px;
}
.digital-printing{
	background: url(../img/service-icons/digital-printing.png) no-repeat;
	padding: 10px 0px;
	background-size: 48px;
}
.gift{
	background: url(../img/service-icons/gift.png) no-repeat;
	padding: 10px 0px;
	background-size: 48px;
}
.graphics-service{
	background: url(../img/service-icons/graphic-service.png) no-repeat;
	padding: 10px 0px;
	background-size: 48px;
}
.signage{
	background: url(../img/service-icons/signage.png) no-repeat;
	padding: 10px 0px;
	background-size: 48px;
}
.video-service{
	background: url(../img/service-icons/av.png) no-repeat;
	padding: 10px 0px;
	background-size: 48px;
}
.photography{
	background: url(../img/service-icons/photography.png) no-repeat;
	padding: 10px 0px;
	background-size: 48px;
}
.exhibition{
	background: url(../img/service-icons/exhibition.png) no-repeat;
	padding: 10px 0px;
	background-size: 48px;
}
.packaging{
	background: url(../img/service-icons/packing.png) no-repeat;
	padding: 10px 0px;
	background-size: 48px;
}
.copy-right{
	width: 100%;
	padding: 15px 0px;
	border-top: 1px #a8575a solid;
	background: #5a090d;
	font: 12px 'Ubuntu', sans-serif;
	color: #FFF;
	text-align: center;
	margin-top: 20px;
}

/** Inner Page Style **/

.inner-head{
	position:relative;
	width:100%;
	box-shadow: inset 0px 0px 10px rgba(153,153,153,.3);
	margin:0 auto;
	margin-top: 145px;
	margin-bottom: 50px;
}
.inner-headings img{
	max-width: 100%;
}
.head-bg-1{
	background: url(../img/inner-head-bg-1.jpg) top center no-repeat;
	background-size: cover;
}
.head-bg-2{
	background: url(../img/inner-head-bg-2.jpg) top center no-repeat;
	background-size: cover;
}
.head-bg-3{
	background: url(../img/inner-head-bg-3.jpg) top center no-repeat;
	background-size: cover;
}
.head-bg-4{
	background: url(../img/inner-head-bg-4.jpg) top center no-repeat;
	background-size: cover;
}
.head-bg-5{
	background: url(../img/inner-head-bg-5.jpg) top center no-repeat;
	background-size: cover;
}
/*services-page*/
.creative-s{
	background: url(../img/service-banner/01.jpg) top center no-repeat;
	background-size: cover;
}
.av-s{
	background: url(../img/service-banner/02.jpg) top center no-repeat;
	background-size: cover;
}
.op-s{
	background: url(../img/service-banner/03.jpg) top center no-repeat;
	background-size: cover;
}
.ps-s{
	background: url(../img/service-banner/04.jpg) top center no-repeat;
	background-size: cover;
}
.dfp-s{
	background: url(../img/service-banner/05.jpg) top center no-repeat;
	background-size: cover;
}
.wos-s{
	background: url(../img/service-banner/06.jpg) top center no-repeat;
	background-size: cover;
}
.gga-s{
	background: url(../img/service-banner/07.jpg) top center no-repeat;
	background-size: cover;
}
.ecs-s{
	background: url(../img/service-banner/08.jpg) top center no-repeat;
	background-size: cover;
}
.sp-s{
	background: url(../img/service-banner/09.jpg) top center no-repeat;
	background-size: cover;
}

/*services-page*/
.inner-headings{
	padding: 20px 0px 15px 0px;
}
.breadcrumb {
	float: right;
	background: none;
	margin-top: 7px;
	text-transform: uppercase;
	margin-top: 34px;
}
.breadcrumb li a {
	display: block !important;
	padding-right: 15px !important;
	background: url(../img/breadcrumb.png) no-repeat right center;
	margin-right: 5px;
	color: #FFF;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.breadcrumb li a:hover {
	text-decoration: none;
	color: #B71419;
}
.breadcrumb li.active {
	color: #CCC;
}

.breadcrumb > li + li:before{
	content: none;
}
.innerimg{
	width: 100%;
	text-align: center;
	margin-bottom: 20px;
}
.innerimg img{
	max-width: 100%;
}
.client-comment{
	width: 100%;
	padding: 20px;
	background: #f8fafa;
	border: 1px #ebebeb solid;
	position: relative;
}
.text-arrow{
	width: 17px;
	height: 18px;
	background: url(../img/text-arrow.png);
	position: absolute;
	bottom: -17px;
	left: 22px;
}
.client-comment p{
	font: 13px/22px 'Open Sans', sans-serif;
	color: #999;
	margin-top: 0px;
}
.client-details{
	width: 100%;
	float: left;
	margin-top: 20px;
}
.client-propic{
	width: 68px;
	height: 68px;
	border-radius: 50%;
	background: #e1e1e1;
	overflow: hidden;
	text-align: center;
	float: left;
}
.pro-details{
	float: left;
	font: 14px/22px 'Open Sans', sans-serif;
	color: #666;
	margin-left: 15px;
	margin-top: 10px;
}
.pro-details span{
	font-size: 13px;
	color: #999;
}
.pro-details span .pos{
	color: #ba2027;
}
.read-more-2{
	width: 100px;
	height: 28px;
	background: #cc3333;
	font: 13px/28px 'Ubuntu', sans-serif;
	color: #FFF;
	text-align: center;
	float: right;
	display: block;
	margin:20px auto;
	margin-bottom: -40px;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.read-more-2:hover{
	text-decoration: none;
	color: #e37165;
	background: #850e13;
}
.tabs {
	margin-top: 20px;
}
.nav-tabs{
	border-bottom: 1px #ebebeb solid !important;
}
.nav-tabs > li.active{
	border-radius: 0px;
	border-top: 9px #ba2027 solid;
}
.nav-tabs > li > a{
	border-radius: 0px;
	border-top: 0px !important;
	margin-right: 0px !important;
	background: #f8fafa;
	font: 14px 'Ubuntu', sans-serif;
	color: #666;
}
.tab-content{
	border-left: 1px #ebebeb solid;
	border-right: 1px #ebebeb solid;
	border-bottom: 1px #ebebeb solid;
	padding: 20px;
}

figure.client-img{
	width: 100%;
	text-align: center;
	padding: 10px 0px;
}
figure.client-img img{
	max-width: 100%;
}

.contact-form {
	width: 100%;
	float: left;
}
label {
	font: 16px 'Ubuntu', sans-serif;
	color: #666;
	margin: 20px 0px 5px 0px;
}
.input {
	width: 100%;
	border: 1px #d7d7d7 solid;
	background: #efefef;
	padding: 0px 5px;
	height: 30px;
}
.text-area {
	width: 100%;
	border: 1px #d7d7d7 solid;
	background: #efefef;
	padding: 5px;
	height: 171px;
}
.send {
	font: 18px/35px 'Ubuntu', sans-serif;
	color: #FFF;
	width: 108px;
	height: 35px;
	background: #C93228;
	border: 1px #BA141A solid;
	border: 0px;
	margin: 20px 0px;
	-moz-transition: all .3s ease-in;
	-webkit-transition: all .3s ease-in;
	-o-transition: all .3s ease-in;
	transition: all .3s ease-in;
}
.send:hover {
	background: #BA141A;
}

.detail-row-2{
	width: 100%;
	font: 13px/30px 'Open Sans', sans-serif;
	color: #333;
	float: left;
	margin-top: 15px;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.detail-row-3{
	max-width: 100%;
	background:url(../img/cup.jpg) no-repeat center;
	float: left;
	margin-top: 15px;
}
.download{
	max-width:100%;
}
.detail-row-2:hover{
	text-decoration: none;
	color: #000;
}

.fax-icon-2, .mob-icon-2, .mail-icon-2{
	width: 37px;
	height: 37px;
	margin-right: 12px;
	background: url(../img/contact-icons.png) no-repeat 10px 9px #ccc;
	float: left;
	border-radius: 50%;
}
.mob-icon-2{
	background: url(../img/contact-icons.png) no-repeat 10px -30px #ccc;
}
.mail-icon-2{
	background: url(../img/contact-icons.png) no-repeat 10px -72px #ccc;
}

.map {
	border: 1px #eee solid;
	margin: 30px 0px 20px 0px;
}
.map iframe {
	border: 0px;
	width: 100% !important;
	margin-bottom: -4px;
	padding: 2px;
}

.contact-details{
	padding-left: 50px;
	background: url(../img/havison-address.png) no-repeat 0px 10px;
}

.no-margin{
	margin:0px;
}
ul.service-items{
	color:#333;
	font-size:15px;
}
ul.service-items li{
	list-style-image:url(../img/list-style.png);
	padding:15px 0;
	margin-left:20px;
}

.addi{
	border-top: 1px solid #333;
	padding-top:25px;
	margin-top:15px;
}


@media (max-width: 800px) {
header {
	position: relative;
}
.slider-wrapper, .inner-head{
	margin-top: 0px;
}
}

@media (max-width: 768px) {
.top-bar {
	height: auto;
}
.top-bar {
	font: 12px 'Open Sans', sans-serif;
}
.social li {
	margin-left: 5px;
}
header #logo {
	width: 200px;
	display: block;
	float: none !important;
	margin: 20px auto !important;
}
header .main-nav {
	float: none;
	width: 100%;
	max-width: 100%;
}
.inner-headings{
	text-align: center;
}
.breadcrumb {
	float: none;
	margin:0 auto;
	width: 170px;
}
}