
/* 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)
*
---------------------------------------------------------------------- */


/* 1 - media screen and (max-width: 992px)
---------------------------------------------------------------------- */


@media screen and (max-width: 992px){

	.container {
		width: 100%;
	}
	.slide-text-container{
		min-width: 100%;
		margin-left: inherit;
	}
	.top-mobile-image{
		display: none;
	}
	.slider-buttons{
		text-align: center;
	}
	.available-on{
		min-width: 350px;
	}
	.feature .col-lg-8{
		padding-bottom:10px;
	}
	.feature-section .cell-phone,
	.review-section .cell-phone{
		display: block;
		margin: auto;
	}
	.review-section .cell-phone{
		float: none;
		margin-top: 85px;
	}
	.newsletter-form{
		margin-top: 0px;
	}

	.description-section .pull-left,
	.description-section .pull-right{
		float: none !important; 
	}
	.description-section .description-list{
		margin-bottom: 70px;
	}
}

@media (min-width: 992px){
	.container {
		width: 100%;
	}
}
@media (max-width: 992px) {
    .navbar-header {
        float: none;
    }
    .navbar-left,.navbar-right {
        float: none !important;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-default .navbar-collapse, .navbar-default .navbar-form{
    	border-color:#292d46;
    }
    .navbar-fixed-top {
		top: 0;
		border-width: 0 0 1px;
	}
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
		margin-top: 2px;
		margin-bottom: 2px;
	}
	.navbar-nav>li {
        float: none;
        border-bottom: 1px solid #292d46;
    }
    .navbar-nav>li:last-child{
    	border-bottom: 0px solid transparent;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .collapse.in{
  		display:block !important;
	}
	.navbar-toggle{
		margin-top: 15px;
		margin-bottom: 15px;
	}
	.container>.navbar-header, .container-fluid>.navbar-header, .container>.navbar-collapse, .container-fluid>.navbar-collapse{
		margin-left: -15px;
		margin-right: -15px;
	}
	.navbar>.container .navbar-brand, .navbar>.container-fluid .navbar-brand{
		margin-left:0;
	}
	.navbar-default .navbar-toggle, .navbar-default .navbar-toggle{
		-webkit-transition: all .25s ease;
		   -moz-transition: all .25s ease;
		    -ms-transition: all .25s ease;
		     -o-transition: all .25s ease;
		        transition: all .25s ease;
	}
	.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus{
		background-color: transparent;
		color: #53c5d5;
	}
	.navbar-default .navbar-toggle{
		border-color: transparent;
		font-size: 2em;
		line-height: 25px;
	}
	.navbar-collapse.in {
		overflow-y: auto!important;
	}
	.section-description{
		max-width: 100%;
	}

}

/* 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 screen and (max-width: 768px){	
	
}

/* 3 - media screen and (max-width: 768px) End
---------------------------------------------------------------------- */


/* 4 - media screen and (max-width: 640px)
---------------------------------------------------------------------- */
@media screen and (max-width: 640px){
	.newsletter-form{
		margin-bottom: 80px;
	}
	.newsletter-form input{
		padding-right:15px;
	}
	.newsletter-form .btn{
		width: 100%;
		top: 80px;
	}
	.phone-container{
		min-height:400px;
	}
	.phone-container .phone-1,
	.phone-container .phone-2{
		width: 280px;
	}
	.phone-container .phone-1{
		left: 150px;
	}
	
}

/* 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 screen and (max-width: 480px){
	.slider-title{
		font-size: 3em;
	}
	.section-title{
		font-size: 2em;
	}
	.slide-text-container{
		padding-left: 15px;
		padding-right: 15px;
	}
	div.slider-buttons .btn{
		/*display: table;
		margin: 0 auto 40px auto;*/
	}
	.available-on {
		min-width: 240px;
		width: 240px;
		margin-bottom: 40px;
		min-height: 60px;
	}
	.os-icon{
		height: inherit;
	}
}
	

@media screen and (max-width: 450px){

	.pricing-section .col-lg-4{
		margin-left: 5%;
	}
	.phone-container{
		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 - media screen and (max-width: 1170px)
---------------------------------------------------------------------- */

@media screen and (max-width: 1170px){

	
}


@media (min-width: 1170px){
	.container {
		width: 1170px;
	}
}

/* 8 - media screen and (max-width: 1170px) End
---------------------------------------------------------------------- */


/* 9 - media screen and (max-width: 1050px)
---------------------------------------------------------------------- */
@media screen and (max-width: 1050px){
	.phone-container .phone-1{
		left: 150px;
	}
	
}


/* 9 - media screen and (max-width: 1050px) End End
---------------------------------------------------------------------- */







