/*
/* Version: 1.0 
*/
/*-------- CSS CODE FOR RESPONSIVE LAYOUT --------*/

/*  To make Responsive
---------------------------------------------------------------------- /
*	1 - media screen and (max-width: 1750px)
*   2 - media screen and (max-width: 1680px)
*   3 - media screen and (max-width: 1366px)
*   4 - media screen and (max-width: 1199px)
*   5 - media screen and (max-width: 991px)
*   6 - media screen and (max-width: 767px)
*   7 - media screen and (max-width: 680px)
*   8 - media screen and (max-width: 480px)
*   9 - media screen and (max-width: 320px)
*
---------------------------------------------------------------------- */

/*  1 - media screen and (max-width: 1750px)
---------------------------------------------------------------------- */
@media screen and (max-width: 1750px) { 
	.carousel-caption h3 {
		font-size: 40px;
	}
	.portfolio-heading .image-text  {
		/*display: none;*/
	}
	.portfolio-heading-txt {
	    padding-bottom: 70px;
	}
}
/*  1 - media screen and (max-width: 1750px) End
---------------------------------------------------------------------- */



/*  2 - media screen and (max-width: 1680px)
---------------------------------------------------------------------- */
@media screen and (max-width: 1680px) { 
	.video-frame5 span.text1 {
		display: none;
	}
	.slider-right {
		width: 645px;
	}
}
/*  2 - media screen and (max-width: 1680px) End
---------------------------------------------------------------------- */



/*  3 - media screen and (max-width: 1750px)
---------------------------------------------------------------------- */
@media screen and (max-width: 1366px) { 
	.slider-left {
		max-width: 740px; /* 60%; */
		padding: 0 35px;
	}
	.carousel-indicators {
	    left: 31%;
	}
	.news-sidebar a.custom-btn {
	    right: auto;
	    left: 0;
	    bottom: -40px;
	}
	.news-sidebar {
	    padding: 18px 18px 50px;
	}
	.video-frame3 span.title2 {
		display: none;
	}
	.filter-btn-container h2 {
		font-size: 36px;
	}
	.about-2 .office-news .owl-next {
	    right: 17.8%;
	}
}
/*  3 - media screen and (max-width: 1750px) End
---------------------------------------------------------------------- */



/*  4 - media screen and (max-width: 1199px)
---------------------------------------------------------------------- */
@media screen and (max-width: 1199px) { 
	.mm-pb {
		padding-left: 10px;
		text-align: center;
	}
	.main-menu .nav>li>a {
	    font-size: 13px;
	    padding: 35px 15px;
	}
	.slider-left {
	    width: auto;
	    max-width: 600px;
	    margin: 0 auto;
		margin-left: 40px;
	    float: none;
	}
	.slider-right {
	    position: static;
	    height: auto;
	    margin-bottom: 100px;
	    width: auto;
	    max-width: 600px;
	    margin: 0 auto;
	    float: none;
	}
	.carousel-indicators {
		/* top: 15%; Abdellah */
	}
	.single-item2 .item-text {
		margin-left: 0; 
	}
	.single-item3 .item-text {
	    margin-left: 107px;
	}
	.single-item4 .item-img a {
	    bottom: -61px;
	    left: 0px;
	}
}
/*  4 - media screen and (max-width: 1199px) End
---------------------------------------------------------------------- */


