/* To make Responsive
---------------------------------------------------------------------- /
*
*  1 - media screen and (max-width: 992px)
*  2 - media screen and (max-width: 800px)
*  3 - media screen and (max-width: 768px)
*  4 - media screen and (max-width: 640px)
*  5 - media screen and (max-width: 500px)
*  6 - media screen and (max-width: 480px)
*  7 - media screen and (max-width: 320px)
*  8 - media screen and (max-width: 1170px)
*  9 - (min-width: 1500px)
*
---------------------------------------------------------------------- */


/* 1 - media screen and (max-width: 992px)
---------------------------------------------------------------------- */
@media only screen and (max-width: 991px) {

    #header { min-height: 100px; }
    #header-wrap {  height: auto; }
    #logo {
        display: block;
        height: 105px;
        float: none;
        margin: 0 auto 0 !important;
        max-width: none;
        text-align: center;
        border: 0 !important;
        padding: 0 !important;
    }
    #logo a.standard-logo { display: inline-block; }
    #primary-menu {
        display: block;
        float: none;
        height: auto;
        overflow: auto;
    }
    #primary-menu-trigger { 
        pointer-events: auto;
        top: 25px;
        margin-top: 0;
        left: 0;
        opacity: 1;
        z-index: 1;
    }
    #primary-menu .container #primary-menu-trigger {
        top: 5px;
        left: 0;
    }
    #primary-menu > ul,
    #primary-menu > div > ul {
        display: none;
        float: none !important;
        border: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
        -webkit-transition: none;
        -moz-transition: none;
        -ms-transition: none;
        -o-transition: none;
        transition: none;
    }
    #primary-menu > div > ul { 
        margin-top: 60px !important; 
    }
    body:not(.top-search-open) #primary-menu-trigger {
        opacity: 1;
        font-size: 23px;
        -webkit-transition: opacity .2s .2s ease;
        -moz-transition: opacity .2s .2s ease;
        -ms-transition: opacity .2s .2s ease;
        -o-transition: opacity .2s .2s ease;
        transition: opacity .2s .2s ease;
    }
    body.top-search-open #primary-menu-trigger { opacity: 0; }
    #primary-menu ul {  height: 400px; }
    
    #primary-menu ul li {
        float: none;
        margin: 0 !important;
        text-align: left !important;
        border-top: 1px solid #eeeeee;
    }
    #primary-menu ul li:first-child { 
        border-top: 0; 
    }
    #primary-menu ul li a {
        height: 50px !important;
        line-height: 50px !important;
        padding: 0 5px !important;
        border: none !important;
        margin: 0 !important;
    }
    #primary-menu ul li i { 
        line-height: 49px; 
    }
    #primary-menu > ul > li.sub-menu > a,
    #primary-menu > .container > ul > li.sub-menu > a { 
        background-position: right center;
        background-repeat: no-repeat;
    }
    #primary-menu ul ul,
    #primary-menu ul li .mega-menu-content {
        position: relative;
        width: auto;
        background-color: transparent !important;
        box-shadow: none;
        border: 0;
        border-top: 1px solid #eeeeee; 
        top: 0 !important;
        padding-left: 15px;
        z-index: 1;
    }
    #primary-menu ul li .mega-menu-content { padding-left: 0;  }
    #primary-menu ul li .mega-menu-content ul li i { line-height: 24px; }

    #primary-menu ul ul ul {
        top: 0 !important;
        left: 0;
    }
    #primary-menu ul ul li {
        float: none;
        margin: 0;
        border-top: 1px solid #eeeeee;
    }
    #primary-menu ul ul a {
        height: 44px !important;
        line-height: 44px !important;
        padding-left: 5px !important;
        font-size: 13px !important;
        text-transform: none;
        font-weight: 400;
    }
    #primary-menu > ul > li.current > a:after { display: none; }
    #primary-menu ul ul a i { line-height: 43px; }

    #primary-menu ul ul li:hover > a {
        background-color: transparent !important;
        font-weight: 600;
        padding-left: 5px;
        color: #00a1cb !important;
    }
    #primary-menu ul li .mega-menu-content,
    #primary-menu ul li.mega-menu .mega-menu-content {
        width: auto;
        margin: 0;
        top: 0;
    }
    #primary-menu ul li .mega-menu-content ul {
    	position: relative;
        top: 0;
        display: block; 
        min-width: inherit;
    }
    #primary-menu ul li .mega-menu-content > ul { 
        float: none; 
    }
    #primary-menu ul li .mega-menu-content ul {
        display: block !important;
        opacity: 1 !important;
        top: 0;
        left: 0;
    }
    #primary-menu ul li .mega-menu-content ul ul { 
        border-top: 1px solid #eeeeee; 
    }
    #primary-menu ul li .mega-menu-content.col-2 > ul,
    #primary-menu ul li .mega-menu-content.col-3 > ul,
    #primary-menu ul li .mega-menu-content.col-4 > ul,
    #primary-menu ul li .mega-menu-content.col-5 > ul {
    	border-left: 0;
        border-top: 1px solid #eeeeee;
        width: auto;
        margin: 0; 
    }
    #primary-menu ul li .mega-menu-content > ul:first-child { border: 0;  }
    #primary-menu ul li .mega-menu-content ul a { line-height: 40px; }

    #primary-menu ul li .mega-menu-content ul {
        width: 100%;
        border: 0;
        box-shadow: none;
        background-color: transparent;
    }
    #top-search {
    	position: absolute;
        top: 35px;
        right: 100px;
        margin: 0;
        height: 0;
        padding: 0; 
    }

    .top-search-open #top-search {  left: 30px; }
    .top-search-open .standard-logo {  opacity: 0;  }

    #top-search a,
    #top-cart {
    	position: absolute;
        top: 30px; 
        float: none; 
        margin: 0;
        padding: 0;
    } 
    #top-cart {
        right: 20px;
        margin-top: 5px;
    }    
    #top-cart .top-cart-content {
        top:70px;
    }
    #top-cart .top-cart-action .btn:hover { 
        background: #00a1cb!important;
        color: #ffffff!important;
    }
    #top-search a.hd-icons{
        margin:0;
        top: 0;
        left: 100%; 
    }
    #top-search form input {
        border:none;
        padding: 0px 25px 10px 0;
    }
    #primary-menu > div > #top-search a,
    #primary-menu > div > #top-cart { 
        margin: 20px 0 !important; 
    }

    #top-search a {  right: 43px; }
    #top-search form {  background: #EEE; }
    #primary-menu > div > #top-search form { height: 60px !important; }
    #top-search form input {  font-size: 24px; }
    #page-menu .container { position: relative; }

    #page-submenu-trigger {
    	color: #FFF;
        opacity: 1;
        pointer-events: auto; 
    }

    #page-menu.pagemenu-active #page-submenu-trigger { background-color: rgba(0,0,0,0.2); }

    #page-menu nav {
    	position: absolute;
    	top: 43px;
        left: auto;
        right: 15px;
        display: none; 
        float: none;
        width: 200px; 
        height: auto;
        background-color: #1ABC9C;
        z-index: 11;
    }
    #page-menu.pagemenu-active nav {  display: block; }

    #page-menu nav ul {
    	background-color: rgba(0,0,0,0.2);
        height: auto; 
    } 
    #page-menu nav li { float: none; } 

    #page-menu nav li a {
        height: 40px;
        line-height: 40px;
        padding: 0 15px;
    }
    .navbar-fixed-top #primary-menu-trigger { top: 10px;}
    .navbar-fixed-top #top-search, 
    .navbar-fixed-top #top-cart { top:7px }
    .navbar-fixed-top #top-search, 
    .navbar-fixed-top #top-cart { margin-top: 11px; }
    .navbar-fixed-top #top-cart .top-cart-content { top: 52px; }

}

