@import url('reset.css');

/* Main Layout */

html {
	text-align: center;
}

body {
	margin: 0 auto;
	text-align: left;
}

/* General colors */

p, h1, h2, h3, h4, h5, li, legend, input, label, td {color:#333;}
a:link, a:visited {color:#555;}
#nav_main h3, #nav_main h3 a {color: #fff;}
.success { color: #0f0;}
.error { color: #f00;}
.warning { color: #f00; font-weight: bold;}
/* General typography*/

html {
	font: 80%/1.5 "Lucida Grande", "Trebuchet MS", verdana, arial, sans-serif;
}

textarea {
	font: 100%/1.5 "Lucida Grande", "Trebuchet MS", verdana, arial, sans-serif;
	padding: .4em;
	color: #333;
	border: 1px solid #999;
	width: 30em;
	height: 6em;
}

h1 {
	font-size: 100%;
}

h2 {
	font-size: 150%;
}

h3 {
	font-size: 130%;
}

strong {
	font-weight: bold;
}

a {
	text-decoration: underline;
}

legend {
	display: none;
}

input[type="text"], input[type="password"] {
	font-size: 100%;
}

#nav_sub p, #nav_sub li, #nav_main {
	font-size: 90%;
}

#nav_main a, #branding a {
	text-decoration: none;
}

#branding {
	padding: 10px 0 0;
	float: left;
	margin-left: 60px;
	position: relative;
	height: 29px;
}

#branding h1 {
	position: absolute;
	bottom: 0;
	left: 0;
	padding-left: 145px;
	width: 400px;
}

#branding h1 a {
	text-indent: -99999px;
	background: transparent url(../images/world/logo_hostedpci.png) no-repeat scroll left top;
	width: 135px;
	height: 29px;
	position: absolute;
	left: 0;
	bottom: -3px;
}

#branding h3 {
	position: absolute;
	left: 145px;
	bottom: 0;
	width: 400px;
	padding: 0;
	margin: 0;
	vertical-align: bottom;
}

p, h3, #content li {
	margin: 0 0 .75em;
}

#content ul {
	margin: 0 0 2em;
}

h2 {
	display: none;
}

.action_button {
	padding: .3em .5em;
	background-color: #ccc;
	border: 1px solid #333;
	text-decoration: none;
}

.action_button:hover {
	background-color: #666;
	color: #ccc;
}


/* FORM */

fieldset {
/*	border: 1px solid #ccc;*/
}

legend {
	font-size: 120%;
	padding-bottom: 1em;
	text-align: left;
/*	display: none;*/
}

form li {
	margin-bottom: 1em;
}

label {
	display: block;
	float: left;
	margin-right: 1em;
	width: 7em;
	padding: .4em 0;
	margin-top: 3px;
}

input[type="text"], input[type="password"] {
	border: 1px solid #999;
	/* width: 15em; */
	padding: .4em;
	margin-right: 1em;
}

input[type="text"]:focus {
	border-color: #ff9900;
}

input[type="checkbox"] {
	margin-left: 0;
}

.input_check label {
	margin-left: .5em;
/*	padding-top: 0;*/
	float: none;
	display: inline;
}

.input_check input {
/*	float: left;*/
}

.input_check input[type="submit"], .input_select input[type="submit"] {
	float: right;
}

.input_datefields input {
	width: 2em;
	margin-right: .5em;
}

.input_submit {
	clear: left;
	padding-top: .5em;
}

.input_datefields input.DateYYYY {
	width: 3em;
}

input.hhmmss {
	width: 5em;
}

input[readonly="readonly"] {
	background-color: #eee;
	border-color: #eee;
}

.form_hint {
	color: #666;
	font-size: 80%;
}

li select {
	position: relative;
	top: 5px;
	margin-bottom: 4px;
}


/* Table */

table {
	border-color: #aaa;
	border-width: 1px 0 1px 1px;
	border-style: solid;
	margin-bottom: 1.5em;
}

th {
	font-weight:bold;
	padding: 4px 10px 4px 4px;
	border-bottom: 1px solid #aaa;
	border-right: 1px solid #aaa;
}