/*  5 - media screen and (max-width: 991px)
---------------------------------------------------------------------- */
@media screen and (max-width: 991px) { /* for medium device */

	/*  - Main Menu
	-----------------------------------------*/
	.mm-pb {
		padding-left: 10px;
		text-align: center;
	}
	.navbar-toggle {
        display: block;
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
   .navbar-collapse.collapse.in {  /* NEW */
        display: block!important; 
    }
	.navbar-nav .open .dropdown-menu {
		position: static;
		float: none;
		width: auto;
		margin-top: 0;
		background-color: transparent;
		border: 0;
		-webkit-box-shadow: none;
		box-shadow: none;
	}
	.main-menu .container {
		width: 100%;
	}
	.main-menu {
		padding: 4px 0 0 0;
	}
	.main-menu-container {
		min-height: 75px;
	}
	.main-menu .navbar>.container .navbar-brand, 
	.main-menu .navbar>.container-fluid .navbar-brand {
		width: 310px;
		padding: 5px 25px;
	}
	.main-menu .container>.navbar-header, 
	.main-menu .container-fluid>.navbar-header, 
	.main-menu .container>.navbar-collapse, 
	.main-menu .container-fluid>.navbar-collapse {
		width: 100%;
		padding: 0 0 36px 0;
	}
	.main-menu.sticky .container>.navbar-header,  
	.main-menu.sticky .container>.navbar-collapse,
	.main-menu.sticky .container-fluid>.navbar-header, 
	.main-menu.sticky .container-fluid>.navbar-collapse {
		width: 100%;
		padding: 0 0 7px 0;
	}
	.main-menu #main-nav > li {
		float: none;
		color: #737d8b;
		background-color: #292d39;
		border-top: 1px solid #353b4a;
	}
	#main-nav li:first-child {
		border: none;
	}
	.main-menu .nav>li>a {
		padding: 15px 20px;
	}
	.main-menu .navbar-nav {
		width: 100%;
		margin: 0;
	}
	.main-menu .navbar-default .navbar-nav>.active>a, 
	.main-menu .navbar-default .navbar-nav>.active>a:hover, 
	.main-menu .navbar-default .navbar-nav>.active>a:focus {
		color: #ffffff;
		background-color: #292d39;
	}
	.main-menu .navbar-default .navbar-nav>.active>a:hover, 
	.main-menu .navbar-default .navbar-nav>.active>a:focus {
		color: #ffffff !important;
	}
	.main-menu .navbar-default .navbar-nav>.open>a, 
	.main-menu .navbar-default .navbar-nav>.open>a:hover, 
	.main-menu .navbar-default .navbar-nav>.open>a:focus {
		color: #ffffff !important;
		background-color: #363b4a !important;
	} 
	.main-menu .navbar-default .navbar-nav>.active>a:hover,
	.main-menu .navbar-default .navbar-nav>li>a:hover {
		color: #ffffff !important;
		background-color: #3bab9b !important; /* #ff2130 !important; */
	}
	.navbar-fixed-top .navbar-collapse, 
	.navbar-fixed-bottom .navbar-collapse {
		max-height: 340px !important;
	}
	.navbar-collapse.in {
		overflow-y: auto !important;
	}
	.main-menu .navbar-nav .open .dropdown-menu>li>a {
		background-color: #292d39;
		padding: 10px 15px 10px 25px;
		line-height: 25px !important;
		border-color: #353b4a;
	}
	.menu-right {
		display: none;
	}
	.main-menu.sticky,
	.main-menu {
		position: fixed;
		width: 100%;
	}
	.main-menu.sticky .nav>li>a,
	.main-menu .nav>li>a {
		width: 100%;
	}
	/*  - Main Menu End
	-----------------------------------------*/

	/*  - Serch bar
	-----------------------------------------*/
	.search-bar .btn {
		color: #ff2130;
	}
	.search-bar {
		top: 30px;
		right: 10px;
	}
	.navbar-form .form-group {
	  	margin-top: 16px;
	}
	.main-menu.sticky .search-bar {
	    top: 17px;
	}
	.navbar-toggle {
		top: 17px;
	}
	.main-menu.sticky .navbar-toggle {
		top: 1px;
	}
	/*  - Serch bar End
	-----------------------------------------*/

	/*  - Main Menu End
	-----------------------------------------*/
	.gallery-owl-section .owl-item {
		font-size: 20px;
	}
	.froot-item {
		float: none;
	}
	.news-wrap h4.brand-mm2,
	.news-sidebar img,
	.list-item h3 {
		margin-left: 0;
	}
	.portfolio-heading-txt h1 {
	    font-size: 60px;
	}
	.caption-descp {
		font-size: 26px;
	}
	/*  - Portfolio
	-------------------------------------*/
	.portfolio .portfolio-heading-txt,
	.portfolio .content-wrapper,
	.portfolio .fish-footer {
	    max-width: 400px;
	    margin: 0 auto;
	}
	.box-content .extra-padding {
	    padding-bottom: 30px;
	}
	.mm-rr-before:before {
		top: -7px;
	    left: 10px;
	    border-top: none;
	    border-right: 8px solid transparent;
	    border-left: 8px solid transparent;
	    border-bottom: 8px solid #fff;
	}
	.mm-lr-after:after {
	    top: auto;
	    bottom: -7px;
	    right: auto;
	    border-top: 8px solid #fff;
	    border-left: 8px solid transparent;
	    border-right: 8px solid transparent;
	    border-bottom: none;
	}
	/*  - Portfolio 2
	-------------------------------------*/
	.image-text.mm-ex-padding {
	    padding: 30px 20px;
	}
	.portfolio-filter-box1,
	.portfolio-filter-box3 {
		display: none;
	}
	.portfolio-filter-box2 {
		width: 100%;
	}
	/*  - Portfolio Service
	-------------------------------------*/
	.illustration  .wrap-box {
		max-width: 400px;
		margin: 0 auto;
		padding-bottom: 50px;
	}
	.illustration .inner-box {
		padding-top: 0;
	}
	.illustration .inner-box img {
		margin-left: 0; 
		margin-bottom: 30px; 
	}
	.illustration .wrap-box img {
		width: 100%;
	}
	.illustration .wrap-box h3 {
		margin-left: 0;
	}
	/*  - Portfolio Service 2
	-------------------------------------*/
	.single-item3 .item-img img,
	.single-item .item-img img {
	    padding-left: 55px;
	}
	.mm-left {
    	margin-left: 0;
    	position: static;
    	padding-bottom: 15px;
	}
	.single-item .item-text {
	    margin-top: -30px;
	    margin-left: 0;
	}
	.single-item3 .item-text {
	    margin-left: 0;
	}
	/*  - Portfolio Single Page
	-------------------------------------*/
	.related-post {
		padding-bottom: 100px;
	}
	.single-post-content .single-post .post-img {
		float: none;
	}
	.single-post-content .single-post .post-text {
		padding-top: 30px;
	}
	.related-post .fish-footer-img .inner-box {
		bottom: 0;
	}
	.single-portfolio .fish-footer {
	    max-width: 370px;
	    margin: 0 auto;
	}
	/*  - About Page
	-------------------------------------*/
	.about-head .big-text h1 {
	    margin-top: -130px;
	}
	.about h4.brand-mm {
		padding-left: 0;
	}
	.about-filter-btn h2 {
	    padding-left: 15px;
	}
	/*  - About Page 2
	-------------------------------------*/
	.about-2 .office-news .owl-carousel .owl-wrapper-outer {
		margin-left: 0;
	}

	/*  - Blog Page 
	-------------------------------------*/
	.widget.blog-tab-content {
	    display: block;
	    margin-bottom: 50px;
	}
	#mainContentTab .post-container {
		padding-top: 0;
		padding-right: 0;
	}
	.widget.blog-tab-widget {
	    display: none;
	}
	.sidebar {
		margin-top: 100px;
    	margin-bottom: 100px;
	}
	.small-post .link {
		bottom: 0;
	}
	.single ul.nav-tabs li.active:after {
		bottom: -7px;
	}
	.single ul.nav-tabs {
		margin-bottom: 50px;
	}
	.single .widget ul li a {
		border-bottom: none;
	}
	.single a.custom-btn,
	.blog a.custom-btn {
		padding: 7px 10px;
		margin-bottom: 5px;
	}
}
/*  5 - media screen and (max-width: 991px) End
---------------------------------------------------------------------- */


