/**
   Файл:    <шаблон>/css/footer/footer.css
   Раздел:  Стили подвала
   Автор:   BVP
 */

/*  Cтруктура подвала */
#above-footer,
#footer {
    display:  block;
    position: relative;
    width:    100%;
    padding:  0;
    -webkit-transition: all 0.4s ease;
    transition:         all 0.4s ease;
}
#above-footer > div {
    display:  block;
    overflow: hidden;
    float:    left;
    width:    50%;
    height:   600px;
}

/*  Карта */
#fta-map {
}

/*  Справа - контакты и форма обратной связи */
#fta-right {
    display: table;
    padding: 3% 4%;
}
#fta-right > div {
    display:        table-cell;
    font-size:      1.1em;
    line-height:    1.45;
    vertical-align: middle;
}

/*  Контакты над подвалом */
#fta-contacts > div {
    padding-bottom: 1em;
}
#fta-company {
    font-weight: bold;
}
#fta-contacts .fta-prefix {
    padding-right: .8em;
}

/*  Форма обратной связи */
#fta-feedback {
    padding-top: 1em;
}
#fta-feedback h2 {
    margin: 0 0 .6em;
    font-size: 1.3em;
}
#fta-feedback .ftfb-inputs {
    display:  block;
    overflow: hidden;
    height:   150px;
}
#fta-feedback .ftfb-inputs > div {
    display:  block;
    overflow: hidden;
    height:   100%;
}
#fta-feedback .ftfb-left {
    float: left;
    width: 60%;
    padding-right: 3%;
}
#fta-feedback .ftfb-right {
    float: right;
    width: 40%;
    padding-left: 3%;
}
#fta-feedback .ftfb-right > * {
    width:  100%;
    height: 50%;
}
#fta-feedback .ftfb-right > *:first-of-type {
    padding-bottom: 5%;
}
#fta-feedback .ftfb-right > *:last-of-type {
    padding-top: 5%;
}
#fta-feedback .ftfb-left  textarea,
#fta-feedback .ftfb-right input {
    width:      100%;
    height:     100%;
    padding:    3% 5%;
    resize:     none;
    font-size:  .9em;
    border:     solid 1px;
    box-shadow: none;
}
#fta-feedback .ftfb-licenses {
    margin-top: .6em;
    font-size:  .8em;
}
#fta-feedback #ftfb-submit {
    font-size: 1.2em;
}
#ftfb-result {
    width:      100%;
    margin-top: 1em;
    text-align: center;
}

/*  Меню в подвале */
#ft-menu {
    display:  block;
    overflow: hidden;
    padding:  4% 0 3%;
}
#ft-menu .ft-submenu {
    float: left;
    padding-right: 4%;
}
#ft-menu .ft-submenu:last-of-type {
    float: left;
    padding-right: 0;
}
#ft-menu .ft-submenu:nth-of-type(1) { width: 30%; }
#ft-menu .ft-submenu:nth-of-type(2) { width: 30%; }
#ft-menu .ft-submenu:nth-of-type(3) { width: 20%; }
#ft-menu .ft-submenu:nth-of-type(4) { width: 20%; }

#ft-menu .ft-submenu > div:first-of-type {
    padding-bottom: 11px;
    margin-bottom:  15px;
    border-bottom:  solid 1px;
}
#ft-menu .level-2 {
    padding-bottom: .5em;
}
#ft-menu .mi-title {
    font-size:   1em;
    font-weight: bold;
    padding-bottom: 10px;
    margin-bottom:  15px;
    border-bottom:  solid 2px;
    
}
#ft-menu .mi-title:hover {
    text-decoration: none;
}

@media (max-width: 1100px) 
{
    #above-footer > div {
        height: 550px;
    }
    #fta-right {
        padding: 3% 3%;
    }
    #fta-right > div {
        font-size: 1.05em;
    }
    #fta-feedback .ftfb-right > *:first-of-type {
        padding-bottom: 7%;
    }
    #fta-feedback .ftfb-right > *:last-of-type {
        padding-top: 7%;
    }
}

@media (max-width: 1000px) 
{
    #fta-right {
        padding: 3% 2%;
    }
    #fta-feedback .ftfb-right > *:first-of-type {
        padding-bottom: 8%;
    }
    #fta-feedback .ftfb-right > *:last-of-type {
        padding-top: 8%;
    }
    #fta-feedback .ftfb-licenses {
        margin-top: 1em;
    }
    #fta-feedback #ftfb-submit {
        font-size: 1.1em;
    }
}