td {
	padding: 4px 10px 4px 4px;
	border-right: 1px solid #aaa;
}

td.timestamp {
	font-size: 70%;
}

td.id {
	text-align: right;
}

td.number, td.cell_number, th.cell_number {
	text-align: right;
}

/* Pagination */

.pagination {
/*	position: relative;*/
/*	left: -.5em;*/
}

.pagination li {
	display: inline;
	padding: .2em .5em;
}

.pagination li.first_icon {
	padding-left: 0;
}

.pagination li a {
	text-decoration: none;
}

.pagination .current_page {
	background-color: #ff9900;
}

.oddrow {
	background-color: #ddd;
}

/* HEADER */

#nav_sub {
	float: right;
	padding: 27px 0 10px;
	margin-right: 60px;
}

#nav_sub li, #nav_sub ul, #nav_sub p {
	display: inline;
}

#nav_sub li {
	margin-left: 1em;
}

#nav_main {
	clear: both;
	float: left;
	width: 100%;
	margin-top: 10px;
	margin-bottom: 10px;
	border-bottom: 22px solid #ff9900;
}

#nav_main > ul {
	background: #fff url('../images/world/mainnav/mn-bg.gif') repeat-x left top;
	height: 32px;
	padding-left: 60px;
}

#nav_main > ul > li {
	float: left;
	position: relative;
	padding-left: 2em;
	background: #fff url('../images/world/mainnav/tab-mn-l.gif') no-repeat left top;
	margin: 0;
}

#nav_main > ul > li:first-child {
	background-image: url(../images/world/mainnav/tab-mn-l1.gif);
}

#nav_main h3 {
	height: 14px;
	background: #fff url('../images/world/mainnav/tab-mn-r.gif') no-repeat right top;
	padding: 13px 2em 5px 0;
	font-size: 100%;
	margin: 0;
}

#nav_main li ul {
	display: none;
	position: absolute;
	top: 32px;
	left: 0;
	width: 18em;
	border: 1px solid #666;
	background-color: #fff;
}

#nav_main li#nav_venue_admin ul {
	width: 22em;	
}

#nav_main li:hover ul {
	display: block;
	z-index: 9000;
}

#nav_main li ul li {
	border-bottom: 1px solid #666;
	padding: .5em 2em;
}

#nav_main li ul li:last-child {
	border-bottom: none;
}

#nav_main li ul li:hover {
	background-color: orange;
}

#nav_main li ul li:hover a {	
	color: #000;
}

#nav_main .current h3 {
	background-position: 100% -32px;
}

#nav_main .current {
	background-position: 0% -32px;
}

#nav_main .current h3 > a, #nav_main .current > h3 {
	color: #222;
	font-weight: bold;
}

#header-venue-bannerText{
	float: left;
	font-size: 1.3em;
	display: flex;
  	align-items: center;
  	justify-content: center;
  	height: 50px;
  	width: 100%;
  	font-weight: 900;
}

#header-venue-bannerText p{
	margin: 0px;
}

/* CONTENT */

#content {
	clear: both;
	min-height: 50ex;
	margin: 0 60px;
	padding: 20px 0;
}

/* FOOTER */

#site_info {
	padding: 10px 60px;
	border-top: 1px solid #666;
}

/* Login page */

#login {
	width: 300px;
	margin: 100px auto;
	padding: 30px;
	border: 1px solid #ff9900;
}

#login #branding {
	float: none;
	margin: 0 0 2em 0;
	padding: 0;
}

#login legend {
	display: none;
}

#login .input_text label {
	display: block;
	margin: 0 0 .2em;
	font-size: 85%;
	color: #999;
	padding: 0;
	border-width: 0;
}

#login .input_text input {
	font-size: 120%;
	color: #333;
	padding: .2em;
	border: 1px solid #999;
	width: 15em;
}

/* ADMIN HOME PAGE */

#admin_home #content ul {
	margin-left: 20px;
}

/* Checkout request */

#checkout_request #site_select {
	margin-bottom: 20px;
}