/*  6 - media screen and (max-width: 767px)
---------------------------------------------------------------------- */
@media screen and (max-width: 767px){ /*For Mobile Device*/

	.navbar-default .navbar-toggle {
		margin-right: 0;
	}
	.main-menu .navbar>.container .navbar-brand, 
	.main-menu .navbar>.container-fluid .navbar-brand {
		width: 310px;
	}
	.container>.navbar-header, 
	.container-fluid>.navbar-header, 
	.container>.navbar-collapse, 
	.container-fluid>.navbar-collapse {
		margin-left: 0;
	}
	.navbar-form .form-group {
	  	margin-top: 2px;
	}
	.search-bar {
		display: none;
	}
	.news {
	    padding: 62px 45px 15px;
	}
	.nav-tabs>li {
	    margin-bottom: 10px;
	    margin-right: 10px;
	}
	/* - Slider 
	-------------------------------------*/
	.carousel-indicators {
		top: 30%;
		width: 100%;
	}
	/*  - Portfolio Service 2
	-------------------------------------*/
	.service2 .single-item, 
	.service2 .single-item2, 
	.service2 .single-item3, 
	.service2 .single-item4 {
		width: 100%;
	}
	.service2 .single-item .item-img img, 
	.service2 .single-item2 .item-img img, 
	.service2 .single-item3 .item-img img,
	.service2 .single-item4 .item-img img {
		width: 100%;
	}	
	.mm-pb {
		padding-left: 0;
		text-align: center;
	}
	.single-item3 .item-img img,
	.single-item .item-img img {
	    padding-left: 0;
	}
	.about-2 #about-img .owl-item.active {
		padding: 0;
		margin-top: 0;
	}
	.about-2 #about-img .owl-item {
		opacity: 1;
	}
	.about-2 .about-img-slider .owl-carousel .owl-wrapper-outer {
		padding-top: 0;
	}
}
/*  6 - media screen and (max-width: 767px) End
---------------------------------------------------------------------- */


