/*------------------------------------------
Document: responsive.css (Style Sheet)
Dated	: June 2018
Author	: Antony Yesudas
Company	: Green Earth Trading
Purpose	: Mobile Responsiveness for RDrops Website
------------------------------------------------*/


/*________________________ DESKTOPS _______________________________*/


.xl-fit {
	width:100%;
}

.imgrdrop {
	width:600px;
}


@media (max-width: 1440px) {

	.about-us {
		width: 124%;
	}

	.innovation {
		height:16%;
	}

	.quality {
		height:17%;
	}

	.blank-about {
		height:53%;
	}

	.durability {
		height:12%;
	}
}


@media (max-width: 1200px) {

	body {
		border-left:0px solid orange;
	}

	.page {
	
	}

	h3 {
		margin-bottom: 5px;
	}

	#homenote {
		line-height:1.4;
	}

	.imgrdrop {
		width:auto;
	}
	
	.faq-pic {
		margin-bottom: 15px;
	}

	.about-us {
		padding:25px 50px;
		font-size: 13pt;
		width: 133%;
	}

	#cap, #bottle, #rings, #steel {
		width: auto;
	}

	#steel {
		left: -450px;
	}

	dt {
		margin-bottom: 36px;
		padding: 27px 38px;
	}

	#questions dt {
		opacity:0;
	}

	#freezer {
		white-space: nowrap;
	}

	address {
		padding:25px 0px 15px 0px;
		font-size:12pt;
	}

	#contactEmails .nav-link {
		padding: 0.3rem 0.45rem;
		font-size: 11pt;
	}

	.break-desk {
		float:none; width:auto;
	}

	.hide-desk {
		display:none;
	}

	.xl-fit {
		width:auto;
	}
}


/*________________________ IPAD/TABLET _______________________________*/

@media only screen and ( max-width: 991px )
{
	body {
		border-left:0px solid yellow;
	}

	.page {
		
	}

	#rdropsNav li.nav-item {
		margin: 0px 10px;
	}

	dd {
		text-align:justify;
	}

	dl {
		font-size: 13pt;
		letter-spacing: 0.01em;
	}

	dt {
		margin-bottom: 30px;
		padding: 25px 32px;
	}

	#freezer {
		white-space: normal;
	}
	
	.imgfit  {
		margin-bottom:15px;
	}

	.about-us {
		font-size:inherit;
		margin:auto;
		width:auto;
		letter-spacing:inherit;
	}

	.innovation, .quality, .durability, .blank-about {
		height:auto;
		margin-bottom:20px;
	}

	.thumb-certificate {
		width:100%;
	}

	#product {
		font-size:13pt;
	}

	.dimension .specifications {
		padding: 20px 0px 20px 390px;
	}

	.measurement .specifications {
		padding-top: 20px;
		padding-bottom: 20px;
	}

	.spare .specifications {
		padding-left: 10%;
	}

	#rings {
		left:110px;
	}

	#steel {
		left:auto;
	}

	#contactEmails .nav-link {
		padding: 0.3rem 0.45rem;
		font-size: 11pt;
	}

	.col-lg-5 {
		text-align:center!important;
	}
	
	.agreement {
		margin-left:0px;
		padding: 10px 30px;
	}

	.break-ipad {
		float:none; width:auto;
	}

	.ipad-fit {
		width:100%;
		margin-bottom:15px;
	}

	.hide-ipad {
		display:none;
	}
}

@media only screen and ( max-width: 992px)
{	
}


/*________________________ SMART PHONES _______________________________*/