@media (max-width: 900px) 
{
    #above-footer > div {
        height: 530px;
    }
    #fta-right > div {
        font-size: 1em;
    }
    #fta-feedback h2 {
        font-size: 1.2em;
    }
    #fta-feedback .ftfb-right > *:first-of-type {
        padding-bottom: 10%;
    }
    #fta-feedback .ftfb-right > *:last-of-type {
        padding-top: 10%;
    }
    #fta-feedback #ftfb-submit {
        font-size: 1em;
    }
}

@media (max-width: 800px) 
{
    /*  поля формы располагаем друг под другом */
    #fta-feedback {
        padding-top: 0;
    }
    #fta-feedback .ftfb-inputs {
        height: 180px;
    }
    #fta-feedback .ftfb-left,
    #fta-feedback .ftfb-right {
        float: none;
        clear: both;
        width: 100%;
    }
    #fta-feedback .ftfb-left {
        height:  70% !important;
        padding: 0 0 2%;
    }
    #fta-feedback .ftfb-right {
        height:  30% !important;
        padding: 2% 0 0;
    }
    #fta-feedback .ftfb-right > div {
        float:  left;
        width:  50%;
        height: 100%;
    }
    #fta-feedback .ftfb-right > *:first-of-type {
        padding: 0 2% 0 0;
    }
    #fta-feedback .ftfb-right > *:last-of-type {
        padding: 0 0 0 2%;
    }
}

@media (max-width: 750px) 
{
    #fta-right > div {
        font-size: .9em;
    }
    #fta-feedback h2 {
        font-size: 1.1em;
    }
}

@media (max-width: 720px) 
{
    /*  Прячем последний столбец меню в подвале */
    #ft-menu .ft-submenu:nth-of-type(4) {
        display: none;
    }
    #ft-menu .ft-submenu:nth-of-type(1) { width: 40%; }
    #ft-menu .ft-submenu:nth-of-type(2) { width: 35%; }
    #ft-menu .ft-submenu:nth-of-type(3) { width: 25%; padding-right: 0; }
}

@media (max-width: 650px) 
{
    /*  Карту ставим над контактами */
    #above-footer > div {
        float: none;
        clear: both;
        width: 100%;
    }
    #above-footer > #fta-map {
        height: 400px;
    }
    /*  А блок контактов, наоборот, оформляется в два столбца */
    #above-footer > #fta-right {
        height: auto;
    }
    #fta-right > div > div {
        float: left;
        width: 50%;
    }
    #fta-contacts {
        padding-right: 2%;
    }
    #fta-feedback {
        padding-left: 2%;
    }
}

@media (max-width: 550px) 
{
    #above-footer > #fta-map {
        height: 350px;
    }

    /*  Прячем и 3-й столбец меню в подвале */
    #ft-menu .ft-submenu:nth-of-type(3) {
        display: none;
    }
    #ft-menu .ft-submenu:nth-of-type(1) { width: 55%; }
    #ft-menu .ft-submenu:nth-of-type(2) { width: 45%; padding-right: 0; }
    
    #ft-menu .level-2 {
        padding-bottom: .2em;
    }
    #ft-menu .mi-title,
    #ft-menu .level-2 a {
        font-size: .9em;
    }
}

@media (max-width: 500px) 
{
    #above-footer > #fta-map {
        height: 330px;
    }

    /*  Блок контактов опять оформляется двумя строками */
    #fta-right {
        padding: 5%;
    }
    #fta-right > div > div {
        float: none;
        clear: both;
        width: 100%;
    }
    #fta-contacts {
        padding: 0 0 2%;
    }
    #fta-feedback {
        padding: 2% 0 0;
    }
    #fta-contacts #fta-email {
        padding-bottom: 0;
    }
    #fta-feedback .ftfb-inputs {
        height: 150px;
    }
    #fta-feedback .ftfb-right > *:first-of-type {
        padding: 0 4% 0 0;
    }
    #fta-feedback .ftfb-right > *:last-of-type {
        padding: 0 0 0 4%;
    }
}

@media (max-width: 360px) 
{
    /*  На узких экранах вообще не показываем меню в подвале */
    #ft-menu {
        display: none;
    }
}