﻿

#LCPContent {
    position: relative;
    min-height: 200px; /* Adjust as needed */
    transition: min-height 0.3s ease-in-out; /* Optional: Smooth height change */
}

/* The semi-transparent overlay */
/*.lcp-loading-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(240, 240, 240, 0.7);*/ /* Light gray, slightly transparent */
    /*z-index: 10;*/ /* Ensure it's above potential existing content */
    /*display: flex;*/ /* Use flexbox for easy centering */
    /*justify-content: center;
    align-items: center;*/
    /* Optional: Add a smooth fade-in/out */
    /*opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;
}*/

/* Make the overlay visible when the 'loading' class is added to #LCPContent */
/*#LCPContent.loading .lcp-loading-overlay {
    opacity: 1;
    visibility: visible;
}*/

/* Style the Font Awesome spinner icon */
/*.lcp-loading-overlay .fa-spinner {
    font-size: 2.5rem;*/ /* Adjust size */
    /*color: #555;*/ /* Adjust color */
/*}*/




.cps_custom_attribute_option
{
    margin: 0px;
    cursor: pointer;
}



/*-------------------- OS flavours --------------------------*/
.ao_os {
    /*width: 70px;*/
    color: #fafafa;
    width: 48px;
    height: 48px;
    padding: 0;
}

    .ao_os:hover
    {
    }

    .ao_os .cps_custom_attribute_option_img {
        width: 48px;
        height: 48px;
        background-color: white;
        margin-right: auto;
        margin-left: auto;
    }

    .ao_os .cps_custom_attribute_option_txt
    {
        font-size: 10pt;
        text-align:center;
    }

.ao_os.ao_picked
{
    color: white;
}

.radio-inputs  .ao_os.aoi_centos .cps_custom_attribute_option_img {
    background-position: -45px -45px !important;
    background: url('../Images/OptionAttributes/OS/b-os-icon-m.png') repeat-x;
}

.radio-inputs .radio-input:checked + .radio-tile .ao_os.aoi_centos .cps_custom_attribute_option_img {
    background-position: -90px -45px !important;
}

.radio-tile:hover .ao_os.aoi_centos .cps_custom_attribute_option_img {
    background-position: -0px -45px !important;
}


.ao_os.aoi_debian .cps_custom_attribute_option_img {
    background: url('../Images/OptionAttributes/OS/b-os-icon-m.png') repeat-x;
    background-position: -45px 0px;
}

.radio-inputs .radio-input:checked + .radio-tile .ao_os.aoi_debian .cps_custom_attribute_option_img {
    background-position: -89px -0px;
}

.radio-tile:hover  .ao_os.aoi_debian .cps_custom_attribute_option_img {
    background-position: 0px -0px;
}

.ao_os.aoi_ubuntu .cps_custom_attribute_option_img {
    background: url('../Images/OptionAttributes/OS/b-os-icon-m.png') repeat-x;
    background-position: -44px -90px;
}

.radio-inputs .radio-input:checked + .radio-tile .ao_os.aoi_ubuntu .cps_custom_attribute_option_img {
    background-position: -89px -90px;
}

.radio-tile:hover .ao_os.aoi_ubuntu .cps_custom_attribute_option_img {
    background-position: 3px -90px;
}

.ao_os.aoi_fedora .cps_custom_attribute_option_img {
    background: url('../Images/OptionAttributes/OS/b-os-icon-m.png') repeat-x;
    background-position: -44px -272px;
}

.radio-inputs .radio-input:checked + .radio-tile .ao_os.aoi_fedora .cps_custom_attribute_option_img {
    background-position: -89px -272px;
}

.radio-tile:hover  .ao_os.aoi_fedora .cps_custom_attribute_option_img {
    background-position: 3px -272px;
}

.ao_os.aoi_opensuse .cps_custom_attribute_option_img {
    background: url('../Images/OptionAttributes/OS/b-os-icon-m.png') repeat-x;
    background-position: -45px -315px;
}

.radio-inputs .radio-input:checked + .radio-tile .ao_os.aoi_opensuse .cps_custom_attribute_option_img {
    background-position: -88px -315px;
}

.radio-tile:hover  .ao_os.aoi_opensuse .cps_custom_attribute_option_img {
    background-position: -0px -315px;
}