#checkout_request legend {
	display: none;
}

#checkout_request label {
	float: none;
	display: inline;
	margin-right: 0;
}

/* User Access */

#user_access legend {
	display: none;
}

#user_access label {
	display: inline;
	float: none;
}

#user_access h4 {
	margin: 1em 0;
}

/* Categories */

#edit_category table {
	width: 30em;
}

/* Email Options, Static Page Options */

#email_options table,
#email_options td,
#staticpage_options table,
#staticpage_options td {
	border: none;
}

/* Venue payment info - really wide table */

#venue_payment table {
	font-size: 80%;
}

#venue_payment table input, #venue_payment table th {
	width: 7em;
}

#venue_payment table input[type="text"] {
	margin: 0;
}

#venue_payment td {
	padding: .2em;
}

#venue_payment .id {
	width: 3em;
}

#venue_payment .up_time {
	width: 20em;
}

#venue_payment .table {
	display: table;
	font-size: 80%;
	border: 1px solid #aaa;
	border-collapse: collapse;
	margin-bottom: 1.5em;
}

#venue_payment .table > * {
	display: table-row;
}

#venue_payment .table>*>.th {
	font-weight: bold;
	padding: 4px 10px 4px 4px;
	border-bottom: 1px solid #aaa;	
}

#venue_payment .table>*>* {
	display: table-cell; 
	border-right: 1px solid #aaa;
	padding: .2em;
	width: 7em;
	height: 4em;
}

#venue_payment .table input{
	width: 7em;
}

#venue_payment .table input[type="text"], input[type="password"] {
	margin: 0;
}

.profileInfo-addAction{
	border: 1px solid black;	
	margin-bottom: 10px;
	display: inline-block;
	font-weight: bolder;
	background-color: #fff;
	text-align: left;
	display: inline-block;
	min-width: 50px;
	padding: 5px;
	border-radius: 18px;
	text-align: center;
	text-decoration: none;
}

.profileInfo-addAction:hover{
	background-color: #737272;
	color: #fff;
}

#profileInfo-setupAction{
	border: 1px solid black;	
	margin-top: 5px;
	margin-bottom: 5px;
	display: block;
	background-color: #c7c8c9;
}

/* Venue sites admin */

#venue_sites legend {
	display: block;
	font-size: 110%;
	font-weight: bold;
}

#venue_sites label {
	width: 15em;
}

#venue_sites select {
	position: relative;
	top: 7px;
}

#venue_sites input[type="submit"] {
	position: relative;
	left: 18.5em;
	margin-top: .5em;
}

/* input box - entend width */
.extendInput-btn{
	padding: 0px;
}

#venue_sites h4 {
	font-size: 130%;
	margin: 0 0 .75em;
}

#venue_sites ul {
	margin: 0;
}

.venueSite {
	margin-bottom: 2em;
	border-top: 1px solid #ccc;
	padding-top: 1em;
}
.venueAction {
	display: inline;
}

/* Venue Alias */

#createSiteAlias legend {
	display: block;
	font-size: 110%;
	font-weight: bold;
}

#createSiteAlias input[type="submit"] {
	margin-left: 9em;
}

#sites_alias h4 {
	font-size: 110%;
	margin: 0 0 .75em;
	font-weight: bold;
}

/* Manage Venue Org */

#manage_venueorg #new_venueorg td {
	background-color: #eee;
}

#manage_venueorg #new_venueorg td:first-of-type {
	font-style: oblique;
}

#assign_venueorg select {
	position: relative;
	top: 7px;
	margin-bottom: 10px;
}

#assign_venueorg input[type="submit"] {
	margin-left: 9em;
}

/* Create venue */

#create_venue form ul {
	margin: 0 0 2em;
}

#create_venue label {
	width: 15em;
}

#create_venue input[type="submit"] {
	position: relative;
	left: 18.5em;
	margin-top: .5em;
}

/* Retract bid */

#retract_bid label {
	width: auto;
}

#retract_bid input[type="text"] {
	width: 5em;
}

