Your IP : 10.10.0.253

Current Path : /var/www/components/com_qf3/assets/css/
Upload File :
Current File : /var/www/components/com_qf3/assets/css/example1.css

/**
* @Copyright ((c) plasma-web.ru
        */
.qf3form.example1 {
    padding: 2em 1em;
    color: #000;
    max-width: 600px;
    margin: 1em auto;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 20px;
}

.qf3form.example1 * {
    margin: 0;
    box-sizing: border-box;
    max-width: 100%;
    box-shadow: none !important;
    font-size: 1em;
    line-height: 150%;
    background: none;
}

.qf3form.example1 .qf3label {
    display: block;
}

.qf3form.example1 .ex_box {
    display: flex;
    flex-wrap: wrap;
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 5px;
    background: #296e34;
    margin-bottom: 1em;
}

.qf3form.example1 .ex_box_1 {
    width: 50%;
    padding: 5px 10px 0px 5px;
}

.qf3form.example1 .ex_box_1 .qf3label {
    color: #fff;
    margin-bottom: 0.3em;
}

.qf3form.example1 .ex_box_2 {
    width: 50%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff;
}

.qf3form.example1 .qf3 {
    padding: 0 0 1em 0;
}

.qf3form.example1 .qf3txt input,
.qf3form.example1 select {
    width: 100%;
    height: 2.4em;
    background: #fff;
    padding: 2px 0 2px 7px;
    border-radius: 4px;
    border: 1px solid #cbc5c5;
}

.qf3form.example1 .qf3labelreq {
    padding-left: 0.3em;
}

/*modal form*/
.qf3form.example1.qfoverlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #000000;
    opacity: 0.8;
    z-index: 9990;
    margin: 0;
    max-width: none;
}

.qf3form.example1.qfmodalform {
    position: absolute;
    top: 0;
    left: 50%;
    width: 620px;
    margin-left: -310px;
    z-index: 9999;
    border: 1px solid #ccc;
    border-radius: 20px;
    background: #fff;
    padding: 0;
    font-size: 1em;
}


/* message */
.qf3form.example1 .qfmess span {
    padding: 1em;
    display: block;
}

.qf3form.example1 .qfclose {
    position: absolute;
    top: 15px;
    right: 5px;
    height: 24px;
    width: 24px;
    cursor: pointer;
    color: #ff0000;
    font-size: 24px;
}


/* radio */
.qf3form.example1 .radioblok {
    display: inline-block;
}

.qf3form.example1 .qfradio.hor .radioblok label {
    display: inline-block;
    white-space: nowrap;
    border-radius: 10px;
    padding: 0.2em 0.6em;
    background-color: #fff;
    cursor: pointer;
    margin: 0.5em 1em 0 0;
}

.qf3form.example1 .qfradio.hor .radioblok input:checked+label {
    background-color: #2d7d3a;
    color: #fff;
}

.qf3form.example1 .qfradio.hor .radioblok input {
    display: none;
}

/* textarea */
.qf3form.example1 textarea {
    height: 160px;
    width: 100%;
    padding: 2px 0 2px 7px;
    border: 2px solid #296e34;
}

/* checkbox */
.qf3form.example1 .qfcheckbox input,
.qf3form.example1 .qfbackemail input {
    margin: 0 0.5em 0 0;
    vertical-align: middle;
}

.qf3form.example1 .chbxlabel {
    display: inline-block;
    line-height: 140%;
}

.qf3form.example1 .box_qfbtn .qfchkbx {
    display: none;
}

.qf3form.example1 .box_qfbtn .qf3label {
    border: 1px solid #296e34;
    border-radius: 1em;
    color: #fff;
    background: #296e34;
    padding: 0.2em 2em;
    display: inline-block;
    cursor: pointer;
}

.qf3form.example1 .qf_tems {
    display: flex;
}

.qf3form.example1 .qf_tems .qf3 {
    padding: 0;
}

.qf3form.example1 .qf_tems a {
    color: #ccc;
}

.qf3form.example1 .qf_continue {
    background: #296e34;
    padding: 1em;
    border: 1px solid #296e34;
    border-radius: 10px;
    color: #fff;
}

.qf3form.example1 .qfsbm {
    margin-top: 1em;
    border: 1px solid #296e34;
    border-radius: 1em;
    color: #fff;
    background: #2c4a31;
    padding: 0.3em 2em;
    display: inline-block;
    cursor: pointer;
}

.qf3form.example1 .qfsbm:hover {
    background: #296e34;
}

.qf3form.example1 .note {
    border: 1px solid #ccc;
    padding: 1em;
    margin: 1em 0;
    background: #438a4eed;
}

/* link */
.qf3form.example1 .qfcapt {
    text-align: right;
    margin-top: -3em;
}

.qf3form.example1 .qfcapt a {
    color: #CCC;
    font-size: 10px;
    padding: 1em 2em;
}

.qf3form.example1 .nfl {
    display: none;
}

/* calendar */
.qf3form.example1 .single {
    display: inline-block;
    width: 100%;
}

.qf3form.example1 .qfcalendar input {
    border-radius: 4px 0 0 4px;
    border-right: 0;
}

.qf3form.example1 .qf_date_inner {
    display: flex;
    width: 100%;
    justify-content: space-between;
}

.qf3form.example1 .qf_calen {
    position: relative;
    z-index: 9999;
}

.qf3form.example1 .widgetCalendar {
    position: absolute;
    left: 0;
    height: 0px;
    overflow: hidden;
    width: 100%;
    min-width: 180px;
}

.qf3form.example1 .qf_date_a {
    display: block;
    padding: 0 1.2em;
    border: 1px solid #cbc5c5;
    border-left: 0;
    background: #fff;
    background-image: url(../datepicker/images/calendar.png);
    background-size: 100% 100%;
}

.qf3form.example1 div.datepicker {
    height: 200px;
    font-size: 12px;
    background: #000;
}

.qf3form.example1 .datepickerContainer,
.qf3form.example1 .datepickerContainer table {
    width: 100%;
    height: 100%;
}

/* compact */
.qf3form.example1.compact .qf3txt input,
.qf3form.example1.compact .ex_box_1,
.qf3form.example1.compact .ex_box_2,
.qf3form.example1.compact select {
    width: 100%;
}