div+css实现响应式自适应右下角聊天窗口效果代码
代码语言:html
所属分类:响应式
代码描述:div+css实现响应式自适应右下角聊天窗口效果代码
代码标签: div css 响应式 自适应 右下角 聊天 窗口
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
#info {
font-size: 20px;
}
#div_start {
float: right;
}
#headline {
text-decoration: none;
}
#results {
font-size: 14px;
font-weight: bold;
border: 1px solid #ddd;
padding: 15px;
text-align: left;
min-height: 150px;
}
#start_button {
border: 0;
background-color: transparent;
padding: 0;
width: 30px !important;
height: 30px !important;
}
#start_img {
width: 30px !important;
height: 30px !important;
}
.interim {
color: gray;
}
.final {
color: black;
padding-right: 3px;
}
.button {
display: none;
}
.marquee {
margin: 20px auto;
}
#buttons {
margin: 10px 0;
position: relative;
top: -50px;
}
#copy {
margin-top: 20px;
}
#copy > div {
display: none;
margin: 0 70px;
}
.CarcodeWidgetResetContainer.MainContainer9e5 {
width: 100% !important;
height: 100% !important;
overflow: visible !important;
}
.CarcodeWidgetResetContainer.MainContainer--fixed65s {
max-height: 100vh !important;
width: 100% !important;
height: calc(100% - 10px) !important;
}
@media (min-width: 480px) {
.CarcodeWidgetResetContainer.MainContainer--fixed65s {
width: 320px !important;
height: 520px !important;
}
}
@media (min-width: 1200px) {
.CarcodeWidgetResetContainer.MainContainer--fixed65s {
height: 550px !important;
}
}
@media (min-width: 1800px) {
.CarcodeWidgetResetContainer.MainContainer--fixed65s {
height: 620px !important;
}
}
.CarcodeWidgetResetContainer .VideoChatContainer-local2HJ {
width: 20% !important;
}
@media (min-width: 1200px) {
.CarcodeWidgetResetContainer .VideoChatContainer-local2HJ {
width: 240px !important;
}
}
.CarcodeWidgetResetContainer .PrivacyStatement--link254:hover {
opacity: 0.8 !important;
}
.Form__fields198 > :not(:last-child) {
margin-bottom: 8px !important;
}
.CarcodeWidgetResetContainer .InputActionButton1OE {
padding: 8px 12px !important;
transition: background-color 0.15s linear !important;
}
.CarcodeWidgetResetContainer .InputActionButton--roundedeeR {
padding: 6px !important;
}
.CarcodeWidgetResetContainer .InputActionButton1OE svg {
display: block !important;
width: 16px !important;
height: 16px !important;
}
.CarcodeWidgetResetContainer .BaseInput__container2fc {
transition: border 0.15s linear !important;
}
.CarcodeWidgetResetContainer .BaseInput-input2pX {
padding: 0 16px !important;
font-size: 14px !important;
}
.CarcodeWidgetResetContainer .BaseInput-input2pX,
.CarcodeWidgetResetContainer .BaseInput-input2pX:focus {
background-color: transparent !important;
}
@media (max-width: 480px) {
.CarcodeWidgetResetContainer .BaseInput-input2pX,
.CarcodeWidgetResetContainer .BaseInput-input2pX:focus {
font-size: 16px !important;
}
}
.CarcodeWidgetResetContainer .BaseTextArea__container3xf {
transition: border 0.15s linear !important;
}
.CarcodeWidgetResetContainer .BaseTextArea-textarea3ri {
padding: 0 16px !important;
font-size: 14px !important;
}
.CarcodeWidgetResetContainer .BaseTextArea-textarea3ri,
.CarcodeWidgetResetContainer .BaseTextArea-textarea3ri:focus {
background-color: transparent !important;
}
@media (max-width: 480px) {
.CarcodeWidgetResetContainer .BaseTextArea-textarea3ri,
.CarcodeWidgetResetContainer .BaseTextArea-textarea3ri:focus {
font-size: 16px !important;
}
}
.CarcodeWidgetResetContainer .BaseTextArea-error1s7 {
max-height: 0 !important;
}
.CarcodeWidgetResetContainer .BaseTextArea-error--show2SP {
max-height: 150px !important;
}
.CarcodeWidgetResetContainer .Rating3cO :not(:last-child) {
margin-right: 4px !important;
}
.CannedMessageArk {
position: relative !important;
}
.CannedMessageArk:not(:last-child) {
margin-right: 10px !important;
}
.CarcodeWidgetResetContainer .CannedMessages--CHECKBOX1W7 {
display: inline-flex !important;
flex-direction: column !important;
}
.CarcodeWidgetResetContainer .CannedMessages__wrapper--CHECKBOX2zL {
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.DepartmentsSelector3vD > * {
flex: 1 1 100% !important;
}
.CloseButton1e5:hover {
transform: rotate(90deg) !important;
}
.FormHeader__titletIt > :first-child {
margin-right: 10px !important;
}
.CarcodeWidgetContainer .ThanksMessageImage1RQ {
animation: letter2Zm 1.8s ease-out !important;
}
@keyframes letter2Zm {
0% {
transform: translateX(-60%);
}
to {
transform: translateX(0);
}
}
.ModalActions3R_ > :not(:last-child) {
margin-right: 8px !important;
}
.CarcodeWidgetResetContainer .MainSmsContainer--fixed2q3 {
max-height: calc(100vh - 20px) !important;
}
@media (min-width: 480px) {
.CarcodeWidgetResetContainer .MainSmsContainer--fixed2q3 {
max-height: 520px !important;
}
}
@media (min-width: 1200px) {
.CarcodeWidgetResetContainer .MainSmsContainer--fixed2q3 {
max-height: 550px !important;
}
}
@media (min-width: 1800px) {
.CarcodeWidgetResetContainer .MainSmsContainer--fixed2q3 {
max-height: 620px !important;
}
}
.CarcodeWidgetResetContainer .ArrowButton1gi {
padding: 5px !important;
}
.CarcodeWidgetResetContainer .ArrowButton--collapsed6jl {
padding: 0 !important;
}
.CarcodeWidgetResetContainer .IconButton1lZ {
display: flex !important;
flex-direction: row !important;
align-items: stretch !important;
justify-content: stretch !important;
}
.CarcodeWidgetResetContainer .IconButton__content3J- {
flex-direction: row !important;
align-items: center !important;
justify-content: center !important;
padding: 10px 12px 10px 11px !important;
}
.CarcodeWidgetResetContainer .IconButton__separatorN80 {
border-width: 0 0 0 1px !important;
margin: 8px 0 !important;
}
.CarcodeWidgetResetContainer .IconButton__textMf_ {
padding: 0 0 0 8px !important;
}
.CarcodeWidgetResetContainer .IconButton--column37r {
display: flex !important;
flex-direction: column !important;
align-items: stretch !important;
justify-content: stretch !important;
}
.CarcodeWidgetResetContainer .IconButton--column37r .IconButton__content3J- {
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
padding: 10px !important;
}
.CarcodeWidgetResetContainer .IconButton--column37r .IconButton__separatorN80 {
border-width: 1px 0 0 !important;
margin: 0 8px !important;
}
.CarcodeWidgetResetContainer .IconButton--column37r .IconButton__textMf_ {
padding: 3px 0 0 !important;
}
.CarcodeWidgetResetContainer .HeaderX4y {
display: flex !important;
align-items: center !important;
flex: 0 0 auto !important;
flex-basis: 60px !important;
justify-content: space-between !important;
height: 60px !important;
}
.CarcodeWidgetResetContainer .Header--collapsed3a8 {
flex-basis: 40px !important;
height: 40px !important;
}
.CarcodeWidgetResetContainer .HeaderX4y > * {
flex: 0 0 auto !important;
}
.CarcodeWidgetResetContainer .HeaderX4y .js-carcode-end-chat-button-container {
position: absolute !important;
top: 17px !important;
right: 5px !important;
}
.CarcodeWidgetResetContainer
.HeaderX4y
.js-carcode-end-chat-button-container
button {
padding: 5px !important;
}
.CarcodeWidgetResetContainer .HeaderX4y .js-carcode-back-chat-button-container {
top: 17px !important;
left: 5px !important;
}
.CarcodeWidgetResetContainer
.HeaderX4y
.js-carcode-back-chat-button-container
button {
padding: 5px !important;
}
.CarcodeWidgetResetContainer
.HeaderX4y
.js-carcode-collapse-chat-button-container {
position: absolute !important;
top: 20px !important;
right: 30px !important;
}
.CarcodeWidgetResetContainer
.HeaderX4y
.js-carcode-collapse-chat-button-container
button {
padding: 5px !important;
}
.CarcodeWidgetResetContainer
.HeaderX4y
.js-carcode-video-chat-button-container {
position: absolute !important;
top: 15px !important;
right: 60px !important;
}
.CarcodeWidgetResetContainer
.HeaderX4y
.js-carcode-video-chat-button-container
button {
padding: 5px !important;
}
.SwipeIndicatoryLh i {
transition: transform 0.1s linear !important;
}
.SwipeIndicatoryLh svg {
display: block !important;
width: 20px !important;
height: 20px !important;
}
.SwipeIndicator--rotateI-N i {
transition: none !important;
animation: rotate3Io 1.1s infinite linear !important;
}
@keyframes rotate3Io {
0% {
transform: rotate(100deg);
}
to {
transform: rotate(460deg);
}
}
.Cardtnd p {
line-height: 20px !important;
}
.CardDescription1IV p {
line-height: 20px !important;
}
.CarcodeWidgetResetContainer .PiiForm2bL > :not(:last-child) {
margin-bottom: 16px !important;
}
.TradeIn2HE > :not(:last-child) {
margin-bottom: 8px !important;
}
.MessageText35b a {
color: #f47821 !important;
}
.CarcodeWidgetResetContainer .ImageAttachment__image1Dg {
opacity: 0.95 !important;
}
.CarcodeWidgetResetContainer .ImageAttachment__image1Dg:hover {
opacity: 1 !important;
}
.CarcodeWidgetResetContainer .ImageAttachment__image1Dg:not(.is-loaded1Ia) {
display: block !important;
width: 185px !important;
}
.CarcodeWidgetResetContainer .FileAttachmentniz {
text-align: center !important;
font-size: 12px !important;
}
.CarcodeWidgetResetContainer .FileAttachment__contenteUo {
text-decoration: none !important;
}
.CarcodeWidgetResetContainer .FileAttachment-titlesrv {
overflow: hidden !important;
width: 110px !important;
font-size: 14px !important;
}
.CarcodeWidgetResetContainer .FileAttachment-icon2zG svg {
width: 36px !important;
height: 36px !important;
}
.CarcodeWidgetResetContainer .FileAttachment-linkpri {
width: 100% !important;
text-decoration: none !important;
font-size: 12px !important;
}
.CarcodeWidgetContainer .VideoAttachment__video3BM {
opacity: 0.95 !important;
}
.CarcodeWidgetContainer .VideoAttachment__video3BM:hover {
opacity: 1 !important;
}
.CarcodeWidgetContainer .VideoAttachment__video3BM:not(.is-loaded1dF) {
display: block !important;
width: 185px !important;
}
.CarcodeWidgetContainer .VideoAttachment-icon18l {
fill: #fff !important;
}
.CarcodeWidgetContainer .VideoAttachment-icon18l svg {
width: 36px !important;
height: 36px !important;
}
.CarcodeWidgetResetContainer .Attachment--audioo6t,
.CarcodeWidgetResetContainer .Attachment--fileKKS {
box-sizing: border-box !important;
width: 130px !important;
padding: 10px !important;
max-width: 130px !important;
}
.CarcodeWidgetResetContainer .Attachment--image1Jx {
width: auto !important;
}
.CarcodeWidgetResetContainer .FullScreenAttachment__save-text3P5 {
display: none !important;
}
@media (min-width: 480px) {
.CarcodeWidgetResetContainer .FullScreenAttachment__save-text3P5 {
display: block !important;
margin-left: 10px !important;
}
}
.CarcodeWidgetContainer .MessageInfo2EJ > * {
font-size: 9px !important;
line-height: 13px !important;
}
.MessageActionsP4O > :not(:last-child) {
border-style: solid !important;
border-right-width: 1px !important;
}
.CarcodeWidgetResetContainer .Message1hI {
min-width: 80% !important;
max-width: 80% !important;
}
.CarcodeWidgetResetContainer .Message__message-info--hidden1FZ {
display: none !important;
}
.CarcodeWidgetResetContainer .Message__attachments3K0,
.CarcodeWidgetResetContainer .Message__inventoriesiEn {
border-radius: 12px !important;
overflow: hidden !important;
}
.CarcodeWidgetResetContainer .Message--inventory-cardsCTh {
max-width: 100% !important;
min-width: 100% !important;
}
.CarcodeWidgetResetContainer .Message--attachments1yI {
min-width: 0 !important;
}
.CarcodeWidgetResetContainer .Message__bubbleDxX {
border-radius: 12px !important;
}
.CarcodeWidgetResetContainer .Message__bubble--error37Z,
.CarcodeWidgetResetContainer .Message__bubble--greeting1Pa,
.CarcodeWidgetResetContainer .Message__bubble--pii-5r,
.CarcodeWidgetResetContainer .Message__bubble--reply3Y-,
.CarcodeWidgetResetContainer .Message__bubble--success3R6 {
border-radius: 12px 12px 12px 0 !important;
}
.CarcodeWidgetResetContainer .Message__bubble--message3QP {
border-radius: 12px 12px 0 12px !important;
}
.CarcodeWidgetResetContainer .Message__bubble--option3dq {
margin: 2px 0 !important;
border-radius: 12px !important;
cursor: pointer !important;
}
.CarcodeWidgetResetContainer .Message__bubbleDxX > :not(:last-child) {
margin-bottom: 4px !important;
}
.CarcodeWidgetResetContainer .Message--errorVir,
.CarcodeWidgetResetContainer .Message--greeting2tv,
.CarcodeWidgetResetContainer .Message--pii1qs,
.CarcodeWidgetResetContainer .Message--replynCn,
.CarcodeWidgetResetContainer .Message--success32I {
align-self: flex-start !important;
text-align: left !important;
}
.CarcodeWidgetResetContainer .Message--option2lL {
max-width: 90% !important;
min-width: 0 !important;
align-self: flex-end !important;
text-align: center !important;
}
.CarcodeWidgetResetContainer .Message--pii1qs {
max-width: 260px !important;
}
@media (max-width: 480px) {
.CarcodeWidgetResetContainer .Message--pii1qs {
max-width: 220px !important;
}
}
.CarcodeWidgetResetContainer .Message--messageEDW {
align-self: flex-end !important;
text-align: right !important;
}
.CarcodeWidgetResetContainer .Message__attachments3K0 {
padding: 6px !important;
}
.CarcodeWidgetResetContainer
.Message__attachments3K0
.message-attachment:not(:last-child) {
margin-bottom: 4px !important;
}
.CarcodeWidgetResetContainer .Message__text1cB {
display: inline-block !important;
position: relative !important;
}
.CarcodeWidgetResetContainer .pending {
margin-top: 4px !important;
opacity: 0.75 !important;
}
.TranscriptEmailNtH > :not(:last-child) {
margin-bottom: 16px !important;
}
.CarcodeWidgetResetContainer .LoadingIndicator2bl {
position: relative !important;
}
.CarcodeWidgetResetContainer .LoadingIndicator2bl,
.CarcodeWidgetResetContainer .LoadingIndicator2bl:after,
.CarcodeWidgetResetContainer .LoadingIndicator2bl:before {
display: inline-block !important;
width: 8px !important;
height: 8px !important;
animation-name: animationLoadingIndicator2kI !important;
animation-duration: 1.2s !important;
animation-timing-function: linear !important;
animation-iteration-count: infinite !important;
border-radius: 100% !important;
background-color: #999 !important;
}
.CarcodeWidgetResetContainer .LoadingIndicator2bl:before {
position: absolute !important;
top: 0 !important;
right: -18px !important;
content: "" !important;
animation-delay: 0.4s !important;
background-color: #bbb !important;
}
.CarcodeWidgetResetContainer .LoadingIndicator2bl:after {
position: absolute !important;
top: 0 !important;
left: -18px !important;
content: "" !important;
animation-delay: 0.8s !important;
background-color: #ddd !important;
}
@keyframes animationLoadingIndicator2kI {
0% {
background-color: #999;
}
to {
background-color: #ddd;
}
}
.CarcodeWidgetResetContainer .MessagesContainer1oF {
overflow-y: auto !important;
flex: 1 1 auto !important;
min-height: 150px !important;
}
.CarcodeWidgetResetContainer .MessagesContainer--loading1B- {
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.CarcodeWidgetResetContainer .ListBoxItem3Dy {
border: 1px solid transparent !important;
}
.CarcodeWidgetResetContainer .ListBoxItem3Dy:hover,
.CarcodeWidgetResetContainer .ListBoxItem3Dy[aria-selected="true"] {
background: #fffcf7 !important;
border-top: 1px solid #ccc !important;
border-bottom: 1px solid #ccc !important;
}
.CarcodeWidgetResetContainer .ListBoxItem3Dy:first-child:hover,
.CarcodeWidgetResetContainer .ListBoxItem3Dy:first-child[aria-selected="true"] {
border-top: 1px solid transparent !important;
}
.CarcodeWidgetResetContainer .ListBoxItem3Dy:last-child:hover,
.CarcodeWidgetResetContainer .ListBoxItem3Dy:last-child[aria-selected="true"] {
border-bottom: 1px solid transparent !important;
}
.CarcodeWidgetResetContainer .ListBox3iq {
max-height: 280px !important;
}
@media (max-height: 350px) {
.CarcodeWidgetResetContainer .ListBox3iq {
max-height: 34vh !important;
}
}
@media (min-height: 351px) and (max-width: 480px) {
.CarcodeWidgetResetContainer .ListBox3iq {
max-height: calc(100vh - 247px) !important;
}
}
.CarcodeWidgetResetContainer .ListBox3iq:empty:before {
content: "No items found" !important;
padding: 10px !important;
display: block !important;
text-align: center !important;
}
.CarcodeWidgetResetContainer .EmojisPopup2PV .js-carcode-list-box {
display: flex !important;
align-items: center !important;
justify-content: flex-start !important;
flex-wrap: wrap !important;
max-width: 210px !important;
}
.CarcodeWidgetResetContainer .EmojisPopup2PV .js-carcode-list-box li {
width: 42px !important;
border-radius: 8px !important;
}
.CarcodeWidgetResetContainer .EmojisPopup2PV .js-carcode-list-box li:hover {
border-color: transparent !important;
}
.CarcodeWidgetResetContainer .EmojisPopup__toggler3Ab {
display: block !important;
padding: 4px !important;
margin-left: 4px !important;
margin-right: -4px !important;
width: 26px !important;
height: 26px !important;
}
.CarcodeWidgetResetContainer
.EmojisPopup__toggler3Ab
.carcode-dropdown-toggle--icon {
display: none !important;
}
.CarcodeWidgetResetContainer
.EmojisPopup__toggler3Ab
.carcode-dropdown-toggle--icon-active {
display: none !important;
}
.CarcodeWidgetResetContainer
.EmojisPopup__toggler3Ab
.carcode-dropdown-toggle--icon-active
svg {
border-radius: 50% !important;
background-color: #ffc83d !important;
}
.CarcodeWidgetResetContainer
.EmojisPopup__toggler3Ab:focus
.carcode-dropdown-toggle--icon,
.CarcodeWidgetResetContainer
.EmojisPopup__toggler3Ab:hover
.carcode-dropdown-toggle--icon {
display: none !important;
}
.CarcodeWidgetResetContainer
.EmojisPopup__toggler3Ab:focus
.carcode-dropdown-toggle--icon-active,
.CarcodeWidgetResetContainer
.EmojisPopup__toggler3Ab:hover
.carcode-dropdown-toggle--icon-active {
display: block !important;
}
.CarcodeWidgetResetContainer .AttachmentButton3ke {
min-width: 17px !important;
max-width: 20px !important;
height: 20px !important;
padding: 18px !important;
}
.CarcodeWidgetResetContainer .AttachmentButton--collapsed3If {
min-width: 0 !important;
max-width: 0 !important;
height: 0 !important;
padding: 0 !important;
}
.CarcodeWidgetResetContainer .AttachmentButton-button6RR svg {
width: 17px !important;
height: 20px !important;
}
.CarcodeWidgetResetContainer .AttachmentActions2JM {
margin-left: 0 !important;
}
.CarcodeWidgetResetContainer .AttachmentActions--collapsed1aK {
margin-left: 8px !important;
}
.CarcodeWidgetResetContainer .ImageAttachmentPreview3vh {
background-color: #dae3e6 !important;
background-repeat: no-repeat !important;
background-position: 50% !important;
background-size: cover !important;
}
.CarcodeWidgetResetContainer .FileAttachmentPreviewg39 {
overflow: hidden !important;
}
.CarcodeWidgetResetContainer .FileAttachmentPreview-icon3AT {
fill: #555 !important;
}
.CarcodeWidgetResetContainer .FileAttachmentPreview-icon3AT svg {
width: 30px !important;
height: 30px !important;
}
.CarcodeWidgetResetContainer .VideoAttachmentPreview-icon246 {
fill: rgba(0, 0, 0, 0.4) !important;
}
.CarcodeWidgetResetContainer .VideoAttachmentPreview-icon246 svg {
width: 30px !important;
height: 30px !important;
}
.CarcodeWidgetResetContainer .AttachmentPreview__remove28R {
opacity: 0.8 !important;
}
.CarcodeWidgetResetContainer .AttachmentPreview__remove28R:active,
.CarcodeWidgetResetContainer .AttachmentPreview__remove28R:hover {
opacity: 1 !important;
}
.CarcodeWidgetResetContainer .HorizontalScrollV0v {
display: flex !important;
align-items: center !important;
justify-content: center !important;
flex-wrap: nowrap !important;
}
.CarcodeWidgetResetContainer .HorizontalScroll--scrollable2-t {
padding: 0 7px !important;
}
.CarcodeWidgetResetContainer
.HorizontalScrollV0v
.js-carcode-horizontal-scroll-content {
scroll-behavior: smooth !important;
overflow-x: scroll !important;
-ms-overflow-style: none !important;
scrollbar-width: none !important;
}
.CarcodeWidgetResetContainer
.HorizontalScrollV0v
.js-carcode-horizontal-scroll-content::-webkit-scrollbar {
display: none !important;
}
.CarcodeWidgetResetContainer .HorizontalScroll-button3ur {
padding: 6px !important;
font-size: 0 !important;
}
.CarcodeWidgetResetContainer .HorizontalScroll-button--left2pI {
transform: rotate(90deg) !important;
}
.CarcodeWidgetResetContainer .HorizontalScroll-button--rightoTv {
transform: rotate(-90deg) !important;
}
.ChatMenuItem-button2DI:disabled {
opacity: 0.5 !important;
}
.ChatMenuFull16q > :not(:last-child) {
border-right-width: 1px !important;
border-style: solid !important;
}
.CarcodeWidgetResetContainer .ChatMenu__collapsedURW,
.CarcodeWidgetResetContainer .ChatMenu__floatingByh,
.CarcodeWidgetResetContainer .ChatMenu__full1jY {
transition: all 0.15s linear !important;
}
.CarcodeWidgetResetContainer .ChatMenu__full1jY {
max-width: 100% !important;
transform: translateX(0) !important;
}
.CarcodeWidgetResetContainer .ChatMenu__full--collapsed1xI {
display: none !important;
transform: translateX(1000px) !important;
}
.CarcodeWidgetResetContainer .ChatMenu__collapsedURW {
transform: translateX(0) !important;
margin: auto !important;
}
.CarcodeWidgetResetContainer .ChatMenu__collapsed--collapsed2ko {
display: none !important;
transform: translateX(1000px) !important;
}
.CarcodeWidgetResetContainer .ChatMenu__floatingByh {
transform: translateX(0) !important;
padding: 0 10px !important;
margin-left: auto !important;
}
.CarcodeWidgetResetContainer .ChatMenu__floating--collapsed1xp {
display: none !important;
transform: translateX(1000px) !important;
}
.CarcodeWidgetResetContainer .IncomingCallModal__content3qh {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
padding: 20px 40px !important;
background: linear-gradient(180deg, #4568dc, #b06ab3) !important;
}
.CarcodeWidgetResetContainer .IncomingCallModal__content3qh img {
width: 240px !important;
height: 240px !important;
border-radius: 50% !important;
}
.CarcodeWidgetResetContainer .IncomingCallModal__content-name1Vb {
color: #fff !important;
margin: 16px 0 8px !important;
}
.CarcodeWidgetResetContainer .IncomingCallModal__content-callingeTL {
color: #fff !important;
margin: 0 !important;
}
.CarcodeWidgetResetContainer .IncomingCallModal__callerq6N {
display: flex !important;
align-items: center !important;
justify-content: center !important;
flex-direction: column !important;
}
.CarcodeWidgetResetContainer .IncomingCallModal__actions2ON {
display: flex !important;
align-items: center !important;
justify-content: center !important;
margin: 24px 0 0 !important;
}
.CarcodeWidgetResetContainer .IncomingCallModal__actions2ON button {
background: transparent !important;
border-radius: 50% !important;
}
.CarcodeWidgetResetContainer .IncomingCallModal__actions2ON button i {
font-size: 32px !important;
}
.CarcodeWidgetResetContainer
.IncomingCallModal__actions2ON
button:not(:last-child) {
margin-right: 16px !important;
}
.CarcodeWidgetResetContainer .IncomingCallModal__license2ZH {
position: absolute !important;
bottom: 10px !important;
font-size: 10px !important;
color: #fff !important;
}
.CarcodeWidgetResetContainer .IncomingCallModal__license-link3PA,
.CarcodeWidgetResetContainer .IncomingCallModal__license-link3PA:visited {
color: #fff !important;
font-size: 10px !important;
}
.CarcodeWidgetResetContainer .ChatNotification--warning2f8,
.CarcodeWidgetResetContainer .ChatNotification--warning2f8 p {
background-color: #fff3cd !important;
color: #856404 !important;
}
.CarcodeWidgetResetContainer .ChatNotification--error20g,
.CarcodeWidgetResetContainer .ChatNotification--error20g p {
background-color: #f8d7da !important;
color: #f33 !important;
}
.CarcodeWidgetResetContainer .ChatNotification--infoXHk,
.CarcodeWidgetResetContainer .ChatNotification--infoXHk p {
background-color: #d1ecf1 !important;
color: #0c5460 !important;
}
.CarcodeWidgetResetContainer .TabTitle2PI:nth-child(2n) {
border-left-width: 1px !important;
border-right-width: 1px !important;
}
.CarcodeWidgetResetContainer .TabTitle2PI:last-child {
border-right-width: 1px !important;
}
.FilterInputButton-iconvDC svg {
width: 21px !important;
height: 21px !important;
transform: scale(0.9) !important;
}
.SelectContainer3vS > h4 ~ div {
margin-bottom: 10px !important;
}
.CarcodeWidgetResetContainer .RadioButton5SL {
position: relative !important;
padding-left: 25px !important;
margin-right: 8px !important;
height: 20px !important;
font-size: 10px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
cursor: pointer !important;
}
.CarcodeWidgetResetContainer .RadioButton-checkmark2xX {
position: absolute !important;
top: 50% !important;
left: 0 !important;
display: block !important;
width: 18px !important;
height: 18px !important;
border: 4px solid #fff !important;
background-color: #fff !important;
border-radius: 50% !important;
transform: translateY(-50%) !important;
}
.CarcodeWidgetResetContainer .RadioButton-inputwzF {
width: 0 !important;
}
.LeaseDeals--option__active-9l:nth-of-type(n) {
background: #fffcf7 !important;
border: 1px solid #0069bf !important;
opacity: 1 !important;
}
.LeaseDeals--option__inactive2kX:nth-of-type(n) {
background-color: #fff !important;
border: 1px solid #e6e6e6 !important;
opacity: 0.5 !important;
}
.LeaseDeals--option1KS:hover {
border: 1px solid #0069bf !important;
}
.CarcodeWidgetResetContainer .InventorySearchHeaderContainer__tabs-header3IJ {
display: block !important;
height: 100% !important;
}
@media (max-width: 480px) {
.CarcodeWidgetResetContainer .InventorySearchHeaderContainer__tabs-header3IJ {
display: none !important;
}
}
.CarcodeWidgetResetContainer .InventorySearchHeaderContainer__common-header1yh {
display: none !important;
height: 100% !important;
}
@media (max-width: 480px) {
.CarcodeWidgetResetContainer
.InventorySearchHeaderContainer__common-header1yh {
display: block !important;
}
}
.SearchResultListp4s:empty {
display: none !important;
}
.SearchResultListp4s li {
margin-bottom: 8px !important;
}
.SearchFooterEnZ {
min-height: 16px !important;
}
.SearchFooterEnZ:empty {
min-height: 0 !important;
}
.CarcodeWidgetResetContainer .SearchContainer--empty3U9 {
display: flex !important;
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
height: 100% !important;
}
.CarcodeWidgetResetContainer.InventorySearchContainerYnU {
position: relative !important;
overflow: auto !important;
}
.CarcodeWidgetResetContainer.InventorySearchContainer--loading2Wr {
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.SelectContainer1UE > h4 ~ div {
margin-bottom: 10px !important;
}
.TradeInDetails__fields751 > :not(:last-child) {
margin-bottom: 10px !important;
}
.CarcodeWidgetResetContainer .ConditionPrice1mn {
color: #999 !important;
}
.CarcodeWidgetResetContainer .ConditionPrice__price29x {
margin-bottom: 10px !important;
font-size: 13px !important;
font-weight: 600 !important;
}
.CarcodeWidgetResetContainer .ConditionPrice__condition2Ww {
font-size: 13px !important;
}
.CarcodeWidgetResetContainer .ConditionPrice--selected3n7 {
color: #555 !important;
}
.CarcodeWidgetResetContainer
.ConditionPrice--selected3n7
.ConditionPrice__price29x {
font-size: 16px !important;
font-weight: 600 !important;
}
.CarcodeWidgetResetContainer
.ConditionPrice--selected3n7
.ConditionPrice__condition2Ww {
font-size: 15px !important;
font-weight: 600 !important;
}
.Conditions__prices3Fm > :not(:last-child) {
border-right: 1px solid #ccc !important;
}
.TradeInResult2bt {
justify-content: space-between !important;
}
.TradeInResult--loading2gH {
align-items: center !important;
justify-content: center !important;
}
.TradeInResult__contentsXX > :not(:last-child) {
margin-bottom: 15px !important;
}
.TradeInFormHeader39P sup {
vertical-align: top !important;
}
.CarcodeWidgetResetContainer .ChatContainer334 {
width: 100% !important;
height: 100% !important;
}
.ClosedContainer--fixed11j {
max-height: calc(100vh - 20px) !important;
}
@media (min-width: 480px) {
.ClosedContainer--fixed11j {
width: 320px !important;
max-height: 520px !important;
}
}
@media (min-width: 1200px) {
.ClosedContainer--fixed11j {
max-height: 550px !important;
}
}
@media (min-width: 1800px) {
.ClosedContainer--fixed11j {
max-height: 620px !important;
}
}
.FeedbackContainer--fixedwcJ {
max-height: calc(100vh - 20px) !important;
}
@media (min-width: 480px) {
.FeedbackContainer--fixedwcJ {
width: 320px !important;
max-height: 520px !important;
}
}
@media (min-width: 1200px) {
.FeedbackContainer--fixedwcJ {
max-height: 550px !important;
}
}
@media (min-width: 1800px) {
.FeedbackContainer--fixedwcJ {
max-height: 620px !important;
}
}
@media (min-width: 480px) {
.LeaseDealsForm253 {
max-width: 280px !important;
}
}
.FBCustomerChat2lT .fb_dialog {
display: none !important;
}
.CarcodeWidgetResetContainer .CtaTextButton2da {
overflow: hidden !important;
}
.CarcodeWidgetResetContainer .CtaTextButton--column18H {
height: 100% !important;
flex-direction: column !important;
max-height: 0 !important;
}
.CarcodeWidgetResetContainer .CtaTextButton--column-separatorDFw {
width: 100% !important;
border-top-width: 1px !important;
border-top-style: solid !important;
}
.CarcodeWidgetResetContainer .CtaTextButton--column-button2OZ {
padding: 10px 3px !important;
}
.CarcodeWidgetResetContainer .CtaTextButton--column-button2OZ p {
font-size: inherit !important;
}
.CarcodeWidgetResetContainer .CtaTextButton--column-short-visibleBgy {
max-height: 70px !important;
}
.CarcodeWidgetResetContainer .CtaTextButton--column-wide-visible3j3 {
max-height: none !important;
}
.CarcodeWidgetResetContainer .CtaTextButton--rowHQk {
width: 100% !important;
flex-direction: row !important;
max-width: 0 !important;
}
.CarcodeWidgetResetContainer .CtaTextButton--row-separator24w {
height: 100% !important;
border-left-width: 1px !important;
border-left-style: solid !important;
}
.CarcodeWidgetResetContainer .CtaTextButton--row-buttonwqw {
height: calc(100% - 3px) !important;
padding: 10px !important;
}
.CarcodeWidgetResetContainer .CtaTextButton--row-buttonwqw p {
font-size: inherit !important;
}
.CarcodeWidgetResetContainer .CtaTextButton--row-short-visible1JE {
max-width: 70px !important;
}
.CarcodeWidgetResetContainer .CtaTextButton--row-wide-visible2UG {
max-width: 150px !important;
}
.CarcodeWidgetResetContainer .ToolbarThirdPartyCta26V {
flex-shrink: 0 !important;
}
.CarcodeWidgetResetContainer .ToolbarThirdPartyCta--rowOl9 {
margin: -3px 0 !important;
}
.CarcodeWidgetResetContainer .ToolbarThirdPartyCta--columnsBF {
margin: 0 !important;
}
.CarcodeWidgetResetContainer .LeaseDealsCta1OI {
flex-shrink: 0 !important;
}
.CarcodeWidgetResetContainer .LeaseDealsCta--row2yx {
margin: -3px 0 !important;
}
.CarcodeWidgetResetContainer .LeaseDealsCta--columnsVo {
margin: 0 !important;
}
.CarcodeWidgetResetContainer .ToolbarInputItem1IN {
display: flex !important;
}
.CarcodeWidgetResetContainer .ToolbarInputItem__input2WS {
font-size: 1em !important;
}
@media (max-width: 480px) {
.CarcodeWidgetResetContainer .ToolbarInputItem__input2WS {
font-size: 1em !important;
}
}
.CarcodeWidgetResetContainer .ContinueButton2WU {
display: flex !important;
}
.CarcodeWidgetResetContainer
.Toolbar--anchored-rightQuW
.js-carcode-cta-text-button,
.CarcodeWidgetResetContainer
.Toolbar--anchored-rightQuW
> .js-carcode-icon-button {
flex-direction: row-reverse !important;
}
.CarcodeWidgetResetContainer .Toolbar--hidden2XN > * {
display: none !importan.........完整代码请登录后点击上方下载按钮下载查看
网友评论0