#retract_bid_form {
	margin-top: 2em;
}

#retract_bid_form legend {
	display: block;
	font-size: 100%;
	font-weight: bold;
}

#retract_bid_form th {
	font-weight: normal;
}

/* Manage Challenges */

#manage_challenges h4 {
	font-weight: bold;
	margin-bottom: .5em;
	padding-top: .5em;
	border-top: 1px solid #999;
}

/* Update challenge */

#update_challenge label {
	width: 17em;
}

/* Games, Quizzes, Polls */

#manage_games h4, #manage_quizzes h4, #manage_polls h4 {
	margin: 0 0 .75em;
}

#manage_game_form label, #manage_quiz_form label, #manage_poll_form label {
	width: 17em;
}

#manage_poll_form table {
	font-size: 80%;
}

#manage_poll_form input[type="text"] {
	width: 12em;
}

#manage_poll_form .display_seq input {
	width: 6em;
}

/* Email Sub DL */

#manage_email_sub_dl label {
	width: 15em;
}

/* Venue alerts */

#site_alerts td {
	line-height: 1.3;
/*	vertical-align: top;*/
}

#site_alerts .alert_text {
	width: 18em;
}

#site_alerts .active_alert .active_dates {
	background-color: #6f6;
}

#site_alerts_form label {
	width: 15em;
}

#site_alerts_form select {
	position: relative;
	top: 5px;
	margin-bottom: 4px;
}

#site_alerts_form input[type="submit"] {
	margin-left: 18.5em;
}

/* Image upload */

#venue_img_upload select {
	position: relative;
	top: 5px;
	margin-bottom: 4px;
}

/* Content Areas */

#manage_content_list label {
	width: 10em;
	float: none;
	display: inline;
}

#manage_content_list form {
	clear: both;
	vertical-align: middle;
	margin: 0 0 .75em;
}

#manage_content_form legend {
	display: block;
}

#manage_content_form label {
	width: 15em;
}

#manage_content_form select {
	position: relative;
	top: 5px;
	margin-bottom: 4px;
}

#manage_content_form input[type="submit"] {
	margin-left: 18.5em;
}

/* Tracking Selection, Marketing Campaings */

.createdTS {
	font-size: 70%;
}

/* Approve Submissions */

.subs #content h3 {
	margin-bottom: 1.5em;
}

.subs table, .subs th, .subs td {
	border: none;
	padding: 0;
}

.subs h4 {
	margin: 0 0 .75em;
	font-weight: bold;
}

.subs td {
	padding: 0 1em .75em 0;
}

.subs .actions a {
	margin-right: 1em;
}

.subs .actions form {
	display: inline;
}

#approve_sub_form .actions {
	margin-top: 1em;
}

/* Approve Comments */

#approve_comments #content li {
	padding: .5em;
	background-color: #ddd;
	width: 60%;
}

#approve_comments #content li.even {
	background-color: #fff;
}

#approve_comments .comment_text {
	margin-bottom: .5em;
}

#approve_comments .even .comment_text {
/*	background-color: #fff;*/
}


#approve_comments .actions form {
	display: inline;
}

#approve_comments input[type="submit"] {
	padding: 0;
	background-color: #ccc;
	border: 1px solid #333;
}

#approve_comments input[type="submit"]:hover {
	background-color: #666;
	color: #ccc;
}

/* User Admin */

#find_user {
	border-bottom: 1px solid #ccc;
	margin-bottom: 1em;
}

#user_admin #user_status {
	border-bottom: 1px solid #ccc;
	padding-bottom: 1em;
}

#user_admin #user_status li {
	margin-right: 2em;
}

#user_admin #open_session {
	padding: 1em 0 0;
}

#user_admin #open_session select {
	top: 0;
}

#user_admin #user_status form {
	display: inline;
}

#user_admin #manage_orders {
	margin-top: 1.25em;
}

#user_admin h4 {
	font-weight: bold;
	margin: 0 0 .75em;
}

#user_admin td, #user_admin table {
	padding-left: 0;
	border: none;
}

