/*
Theme Name: HONCHO - IMAGE - Version: 1
Description:  Designed by josweb.
Author:  Jo
Purchase:  http://themeforest.net/user/josweb

01. GENERAL STYLING
	I - 	GENERAL
	II - 	FLOAT
	II - 	MODAL BOX
	III - 	BIG ICON
	IV - 	VIDEO
	V -		LINKS
	VI - 	PADDING 
	VII - 	SECTION PADDING
	VIII -	BUTTONS
	IX -	CAROUSEL
02. TYPOGRAPHY
03. PRELOADER
04. NAVBAR & SLIDEBARS
05. HOME SECTION 
06. ABOUT SECTION 
	I - 	TEXT ROTATOR
	II - 	PIE CHARTS
07. THE TRAILERS SECTION
07.5. VIDEO SECTION 
08. MILESTONES
09	QUOTES/TESTIMONIALS SECTION
10:	PRICING TABLES + CLIENTS CAROUSEL
11:	CONTACT SECTION 
12: FOOTER SECTION
13. SINGLE PAGES
14. BLOG
15. ACCORDION + TABS
16. MEDIA QUERIES
*/

/*-----------------------------------------------------------------------------------*/
/*	01: GENERAL STYLING
/*-----------------------------------------------------------------------------------*/	
body {
	font:15px/24px 'Lato', sans-serif;
	color: #000;
	font-weight: 300;
	background: #fff;
	margin: 0;
	-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
	text-rendering: optimizeLegibility;
	height: 100%; 
	width: 100%;
	-webkit-backface:hidden;
	-webkit-backface-visibility:hidden; 
}

/**** MAIN CONTENT BACKGROUND ****/
#sb-site { background-color: #fff!important;  }

/**** STOP FLICKERING ON SECTIONS ****/
section,  #myCarousel, #myCarousel .carousel-indicators, .footer { 
	-webkit-backface:hidden; 
	-webkit-backface-visibility:hidden; 
	-webkit-perspective:1000;
}

