.offline-ui .offline-ui-retry:before {
    content: "Reconnect"
}

.offline-ui.offline-ui-up .offline-ui-content:before {
    content: "Your computer is connected to the internet."
}

@media (max-width:1024px) {
    .offline-ui.offline-ui-up .offline-ui-content:before {
        content: "Your device is connected to the internet."
    }
}

@media (max-width:568px) {
    .offline-ui.offline-ui-up .offline-ui-content:before {
        content: "Your device is connected."
    }
}

.offline-ui.offline-ui-down .offline-ui-content:before {
    content: "Your computer lost its internet connection."
}

@media (max-width:1024px) {
    .offline-ui.offline-ui-down .offline-ui-content:before {
        content: "Your device lost its internet connection."
    }
}

@media (max-width:568px) {
    .offline-ui.offline-ui-down .offline-ui-content:before {
        content: "Your device isn't connected."
    }
}

.offline-ui.offline-ui-down.offline-ui-connecting .offline-ui-content:before, .offline-ui.offline-ui-down.offline-ui-connecting-2s .offline-ui-content:before {
    content: "Attempting to reconnect..."
}

.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content[data-retry-in-unit=second]:before {
    content: "Connection lost. Reconnecting in " attr(data-retry-in-value) " seconds..."
}

@media (max-width:568px) {
    .offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content[data-retry-in-unit=second]:before {
        content: "Reconnecting in " attr(data-retry-in-value) "s..."
    }
}

.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content[data-retry-in-unit=second][data-retry-in-value="1"]:before {
    content: "Connection lost. Reconnecting in " attr(data-retry-in-value) " second..."
}

@media (max-width:568px) {
    .offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content[data-retry-in-unit=second][data-retry-in-value="1"]:before {
        content: "Reconnecting in " attr(data-retry-in-value) "s..."
    }
}
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content[data-retry-in-unit=minute]:before {
    content: "Connection lost. Reconnecting in " attr(data-retry-in-value) " minutes..."
}
@media (max-width:568px) {
    .offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content[data-retry-in-unit=minute]:before {
        content: "Reconnecting in " attr(data-retry-in-value) "m..."
    }
}
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content[data-retry-in-unit=minute][data-retry-in-value="1"]:before {
    content: "Connection lost. Reconnecting in " attr(data-retry-in-value) " minute..."
}
@media (max-width:568px) {
    .offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content[data-retry-in-unit=minute][data-retry-in-value="1"]:before {
        content: "Reconnecting in " attr(data-retry-in-value) "m..."
    }
}
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content[data-retry-in-unit=hour]:before {
    content: "Connection lost. Reconnecting in " attr(data-retry-in-value) " hours..."
}
@media (max-width:568px) {
    .offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content[data-retry-in-unit=hour]:before {
        content: "Reconnecting in " attr(data-retry-in-value) "h..."
    }
}
.offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content[data-retry-in-unit=hour][data-retry-in-value="1"]:before {
    content: "Connection lost. Reconnecting in " attr(data-retry-in-value) " hour..."
}
@media (max-width:568px) {
    .offline-ui.offline-ui-down.offline-ui-waiting .offline-ui-content[data-retry-in-unit=hour][data-retry-in-value="1"]:before {
        content: "Reconnecting in " attr(data-retry-in-value) "h..."
    }
}
.offline-ui.offline-ui-down.offline-ui-reconnect-failed-2s.offline-ui-waiting .offline-ui-retry {
    display: none
}
.offline-ui.offline-ui-down.offline-ui-reconnect-failed-2s .offline-ui-content:before {
    content: "Connection attempt failed."
}