#user_admin table li {
	margin: 0 0 .3em;
}

/* Find user order */

#user_find_order label {
	width: 5em;
}

#user_find_order input[type="submit"] {
	margin-left: 7em;
}

#user_switch .warning {
	margin-bottom: 2em;
}

/* venue images */

#venue_img_update label {
	width: 10em;
}

#venue_img_update .tag_list {
	float: left;
	margin-right: 5em;
}

#venue_img_update p {
	clear: both;
}

/* Reports */

#manage_report_setup h4 {
	font-weight: bold;
	margin: 0 0 .75em;
}

#manage_report_setup label {
	width: 11em;
}

#manage_report_setup legend {
	display: block;
}

/* User groups */

.user_groups_admin td, .user_groups_admin th {
	vertical-align: top;
	font-size: 90%;
	line-height: 1.2;
}

.user_groups_admin td.cell_text {
	padding-top: 10px;
}

.user_groups_admin td.cell_select {
	padding-top: 8px;
}

.user_groups_admin td.cell_button {
	padding-top: 10px;
}

/* Orders */

#show_order h4 {
	font-weight: bold;
	margin-bottom: .75em;
}

#show_order .address li, #show_order .order_payment li {
	margin-bottom: 0;
	line-height: 1.3;
}

#show_order .order_list {
	margin-left: -4px;
}

#show_order .order_list, #show_order .order_list td {
	border: none;
}

#show_order .order_details td {
	border-right: 1px solid #aaa;
}

/* Sticky header */
th.gtwyStickyTop{
	position: sticky;
	top:0;
	z-index: 1;
	background-color: #c7c8c9;
	text-align:left;
	vertical-align:middle;
}	

th.lobStickyTop, th.threeDSStickyTop, th.pageContentStickyTop{
	position: sticky;
	padding-top:25px;
	padding-bottom:10px;
	top:0px;
	z-index: 1;
	background-color: #c7c8c9;
	text-align:left;
	vertical-align:middle;
}	

th.lobStickyTop-eventTrace{
	position: sticky;
	background-color: #c7c8c9;
	padding-top:25px;
	padding-bottom:10px;
}
th.userListStickyTop, th.matchMapCCStickyTop, th.viewTransactionStickyTop, th.userRolePermissionStickyTop{
	position: sticky;
	padding-top:25px;
	padding-bottom:10px;
	top:0px;
	z-index: 1;
	background-color: #c7c8c9;
	text-align:left;
	vertical-align:middle;
}	

th.stickyTopHeader{
	position: sticky;
	padding-top:25px;
	padding-bottom:10px;
	top:0px;
	z-index: 10;
	background-color: #c7c8c9;
	text-align:left;
	vertical-align:middle;
}	
		
td.gtwySticky-columnId, td.logSticky-columnId, td.threeDSSticky-columnId{
	position: sticky;
	left: 0;
	z-index: 2;
	background-color: #c7c8c9;
	font-weight:bold;
	text-align:center;
	vertical-align:middle;
}

td.leftSticky-column{
	position:sticky;
	left: 0;
	z-index: 2;
	background-color: #c7c8c9;
	font-weight:bold;
	vertical-align:middle;
}


td.gtwySticky-columnName{
	position:sticky;
	left: 45px;
	z-index: 2;
	background-color: #c7c8c9;
	font-weight:bold;
	text-align:center;
	vertical-align:middle;
	min-width:150px;
}

th.HeaderStickyTop{
	position: sticky;
	padding-top:5px;
	padding-bottom:10px;
	top:0px;
	z-index: 1;
	background-color: #c7c8c9;
	text-align:left;
	vertical-align:middle;
}

td.Sticky-columnId{
	position:sticky;
	left: 0;
	z-index: 2;
	background-color: #c7c8c9;
	font-weight:bold;
	text-align:center;
	vertical-align:middle;
}

th.Sticky-columnIdHead{
	position:sticky;
	left: 0;
	top:0px;
	padding-top:15px;
	z-index: 4;
	background-color: #c7c8c9;
	font-weight:bold;
	text-align:left;
	vertical-align:middle;
}