.ao_os.aoi_mint .cps_custom_attribute_option_img {
    background: url('../Images/OptionAttributes/OS/b-os-icon-m.png') repeat-x;
    background-position: -45px -585px;
}

.radio-inputs .radio-input:checked + .radio-tile .ao_os.aoi_mint .cps_custom_attribute_option_img {
    background-position: -90px -585px;
}

.radio-tile:hover  .ao_os.aoi_mint .cps_custom_attribute_option_img {
    background-position: -2px -585px;
}

.aoi_os.aoi_no .cps_custom_attribute_option_img {
    background: url('../Images/OptionAttributes/OS/b-os-icon-m.png') repeat-x;
    background-position: -45px -540px;
}

.radio-inputs .radio-input:checked + .radio-tile .aoi_os.aoi_no .cps_custom_attribute_option_img {
    background-position: -90px -540px;
}

.radio-tile:hover .aoi_os.aoi_no .cps_custom_attribute_option_img {
    background-position: -0px -540px;
}

.ao_os.aoi_win .cps_custom_attribute_option_img {
    background: url('../Images/OptionAttributes/OS/b-os-icon-m.png') repeat-x;
    background-position: -45px -495px;
}

.radio-inputs .radio-input:checked + .radio-tile .ao_os.aoi_win .cps_custom_attribute_option_img {
    background-position: -90px -495px;
}

.radio-tile:hover .ao_os.aoi_win .cps_custom_attribute_option_img {
    background-position: -1px -495px;
}

.ao_os.aoi_win.aoi_2012 .cps_custom_attribute_option_img {
    background: url('../Images/OptionAttributes/OS/b-os-icon-m.png') repeat-x;
    background-position: -45px -629px;
}

.radio-inputs .radio-input:checked + .radio-tile .ao_os.aoi_win.aoi_2012 .cps_custom_attribute_option_img {
    background-position: -90px -629px;
}

.radio-tile:hover .ao_os.aoi_win.aoi_2012 .cps_custom_attribute_option_img {
    background-position: -0px -629px;
}

.ao_os.aoi_windows.aoi_10 .cps_custom_attribute_option_img {
    background: url('../Images/OptionAttributes/OS/b-os-icon-m.png') repeat-x;
    background-position: -45px -629px;
}

.radio-inputs .radio-input:checked + .radio-tile .ao_os.aoi_windows.aoi_10 .cps_custom_attribute_option_img {
    background-position: -90px -629px;
}

.radio-tile:hover .ao_os.aoi_windows.aoi_10 .cps_custom_attribute_option_img {
    background-position: -0px -629px;
}

.ao_os.aoi_win.aoi_2016 .cps_custom_attribute_option_img {
    background: url('../Images/OptionAttributes/OS/b-os-icon-m.png') repeat-x;
    background-position: -46px -629px;
}

.radio-inputs .radio-input:checked + .radio-tile .ao_os.aoi_win.aoi_2016 .cps_custom_attribute_option_img {
    background-position: -90px -629px;
}

.radio-tile:hover .ao_os.aoi_win.aoi_2016 .cps_custom_attribute_option_img {
    background-position: -0px -629px;
}

.ao_os.aoi_win.aoi_2019 .cps_custom_attribute_option_img {
    background: url('../Images/OptionAttributes/OS/b-os-icon-m.png') repeat-x;
    background-position: -45px -629px;
}

.radio-inputs .radio-input:checked + .radio-tile .ao_os.aoi_win.aoi_2019 .cps_custom_attribute_option_img {
    background-position: -90px -629px;
}

.radio-tile:hover .ao_os.aoi_win.aoi_2019 .cps_custom_attribute_option_img {
    background-position: -0px -629px;
}

.ao_os.aoi_windows.aoi_11 .cps_custom_attribute_option_img {
    background: url('../Images/OptionAttributes/OS/b-os-icon-m.png') repeat-x;
    background-position: -44px -674px;
}

.radio-inputs .radio-input:checked + .radio-tile .ao_os.aoi_windows.aoi_11 .cps_custom_attribute_option_img {
    background-position: -92px -674px;
}

.radio-tile:hover .ao_os.aoi_windows.aoi_11 .cps_custom_attribute_option_img {
    background-position: 2px -674px;
}





