
.wtgn-container {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    background-color: #656565;
}
.wtgn-container-new {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0px auto;
}
@media all and (min-width: 768px) {
  .wtgn-container-new {
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
  }
}
.wtgn-item {
    width: 50%;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
	  padding: 8px;
}
.wtgn-item-new {
    width: 100%;
}
@media all and (min-width: 768px) {
  .wtgn-item-new {
    width: 50%;
  }
}
.wtgn-container .font9 {
    padding-top: 80px;
    margin-bottom: 25px;
}
.wtgn-button a {
    border: solid #fff 1px;
    border-radius: 4px;
    display: block;
    text-align: center;
    text-decoration: none;
    padding: 10px;
    color: #fff;
}
.wtgn-button a:hover {
    border: solid #fff 1px;
    border-radius: 4px;
    display: block;
    text-align: center;
    text-decoration: none;
    padding: 10px;
    color: #404040;
    background-color: #fff;
}
.wtgn-button {
    width: 21rem;
    font-size: 22px;
}
.tile-txt {
    bottom: 50%;
    right: 50%;
    -webkit-transform: translate(50%, 50%);
    -ms-transform: translate(50%, 50%);
    transform: translate(50%, 50%);
    position: absolute;
    width: 90%;
}
#btn-compare, #btn-get-dish {
    width: 160px;
    margin: 20px auto 0 auto;
}
@media all and (max-width: 767px) {
	.wtgn-container .font9 {
		font-size: 18px;
	}
	.wtgn-button {
		width: 8rem;
		font-size: 14px;
	}
}
@media all and (max-width: 768px) {
	.wtgn-container .font9 {
		padding-top: 30px;
		margin-bottom: 20px;
	}
}

@media all and (min-width: 769px) and (max-width: 1024px) {
	.wtgn-container .font9 {
		padding-top: 50px;
	}
}



/*------------------- START STYLES FOR WTGN-start -------------------*/

#wtgn-packages {
    background: url(/images/wtgn-packages-img.jpg) no-repeat top right;
    height: 280px;
}
@media all and (max-width: 767px) {
	#wtgn-packages {
		background-size: cover;
		background-position: 0% 44%;
	}
}
@media all and (max-width: 768px) {
	#wtgn-packages {
		height: 168px;
		background-size: contain;
	}
}
@media all and (min-width: 769px) and (max-width: 1024px) {
	#wtgn-packages {
		height: 210px;
		background-size: contain;
	}
}
/*------------------- START STYLES FOR WTGN-DANY -------------------*/

#wtgn-dany {
    background: url(/images/wtgn-dany-img.jpg) no-repeat top right;
    height: 280px !important;
    border-right: 1px solid #fff;
}

@media all and (max-width: 767px) {
	#wtgn-dany {
		background-size: cover;
		border-right: 1px solid #fff;
	}
}
@media all and (max-width: 768px) {
	#wtgn-dany {
		height: 168px;
		background-size: cover;
	}
}
@media all and (min-width: 769px) and (max-width: 1024px) {

	wtgn-dany {
		height: 210px;
		background-size: contain;
	}
}

/*------------------- START STYLES FOR WTGN-HOPPER3 -------------------*/

#wtgn-hopper3 {
    background: url(/images/wtgn-hopper3-img.jpg) no-repeat top center;
    height: 280px;
    border-right: 1px solid #fff;
}
@media all and (max-width: 767px) {
	#wtgn-hopper3 {
		background-size: cover;
		border-right: 1px solid #fff;
	}
}
@media all and (max-width: 768px) {
	#wtgn-hopper3 {
		height: 168px;
		background-size: cover;
	}
}
@media all and (min-width: 769px) and (max-width: 1024px) {
	#wtgn-hopper3 {
		height: 210px;
		background-size: cover;
	}
}

/*------------------- START STYLES FOR WTGN-COMPARE -------------------*/

#wtgn-compare {
    background: url(/images/wtgn-compare-img.jpg) no-repeat top center;
    height: 280px;
    border-right: 1px solid #fff;
}
@media all and (max-width: 767px) {
	#wtgn-compare {
		background-size: cover;
	}
}
@media all and (max-width: 768px) {
	#wtgn-compare {
		height: 168px;
		background-size: cover;
	}
}
@media all and (min-width: 769px) and (max-width: 1024px) {
	#wtgn-compare {
		height: 210px;
		background-size: contain;
	}
}