td.threeDSSticky-columnName{
	position:sticky;
	left: 43px;
	z-index: 2;
	background-color: #c7c8c9;
	font-weight:bold;
	text-align:center;
	vertical-align:middle;
	min-width:150px;
}

.threeDSSticky-columnName input{
	min-width:150px;
}

.gtwySticky-columnName input{
	min-width:150px;
}

.gtwyUnamePword{
	min-width:150px;
}

.gtwyUnamePword input{
	min-width:150px;
}

th.gtwySticky-columnIdHead, th.logSticky-columnIdHead,
th.threeDSSticky-columnIdHead{
	position:sticky;
	left: 0;
	top:0px;
	padding-top:15px;
	z-index: 4;
	background-color: #c7c8c9;
	font-weight:bold;
	text-align:left;
	vertical-align:middle;
}

th.gtwySticky-columnNameHead, th.threeDSSticky-columnNameHead, th.smsMsgDetailSticky-columnNameHead{
	position:sticky;
	left: 34px;
	top:0px;
	padding-top:15px;
	z-index: 4;
	background-color: #c7c8c9;
	font-weight:bold;
	text-align:left;
	vertical-align:middle;
}

#threeDSTable th, #pageContentTable th{
	text-align:center;
}

#gatewayTable td, #logTable td, #threeDSTable td, #pageContentTable td{
	vertical-align:middle;
}

.highlighted-row, .highlighted-row td{
	background-color: #e8e9eb;
}

/* manageMonitoringRequest */
#mmr_sme_form_1 table{
	max-width:100%;
	min-width:100%;
	position: relative;
	left: 0%;
	background-color: #c7c8c9;
}

@media only screen and (min-width:1490px){
	#mmr_sme_form_1 table{
		max-width:100%;
		min-width:100%;
		position: relative;
		left: 0%;
		background-color: #c7c8c9;
	}
}

@media only screen and (max-width:1490px){
	#mmr_sme_form_1 table{
		max-width:107%;
		min-width:107%;
		position: relative;
		left: -3%;
		background-color: #c7c8c9;
	}
}

#vit_smmccv_form_1 table, #vit_findmcc_form_1 table, #vit_ccrefid_form_1 table, #mce_expnm_form_1 table{
	position: relative;
	left: 0%;
	background-color: #c7c8c9;
}

#mccer_expiry_table, #ssps_stup_table_1, #ssps_cursts_table_1{
	position: relative;
	left: 0;
	background-color: #c7c8c9;
}

#msmd_lst_form_1 table{
	position: relative;
	background-color: #c7c8c9;
}

#monitoringTraceRequestTable, #act_ssa_sua_table, #act_ssa_updotp_table, #vvl_show_table_1{
	position: relative;
	background-color: #c7c8c9;
}

#monitoringTraceRequestTable input{
	font-size:13px;
	margin: 10px 5px;
	margin-right:10px;
	margin-left:10px;
	max-width:169px;
	max-width: 169px;
}

#monitoringTraceRequestTable input[type="submit"]{
	padding: 5px 10px;
	font-size:13px;
	font-weight: 700;
}

#mac_mngacs_submit_1{
	padding: 5px 10px;
	font-size:13px;
	font-weight: 700;
}

#act_ssa_sua_table  input[type="submit"], #act_ssa_updotp_table input[type="submit"], #mscs_lst_form_1 input[type="submit"]{
	padding: 5px 10px;
	font-size:13px;
	font-weight: 700;
}

#vvl_show_table_1 input[type="submit"], #vvl_show_table_1 input[type="button"]{
	padding: 5px 10px;
	font-size:13px;
	font-weight: 700;
}


#logTable{
	position: relative;
	left: -3%;
}

#mmr_sme_form_1 input{
	font-size:13px;
	float: right;
	margin-right:10px;
	margin-left:10px;
	max-width:169px;
	max-width: 169px;
}

#mmr_sme_clrbtn_1, #mmr_sme_submit_1{
	min-width: 169px;
}

