﻿/* Extra small devices (phones, 500px and down) */
@media only screen and (max-width: 500px) {



    .SkaptchaContainerAll {
        background-color: #f5f5f5 !important;
       /* width: 380px !important;*/
    }

    .CaptchaHolder {
        background-color: #f5f5f5 !important;
        /*width: 380px !important;*/
        flex-direction: column !important;
        align-items: center !important;
        padding-right: 10px !important;
        padding-bottom: 10px !important;
    }



    #CaptchaHolder .btnOperations {
        color: #fff !important;
        background-color: #0d6efd !important;
        border-color: #0d6efd !important;
        display: inline-block !important;
        font-weight: 400 !important;
        line-height: 1.5 !important;
        text-align: center !important;
        text-decoration: none !important;
        vertical-align: middle !important;
        user-select: none !important;
        border: 1px solid transparent !important;
        padding: 0.375rem 0.75rem !important;
        font-size: 1rem !important;
        border-radius: 0.25rem !important;
        transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
        -webkit-appearance: button !important;
        font-family: inherit !important;
        text-transform: none !important;
        padding-top: 0.15rem !important;
        padding-right: 0.5rem !important;
        padding-bottom: 0.15rem !important;
        padding-left: 0.5rem !important;
    }

    #CaptchaHolder .flex-container {
        /*display: flex !important;*/
        justify-content: center !important;
    }

        #CaptchaHolder .flex-container > div {
            padding: 10px !important;
        }

    #CaptchaHolder .flex-col {
        flex-direction: column !important;
        align-items: center !important;
    }


    #CaptchaHolder .col-item {
        /*display: flex !important;*/
        width: 100% !important;
        padding-bottom: 5px !important;
        padding-top: 5px !important;
        /*justify-content: space-between;*/
    }

    #CaptchaHolder .audioButtons button {
        margin: 2px !important;
    }





    /* .col-item div:first-child {
        width: 80%;
    }

    .col-item div:nth-child(2) {
        padding-left: 10px;
    }*/

    #CaptchaHolder .captchaResponse {
        margin-top: 10px !important;
        border: 1px solid grey !important;
        text-align: left !important;
        font-weight: 400 !important;
        font-size: 16px !important;
        background: white !important;
        font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji" !important;
    }

        #CaptchaHolder .captchaResponse:focus {
            box-shadow: none !important;
            background: white !important;
        }

    #CaptchaHolder .challengeText {
        color: black !important;
        font-weight: bold !important;
        text-transform: uppercase !important;
        font-size: 15px !important;
        padding: 0px !important;
        display: block !important;
        text-align: center !important;
        font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji" !important;
    }

    /*.languageRow {
    display: flex;
    padding: 0;
    width: 100% !important;
    justify-content: space-between;
}

    .languageRow > div:last-child {
        width: 100% !important;
        display: inline;
        text-align: end;
    }*/

    #CaptchaHolder .linktext {
        text-decoration: none !important;
        color: #495057 !important;
        font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji" !important;
    }

        #CaptchaHolder .linktext:hover {
            text-decoration: underline !important;
        }

    #CaptchaHolder .skaptchaImage {
        width: 100% !important;
    }
    #CaptchaHolder .col-item {
        display: block;
        width: 100%;
        padding-bottom: 5px !important;
        padding-top: 5px !important;
        justify-content: space-between;
    }
    #CaptchaHolder .textcenter {
        text-align: center;
    }
    #CaptchaHolder .imagecenter {
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

}



@media only screen and (min-width: 500px) {

    .SkaptchaContainerAll {
        background-color: #f5f5f5 !important;
        width: 380px !important;
    }

    .CaptchaHolder {
        background-color: #f5f5f5 !important;
        width: 380px !important;
        flex-direction: column !important;
        align-items: center !important;
        padding-right: 10px !important;
        padding-bottom: 10px !important;
    }



    #CaptchaHolder .btnOperations {
        color: #fff !important;
        background-color: #0d6efd !important;
        border-color: #0d6efd !important;
        display: inline-block !important;
        font-weight: 400 !important;
        line-height: 1.5 !important;
        text-align: center !important;
        text-decoration: none !important;
        vertical-align: middle !important;
        user-select: none !important;
        border: 1px solid transparent !important;
        padding: 0.375rem 0.75rem !important;
        font-size: 1rem !important;
        border-radius: 0.25rem !important;
        transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out !important;
        -webkit-appearance: button !important;
        font-family: inherit !important;
        text-transform: none !important;
        padding-top: 0.15rem !important;
        padding-right: 0.5rem !important;
        padding-bottom: 0.15rem !important;
        padding-left: 0.5rem !important;
    }

    #CaptchaHolder .flex-container {
        display: flex !important;
        justify-content: center !important;
    }

        #CaptchaHolder .flex-container > div {
            padding: 10px !important;
        }

    #CaptchaHolder .flex-col {
        flex-direction: column !important;
        align-items: center !important;
    }


    #CaptchaHolder .col-item {
        display: flex !important;
        width: 100% !important;
        padding-bottom: 5px !important;
        padding-top: 5px !important;
        justify-content: space-between;
    }

    #CaptchaHolder .audioButtons button {
        margin: 2px !important;
    }





    /* .col-item div:first-child {
        width: 80%;
    }

    .col-item div:nth-child(2) {
        padding-left: 10px;
    }*/

    #CaptchaHolder .captchaResponse {
        margin-top: 10px !important;
        border: 1px solid grey !important;
        text-align: left !important;
        font-weight: 400 !important;
        font-size: 16px !important;
        background: white !important;
        font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji" !important;
    }

        #CaptchaHolder .captchaResponse:focus {
            box-shadow: none !important;
            background: white !important;
        }

    #CaptchaHolder .challengeText {
        color: black !important;
        font-weight: bold !important;
        text-transform: uppercase !important;
        font-size: 15px !important;
        padding: 0px !important;
        display: block !important;
        text-align: center !important;
        font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji" !important;
    }

    /*.languageRow {
    display: flex;
    padding: 0;
    width: 100% !important;
    justify-content: space-between;
}

    .languageRow > div:last-child {
        width: 100% !important;
        display: inline;
        text-align: end;
    }*/

    #CaptchaHolder .linktext {
        text-decoration: none !important;
        color: #495057 !important;
        font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji" !important;
    }

        #CaptchaHolder .linktext:hover {
            text-decoration: underline !important;
        }

    #CaptchaHolder .skaptchaImage {
        width: 100% !important;
    }
    #CaptchaHolder .col-item {
        display: flex;
        width: 100%;
        padding-bottom: 5px !important;
        padding-top: 5px !important;
        justify-content: space-between;
    }
   
}