/*------------------- START STYLES FOR WTGN-INSTALL -------------------*/

#wtgn-install {
    background: url(/images/wtgn-install-img.jpg) no-repeat top right;
    height: 280px;
    border-right: 1px solid #fff;
}
@media all and (max-width: 767px) {
	#wtgn-install {
		background-size: cover;
		border-right: 1px solid #fff;
	}
}
@media all and (max-width: 768px) {
	#wtgn-install {
		height: 168px;
		background-size: cover;
	}
}
@media all and (min-width: 769px) and (max-width: 1024px) {
	#wtgn-install {
		height: 210px;
		background-size: contain;
	}
}

/*------------------- START STYLES FOR WTGN-HOPPERGO -------------------*/

#wtgn-hopperGO {
    background: url(/images/wtgn-dany-img.jpg) no-repeat top right;
    height: 280px;
    border-right: 1px solid #fff;
}
@media all and (max-width: 767px) {
	#wtgn-hopperGO {
		background-size: cover;
		border-right: 1px solid #fff;
	}
}
@media all and (max-width: 768px) {
	#wtgn-hopperGO {
		height: 168px;
		background-size: contain;
	}
}
@media all and (min-width: 769px) and (max-width: 1024px) {
	#wtgn-hopperGO {
		height: 210px;
		background-size: contain;
	}
}

/*------------------- START STYLES FOR WTGN-INTERNET -------------------*/

#wtgn-internet {
    background: url(/images/wtgn-internet.jpg) no-repeat center top;
    height: 300px;
    position: relative;
    border-top: 10px solid #fff;
    border-right: 10px solid #fff;
    border-left: 10px solid #fff;
    background-size: cover;
}
@media all and (min-width: 768px) {
  #wtgn-internet {
    height: 430px;
    border-top: 10px solid #fff;
    border-right: 5px solid #fff;
    border-left: 10px solid #fff;
    border-bottom: 10px solid #fff;
  }
}
@media all and (min-width: 1024px) {
}

/*------------------- START STYLES FOR WTGN-EXPERIENCE -------------------*/

#wtgn-experience {
    background: url(/images/wtgn-experience.jpg) no-repeat right top;
    height: 300px;
    position: relative;
    border: 10px solid #fff;
    background-size: cover;
}
@media all and (min-width: 768px) {
  #wtgn-experience {
    height: 430px;
    border-top: 10px solid #fff;
    border-right: 10px solid #fff;
    border-left: 5px solid #fff;
    border-bottom: 10px solid #fff;
  }
}
@media all and (min-width: 769px) and (max-width: 1024px) {

}

/*------------------- START STYLES FOR WTGN-VOICE-REMOTE -------------------*/

#wtgn-voice-remote {
    background: url(/images/wtgn-voice-remote-img.jpg) no-repeat top right;
    height: 280px;
    border-right: 1px solid #fff;
}
@media all and (max-width: 767px) {
	#wtgn-voice-remote {
		background-size: cover;
		border-right: 1px solid #fff;
	}
}
@media all and (max-width: 768px) {
	#wtgn-voice-remote {
		height: 168px;
		background-size: contain;
	}
}
@media all and (min-width: 769px) and (max-width: 1024px) {
	#wtgn-voice-remote {
		height: 210px;
		background-size: contain;
	}
}

/*------------------- START STYLES FOR WTGN-HOPPER3-NEW -------------------*/

#wtgn-hopper3-new {
    background: url(/images/wtgn-new-hopper3.jpg) no-repeat center;
    height: 300px;
    position: relative;
    border: 10px solid #fff;
    background-size: cover;
}
@media all and (min-width: 768px) {
  #wtgn-hopper3-new {
    height: 430px;
    border-top: 10px solid #fff;
    border-right: 5px solid #fff;
    border-left: 10px solid #fff;
    border-bottom: 10px solid #fff;
  }
}
@media all and (min-width: 769px) and (max-width: 1024px) {

}
