/******************************************************************************
 *     ______                                                                 *
 *    /       \                                                               *
 *   /$$$$$$  | ________  __    __   ______    ______                         *
 *   $$ |__$$ |/        |/  |  /  | /      \  /      \                        *
 *   $$    $$ |$$$$$$$$/ $$ |  $$ |/$$$$$$  |/$$$$$$  |                       *
 *   $$$$$$$$ |  /  $$/  $$ |  $$ |$$ |  $$/ $$    $$ |                       *
 *   $$ |  $$ | /$$$$/__ $$ \__$$ |$$ |      $$$$$$$$/                        *
 *   $$ |  $$ |/$$      |$$    $$/ $$ |      $$       |                       *
 *   $$/   $$/ $$$$$$$$/  $$$$$$/  $$/        $$$$$$$/                        *
 *                                                                            *
 *   @PROJECT    : Opd Extension [Magetop.com]                                *
 *   @AUTHOR     : Azure - Developer                                          *
 *   @COPYRIGHT  : © 2019  Magetop.com                                        *
 *   @LINK       : https://Magetop.com                                        *
 *   @CREATED    :  10/10/2019                                                *
 ******************************************************************************/

.opd-thum {overflow: hidden;}
.opd-thum .opd-preview-side {width:80px;float: left;margin-bottom: 8px;}
.opd-thum .opd-preview-side:not(:last-child) {margin-right:8px;}
.opd-thum .opd-preview-side svg {max-width:100%;height:auto;}
#txt-idesign-text {
    width: 98%;
    height: 47px;
    font-size: 1.4em;
}
#krisla-preview-text-font {
    width: 100%;
    float: none;
    margin-left: auto;
    margin-right: auto;
    max-width: 370px;
    margin-top: 5px;
}
#krisla-preview-text-name {
    width: 100%;
    float: none;
    margin-left: auto;
    margin-right: auto;
    max-width: 370px;
    margin-top: 5px;
    position: relative;
    height: 370px;
    max-height: 370px;
    background-size: cover;
    background-repeat: no-repeat;
}

#krisla-preview-text-name span {
    position: absolute;
    top: 100px;
    text-align: center;
    width: 370px;
    height: 100px;
    max-width: 300px;
    max-height: 180px;
    display: flex;
    justify-content: center;
    align-items: center;
    white-space: nowrap;
}

#krisla-preview-text-container, #krisla-preview-title-container {
    width: 100%;
    float: none;
    margin-left: auto;
    margin-right: auto;
    max-width: 370px;
    
}

#krisla-preview-title-container {
    margin-top: 15px;
}

#cpp-preview-text-title {
    padding: 3px 0 0 10px;
    font-size: 1.4em;
    color: #0085b9;
}


.cpp-preview-text-descr {
    margin: 0 0 10px 0 !important;
    padding: 10px 12px 10px 17.5px !important;
    font-size: 1.3rem !important;
    font-weight: 600!important;
}

#cpp-prview-text-image {
    height: 180px !important;
    top: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#cpp-prview-text-image img {
    width: 100%;
    height: 100%;
    max-width: 330px;
    max-height: 160px;
}

#cpp-prview-text-row1, #cpp-prview-text-row2 {
    height: 100px;
    font-size: 90px;
    white-space: nowrap;
}

#selectTemplateLeft img {
    max-height: 30px;
    padding: 3px 0 0 3px;
}