#vit_smmccv_submit_1, #vit_findmcc_submit_1, #vit_ccrefid_submit_1, #mpcs_ssl_submit_1, #msmd_lst_submit_1, #mce_expnm_submit_1{
	min-width: 180px;
	height: 30px;
	font-size:13px;
	font-weight: 700;
}
.mmr_sme_fourth_row{
	position: relative;
	top: -15px;
}

#mmr_sme_submit_1, #mmr_sme_clrbtn_1{
	padding:10px 25px;
	font-size:22px;
	font-weight: bold;
}

#mmr_sme_form_1 select{
	float: right;
	padding: 5px 5px;	
	margin-right:10px;
	margin-left:10px;
	font-size:13px;
	max-width:169px;
	min-width:169px;
}

.mne_td_label{
	 height: 2rem;
  	line-height: 2rem;
}

 #mmr_sme_showgtwynm_1{
 font-size:13px;
	max-width:193px;
}

#mmr_sme_form_1 td{
	padding-top: 10px;
	padding-left: 10px;
	font-weight:700;
	font-size:13px;
}


/* page content form - left-content and right-content */

@media only screen and (min-width:1600px){
	#left-content{
		max-width:45%;
		display:inline-block;
	}
	
	#right-content{
		max-width:45%;
		margin-left:15%;
		margin-top:-100px;
		top:25%;
		left: 30%;
		position:fixed;
	}
	
	#stgIframe{
		margin-top:100px;
	}
	
	#showiFrameButton, #showDetailButton{
		left: 60%;
		position: fixed;
		top: 30%;
	}
	
	#stgIframe, #liveIframe{
		margin-bottom:20px;
		padding:20px;
	}
	
	#containsTableHeader{
		position: fixed;
		left: 60%;
		top: 25%;
	}
	
	#containsTable{
		position: fixed;
		left: 80%;
		top:30%;
	}
	
	#imageContentTableHeader{
		top:47%;
		left:60%;
		position: fixed;
	}
	
	#imageContentTable{
		top:55%;
		left:80%;
		position: fixed;
	}
	
	#hideDetailButtonHeader{
		display: none;
		left: 60%;
		position: fixed;
		top: 20%;
	}
	
	#hideiFrameButton{
		display: none;
		left: 60%;
		position: fixed;
		top: 20%;	
	}
	
	#right-content label{
		width: 8em;
	}
}


@media only screen and (max-width:1600px) and (min-width:1455px){
	#left-content{
		max-width:45%;
		display:inline-block;
	}
	
	#right-content{
		max-width:45%;
		margin-left:15%;
		margin-top:-100px;
		top:25%;
		left: 30%;
		position:fixed;
	}
	
	#stgIframe{
		margin-top:100px;
	}
	
	#showiFrameButton, #showDetailButton{
		left: 60%;
		position: fixed;
		top: 30%;
	}
	
	#stgIframe, #liveIframe{
		margin-bottom:20px;
		padding:20px;
	}
	
	#containsTableHeader{
		position: fixed;
		left: 60%;
		top: 25%;
	}
	
	#containsTable{
		position: fixed;
		left: 84%;
		top:30%;
	}
	
	#imageContentTableHeader{
		top:47%;
		left:60%;
		position: fixed;
	}
	
	#imageContentTable{
		top:55%;
		left:84%;
		position: fixed;
	}
	
	#hideDetailButtonHeader{
		display: none;
		left: 60%;
		position: fixed;
		top: 20%;
	}
	
	#hideiFrameButton{
		display: none;
		left: 60%;
		position: fixed;
		top: 20%;	
	}
	
	#right-content label{
		width: 8em;
	}
}

