/* override modern look */

body, .ObjButton, .DialogButton, .EmbeddedEditRelationshipBtmActions .PageButton, .Button, input, textarea, strong, nav, H1, H2, H3, H4, H5, .Line label, .Line .Label, .TPTab span {
     text-rendering:optimizeLegibility;
     -webkit-font-smoothing: antialiased;
}
 .QueryAttrVal {
	display:inline;
}
 .Wrapper {
     padding:0;
}
 .BottomBatchNav {
 	padding:1rem;
     width:100%;
}
 .Line, .LineInner {
     border: none;
     background-image: none;
     background-color: transparent;
}


 /* d2w page names do not look great and are sorta old school - users know where they are */
.PageHeader {
     display: none;
}
 .BtmActions {
     margin:0;
     padding:0;
     overflow: auto;
}
 
 .OddObjRow td.AttrColumn {
     background-color:transparent;
}



 /* decide if you like the float and inline or not */

 .Line .LabelWrapper {
	 float: none;
	 width:auto;
     display:inline;
     padding:0;
     margin:0;
}
 .AttrVal {
     margin-bottom:1rem;
     padding: 0;
}



 .ERAttachmentFlexibleEditor .AEEdit {
     width:100%;
     border:none;
     -webkit-box-shadow:none;
     -moz-box-shadow:none;
     box-shadow:none;
}
 .ErrorLabel{
     color: #c4183c !important;
}
 .ErrorLine .AttrVal input,.ErrorLine .AttrVal textarea {
     border: 1px solid #c4183c;
     transition: all 300ms ease 0s;
}
 .ListWrapper .AttrColumn {
     vertical-align: text-top;
}
 li {
     list-style: none;
     display:inline;
}
 .ErrBlock li {
     list-style: none;
}
 .ErrorLine .AttrVal span {
     border: none;
     width:100%;
}
 .ERMDEmptyList {
     background:none;
     border:none;
}

 /* d2w shows a weird widget to see and set fetch limits and batch sizes which is old school */
 .BatchSize {
     display:none;
}
 .ERMDBatchSize_BatchValue {
     border: none;
     background-color:transparent;
}
 /* d2w reports editing context being dirty which is old school - users know if they edited */
 .Line label abbr {
     visibility:hidden;
}
 .ChangesMarker img {
     width:0;
     height:0;
}

 /* get the busy indicator looking normal */
 .GlobalBusyIndicator {
     margin: auto;
     width: 10%;
     padding: 10px;
}
 .GlobalBusyIndicator img {
     float:right;
     width:20px;
     height: auto;
}

  /* alerts have a bottom margin you have to take off...sigh. */
 
 .alert ul {
 	-webkit-margin-before: 0;
 	-webkit-margin-after: 0;
 	-webkit-padding-start: 0;
 }
 
 /* Remove old and ugly UI elements */
.ERXJSFlyOver,.ChangesMarker,.ERDPrinterButton {
     display: none;
}

 /* Reduce padding just a bit for lists that are embedded */
.EmbeddedListWrapper .card-body,.Embeddedcard-body  {
	padding:0.5rem;
}


 /* end modern look overrides */



@keyframes bouncing {
  from, 20%, 53%, 80%, to {
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    transform: translate3d(0, -11px, 0);
  }

  70% {
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    transform: translate3d(0, 11, 0);
  }

  90% {
    transform: translate3d(0,0,0);
  }
}

@keyframes shaking {
  10%, 90% {
    transform: translate3d(-2px, 0, 0);
  }
  
  20%, 80% {
    transform: translate3d(4px, 0, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(-8px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(8px, 0, 0);
  }
}

.bounce {
  animation-duration: 0.68s;
  animation-name: bouncing;
  animation-iteration-count: 1;
}

.alert, .ErrorLine {
  animation-duration: 0.48s;
  animation-name: shaking;
  animation-iteration-count: 1;
}




 /* a few app level defaults modern look */
 
__.dropdown-menu>.dropdown-item:hover {
    border-color:#eee;
	border-style:solid;
    border-left-width:10px;
}
__.dropdown-menu>.dropdown-item {
    border-color:transparent;
    border-style:solid;
    border-left-width:10px;
}

 
 .Line, .Attributes, .AttrVal {
     font-weight: 100;
}
 
  /* not sure why this isn't there, maybe also should be in rules, but all other inputs have margin? */
 
 .page-contents textarea {
 	padding:0.65rem;
 }

  /* query all page isn't really supported so we'll hack a few quick things to make it tolerable */
.QueryAllActions {
	float:right;
	padding-right:1rem;
	padding-bottom:1rem;
}
.QueryAllQuery {
	padding-right:1rem;
	float:none;
	width:auto;
}
.QueryAllQuery input {
	padding: .75rem 1rem;
	font-size: 1.25rem;
	line-height: 1.5;
	border-radius: .5rem;
	width:100%;
}

 /* seems we should NOT use a card here but rather a shadow class these should be in rules */

 .CreateWrapper .page-contents, .EditWrapper .page-contents, .Section .page-contents,.QueryWrapper .card {
     width:80%;
     max-width: 680px;
     margin: 3rem auto 3rem;
}


 .QueryAllWrapper .card {
     width:70%;
     max-width: 1100px;
     margin: 2rem auto 2rem;
}

 /* Ensure tabs are bold when active. */

 .CreateBanner li.active   {
     font-weight: 800;
     transition: all 300ms ease 0s;
}

 /* This rule removes the corner border in fullscreen inspect tab cards */
 .InspectWrapper .page-contents .card-header:first-child { 
	border-radius:0;
}



 /* validation */
 input[type=url]:invalid {
     border-color: #C33;
     box-shadow: inset 0 0.0625em 0.125em rgba(0,0,0,.2), 0 0 0.125em rgba(203,0,2,.8);
}


 /* This rule removes the margins on the on/off control for editing booleans and should be done another way */
 .custom-control {
     padding:0;
     margin:0;
     margin-top:-1rem;
     padding-bottom:1.5rem;
     padding-left:.25rem;
}




 /* last sizing padding and clipping of wrappers for small screens */
 @media screen and (max-width: 768px) {
     .CreateWrapper .page-contents,.QueryAllWrapper .card, .QueryWrapper .card ,.EditWrapper .page-contents ,.Section .page-contents,.Wrapper .page-contents {
         margin: 0 auto 0;
         width:100%;
         max-width: 100%;
         box-shadow: none;
         border: none;
         border-radius:0;
    }
     .Wrapper {
         padding:0;
    }
}