@media only screen and ( max-width: 767px)
{
	body {
		border-left:0px solid skyblue;
	}

	.page {
		
	}

	.carousel-caption {
		padding:0px 50px;
	}

	#rdropsNav li.nav-item  {
		margin: 0px 3px;
	}

	#rdropsNav li a {
		display: block;
		padding: 6px 10px;
	}

	.imgrbottle, .imgbeach {
		width:100%;
		float:none;
		margin:0px;
	}

	.img-product  {
		margin-bottom: 10px;
	}
	
	#product {
		margin-bottom:0px;
	}

	.dimension, .measurement, 
	.material, .spare {
		margin-bottom:30px;
	}	

	.dimension .specifications {
		margin-left:800px;
	}

	.measurement .specifications {
		margin-right:800px;
	}

	.material .specifications {
		margin-left:800px;
		padding: 20px 0px 20px 120px;
	}
	
	.spare .specifications {
		margin-right:800px;
		padding: 20px 0px 20px 120px;
	}

	.parts  {
		display:none;
	}

	.leaf-droplet {
		background-position: 40% 10%;
	}

	.leaf-droplet .carousel-caption {
		right: auto;
	}

	.blue-beach .carousel-caption {
		left:auto;
		right: auto;
	}

	.leaf-droplet span,
	.blue-beach span	{
		width: auto;
		font-size: 30pt;
		line-height: 1.6em;
		top: -245px;
		text-align: center;
	}

	dt {
		margin:0px auto 20px auto;
		padding: 25px 32px;	
	}

	dl.fgap dt   {
		margin:0px auto 20px auto;
	}

	.qns  {
		margin: 20px 0px 30px 0px;
	}

	.specifications {
		padding: 20px 0px 20px 50px!important;
	}

	#closeModal {
		position: absolute;
		top: -15px
	}

	.mail {
		padding:10px 0px 10px 0px;
	}

	.mobile, .website {
		text-align:center;
	}
	
	.watermark {
		padding:5px 0px 20px 0px;
	}

	.break-smart {
		float:none; width:auto;
	}

	.smart-fit {
		width:100%;
		margin-bottom:15px;
	}

	.hide-smart{
		display:none;
	}
	
}

@media only screen and ( max-width: 575px) 
{
	body {
		border-left:0px solid red;
	}

	.page {
		
	}

	h2 {
		display:block;
	}

	dt {
		padding: 20px 25px;		
	}

	.fgap {
		padding-top:0px;
	}

	#rdropsNav li.nav-item  {
		margin: auto;
	}

	#product {
		font-size:12pt;
	}

	.navbar-nav {
		flex-direction: unset;
	}
	
	.bank {
		text-align:center;
		padding-top:25px;
	}
	
	address {
		padding:35px 0px;
	}
	
	#orderpic {
		max-width: 100%;
	}
	
	#cmbProduct {
		width: 100%;
	}
	
	.break-smart {
		float:none; width:auto;
	}

	.phone-fit {
		width:100%;
		margin-bottom:15px;
	}

	.hide-smart{
		display:none;
	}
	
}


/*________________________ MINI MOBILES _______________________________*/

@media only screen and (max-width: 480px) {

	body {
		border-left:0px solid green;
	}

	h3 {
		font-size:18pt;
	}

	#contactEmails .nav-link {
		font-size: 10pt;
	}

	.leaf-droplet span {
	    font-size: 29pt;
		line-height: 1.4em;
	}

	.blue-beach span {
	    font-size: 29pt;
		line-height: 1.3em;
	}

	.specifications {
		padding: 15px 0px 15px 20px!important;
	}

	.about-us {	
		padding:25px 30px;
	}

	.break-mini {
		float:none; width:auto;
		display:block;
	}

	.hide-mini{
		display:none;
	}
	
}

@media only screen and (max-width: 420px) {
	
	.blue-beach span {
	    top:-160px;
	}

	.thumb-certificate {
		width:100%;
	}
	
}


/*___________________________ TINY DEVICES __________________________*/

@media only screen and (max-width: 320px)
{
	
	#rdropsNav li a {
		padding: 6px 6px;
	}

	.tiny-fit {
		width:100%;
		height:auto;
		display:block;
	}

	.hide-tiny{
		display:none;
	}
}