@media only screen and (max-width:1455px) and (min-width:1200px){
	#left-content{
		max-width:45%;
		display:inline-block;
	}
	
	#right-content{
		max-width:45%;
		margin-left:0%;
		margin-top:-100px;
		top:25%;
		left: 37%;
		position:fixed;
	}
	
	#stgIframe{
		margin-top:100px;
	}
	
	#showiFrameButton, #showDetailButton{
		left: 60%;
		position: fixed;
		top: 30%;
	}
	
	#stgIframe, #liveIframe{
		margin-bottom:20px;
		padding:20px;
	}
	
	#containsTableHeader{
		position: fixed;
		left: 60%;
		top: 25%;
	}
	
	#containsTable{
		position: fixed;
		left: 82%;
		top:30%;
	}
	
	#imageContentTableHeader{
		top:47%;
		left:60%;
		position: fixed;
	}
	
	#imageContentTable{
		top:55%;
		left:82%;
		position: fixed;
	}
	
	#hideDetailButtonHeader{
		display: none;
		left: 60%;
		position: fixed;
		top: 20%;
	}
	
	#hideiFrameButton{
		display: none;
		left: 60%;
		position: fixed;
		top: 20%;	
	}
	
	#right-content label{
		width: 8em;
	}
}

#stgIframe, #liveIframe, #containsTable, #containsTableHeader{
		display: none;
}

#containsTable input, #containsTableHeader input{
	max-width:75px;
	text-align:center;
}

#imageContentTable input{
	max-width:38px;
	text-align:center;
	font-size: 16px;	
}

#imageContentTable img{
	max-width:25px;
}

#imageTablelabel{
	font-weight: bold;
}

#imageContainer input{
	max-width:50px;
	 margin-left: 20px;
	 top: -10px;
	 position: relative;
}

#hideiFrameButton{
	display: none;
}

#hideDetailButton{
	display: none;
}

.green-text{
	font-weight:bold;
	color: green;
	font-size: 35px;
	max-width: 20px;
}

.red-text{
	color: red;
}


@media only screen and (max-width:1200px){
	#stgIframe, #liveIframe{
			margin-bottom:20px;
			display: none;
			padding:20px;
			max-width:45%;
		}
		
		#showiFrameButton, #showDetailButton{
			left: 130px;
			position: relative;
			top: -47px;
		}
		
		#imageContentTable{
			top:40px;
			left:20%;
			position: relative;
			margin-bottom: 20px;
		}
		
		#containsTableHeader table{
			left: 20%;
			position: fixed;
		}
		
		#hideDetailButton{
			display: none;
			left: 30%;
		}	
	
}


/* send sms div */
.sendSmsterms-container, .sendEmailterms-container {
    position: relative;
    display: inline-block;
}

#sendSms-TermsofService, #sendEmail-TermsofService {
    cursor: pointer;
    color: blue;
    text-decoration: underline;
}

.sendSms-terms-hidden{
	display: none;
}

 .sendEmail-terms-hidden{
	display: none;
 }
 
#sendSms-terms-details, #sendEmail-terms-details {
	position: absolute;
	top:-40vh;
	left: 25vw; 
	width: calc(100vw - 60vw);
	height: 30vh;
	overflow: auto;
	background-color: #fff; 
	padding: 20px;
	border: 1px solid #aaa;
	text-align: left;
}

.sendSmsterms-container:hover #sendSms-terms-details, .sendEmailterms-container:hover #sendEmail-terms-details {
    display: flex;
	flex-direction: column;
	align-items: center; 
}

#terms-of-service-title{
	font-weight: bolder;
	text-decoration: underline;
}

#sms_phonenumber_div, #email_address_div{
	opacity: 0; 
	max-height: 0; 
	overflow: hidden; 
	transition: opacity 0.5s ease, max-height 0.5s ease; 
	margin-top: 0px;
	border-top: 1px solid #aaa;
	border-right: 1px solid #aaa;
	display: none;
}

#sms_phonenumber_div td, #email_address_div td{
	border: none;
}

#sms-detail-div{
	display: none;
}

#hideSmsPay{
	display: none;
}
/* end of sms div */


/* CASE TOOLTIP - CHECKING IF CAPS LOCK IS ON */
.caps-tooltip {
	position: relative;
	background-color: #fff;
	color: #f44336;
	padding: 5px 5px;
	border: 1px solid black;
	font-size: 14px;
	z-index: 1000;
	white-space: nowrap;
	max-width: 100px;
}