html{height:100%;} body{height:100%;} .appContainerBx{ display:inline-block; width:100%; min-width:300px; box-sizing:border-box; -moz-box-sizing: border-box; } .appNoti{ margin:30px 9%; text-align:center; font-size:100%; line-height:20px; padding:20px 25px; background-color:#f5f5f5; color:#444; box-sizing:border-box; -moz-box-sizing: border-box; } .appNotiTitle{ font-size:110%; font-weight:700; line-height:23px; } .appNotiDesc{ margin-bottom:10px; color:#999; font-weight:normal; } .appNotiButtons{ } .notiButton{ display:inline-block; margin:5px; padding:12px 24px; background:#e5e5e5; color:#444; font-size:100%; line-height:12px; font-weight:normal; text-align:center; vertical-align:middle; text-overflow:ellipsis; overflow:hidden; cursor:pointer; border:none; border-radius:999px; box-sizing:border-box; -moz-box-sizing: border-box; } .notiButton:hover{ background:#999; color:#fff; } .appAppHighlight { width: 138px; height: 138px; margin-right: 30px; margin-top: 30px; display: inline-block; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; position: relative; opacity: 0.2; background-color: #ccc; } .grab { cursor: -webkit-grab; cursor:-moz-grab; } .grab:active { cursor: -webkit-grabbing; cursor:-moz-grabbing;} /*disable scrollbar*/ ::-webkit-scrollbar {display:none;} .forms { background-color: rgb(244,244,244) ; font: normal 12px arial,verdana; padding: 3px; border: 1px solid #C8C8C8; } .resultsleft { background-color: rgb(244,244,244) ; font: normal 12px arial,verdana; padding: 3px; border: 1px solid #C8C8C8; margin-left:100px; text-align:left; color: #990000; } .teamBox { width:330px; margin:10px 10px 10px 20px ; background-color: #EAEAEA; } .bottomTeamBox { width:683px; margin:10px 10px 10px 20px ; background-color: rgb(244,244,244); } .teamBox, .bottomTeamBox { -moz-box-shadow:inset 0px 2px 0px 0px #808080; /* burgundy glare ontop of button */ -webkit-box-shadow:inset 0px 2px 0px 0px #808080; box-shadow:inset 0px 2px 0px 0px #808080; float:left; font: normal 12px arial,verdana; border: 1px solid #C8C8C8; text-align:left; color: #990000; -moz-border-radius:6px; /* this makes rounded corners */ -webkit-border-radius:6px; border-radius:6px; } .teamNumber { float: left; padding:7px 0px 0px 10px; width:213px; /*change back to 210 after getting rid of red borders*/ height:35px; font: bold 32px Georgia, "Times New Roman", Times, serif; } .playerNames { padding-left:10px; line-height:30px; width:209px; height:30px; float:left; color: #808080; font: bold 14px arial, verdana; border-top: 1px solid #C8C8C8; } .playerLevel { line-height:30px; width:80px; height:30px; float:left; font: bold 14px arial, verdana; color: #808080; border-top: 1px solid #C8C8C8; } .pointsEarned { padding-left:12px; line-height:25px; float: left; width: 210px; /*change back to 210 after getting rid of red borders*/ height: 20px; font: bold 12px arial, verdana; color: #494949; } .wonOrLost { padding-top:5px; width: 110px; /*change back to 120 after getting rid of red borders*/ float: left; height: 60px; color: #990000; line-height:50px; text-align:center; } .registeredplayers { background-color: rgb(244,244,244); font: normal 12px arial,verdana; padding: 3px; border: 1px solid #C8C8C8; margin-left:40px; text-align:left; color: #990000; } .resultsright { background-color: rgb(244,244,244) ; font: normal 12px arial,verdana; padding: 3px; border: 1px solid #C8C8C8; margin-right:75px; text-align:left; color: #990000; } .resultsmiddle { background-color: rgb(244,244,244) ; font: normal 12px arial,verdana; padding: 3px; border: 1px solid #C8C8C8; margin-left:200px; text-align:left; color: #990000; } .myaccount { background-color: rgb(244,244,244); font: normal 12px arial,verdana; padding: 2px 5px; border: 1px solid #CAE4FF; } a { color: #03c; } currentRankNumber { font: normal 12px arial,verdana; } .main { font: normal 12px arial,verdana; padding: 2px; margin: 2px; margin-left: auto; margin-right: auto; } .titlehdr { font: normal 22px arial, verdana; color: #c00; border-bottom: 1px solid #c00; } .medhdr { font: bold 24px arial, verdana; color: #c00; border-bottom: 1px solid #c00; } #panel1, #panel2, #panel3, #panel4, #panel5, #test3, #rankSelectionContainer { text-shadow:1px 1px 0px #3e3b36; display:none; background-color: #808080; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; opacity:0.97; filter:alpha(opacity=97); /* For IE8 and earlier */ z-index:25; } .msg { width: 600px; color: #c00; background-color: #FEF1ED; font: bold 13px verdana; } .error { color: #c00; padding: 2px; } .errormiddle { float: left; color: #AA0004; font: bold 14px arial, verdana; border: 1px solid #c00; padding: 10px; background-color: #FEF1ED; width:701px; margin-bottom:10px; } .example { font: normal 10px arial; color: red; } .approved { font: normal 10px arial; color: green; } .loginform { font: 16px normal arial; background-color: #E4F8FA; font: normal 12px arial,verdana; padding: 3px; border: 1px solid #CAE4FF; } .loginform #txtbox { font: bold 13px arial; color: #990000; } .largeltburgundy{ width:721; color: #AA0004; font: bold 14px arial, verdana; border: 1px solid #c00; padding:5px; margin: 0px 200px 0px 200px; display:block; } .logintext { text-align:right; float:left; height:45px; width:630px; font: 10px arial; } .container { width: 910px; margin: 0 auto; /* the auto value on the sides, coupled with the width, centers the layout */ } h1, h2, h3, h4, h5, h6, p { margin-top: 0; /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */ padding-right: 15px; padding-left: 15px; /* adding the padding to the sides of the elements within the divs, instead of the divs themselves, gets rid of any box model math. A nested div with side padding can also be used as an alternate method. */ } .sidebar, .sidebaractive { float: left; font-size: 12px; width: 181px; height: 35px; background-color: #EAEAEA; border-bottom: 1px solid #C4C4C4; border-top: 1px solid #F0F0F0 ; list-style: none; text-decoration: none; text-align:center; line-height:35px; font-weight:bold; cursor:pointer; /* makes the cursor a pointer instead of select text */ display: block; /* makes it so that the whole box can be clicked */ position:relative; z-index:5; } .gameTimeOnCreateGame { width:644px; position:relative; z-index: 3; padding:0px 40px 0px 40px; float:left; border-bottom-right-radius: 5px; } #panel1,#flip1,#panel2,#flip2,#panel3,#flip3,#panel4,#flip4,#panel5,#flip5, #rankSelectionContainer {text-align:center; position:relative; z-index:5;} .sidebar { text-shadow:1px 1px 0px White; color: white; background: -ms-linear-gradient(top, #FFFFFF 0%, #C4C4C4 200%);/* IE10 Consumer Preview */ background: -moz-linear-gradient(top, #FFFFFF 0%, #C4C4C4 200%);/* Mozilla Firefox */ background: -o-linear-gradient(top, #FFFFFF 0%, #C4C4C4 200%);/* Opera */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFFF), color-stop(2, #C4C4C4));/* Webkit (Safari/Chrome 10) */ background: -webkit-linear-gradient(top, #FFFFFF 0%, #C4C4C4 200%);/* Webkit (Chrome 11+) */ background: linear-gradient(to bottom, #FFFFFF 0%, #C4C4C4 200%); /* W3C Markup */ /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#C4C4C4',GradientType=0 ); /* IE6-9 this causes IE to not show drop down div menus. if i want gradiant to work in IE i have to solve this problem */ } .button, .dropButton {width: 100px;} .smallbutton, .smallbuttoninvert {width: 60px} .smallbuttoninvert { -moz-box-shadow:inset 0px 2px 0px 0px #DD0005; /* burgundy glare ontop of button */ -webkit-box-shadow:inset 0px 2px 0px 0px #DD0005; box-shadow:inset 0px 2px 0px 0px #DD0005; background: #8e0205; /* Old browsers */ background: -moz-linear-gradient(top, #8e0205 0%, #7f0204 43%, #590001 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8e0205), color-stop(43%,#7f0204), color-stop(100%,#590001)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #8e0205 0%,#7f0204 43%,#590001 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #8e0205 0%,#7f0204 43%,#590001 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #8e0205 0%,#7f0204 43%,#590001 100%); /* IE10+ */ background: linear-gradient(to bottom, #8e0205 0%,#7f0204 43%,#590001 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8e0205', endColorstr='#590001',GradientType=0 ); /* IE6-9 */ border:1px solid #690000; line-height: 17px; } .button, .smallbutton { /* gray glare ontop of button */ -moz-box-shadow:inset 0px 2px 0px 0px #C4C4C4; -webkit-box-shadow:inset 0px 2px 0px 0px #C4C4C4; box-shadow:inset 0px 2px 0px 0px #C4C4C4; background-color:#494949; /* gray background for Old browsers */ background: -moz-linear-gradient(top, #8c8c8c 0%, #7c7c7c 43%, #565656 100%); /* gray gradiant */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8c8c8c), color-stop(43%,#7c7c7c), color-stop(100%,#565656)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #8c8c8c 0%,#7c7c7c 43%,#565656 100%); background: -o-linear-gradient(top, #8c8c8c 0%,#7c7c7c 43%,#565656 100%); background: -ms-linear-gradient(top, #8c8c8c 0%,#7c7c7c 43%,#565656 100%); background: linear-gradient(to bottom, #8c8c8c 0%,#7c7c7c 43%,#565656 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8c8c8c', endColorstr='#565656',GradientType=0 ); border:1px solid #494949; /* border around button */ line-height: 21 px; } .button:hover, .smallbutton:hover, .dropButton:hover { -moz-box-shadow:inset 0px 1px 0px 0px #DD0005; -webkit-box-shadow:inset 0px 1px 0px 0px #DD0005; box-shadow:inset 0px 1px 0px 0px #DD0005; background-color:#690000; /* Old browsers */ background: -moz-linear-gradient(top, #590001 0%, #7f0204 56%, #8e0205 100%); /* burgundy gradiant */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#590001), color-stop(56%,#7f0204), color-stop(100%,#8e0205)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #590001 0%,#7f0204 56%,#8e0205 100%); background: -o-linear-gradient(top, #590001 0%,#7f0204 56%,#8e0205 100%); background: -ms-linear-gradient(top, #590001 0%,#7f0204 56%,#8e0205 100%); background: linear-gradient(to bottom, #590001 0%,#7f0204 56%,#8e0205 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#590001', endColorstr='#8e0205',GradientType=0 ); } .smallbuttoninvert:hover { -moz-box-shadow:inset 0px 1px 0px 0px #C4C4C4; -webkit-box-shadow:inset 0px 1px 0px 0px #C4C4C4; box-shadow:inset 0px 1px 0px 0px #C4C4C4; background: #565656; /* Old browsers */ background: -moz-linear-gradient(top, #565656 1%, #7c7c7c 57%, #8c8c8c 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#565656), color-stop(57%,#7c7c7c), color-stop(100%,#8c8c8c)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #565656 1%,#7c7c7c 57%,#8c8c8c 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #565656 1%,#7c7c7c 57%,#8c8c8c 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #565656 1%,#7c7c7c 57%,#8c8c8c 100%); /* IE10+ */ background: linear-gradient(to bottom, #565656 1%,#7c7c7c 57%,#8c8c8c 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#565656', endColorstr='#8c8c8c',GradientType=0 ); /* IE6-9 */ border:1px solid #494949; } .button, .smallbutton, .smallbuttoninvert { display:inline-block; /*THIS IS FOR ALL BUTTONS */ color:#ffffff!important; text-decoration: none !important; font-family:arial; font-size:93%; font-weight:bold; height: 20px; line-height: 20 px; text-align: center; text-shadow:1px 1px 0px Black; margin: 2px 5px 2px 5px; -moz-border-radius:6px; /* this makes rounded corners */ -webkit-border-radius:6px; border-radius:6px; font: bold 12px Arial, Helvetica, sans-serif; } .dropButton { -moz-box-shadow:inset 0px 2px 0px 0px #C4C4C4; -webkit-box-shadow:inset 0px 2px 0px 0px #C4C4C4; box-shadow:inset 0px 2px 0px 0px #C4C4C4; background-color:#494949; /* gray background for Old browsers */ background: -moz-linear-gradient(top, #8c8c8c 0%, #7c7c7c 43%, #565656 100%); /* gray gradiant */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#8c8c8c), color-stop(43%,#7c7c7c), color-stop(100%,#565656)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #8c8c8c 0%,#7c7c7c 43%,#565656 100%); background: -o-linear-gradient(top, #8c8c8c 0%,#7c7c7c 43%,#565656 100%); background: -ms-linear-gradient(top, #8c8c8c 0%,#7c7c7c 43%,#565656 100%); background: linear-gradient(to bottom, #8c8c8c 0%,#7c7c7c 43%,#565656 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8c8c8c', endColorstr='#565656',GradientType=0 ); border:1px solid #494949; /* border around button */ line-height: 21 px; display:inline-block; /*THIS IS FOR ALL BUTTONS */ color:#ffffff!important; text-decoration: none !important; font-family:arial; font-size:93%; font-weight:bold; height: 20px; line-height: 20 px; text-align: center; text-shadow:1px 1px 0px Black; -moz-border-radius:0px 0px 6px 6px; /* this makes rounded corners */ -webkit-border-radius:0px 0px 6px 6px; border-radius:0px 0px 6px 6px; margin: 1px; } .button:active, .smallbutton:active, .smallbuttoninvert:active{ /*THIS IS FOR ALL BUTTONS WHEN ACTIVE */ top:1px; left:1px; } .dateSelection { font-size: 13px; font-weight:bold; padding: 3px; color: white; background: #7db9e8; /* Old browsers */ -webkit-appearance: none; background: -moz-linear-gradient(top, #7db9e8 0%, #2989d8 50%, #1e5799 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7db9e8), color-stop(50%,#2989d8), color-stop(100%,#1e5799)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #7db9e8 0%,#2989d8 50%,#1e5799 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #7db9e8 0%,#2989d8 50%,#1e5799 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #7db9e8 0%,#2989d8 50%,#1e5799 100%); /* IE10+ */ background: linear-gradient(to bottom, #7db9e8 0%,#2989d8 50%,#1e5799 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7db9e8', endColorstr='#1e5799',GradientType=0 ); /* IE6-9 */ border:1px solid #7c7c7c; line-height: 17px; height: 25px; width:50px; } .dateBoxes { width:50px; float:left; text-align:center; } .content { padding: 10px 0; width: 780px; float: left; } .text { z-index: 2; color: red; float:left; } .footer { padding: 10px 0; background-color: #CCC49F; position: relative;/* this gives IE6 hasLayout to properly clear */ clear: both; /* this clear property forces the .container to understand where the columns end and contain them */ } .playerbox { color: white; height: 23px; width: 150px; padding: 3px 5px 3px 5px; border-style: none; background-image: url(./media/textfieldwidget.png); font-family: courier new; font-size: 14px } .redinformationbox, .informationbox { margin:5px; font: normal 12px arial,verdana; border: 1px solid #2A6BA0; height: auto; float:left; line-height:20px; -moz-border-radius:6px; /* this makes rounded corners */ -webkit-border-radius:6px; border-radius:6px; } .redinformationbox { background-color: #4082C3 ; color: rgb(244,244,244); text-align:center; } .informationbox { background-color: rgb(244,244,244); color: #2A6BA0; } .winorlose { width:40px; height:18px; float:left; background-color: #808080; -moz-border-radius:6px; /* this makes rounded corners */ -webkit-border-radius:6px; border-radius:6px; /* opacity:0.90; /// CAUSES LAYER TO GO TO TOP */ text-shadow:1px 1px 0px White; color: #990000; text-align:center; background-image: -ms-linear-gradient(top, #FFFFFF 0%, #C4C4C4 200%);/* IE10 Consumer Preview */ background-image: -moz-linear-gradient(top, #FFFFFF 0%, #C4C4C4 200%);/* Mozilla Firefox */ background-image: -o-linear-gradient(top, #FFFFFF 0%, #C4C4C4 200%);/* Opera */ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFFF), color-stop(2, #C4C4C4));/* Webkit (Safari/Chrome 10) */ background-image: -webkit-linear-gradient(top, #FFFFFF 0%, #C4C4C4 200%);/* Webkit (Chrome 11+) */ background-image: linear-gradient(to bottom, #FFFFFF 0%, #C4C4C4 200%); /* W3C Markup */ } .downAarow { font: bold 16px arial,verdana; border-bottom-color:white; height:20px; cursor:pointer; } .rankNames, .appointmentDates { height: 25px; display:block; line-height:22px; } .sidebar A:link, .logintext A:link {text-decoration: none; color: #2A6BA0;} .sidebar A:visited, .logintext A:visited {text-decoration: none; color: #2A6BA0;} .sidebar A:hover, .logintext A:hover {text-decoration: underline; color: #2A6BA0; text-shadow:none; position: relative; left:1px; top:1px} .sidebar A:active, .logintext A:active {text-decoration: none; color: #2A6BA0; } #panel1 A:link, #panel2 A:link,#panel3 A:link,#panel4 A:link,#panel5 A:link, #rankSelectionContainer A:link {text-decoration: none; color: #c4c4c4;} #panel1 A:visited, #panel2 A:visited,#panel3 A:visited,#panel4 A:visited,#panel5 A:visited, #rankSelectionContainer A:visited {text-decoration: none; color: #c4c4c4;} #panel1 A:hover, #panel2 A:hover,#panel3 A:hover,#panel4 A:hover,#panel5 A:hover {text-decoration: underline; color: #1D5582;} #panel1 A:active, #panel2 A:active,#panel3 A:active,#panel4 A:active,#panel5 A:active {text-decoration: none; color: #c4c4c4;} .loadingSpinner { position: absolute; width: 25px; height: 25px; top: 0; bottom: 0; left: 0; right: 0; margin: auto; } .spinnerBlock { width: 25px; height: 25px; position: absolute; } .spinnerBlock-1 { background-color: #966e28; top: 0; left: 0; z-index: 1; animation: spinnerBlock-1_move 1.8s cubic-bezier(.6,.01,.4,1) infinite; } .spinnerBlock-2 { background-color: #3857b4; top: 0; right: 0; animation: spinnerBlock-2_move 1.8s cubic-bezier(.6,.01,.4,1) infinite; } .spinnerBlock-3 { background-color: #694ae6; bottom: 0; right: 0; z-index: 1; animation: spinnerBlock-3_move 1.8s cubic-bezier(.6,.01,.4,1) infinite; } .spinnerBlock-4 { background-color: #e357b8; bottom: 0; left: 0; animation: spinnerBlock-4_move 1.8s cubic-bezier(.6,.01,.4,1) infinite; } @keyframes spinnerBlock-1_move { 0%, 100% {transform: translate(0, 0)} 25% {transform: translate(0, 25px)} 50% {transform: translate(25px, 25px)} 75% {transform: translate(25px, 0)} } @keyframes spinnerBlock-2_move { 0%, 100% {transform: translate(0, 0)} 25% {transform: translate(-25px, 0)} 50% {transform: translate(-25px, 25px)} 75% {transform: translate(0, 25px)} } @keyframes spinnerBlock-3_move { 0%, 100% {transform: translate(0, 0)} 25% {transform: translate(0, -25px)} 50% {transform: translate(-25px, -25px)} 75% {transform: translate(-25px, 0)} } @keyframes spinnerBlock-4_move { 0%, 100% {transform: translate(0, 0)} 25% {transform: translate(25px, 0)} 50% {transform: translate(25px, -25px)} 75% {transform: translate(0, -25px)} } /* --------------------------------------------- Column --------------------------------------------- */ .col-l {float:left;} .col-r {float:right;} .col-c {display:block;text-align:left;overflow: hidden;} /* --- General Width Sizing --- */ .col-12 {width: 100%;} .col-11 {width: 91.66666667%;} .col-10 {width: 83.33333333%;} .col-9 {width: 75%;} .col-8 {width: 66.66666667%;} .col-7 {width: 58.33333333%;} .col-6 {width: 50%;} .col-5 {width: 41.66666667%;} .col-4 {width: 33.33333333%;} .col-3 {width: 25%;} .col-2 {width: 16.66666667%;} .col-1 {width: 8.33333333%;} /* --- Mobile First Design ( XS < 576px ) --- */ .xs-12 {width: 100%;} .xs-11 {width: 91.66666667%;} .xs-10 {width: 83.33333333%;} .xs-9 {width: 75%;} .xs-8 {width: 66.66666667%;} .xs-7 {width: 58.33333333%;} .xs-6 {width: 50%;} .xs-5 {width: 41.66666667%;} .xs-4 {width: 33.33333333%;} .xs-3 {width: 25%;} .xs-2 {width: 16.66666667%;} .xs-1 {width: 8.33333333%;} /* --------------- Tablet ( Small Screen > 576px ) --------------- */ @media (min-width: 576px){ .s-12 {width: 100%;} .s-11 {width: 91.66666667%;} .s-10 {width: 83.33333333%;} .s-9 {width: 75%;} .s-8 {width: 66.66666667%;} .s-7 {width: 58.33333333%;} .s-6 {width: 50%;} .s-5 {width: 41.66666667%;} .s-4 {width: 33.33333333%;} .s-3 {width: 25%;} .s-2 {width: 16.66666667%;} .s-1 {width: 8.33333333%;} } /* --------------- Desktop ( Medium Screen > 768px ) --------------- */ @media (min-width: 768px){ .m-12 {width: 100%;} .m-11 {width: 91.66666667%;} .m-10 {width: 83.33333333%;} .m-9 {width: 75%;} .m-8 {width: 66.66666667%;} .m-7 {width: 58.33333333%;} .m-6 {width: 50%;} .m-5 {width: 41.66666667%;} .m-4 {width: 33.33333333%;} .m-3 {width: 25%;} .m-2 {width: 16.66666667%;} .m-1 {width: 8.33333333%;} } /* --------------- Desktop ( Large Screen > 992px ) --------------- */ @media (min-width: 992px){ .l-12 {width: 100%;} .l-11 {width: 91.66666667%;} .l-10 {width: 83.33333333%;} .l-9 {width: 75%;} .l-8 {width: 66.66666667%;} .l-7 {width: 58.33333333%;} .l-6 {width: 50%;} .l-5 {width: 41.66666667%;} .l-4 {width: 33.33333333%;} .l-3 {width: 25%;} .l-2 {width: 16.66666667%;} .l-1 {width: 8.33333333%;} } /* --------------- Desktop ( XL > 1200px ) --------------- */ @media (min-width: 1200px){ .xl-12 {width: 100%;} .xl-11 {width: 91.66666667%;} .xl-10 {width: 83.33333333%;} .xl-9 {width: 75%;} .xl-8 {width: 66.66666667%;} .xl-7 {width: 58.33333333%;} .xl-6 {width: 50%;} .xl-5 {width: 41.66666667%;} .xl-4 {width: 33.33333333%;} .xl-3 {width: 25%;} .xl-2 {width: 16.66666667%;} .xl-1 {width: 8.33333333%;} } /* ---------------------------------------------- Align ---------------------------------------------- */ .v-align:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; margin: 0 0 0 -5px; } /* --------------------------------------------- Arrows --------------------------------------------- */ .up-arrow { display:inline-block; width: 0; height: 0; margin: 0 1px 1px 0; line-height: 0; vertical-align:middle; font-size: 0; border-style: solid; border-width: 4px; border-color: transparent; border-bottom: 4px solid #222; border-top-width: 0; } .down-arrow { display:inline-block; width: 0; height: 0; margin: 0 1px 1px 0; line-height: 0; vertical-align:middle; font-size: 0; border-style: solid; border-width: 4px; border-color: transparent; border-top: 4px solid #222; border-bottom-width: 0; } .down-arrow.grey {border-top-color: #999} .down-arrow.black {border-top-color: #222;} .down-arrow.blue {border-top-color: #3d81ef;} .down-arrow.green {border-top-color: #28a745;}.nv .down-arrow.green {border-top-color: #d83f4e;} .down-arrow.red {border-top-color: #d23342;}.nv .down-arrow.red {border-top-color: #e63c4c;} .down-arrow.yellow {border-top-color: #f1be10;} /* ---------------------------------------->>> Buttons <<<-------------------------------------------- */ /* -------------------------------------->>> Form Buttons <<<---------------------------------------- */ .bt-select { display: block; width: 100%; line-height: 14px; color: #222; background-color: #fff; background-image: none; background-clip: padding-box; border: 1px solid rgba(0,0,0,.15); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; -moz-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; } .bt-select:focus { background-color: #fff; border-color: #80bdff; outline: 0; -webkit-border-radius: 4px 4px 0 0; -moz-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; } /* -------------------------------------->>> Misc Buttons <<<---------------------------------------- */ .bt-info { width: 14px; height: 14px; padding:0; line-height: 11px; font-size: 11px; font-weight: 800; font-family:"MS Serif", "New York", serif; -webkit-border-radius: 14px; -moz-border-radius: 14px; border-radius: 14px; } .menu-bt,.search-bt { display: inline-block; padding: 5px; text-align: center; vertical-align: middle; color:rgba(34,34,34,.5); fill:rgba(34,34,34,.5); /* SVG Only */ background-color: transparent; background-image: none; border: 0; -webkit-transition: all .15s ease-in-out; -moz-transition: all .15s ease-in-out; -o-transition: all .15s ease-in-out; transition: all .15s ease-in-out; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; white-space: nowrap; cursor:pointer; } .nv .menu-bt,.nv .search-bt { color:rgba(255,255,255,.5); fill:rgba(255,255,255,.5); /* SVG Only */ } .menu-bt:hover,.search-bt:hover { color:rgba(34,34,34,1); fill:rgba(34,34,34,1); /* SVG Only */ } .nv .menu-bt:hover,.nv .search-bt:hover { color:rgba(255,255,255,1); fill:rgba(255,255,255,1); /* SVG Only */ } .menu-bt {} .search-bt {} /* -------------------------------->>> Personal Background <<<------------------------------- */ .personal-background-container { /* personalBackground */ position: fixed; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; } .personal-background-bx { position: absolute; top: 0; left: 0; right: 0; bottom: 0; height: 100%; width: 100%; background-attachment: fixed; background-clip: border-box; background-size: cover; background-position: center; background-repeat: no-repeat; } .personal-background-pic { position: absolute; top: 0; left: 0; right: 0; bottom: 0; height: 100%; width: 100%; opacity:0; background-attachment: fixed; background-clip: border-box; background-size: cover; background-position: center; background-repeat: no-repeat; transition: opacity 0.5s ease; -webkit-transition: opacity 0.5s ease; -moz-transition: opacity 0.3s ease; } .personal-background-vid {} /* --------------------------------------->>> Top <<<--------------------------------------- */ .top-container { z-index: 4; position: fixed; display: block; top: 0; width:100%; } .top-head { position: relative; display:block; height:46px; text-align:left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .top-head > .col-l {height:46px;padding:0 0 0 5px;} .top-head > .col-r {height:46px;padding:0 5px 0 0;} .top-head > .col-c {height:56px;padding:0 10px;text-align:center;} .top-head > .col-l+.col-c {padding:0 10px 0 0;} .top-head > .col-l+.col-r+.col-c {padding:0;} .top-head > .col-r+.col-c {padding:0 0 0 10px;} .top-head-bt { display: inline-block; height:30px; padding: 8px 5px; line-height: 1.4545; font-weight: 400; text-align: center; vertical-align: middle; color: rgba(255,255,255,.5); fill: rgba(255,255,255,.5); background-color: transparent; background-image: none; border: 0; -webkit-transition: all .15s ease-in-out; -moz-transition: all .15s ease-in-out; -o-transition: all .15s ease-in-out; transition: all .15s ease-in-out; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; white-space: nowrap; cursor: pointer; } .top-head-bt:hover { color: rgba(255,255,255,1); fill: rgba(255,255,255,1); } .top-bar-container { position: relative; display:inline-block; width:100%; height:46px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .top-bar-bx { position: relative; display:inline-block; max-width:100%; height:46px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .top-bar-head { position: relative; display:block; height:46px; text-align:left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .top-bar-head > .col-l {height:46px;padding:0 0 0 5px;} .top-bar-head > .col-l:after {content:"";display:inline-block;height:36px;vertical-align:middle;border-left: solid 1px rgba(0,0,0,.2);margin: 10px 0 10px 10px;} .top-bar-head > .col-r {height:46px;padding:0 5px 0 0;} .top-bar-head > .col-r:before {content:"";display:inline-block;height:36px;margin:5px 0;vertical-align:top;border-left: solid 1px rgba(0,0,0,.2);} .top-bar-head > .col-c {height:66px;padding:0;} .top-bar-head > .col-l+.col-c {padding:0;} .top-bar-head > .col-l+.col-r+.col-c {padding: 0;} .top-bar-head > .col-r+.col-c {padding:0;} .top-bar-bt { display: inline-block; height:30px; padding: 8px 5px; line-height: 1.4545; font-weight: 400; text-align: center; vertical-align: middle; color: rgba(34,34,34,.5); fill: rgba(34,34,34,.5); background-color: transparent; background-image: none; border: 0; -webkit-transition: all .15s ease-in-out; -moz-transition: all .15s ease-in-out; -o-transition: all .15s ease-in-out; transition: all .15s ease-in-out; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; white-space: nowrap; cursor: pointer; } .top-bar-bt:hover { color: rgba(34,34,34,1); fill: rgba(34,34,34,1); } .top-bar-app-bt { position:relative; width:30px; height:30px; margin:0; padding:0; text-align: center; vertical-align: middle; background-color: transparent; background-image: none; border: 0; } .top-bar-bt-img { position:relative; display:block; width:100%; height:100%; } .appAppContainer{cursor:pointer;} .addButton .b-wig-item-bx { background-color: rgba(255,255,255,.25); padding-top:0px; } .slideoutContainer { left:0 !important; /* used for right options slideout & jquery resizeable. It was adding a left when resizing */ } /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------->>> Aaron's <<<--------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------------------------------------------------------------------------------------------- */ /* ------------------->>> Resets <<<-------------------- */ ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, hgroup, p, blockquote, figure, form, fieldset, input, legend, pre, abbr, button, input, optgroup, select, textarea {margin: 0;padding: 0;} button,input,optgroup,select,textarea { font-family: inherit; font-size: 100%; line-height: 1.15; color: inherit; background: transparent; border: 0; outline:0; } ol, ul {list-style: none;} blockquote, q {quotes: none;} blockquote:before,blockquote:after,q:before,q:after {content: '';content: none;} table {border-collapse: collapse;border-spacing: 0;} a:link,a:visited,a:hover {text-decoration:none;} /* Correct the inability to style clickable types in iOS and Safari. */ button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } /* ------------------->>> Global <<<-------------------- */ .lt {color:rgba(0,0,0,1);fill:#000;} .dt {color:rgba(255,255,255,1);fill:#fff;} body {margin:0;padding:0;font: 12px/1.4 "Helvetica Neue","Helvetica","Arial",sans-serif;} body.lt {background-color:#000;} body.dt {background-color:#000;} a, button {color: #0075e1;} ::placeholder /* Chrome, Firefox, Opera, Safari 10.1+ */ {opacity: 1;} .lt ::placeholder {color:rgba(0,0,0,0.5);} .dt ::placeholder {color:rgba(255,255,255,0.5);} :-ms-input-placeholder /* Internet Explorer 10-11 */ {} .lt :-ms-input-placeholder {color:rgba(0,0,0,0.5);} .dt :-ms-input-placeholder {color:rgba(255,255,255,0.5);} ::-ms-input-placeholder /* Microsoft Edge */ {} .lt ::-ms-input-placeholder {color:rgba(0,0,0,0.5);} .dt ::-ms-input-placeholder {color:rgba(255,255,255,0.5);} /* .lt button,.lt input,.lt optgroup,.lt select,.lt textarea {background-color:rgba(0,0,0,.1);} .dt button,.dt input,.dt optgroup,.dt select,.dt textarea {background-color:rgba(255,255,255,.1);} */ /* button:focus,button:active,input:focus,input:active { -webkit-box-shadow:inset 0 0 0 1px rgba(0,132,255,0.7); -moz-box-shadow:inset 0 0 0 1px rgba(0,132,255,0.7); box-shadow: inset 0 0 0 1px rgba(0,132,255,0.7); } */ .textarea-autoresize { resize: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .online,.offline {} /* Headings */ .h1 { font-size:62px; line-height: 1.3; font-weight: bold; } .h2 { font-size:48px; line-height: 1.1; font-weight: bold; } .h3 { font-size:34px; line-height: 1.15; font-weight: bold; } .h4 { font-size:26px; line-height: 1.2; font-weight: bold; } .h5 { font-size:20px; line-height:1.3; font-weight: bold; } .h6 { font-size:16px; line-height: 1.3125; font-weight: bold; } .h7 { font-size:13px; line-height: 1.3125; font-weight: bold; } /* Text */ .p1 { font-size:24px; line-height:1.4545; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; } .p2 { font-size:22px; line-height:1.4545; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; } .p3 { font-size:20px; line-height: 1.5; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; } .p4 { font-size:16px; line-height: 1.5; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; } .p5 { font-size:14px; line-height: 1.5; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; } .p6 { font-size:12px; line-height:1.5; } .p7 { font-size:11px; line-height:1.4545; } /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* ---------------------------------------------->>> Layout <<<------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* Block Testing */ /* .b-b,.b-i,.b-fl,.b-fr {border: dotted 1px #f15fd8;} */ /* Block Type */ /* Blocks */ .b-bx { position: relative; display:block; margin:0 auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-block { position: relative; display:block; margin:0 auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-block.b-absolute {left:0;width:100%;} .b-inline { position: relative; display: inline-block; vertical-align: middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-top { position: relative; display:block; margin: 0 auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-top.b-absolute {top:0;left:0;width:100%;} .b-bottom { position: relative; display:block; margin: 0 auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-bottom.b-absolute {bottom:0;left:0;width:100%;} .b-left { position: relative; float:left; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-left.b-absolute {left:0;} .b-right { position: relative; float:right; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-right.b-absolute {right:0;} .b-center { display:block; text-align:left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; } .b-absolute.b-center {width:100%;height:1px;text-align:center;overflow:visible;} .b-middle { position: relative; display: block; height:100%; margin: 0 auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-middle-bx { position: relative; display: block; width:100%; height:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-absolute {position: absolute;} .b-reset { position: relative; display: block; width:100%; height:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-clear:before,.b-clear:after {content:"";display:table;clear:both;} /* Inline Grid */ .b-i { display:inline-block; vertical-align: middle; text-align: center; font-size:0; white-space: normal; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-i-reset { position: relative; display:inline-block; width:100%; font-size:14px; vertical-align: middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* Block Width */ .b-w1 {width: 100%;} .b-w2 {width: 50%;} .b-w3 {width: 33.33333333%;} .b-w4 {width: 25%;} .b-w5 {width: 20%;} .b-w6 {width: 16.66666667%;} .b-w7 {width:14.2857143%;} .b-w8 {width: 12.5%;} .b-w9 {width:11.1111111%} .b-w10 {width:10%} .b-w11 {width:9.09090909%} .b-w12 {width: 8.33333333%;} /* --- Mobile ( XS < 576px ) --- */ @media only screen (max-width: 576px) { .b-w1-xs {width: 100%;} .b-w2-xs {width: 50%;} .b-w3-xs {width: 33.33333333%;} .b-w4-xs {width: 25%;} .b-w5-xs {width: 20%;} .b-w6-xs {width: 16.66666667%;} .b-w7-xs {width: 14.2857143%;} .b-w8-xs {width: 12.5%;} .b-w9-xs {width: 11.1111111%;} .b-w10-xs {width: 10%;} .b-w11-xs {width: 9.09090909%;} .b-w12-xs {width: 8.33333333%;} } /* --------------- Tablet ( Small Screen > 576px ) --------------- */ @media only screen and (min-width: 578px) { .b-w1-s {width: 100%;} .b-w2-s {width: 50%;} .b-w3-s {width: 33.33333333%;} .b-w4-s {width: 25%;} .b-w5-s {width: 20%;} .b-w6-s {width: 16.66666667%;} .b-w7-s {width: 14.2857143%;} .b-w8-s {width: 12.5%;} .b-w9-s {width: 11.1111111%;} .b-w10-s {width: 10%;} .b-w11-s {width: 9.09090909%;} .b-w12-s {width: 8.33333333%;} } /* --------------- Desktop ( Medium Screen > 768px ) --------------- */ @media only screen and (min-width: 768px) { .b-w1-m {width: 100%;} .b-w2-m {width: 50%;} .b-w3-m {width: 33.33333333%;} .b-w4-m {width: 25%;} .b-w5-m {width: 20%;} .b-w6-m {width: 16.66666667%;} .b-w7-m {width: 14.2857143%;} .b-w8-m {width: 12.5%;} .b-w9-m {width: 11.1111111%;} .b-w10-m {width: 10%;} .b-w11-m {width: 9.09090909%;} .b-w12-m {width: 8.33333333%;} } /* --------------- Desktop ( Large Screen > 992px ) --------------- */ @media only screen and (min-width: 992px) { .b-w1-l {width: 100%;} .b-w2-l {width: 50%;} .b-w3-l {width: 33.33333333%;} .b-w4-l {width: 25%;} .b-w5-l {width: 20%;} .b-w6-l {width: 16.66666667%;} .b-w7-l {width: 14.2857143%;} .b-w8-l {width: 12.5%;} .b-w9-l {width: 11.1111111%;} .b-w10-l {width: 10%;} .b-w11-l {width: 9.09090909%;} .b-w12-l {width: 8.33333333%;} } /* --------------- Desktop ( XL > 1200px ) --------------- */ @media only screen and (min-width: 1200px) { .b-w1-xl {width: 100%;} .b-w2-xl {width: 50%;} .b-w3-xl {width: 33.33333333%;} .b-w4-xl {width: 25%;} .b-w5-xl {width: 20%;} .b-w6-xl {width: 16.66666667%;} .b-w7-xl {width: 14.2857143%;} .b-w8-xl {width: 12.5%;} .b-w9-xl {width: 11.1111111%} .b-w10-xl {width: 10%;} .b-w11-xl {width: 9.09090909%;} .b-w12-xl {width: 8.33333333%;} } /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* ---------------------------------------------->>> HOME <<<--------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* ------------------->>> Lightbox <<<-------------------- */ .b-lightbox { position: fixed; z-index: 10001; top: 0; left: 0; bottom: 0; right:0; width: 100%; height: 100%; text-align: center; overflow-y: auto; overflow-x: hidden; display: none; } .lt .b-lightbox {background-color: rgba(0,0,0,0.9)} .dt .b-lightbox {background-color: rgba(0,0,0,0.9)} .b-lightbox:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; margin-right: -4px; } .b-lightbox-trans {background:transparent;} .b-lightbox-back-close { position:absolute; top:0; left:0; width:100%; height:100%; } .b-lightbox-no-close .b-lightbox-back-close {display: none;} .b-lightbox-bx { position: relative; z-index: 10003; display: inline-block; text-align: -webkit-center; vertical-align: middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow:hidden; } .b-wig-lightbox {} /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* ---------------------------------------------->>> Desk <<<--------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ .cubies-container { /* cubies-container */ position: fixed; display: block; z-index: 3; top: 0; left: 0; bottom: 0; right: 0; width: 100%; height: 100%; padding-top:46px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; } .cubies-bx { /* mainCubiesContainer */ position: relative; display:block; width:100%; height:100%; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow:hidden; } .cubies-bx:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; margin: 0 0 0 -4px; } .cubies-bx2 { /* cubieContainer */ position: relative; display:inline-block; max-width:100%; max-height:100%; vertical-align: middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow:hidden; } .cubies-middle { display: inline-block; max-width: 100%; vertical-align: middle; opacity: 1; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow-x:hidden; overflow-y:auto; } /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* ---------------------------------------->>> Cubie Template <<<----------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* ------------------->>> Cubie <<<-------------------- */ .cubie-container { /* .cubieContainers */ display: none; position: absolute; display:block; z-index:105; top:0; left:0; width:100%; height:100%; padding:10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: padding 0.2s ease; transition: padding 0.2s ease; overflow:hidden; } .cubie-bx { position: relative; display:block; height:100%; width:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,.3); -moz-box-shadow: 0 0 10px 0 rgba(0,0,0,.3); box-shadow: 0 0 10px 0 rgba(0,0,0,.3); overflow: hidden; } .lt .cubie-bx {background-color:rgba(230,230,230,0.9)} .dt .cubie-bx {background-color:rgba(10,10,10,0.9)} /* ------------------->>> Head <<<-------------------- */ .b-cubie-head { position: absolute; z-index: 8; top: 0; left: 0; display: block; width: 100%; height: 52px; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-cubie-head {background-color:rgb(40,40,40);} /* ------------------->>> Cubie Body <<<-------------------- */ .b-cubie-body { position: relative; display:block; width:100%; height:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow:hidden; } .b-cubie-body-bx { position: relative; display:block; width:100%; height:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow:hidden; } .b-wig-offline-mode-on~.b-cubie-body-bx {padding-top:27px;} /* Cubie Body Left */ .b-cubie-body-left { position: relative; float: left; width:0; height:100%; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: width 300ms ease; -moz-transition: width 300ms ease; transition: width 300ms ease; } .b-cubie-body-left-bx { position: relative; display:block; width:100%; height:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow:hidden; } /* Cubie Body Middle */ .b-cubie-body-middle { position: relative; display: block; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; } .b-fileMenuOpen~.b-cubie-body-middle {padding:0 0 0 12px;} .b-cubie-body-middle-overlay { visibility: hidden; position: absolute; z-index: 7; top:0; left:0; display: block; width: 100%; height: 100%; opacity: 0; cursor: pointer; -webkit-transition:opacity 0.2s ease; transition:opacity 0.2s ease; } .lt .b-cubie-body-middle-overlay {background-color: rgba(24,24,24,0.7)} .dt .b-cubie-body-middle-overlay {background-color: rgba(24,24,24,0.7)} .b-cubie-body-middle-overlay-open { visibility: visible; opacity: 1; background-color: rgba(0,0,0,0.7); } .b-cubie-body-middle-bx { position: relative; display:block; min-width:300px; height:100%; opacity:1; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: opacity 0.2s ease; transition: opacity 0.2s ease; } .b-cubie-body-middle-overlay-open~.b-cubie-body-middle-bx {opacity:0.7} /* ------------------->>> Pages <<<-------------------- */ /* ------------------->>> Page <<<-------------------- */ .b-page { position: relative; display:block; width:100%; height:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: opacity 0.4s ease-out, left 0.2s ease-out; -moz-transition: opacity 0.4s ease-out, left 0.2s ease-out; -o-transition: opacity 0.4s ease-out, left 0.2s ease-out; transition: opacity 0.4s ease-out, left 0.2s ease-out; } .b-page-open { left:0; opacity: 1; -webkit-transition: opacity 0.4s ease-out, left 0.2s ease-out; -moz-transition: opacity 0.4s ease-out, left 0.2s ease-out; -o-transition: opacity 0.4s ease-out, left 0.2s ease-out; transition: opacity 0.4s ease-out, left 0.2s ease-out; } .b-page-bx { position: relative; display: block; width: 100%; height:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* Page Right */ .b-page-body-right { position: relative; display: block; float:right; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* Page Options */ .b-page-options { position: relative; display:block; height:100%; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-page-options-bx { display: block; height: 100%; width: 100%; overflow-x:hidden; overflow-y: auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-page-options>.b-drag-bar-right {left: -6px} .b-page-options>.b-drag-bar-right:after {left: -6px} /* Page Body */ .b-page-body {height:100%;padding-top:52px;overflow:hidden;} .b-page-body-bx { position: relative; display:block; width:100%; min-width:300px; height:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow-x: hidden; overflow-y: auto; } /* Page Head */ .b-page-head { position: absolute; top: 0; left: 0; width: 100%; } .b-page-head-bx { position: relative; display: block; padding: 6px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-page-head-left { position: relative; display: block; float: left; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-page-head-right { position: relative; display: block; float: right; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-page-head-center { display: block; overflow: hidden; white-space: nowrap; } .b-page-head-title { display: block; padding: 4px; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-page-head-title-text { display: block; padding:6px; line-height: 20px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .lt .b-page-head-title-text {color: rgba(0,0,0,1);} .dt .b-page-head-title-text {color: rgba(255,255,255,1);} /* Page Body Middle */ .b-page-body-middle { position: relative; display: block; height: 100%; overflow-x: hidden; overflow-y: auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-page-body-middle-overlay { visibility: hidden; position: absolute; z-index: 4; display: block; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; -webkit-transition: visibility 0.2s ease, opacity 0.2s ease; transition: visibility 0.2s ease, opacity 0.2s ease; } .b-page-body-middle-overlay-open { visibility: visible; opacity: 1; } .b-page-body-middle-bx { position: relative; display:block; width:100%; min-width:300px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-page-body-title { display:block; margin:0; padding:24px 18px 0; font-size: 32px; line-height: 1.09375; font-weight:bold; text-align: left; } /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* -------------------------------------------->>> Elements <<<------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* ------------------->>> Drag Bar <<<-------------------- */ .b-drag-bar-left, .b-drag-bar-right, .b-drag-bar-top, .b-drag-bar-bottom { z-index: 4; position: absolute; display: block; height: 100%; text-align: center; } .b-drag-bar-left:before, .b-drag-bar-right:before, .b-drag-bar-top:before, .b-drag-bar-bottom:before { content:""; position: relative; display: inline-block; height: 100%; vertical-align: middle; text-align: center; } .b-drag-bar-left:after, .b-drag-bar-right:after, .b-drag-bar-top:after, .b-drag-bar-bottom:after { content:""; position: relative; display: inline-block; vertical-align: middle; border-radius: 5px; } .lt .b-drag-bar-left:after, .lt .b-drag-bar-right:after, .lt .b-drag-bar-top:after, .lt .b-drag-bar-bottom:after { background: rgba(0,0,0,0.2); } .dt .b-drag-bar-left:after, .dt .b-drag-bar-right:after, .dt .b-drag-bar-top:after, .dt .b-drag-bar-bottom:after { background: rgba(255,255,255,0.2); } .b-drag-bar-left, .b-drag-bar-right { top:0; width:12px; height:100%; cursor: ew-resize; } .b-drag-bar-left:after, .b-drag-bar-right:after { width: 3px; height: 25px; } .b-drag-bar-left { left:0; } .b-drag-bar-right { right:0; } .b-drag-bar-top, .b-drag-bar-bottom { left:0; width:100%; height:12px; cursor:ns-resize; } .b-drag-bar-top:after, .b-drag-bar-bottom:after { height: 3px; width: 25px; margin-top:-1px; } .b-drag-bar-top { top:0; } .b-drag-bar-bottom { bottom:0; } /* ------------------->>> Button List <<<-------------------- */ .b-bt-list { position: relative; display:block; margin:0 auto; padding:0; vertical-align: middle; list-style-type: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-bt-list:before,.b-bt-list:after { content:''; display:table; clear:both; } .b-bt-item { position: relative; display: inline-block; float:left; margin:0; padding:0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* Link */ .b-bt-link { position: relative; display: block; width:100%; margin:0; padding: 0; text-decoration: none; border: 0; outline:0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; } /* .b-bt-link:focus,.b-bt-link:active { -webkit-box-shadow:inset 0 0 0 1px rgba(0,132,255,0.7); -moz-box-shadow:inset 0 0 0 1px rgba(0,132,255,0.7); box-shadow: inset 0 0 0 1px rgba(0,132,255,0.7); } */ .b-bt-no-link { position: relative; display: block; width:100%; margin:0; padding:0; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* ------------------->>> Button Colors <<<-------------------- */ /* Trans */ .b-bt-trans {background-color:transparent;} .lt .b-bt-trans,.lt.b-bt-trans {color: rgba(0,0,0,0.5);fill: rgba(0,0,0,0.5);} .lt .b-bt-trans:hover,.lt.b-bt-trans:hover {color: rgba(0,0,0,1);fill: rgba(0,0,0,1);} .dt .b-bt-trans,.dt.b-bt-trans {color: rgba(255,255,255,0.5);fill: rgba(255,255,255,0.5);} .dt .b-bt-trans:hover,.dt.b-bt-trans:hover {color: rgba(255,255,255,1);fill: rgba(255,255,255,1);} .b-bt-trans-1 {} .lt .b-bt-trans-1,.lt.b-bt-trans-1 {color: rgba(0,0,0,0.5);fill: rgba(0,0,0,0.5);} .lt .b-bt-trans-1:hover,.lt.b-bt-trans-1:hover,.lt.b-bt-trans-1.b-bt-click {color: rgba(0,0,0,1);fill: rgba(0,0,0,1);background-color: rgba(0,0,0,0.075);} .dt .b-bt-trans-1,.dt.b-bt-trans-1 {color: rgba(255,255,255,0.5);fill: rgba(255,255,255,0.5);} .dt .b-bt-trans-1:hover,.dt.b-bt-trans-1:hover,.dt.b-bt-trans-1.b-bt-click {color: rgba(255,255,255,1);fill: rgba(255,255,255,1);background-color: rgba(255,255,255,0.1);} .b-bt-trans-2 {} .lt .b-bt-trans-2,.lt.b-bt-trans-2 {color: rgba(0,0,0,0.5);fill: rgba(0,0,0,0.5);background-color: rgba(0,0,0,0.075);} .lt .b-bt-trans-2:hover,.lt.b-bt-trans-2:hover {color: rgba(0,0,0,1);fill: rgba(0,0,0,1);} .dt .b-bt-trans-2,.dt.b-bt-trans-2 {color: rgba(255,255,255,0.5);fill: rgba(255,255,255,0.5);background-color: rgba(255,255,255,0.1);} .dt .b-bt-trans-2:hover,.dt.b-bt-trans-2:hover {color: rgba(255,255,255,1);fill: rgba(255,255,255,1);} /* White */ .b-bt-white-1 {background-color:#fff;color:#000;fill:#000;} .dt .b-bt-red-1 {color:#000;fill:#000;} /* Grey */ .b-bt-grey-1 {background-color:#999;color:#fff;fill:#fff;} .dt .b-bt-grey-1 {background-color:#777;color:#000;fill:#000;} .b-bt-grey-2 {background-color:#888;color:#fff;fill:#fff;} .dt .b-bt-grey-2 {background-color:#888;color:#000;fill:#000;} .b-bt-grey-3 {background-color:#777;color:#fff;fill:#fff;} .dt .b-bt-grey-3 {background-color:#999;color:#000;fill:#000;} .b-bt-grey-4 {background-color:#656565;color:#fff;fill:#fff;} .dt .b-bt-grey-4 {background-color:#aaa;color:#000;fill:#000;} /* Red */ .b-bt-red-1 {background-color:#e63c3c;color:#fff;fill:#fff;} .dt .b-bt-red-1 {color:#000;fill:#000;} /* Orange */ .b-bt-orange-1 {background-color:#fb944b;color:#fff;fill:#fff;} .dt .b-bt-orange-1 {color:#000;fill:#000;} /* Yellow */ .b-bt-yellow-1 {background-color:#ffb300;color:#fff;fill:#fff;} .dt .b-bt-yellow-1 {color:#000;fill:#000;} /* Green */ .b-bt-green-1 {background-color:#0da055;color:#fff;fill:#fff;} .dt .b-bt-green-1 {color:#000;fill:#000;} /* Blue */ .b-bt-blue-1 {background-color:#0075e1;color:#fff;fill:#fff;} /* Burple */ .b-bt-burple-1 {background-color:#3d81ef;color:#fff;fill:#fff;} .dt .b-bt-burple-1 {color:#000;fill:#000;} /* Purple */ .b-bt-purple-1 {background-color:#bd34d7;color:#fff;fill:#fff;} .dt .b-bt-purple-1 {color:#000;fill:#000;} /* Pink */ .b-bt-pink-1 {background-color:#f93262;color:#fff;fill:#fff;} /* Outline */ .b-bt-outline-1 { -webkit-box-shadow: 0 0 0 1px #999; -moz-box-shadow: 0 0 0 1px #999; box-shadow: 0 0 0 1px #999; color:#999; } .dt .b-bt-outline-1 { -webkit-box-shadow: 0 0 0 1px #777; -moz-box-shadow: 0 0 0 1px #777; box-shadow: 0 0 0 1px #777; color:#777; } /* Fill */ .lt .b-bt-fill,.lt.b-bt-fill,.lt .b-bt-fill:hover,.lt.b-bt-fill:hover {color: rgba(0,0,0,1);fill: rgba(0,0,0,1);} .dt .b-bt-fill,.dt.b-bt-fill,.dt .b-bt-fill:hover,.dt.b-bt-fill:hover {color: rgba(255,255,255,1);fill: rgba(255,255,255,1);} /* Icon */ .b-bt-icon,.b-bt-icon-s,.b-bt-icon-m,.b-bt-icon-l { display:inline-block; vertical-align: middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-bt-icon-s {width:auto;height:20px;} .b-bt-icon-m {width:auto;height:26px;} .b-bt-icon-l {width:auto;height:32px;} /* Text */ .b-bt-text { display:inline-block; vertical-align: middle; line-height:20px; } /* Text */ .b-bt-label {font-weight:bold;} /* Click */ .b-bt-click {} .lt .b-bt-click,.lt.b-bt-click { color: rgba(0,0,0,1); fill: rgba(0,0,0,1); } .dt .b-bt-click,.dt.b-bt-click { color: rgba(255,255,255,1); fill: rgba(255,255,255,1); } /* Input */ .b-bt-input {text-align: left;cursor:inherit;} .lt .b-bt-input:-webkit-autofill, .lt .b-bt-input:-webkit-autofill:hover, .lt .b-bt-input:-webkit-autofill:focus, .lt .b-bt-input:-webkit-autofill:active { -webkit-box-shadow: 0 0 0 30px white inset !important; } .dt .b-bt-input:-webkit-autofill, .dt .b-bt-input:-webkit-autofill:hover, .dt .b-bt-input:-webkit-autofill:focus, .dt .b-bt-input:-webkit-autofill:active { -webkit-box-shadow: 0 0 0 30px white inset !important; } /* Select */ .b-bt-select {} .lt .b-bt-select:selected,.lt.b-bt-select:selected { color: rgba(0,0,0,1); fill: rgba(0,0,0,1); } .dt .b-bt-select:selected,.dt.b-bt-select:selected { color: rgba(255,255,255,1); fill: rgba(255,255,255,1); } /* Group */ .b-bt-group {} .b-bt-group>.b-bt-item {margin-right:1px;padding-right:0;padding-left:0;border-radius:0;} .b-bt-group>.b-bt-item:first-child {} .b-bt-group>.b-bt-item:last-child {margin-right:0;} /* Borders */ .b-bt-borders { -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .b-bt-borders>.b-bt-item>.b-bt-link {} .lt .b-bt-borders>.b-bt-item>.b-bt-link { -webkit-box-shadow: 0 0 0 1px rgba(0,0,0,0.07); -moz-box-shadow: 0 0 0 1px rgba(0,0,0,0.07); box-shadow: 0 0 0 1px rgba(0,0,0,0.07); } .dt .b-bt-borders>.b-bt-item>.b-bt-link { -webkit-box-shadow: 0 0 0 1px rgba(255,255,255,0.07); -moz-box-shadow: 0 0 0 1px rgba(255,255,255,0.07); box-shadow: 0 0 0 1px rgba(255,255,255,0.07); } .lt .b-bt-list.b-bt-group.b-bt-borders {-webkit-box-shadow: 0 0 0 1px rgba(0,0,0,0.1);-moz-box-shadow: 0 0 0 1px rgba(0,0,0,0.1);box-shadow: 0 0 0 1px rgba(0,0,0,0.1);} .dt .b-bt-list.b-bt-group.b-bt-borders {-webkit-box-shadow: 0 0 0 1px rgba(255,255,255,0.1);-moz-box-shadow: 0 0 0 1px rgba(255,255,255,0.1);box-shadow: 0 0 0 1px rgba(255,255,255,0.1);} .b-bt-list.b-bt-group.b-bt-borders>.b-bt-item>.b-bt-link {margin-right:0;-webkit-box-shadow: none;-moz-box-shadow: none;box-shadow: none;} .b-bt-list.b-bt-group.b-bt-borders>.b-bt-item:last-child>.b-bt-link {border-right: 0} /* Color */ .lt .b-bt-list.b-bt-group.b-bt-borders>.b-bt-item>.b-bt-link {border-right: solid 1px rgba(0,0,0,.1)} .dt .b-bt-list.b-bt-group.b-bt-borders>.b-bt-item>.b-bt-link {border-right: solid 1px rgba(255,255,255,.1)} /* Color */ .lt .b-bt-list-vertical.b-bt-group.b-bt-borders>.b-bt-item>.b-bt-link {border-bottom: solid 1px rgba(0,0,0,.1)} .dt .b-bt-list-vertical.b-bt-group.b-bt-borders>.b-bt-item>.b-bt-link {border-bottom: solid 1px rgba(255,255,255,.1)} .b-bt-radius {} .b-bt-round { -webkit-border-radius: 99px; -moz-border-radius: 99px; border-radius: 99px; } /* Button Drop */ .b-bt-drop {} .b-bt-drop-arrow,.b-bt-drop-arrow-s,.b-bt-drop-arrow-m,.b-bt-drop-arrow-l { display: inline-block; width: 0; height: 0; vertical-align: middle; } .b-bt-text+.b-bt-drop-arrow {margin-left:3px;} .b-bt-drop-arrow-s { border-top: 4px solid; border-right: 3px solid transparent; border-left: 3px solid transparent; } .b-bt-drop-arrow-m { border-top: 5px solid; border-right: 4px solid transparent; border-left: 4px solid transparent; } .b-bt-drop-arrow-l { border-top: 6px solid; border-right: 5px solid transparent; border-left: 5px solid transparent; } .b-bt-drop-plus:before { content: '+'; float:right; font-weight: normal; -webkit-transition: -webkit-transform 200ms; transition: transform 200ms ease; } .b-bt-drop-input:target~.b-bt-drop-label .b-bt-drop-plus:before, .b-bt-drop-input:checked~.b-bt-drop-label .b-bt-drop-plus:before { -webkit-transform: rotate(45deg) scale(1.08); transform: rotate(45deg) scale(1.08); } .b-bt-drop-right {} .b-bt-drop~.b-bt-list { position: absolute; z-index:1; display: block; text-align: left; visibility: hidden; opacity:0; -webkit-transform: scale(0.95); transform: scale(0.95); -webkit-transition: opacity 0.15s, visibility 0s linear 0.15s, -webkit-transform 0.15s; transition: opacity 0.15s, visibility 0s linear 0.15s, -webkit-transform 0.15s; -webkit-transform-origin: top left; transform-origin: top left; } .b-bt-click~.b-bt-list { display: block; visibility: visible; opacity: 1; -webkit-transform: scale(1); transform: scale(1); -webkit-transition-delay: 0s; transition-delay: 0s } .lt .b-bt-drop~.b-bt-list { background-color: rgba(255,255,255,1); -webkit-box-shadow: 0 6px 20px rgba(0,0,0,0.2); -moz-box-shadow: 0 6px 20px rgba(0,0,0,0.2); box-shadow: 0 6px 20px rgba(0,0,0,0.2); } .dt .b-bt-drop~.b-bt-list { background-color: rgba(44,44,44,1); -webkit-box-shadow: 0 6px 20px rgba(0,0,0,0.5); -moz-box-shadow: 0 6px 20px rgba(0,0,0,0.5); box-shadow: 0 6px 20px rgba(0,0,0,0.5); } .b-bt-drop-input {display: none;} .b-bt-drop-label {z-index: 2;} .b-bt-drop-anchor { right: 0; cursor: default; display: block; position: absolute; top: 0; width: 1px; height: 1px; z-index: 10; } .b-bt-drop-anchor:focus { width:44px; height:54px; outline-offset:-6px; } .b-bt-drop-anchor-open {display:block;} .b-bt-drop-input:target~.b-bt-drop-anchor-open,.b-bt-drop-input:checked~.b-bt-drop-anchor-open {display: none;} .b-bt-drop-anchor-close {display:none;} .b-bt-drop-input:target~.b-bt-drop-anchor-close,.b-bt-drop-input:checked~.b-bt-drop-anchor-close {display: block;} .b-bt-drop-input~.b-bt-list { overflow: hidden; position: absolute; z-index: -1; top: 100%; left: 0; width: 100%; visibility: hidden; opacity:0; -webkit-transform: translateY(-10px); transform: translateY(-10px); } .b-bt-drop-input:target~.b-bt-list,.b-bt-drop-input:checked~.b-bt-list { position: static; z-index:1; visibility: visible; opacity:1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition: -webkit-transform 200ms, opacity 200ms ease; transition: transform 200ms ease, opacity 200ms ease; } .b-bt-drop-tc~.b-bt-list {-webkit-transform-origin: top center;transform-origin: top center;} .b-bt-drop-tr~.b-bt-list {-webkit-transform-origin: top right;transform-origin: top right;} .b-bt-drop-tl~.b-bt-list {-webkit-transform-origin: top left;transform-origin: top left;} .b-bt-drop-bc~.b-bt-list {-webkit-transform-origin: bottom center;transform-origin: bottom center;} .b-bt-drop-br~.b-bt-list {-webkit-transform-origin: bottom right;transform-origin: bottom right;} .b-bt-drop-bl~.b-bt-list {-webkit-transform-origin: bottom left;transform-origin: bottom left;} .b-bt-drop-seperator { position: relative; float:left; display:inline-block; width:100%; height: 0; margin: 6px 0; overflow: hidden; } .lt .b-bt-drop-seperator {border-top: 1px solid rgba(0,0,0,0.1);} .dt .b-bt-drop-seperator {border-top: 1px solid rgba(255,255,255,0.1);} .b-bt-drop-title { position: relative; float:left; width:100%; margin:2px 0; opacity:0.5; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* ------------------->>> Button List Vertical <<<-------------------- */ .b-bt-list-vertical>.b-bt-item {width:100%;} .b-bt-drop~.b-bt-list-vertical>.b-bt-item>.b-bt-link {text-align:left;} .lt .b-bt-drop~.b-bt-list-vertical>.b-bt-item>.b-bt-link:hover,.lt .b-bt-drop~.b-bt-list-vertical>.b-bt-item>.b-bt-click {background-color: rgba(0,0,0,0.05);} .dt .b-bt-drop~.b-bt-list-vertical>.b-bt-item>.b-bt-link:hover,.dt .b-bt-drop~.b-bt-list-vertical>.b-bt-item>.b-bt-click {background-color: rgba(255,255,255,0.05);} .b-bt-list-vertical.b-bt-group>.b-bt-item {margin-bottom:1px;padding:0 4px;} .b-bt-list-vertical.b-bt-group>.b-bt-item:first-child {padding-top:4px;} .b-bt-drop~.b-bt-list-vertical.b-bt-group>.b-bt-item {padding:0;} .b-bt-list-vertical.b-bt-group>.b-bt-item>.b-bt-link {border-radius:0;} .b-bt-list-vertical.b-bt-group>.b-bt-item:first-child>.b-bt-link {border-radius:6px 6px 0 0;} .b-bt-list-vertical.b-bt-group>.b-bt-item:last-child>.b-bt-link {border-radius:0 0 6px 6px;} /* ------------------->>> Button Columns to Accordian <<<-------------------- */ .b-bt-columns {} .b-bt-columns>.b-bt-item {width:20%;} @media screen and (max-width: 767px) {.b-bt-columns>.b-bt-item {width:100%;}} @media screen and (min-width: 768px) {.lt .b-bt-columns>.b-underline,.dt .b-bt-columns>.b-underline {border:0}} @media screen and (min-width: 768px) {.b-bt-columns>.b-bt-item>.b-bt-drop-label>.b-bt-drop-plus:before {display:none;}} @media screen and (min-width: 768px) {.b-bt-columns>.b-bt-item>.b-bt-drop-label {cursor:default;}} @media screen and (min-width: 768px) {.b-bt-columns>.b-bt-item>.b-bt-drop-anchor {display:none;}} @media screen and (min-width: 768px) { .b-bt-columns>.b-bt-item>.b-bt-drop-input~.b-bt-list-vertical { position: static; z-index:1; visibility: visible; opacity:1; -webkit-transform: none; -ms-transform: none; transform: none; } } .b-bt-columns .b-bt-drop-anchor:focus {width:34px;height:34px;} /* ------------------->>> Button Accordian <<<-------------------- */ .b-bt-accordians {} .b-bt-accordians>.b-bt-item {width:100%;padding-right:0;padding-left:0;} .b-bt-accordians>.b-bt-item>.b-bt-list>.b-bt-item {padding:0;} .b-bt-accordians .b-bt-drop-anchor:focus {width:44px;height:54px;} /* ------------------->>> Button Animations <<<-------------------- */ /* Bubble Pop */ @-webkit-keyframes bubble {50%{-webkit-transform: scale(1.3);transform: scale(1.3);}} @keyframes bubble {50%{-webkit-transform: scale(1.3);transform: scale(1.3);}} /* ------------------->>> Button Types <<<-------------------- */ /* Button Action */ .b-bt-hidden-input {display:none;} .b-bt-hidden-input:checked ~ .lt .b-bt-link, .b-bt-hidden-input:target ~ .lt .b-bt-link {background-color:rgba(0,0,0,1);} .b-bt-hidden-input:checked ~ .dt .b-bt-link, .b-bt-hidden-input:target ~ .dt .b-bt-link {background-color:rgba(255,255,255,1);} .b-bt-hidden-anchor {position:absolute;top:0;left:0;width:1px;height:1px;z-index:10;color:#fff;} .b-bt-hidden-anchor:focus {width:100%;height:100%;outline-offset:-4px;} .b-bt-hidden-input:checked ~ .b-bt-hidden-anchor-open, .b-bt-hidden-input:target ~ .b-bt-hidden-anchor-open {display:none} .b-bt-hidden-anchor-close {display:none} .b-bt-hidden-input:checked ~ .b-bt-hidden-anchor-close, .b-bt-hidden-input:target ~ .b-bt-hidden-anchor-close{display:block} /* Button Tag */ .b-bt-tag { display: inline-block; margin:0 2px; padding: 0 4px; font-size: 10px; line-height: 13px; vertical-align: middle; -webkit-border-radius: 99px; -moz-border-radius: 99px; border-radius: 99px; } .b-bt-tag-tl { position:absolute; top:0; left:0; } .b-bt-tag-tr { position:absolute; top:0; right:0; } .b-bt-tag-bl { position:absolute; bottom:0; left:0; } .b-bt-tag-br { position:absolute; bottom:0; right:0; } /* Button Group Notification */ .b-bt-noti { position: absolute; display: block; bottom: 0; right: 0; min-width: 8px; height: 11px; padding:2px 4px; line-height:11px; font-size:10px; background: #ff583a; color:#fff; -webkit-border-radius: 99px 99px 0; -moz-border-radius: 99px 99px 0; border-radius: 99px 99px 0; overflow: hidden; } /* Arrow Button */ .b-bt-arrow { display:inline-block; vertical-align: middle; -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition:-webkit-transform 150ms; transition: transform 150ms ease; } .b-wig-accordian-drop .b-bt-arrow {-webkit-transform: rotate(90deg);transform: rotate(90deg);} .b-bt-drop-input:target~.b-bt-drop-label>.b-bt-arrow, .b-bt-drop-input:checked~.b-bt-drop-label>.b-bt-arrow {-webkit-transform: rotate(90deg);transform: rotate(90deg);} /* Drop Extras Button */ .b-bt-drop-extras {float:right;padding-left:0;} .b-bt-drop-extras .b-bt-drop-arrow-large {margin:7px 5px;} /* Back Button */ .b-bt-back { position: absolute; z-index:1; top: 4px; left: 4px; width: auto; } /* Search Submit Button */ .b-bt-search-submit { position: absolute; display: none; top:4px; right:4px; width:auto; } .lt .b-head-search-input:hover~.b-bt-search-submit, .lt .b-head-search-input:focus~.b-bt-search-submit { fill:rgba(0,0,0,1); } .dt .b-head-search-input:hover~.b-bt-search-submit, .dt .b-head-search-input:focus~.b-bt-search-submit { fill:rgba(255,255,255,1); } .b-head-search-input:focus~.b-bt-search-submit { -webkit-animation-name: bubble; animation-name: bubble; -webkit-animation-duration: 0.4s; animation-duration: 0.4s; -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1); animation-timing-function: cubic-bezier(0.5, 0, 0.5, 1); -webkit-animation-iteration-count: 1; animation-iteration-count: 1; } .b-head-search-input:focus~.b-bt-search-submit {display:block;} /* Refresh Button */ .b-bt-refresh { position: absolute; top: 4px; right: 4px; width: auto; } .b-head-search-input:focus~.b-bt-refresh {display:none;} /* Login Button */ .b-bt-login .b-bt-link {background-color: #0075e1;color: #fff;} /* Lightbox Close Button 2 */ .b-bt-lightbox-close {position: absolute;top:0;right:0;} /* X Close Button */ .b-bt-x {} .lt .b-bt-x .b-bt-link, .dt .b-bt-x .b-bt-link { -webkit-border-radius: 99px; -moz-border-radius: 99px; border-radius: 99px; } .b-bt-x .b-bt-text {font-weight:bold;} /* Map Button */ .b-bt-map {} /* Scan Button */ .b-bt-scan {} .lt .b-bt-scan .b-bt-link:hover rect:last-child,.b-bt-scan .lt.b-bt-link:hover rect:last-child, .dt .b-bt-scan .b-bt-link:hover rect:last-child,.b-bt-scan .dt.b-bt-link:hover rect:last-child {fill:#EA1E30} .lt .b-bt-scan .b-bt-click rect:last-child,.b-bt-scan .lt.b-bt-click rect:last-child, .dt .b-bt-scan .b-bt-click rect:last-child,.b-bt-scan .dt.b-bt-click rect:last-child {fill:#EA1E30} /* Status Bar */ .b-status,.b-status-xs,.b-status-s,.b-status-m,.b-status-l,.b-status-xl { display: block; text-align: left; } .b-status-title { margin:15px 0; font-size:20px; font-weight:700; text-align: left; } .b-status-bar { width:100%; height:10px; background: rgba(0,0,0,.05); -webkit-border-radius: 99px; -moz-border-radius: 99px; border-radius: 99px; -webkit-box-shadow: inset 0px 5px 11px -6px rgba(0,0,0,0.5); -moz-box-shadow: inset 0px 5px 11px -6px rgba(0,0,0,0.5); box-shadow: inset 0px 4px 7px -5px rgba(0,0,0,0.2); } .b-status-xs .b-status-bar {height:4px} .b-status-s .b-status-bar {height:8px} .b-status-m .b-status-bar {height:12px} .b-status-l .b-status-bar {height:24px} .b-status-xl .b-status-bar {height:48px} .b-status-bar-percent { height: 100%; -webkit-border-radius: 99px; -moz-border-radius: 99px; border-radius: 99px; transition: 0.4s linear; transition-property: width, background-color; } /* Caret */ .b-caret { position: absolute; top: 4px; width: 12px; height: 12px; -webkit-border-radius: 2px 0 0 0; -moz-border-radius: 2px 0 0 0; border-radius: 2px 0 0 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-clip-path: polygon(50% 0%, 0% 100%, 100% 100%); clip-path: polygon(0% 0%, 0% 100%, 100% 0%); } .b-caret:after { content: ""; display: block; position: absolute; top: 0; left:0; width: 12px; height: 12px; -webkit-border-radius: 0; -moz-border-radius:0; border-radius:0; } .lt .b-caret:after {background: rgba(240,240,240,0.6);} .dt .b-caret:after {background: rgba(0,0,0,.6);} /* On/Off Switch */ .onOffSwitch { position:relative; display:inline-block; width:36px; height:20px; border-radius:20px; vertical-align:middle; cursor:pointer; } .onOffSwitch input[type="checkbox"] { display:none; } .onOffSwitch input[type="checkbox"]+.checkbox:before { position:absolute; z-index:1; top:2px; right:0; bottom:0; left:2px; width:36px; height:20px; background:transparent; border-radius:20px; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); -webkit-transition: all 0.2s ease; transition: all 0.2s ease; content:""; } .onOffSwitch input[type="checkbox"]+.checkbox:after { position:absolute; z-index:2; top:2px; right:0; bottom:0; left:2px; width:16px; height:16px; background:#fff; border-radius:16px; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; content:""; } .onOffSwitch input[type="checkbox"]+.checkbox { position:relative; z-index:0; width:36px; height: 20px; margin:0; padding:0; background:rgba(0,0,0,.4); border:none; border-radius: 20px; cursor:pointer; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .onOffSwitch input[type="checkbox"]:checked+.checkbox { background: #00bd00; } .onOffSwitch input[type="checkbox"]:checked+.checkbox:before { -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); } .onOffSwitch input[type="checkbox"]:checked+.checkbox:after { left: 18px; } /* Round Checkbox */ .b-round-checkbox input[type=checkbox] { position: absolute; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; visibility: hidden; } .b-round-checkbox { position: relative; display: inline-block; width: 16px; height: 16px; margin:0; vertical-align: middle; -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .lt .b-round-checkbox {border: solid 1px rgba(0,0,0,0.2);} .dt .b-round-checkbox {border: solid 1px rgba(255,255,255,0.2);} .b-round-checkbox label { cursor: pointer; position: absolute; left: 1px; top: 1px; width: 12px; height: 12px; -webkit-border-radius: 14px; -moz-border-radius: 14px; border-radius: 14px; } .b-round-checkbox label:after { content: ''; position: absolute; top: 1px; left: 1px; width: 10px; height: 10px; background: #3995ea; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; } .b-round-checkbox input[type=checkbox]:checked+label:after { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; } .b-round-checkbox-check { width:18px; height:18px; background:rgb(0, 190, 0); } .b-round-checkbox-check:after { content: ""; position: absolute; display: block; top: 2px; left: 6px; width: 3px; height: 8px; border: solid white; border-width: 0 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } /* Dot Loader */ .dot-loader { position: absolute; z-index: 101; display: none; top: 0px; left:0; bottom:0; right:0; text-align: center; width: 100%; height:100%; } .dot-loader:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; margin-right: -4px; } .dot-loader span { font-size:50px; font-family: Georgia, serif; -webkit-animation: loader 1s linear infinite both; -moz-animation: loader 1s linear infinite both; animation: loader 1s linear infinite both; } .dot-loader span:nth-child(2) {animation-delay: .2s;} .dot-loader span:nth-child(3) {animation-delay: .4s;} @-webkit-keyframes loader{ 0%{opacity:.2;} 25%{opacity:1;} 100%{opacity:.2;} } @-moz-keyframes loader{ 0%{opacity:.2;} 25%{opacity:1;} 100%{opacity:.2;} } @keyframes loader{ 0%{opacity:.2;} 25%{opacity:1;} 100%{opacity:.2;} } /* Circle Loader */ .b-circle-loader,.b-circle-loader-xs,.b-circle-loader-s,.b-circle-loader-m,.b-circle-loader-l,.b-circle-loader-xl { position: relative; display: inline-block; width:60px; height:60px; vertical-align: middle; text-align: center; } .b-circle-loader-xs {width:20px;height:20px;} .b-circle-loader-s {width:40px;height:40px;} .b-circle-loader-m {width:60px;height:60px;} .b-circle-loader-l {width:80px;height:80px;} .b-circle-loader-xl {width:100px;height:100px;} .b-circle-loader-spinner { position: relative; display: block; width: 100%; height: 100%; margin: 0 auto; border-radius: 50%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-animation: spin 1s infinite linear; -moz-animation: spin 1s infinite linear; animation: spin 1s infinite linear; } .lt .b-circle-loader-spinner {border: 2px solid rgba(0,0,0,0.2);border-top-color: #000000;} .dt .b-circle-loader-spinner {border: 2px solid rgba(255,255,255,0.2);border-top-color: #ffffff;} @-webkit-keyframes spin { to {-webkit-transform: rotateZ(360deg);}} @-moz-keyframes spin{ to {-moz-transform: rotateZ(360deg);}} @keyframes spin{ to {transform: rotateZ(360deg);}} .b-circle-loader-middle { position: absolute; display: block; top:0; left:0; width:100%; height:100%; padding:3px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow:hidden; } /* Slideout Button */ .b-slideout-bt { float:left; width:100%; padding-left: 8px; line-height: 50px; } .b-slideout-bt-text {display:block;} /* ------------------->>> Page Body Seperator / Shadow Seperator <<<-------------------- */ .b-page-body-seperator { display: inline-block; position: relative; height: 100%; position: absolute; top: 0; left: 0; } .b-page-body-seperator-bx { width: 20px; height: 100%; padding: 12px 0 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; } .b-page-body-seperator-bx:after { content: ''; display: block; margin-left: -20px; width: 20px; height: 100%; border-radius: 12px / 125px; } /* Color */ .lt .b-page-body-seperator-bx:after { -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.3); -moz-box-shadow: 0 0 20px rgba(0,0,0,0.3); box-shadow: 0 0 20px rgba(0,0,0,0.3); } .dt .b-page-body-seperator-bx:after { -webkit-box-shadow: 0 0 20px rgba(255,255,255,0.25); -moz-box-shadow: 0 0 20px rgba(255,255,255,0.25); box-shadow: 0 0 20px rgba(255,255,255,0.25); } /* ------------------->>> Clip Text <<<-------------------- */ .clip-text { position: absolute; top: 0; left: 0; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px); -webkit-clip-path: inset(0px 0px 99.9% 99.9%); clip-path: inset(0px 0px 99.9% 99.9%); overflow: hidden; height: 1px; width: 1px; padding: 0; border: 0; left: auto; } /* ------------------->>> Features <<<-------------------- */ /* radar pulse */ .b-radar-pulse { content: ''; position: absolute; width: 100%; height: 100%; position: absolute; border-radius: 50%; z-index: -1; left: 50%; top: 50%; background: rgba(0, 117, 225, .102); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-animation: pulsate 3s infinite linear; -moz-animation: pulsate 3s infinite linear; animation: pulsate 3s infinite linear; } .b-radar-pulse:before,.b-radar-pulse:after{ content: ''; position: absolute; background: rgba(0, 117, 225, .102); border-radius: 50%; left: 50%; top: 50%; margin-left: -40px; margin-top: -40px; } .b-radar-pulse:before{width: 80px;height: 80px; } .b-radar-pulse:after{ width: 60px; height: 60px; margin-left: -30px; margin-top: -30px; } @-webkit-keyframes pulsate{ 0%{ opacity:1; transform:translate(-50%, -50%) scale(0.3); } 100%{ opacity:0; -webkit-transform:translate(-50%, -50%) scale(2); } } @-moz-keyframes pulsate{ 0%{ opacity:1; transform:translate(-50%, -50%) scale(0.3); } 100%{ opacity:0; -moz-transform:translate(-50%, -50%) scale(2); } } @keyframes pulsate{ 0%{ opacity:1; transform:translate(-50%, -50%) scale(0.3); } 100%{ opacity:0; transform:translate(-50%, -50%) scale(2); } } /* ------------------->>> Background <<<-------------------- */ .b-back {position: absolute;width:100%;height:100%;} .lt .b-back {background-color:rgba(255,255,255,0.85);} .dt .b-back {background-color:rgba(255,255,255,0.05);} .b-back-glass { -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px) } /* background layers */ .b-back-0 {} .lt .b-back-0,.lt.b-back-0 {background-color:transparent;} .dt .b-back-0,.dt.b-back-0 {background-color:transparent;} .b-back-1 {} .lt .b-back-1,.lt.b-back-1 {background-color:rgba(255,255,255,0.25);} .dt .b-back-1,.dt.b-back-1 {background-color:rgba(40,40,40,0.25);} .b-back-2 {} .lt .b-back-2,.lt.b-back-2 {background-color:rgba(255,255,255,0.5);} .dt .b-back-2,.dt.b-back-2 {background-color:rgba(40,40,40,0.5);} .b-back-3 {} .lt .b-back-3,.lt.b-back-3 {background-color:rgba(255,255,255,0.75);} .dt .b-back-3,.dt.b-back-3 {background-color:rgba(40,40,40,0.75);} .b-back-4 {} .lt .b-back-4,.lt.b-back-4 {background-color:rgba(255,255,255,1);} .dt .b-back-4,.dt.b-back-4 {background-color:rgba(40,40,40,1);} /* background- slash grey */ .b-background-slash:before { content: ""; position: absolute; width: 100%; height: 120%; top: 0; -webkit-transform: skewY(-5deg); transform: skewY(-5deg); background: rgba(100,120,130,.06); } /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* ---------------------------------------------->>> Pages <<<-------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ .b-page-route {margin-bottom:40px;} /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* -------------------------------------------->>> Widgets <<<-------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ .b-wig { position: relative; display:block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-wig-bx { position: relative; display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* Wig Box Fixed */ .b-wig-fixed>.b-wig-item-bx>.b-wig-head {position:absolute;width:100%;} .b-wig-fixed>.b-wig-item-bx>.b-wig-body {padding-top:40px;} /* Wig Row */ .b-wig-list { position: relative; display:block; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-wig-list-bx { position: relative; display:block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-wig-list-bx:before,.b-wig-list-bx:after { content:""; display:table; clear:both; } .b-wig-list-scroll-x {overflow-x: auto;overflow-y:hidden;white-space: nowrap;} .b-wig-list-scroll-x .b-wig-item {float:none;margin-right: -3px;white-space: normal;} .b-wig-list-scroll-y {overflow-y: auto;overflow-x:hidden;} .b-wig-list-scroll-y .b-wig-list-bx {height:100%;} /* Wig Item */ .b-wig-item { position: relative; display: inline-block; float: left; width:100%; vertical-align: top; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-wig-item-bx { position: relative; display:block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* Wig Head */ .b-wig-head { position: relative; z-index: 3; display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-wig-fixed>b-wig-box>.b-wig-head {padding:0 16px;} .b-wig-head-bx { position: relative; display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-wig-head-center { display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; } .b-wig-head-center-absolute { position: absolute; z-index: -1; width: 100%; } /* Wig Head Image */ .b-wig-head-img { display:inline-block; padding:0; height:32px; } /* Wig Head Title */ .b-wig-head-title { display: block; padding:4px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-wig-head-title-text {line-height:32px;} /* Wig Body */ .b-wig-body { position:relative; display: block; width: 100%; text-align:left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; } .b-wig-fixed>.b-wig-box>.b-wig-body {padding: 40px 16px 16px;} .b-wig-body-center {text-align: center;} .b-wig-body-center:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; margin: 0 0 0 -4px; } .b-wig-body-bx { display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-wig-body-center .b-wig-body-bx { display: inline-block; max-width:100%; max-height:100%; vertical-align: middle; } /* Wig Body Column */ .b-wig-body-column { position: relative; display: inline-block; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-wig-body-column-bx { position: relative; display: inline-block; max-height: 100%; vertical-align: middle; } /* Wig Accordian */ .b-wig-accordian {} .b-wig-accordian .b-wig-head {} .b-wig-accordian .b-wig-head-title {width: 100%;padding: 0;} .b-wig-accordian .b-wig-head .b-bt-item {} .b-wig-accordian .b-wig-head-title>.b-bt-link {text-align: left;} .b-wig-accordian>.b-middle { position: absolute; z-index: 1; height: 0; visibility: hidden; overflow: hidden; opacity: 0; -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); } /* Wig Drop */ .b-wig-accordian-drop>.b-middle { position: static; z-index: 1; height: 100%; margin-bottom:12px; visibility: visible; overflow: visible; opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition: -webkit-transform 200ms ease, opacity 150ms ease; transition: -webkit-transform 200ms ease, opacity 150ms ease; transition: transform 200ms ease, opacity 150ms ease; transition: transform 200ms ease, -webkit-transform 200ms ease, opacity 150ms ease; } /* Accordian Button */ .b-bt-accordian-img { display: block; height: 24px; width: 24px; margin: 4px 10px 4px 0; overflow: hidden; } /* ------------------->>> Cubie Navigation <<<-------------------- */ .b-cubie-nav { position: absolute; z-index:100; top: 0; left: 0; width: 100%; height: 0; text-align: center; } .b-cubie-nav-bx { position: relative; top:-4px; display: inline-block; height:10px; padding:0 6px; -webkit-border-radius: 30px 30px 0 0; -moz-border-radius: 30px 30px 0 0; border-radius: 30px 30px 0 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; opacity: 0; visibility: hidden; } .lt .b-cubie-nav-bx {background-color:rgb(40,40,40);} .dt .b-cubie-nav-bx {background-color:rgb(40,40,40);} .b-cubie-nav-bx-open { visibility: visible; opacity: 1; } .b-cubie-nav .b-cubie-background { -webkit-border-radius: 30px 30px 0 0; -moz-border-radius: 30px 30px 0 0; border-radius: 30px 30px 0 0; } .b-cubie-nav>.b-cubie-nav-bx>.b-bt-item {padding:0} .b-cubie-nav>.b-cubie-nav-bx>.b-bt-item>.b-bt-link {padding:4px;line-height:12px;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;} .open-bt .b-bt-link,.close-bt .b-bt-link,.split-bt .b-bt-link,.minus-bt .b-bt-link { line-height:11px; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; } .b-cubie-nav>.b-bt-list>.b-bt-item>.b-bt-link>.b-bt-text {line-height:11px;font-size:11px;} .b-cubie-nav .b-bt-item .b-bt-drop-arrow {margin:-1px 0 0;} .open-bt .b-bt-text,.close-bt .b-bt-text,.split-bt .b-bt-text,.minus-bt .b-bt-text { width:11px; height:11px; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; } .open-bt .b-bt-text {background-color: rgb(86,183,0);} .close-bt .b-bt-text {background-color: rgb(255,88,58);} .split-bt .b-bt-text {background-color: rgb(255,147,12);} .minus-bt .b-bt-text {background-color: rgb(241,214,14);} /* ------------------->>> Cubie Background <<<-------------------- */ .b-cubie-background { position: absolute; z-index:-1; display:block; top: 0; left: 0; height: 100%; width: 100%; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; background-attachment: fixed; background-clip: border-box; background-size: cover; background-position: center; background-repeat: no-repeat; -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); overflow:hidden; } /* --------------------->>> Left Menu <<<---------------------- */ .b-left-menu { position: absolute; z-index:10; top:0; left:0; width: 300px; height: 100%; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transform: translateX(-300px); -moz-transform: translateX(-300px); transform: translateX(-300px); -webkit-transition: transform 250ms ease; -moz-transition: transform 250ms ease; transition: transform 250ms ease; } .b-left-menu-overlay { visibility: hidden; position: absolute; z-index: 9; top:0; left:0; width: 100%; height: 100%; opacity: 0; cursor: pointer; -webkit-transition:opacity 0.2s ease; transition:opacity 0.2s ease; } .lt .b-left-menu-overlay {background-color: rgba(24,24,24,0.7)} .dt .b-left-menu-overlay {background-color: rgba(24,24,24,0.7)} .b-left-menu-overlay-close {position:absolute;width:100%;height:100%;} .lt .b-left-menu-overlay-close, .dt .b-left-menu-overlay-close {background:transparent;} .b-bt-left-menu-slide {display:none;} .b-bt-left-menu {display:none;} @media screen and (max-width: 767px) {.b-bt-left-menu {display:inline-block;}} .b-bt-left-menu-label {position:relative;display: block;width:36px;height:32px;} .b-bt-left-menu-slide:checked ~ .b-cubie-head .b-bt-left-menu-label {} .b-bt-left-menu-label span {position: absolute;height: 2px;top: 9px;left: 0;right: 0;width: 20px;margin:0 auto;transition: all 150ms;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;} .lt .b-bt-left-menu-label span,.lt.b-bt-left-menu-label span {background-color:rgba(0,0,0,0.4);} .dt .b-bt-left-menu-label span,.dt.b-bt-left-menu-label span {background-color:rgba(255,255,255,0.4);} .lt .b-bt-left-menu-label:hover span,.lt.b-bt-left-menu-label:hover span {background-color:rgba(0,0,0,1);} .dt .b-bt-left-menu-label:hover span,.dt.b-bt-left-menu-label:hover span {background-color:rgba(255,255,255,1);} .b-bt-left-menu-label span:nth-of-type(2) {top: 15px;} .b-bt-left-menu-label span:last-of-type {top: auto;bottom: 9px;} .b-bt-left-menu-slide:checked ~ .lt .b-bt-left-menu-label span, .b-bt-left-menu-slide:target ~ .b-cubie-head .b-bt-left-menu-label span {background-color:rgba(0,0,0,1);} .b-bt-left-menu-slide:checked ~ .dt .b-bt-left-menu-label span, .b-bt-left-menu-slide:target ~ .b-cubie-head .b-bt-left-menu-label span {background-color:rgba(255,255,255,1);} .b-bt-left-menu-close .b-bt-link {width:32px;} .b-bt-left-menu-anchor {position:absolute;top:0;left:0;width:1px;height:1px;z-index:10;} .b-bt-left-menu-anchor:focus {width:100%;height:100%;outline-offset:-4px;} .b-bt-left-menu-anchor-open {display:block} .b-bt-left-menu-slide:checked ~ .b-cubie-head .b-cubie-head-bx .b-cubie-head-left .b-bt-left-menu .b-bt-left-menu-anchor-open,.b-bt-left-menu-slide:target ~ .b-cubie-head .b-cubie-head-bx .b-cubie-head-left .b-bt-left-menu .b-bt-left-menu-anchor-open {display:none} .b-bt-left-menu-anchor-close {display:none} .b-bt-left-menu-slide:checked ~ .b-cubie-head .b-cubie-head-bx .b-cubie-head-left .b-bt-left-menu .b-bt-left-menu-anchor-close, .b-bt-left-menu-slide:target ~ .b-cubie-head .b-cubie-head-bx .b-cubie-head-left .b-bt-left-menu .b-bt-left-menu-anchor-close{display:block} @media screen and (max-width: 767px) { .b-bt-left-menu-slide:checked ~ .b-left-menu, .b-bt-left-menu-slide:target ~ .b-left-menu { -webkit-transform: translateX(0px); -moz-transform: translateX(0px); transform: translateX(0px); } } @media screen and (max-width: 767px) { .b-bt-left-menu-slide:checked ~ .b-left-menu-overlay, .b-bt-left-menu-slide:target ~ .b-left-menu-overlay { opacity: 1; visibility: visible; } } /* --------------------->>> Top Menu <<<---------------------- */ .b-top-menu {} @media screen and (max-width: 767px) {.b-top-menu {display:none;}} /* ------------------->>> Page Tabs <<<-------------------- */ .b-page-tabs { position: absolute; bottom: 0; left: 0; display: block; width: 100%; height: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: height 0.2s ease; transition: height 0.2s ease; } .b-page-tabs-open {height: 42px;} .b-page-tabs-bx { position: relative; display: block; width: 100%; height:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; opacity:0; -webkit-transform: translateY(42px); transform: translateY(42px); -webkit-transition: -webkit-transform 0.2s ease, opacity 0.15s ease; transition: transform 0.2s ease, opacity 0.15s ease; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .b-page-tabs-open>.b-page-tabs-bx { opacity:1; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: -webkit-transform 0.2s ease, opacity 0.3s ease; transition: transform 0.2s ease, opacity 0.3s ease; } .b-page-tabs-left { position: relative; display: block; float: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-page-tabs-add-bt { min-width:auto; margin-right:0; } .b-page-tabs-add-bt>.b-page-tabs-link {padding:4px;} .b-page-tabs-center { position: relative; display: block; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; white-space: nowrap; } .b-page-tabs-list { position: relative; display: block; margin:0; padding:0; list-style-type: none; } .b-page-tabs-item { position: relative; display: inline-block; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow:hidden; -webkit-transition: width 0.2s ease; transition: width 0.2s ease; } .b-page-tabs-link { display: block; position: relative; text-decoration: none; cursor:pointer; } /* Color */ .lt .b-page-tabs-link { color: rgba(0,0,0,.3); fill: rgba(0,0,0,.3); -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .lt .b-page-tabs-link:hover { color: rgba(0,0,0,1); fill: rgba(0,0,0,1); -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .dt .b-page-tabs-link { color: rgba(255,255,255,.3); fill: rgba(255,255,255,.3); -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .dt .b-page-tabs-link:hover { color: rgba(255,255,255,1); fill: rgba(255,255,255,1); -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .b-page-tabs-click {} /* Color */ .lt .b-page-tabs-click { color: rgba(0,0,0,1); fill: rgba(0,0,0,1); -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .dt .b-page-tabs-click { color: rgba(255,255,255,1); fill: rgba(255,255,255,1); -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .b-page-tabs-text { display: block; padding: 4px 30px 4px 12px; line-height: 20px; font-size: 11px; font-family: Arial, Helvetica, sans-serif; text-align: center; text-overflow: ellipsis; overflow: hidden; -webkit-transition: padding 0.2s ease; transition: padding 0.2s ease; } .b-page-tabs-close-bt { position: absolute; top: 0; right: 0; width: 0; height: 100%; margin:0; padding: 0; border: 0; background: transparent; outline: 0; cursor: pointer; -webkit-transition: width 0.2s ease; transition: width 0.2s ease; } /* Color */ .lt .b-page-tabs-close-bt { color: rgba(0,0,0,.3); fill: rgba(0,0,0,.3); } .lt .b-page-tabs-close-bt:hover { color: rgba(0,0,0,1); fill: rgba(0,0,0,1); } .dt .b-page-tabs-close-bt { color: rgba(255,255,255,.3); fill: rgba(255,255,255,.3); } .dt .b-page-tabs-close-bt:hover { color: rgba(255,255,255,1); fill: rgba(255,255,255,1); } .b-page-tabs-click>.b-page-tabs-close-bt, .b-page-tabs-link:hover>.b-page-tabs-close-bt { width:30px; -webkit-transition: width 0.2s ease; transition: width 0.2s ease; } .b-page-tabs-close-bt-img { display: inline-block; padding: 4px; text-align: center; vertical-align: middle; opacity:0; -webkit-transform: translateX(10px); transform: translateX(10px); -webkit-transition: -webkit-transform 0.2s ease, opacity 0.2s ease; transition: transform 0.2s ease, opacity 0.2s ease; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .b-page-tabs-click>.b-page-tabs-close-bt>.b-page-tabs-close-bt-img, .b-page-tabs-link:hover>.b-page-tabs-close-bt>.b-page-tabs-close-bt-img { opacity:1; -webkit-transform: translateX(0); transform: translateX(0); -webkit-transition: -webkit-transform 0.2s ease, opacity 0.2s ease; transition: transform 0.2s ease, opacity 0.2s ease; } /* ------------------->>> Page Breadcrumbs <<<-------------------- */ .b-page-bread { position: absolute; display:block; z-index:3; bottom: 0; left: 0; width: 100%; height: 0; border-style:solid; border-width:0; border-color:transparent; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: height 0.2s ease; transition: height 0.2s ease; } .b-page-bread-open { height: 34px; } .b-page-bread-bx { position: relative; display: block; width: 100%; height:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transform: translateY(34px); transform: translateY(34px); -webkit-transition: -webkit-transform 0.2s ease; transition: transform 0.2s ease; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .b-page-bread-open>.b-page-bread-bx { -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: -webkit-transform 0.2s ease; transition: transform 0.2s ease; } .b-page-bread-list { position: relative; display: block; margin:0; padding:0 12px; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; list-style-type: none; text-overflow: ellipsis; overflow-x: hidden !important; overflow-y:hidden; white-space: nowrap; } /* Color */ .lt b-page-bread-list {color: rgba(0,0,0,.5);} .dt b-page-bread-list {color: rgba(255,255,255,.5);} .b-page-bread-item { position: relative; display: inline-block; } .b-page-bread-item+.b-page-bread-item:before { content: ">"; display:inline; vertical-align: middle; font-style: normal; font-size: 9px; -webkit-font-smoothing: antialiased; } /* Color */ .lt .b-page-bread-item+.b-page-bread-item:before { color: rgba(0,0,0,.5); -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .dt .b-page-bread-item+.b-page-bread-item:before { color: rgba(255,255,255,.5); -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .b-page-bread-link { position: relative; padding: 12px 6px; line-height:34px; vertical-align: middle; font-size:11px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; text-decoration: none; cursor:pointer; } /* Color */ .lt .b-page-bread-link { color: rgba(0,0,0,.5); fill: rgba(0,0,0,.5); } .lt .b-page-bread-link:hover { color: rgba(0,0,0,1); fill: rgba(0,0,0,1); } .dt .b-page-bread-link { color: rgba(255,255,255,.5); fill: rgba(255,255,255,.5); } .dt .b-page-bread-link:hover { color: rgba(255,255,255,1); fill: rgba(255,255,255,1); } .b-page-bread-click {} /* Color */ .lt .b-page-bread-click { color: rgba(0,0,0,1); fill: rgba(0,0,0,1); } .dt .b-page-bread-click { color: rgba(255,255,255,1); fill: rgba(255,255,255,1); } .b-page-bread-img { height:14px; max-width:16px; margin-right:4px; vertical-align: middle; } .b-page-bread-text { vertical-align: middle; } /* ---------------------->>> Route Player <<<------------------------ */ .b-route-player {} /* ---------------------->>> File Menu <<<------------------------ */ .b-fileMenu { width: 0; min-width:200px; height: 100%; text-align: left; -webkit-transition: width 300ms ease; -moz-transition: width 300ms ease; transition: width 300ms ease; } .b-fileMenuBx { display: block; height: 100%; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileMenu>.b-drag-bar-right {right:-6px;} .b-fileMenu>.b-drag-bar-right:after {right:-6px;} .b-fileMenu2 {} .lt .b-fileMenu2 {background-color:rgba(255,255,255,0.5);} .dt .b-fileMenu2 {background-color:rgba(255,255,255,0.3);} /* File Menu Head */ .b-fileMenuHead { position: absolute; z-index: 6; top: 0; left: 0; display: block; width: 100%; height: 54px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileMenuHeadBx { position: relative; display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileMenuHeadList {display: block;} .b-fileMenuHeadLeft { position: relative; display: block; float: left; height: 100%; padding:0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileMenuHeadRight { position: relative; display: block; float: right; height: 100%; padding:0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileMenuHeadCenter { position: relative; display: block; height: 100%; padding:0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow-x: hidden; white-space: nowrap; } /* File Menu Body */ .b-fileMenuBody { display:block; width: 100%; height: 100%; overflow-x: hidden; overflow-y: auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileMenuList { position: absolute; z-index:1; display: block; width: 100%; height:0; text-align: left; visibility: hidden; overflow:hidden; opacity:0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); } .b-fileMenuDrop~.b-fileMenuList { position: static; z-index:1; height:100%; visibility: visible; overflow:visible; opacity:1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition: -webkit-transform 200ms ease, opacity 150ms ease; transition: -webkit-transform 200ms ease, opacity 150ms ease; transition: transform 200ms ease, opacity 150ms ease; transition: transform 200ms ease, -webkit-transform 200ms ease, opacity 150ms ease; } .b-fileMenuSectionItem>.b-fileMenuList {} .b-fileMenuMainItem>.b-fileMenuList {margin:0 0 6px;} .b-fileMenuListShow { position: relative; z-index:1; height:auto; visibility: visible; overflow: visible; opacity:1; -webkit-transform: none; -ms-transform: none; transform: none; } .b-fileMenuItem,.b-fileMenuMainItem,.b-fileMenuSectionItem {padding:0;} .b-fileMenuSectionItem {margin-bottom:8px;} .b-fileMenuSectionItem>.b-fileMenuItemLink {margin-bottom:2px;;} .b-fileMenuMainItem {} .b-fileMenuItemLink {padding: 3px 12px;line-height:16px;} .b-fileMenuMainItem>.b-fileMenuItemLink {line-height:26px;} .b-fileMenuClick {} .lt .b-bt-link.b-fileMenuClick {background: rgba(0,0,0,0.06);} .dt .b-bt-link.b-fileMenuClick {background: rgba(255,255,255,0.06);} .b-fileMenuItemRight {} .b-fileMenuItemRight>.b-bt-list>.b-bt-item {float:right;} .b-fileMenuItemRight>.b-bt-list>.b-bt-item>.b-bt-link {margin-left: 2px;padding: 0 2px;line-height: 16px;} .b-fileMenuMainItem>.b-fileMenuItemLink>.b-fileMenuItemRight>.b-bt-list>.b-bt-item>.b-bt-link {line-height: 26px;} .b-fileMenuItemRight>.b-bt-list>.b-bt-item>.b-bt-link>.b-bt-text { display: block; font-size: 9px; font-weight: bold; } .b-fileMenuItemRight .b-bt-drop-arrow {margin: 5px 2px;} .b-fileMenuMainItem>.b-fileMenuItemLink .b-fileMenuItemRight .b-bt-drop-arrow {margin: 10px 2px;} /* File Menu Item Options Bt */ .b-fileMenuItemOptionsBt {display:none;} .b-fileMenuClick>.b-fileMenuItemRight>.b-bt-list>.b-fileMenuItemOptionsBt {display:inline-block;} /* Item Total Tag */ .b-fileMenuItemTotal {} .b-fileMenuItemImage { margin: 0 6px 0 0; width: 16px; height: 16px; text-align: center; } .lt .b-fileMenuItemImage {fill:rgba(0,0,0,0.35);color:rgba(0,0,0,0.35);} .dt .b-fileMenuItemImage {fill:rgba(255,255,255,0.35);color:rgba(255,255,255,0.35);} .b-fileMenuMainItem>.b-fileMenuItemLink>.b-fileMenuItemImage {width:30px;height:26px;} .b-fileMenuItemImageBx { display:inline-block; width:auto; height:100%; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .b-fileMenuTextIcon {} .b-fileMenuFolderIcon {width:auto;max-width:100%;height:100%;} .lt .b-fileMenuFolderIcon,.dt .b-fileMenuFolderIcon {fill: #29a8e1} /* .b-fileMenuDrop>.b-fileMenuItemImage>.b-fileMenuFolderIcon>path:nth-child(2) { -webkit-transform-origin: 0 100%; transform-origin: 0 100%; -webkit-transform: skewX(-15deg) rotateX(25deg); transform: skewX(-15deg) rotateX(25deg); } */ .b-fileMenuMainItem>.b-fileMenuItemLink>.b-fileMenuItemImage>.b-fileMenuFolderIcon { padding:2px 1px 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileMenuGroupIcon { display: inline-block; width: 100%; height: 100%; overflow:hidden; } .b-fileMenuPageIcon { display: inline-block; width: 16px; height: 15px; font-weight: bold; font-size: 11px; line-height: 11px; border-style: solid; border-width: 1px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileMenuMainItem>.b-fileMenuItemLink>.b-fileMenuItemImage .b-fileMenuPageIcon { width:24px; height:23px; line-height:21px; font-size:12px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .b-fileMenuDropArrow:before { content: ""; position: absolute; top: 5px; left: -12px; display: inline-block; width: 0; height: 0; margin: 0; vertical-align: middle; border-top: 5px solid; border-right: 4px solid transparent; border-bottom: 0; border-left: 4px solid transparent; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transition: -webkit-transform 0.2s; transition: transform 0.2s; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .lt .b-fileMenuDropArrow:before {color: rgba(0,0,0,0.25);} .dt .b-fileMenuDropArrow:before {color: rgba(255,255,255,0.24);} .b-fileMenuDrop>.b-fileMenuDropArrow:before { -webkit-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: -webkit-transform 0.2s; transition: transform 0.2s; } .b-fileMenuDrop>.b-fileMenuItemImage>.b-fileMenuArrowIcon { -webkit-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition: -webkit-transform 0.2s; transition: transform 0.2s; } .b-fileMenuNumber { font-size: 10px; color: #fff; } .b-fileMenuNumberBx { display:inline-block; -webkit-border-radius: 99px; -moz-border-radius: 99px; border-radius: 99px; padding: 0 5px; text-align: center; vertical-align: middle; line-height: 13px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .lt .b-fileMenuNumberBx {background: rgba(0,0,0,0.4);} .dt .b-fileMenuNumberBx {background: rgba(0,0,0,0.4);} .b-fileMenuItemCenter {} .b-fileMenuItemTitle { display: block; margin-right:6px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .lt .b-fileMenuClick .b-fileMenuItemTitle {color: rgba(0,0,0,1);} .dt .b-fileMenuClick .b-fileMenuItemTitle {color: rgba(255,255,255,1);} .b-fileMenuMainItem>.b-fileMenuItemLink .b-fileMenuItemTitle {font-weight:bold;font-size:13px;} .lt .b-fileMenuMainItem>.b-fileMenuItemLink .b-fileMenuItemTitle {color: rgba(0,0,0,1);} .dt .b-fileMenuMainItem>.b-fileMenuItemLink .b-fileMenuItemTitle {color: rgba(255,255,255,1);} /* Collapse */ .b-fileMenuCollapse {max-width:52px;} .b-fileMenuCollapse:hover {max-width: 360px;} .b-fileMenuCollapse .b-fileMenuSectionItem {margin:0;} .b-fileMenuCollapse .b-fileMenuSectionItem>.b-fileMenuItemLink {display:none} .b-fileMenuCollapse .b-fileMenuMainItem {} .b-fileMenuCollapse .b-fileMenuMainItem>.b-fileMenuItemLink {} .b-fileMenuCollapse .b-fileMenuMainItem>.b-fileMenuItemLink>.b-fileMenuItemImage {} .b-fileMenuCollapse .b-fileMenuMainItem>.b-fileMenuItemLink>.b-fileMenuItemCenter {} .b-fileMenuCollapse .b-fileMenuMainItem>.b-fileMenuItemLink:hover .b-fileMenuItemCenter {} .b-fileMenuCollapse .b-fileMenuMainItem>.b-fileMenuItemLink>.b-fileMenuItemCenter>.b-fileMenuItemTitle {} .b-fileMenuCollapse .b-fileMenuMainItem>.b-fileMenuList { display:none; position: absolute; left: 100%; width: 300px; top: 0; background: #fff; border-radius: 0 12px 12px 0; } /* fileMenu 2 / appMenuContainer2 */ .appMenuContainer2 {} .lt .appMenuContainer2 {background-color:rgba(255,255,255,0.5);border-right: solid 1px rgba(0,0,0,0.1)} .dt .appMenuContainer2 {background-color:rgba(255,255,255,0.07)border-right: solid 1px rgba(255,255,255,0.1)} /* ------------------->>> Table <<<-------------------- */ .b-wig-table { position: relative; display: block; width: 100%; white-space: nowrap; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; } .b-wig-table-bx { position: relative; display: block; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-wig-table-bx:before,.b-wig-table-bx:after { content: ""; display: table; clear: both; } .b-wig-table-head { position: relative; display: inline-block; float: left; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableListGrid .b-wig-table-head {display:none;} .b-wig-table-head-bx { position: relative; display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-wig-table-item { position: relative; display: inline-block; float: left; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableListGrid .b-wig-table-item {width:16.66%;min-width:auto;} .b-fileTableListSmall .b-wig-table-item {} .b-wig-table-item-bx { position: relative; display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-wig-table-item-head { position: relative; display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-wig-table-item-head-bx {} .b-wig-table-column { position: relative; display: inline-block; height: 100%; padding: 6px 10px; vertical-align: middle; text-align: center; border-style: solid; border-width: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; white-space: normal; } .b-wig-table-column:before { content: ""; display: inline-block; margin-left: -4px; height: 100%; vertical-align: middle; } .lt .b-wig-table-column {border-color: rgba(0,0,0,0.1);} .dt .b-wig-table-column {border-color: rgba(255,255,255,0.1);} .b-wig-table-column-bx { display: inline-block; width: 100%; max-height: 100%; vertical-align: middle; } /* Theme1 */ .b-wig-table-theme1 .b-wig-table-item-bx {border-style:solid;border-width: 0 0 1px 0;} .lt .b-wig-table-theme1 .b-wig-table-item-bx {border-color: #ddd;} .dt .b-wig-table-theme1 .b-wig-table-item-bx {border-color:#333;} .b-wig-table-theme1 .b-fileTableListGrid .b-wig-table-item-bx {border-width:0 1px 1px 0;} /* Theme2 */ .b-wig-table-theme2 .b-wig-table-item {padding:5px 0;} .b-wig-table-theme2.b-fileTableListGrid .b-wig-table-item {padding:6px 12px 6px 0;} .b-wig-table-theme2.b-fileTableListSmall .b-wig-table-item {padding:3px 0;} .b-wig-table-theme2 .b-wig-table-item-bx { -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } .lt .b-wig-table-theme2 .b-wig-table-item-bx {background-color: rgba(255,255,255,0.85);} .dt .b-wig-table-theme2 .b-wig-table-item-bx {background-color: rgba(255,255,255,0.05);} .b-wig-table-theme2 .b-fileTableListSmall .b-wig-table-item-bx { -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; } /* Theme3 */ .b-wig-table-theme3 .b-wig-table-item {padding:0 1px 1px} .b-wig-table-theme3.b-fileTableListGrid .b-wig-table-item {} .b-wig-table-theme3.b-fileTableListSmall .b-wig-table-item {} .b-wig-table-theme3 .b-wig-table-head {padding: 0 0 4px} .b-wig-table-theme3 .b-wig-table-item-bx {} .b-wig-table-theme3 .b-wig-table-items .b-wig-table-item:first-child > .b-wig-table-item-bx { -webkit-border-radius: 10px 10px 0 0; -moz-border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0; } .b-wig-table-theme3 .b-wig-table-items .b-wig-table-item:last-child > .b-wig-table-item-bx { -webkit-border-radius: 0 0 10px 10px; -moz-border-radius: 0 0 10px 10px; border-radius: 0 0 10px 10px; } .lt .b-wig-table-theme3 .b-wig-table-item-bx { background-color: rgba(255,255,255,1); -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1); -moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1); box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1); } .dt .b-wig-table-theme3 .b-wig-table-item-bx { background-color: rgba(44,44,44,1); -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1); -moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1); box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1); } .b-wig-table-theme3.b-fileTableListGrid .b-wig-table-item {padding:6px 12px 6px 0;} .b-wig-table-theme3.b-fileTableListGrid .b-wig-table-item .b-wig-table-item-bx { border-width:1px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } /* ------------------->>> File Table <<<-------------------- */ .b-fileTable {} .b-fileTableBx { position: relative; display:block; width: 100%; height:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableTop { display: block; width: 100%; height: 40px; line-height: 30px; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableTopLeft { position: relative; display: block; float: left; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableTopRight { position: relative; display: block; float: right; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableTopCenter { position: relative; display: block; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow-x: hidden; white-space: nowrap; } .b-fileTableTopTitle { position: relative; display: block; width: 100%; height: 100%; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableTopTitleBx { position: relative; display: block; width: 100%; height: 100%; padding: 6px; line-height: 30px; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableTopTitleImage { width: 30px; height: 30px; text-align: center; position: absolute; display: inline-block; } .b-fileTableTopTitleImageBx { display: inline-block; max-width: 100%; max-height: 100%; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; overflow: hidden; } .b-fileTableTopTitleTitles { display: inline-block; position: relative; width: 100%; height:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableTopTitle1 { display: inline-block; font-size: 20px; font-weight: bold; text-overflow: ellipsis; overflow: hidden; } .b-fileTableMiddle { position: relative; width: 100%; padding:40px 0 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableListTop { z-index: 1; position: absolute; left: 0; display: block; width: 100%; height: 30px; line-height:30px; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableListTopLeft { position: relative; display: block; float: left; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableListTopRight { position: relative; display: block; float: right; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableListTopCenter { position: relative; display: block; height: 100%; padding: 0 0 0 5px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow-x: hidden; white-space: nowrap; } .b-fileTableListTopLink { position: relative; display: inline-block; height: 30px; margin: 0; padding: 5px 10px; background: transparent; outline: 0; border: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: pointer; -webkit-tap-highlight-color: transparent; } .lt .b-fileTableListTopLink {color: rgba(0,0,0,1); fill: rgba(0,0,0,1);} .dt .b-fileTableListTopLink {color:rgba(255,255,255,1); fill:rgba(255,255,255,1);} .b-fileTableListTopLinkText { display: block; line-height: 20px; font-size: 11px; font-weight: bold; vertical-align: middle; } .b-fileTableListMiddle { position: relative; width: 100%; padding-top: 30px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* ------------------->>> File Table List <<<-------------------- */ .b-fileTableList { position: relative; display: block; width: 100%; overflow-x: hidden !important; white-space: nowrap; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableListBx { position: relative; display:inline-block; min-width:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableListGrid .b-fileTableListBx {overflow-x:hidden} .b-fileTableListBx:before,.b-fileTableListBx:after {content:"";display:table;clear:both;} /* File Table Group */ .b-fileTableListGroupTitle { display: block; float: left; width: 100%; padding: 12px 12px 6px; line-height: 30px; font-size: 15px; font-weight: bold; } /* File Table Item */ .b-fileTableItem { position: relative; display: inline-block; float:left; min-width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableListGrid .b-fileTableItem {width:16.66%;min-width:auto;} .b-fileTableItemBx { position: relative; display:block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableListGrid .b-fileTableItemBx {padding:0;} /* File Table Item Align */ .b-fileTableItemLeft { position: relative; display: block; float: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableListGrid .b-fileTableItemLeft { z-index: 1; position: absolute; top: 0; left: 0; } .b-fileTableItemRight { position: relative; display: block; float: right; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableListGrid .b-fileTableItemRight { z-index: 1; position: absolute; top: 0; right: 0; } .b-fileTableItemRightList {padding:0 10px;} .b-fileTableListGrid .b-fileTableItem .b-fileTableItemRightList {padding:0;} .b-fileTableItemRightItem {padding:0;} .b-fileTableItemRightLink {} .b-fileTableItemRightLinkBx {} .b-fileTableItemCenter { position: relative; display: block; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden; white-space: nowrap; } /* File Table Head */ .b-fileTableHead {} .b-fileTableListGrid .b-fileTableHead {display:none;} .b-fileTableHead .b-fileTableColumn { padding: 3px 10px; margin: 5px 0; height: auto; color: inherit; } .b-fileTableHeadBt { display: inline-block; width:100%; padding: 0; text-align: inherit; vertical-align: middle; background-color: transparent; background-image: none; border: 0; outline:none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor:pointer; } .b-fileTableHeadBtText { display: block; line-height: 16px; font-size: 11px; font-weight: bold; vertical-align: middle; } /* File Table Columns */ .b-fileTableColumn { position: relative; display: inline-block; height:100%; padding:6px 10px; vertical-align: middle; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; white-space: normal; } .b-fileTableColumn:before {content:"";display: inline-block;margin-left:-4px;height:100%;vertical-align: middle;} .b-fileTableColumnBx { position: relative; display: inline-block; width:100%; max-height: 100%; vertical-align: middle; } /* Column Drag Bar */ .b-file-table-column-drag { position: absolute; top:0; right: 0; padding: 0 2px; height: 100%; cursor: ew-resize; } .b-file-table-column-drag:before { content: ""; display: inline-block; margin: 8px 0; height: 16px; width: 1px; } .lt .b-file-table-column-drag:before {background-color:rgba(0,0,0,0.1);} .dt .b-file-table-column-drag:before {background-color:rgba(255,255,255,0.1);} /* Checkbox - Column */ .b-fileTableCheckboxColumn {width: 32px;padding-right:0;} .b-fileTableListGrid .b-fileTableCheckboxColumn {padding:6px;} .b-fileTableCheckboxColumn .b-file-table-column-drag {display:none;} /* Name - Column */ .b-fileTableName { width: 200px; text-align: left; cursor:pointer; } /* Color */ .lt .b-fileTableName {color: rgba(0,0,0,1);} .dt .b-fileTableName {color: rgba(255,255,255,1);} .b-fileTableListGrid .b-fileTableName { display:block; width:100%; padding: 0 10px; } .b-fileTableListGrid .b-fileTableItem:first-child .b-fileTableName { display:inline-block; width:auto; } .b-fileTableNameImage { position: relative; display: inline-block; float:left; height: 48px; width:48px; text-align: center; vertical-align: middle; } .b-fileTableListSmall .b-fileTableNameImage { width:30px; height:20px; } .b-fileTableListGrid .b-fileTableNameImage { display:block; width:100%; height: 150px; } .b-fileTableNameImagePicture { position: absolute; display:block; top:0; left:0; width:100%; height:100%; padding:0 6px 0 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableListGrid .b-fileTableNameImagePicture {padding:0 6px;} .b-fileTableNameImagePicture:before {content:"";display:inline-block;height:100%;vertical-align:middle;margin:0 0 0 -4px;} .b-fileTableNameImagePictureBx { position: relative; display: inline-block; max-width:100%; max-height: 100%; vertical-align: middle; text-align: center; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableListSmall .b-fileTableNameImagePictureBx { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .b-fileTableListGrid .b-fileTableNameImagePictureBx { -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; } .b-fileTableNameImagePictureBxRound, .b-fileTableListSmall .b-fileTableNameImagePictureBxRound, .b-fileTableListGrid .b-fileTableNameImagePictureBxRound { -webkit-border-radius: 999px; -moz-border-radius: 999px; border-radius: 999px; } .b-fileTableNameTitles { display: block; padding: 8px 0 8px 4px; overflow: hidden; white-space: nowrap; } .b-fileTableListGrid .b-fileTableNameTitles {width: 100%;padding:0;text-align: center;} .b-fileTableListSmall .b-fileTableNameTitles {padding:0;} .b-fileTableNameTitle1 { display: block; line-height: 16px; vertical-align: middle; text-overflow: ellipsis; overflow: hidden; } .b-fileTableNameTitleBold { font-size: 13px; font-weight: bold; } .b-fileTableNameTitle2 { display: block; line-height: 16px; font-size: 11px; text-overflow: ellipsis; overflow: hidden; } /* Color */ .lt .b-fileTableNameTitle2 {color: rgba(0,0,0,.4);} .dt .b-fileTableNameTitle2 {color:rgba(255,255,255,.4);} .b-fileTableListSmall .b-wig-table-item .b-fileTableNameTitle2 {display:none} /* ------------------->>> File Table Footer <<<-------------------- */ .b-fileTableBottom { z-index: 1; position: absolute; bottom: 0; left: 0; display: block; width: 100%; height: 40px; line-height:40px; text-align: left; background: rgba(0,0,0,.1); border-top: solid 1px rgba(0,0,0,.1); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableBottomRight { position: relative; display: block; float: right; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-fileTableBottomCenter { position: relative; display: block; height: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow-x: hidden; white-space: nowrap; } /* ------------------->>> File Table Group Item <<<-------------------- */ .b-fileTableListGrid .b-fileTableGroup .b-fileTableItemBx { margin: 0; border-right: 0; border-bottom: 0; } .b-fileTableListGrid .b-fileTableGroup .b-fileTableCheckboxColumn {display:none;} .b-fileTableListGrid .b-fileTableGroup .b-fileTableName {padding: 15px;} .b-fileTableListGrid .b-fileTableGroup .b-fileTableNameTitles {padding: 5px 0;} /* ------------------->>> Product Widget <<<-------------------- */ .b-product-details-input {display:none;} .b-product {} .b-product-img { position: relative; float: left; width: 100%; } .b-product-img-placeholder { position: relative; display: inline-block; width: 100%; max-width: 100%; max-height: 100%; visibility: hidden; } .b-product-img-pic { position: absolute; left: 0; top: 0; width: 100%; height: 100%; text-align: center; font-size: 0; overflow: hidden; } .b-product-img-pic:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .b-product-img-pic-bx { width: 100%; max-height: 100%; display: inline-block; vertical-align: middle; } .b-product-details { height: 100%; height: 140px; text-align: left; overflow: hidden; -webkit-transition: height 350ms ease; -moz-transition: height 350ms ease; -o-transition: height 350ms ease; transition: height 350ms ease; } .b-product-details-input:checked ~ .b-product-details, .b-product-details-input:target ~ .b-product-details {height:100%;} .b-product-details-bt .b-bt-link svg { -webkit-transform: rotate(180deg); transform: rotate(180deg); -webkit-transition: -webkit-transform 150ms; transition: transform 150ms ease; } .b-product-details-input:checked ~ .b-product-details .b-product-details-bt .b-bt-link svg, .b-product-details-input:target .b-product-details-bt .b-bt-link svg {-webkit-transform: rotate(0deg);transform: rotate(0deg);} .b-product-details-input:checked ~ .b-product-details .b-product-details-bt .b-bt-hidden-anchor-open, .b-product-details-input:target ~ .b-product-details .b-product-details-bt .b-bt-hidden-anchor-open {display:none} .b-product-details-input:checked ~ .b-product-details .b-product-details-bt .b-bt-hidden-anchor-close, .b-product-details-input:target ~ .b-product-details .b-product-details-bt .b-bt-hidden-anchor-close{display:block} .b-product-details>.b-middle>.bx {overflow-y: hidden;} .b-product-details-input:checked ~ .b-product-details>.b-middle>.b-middle-bx, .b-product-details-input:target ~ .b-product-details>.b-middle>.b-middle-bx {overflow-y:auto;} .b-product-details-seperator {height: 0;margin: 12px 0;overflow: hidden;} .lt .b-product-details-seperator {border-top: 1px solid rgba(0,0,0,0.1);} .dt .b-product-details-seperator {border-top: 1px solid rgba(255,255,255,0.1);} /* ------------------->>> Promo Widget <<<-------------------- */ .b-promo {text-align: center;} .b-promo .b-wig-item-bx { width: 90%; margin: 0 auto; } .b-promo-column {width:49%;} @media screen and (max-width: 767px){.b-promo-column {width:100%;}} .b-promo-img { position: relative; display: inline-block; text-align: center; vertical-align: middle; } .b-promo-img-bx { display: block; margin: 0 auto; max-width:100%; max-height:100%; overflow:hidden; } .b-promo-details { position: relative; display: block; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-promo-left .b-promo-text {text-align: left;} .b-promo-right .b-promo-text {text-align: left;} .b-promo-center .b-promo-text {text-align: center;} .b-promo-title { display: block; } .b-promo-title2 { display: block; color: #0075e1; } .b-promo-title-img { display: inline-block; vertical-align: middle; } .b-promo-title>.b-promo-title-img {height: 40px;width:40px;margin:0 12px 8px 0} .b-promo-title2>.b-promo-title-img {height: 20px;width:20px;margin:0 2px 8px 0} .b-promo-title-text { display: inline-block; margin-bottom:8px; vertical-align: middle; } .b-promo-title2 .b-promo-title-text {font-weight:normal} .b-promo-underline:after { content:""; display: block; width:145px; margin: 8px 0; border-bottom: dotted 5px #0075e1; } .b-promo-desc { display:inline-block; max-width:700px; margin: 8px 0 16px; padding:0; } /* ------------------->>> Activity <<<-------------------- */ .b-fileTableActivity .b-fileTableItem { padding: 8px; min-width:80%; } .b-fileTableActivity .b-fileTableItemBx { border-bottom: 0; -webkit-border-radius: 24px; -moz-border-radius: 24px; border-radius: 24px; } .lt .b-fileTableActivity .b-fileTableItemBx {background: rgba(0,0,0,0.04);} .dt .b-fileTableActivity .b-fileTableItemBx {background: rgba(255,255,255,0.05);} /* ------------------->>> Instructions Widget <<<-------------------- */ .b-wig-instructions {} /* ------------------->>> Notes Widget <<<-------------------- */ .b-wig-notes {} /* ------------------->>> Route Stops Widget <<<-------------------- */ .b-wig-stops {} .b-wig-stops .b-wig-head {padding: 0 0 0 16px;} .b-wig-stops .b-wig-body {text-align: center;} /* ------------------->>> Packages <<<-------------------- */ .b-wig-packages {} .b-wig-packages .b-wig-body {} .b-wig-packages .b-wig-head {padding: 0 0 0 16px;} .b-wig-packages-text {width:100%;height:100%;display: block;} .b-wig-packages-text-input { display: block; width: 100%; height: 100%; padding: 0; margin: 0; font-size: 40px; text-align: center; color: inherit; outline: 0; border: 0; background-color: transparent; -webkit-tap-highlight-color: transparent; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* ------------------->>> POD <<<-------------------- */ .b-wig-pod {} .b-wig-pod .b-wig-head {padding: 0 6px 0 16px;} .b-wig-pod .b-wig-body {height:100%;padding: 40px 16px 12px;} .b-wig-pod .b-wig-body-bx {position: relative;height: 100%;} .b-wig-pod .b-wig-body-bx:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; margin: 0 0 0 -4px; } .b-wig-pod-sig-link { position: absolute; display: block; top: 0; width: 100%; height: 100%; padding:0; background: transparent; border: 0; outline: 0; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent; } .b-wig-pod-sig { position: absolute; bottom:0; width: 100%; } .b-wig-pod-sig-bx { position: relative; display: block; height: 52px; margin-bottom: 6px; padding: 0 6px 0 22px; text-align: center; cursor:pointer; } .lt .b-wig-pod-sig-bx {border-bottom: solid 1px rgba(0,0,0,0.15);} .dt .b-wig-pod-sig-bx {border-bottom: solid 1px rgba(255,255,255,0.15);} .b-wig-pod-sig-bx:before { content: "X"; position: absolute; left: 2px; bottom: 6px; font-weight: bold; font-size: 13px; opacity:0.3; } .b-wig-pod-sig-img { position: relative; z-index:2; display: inline-block; max-width:100%; height:100%; } .b-wig-pod-sig-details { display: block; padding:2px 0 0 1px; text-align: left; } .b-wig-pod-sig-pic { position: relative; z-index:2; float: right; height: 30px; width: 30px; margin: 2px 0 0 12px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; cursor: pointer; overflow:hidden; } .lt .b-wig-pod-sig-pic {background: rgba(0,0,0,0.08);} .dt .b-wig-pod-sig-pic {background: rgba(255,255,255,0.08);} .b-wig-pod-sig-pic-img { display: block; max-width:100%; max-height:100%; } .b-wig-pod-sig-name { display: block; margin-bottom: 4px; font-size:13px; font-weight:bold; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .b-wig-pod-sig-time { display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; opacity:0.4; } /* ------------------->>> Widget Options <<<-------------------- */ .b-wig-select { -webkit-box-shadow: 0 0 1px 3px rgba(55, 119, 235,0.5); -moz-box-shadow: 0 0 1px 3px rgba(55, 119, 235,0.5); box-shadow: 0 0 1px 3px rgba(55, 119, 235,0.5); } /* ------------------->>> Login Widget <<<-------------------- */ #loginContainer { width: 100%; height: 100%; } .loginMod { display:inline-block; width:100%; } .loginMod:before { content: ""; display: inline-block; height: 100%; margin: 0 0 0 -4px; vertical-align: middle; } .loginModContainer { display:inline-block; } .loginModLogo { display:inline-block; width:100%; height:175px; margin-bottom:35px; text-align:center; } .loginModLogo img { max-height:100%; } .loginModEmail { display:inline-block; width:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .loginModEmailField,.loginModPasswordField {cursor: inherit;} .lt .loginModEmailField::placeholder,.dt .loginModEmailField::placeholder, .lt .loginModPasswordField::placeholder,.dt .loginModPasswordField::placeholder {color:rgba(0,0,0,0.5);} .loginModPassword { position: relative; display:inline-block; width:100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .loginModEmailField~.error,.loginModPasswordField~.error {position: absolute;z-index: 2;right: 18px;bottom: 15px;} .loginModForgotP { display:inline-block; margin:5px 15px; cursor:pointer; } .loginModContactUs { display: inline-block; margin: 5px 15px; font-size: 12px; cursor: pointer; color: #fff; text-decoration: none; } /* ------------------->>> Notifications Widget <<<-------------------- */ .b-noti { position: absolute; z-index: 1000000; top: 0; right: 0; min-width:300px; } .b-noti .b-wig-list-bx {padding: 12px;} .b-noti .b-wig-item { display: block; float:none; right: -100%; width: 360px; margin: 0 0 0 auto; opacity: 0; -webkit-transition: opacity 0.4s ease-out, right 0.2s ease-out; -moz-transition: opacity 0.4s ease-out, right 0.2s ease-out; -o-transition: opacity 0.4s ease-out, right 0.2s ease-out; transition: opacity 0.4s ease-out, right 0.2s ease-out; pointer-events: all; } .b-noti .b-wig-item:first-child {padding: 0 4px 4px;} .b-noti .b-wig-item .b-noti-slide { opacity: 1; right: 0; -webkit-transition: opacity 0.15s ease-in, right 0.2s ease-out; -moz-transition: opacity 0.15s ease-in, right 0.2s ease-out; -o-transition: opacity 0.15s ease-in, right 0.2s ease-out; transition: opacity 0.15s ease-in, right 0.2s ease-out; } .b-noti .b-wig-body {text-align: left} .b-noti-tag { position: absolute; display: block; height:13px; top: -4px; left: -4px; padding: 0 5px; font-size: 10px; line-height: 13px; color: #fff; background-color: #e20336; -webkit-border-radius: 99px; -moz-border-radius: 99px; border-radius: 99px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-noti-dot:after { content:""; position: absolute; display: block; top: -2px; left: -1px; height: 6px; width: 6px; padding: 0; background-color: #e20336; -webkit-border-radius: 99px; -moz-border-radius: 99px; border-radius: 99px; } /* Color */ .b-noti-l-white { color: #999; fill: #686868; background-color: #fff; border-color: #ddd; } .b-noti-d-white { color: #000; fill: #000; background-color: #fff; border-color: #ddd; } .b-noti-blue { color: #004085; fill: #004085; background-color: #cce5ff; border-color: #b8daff; } .b-noti-l-grey { color: #383d41; fill: #383d41; background-color: #e2e3e5; border-color: #d6d8db; } .b-noti-d-grey { color: #1b1e21; fill: #1b1e21; background-color: #d6d8d9; border-color: #c6c8ca; } .b-noti-green { color: #155724; fill: #155724; background-color: #d4edda; border-color: #c3e6cb; } .b-noti-red { color: #721c24; fill: #721c24; background-color: #f8d7da; border-color: #f5c6cb; } .b-noti-yellow { color: #856404; fill: #856404; background-color: #fff3cd; border-color: #ffeeba; } .b-noti-teal { color: #0c5460; fill: #0c5460; background-color: #d1ecf1; border-color: #bee5eb; } /* ------------------>>> Social Widget <<<------------------- */ .b-wig-social {width:100%;padding: 8px 16px;} .b-wig-social-add-user-bt {float: left;width: 100%;padding: 0;border-bottom: solid;border-bottom-width: 1px;border-bottom-color: #e1e1e1;} .b-wig-social-add-user-bt .b-bt-link {background: transparent;height: 50px;padding: 15px 15px 15px 20px;text-align: left;background-color: transparent;-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;} /* ------------------>>> Invoice Widget <<<------------------- */ .b-wig-invoice {} /* ----------------->>> Status Bar Widget <<<------------------ */ .b-wig-status-bar {} /* -------------->>> Overlay Message Widget <<<---------------- */ .b-overlay-message { display: block; width:100%; height:100%; text-align: center; overflow:hidden; } .b-overlay-message:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; margin: 0 0 0 -4px; } .b-overlay-message-bx { display: inline-block; max-width: 100%; max-height: 100%; vertical-align: middle; overflow: hidden; } /* ---------------->>> Overlay Widget <<<------------------ */ .b-wig-overlay {} .b-wig-overlay .b-wig-head-img { position: relative; display: block; width: 100px; height: 100px; margin: 0 auto 12px; padding:8px; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .b-wig-overlay .b-wig-head-img-svg { display: inline-block; width: 100%; height: 100%; vertical-align: middle; opacity:0.4; } .b-wig-overlay .b-wig-head-img-pic { display: inline-block; max-width: 100%; max-height: 100%; } .b-wig-overlay .b-wig-head-title { text-align: center; } .b-wig-overlay-title2 {display:block;opacity:0.4;} .b-wig-overlay-title-text { display: inline-block; line-height: inherit; font-weight: bold; vertical-align: middle; } /* ----------------->>> Map Widget <<<------------------ */ .b-wig-map { z-index:2; width:100%; height: 100%; } .b-wig-map .b-wig-item-bx { min-height:100%; max-height: 100%; overflow: hidden; } /* ----------------->>> Page Menu Widget <<<------------------ */ .b-wig-page-menu {} .b-wig-page-menu-bx {} /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* ------------------------------------------->>> Functions <<<------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* Cubie Collapse */ .cubie-collapse {max-width:120px;} .cubie-collapse .cubie-bx { padding:180px 0 0; background-color:transparent; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; overflow:visible; } .cubie-collapse.cubie-select>.cubie-bx {background:rgba(251,251,251,0.3);} .cubie-collapse .b-cubie-background {opacity:0;} .cubie-collapse .b-cubie-nav-background {opacity:0;} .cubie-collapse .b-cubie-nav-bx {background-color:transparent} .cubie-collapse .b-cubie-head {height:135px;background:transparent;} .cubie-collapse .b-cubie-head-bx {border-bottom: 0;} .cubie-collapse .b-cubie-head-left {display:block;width: 100%;height:100%;} .cubie-collapse .b-cubie-head-left .b-bt-list {display:block;height:100%;padding:0} .cubie-collapse .b-cubie-head-file-menu-bt {display:none;} .cubie-collapse .b-cubie-head-logo-bt {height:100%;padding:0} .cubie-collapse .b-cubie-head-logo-link {height:100%;padding:6px 0;text-align: center;background-color: transparent;outline-offset: -4px;} .cubie-collapse .b-cubie-head-logo-icon { float:none; width:101px; height: 101px; margin:0 auto; -webkit-transition: width .1s ease, height .1s ease; -moz-transition: width .1s ease, height .1s ease; -o-transition: width .1s ease, height .1s ease; transition: width .1s ease, height .1s ease; } .cubie-collapse .b-cubie-head-logo {padding:6px;} .cubie-collapse .b-cubie-head-logo-text { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .cubie-collapse .b-cubie-head-logo-title-text {margin: 5px 0;font-size:14px;text-shadow: 0 0 2px rgba(0,0,0,.5);} .cubie-collapse .b-cubie-head-logo-group {display:none;} .cubie-collapse .b-cubie-head-logo-group-icon {display:none;} .cubie-collapse .b-cubie-head-right {display:none;} .cubie-collapse .b-cubie-head-center {display:none;} /* Cubie Full Screen */ .b-cubie-full {padding:0} .b-cubie-full .cubie-bx {-webkit-border-radius: 0;-moz-border-radius: 0;border-radius: 0;} .b-cubie-full .b-cubie-nav-bx {visibility: hidden;opacity: 0;} /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* ------------------------------------------->>> Special <<<--------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* ------------------->>> Cubie Head Logo <<<-------------------- */ .b-cubie-head-logo-icon-image { display: inline-block; max-width:100%; min-width:32px; max-height: 100%; vertical-align: middle; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; overflow:hidden; } .b-cubie-head-logo-icon-group { position: absolute; display: inline-block; bottom: -1px; right: -3px; width:15px; height: 15px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; overflow:hidden; } .lt .b-cubie-head-logo-icon-group {background: #bbb; box-shadow: 0 0 1px 0 rgba(0,0,0,0.7)} .dt .b-cubie-head-logo-icon-group {background:#bbb; box-shadow: 0 0 1px 0 rgba(255,255,255,0.7)} .b-cubie-head-logo-title { display: inline-block; max-width: 120px; vertical-align: middle; overflow: hidden; } .b-cubie-head-logo-title-text { display: block; margin-top: -2px; line-height: 20px; font-size: 16px; font-weight: bold; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .lt .b-cubie-head-logo-title-text {color:rgba(0,0,0,1);} .dt .b-cubie-head-logo-title-text {color:rgba(255,255,255,1);} .b-cubie-head-logo-group-text { display: block; font-size:11px; line-height:14px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .b-cubie-head-logo-group-arrow { display: inline-block; vertical-align: top; height: 15px; width: 12px; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transition: -webkit-transform 150ms; transition: transform 150ms ease; } .b-bt-click .b-cubie-head-logo-group-arrow { -webkit-transform: rotate(0deg); transform: rotate(0deg); } /* ------------------->>> Head Search Button <<<-------------------- */ .b-head-search {width:100%;} /* .b-head-search-bx { display:block; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .lt .b-head-search-bx {background-color: rgba(0,0,0,0.07);} .dt .b-head-search-bx {background-color: rgba(255,255,255,0.15);} .b-head-search-badge { float: left; height: 16px; margin: 4px 0 4px 4px; padding: 4px 0 4px 8px; font-size: 11px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; cursor: default; } .lt .b-head-search-badge {background-color: rgba(255,255,255,0.85);} .dt .b-head-search-badge {background-color: rgba(0,0,0,0.35);} .b-head-search-badge-text { display: inline-block; color: rgba(255,255,255,.5); vertical-align: top; line-height:14px; } .lt .b-head-search-badge-text {color: rgba(0,0,0,0.5);} .dt .b-head-search-badge-text {color: rgba(255,255,255,0.5);} .b-head-search-badge-close-bt { display: inline-block; height: 100%; padding: 0 8px 4px 5px; vertical-align: top; font-size: 13px; line-height: 14px; font-family: arial; } .lt .b-head-search-badge-close-bt,.dt .b-head-search-badge-close-bt {background-color: transparent;} .lt .b-head-search-badge-close-bt:hover,.dt .b-head-search-badge-close-bt:hover {background-color: transparent;} .b-head-search-input-bx { display: block; height: 32px; white-space: nowrap; overflow: hidden; } */ .b-head-search-input { width:100%; height: 32px; padding: 6px 40px 6px 12px; font-size: 13px; text-align: left; cursor: text; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .lt .b-head-search-input {color:rgba(0,0,0,1);} .dt .b-head-search-input {color:rgba(255,255,255,1);} .b-bt-back+.b-head-search-input {padding-left:40px;} .b-cubie-head-file-menu-bt {} .b-cubie-head-file-menu-bt .b-bt-link {padding: 6px;} /* ----------------->>> File Menu Group Button <<<------------------ */ .b-fileMenuAddBt { display: block; float: none; margin: 6px 0; padding: 0; } .b-fileMenuAddBt>.b-bt-link {} .b-file-menu-group-bt-image { float: left; height: 32px; width: 32px; margin-right: 6px; -webkit-border-radius: 32px; -moz-border-radius:32px; border-radius:32px; } .b-fileMenuGroupBt>.b-bt-link>.b-bt-text {font-size: 14px;font-weight: bold;} .b-fileMenuGroupBt>.b-bt-drop:after {position:absolute;right:0;margin:7px 10px;} .b-fileMenuGroupBt .b-bt-list-vertical {min-width:100%;} /* ----------------->>> Page Menu Buttons <<<------------------ */ .b-wig-page-menu-bts {width:100%;padding:0 0 8px 0;} .b-wig-page-menu-bts .b-bt-item { float:left; width:100%; padding:0; border-bottom: solid; border-bottom-width: 1px; border-bottom-color: transparent; } .lt .b-wig-page-menu-bts .b-bt-item { border-bottom-color: rgba(0,0,0,0.1)} .dt .b-wig-page-menu-bts .b-bt-item { border-bottom-color: rgba(255,255,255,0.1)} .b-wig-page-menu-bts .b-bt-link { height: 50px; padding: 15px 15px 15px 20px; text-align: left; background-color: transparent; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* -------------------------------------------->>> Icons <<<---------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* folder icon */ .b-folder-icon { display: inline-block; height:100%; width:auto; vertical-align: middle; fill: #009ce2; } .b-wig-head-img .b-folder-icon { margin: 0 0 0 -4px; } /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* ------------------------------------------->>> Formatting <<<------------------------------------------ */ /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* Outline */ .b-outline {} .lt .b-outline { -webkit-box-shadow: 0 0 0 1px rgba(0,0,0,0.04); -moz-box-shadow: 0 0 0 1px rgba(0,0,0,0.04); box-shadow: 0 0 0 1px rgba(0,0,0,0.04); } .dt .b-outline { -webkit-box-shadow: 0 0 0 1px rgba(255,255,255,0.1); -moz-box-shadow: 0 0 0 1px rgba(255,255,255,0.1); box-shadow: 0 0 0 1px rgba(255,255,255,0.1); } /* Underline */ .lt .b-underline {border-bottom:solid 1px rgba(0,0,0,0.085);} .dt .b-underline {border-bottom:solid 1px rgba(255,255,255,0.085);} /* Shadow */ .b-shadow-xs {} .lt .b-shadow-xs { -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1); -moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1); box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1); } .dt .b-shadow-xs { -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.2); -moz-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.2); box-shadow: 0 1px 1px 0 rgba(0,0,0,0.2); } .b-shadow-s {} .lt .b-shadow-s { -webkit-box-shadow: 0 0 6px rgba(0,0,0,0.1); -moz-box-shadow: 0 0 6px rgba(0,0,0,0.1); box-shadow: 0 0 6px rgba(0,0,0,0.1); } .dt .b-shadow-s { -webkit-box-shadow: 0 0 6px rgba(0,0,0,0.2); -moz-box-shadow: 0 0 6px rgba(0,0,0,0.2); box-shadow: 0 0 6px rgba(0,0,0,0.2); } .b-shadow-m {} .lt .b-shadow-m { -webkit-box-shadow: 0 0 12px rgba(0,0,0,0.2); -moz-box-shadow: 0 0 12px rgba(0,0,0,0.2); box-shadow: 0 0 12px rgba(0,0,0,0.2); } .dt .b-shadow-m { -webkit-box-shadow: 0 0 12px rgba(0,0,0,0.5); -moz-box-shadow: 0 0 12px rgba(0,0,0,0.5); box-shadow: 0 0 12px rgba(0,0,0,0.5); } .b-shadow-l {} .lt .b-shadow-l { -webkit-box-shadow: 0 0 24px rgba(0,0,0,0.2); -moz-box-shadow: 0 0 24px rgba(0,0,0,0.2); box-shadow: 0 0 24px rgba(0,0,0,0.2); } .dt .b-shadow-l { -webkit-box-shadow: 0 0 24px rgba(0,0,0,0.5); -moz-box-shadow: 0 0 24px rgba(0,0,0,0.5); box-shadow: 0 0 24px rgba(0,0,0,0.5); } .b-shadow-xl {} .lt .b-shadow-xl { -webkit-box-shadow: 0 0 48px rgba(0,0,0,0.2); -moz-box-shadow: 0 0 48px rgba(0,0,0,0.2); box-shadow: 0 0 48px rgba(0,0,0,0.2); } .dt .b-shadow-xl { -webkit-box-shadow: 0 0 48px rgba(0,0,0,0.5); -moz-box-shadow: 0 0 48px rgba(0,0,0,0.5); box-shadow: 0 0 48px rgba(0,0,0,0.5); } /* Border */ .b-border-f,.b-border-t,.b-border-r,.b-border-b,.b-border-l {border-style:solid;border-width:0;border-color:transparent;} .b-border-f {border-width: 1px;} .b-border-t {border-top-width: 1px;} .b-border-r {border-right-width: 1px;} .b-border-b {border-bottom-width: 1px;} .b-border-l {border-left-width: 1px;} /* Round */ .b-radius-xs {-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;} .b-radius-s {-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;} .b-radius-m {-webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px;} .b-radius-l {-webkit-border-radius: 12px;-moz-border-radius: 12px;border-radius: 12px;} .b-radius-xl {-webkit-border-radius: 18px;-moz-border-radius: 18px;border-radius: 18px;} .b-radius-c {-webkit-border-radius: 999px;-moz-border-radius: 999px;border-radius: 999px;} /* Button Size */ .b-bt-xs {padding:0;} .b-bt-xs>.b-bt-link,.b-bt-xs>.b-bt-no-link { padding:2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .b-bt-s {padding:2px;} .b-bt-s>.b-bt-link,.b-bt-s>.b-bt-no-link { padding:4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .b-bt-m {padding:4px;} .b-bt-m>.b-bt-link,.b-bt-m>.b-bt-no-link { padding:6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .b-bt-l {padding:6px;} .b-bt-l>.b-bt-link,.b-bt-l>.b-bt-no-link { padding:8px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; } .b-bt-xl {padding:8px;} .b-bt-xl>.b-bt-link,.b-bt-xl>.b-bt-no-link { padding:12px; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; } .b-bt-xxl {padding:12px;} .b-bt-xxl>.b-bt-link,.b-bt-xxl>.b-bt-no-link { padding:18px; -webkit-border-radius: 18px; -moz-border-radius: 18px; border-radius: 18px; } /* Gutters */ .b-gut-xs,.b-gut-xs-t,.b-gut-xs-r,.b-gut-xs-b,.b-gut-xs-l,.b-gut-xs-tb,.b-gut-xs-rl,.b-gut-xs-trb,.b-gut-xs-rbl,.b-gut-xs-tbl,.b-gut-xs-trl, .b-gut-s,.b-gut-s-t,.b-gut-s-r,.b-gut-s-b,.b-gut-s-l,.b-gut-s-tb,.b-gut-s-rl,.b-gut-s-trb,.b-gut-s-rbl,.b-gut-s-tbl,.b-gut-s-trl, .b-gut-m,.b-gut-m-t,.b-gut-m-r,.b-gut-m-b,.b-gut-m-l,.b-gut-m-tb,.b-gut-m-rl,.b-gut-m-trb,.b-gut-m-rbl,.b-gut-m-tbl,.b-gut-m-trl, .b-gut-l,.b-gut-l-t,.b-gut-l-r,.b-gut-l-b,.b-gut-l-l,.b-gut-l-tb,.b-gut-l-rl,.b-gut-l-trb,.b-gut-l-rbl,.b-gut-l-tbl,.b-gut-l-trl, .b-gut-xl,.b-gut-xl-t,.b-gut-xl-r,.b-gut-xl-b,.b-gut-xl-l,.b-gut-xl-tb,.b-gut-xl-rl,.b-gut-xl-trb,.b-gut-xl-rbl,.b-gut-xl-tbl,.b-gut-xl-trl {border-style:solid;border-width:0;border-color:transparent;} .b-gut-xs {border-width:2px;} .b-gut-xs-t {border-top-width:2px} .b-gut-xs-r {border-right-width:2px} .b-gut-xs-b {border-bottom-width:2px} .b-gut-xs-l {border-left-width:2px} .b-gut-xs-tb {border-top-width:2px;border-bottom-width:2px} .b-gut-xs-rl {border-right-width:2px;border-left-width:2px} .b-gut-xs-trb {border-top-width:2px;border-right-width:2px;border-bottom-width:2px} .b-gut-xs-rbl {border-right-width:2px;border-bottom-width:2px;border-left-width:2px} .b-gut-xs-tbl {border-top-width:2px;border-bottom-width:2px;border-left-width:2px} .b-gut-xs-trl {border-top-width:2px;border-right-width:2px;border-left-width:2px} .b-gut-s {border-width:6px;} .b-gut-s-t {border-top-width:6px} .b-gut-s-r {border-right-width:6px} .b-gut-s-b {border-bottom-width:6px} .b-gut-s-l {border-left-width:6px} .b-gut-s-tb {border-top-width:6px;border-bottom-width:6px} .b-gut-s-rl {border-right-width:6px;border-left-width:6px} .b-gut-s-trb {border-top-width:6px;border-right-width:6px;border-bottom-width:6px} .b-gut-s-rbl {border-right-width:6px;border-bottom-width:6px;border-left-width:6px} .b-gut-s-tbl {border-top-width:6px;border-bottom-width:6px;border-left-width:6px} .b-gut-s-trl {border-top-width:6px;border-right-width:6px;border-left-width:6px} .b-gut-m {border-width:12px;} .b-gut-m-t {border-top-width:12px} .b-gut-m-r {border-right-width:12px} .b-gut-m-b {border-bottom-width:12px} .b-gut-m-l {border-left-width:12px} .b-gut-m-tb {border-top-width:12px;border-bottom-width:12px} .b-gut-m-rl {border-right-width:12px;border-left-width:12px} .b-gut-m-trb {border-top-width:12px;border-right-width:12px;border-bottom-width:12px} .b-gut-m-rbl {border-right-width:12px;border-bottom-width:12px;border-left-width:12px} .b-gut-m-tbl {border-top-width:12px;border-bottom-width:12px;border-left-width:12px} .b-gut-m-trl {border-top-width:12px;border-right-width:12px;border-left-width:12px} .b-gut-l {border-width:24px;} .b-gut-l-t {border-top-width:24px} .b-gut-l-r {border-right-width:24px} .b-gut-l-b {border-bottom-width:24px} .b-gut-l-l {border-left-width:24px} .b-gut-l-tb {border-top-width:24px;border-bottom-width:24px} .b-gut-l-rl {border-right-width:24px;border-left-width:24px} .b-gut-l-trb {border-top-width:24px;border-right-width:24px;border-bottom-width:24px} .b-gut-l-rbl {border-right-width:24px;border-bottom-width:24px;border-left-width:24px} .b-gut-l-tbl {border-top-width:24px;border-bottom-width:24px;border-left-width:24px} .b-gut-l-trl {border-top-width:24px;border-right-width:24px;border-left-width:24px} .b-gut-xl {border-width:48px;} .b-gut-xl-t {border-top-width:48px} .b-gut-xl-r {border-right-width:48px} .b-gut-xl-b {border-bottom-width:48px} .b-gut-xl-l {border-left-width:48px} .b-gut-xl-tb {border-top-width:48px;border-bottom-width:48px} .b-gut-xl-rl {border-right-width:48px;border-left-width:48px} .b-gut-xl-trb {border-top-width:48px;border-right-width:48px;border-bottom-width:48px} .b-gut-xl-rbl {border-right-width:48px;border-bottom-width:48px;border-left-width:48px} .b-gut-xl-tbl {border-top-width:48px;border-bottom-width:48px;border-left-width:48px} .b-gut-xl-trl {border-top-width:48px;border-right-width:48px;border-left-width:48px} /* Margin */ .b-mar-xs {margin:2px;} .b-mar-xs-t {margin-top:2px} .b-mar-xs-r {margin-right:2px} .b-mar-xs-b {margin-bottom:2px} .b-mar-xs-l {margin-left:2px} .b-mar-xs-tb {margin-top:2px;margin-bottom:2px} .b-mar-xs-rl {margin-right:2px;margin-left:2px} .b-mar-xs-trb {margin-top:2px;margin-right:2px;margin-bottom:2px} .b-mar-xs-rbl {margin-right:2px;margin-bottom:2px;margin-left:2px} .b-mar-xs-tbl {margin-top:2px;margin-bottom:2px;margin-left:2px} .b-mar-xs-trl {margin-top:2px;margin-right:2px;margin-left:2px} .b-mar-s {margin:4px;} .b-mar-s-t {margin-top:4px} .b-mar-s-r {margin-right:4px} .b-mar-s-b {margin-bottom:4px} .b-mar-s-l {margin-left:4px} .b-mar-s-tb {margin-top:4px;margin-bottom:4px} .b-mar-s-rl {margin-right:4px;margin-left:4px} .b-mar-s-trb {margin-top:4px;margin-right:4px;margin-bottom:4px} .b-mar-s-rbl {margin-right:4px;margin-bottom:4px;margin-left:4px} .b-mar-s-tbl {margin-top:4px;margin-bottom:4px;margin-left:4px} .b-mar-s-trl {margin-top:4px;margin-right:4px;margin-left:4px} .b-mar-m {margin:6px;} .b-mar-m-t {margin-top:6px} .b-mar-m-r {margin-right:6px} .b-mar-m-b {margin-bottom:6px} .b-mar-m-l {margin-left:6px} .b-mar-m-tb {margin-top:6px;margin-bottom:6px} .b-mar-m-rl {margin-right:6px;margin-left:6px} .b-mar-m-trb {margin-top:6px;margin-right:6px;margin-bottom:6px} .b-mar-m-rbl {margin-right:6px;margin-bottom:6px;margin-left:6px} .b-mar-m-tbl {margin-top:6px;margin-bottom:6px;margin-left:6px} .b-mar-m-trl {margin-top:6px;margin-right:6px;margin-left:6px} .b-mar-l {margin:12px;} .b-mar-l-t {margin-top:12px} .b-mar-l-r {margin-right:12px} .b-mar-l-b {margin-bottom:12px} .b-mar-l-l {margin-left:12px} .b-mar-l-tb {margin-top:12px;margin-bottom:12px} .b-mar-l-rl {margin-right:12px;margin-left:12px} .b-mar-l-trb {margin-top:12px;margin-right:12px;margin-bottom:12px} .b-mar-l-rbl {margin-right:12px;margin-bottom:12px;margin-left:12px} .b-mar-l-tbl {margin-top:12px;margin-bottom:12px;margin-left:12px} .b-mar-l-trl {margin-top:12px;margin-right:12px;margin-left:12px} .b-mar-xl {margin:18px;} .b-mar-xl-t {margin-top:18px} .b-mar-xl-r {margin-right:18px} .b-mar-xl-b {margin-bottom:18px} .b-mar-xl-l {margin-left:18px} .b-mar-xl-tb {margin-top:18px;margin-bottom:18px} .b-mar-xl-rl {margin-right:18px;margin-left:18px} .b-mar-xl-trb {margin-top:18px;margin-right:18px;margin-bottom:18px} .b-mar-xl-rbl {margin-right:18px;margin-bottom:18px;margin-left:18px} .b-mar-xl-tbl {margin-top:18px;margin-bottom:18px;margin-left:18px} .b-mar-xl-trl {margin-top:18px;margin-right:18px;margin-left:18px} .b-mar-xxl {margin:24px;} .b-mar-xxl-t {margin-top:24px} .b-mar-xxl-r {margin-right:24px} .b-mar-xxl-b {margin-bottom:24px} .b-mar-xxl-l {margin-left:24px} .b-mar-xxl-tb {margin-top:24px;margin-bottom:24px} .b-mar-xxl-rl {margin-right:24px;margin-left:24px} .b-mar-xxl-trb {margin-top:24px;margin-right:24px;margin-bottom:24px} .b-mar-xxl-rbl {margin-right:24px;margin-bottom:24px;margin-left:24px} .b-mar-xxl-tbl {margin-top:24px;margin-bottom:24px;margin-left:24px} .b-mar-xxl-trl {margin-top:24px;margin-right:24px;margin-left:24px} .b-mar-xxxl {margin:30px;} .b-mar-xxxl-t {margin-top:30px} .b-mar-xxxl-r {margin-right:30px} .b-mar-xxxl-b {margin-bottom:30px} .b-mar-xxxl-l {margin-left:30px} .b-mar-xxxl-tb {margin-top:30px;margin-bottom:30px} .b-mar-xxxl-rl {margin-right:30px;margin-left:30px} .b-mar-xxxl-trb {margin-top:30px;margin-right:30px;margin-bottom:30px} .b-mar-xxxl-rbl {margin-right:30px;margin-bottom:30px;margin-left:30px} .b-mar-xxxl-tbl {margin-top:30px;margin-bottom:30px;margin-left:30px} .b-mar-xxxl-trl {margin-top:30px;margin-right:30px;margin-left:30px} /* Padding */ .b-pad-xs {padding:2px;} .b-pad-xs-t {padding-top:2px} .b-pad-xs-r {padding-right:2px} .b-pad-xs-b {padding-bottom:2px} .b-pad-xs-l {padding-left:2px} .b-pad-xs-tb {padding-top:2px;padding-bottom:2px} .b-pad-xs-rl {padding-right:2px;padding-left:2px} .b-pad-xs-trb {padding-top:2px;padding-right:2px;padding-bottom:2px} .b-pad-xs-rbl {padding-right:2px;padding-bottom:2px;padding-left:2px} .b-pad-xs-tbl {padding-top:2px;padding-bottom:2px;padding-left:2px} .b-pad-xs-trl {padding-top:2px;padding-right:2px;padding-left:2px} .b-pad-s {padding:4px;} .b-pad-s-t {padding-top:4px} .b-pad-s-r {padding-right:4px} .b-pad-s-b {padding-bottom:4px} .b-pad-s-l {padding-left:4px} .b-pad-s-tb {padding-top:4px;padding-bottom:4px} .b-pad-s-rl {padding-right:4px;padding-left:4px} .b-pad-s-trb {padding-top:4px;padding-right:4px;padding-bottom:4px} .b-pad-s-rbl {padding-right:4px;padding-bottom:4px;padding-left:4px} .b-pad-s-tbl {padding-top:4px;padding-bottom:4px;padding-left:4px} .b-pad-s-trl {padding-top:4px;padding-right:4px;padding-left:4px} .b-pad-m {padding:6px;} .b-pad-m-t {padding-top:6px} .b-pad-m-r {padding-right:6px} .b-pad-m-b {padding-bottom:6px} .b-pad-m-l {padding-left:6px} .b-pad-m-tb {padding-top:6px;padding-bottom:6px} .b-pad-m-rl {padding-right:6px;padding-left:6px} .b-pad-m-trb {padding-top:6px;padding-right:6px;padding-bottom:6px} .b-pad-m-rbl {padding-right:6px;padding-bottom:6px;padding-left:6px} .b-pad-m-tbl {padding-top:6px;padding-bottom:6px;padding-left:6px} .b-pad-m-trl {padding-top:6px;padding-right:6px;padding-left:6px} .b-pad-l {padding:12px;} .b-pad-l-t {padding-top:12px} .b-pad-l-r {padding-right:12px} .b-pad-l-b {padding-bottom:12px} .b-pad-l-l {padding-left:12px} .b-pad-l-tb {padding-top:12px;padding-bottom:12px} .b-pad-l-rl {padding-right:12px;padding-left:12px} .b-pad-l-trb {padding-top:12px;padding-right:12px;padding-bottom:12px} .b-pad-l-rbl {padding-right:12px;padding-bottom:12px;padding-left:12px} .b-pad-l-tbl {padding-top:12px;padding-bottom:12px;padding-left:12px} .b-pad-l-trl {padding-top:12px;padding-right:12px;padding-left:12px} .b-pad-xl {padding:18px;} .b-pad-xl-t {padding-top:18px} .b-pad-xl-r {padding-right:18px} .b-pad-xl-b {padding-bottom:18px} .b-pad-xl-l {padding-left:18px} .b-pad-xl-tb {padding-top:18px;padding-bottom:18px} .b-pad-xl-rl {padding-right:18px;padding-left:18px} .b-pad-xl-trb {padding-top:18px;padding-right:18px;padding-bottom:18px} .b-pad-xl-rbl {padding-right:18px;padding-bottom:18px;padding-left:18px} .b-pad-xl-tbl {padding-top:18px;padding-bottom:18px;padding-left:18px} .b-pad-xl-trl {padding-top:18px;padding-right:18px;padding-left:18px} .b-pad-xxl {padding:24px;} .b-pad-xxl-t {padding-top:24px} .b-pad-xxl-r {padding-right:24px} .b-pad-xxl-b {padding-bottom:24px} .b-pad-xxl-l {padding-left:24px} .b-pad-xxl-tb {padding-top:24px;padding-bottom:24px} .b-pad-xxl-rl {padding-right:24px;padding-left:24px} .b-pad-xxl-trb {padding-top:24px;padding-right:24px;padding-bottom:24px} .b-pad-xxl-rbl {padding-right:24px;padding-bottom:24px;padding-left:24px} .b-pad-xxl-tbl {padding-top:24px;padding-bottom:24px;padding-left:24px} .b-pad-xxl-trl {padding-top:24px;padding-right:24px;padding-left:24px} .b-pad-xxxl {padding:30px;} .b-pad-xxxl-t {padding-top:30px} .b-pad-xxxl-r {padding-right:30px} .b-pad-xxxl-b {padding-bottom:30px} .b-pad-xxxl-l {padding-left:30px} .b-pad-xxxl-tb {padding-top:30px;padding-bottom:30px} .b-pad-xxxl-rl {padding-right:30px;padding-left:30px} .b-pad-xxxl-trb {padding-top:30px;padding-right:30px;padding-bottom:30px} .b-pad-xxxl-rbl {padding-right:30px;padding-bottom:30px;padding-left:30px} .b-pad-xxxl-tbl {padding-top:30px;padding-bottom:30px;padding-left:30px} .b-pad-xxxl-trl {padding-top:30px;padding-right:30px;padding-left:30px} /* Align */ .b-align-t {vertical-align: top} .b-align-r {text-align: right} .b-align-b {vertical-align: bottom} .b-align-l {text-align: left} .b-align-c {text-align: center} .b-align-m {vertical-align: middle} /* Overflow */ .b-overflow-x {display: block;width: 100%;overflow-x: auto;overflow-y:hidden;white-space: nowrap;} .b-overflow-y {height:100%;overflow-y: auto;overflow-x:hidden;} /* Add Dots */ .b-dots {display:block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;} /* Block Other */ .b-vert:before {content:"";display: inline-block;height:100%;margin:0 0 0 -4px;vertical-align: middle;} /* ------------------->>> Colors <<<-------------------- */ /* Trans */ .b-back-trans {background-color:transparent;} .b-text-trans {color:transparent;} .b-border-trans {border-color:transparent;} .b-border-trans-1 {} .lt .b-border-trans-1,.lt.b-border-trans-1 {border-color:rgba(0,0,0,0.25);} .dt .b-border-trans-1,.dt.b-border-trans-1 {border-color:rgba(255,255,255,0.25);} .b-border-trans-2 {} .lt .b-border-trans-2,.lt.b-border-trans-2 {border-color:rgba(0,0,0,0.5);} .dt .b-border-trans-2,.dt.b-border-trans-2 {border-color:rgba(255,255,255,0.5);} .b-border-trans-3 {} .lt .b-border-trans-3,.lt.b-border-trans-3 {border-color:rgba(0,0,0,0.75);} .dt .b-border-trans-3,.dt.b-border-trans-3 {border-color:rgba(255,255,255,0.75);} .b-border-trans-4 {} .lt .b-border-trans-4,.lt.b-border-trans-4 {border-color:rgba(0,0,0,1);} .dt .b-border-trans-4,.dt.b-border-trans-4 {border-color:rgba(255,255,255,1);} /* White */ .b-back-white {background-color:#fff;} .b-text-white {color:#fff;} .b-border-white {border-color:#fff;} .b-border-white-1 {border-color:rgba(255,255,255,0.25);} .b-border-white-2 {border-color:rgba(255,255,255,0.5);} .b-border-white-3 {border-color:rgba(255,255,255,0.75);} .b-border-white-4 {border-color:rgba(255,255,255,1);} /* Black */ .b-back-black {background-color:#000;} .b-text-black {color:#000;} .b-border-black {border-color:#000;} .b-border-black-1 {border-color:rgba(0,0,0,0.25);} .b-border-black-2 {border-color:rgba(0,0,0,0.5);} .b-border-black-3 {border-color:rgba(0,0,0,0.75);} .b-border-black-4 {border-color:rgba(0,0,0,1);} /* Grey */ .b-back-grey {background-color:rgb(136,136,136);} .b-text-grey {color:rgb(136,136,136);} .b-border-grey {border-color:rgb(136,136,136);} .b-border-grey-1 {border-color:rgba(136,136,136,0.25);} .b-border-grey-2 {border-color:rgba(136,136,136,0.5);} .b-border-grey-3 {border-color:rgba(136,136,136,0.75);} .b-border-grey-4 {border-color:rgba(136,136,136,1);} /* Red */ .b-back-red {background-color:#e63c3c;} .b-text-red {color:#e63c3c;} .b-border-red {border-color:#e63c3c;} /* Orange */ .b-back-orange {background-color:#fb944b;} .b-text-orange {color:#fb944b;} .b-border-orange {border-color:#fb944b;} /* Yellow */ .b-back-yellow {background-color:#ffb300;} .b-text-yellow {color:#ffb300;} .b-border-yellow {border-color:#ffb300;} /* Green */ .b-back-green {background-color:#0da055;} .b-text-green {color:#0da055;} .b-border-green {border-color:#0da055;} /* Blue */ .b-back-blue {background-color:#0075e1;} .b-text-blue {color:#0075e1;} .b-border-blue {border-color:#0075e1;} /* Gradient Blue */ .b-back-gradient-blue {background: linear-gradient(to right, #3cbced 0%, #0075e1 100%);} .b-text-gradient-blue {background-image: linear-gradient(to right, #3cbced 0%, #0075e1 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;color: transparent;} /* Burple */ .b-back-burple {background-color:#3d81ef;} .b-text-burple {color:#3d81ef;} .b-border-burple {border-color:#3d81ef;} /* Purple */ .b-back-purple {background-color:#bd34d7;} .b-text-purple {color:#bd34d7;} .b-border-purple {border-color:#bd34d7;} /* Pink */ .b-back-pink {background-color:#f93262;} .b-text-pink {color:#f93262;} .b-border-pink {border-color:#f93262;} /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* ----------------------------------------->>> Animations <<<-------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* scale up */ .scaleUp { -webkit-animation: scaleUp .6s ease both; -moz-animation: scaleUp .6s ease both; animation: scaleUp .6s ease both; } @-webkit-keyframes scaleUp { from { opacity: 0; -webkit-transform: scale(.8); } } @-moz-keyframes scaleUp { from { opacity: 0; -moz-transform: scale(.8); } } @keyframes scaleUp { from { opacity: 0; transform: scale(.8); } } /* scale down */ .scaleDown { -webkit-animation: scaleDown .6s ease both; -moz-animation: scaleDown .6s ease both; animation: scaleDown .6s ease both; } @-webkit-keyframes scaleDown { from { } to { opacity: 0; -webkit-transform: scale(.8); } } @-moz-keyframes scaleDown { from { } to { opacity: 0; -moz-transform: transform: scale(.8); } } @keyframes scaleDown { from { } to { opacity: 0; transform: scale(.8); } } /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* -------------------------------------------->>> Other <<<---------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ /* --------------------------------------------------------------------------------------------------------- */ .b-middleCenterLeftBackBt {padding:4px 0 4px 4px;} .b-middleCenterLeftBackBt .b-bt-link {padding:6px;} .b-page-refresh-bt .b-bt-link {padding:6px;} .hiddenFolder, .hiddenOrders {display: none;} .tempFolder {opacity: .2;} .trackingTravelTimeContainer {display:inline-block;} .lt .b-wig-table-theme2 .delivered .b-wig-table-item-bx {border: solid 1px rgba(0,190,0,0.5);} .b-wig-table-theme3 .delivered:first-child .b-wig-table-item-bx {-webkit-border-radius: 10px 10px 0 0;-moz-border-radius: 10px 10px 0 0;border-radius: 10px 10px 0 0;} .delivered:last-child {margin-bottom:12px;} .ui-resizable-resizing { -webkit-transition: none; -moz-transition: none; -o-transition: none; transition: none; } .sticky {} .closeBtn {background: #fff;border-radius: 99px;padding: 6px;} .dt .closeBtn {background:rgba(44,44,44,1);}