﻿/* Подолжка, затеняющая основную страницу. Показывается под формой */
#form-modal {
    display: none;
}

#form-modal.show {
    display: block;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0;
    padding: 0;
    border: none;
    text-align: center;
}

.callme_overlay {
    position: absolute;
    top: 0px;
    left: 0px;

    height: 100%;
    width: 100%;

    min-width: 1024px;

    display: block;
    float: left;
    box-sizing: border-box;

    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);

    opacity: 0.8;

    background-color: #242124;

    z-index: 9999;
}
.form-success {
    font-size: 18pt;
    margin: 10px 0;
    font-weight: 700;
    color: #B51AC6;
}

/* Контейнер формы. */
.callme_container {
    position: relative;

    /*height: 80%;*/
    width: auto;

    display: inline-block;
    margin: 14% auto 0;
    /*float: left;*/
    box-sizing: border-box;

    z-index: 10000;

    /*min-width: 1024px;*/

    /* Этот хак нужен, чтобы игнорировать настройку мобильный браузеров "Подгонять сайт под размер экрана" */
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVQIW2NkAAIAAAoAAggA9GkAAAAASUVORK5CYII=);
    /* конец хака */
}

/* Сама форма */
.callme_form {
    width: 960px;
    /*height: 508px;*/

    display: block;
    float: none;
    box-sizing: padding-box;

    margin-top: auto;
    margin-bottom: auto;
    margin-left: auto;
    margin-right: auto;

    border-style: solid;
    border-width: 2px;
    border-radius: 8px;
    border-color: #CF27E2;

    background-color: #FAE7FC;
}

.callme_title {
    width: 100%;
    height: 36px;

    display: block;
    /*float: left;*/
    box-sizing: padding-box;

    border-top-left-radius: 8px;
    border-top-right-radius: 8px;

    color: #FFFFFF;
    background-color: #B51AC6;

    line-height: 36px;

    font-size: 16.0pt;
    text-align: center;
}

.callme_fields {
    width: auto;

    display: block;
    /*float: left;*/
    box-sizing: padding-box;

    margin-top: 6px;

    padding-left: 24px;
    padding-right: 24px;
}

.callme_field {
    width: 912px;

    display: block;
    /*float: left;*/
    box-sizing: border-box;

    margin-top: 12px;
}

.callme_field_title {
    width: 300px;
    height: 24px;

    display: block;
    float: left;
    box-sizing: border-box;

    color: #400946;

    font-size: 12.0pt;
    text-align: left;

    padding-left: 6px;
    padding-right: 6px;
}

.callme_field_hint {
    width: 612px;
    height: 24px;

    display: block;
    float: left;
    box-sizing: border-box;

    color: #FF0000;

    font-size: 10.0pt;
    text-align: right;

    padding-left: 6px;
    padding-right: 6px;
    padding-top: 2px;
}

.callme_field_entry,
.callme_field_entex {
    width: 912px;
    height: 32px;

    display: block;
    /*float: left;*/
    box-sizing: border-box;

    color: #400946;
    background-color: #FFFFFF;

    border-style: solid;
    border-width: 1px;
    border-color: #CF27E2;

    font-size: 12.0pt;
    text-align: left;

    padding-left: 6px;
    padding-right: 6px;
    padding-top: 5px;
    clear: both;
	font-family: Arial;
}

.callme_field input::-moz-placeholder {color: #400946; }
.callme_field input:-ms-input-placeholder {color: #400946; }
.callme_field input:-moz-placeholder {color: #400946; }
.callme_field input::-webkit-input-placeholder{color: #400946;}
	
.callme_field textarea::-moz-placeholder {color: #400946; }
.callme_field textarea:-ms-input-placeholder {color: #400946; }
.callme_field textarea:-moz-placeholder {color: #400946; }
.callme_field textarea::-webkit-input-placeholder{color: #400946;}
	

.callme_field_entex.has-error {
    border-color: red;
}

textarea.callme_field_entex {
    height: 80px;
	padding-top: 5px;
	resize: none;
}

.callme_buttons {
    width: 960px;

    display: block;
    /*float: left;*/
    box-sizing: padding-box;

    margin-top: 24px;
    marign-bottom: 24px;
}

.callme_buttons_group {
    /*width: 348px;*/

    float: none;
    text-align: center;
    margin: 0 auto 20px;
}

.callme_button {
	font-family: Arial;
    margin: 0 18px;
    width: 160px;
    height: 38px;
    /*padding: 0 40px;*/
    vertical-align: middle;
    display: inline-block;
    /*display: block;*/
    /*float: left;*/

    border-style: solid;
    border-width: 1px;
    border-radius: 8px;
    border-color: #CF27E2;

    color: #FFFFFF;
    background-color: #B51AC6;

    line-height: 38px;

    font-size: 14.0pt;
    text-align: center;
    box-sizing: border-box;
	
    cursor: pointer;
}
button.callme_button {line-height:1;}
.callme_button:hover {
    background-color: #CF27E2;
}

.callme_button:active {
    background-color: #9615A4;
}

.callme_button_space {

    margin: auto;
    width: 24px;
    height: 1px;
    display: inline-block;
    vertical-align: middle;
    /*display: block;*/
    /*float: left;*/
    box-sizing: padding-box;
}