/*  7 - media screen and (max-width: 680px)
---------------------------------------------------------------------- */
@media screen and (max-width: 680px){ 
	.carousel-caption h3 {
	    font-size: 55px;
	}
	.carousel-caption h3 {
	    font-size: 55px;
	}
	.sub-head {
		font-size: 14px;
	}
	.footer-wrap .footer-right h2 {
		font-size: 28px;
		text-align: left;
		margin-top: 35px;
	}
	.footer-wrap .footer-right h2 span {
		top: -25px;
	}
	.explore-section {
		overflow: hidden;
	}
	.explore-img {
		margin-top: 0;
	}
	.explore-img h2 {
		width: auto;
		font-size: 31px;
	}
	.social-btn {
		margin-top: 25px;
	    margin-bottom: 70px;
	}
	.news {
	    padding: 90px 45px 15px;
	}
	.about-2 .office-news .owl-prev  {
		right: 5%;
	}
	.about-2 .office-news .owl-next {
	    right: -3.2%;
	}
	.single-post-content .single-post .post-text {
	    padding-left: 45px; 
	}
	.single-post-content .single-post .post-text img {
		margin-left: 0; 
		padding-bottom: 15px;
	}

	.about-head {
		padding-top: 140px !important;
	}
}
/*  7 - media screen and (max-width: 680px) End
---------------------------------------------------------------------- */


/*  8 - media screen and (max-width: 480px)
---------------------------------------------------------------------- */
@media screen and (max-width: 480px){

	.navbar-default .navbar-toggle {
	  	margin-right: 0;
	}
	.navbar-toggle {
	  	margin-right: 15px;
	}
	.carousel-caption h3 {
	    font-size: 30px;
	}
	.caption-descp {
		font-size: 24px;
	}
	.sub-head {
		font-size: 10px;
	}
	.carousel-indicators {
		/* top: 40%; Abdellah */
	}
	.service2 .item-text .inner-box img {
	    width: 100%;
	}
	.single-item2 .item-img .img2,
	.service2 .img3 {
	    position: static;
	}
	.single-item2 .item-img {
		margin-left: 0;
	}
	.news {
		margin-top: 90px;
	    padding: 100px 15px 15px;
	}
	.about-head .inner-box p:last-child {
	    padding-bottom: 100px;
	}
	.about-head .big-text h1 {
		font-size: 170px;
	}
	.about-head .big-text h2 {
	    font-size: 25px;
	    margin-top: -25px;
	    padding-bottom: 20px;
	}
	.footer-wrap .footer-logo {
		float: none;
	}
	.load-more a {
		font-size: 21.71px;
		margin-left: 0; 
		padding: 25px 12px;
	}
	p.short-txt {
		padding-left: 0;
	}
	span.text1 {
		display: none;
	}
	span.mm-pb {
		font-size: 18px;
	}
	.post-container h2 {
		font-size: 20px;
	}
}
/*  8 - media screen and (max-width: 480px) End
---------------------------------------------------------------------- */




/*  9 - media screen and (max-width: 320px)
---------------------------------------------------------------------- */
@media screen and (max-width: 320px){
.caption-descp {
    font-size: 15px;
}
/*  9 - media screen and (max-width: 320px)
---------------------------------------------------------------------- */