/* 01 General Media Query (iPhone, iPad, Small Tablet, 979 / 80 px)
=============================================================== */
@media (max-width: 980px) { 

/* HOMEPAGE CSS BOC
-------------------------------------------------------------- */
.testimonial .carousel-indicators { right:20px; top:35%; } 
footer .copyright p { font-size:13px; }
} 

/* 02 iPad & Small Tablet (Portrait) (768 * 1024)
============================================================== */
@media (min-width: 768px) and (max-width: 979px) {

/*** Global Classes CSS BOC ***/
body { font-size:15px; }
h4 { font-size:25px; }	
h6 { font-size:17px; }	
section { padding-top:35px; padding-bottom:35px; }	
	
	/*** Navigation CSS BOC ***/
	header .navbar-header, header .navbar-nav, header .navbar-nav > li, header .navbar-brand { float: none; text-align:center; }
	header .navbar-default .navbar-nav > li > a { padding:10px; font-size:15px;  }
	header .navbar-nav { text-align: center }
	header .navbar-nav > li, header .navbar-brand > img { display:inline-block; }
	header .navbar-brand > img { max-width:30%; }

/*** Header CSS BOC ***/
header .banner .punchline { font-size:75px; }	
header .banner .display-table { height:75vh; }
.banner .banner-particle .display-table { height:75vh; }	
.banner .banner-particle canvas { height:75vh !important; }	
header .banner .carousel-indicators { right:15px; }	
	
/* HOMEPAGE CSS BOC
-------------------------------------------------------------- */
.why-us .flex, .service .flex { display:block; }
.why-us .key-offer .line-seprator { margin:20px 0; width:auto; }
.why-us article { padding:35px; }
.why-us figure, .service figure { height:300px; }	
.features ul.features-listing li .item { height:194px; }
.portfolio ul.portfolio-listing li .porfolio-content img { margin:15% auto 8px; }	
.statistics ul.state-data li h6 { font-size:14px; }	
.contact-us .flex { display:block; }
.our-team .carousel-inner > .item .team-thumbnail { margin:0 auto 7px; }
}

