html { /* prevent page bounce; */ /* position: fixed;*/ overflow: hidden; width: 100%; height: 100%; /* overscroll-behavior: none; /* prevent bounce */ } body { width: 100%; height: 100%; background-color: #fff; /* #ffe6e6; */ overflow: auto; user-select: none; -webkit-user-select: none; /* Safari */ } .coalitiontable td { text-align: center; } .otree-chat__input { width: 80%; } #redfont { color: red; font-weight: bold; } .otree-btn-next { font-size: 20px; } #acetext { font-size: 20px; } .page-header { margin-top: 20px; margin-bottom: 10px; padding-top: 0px; } p, b, li, label { font-size: 20px; } td.roundendtable { text-align: center; } .otree-timer { display: none; } #mobileokbutton { visibility: hidden; } #bidwrapperabs { position: absolute; top: 250px; height: 210px; width: 100%; align-items: center; position: relative; justify-content: center; margin: 0 auto; } #buttonrow_desktop { position: absolute; top: 250px; width: 100%; align-items: center; } #biddivabs { font-size: 20px; position: absolute; cursor: move; width: 50vw; /* 50 viewport percentage length */ height: 50vw; /* 50 viewport percentage length */ touch-action: none; user-select: none; border: 1px solid black; background-color: #f1f1f1; -webkit-user-select: none; -webkit-touch-callout: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } #rejectaccept { visibility: hidden; font-size: 18px; } #bid { visibility: hidden; /* this is made visible for the sequential search live task */ position: relative; top: 30%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } td, th { text-align: center; font-size: 16px; border-bottom: 1px solid #ddd; padding: 2px; } .sequencetable td { width: 25px; text-align: center; font-size: 18px; border: 1px solid #ddd; padding: 1px; } .profittable td { width: 40px; text-align: center; font-size: 18px; border: 1px solid #ddd; padding: 2px; } .blockendtable td { width: 40px; overflow: hidden; display: inline-block; white-space: nowrap; text-align: center; font-size: 18px; border: 1px solid #ddd; padding: 2px; } .blockendtable th { font-weight: normal; text-align: right; font-size: 18px; border: 1px solid #ddd; padding: 2px; } #boxrow { position: absolute; top: 70px; left: 10px; right: 10px; visibility: hidden; } #flankerrow { margin: auto; text-align: center; position: absolute; width: 100%; top: 150px; font-size: 30px; visibility: hidden; font-family: monospace, monospace; } #boxrow_blockend { position: absolute; top: 70px; left: 10px; right: 10px; visibility: hidden; } #baselineheader { /* this replaces boxrow in the baseline rounds, contains only text */ font-size: 20px; position: absolute; text-align: center; top: 70px; left: 10px; right: 10px; } #boxrow_desktop { /*position: absolute; */ border-radius: 50px; /* top: 70px; left: 10px; right: 10px; */ visibility: visible; } #boxrow_instr1, #boxrow_instr2, #boxrow_instr3 { position: relative; } .box, .mostvalbox, .opaquebox, .valuebox { margin: 3px; /* for iPhone SE the margin should not be too large */ float: left; display: flex; align-items: center; justify-content: center; /* align horizontally */ height: 30px; /* default 30px; make 40px for decimal valued boxes */ width: 30px; border: 1px solid black; background-color: #f1f1f1; font-size: 12px; /* made larger 24px for the ice cream apps */ } .valuebox { } .opaquebox { opacity: 0.3; } .currentbox { margin: 3px; /* for iPhone SE the margin should not be too large */ float: left; text-align: center; vertical-align: middle; height: 30px; /* default 30px; make 40px for boxes with decimal values */ width: 30px; } .currentbox_none { /* this is for the button version (none) */ margin: 3px; /* for iPhone SE the margin should not be too large */ float: left; text-align: center; vertical-align: middle; height: 30px; /* default 30px; make 40px for boxes with decimal values */ width: 30px; border: 1px solid black; background-color: #f1f1f1; } #blockendinfo { top: 250px; left: 10px; position: absolute; height: 400px; width: 95%; align-items: center; justify-content: center; margin: 0 auto; overflow: scroll; } .leftalign { text-align: left; } #roundinfo { text-align: center; } .acetable table, td { vertical-align: top; text-align: left; } .acetable tr { border: 1px; } #details { display: none; padding: 8px; background-color: #ddd; } .choicebutton { /*visibility: hidden;*/ background-color: #0d6efd; /* ; oTree Blue */ border: none; color: white; /*padding: 8px 15px;*/ text-align: center; text-decoration: none; font-size: 20px; /* 20 */ width: 80px; height: 46px; border-radius: 5px; } #tapbuttons { position: absolute; top: 260px; width: 100%; align-items: center; position: relative; justify-content: center; margin: 0 auto; } #float-child-element { float: left; width: 50%; } #red { margin-left: 15%; background-color: 'red'; } #yellow { margin-right: 15%; text-align: right; background-color: 'yellow'; } #boxinstructiontext { font-size: 12px; } .XCslidercontainer { width: 90%; } .td1 { border: 0px; text-align: center; vertical-align: middle; font-size: 28px; } .td1 span { /* this controls the span elements that make up the "50" boxes */ display: inline-block; margin-left: auto; margin-right: auto; align-items: center; } .XCslider { -webkit-appearance: none; width: 95%; height: 46px; background: #d3d3d3; outline: none; opacity: 0.7; -webkit-transition: .2s; transition: opacity .2s; } .XCslider:hover { opacity: 1; } .XCslider::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 46px; height: 46px; background: #0d6efd; cursor: pointer; } .XCslider::-moz-range-thumb { width: 46px; height: 46px; background: #0d6efd; cursor: pointer; }