/**********************************************************************************

	Project Name: Presets of Responsive Layout Style for Flattern Landing Page
	Project Description: Flattern is a flat design landing page for your apps, product, or portfolio
	Author: xWisnux
	Author URI: http://www.worksofwisnu.com
	Version: 1.0.0
	
**********************************************************************************/
/* Large desktop */
@media (min-width: 1200px) { 
	.large-desktop-visible{
		display: block;
	}
	
	span.rollover-play{
		margin-top: 154px !important;
		margin-left: 100px !important;
		height: 370px;
		width: 206px;
	}
	
	.video-wrapper iframe{
		width: 100%;
	}	
	
	#wrapper.boxed{
		width: 1200px;
	}
}
 
/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) { 
	span.rollover-play{
		margin-top: 110px !important;
		margin-left: 70px !important;
		height: 265px;
		width: 150px;
	}

	span.rollover{
		width: 228px;
		height: 171px;
	}
	
	.video-wrapper iframe{
		width: 100%;
	}
	
	.nav-tabs > li > a, .nav-pills > li > a {
		padding-right: 12px;
		padding-left: 12px;
	}
	
	ul.pricing-content li.pricing-table-button a{
		padding: 10px 15px;
	}
}
 
/* Landscape phone to portrait tablet */
@media (max-width: 767px) { ... }
 
/* Landscape phones and down */
@media (max-width: 480px) { 
	h1{
		font-size: 36px;
	}
	
	h2{
		font-size: 30px;
	}
	
	h3{
		font-size: 28px;
	}
	
	h4{
		font-size: 24px;
	}
	
	h5{
		font-size: 18px;
	}
	
	h6{
		font-size: 14px;
	}
	
	span.rollover-play{
		margin-top: 155px !important;
		margin-left: 99px !important;
		height: 368px;
		width: 208px;
	}
	
	span.rollover{
		width: 440px;
		height: 330px;
	}
	
	.alert, .alert h4{
		text-align: left;
		line-height: 1.7em;
	}
	
	section{
		padding: 30px 20px;
	}
	
	.button-small{
		font-size: 10px;
		padding: 10px 12px;
	}
	
	.button{
		font-size: 14px;
		padding: 12px 14px;
	}
	
	.button-large{
		font-size: 18px;
		padding: 14px 17px;
	}
	
	.jumbotron{
		font-size: 48px;
	}
	
	.cta {
		margin: 5% 0;
	}
	
	.two-side-cta {
		margin: 50px 0 70px;
	}
	
	.left-side-cta{
		float: none;
		padding: 10px;
	}
	
	.right-side-cta{
		padding: 10px;
		display: inline;
		margin-left: -6px;
	}
	
	select{
		width: 101%;
	}
	
}

/* Portrait phones and down */
@media (max-width: 320px) { 
	span.rollover-play{
		margin-top: 107px !important;
		margin-left: 68px !important;
		height: 257px;
		width: 145px;
	}
	
	span.rollover {
		width: 280px;
		height: 210px;
	}
	
	.nav-tabs > li {
		width: 100%;
		display: block;
	}
	
	.tabs-left > .nav-tabs > li, .tabs-right > .nav-tabs > li{
		float: left;
	}
}