@media screen and (max-width: 992px) {
	.container {
		width: 100%;
	}
}

@media (min-width: 992px) {
	.container {
		width: 100%;
	}
}
@media (max-width: 992px) {
	#logo a {
		line-height: 100px;
	} 

	/*Portfolio*/
	.portfolio-row-2 .col-md-8.pull-right,
	.portfolio-row-2 .col-md-4.pull-left  { 
		float: none !important;
	}

	/*Copy Rights*/
	.copyrights,
	.footer-menu.pull-right {
		float: none !important;
		display: table;
		margin: 0 auto 30px auto; 
	}

	/*Home Page*/
	.callout-content {
		text-align: center;
	}
	.callout-content .col-md-4.text-right, 
	.callout-content .col-md-3.text-right,
	.callout-content .col-md-5.text-right {
		text-align: inherit;
	}

	/*Blog*/
	.blog-page.left-sidebar .col-md-8.pull-right{
		float: inherit !important;
	}	 
	.classic-02 article.post .entry-meta.left-meta {
		padding-bottom: 70px !important; 
	}
	.classic-02 article.post .entry-meta.left-meta .entry-date,	
	.classic-02 article.post .entry-meta.left-meta .post-format,
	.classic-02.blog-rows article.post .entry-meta.left-meta .post-format,
	.classic-02.blog-rows article.post .entry-meta.left-meta .entry-date {
		left: inherit !important; 
	}
	.classic-02 article.post .entry-meta.left-meta .post-format, 
	article.post .entry-meta.left-meta .entry-date {
		bottom: inherit; 
	}

	/*Portfolio*/
	.portfolio-row-3 .col-md-4.pull-right {
		float: inherit !important;
	}


	/*Footer*/
	.callout-action .callout-background,
	.footer-top-common .social-icons,
	.footer-site-logo {
		float: none !important;
	}
	.footer-site-logo {
		display: block;
		width: 100%;
		margin-bottom: 15px;
	}
 
}

