/* portrait home page */


@media screen and (orientation:portrait) {
	.sf-btn-group {
			display:grid;
  }
		
	.sf-btn-group > button {
	background-color:red;
			margin-top:1vh;
			margin-bottom:1vh;
			font-family:sans-serif;
			font-size:1.4rem !important;
  }
		
  .sf-image {
			width: 40vw !important;
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
  .sf-heading {
    display: block;
			left:0;
  }
  .sf-slider {
    display: block;
  }

}

/*   landscape home page */

@media screen and (orientation:landscape) {
		
	.sf-btn-group {
    display: flex;
    background-color: black;
    width: 40vw;
    height: 10vw;
    position: fixed;
    bottom: 4vh;
    right: 10vw;
  }

  .sf-btn-group > button {
    background-color: red;
    width: 30vw;
			max-width: 30%;
    height: auto;
			max-height:40%;
    border: 0;
		font-size: 1.1rem;
		margin-top: 0;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;	
  }

  .sf-image {
    position: fixed;
    left: 10vw;
    top: 20vh;
    width: 30vw !important;
    z-index: 999;
  }

  .sf-heading {
    position: fixed;
    font-size: 4vh;
    width: 40vw;
    text-align: center;
    top: 5vh;
    right: 10vw;
    z-index: 998;
  }

  .sf-slider {
    position: fixed;
    width: 40vw;
    right: 10vw;
    top: 20vh;
  }
		@media screen and (max-width:680px) {
				.sf-btn-group > button {
					font-size:0.5rem;	
						height:auto;
				}
		}
}

/* Packages Page */

.sf-pkg-page-heading{
text-align:center;

}
.sf-pkg-page-heading > h2{
font-size:5vh;		
}
.sf-pkg-page-heading > h3{
font-size:4vh;		
}
.sf-pkg-heading{
text-align:center;		
}
.sf-silver-pkg{
	background-color:#e5e4e2;	
		padding:0.7rem;
		margin:0.7rem;
		color:black;
		height:auto;
		min-height:80vh;
}
.sf-gold-pkg{
	background-color:#D4AF37;	
		padding:0.7rem;
		margin:0.7rem;
		color:black;
		height:auto;
		min-height:80vh;
}
.sf-platinum-pkg{
	background-color:#A0B2C6;	
		padding:0.7rem;
		margin:0.7rem;
		color:black;
		height:auto;
		min-height:80vh;
}

@media screen and (orientation:landscape) {
.sf-pkg-image{
		width:15vw;
		position:absolute;
		top:0;
		}

.sf-package-grid{
				display:flex;
				flex-flow: row wrap;
				background-color:black;
				justify-content:center;

		}

.sf-package-grid > .sf-package{
				width:30vw;
		}
		
.sf-pkg-btns {
		display:flex;
		flex-flow:column nowrap;
		position:fixed;
		top:3vh;
		right:5vw;
		width:15vw;
		
  }
		
	.sf-pkg-btns > button {
	background-color:red;
			margin-top:0.6vw;
			margin-bottom:0.6vw;
			font-family:sans-serif;
			font-size:0.8rem;
  }

}

@media screen and (orientation:portrait) {
		
		.sf-mobile{
		position:static;
				top:0;
				
		}
.sf-pkg-image{
			width:30vw;
			position:relative;
			display:block;
		margin-left:auto;
		margin-right:auto;
		}
		
.sf-pkg-page-heading{
text-align:center;

}
.sf-pkg-page-heading > h2{
font-size:3vh;		
}
.sf-pkg-page-heading > h3{
font-size:2vh;		
}
.sf-package-grid{
				display:flex;
				flex-flow: column wrap;
				background-color:black;
				justify-content:center;

		}

.sf-package-grid > .sf-package{
				width:100%;
		}
		
.sf-pkg-btns {
		display:flex;
		flex-flow:row nowrap;
		justify-content:center;
		position:fixed;
		bottom:3vh;
		width:100vw;
		
  }
		
	.sf-pkg-btns > button {
	background-color:red;
			margin-left:1vw;
			margin-right:1vw;
			font-family:sans-serif;
			font-size:1.4rem;
  }

}