html { font-size:100%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; height:100%;}
a, a:visited, a:hover, a:active, a:focus, input, select, textarea { outline:none; text-decoration:none; }
a, li { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
:focus, .btn:focus { outline: 0; }
code{ color:#333; }
img { display:block; height:auto; max-width:100%; vertical-align:top; ms-interpolation-mode:bicubic; opacity:1.0; width: auto\9;}
iframe { border: 0 none; }
.soundcloud { width:100%; }
.wow { visibility: hidden; }
.center { margin:0 auto; }

/**** BLOCKQUOTE ****/

blockquote { padding: 10px; line-height:30px!important;}
blockquote h4, blockquote h5 { padding: 5px!important; margin:0; line-height: 35px!important;}
blockquote h5 {line-height:30px!important; }

/**** FLOAT ****/

.pull-left { margin-right:10px; }
.pull-right { margin-left:10px; }

/**** MODAL ****/

.modal { overflow-y: auto; }
.modal-open { overflow: auto; }
.modal-footer, .modal-header {border: 0px none;}
.fa-li { margin-left:-6px; padding-top: 2px; }

/**** BIG ICON ****/

.icon-big { font-size: 120px; margin-top: 10px; color: #222; }

/**** VIDEO ****/

.vendor { position: relative; padding: 0 0 56.25%; height: 0; margin 0 0; }
.vendor iframe { position: absolute; top: 0; left :0; width: 100%; height: 100%; } 

/**** LINKS ****/

a {
	-webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

/**** PADDING ****/

.pad150 { padding-top: 130px; }
.pad90 { padding-top: 90px; }
.pad60 { padding-top: 60px; }
.pad45 { padding-top: 45px; }
.pad35 { padding-top: 35px; }
.pad30 { padding-top: 30px; }
.pad25 { padding-top: 25px; }
.pad20 { padding-top: 20px; }
.pad15 { padding-top: 15px; }
.pad10 { padding-top: 10px; }
.pad5 { padding-top: 5px; }
.pad-right10 { padding-right: 10px; }
.pad-right15 { padding-right: 15px; }
.marg-right10 { margin-right: 10px } 
.marg-right15 { margin-right: 15px!important; } 
.marg-top0 { margin-top: 0px; }
.marg-top5 { margin-top: 5px; }
.marg-top-minus5 { margin-top: -5px; }
.marg-top-minus25 { margin-top: -25px; }

/**** SECTION PADDINGS ****/

#about { padding-bottom:60px; }
#about, #work, #price, #contact { padding-top: 80px; }
#blog { padding: 120px 0 60px; }

/** COLOUR BUTTON **/

.btn, #pricing .btn,  #pricing .btn-inverse{ 
	font-size: 12px;
	font-weight: 400;
	color: #555;
	display: inline-block;
	border-radius: 0px;
	padding: 1.2em 2.5em;
	letter-spacing: .05rem;
	margin:0px auto 40px;
    text-decoration: none;
    cursor: pointer;
  	-webkit-transition: .2s; 
    transition: .2s;
}

/** OUTLINE BUTTON **/

.btn-big, .btn-big-blog{
    display: inline-block;
    margin: 0 10px 10px 0px;
	font-size: 13px;
	font-weight: 700;	
	background: none;
	color: #333;
	border: 1px solid rgba(0,0,0,0.5);
   	padding: .5em 1.0em;
    letter-spacing: .05rem;
    text-decoration: none;
    cursor: pointer;
    -webkit-transition: .2s;
	transition: .2s;
}
.btn-big-blog{ padding: .5em 1.2em!important;font-size: 12px; }

/** GENERAL CAROUSEL SETTINGS **/

.carousel-control  {
	position: absolute;
	top: 50%;
	background: none !important; 
	filter: progid:none !important; 
	background: none !important;
	text-shadow:none;
	z-index: 1; 
	font-size:50px;
	display: inline-block;
	margin-right:-30px!important;
	margin-left: -30px!important;
}
.carousel-indicators { bottom:-30px; margin-bottom:40px; }
.carousel-indicators li {
	display: inline-block;
	background: rgb(255,255,255);
	opacity:0.5;
	border-radius: 0px;
	margin:2px  2px;
	width: 14px;
	height: 14px;
	border: 0px none; 
	cursor: pointer;
}
.carousel-indicators .active, .carousel-indicators .focus { 
	background: rgb(255,255,255);
	opacity: 0.7;
	border: 0px none;
	margin: 2px 2px;
	height: 14px;
	width: 14px;
}

/*-----------------------------------------------------------------------------------*/
/*	02: TYPOGRAPHY
/*-----------------------------------------------------------------------------------*/	

h1, h2, h3, h4, h5, h6 { font-family: 'Lato', sans-serif; }
h1 {
	font: 900 100px/100px 'Lato', sans-serif;
	position: relative;
	letter-spacing: -0.1rem;
	margin: 0px auto 20px;
	text-align:center;
	color:#222; 
}
h2 { font-size: 50px; letter-spacing: -0.1rem; color:#CCCCCC;  }
h3 { font-size: 32px; color:#222; }
h4 { font-size: 25px; color:#CCCCCC; }
h5 { font-size: 20px; color:#222; }
h6 { font-size: 16px; color:#222; letter-spacing: 0px; }	
#about h6 { margin: 20px 0; font-weight: 700; }

a.h5:link {color:#B93826; }
a.h5:visited {color:#B93826; }
a.h5:hover {color:#222; }
a.h5:active {color:#222; }

.lead {
	max-width: 900px;
	font-size: 28px;
	line-height: 40px;
	font-weight: 300;
	color: #555;
	letter-spacing: -.02rem;
	margin: 0 auto 60px;
	text-align: center;
}

.lead2 {
	max-width: 900px;
	font-size: 28px;
	line-height: 40px;
	font-weight: 300;
	color: #eee;
	letter-spacing: -.02rem;
	margin: 0 auto 60px;
	text-align: center;
}
a.lead2:link {color:#eee; }
a.lead2:visited {color:#eee; }
a.lead2:hover {color:#333333; }
a.lead2:active {color:#333333; }

p { margin-bottom: 20px; }

#single h1 {
	font-weight: 700;
	font-size: 60px;
	line-height: 70px;
	position: relative;
	letter-spacing: -1px!important; 
	color: #222;
	margin: -10px 0px 10px!important;
	text-transform: none;
	text-align: center;
}

#single .lead {
	font-size: 28px!important; 
	font-weight: 300;
	text-align: center;
	line-height: 40px;
	margin-bottom: 35px;
	color: #696f77;
}

/*-----------------------------------------------------------------------------------*/
/*	03: PRELOADER
/*-----------------------------------------------------------------------------------*/	

#preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
	background-color: #f5f5f5;
}
#movingBallG{
 	width: 256px;
	height: 20px;
    border-radius: 50px;
    position: absolute;
    text-align: center;
    left: 50%;
    top: 50%;
    margin: -10px 0 0 -128px; 
}
.movingBallLineG{
	position: absolute;
	left: 0px;
	top: 8px;
	height: 4px;
	width: 256px;
	background-color: #222;
}
.movingBallG{
	background-color: #222;
	position: absolute;
	top: 0;
	left: 0;
	width: 20px;
	height: 20px;
	-moz-border-radius: 10px;
	-moz-animation-name:bounce_movingBallG;
	-moz-animation-duration:1.3s;
	-moz-animation-iteration-count:infinite;
	-moz-animation-direction:linear;
	-webkit-border-radius:10px;
	-webkit-animation-name:bounce_movingBallG;
	-webkit-animation-duration:1.3s;
	-webkit-animation-iteration-count:infinite;
	-webkit-animation-direction:linear;
	-ms-border-radius:10px;
	-ms-animation-name:bounce_movingBallG;
	-ms-animation-duration:1.3s;
	-ms-animation-iteration-count:infinite;
	-ms-animation-direction:linear;
	-o-border-radius:10px;
	-o-animation-name:bounce_movingBallG;
	-o-animation-duration:1.3s;
	-o-animation-iteration-count:infinite;
	-o-animation-direction:linear;
	border-radius:10px;
	animation-name:bounce_movingBallG;
	animation-duration:1.3s;
	animation-iteration-count:infinite;
	animation-direction:linear;
}

@-moz-keyframes bounce_movingBallG{
0% { left:0px;}
50% { left:236px; }
100% { left:0px; }
}
@-webkit-keyframes bounce_movingBallG{
0% { left:0px; }
50% { left:236px; }
100%{ left:0px; }
}
@-ms-keyframes bounce_movingBallG{
0%{ left:0px; }
50%{ left:236px; }
100%{ left:0px; }
}
@-o-keyframes bounce_movingBallG{
0% { left:0px; }
50% { left:236px; }
100% { left:0px; }
}
@keyframes bounce_movingBallG{
0% { left:0px; }
50% { left:236px; }
100% { left:0px; }
} 

#status:before {
  content: '';
 bottom:12%;
  background-image: url('../img/logo_noshadow.png');
  background-repeat: no-repeat;
  background-position: center center;
  display: block;
  z-index: 900;
  position: absolute;
  width: 100%;
  height: 100%;
}

/*-----------------------------------------------------------------------------------*/
/*	04: NAVBAR & SLIDEBARS
/*-----------------------------------------------------------------------------------*/	

/*--------------------------------*/
/*	TOP NAVBAR
/*--------------------------------*/
.navbar {
	background-color: #222; 
	background-size: 100%;
	background-repeat: no-repeat;
	border: none;
	width: 100%;
	left: auto;
	right: auto;
}

/*--------------------------------*/
/*	NAVBAR LOGO
/*--------------------------------*/

#logo { 
	margin-top: 9px;
	margin-bottom: 9px;
	float:left;
	-webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

#logo:hover { opacity:0.8;  }

/*--------------------------------*/
/*	TOGGLES
/*--------------------------------*/

.navbar .sb-toggle-left, .navbar .sb-toggle-right { 
	width: 58px;
	float: left;
	padding: 14px;
	color: #eee;
	font-size: 22px;
	-webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.navbar .sb-toggle-right { float: right; }
.sb-toggle-left:hover, .sb-toggle-right:hover { color: #666; }
.sb-toggle-left, .sb-toggle-right, .sb-open-left, .sb-open-right, .sb-close { cursor: pointer; }

/* in page toggles */
span.sb-toggle-left, span.sb-toggle-right, span.sb-toggle-left:hover, span.sb-toggle-right:hover { font-size: 15px!important; }

/*--------------------------------*/
/*	SLIDEBARS
/*--------------------------------*/

.sb-slidebar { background-color: #222; }

/* LEFT SLIDEBAR */
.sb-left, .sb-right { -webkit-backface-visibility: hidden; }
.sb-menu li img { margin: 14px;}
.sb-left small { color: #666; padding-left: 62px; font-weight: 400; }

/* RIGHT SLIDEBAR */
aside#about-side { padding: 20px 14px 90px 20px; font-weight: 400; color: #bbb; }
.sb-right { margin-top: 60px!important; }
.sb-right h3 {color: #f5f5f5; }

/*--------------------------------*/
/*	SLIDEBAR MENU
/*--------------------------------*/

.sb-menu {
	padding: 0;
	margin: 50px 0 0;
	margin-top: 60px;
	list-style-type: none;
	font-weight: 400;
}
.sb-menu li {
	width: 100%;
	padding: 0;
	margin: 0;
	border-top: 4px solid rgba(255, 255, 255, 0.1); 
	border-bottom: 1px solid rgba(0, 0, 0, 0.1); 
}
.sb-menu > li:first-child { border-top: none; }
.sb-menu > li:last-child { border-bottom: none; }

.sb-menu li a {
	width: 100%; 
	display: inline-block;
	padding: 0.5em 0em 0.5em 15px;
	color: #f5f5f5;
}
.sb-menu li a:hover {
	text-decoration: none;
	background-color: rgba(255, 255, 255, 0.05); 
}
.sb-left .sb-menu li a { border-left: 3px solid transparent; }
.sb-left .sb-menu li a:hover { border-left: 3px solid #E84E41; }

/**** SUB MENU ****/

.sb-submenu {
	display: none;
	padding: 0;
	margin: 0;
	list-style-type: none;
	background-color: rgba(255, 255, 255, 0.05); 
}
/**** CARET ****/

span.sb-caret {
	width: 0;
	height: 0;
	display: inline-block;
	margin: 0 5px;
	border: 5px solid transparent;
}
span.sb-caret { border-top: 5px solid; border-bottom: none; }
.sb-submenu-active > span.sb-caret { border-top: none; border-bottom: 5px solid; }

/*-----------------------------------------------------------------------------------*/
/*	05: HOME SECTION 
/*-----------------------------------------------------------------------------------*/	

#home{
	position: relative;
	width: 100%;
	height: 100%;
	background-size: 100%;
	background: url(../img/home_tiny.png) 50% 0%  no-repeat;
	background-position: top center;
	-webkit-background-size: cover!important; 
    -moz-background-size: cover!important;  
    -o-background-size: cover!important; 
    background-size: cover!important;
	padding: 0 0;
}

#content {
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
	left: 1%;
	right:1%;
	z-index:1;
	text-align:center;
}

.logo {
	padding-bottom:30px;
	padding-top:0px;
}

.title h1 {font-family: 'Lato', sans-serif!important;
	padding: 0 0 0.5em;
	color: #fff;
	font-weight: 800;
	letter-spacing: 0rem;
	font-size: 3.25em;
	margin: 0 auto;
}
.title p {
	color: #fff;
	padding: 0 0 0.6em;
	font-weight: 400;
	font-size: 1.75em;
}
.title h1, .title p.subline { line-height: 1; }

.title i { color: #fff; }

/*--------------------------------*/
/*	DVDSHELF BUTTONS
/*--------------------------------*/

.btn-dvdshelf, .btn-dvdshelf-blog{
    display: inline-block;
    margin: 0px 0px 0px 0px;
	width: 30px;
	height: 240px;
	background: none;
	color: #333;
	border-radius: 12px;
   	padding: 0em 0em;
    letter-spacing: .05rem;
    text-decoration: none;
    cursor: pointer;
    -webkit-transition: .2s;
	transition: .2s;
}
.btn-dvdshelf-blog{ padding: .5em 1.2em!important;font-size: 12px; }
.btn-dvdshelf:hover, .btn-dvdshelf:hover { background: #B93826!important; }

.btn-dvdshelf2, .btn-dvdshelf2-blog{
    display: inline-block;
    margin: 0px 0px -1px 0px;
	width: 20px;
	height: 188px;
	background: none;
	color: #333;
	border-radius: 12px;
   	padding: 0em 0em;
    letter-spacing: .05rem;
    text-decoration: none;
    cursor: pointer;
    -webkit-transition: .2s;
	transition: .2s;
}
.btn-dvdshelf2-blog{ padding: .5em 1.2em!important;font-size: 12px; }
.btn-dvdshelf2:hover, .btn-dvdshelf2:hover { background: #B93826!important; }

.img-dvdshelf {
    /* position:relative; */
	display:inline-block;
	background-image:url(../img/home_shelf.png);
	height: 260px;
	width: 225px;
}

.img-dvdshelf_sidebar {
    /* position:relative; */
	display:inline-block;
	background-image:url(../img/home_shelf_sidebar.png);
	height: 260px;
	width: 116px;
}

/*--------------------------------*/
/*	ENTCAST BUTTONS
/*--------------------------------*/

.btn-entcast, .btn-entcast-blog{
    display: inline-block;
    margin: 0px 0px 0px 0px;
	font-size: 13px;
	font-weight: 700;
	width: 120px;
	height: 135px;
	background: none;
	color: #333;
	/* border: 1px solid rgba(0,0,0,0.5); */
	border-radius: 12px;
   	padding: 0em 0em;
    letter-spacing: .05rem;
    text-decoration: none;
    cursor: pointer;
    -webkit-transition: .2s;
	transition: .2s;
}
.btn-entcast-blog{ padding: .5em 1.2em!important;font-size: 12px; }
.btn-entcast:hover, .btn-entcast:hover { background: #B93826!important; }


/*-----------------------------------------------------------------------------------*/
/*	06: ABOUT SECTION
/*-----------------------------------------------------------------------------------*/	

/*--------------------------------*/
/*	SERVICE ICONS
/*--------------------------------*/
.service {
	text-align: center;
	margin: 0px auto;
	position: relative;
	width: 120px;
	height: 120px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}
.big { font-size:60px; margin-top: 30px; color: #fff; }
.service:hover, .service2:hover { background: #2E3138!important; }

/*--------------------------------*/
/*	TEXT ROTATOR
/*--------------------------------*/

#rotator { 
	background: #2E3138;
	position: relative;
	width: 100%;
	height:100%;
	min-height: 160px;
	padding: 80px 0; 
}	
.text-rotator-fade { font: 300 40px/0px 'Lato', sans-serif; color: #fff; letter-spacing: 1px; }

/*--------------------------------*/
/*	PIE CHARTS
/*--------------------------------*/

#charts { 
	background: url(../img/gallery/charts.png) 50% 0%  no-repeat;
	background-position: center center;
	-webkit-background-size: cover!important; 
    -moz-background-size: cover!important;  
    -o-background-size: cover!important; 
    background-size: cover!important;
	position: relative;
	width: 100%;
	height: 100%;
	background-size: 100%;
	padding: 0 0 30px;
}

#charts  h1 {
	font: 20px/60px 'Lato', sans-serif;
	margin: 60px auto 50px;
	letter-spacing: 2px!important;
	text-align: center;
	text-transform: uppercase;
	color: #eee!important;
}

.chart1, .chart2, .chart3 {
	position: relative;
	display: inline-block;
	width: 140px;
	height: 140px;
	text-align: center;
}

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

.percent { 
	position: absolute;
	display: inline-block;
	margin: 0px auto;
	z-index: 2;
	color: #eee;
	left: 40%;
	top: 40%;
	font-weight: 400;
	font-size: 18px; 
}
.pie p { color: #eee; padding: 10px 0 60px; font-weight: 700; letter-spacing: 2px; }


/*-----------------------------------------------------------------------------------*/
/*	07: VIDEO SECTION
/*-----------------------------------------------------------------------------------*/	

#video { 
	position: relative;
	width: 100%;
	height: 100%;
	padding: 80px 0;
}
#video h1 { font:700 80px/70px 'Lato', sans-serif;  color: #eee; /*text-align:center!important;*/ text-align:center; margin-top:-5px; letter-spacing: -0.2rem; }
#video p { font-weight: 400; color: #eee; }

#trailers { 
	position: relative;
	width: 100%;
	height: 100%;
	padding: 80px 0;
}
#trailers h1 { font:700 80px/70px 'Lato', sans-serif;  color: #eee; /*text-align:center!important;*/ text-align:center; margin-top:-5px; letter-spacing: -0.2rem; }
#trailers p { font-weight: 400; color: #eee; }

#entertainers { 
	position: relative;
	width: 100%;
	height: 100%;
	padding: 80px 0;
}
#entertainers h1 { font:700 80px/70px 'Lato', sans-serif;  color: #eee; /*text-align:center!important;*/ text-align:center; margin-top:-5px; letter-spacing: -0.2rem; }
#entertainers p { font-weight: 400; color: #eee; }

#entcast { 
	position: relative;
	width: 100%;
	height: 100%;
	padding: 80px 0;
}
#entcast h1 { font:700 80px/70px 'Lato', sans-serif;  color: #eee; /*text-align:center!important;*/ text-align:center; margin-top:-5px; letter-spacing: -0.2rem; }
#entcast p { font-weight: 400; color: #eee; }

#entsoundtrack { 
	position: relative;
	width: 100%;
	height: 100%;
	padding: 80px 0;
}
#entsoundtrack h1 { font:700 80px/70px 'Lato', sans-serif;  color: #eee; /*text-align:center!important;*/ text-align:center; margin-top:-5px; letter-spacing: -0.2rem; }
#entsoundtrack p { font-weight: 400; color: #eee; }

#joezopp { 
	position: relative;
	width: 100%;
	height: 100%;
	padding: 80px 0;
}
#joezopp h1 { font:700 80px/70px 'Lato', sans-serif;  color: #eee; /*text-align:center!important;*/ text-align:center; margin-top:-5px; letter-spacing: -0.2rem; }
#joezopp p { font-weight: 400; color: #eee; }

#zoppcast { 
	position: relative;
	width: 100%;
	height: 100%;
	padding: 80px 0;
}
#zoppcast h1 { font:700 80px/70px 'Lato', sans-serif;  color: #eee; /*text-align:center!important;*/ text-align:center; margin-top:-5px; letter-spacing: -0.2rem; }
#zoppcast p { font-weight: 400; color: #eee; }

#work { 
	position: relative;
	width: 100%;
	height: 100%;
	padding: 80px 0;
}
#work h1 { font:700 80px/70px 'Lato', sans-serif;  color: #222; /*text-align:center!important;*/ text-align:center; margin-top:-5px; letter-spacing: -0.2rem; }
#work p { font-weight: 400; color: #222; }

#moviemakers { 
	position: relative;
	width: 100%;
	height: 100%;
	padding: 80px 0;
}
#moviemakers h1 { font:700 80px/70px 'Lato', sans-serif;  color: #222; /*text-align:center!important;*/ text-align:center; margin-top:-5px; letter-spacing: -0.2rem; }
#moviemakers p { font-weight: 400; color: #222; }

/*-----------------------------------------------------------------------------------*/
/*	08: MILESTONES
/*-----------------------------------------------------------------------------------*/	

#milestones { 
	background: url(../img/milestones.jpg) no-repeat;
	background-position: center center;
	-webkit-background-size: cover!important; 
    -moz-background-size: cover!important;  
    -o-background-size: cover!important; 
    background-size: cover!important;
	position: relative;
	width: 100%;
	height:100%;
	background-size: 100%;
	padding: 0 0 100px;
}

#milestones h1 {
	font:20px/60px 'Lato', sans-serif;
	margin: 60px auto 30px;
	letter-spacing: 2px!important;
	text-align: center;
	text-transform: uppercase;
	color: #eee!important;
}
.counter, .fig {
	font-size: 45px;
	color: #fff;
	font-weight: 700;
	text-align: center;
}

.count { text-align: center; margin-bottom: -12px; }
   
.light { 
	font-size: 14px;
	line-height: 25px;
	letter-spacing: 1px;
	font-weight: 400!important;
	padding: 20px 0 0px;
	margin: 0 auto;
	color: #fff;
}

/*-----------------------------------------------------------------------------------*/
/*	09: QUOTES / TESTIMONIALS SECTION
/*-----------------------------------------------------------------------------------*/	

#quotes { 
	background: url(../img/gallery/quotes.png) no-repeat;
	background-position: center center;
	-webkit-background-size: cover!important; 
    -moz-background-size: cover!important;  
    -o-background-size: cover!important; 
    background-size: cover!important;
	position: relative;
	width: 100%;
	height:100%;
	background-size: 100%;
	padding: 0 0 30px;
}
.carousel-caption h3 {
	font-size: 28px;
	line-height: 36px;
    font-weight: 700;
	margin-bottom: 10px;
	color: #eee;
}
#myCarousel .carousel-caption p { letter-spacing: 2px; font-weight: 400; }
#myCarousel .carousel-caption { text-shadow: 0 1px 1px rgba(0,0,0,.0); }
#myCarousel .item { background: transparent; text-align: center; height: 300px!important; }

/*-----------------------------------------------------------------------------------*/
/*	10: PRICING TABLES
/*-----------------------------------------------------------------------------------*/	

#pricing {margin: 0 auto;  text-align:center;}
.price-plan-top { background: #222; padding: 5px 0; margin-top: 15px; }

.price-plan h2 {
	color: #fff!important;
	letter-spacing: 4px;
	font-size: 15px;
	padding: 0 0 10px;
	text-transform: uppercase;
}
.dollar {
	font-size: 22px;
	line-height: 22px;
	top: -55px;
	right: 5px;
	font-weight: 400;
	position: relative;
}
.price .amt { font-size: 110px; line-height: 84px; font-weight: 700; }
.price .mo { font-size: 14px; text-transform: uppercase; letter-spacing: 1px; font-weight: 400;}

#pricing .info-wrapper { padding: 20px 0px; border-bottom: 0px solid #555; margin-bottom: 20px; }
#pricing .info-wrapper  ul li { font-size: 14px; border-bottom: 1px dashed #ddd; padding: 10px 0; }
#pricing .list-group { list-style-type: none; color: #222; font-weight: 400; }

/*--------------------------------*/
/*	CLIENTS
/*--------------------------------*/

#clients { background: url(../img/zopp_actors/thecast.jpg)   no-repeat;
	background-position: bottom center;
	-webkit-background-size: cover!important; 
    -moz-background-size: cover!important;  
    -o-background-size: cover!important; 
    background-size: cover!important;
	position: relative;
	width: 100%;
	height: 100%;
	background-size: 100%;
	padding: 25px 0;
}
#clients .lead { margin-bottom: 10px; }
#myCarousel2 .item { background: transparent; text-align: center; height: auto; }
#myCarousel2 .carousel-indicators li { background-color: #999; border: 0px none; }
#myCarousel2 .carousel-indicators .active, #myCarousel2 .carousel-indicators .focus { background-color: #444; border:0px none; }

/*-----------------------------------------------------------------------------------*/
/*	11: CONTACT SECTION
/*-----------------------------------------------------------------------------------*/

#contact {
	position: relative;
	width: 100%;
	height: 100%;
	background-size: 100%;
	background: url(../img/gallery/contact.png) 50% 0%  no-repeat;
	background-position: top center;
	-webkit-background-size: cover!important; 
    -moz-background-size: cover!important;  
    -o-background-size: cover!important; 
    background-size: cover!important;
	padding: 80px 0 40px;
}
#contact h1 { font:700 80px/70px 'Lato', sans-serif;  color: #eee; /*text-align:center!important;*/ text-align:center; margin-top:-5px; letter-spacing: -0.2rem; }
#contact p { font-weight: 400; color: #eee; }


/*--------------------------------*/
/*	CONTACT FORM
/*--------------------------------*/

.contact .form{
	font-size: 15px;
	color: #222;
	font-weight: 400;
	letter-spacing: 0.5px;
	width: 100%;
	height: auto;
	padding: 15px 15px 12px;
	margin-bottom: 18px;
	border:0px none;
}
.contact textarea {
	max-width: 100%;
	height: 189px!important;
	max-height: 189px!important;
}
input, textarea, button{
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
.contact button {
	margin-bottom: 0;
	background: #222;
	color: #fff!important;
	font-weight: 700!important;
}
.contact:active, .contact:focus {  outline: none; }
.contact button.contact-form-button:hover { background: #000; }

::-webkit-input-placeholder { color: #555; font-weight: 700; font-size: 13px; }
:-moz-placeholder { color: #555; font-weight: 700; font-size: 13px; }
::-moz-placeholder { color: #555; font-weight: 700; font-size: 13px; }
:-ms-input-placeholder { color: #555;  font-weight: 700; font-size: 13px; }
focus::-webkit-input-placeholder { color: transparent; }
#ajax-contact-form input:focus, #ajax-contact-form  textarea:focus { outline: none; }
input { outline: none; }

.notification_error {
	color: #fff;
	font-weight: 400;
	height: auto;
    margin: 0 auto 12px;
   text-align: center;
}

.notification_ok {
    color: #fff;
	font-weight: 400;
    margin: 0 auto 12px;
	text-align: center;
	font-size: 25px;
	line-height: 30px;
	width: 80%;
	clear: both; 	
}

/*--------------------------------*/
/*	CONTACT INFO SECTION
/*--------------------------------*/

#contact_info { padding: 60px 0; background: #fff;  }	
#contact_info .lead { text-align: left; margin: 3px 0 15px; letter-spacing: -.05rem!important; }

/*--------------------------------*/
/*	MAP
/*--------------------------------*/

#google-container {
 	position: relative;
	width: 100%;
	height: 500px;
	border-top: 10px solid #eee;
	border-bottom: 10px solid #eee;
}
#google-map { position: relative; }

#zoom-in, #zoom-out {
  	height: 32px;
	width: 32px;
	cursor: pointer;
	margin-left: 10px;
	background-color: rgba(211, 104, 104, 0.9);
	background-repeat: no-repeat;
	background-size: 32px 64px;
	background-image: url("../img/icon-controller.svg");
}
.no-touch #zoom-in:hover, .no-touch #zoom-out:hover { background-color: #d36868; }
#zoom-in { background-position: 50% 0; margin-top: 10px; margin-bottom: 1px; }
#zoom-out { background-position: 50% -32px; }

/*-----------------------------------------------------------------------------------*/
/*	12: FOOTER SECTION
/*-----------------------------------------------------------------------------------*/

.footer {
	background: #222;
	margin: 0px auto;
    padding: 50px 0 40px;
    text-align: center;
	position: relative;
}

#copyright {
	font-size: 13px;
	font-weight: 400;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-align: center;
	color: #bbb;
    margin: 15px auto;
    padding: 0 0;
	line-height: 30px;
}

/*--------------------------------*/
/*	SOCIAL ICONS
/*--------------------------------*/

.social-icons { font-size: 40px; margin: 20px auto; text-align: center;}
.social-icons a { margin: 0px 10px; }

.social-icons_sidebar { font-size: 24px; margin: 10px auto; text-align: left; padding-left:6px; }
.social-icons_sidebar a { margin: 0px 5px; }

/*--------------------------------*/
/*	BACK TO TOP LINK
/*--------------------------------*/

.go-top {
	position: fixed;
	bottom: 1em; right: 1em;
	text-decoration: none;
	color: white;
	background-color: rgba(0, 0, 0, 0.2);
	font-size: 20px;
	padding: 0.65em 0.8em;
	display: none;
	border-radius: 3px;
	z-index: 500;
}
.go-top:hover { background-color:rgba(0, 0, 0, 1.0);}

/*-----------------------------------------------------------------------------------*/
/*	13: SINGLE TEAM PAGES
/*-----------------------------------------------------------------------------------*/	

/**** SERVICE/SKILL ICONS ****/
.service2 {
	text-align: center;
	margin: 25px 0 0 -5px;
	position: relative;
	width: 80px;
	height: 80px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}
.big2 { font-size: 40px; margin-top: 20px; color: #fff; }
.thin { font-weight: 300; color: #555; }

/**** PROGRESS BARS ****/
.bars-wrapper { padding: 0 0; font-weight: 400; margin: 0px 0 25px 0; }
.bars-wrapper .progress { height: 10px; background:#ddd; border-radius:0px; box-shadow: none; margin:3px 0 12px; }
.bars-wrapper .progress-bar { box-shadow: none; }
.bars-wrapper .progress:last-child { margin-bottom: 0; }

/*-----------------------------------------------------------------------------------*/
/*	14: BLOG
/*-----------------------------------------------------------------------------------*/

h1.blog-title, h1.blog-title-grid { 
	font-size: 2.6em;
	line-height: 1em;
	margin-bottom: 10px;
	margin: 20px 0 10px;
	letter-spacing: 0px!important;
	text-align: left;
	font-weight:7 00;
} 

h1.blog-title a, h1.blog-title-grid a { color: #333; } 
h1.blog-title a:hover, h1.blog-title-grid a:hover { color: #888; }
h6.meta { margin-bottom: 25px; }
.post { margin: 30px 0 0px; } 

/**** GRID BLOG ****/

.grid-post { margin: 0px 0 30px; } 
h1.blog-title-grid { font-size: 1.3em; } 
h6.meta-small { margin-bottom: 15px;font-size: 14px; }
.grid-post img:hover { 
	opacity: 0.9;
	-moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
} 

/**** PAGINATION ****/

.pagination { display: block; }
.pagination ul {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    list-style: none;
    padding: 0;
    margin: 60px 0 0;
}
.pagination ul > li { display: inline-block; margin-right: 2px; }
.pagination ul > li > a, .pagination ul > li > span {
    float: none;
    background: none;
    color: #444 !important;
    border: 1px solid rgba(0,0,0,0.5);
    text-transform: uppercase;
    font-weight: 700;
    font-size: 12px;
    padding: 10px 12px;
}

/*--------------------------------*/
/*	SIDEBAR
/*--------------------------------*/

h5.sidebar { margin-bottom:20px; font-weight: 700;color: #333;  }
.subscribe { text-align:left;  margin: 30px 0 10px; } 
.btn.sub {margin: 20px 0 10px!important ;}
.sidebar li a { color: #000; }

/* SEARCH */

 input[type="text"].form-control, input[type="search"] .form-control {
	 border: 1px solid rgba(0,0,0,0.5);
	font-weight:700;
	width:100%;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}
.form-control::-webkit-input-placeholder { color:#666!important; font-weight:400; }
.form-control:-moz-placeholder { color:#666!important;  font-weight:400;  }
.form-control::-moz-placeholder { color:#666!important;  font-weight:400; }
.form-control:-ms-input-placeholder { color:#666!important;  font-weight:400; }

/* TAGS */

ul.tags { padding: 0; margin: 0; list-style: none; }
ul.tags li {
    padding: 0;
    margin: 0;
    display: inline-block;
    margin-right: 2px;
    margin-bottom: 8px;
    background: none;
}
ul.tags li a {
    padding: 0;
    margin: 0;
    color: #444;
    border: 1px solid rgba(0,0,0,0.5);
    display: inline-block;
    padding: 5px 10px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}
ul.tags li a:hover { text-decoration: none; }

/* POPULAR POSTS */

.media-heading { font-size: 15px; }
.media-body { font-size: 13px; }
.media-list { margin: 30px 0 0px; }

/*--------------------------------*/
/*	SINGLE POST
/*--------------------------------*/

/* AUTHOR */

div.author-block { 
	margin-top: 60px;
	padding: 20px 50px 0px 0px;
	display: block;
	border-top: 1px solid rgba(0,0,0,0.1)
}
div.author-thumb { display:block; float: left; margin: 10px 20px 0px 0; }

/* COMMENTS */

.comments { margin-top: 65px; }
ul.comments { list-style: none; margin: 0; padding: 0; }
.comment-quote {
	padding: 0px 0px 10px;
	position: relative;
	margin-bottom: 0px;
}
.reply { font-size: 13px; margin-top: 3px; }
.date { color: #666; margin: 5px 0 10px 0; }
ul.comments li { clear: both; padding: 10px 0 0 115px; }
div.avatar { margin-left: -115px; margin-top: 5px; position: absolute; }

/* BLOG FORM */

#ajax-contact-form2  { width: 100%; margin: 20px 0 0; display: table; }
#ajax-contact-form2 input, #ajax-contact-form2 textarea{
	border: 1px solid rgba(0,0,0,0.35);
	color: #555;important;
	margin-bottom: 15px;
	padding: 8px 10px 8px;
	font-weight: 400;
	font-size: 15px;
}
#ajax-contact-form2 textarea { height: 180px; }
#ajax-contact-form2 input::-webkit-input-placeholder { color:#666!important; opacity:1.0; }
#ajax-contact-form2 input::-moz-placeholder { color:#666!important; opacity:1.0; }
#ajax-contact-form2 input:-ms-input-placeholder { color:#666!important; opacity:1.0; }
#ajax-contact-form2 textarea::-webkit-input-placeholder { color:#666!important; opacity:1.0; }
#ajax-contact-form2 textarea::-moz-placeholder { color:#666!important; opacity:1.0; }
#ajax-contact-form2 textarea:-ms-input-placeholder { color:#666!important; opacity:1.0; }

/*-----------------------------------------------------------------------------------*/
/*	15: ACCORDION & TABS
/*-----------------------------------------------------------------------------------*/
#features{
	position: relative;
	width: 100%;
	height:100%;
	background-size: 100%;
	background-position: top center;
	-webkit-background-size: cover!important; 
    -moz-background-size: cover!important;  
    -o-background-size: cover!important; 
    background-size: cover!important;
	padding: 0 0;
}
#features .lead, #features h1 { color: #eee!important; }

/*--------------------------------*/
/*	ACCORDIAN
/*--------------------------------*/
.panel-group { margin-bottom:25px; }
.panel, .panel-collapse { border:0!important; box-shadow:none!important; background-color:transparent; }
.panel-heading { padding: 10px 0px; background:transparent!important;  }
.panel-heading a { font-size:15px; color:#FFCC33; font-weight:400; }
.panel-body {padding:0 20px;  border:0!important; height: 400px; overflow:scroll; }

/*--------------------------------*/
/*	TABS
/*--------------------------------*/
div.tabs { margin: 20px 0 25px; }
div.tabs div.tab-content { border-top: 1px solid rgba(0,0,0,0.5); padding: 10px 0px 0px 0px; }
div.tabs ul.nav-tabs { border: 0; margin: 0 0 5px; font-size: 16px; text-align: center; }
div.tabs ul.nav-tabs a {
	border: 0;
	color: #fff!important;
	margin-right: 20px;
	padding: 0px 0px 10px;
	text-align: center;
}
div.tabs ul.nav-tabs a:active, div.tabs ul.nav-tabs a:hover, div.tabs ul.nav-tabs a:focus { border: 0!important; background: transparent!important;}
div.tabs ul.nav-tabs2 { border: 0; margin: 0 0 5px; font-size: 16px; }
div.tabs ul.nav-tabs2 a {
	border: 0;
	color: #fff!important;
	margin-right: 20px;
	padding: 0px 0px 10px;
}
div.tabs ul.nav-tabs2 a:active, div.tabs ul.nav-tabs2 a:hover, div.tabs ul.nav-tabs2 a:focus { border: 0!important; background: transparent!important;}

.entcast-text{ padding: 20px 50px 0px 50px; height: 400px; overflow: scroll; }
.entcast2-text{ padding: 20px 0px 0px 0px; }

/*-----------------------------------------------------------------------------------*/
/*	16: MEDIA QUERIES
/*-----------------------------------------------------------------------------------*/

@media screen and (min-width: 768px) {
#logo { text-align: left; }
#zoom-in, #zoom-out { margin-left: 50px; }
#zoom-in { margin-top: 50px; }
}

@media screen and (max-width: 480px){
h1 { font-size: 75px; line-height: 75px;}
.lead { font-size: 28px!important; line-height: 38px!important; letter-spacing: 0px!important; }
#single h1 { font-size: 40px!important; line-height: 40px!important; }
#single .lead { font-size: 20px!important; line-height: 30px!important; margin: 0 0 20px; }
.cbp-popup-singlePage-counter { display: none!important; }
#filters-container { display:none!important; }
}

@media all and (min-width: 321px) and (max-width: 568px) {
#charts h1, #milestones h1{ font-size: 20px; line-height: 60px; }
.logo { margin: 0px auto -40px!important; }
#content { margin:10px auto 0px!important; }
.title i { display:none!important; }
}

@media screen and (max-width: 47em) {
.logo { margin: 40px auto -40px!important; }
.title h1 { font-size: 1.9em!important; }
.title i { font-size: 1.5em!important; }
p.subline  { font-size: 1.0em!important; }
.title { padding-top: 20px!important; }
.carousel-caption h3 { font-size: 22px; line-height: 35px; }
.carousel-control { top: 40%; margin-left: -5px!important; margin-right: -5px!important; }
.text-rotator-fade { font-size: 100%; font-weight: 400; }
#google-container { height: 300px; }
ul.comments li li{ clear:both; padding:10px 0 0 0px; }
.light { margin: 0 auto 50px!important; }
}