/* 1 - media screen and (max-width: 992px)  End
---------------------------------------------------------------------- */


/* 2 - media screen and (max-width: 800px)
---------------------------------------------------------------------- */
@media screen and (max-width: 800px){

}

/* 2 - media screen and (max-width: 800px) End 
---------------------------------------------------------------------- */


/* 3 - media screen and (max-width: 768px)
---------------------------------------------------------------------- */

@media (max-width: 768px){
	.comment-area .left-form,
	.comment-area .right-form,
	.features-list li,
	.contact.v2 .contact-form {
		width: 100%;
	}   
	#home-focuz-main-slider,
	.footer-menu.pull-right,
	.stripe-t-back,
	.hero-banner {
		display: none;
	} 
	.social-icons ul>li>a:hover .icon-content {
		width: 32px;
	}
	.contact.v2 .contact-form {
		position: inherit;
		padding: 60px 0;
	} 
      #primary-menu ul li .mega-menu-content.col-4 > ul>li {
      width: 100%;
  }
}

/* 4 - media screen and (max-width: 640px)
---------------------------------------------------------------------- */
@media screen and (max-width: 640px){
    
}

/* 4 - media screen and (max-width: 640px) End
---------------------------------------------------------------------- */


/* 5 - media screen and (max-width: 500px)
---------------------------------------------------------------------- */
@media screen and (max-width: 500px){
    
}

/* 5 - media screen and (max-width: 500px)  End
--------------------------------------------------------------------- */


/* 6 - media screen and (max-width: 480px)
---------------------------------------------------------------------- */
@media (max-width: 480px){

    #primary-menu ul li .mega-menu-content.col-4 > ul>li {
      width: 100%;
  }
  .progress-bg {
      margin-bottom: -20px;
      margin-top: 90px;
  }
	.progress-name {
		position: absolute;
		bottom: 45px;
	}
	.progress.v3 { width: 95%; }
	.progress-count { width: 13%; }

	.comment-area .comment-author {
		display: none;
	}
	.comment-area .children {
		margin: 30px 0 30px 50px
	}


	/*Comment Area*/
	article.comment-body {
		position: relative;
	}

	.reply.pull-right {
		position: absolute;
		bottom: -15px;
		right: 0;
	}  

    .tv1 .tab-content .tab-image.pull-right {
        margin-bottom: 15px;
    }
}

@media only screen and (max-width: 479px) {
    #top-cart,
    #top-search { display: none; }
} 

/* 6 - media screen and (max-width: 480px) End
---------------------------------------------------------------------- */


/* 7 - media screen and (max-width: 320px)
---------------------------------------------------------------------- */
@media screen and (max-width: 320px){
    
    
}

/* 7 - media screen and (max-width: 320px) End 
---------------------------------------------------------------------- */



/* 8 - (max-width: 1200px)
---------------------------------------------------------------------- */
@media (min-width: 1200px) {
	.container {
		width: 1200px;
	}
}

/* 9 - (min-width: 1500px)
---------------------------------------------------------------------- */
@media (min-width: 1500px) {
	.col-xlg-12 {
		width: 100%;
	}
	.col-xlg-11 {
		width: 91.66666667%;
	}
	.col-xlg-10 {
		width: 83.33333333%;
	}
	.col-xlg-9 {
		width: 75%;
	}
	.col-xlg-8 {
		width: 66.66666667%;
	}
	.col-xlg-7 {
		width: 58.33333333%;
	}
	.col-xlg-6 {
		width: 50%;
	}
	.col-xlg-5 {
		width: 41.66666667%;
	}
	.col-xlg-4 {
		width: 33.33333333%;
	}
	.col-xlg-3 {
		width: 25%;
	}
	.col-xlg-2 {
		width: 16.66666667%;
	}
	.col-xlg-1 {
		width: 8.33333333%;
	}
}