/* 03 All Mobile Device (iPhone, Android, Window)(480 * 640)	
============================================================== */
@media (max-width: 767px) {
	
/*** Global Classes CSS BOC ***/
body { font-size:15px; }
p { text-align:center; padding-top:3px; padding-bottom:3px; margin-bottom:8px; }
ul li { display:block; }	
.btn { width:100%; font-size:17px; }
.flex { display:block; }
section { padding-top:35px; padding-bottom:35px; }
hr { margin:15px auto; }
.lead { font-size:15px; margin-bottom:10px; }	

/*** Heading CSS BOC ***/
h1, h2, h3, h4, h5, h6 { line-height:1.3; text-align:center; }	
h1 { font-size:45px; }
h2 { font-size:40px; }
h3 { font-size:35px; }	
h4 { font-size:30px; }	

/*** Image CSS BOC ***/
img, .img-left, .img-right { float:none; margin:0px auto; display:block; text-align:center; } 
img.left-in-mob { float: left !important; margin-right: 15px !important; } 
img.right-in-mob { float:right !important; margin-left:15px !important; } 

/*** Header CSS BOC ***/
header .banner .punchline { font-size:50px; width:95%; }
header .banner h4 { font-size:20px; margin:20px auto;}	
header .banner .carousel-indicators { right:20px; top:45%; }	
	
	/*** Navigation CSS BOC ***/
	header .navbar-default { background:#131416; padding-bottom:0; }
	header .navbar-brand { padding:0; }
	header .navbar-brand img { max-width:70%; }
	header .navbar-nav { float:none; }
	header .navbar-default .navbar-toggle { border-color:#ff5e5e; -moz-transition:all .6s ease-in-out 0s; -webkit-transition:all .6s ease-in-out 0s; -o-transition:all .6s ease-in-out 0s; 
		-ms-transition:all .6s ease-in-out 0s; transition:all .6s ease-in-out 0s; background:none; margin-top:0; }
	header .navbar-default .navbar-toggle .icon-bar { background:#ff5e5e; }
	header .navbar-default .navbar-collapse { border-color:transparent;}
	
		/* Hover State CSS BOC */
		header .navbar-default .navbar-toggle:focus, header .navbar-default .navbar-toggle:hover, header .navbar-default .navbar-toggle:active { background:#ff5e5e; }
		header .navbar-default .navbar-toggle:hover .icon-bar, header .navbar-default .navbar-toggle:focus .icon-bar, header .navbar-default .navbar-toggle:active .icon-bar { background:#fff; }

/* HOMEPAGE CSS BOC
-------------------------------------------------------------- */
.why-us figure, .service figure { height:300px; background-position:center center; }
.why-us .key-offer .item .icon { float:none; display: block; margin:20px auto; }
.why-us .key-offer .item p { text-align:center; }	
.why-us .key-offer .line-seprator { width:auto; margin:20px auto;}
.features ul.features-listing li .item { margin-bottom:20px; }
.service ul.service-listing li:nth-child(2), .service ul.service-listing li:nth-child(4)  { background:#f7f7f7; }
.service ul.service-listing li, .service ul.service-listing li:nth-child(3) { background:#ebebeb; }
.blog ul.blog-listing { margin-top:15px; }
.blog ul.blog-listing li .item { margin-bottom:25px; }	
.blog ul.blog-listing li .item img { width:100%; }	
.filter-tab { margin:15px auto; }	
.filter-tab .btn { width:auto; margin:0 5px 10px; font-size:15px; }	
.testimonial .carousel-inner > .item p { font-size:15px; }
.testimonial .carousel-inner > .item h6 { font-size:14px; }
.contact-us .contact-form, .our-team, .get-in-touch { padding:35px 15px; }
.contact-us .contact-form .btn { width:100%; margin-top:20px; }
.our-team .carousel-inner > .item .team-thumbnail { width:150px; height:150px; }
.get-in-touch ul.address-listing li p, .get-in-touch ul.address-listing li a { font-size:15px; line-height:normal; }
footer .summary p { text-align:center; }
footer ul.social-listing li a { font-size:22px; }
.back-top #toTop { position:relative; display:block; }

/* DEMO PAGE CSS BOC 
-------------------------------------------------------------- */
.banner .intro-page-header .intro-header { padding-top:50px; padding-bottom:50px; }
.intro-header img { margin-bottom:10px;	}
.intro-header h1, .page-info h1 { font-size:25px; }
.page-support ul.support-lisitng li { margin-bottom:25px; }
.page-support ul.support-lisitng li:last-child { margin-bottom:0; }
.page-buy .btn { width:auto }
}

/* 04 All Mobile Device (iPhone, Android, Window)(480 * 640)
============================================================== */
@media (min-width:320px) and (max-width:480px) { 

/*** Global Classes CSS BOC ***/
h1 { font-size:40px; }
h2 { font-size:35px; }
h3 { font-size:30px; }	
h4 { font-size:25px; }
h5 { font-size:20px; }
	
/*** Header CSS BOC ***/
header .banner .punchline { font-size:25px; width:90%; }	
header .banner .carousel-indicators { left:0; right:0; top:auto; bottom:60px; width:auto; margin: 0 auto;}	
	
/* HOMEPAGE CSS BOC
-------------------------------------------------------------- */
.welcome h1 { font-size:27px; }	
.why-us article { padding:35px 15px; }
.features ul.features-listing li.col-xs-6 { width:100%; }
.portfolio ul.portfolio-listing li .porfolio-content img { margin:15% auto 8px; }		
}

/* 05 iPad & Small Tablet Landscape (1024 * 768)  	
============================================================== */
@media (min-width: 979px) and (max-width: 1200px) { 

/*** Header CSS BOC ***/
header .navbar-default .navbar-nav > li > a { font-size:16px; padding:8px; }	
header .banner .carousel-indicators { right:15px; }		
	
/* HOMEPAGE CSS BOC
-------------------------------------------------------------- */
.features ul.features-listing li .item { height:213px; }	
.portfolio ul.portfolio-listing li .porfolio-content img { margin:15% auto 8px; }	
.statistics ul.state-data li h6 { font-size:18px; }	
.contact-us .contact-form, .our-team { padding:70px 15px; }
.get-in-touch { padding:90px 15px; }
.get-in-touch ul.address-listing li p, .get-in-touch ul.address-listing li a { line-height:25px; font-size:16px; }	
.our-team .carousel-inner > .item .team-thumbnail { width:190px; height:190px; }
}

/* 06 Large Desktop (1920)  	
============================================================== */
@media (min-width: 980px) and (max-width:1023px) { 

/*** Global Classes CSS BOC ***/	
h6 { font-size:17px; }		
	
/*** Header CSS BOC ***/
header .banner .punchline { font-size:50px; }	
header .banner .display-table { height:65vh; }	
.banner .banner-particle canvas { height:65vh !important; }

	/*** Navigation CSS BOC ***/
	header .navbar-header, header .navbar-nav, header .navbar-nav > li, header .navbar-brand { float: none; text-align:center; }
	header .navbar-default .navbar-nav > li > a { padding:10px; font-size:15px;  }
	header .navbar-nav { text-align: center }
	header .navbar-nav > li, header .navbar-brand > img { display:inline-block; }

/* HOMEPAGE CSS BOC
-------------------------------------------------------------- */
.features ul.features-listing li .item { height:240px; }	
.statistics ul.state-data li h6 { font-size:14px; }	
.our-team .carousel-inner > .item .team-thumbnail { margin:0 auto 7px; }
.contact-us .col-sm-12 { width:50%;  }
}