/*
Белый E9E7E9
Серый 201F28
Оранжевый F08464
*/
#primary{
    width: 100%;
}
#dk_h{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100vw;
    height: 75vh;
    padding: 0 7vw;
}
#dk_h h1{
    text-transform: uppercase;
    color: #E9E7E9;
    font: 900 2em "Fedra Sans", "PT Sans", Arial, Helvetica, sans-serif;
    max-width: 660px;
}
.dk_h-s{
    text-transform: uppercase;
    color: #828282;
    font: 400 0.7em "Fedra Sans", "PT Sans", Arial, Helvetica, sans-serif;
}
.dk_h-p{
    color: #E9E7E9;
    font: 200 1.5em "Fedra Sans", "PT Sans", Arial, Helvetica, sans-serif;
    margin: 15px 0 25px;
}
.dk_but{
    display: inline-block;
    text-decoration: none;
    padding: 15px 30px;
    font: 900 1em Arial, Helvetica, sans-serif;
    background: -o-radial-gradient(at center, #fdc4b3, #f1997e);
    background: radial-gradient(at center, #fdc4b3, #f1997e);
    border-radius: 30px;
    color: #201F28;
    outline: none;
}
.dk_but:active{
    -webkit-transform: scale(.9);
        -ms-transform: scale(.9);
            transform: scale(.9);
    color: #E9E7E9;
}
.dk_but:focus{
    color: #E9E7E9;
    outline: none;
}
.dk_but:link,
.dk_but:visited{
    color: #201F28;
    outline: none;
}
.dk_but:hover{
    background: -o-radial-gradient(at center, #f1997e, #fdc4b3);
    background: radial-gradient(at center, #f1997e, #fdc4b3);
    -webkit-box-shadow: 0 0 10px #fdc4b3;
            box-shadow: 0 0 10px #fdc4b3;
    color: #E9E7E9;
    text-shadow: 2px 2px 0 #f1997e;
}
.dk_s{
    width: 100%;
}
.dk_s_b{
    position: relative;
    width: 100%;
    margin: 0;
    padding: 25px;
    border-right: 1px dashed rgba(241, 153, 126,.5);
    border-left: 1px dashed rgba(241, 153, 126,.5);
    border-bottom: 1px dashed rgba(241, 153, 126,.5);
    -webkit-transition: all ease-in-out .3s;
    -o-transition: all ease-in-out .3s;
    transition: all ease-in-out .3s;
}
.dk_s_b p{
    display: block;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    -webkit-transition: all ease-in-out .3s;
    -o-transition: all ease-in-out .3s;
    transition: all ease-in-out .3s;
}
.dk_s_b .dk_but{
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    padding:0;
}
.dk_s_b-img{
    position: absolute;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: top center;
       object-position: top center;
    opacity: 0;
    -webkit-transition: all ease-in-out .5s;
    -o-transition: all ease-in-out .5s;
    transition: all ease-in-out .5s;
    z-index: -1;
}
.dk_s_b:hover p,
.dk_s_b:focus p,
.dk_s_b:hover .dk_but,
.dk_s_b:focus .dk_but{
    max-height: 10000px;
    opacity: 1;
}
.dk_s_b:hover .dk_but,
.dk_s_b:focus .dk_but{
    padding: 15px 30px;
}
.dk_s--c:hover > * {
  opacity: 0.3;
}
.dk_s--c:hover > *:hover {
  opacity: 1;
  border-right: 1px dashed rgba(241, 153, 126,1);
  border-left: 1px dashed rgba(241, 153, 126,1);
  border-bottom: 1px dashed rgba(241, 153, 126,1);
}
.dk_s--c:hover > *:hover .dk_s_b-img{
    opacity: .15;
}
.dk_s--d{
}
.dk_s--d-block{
    margin: 50px 7vw;
    width: 86vw;
}
.dk_s--d-block-l{
    position: relative;
    margin: 0;
    width: 100vw;
}
.dk_name{
    font-size: .8em;
    margin: 5px 7vw 0;
}
.dk_resume{
position: absolute;
bottom: 0;
left: 0;
right: 0;
top: 0;
max-height: 0;
background: rgba(32, 31, 40,.8);
-webkit-transition: all ease-in-out .6s;
-o-transition: all ease-in-out .6s;
transition: all ease-in-out .6s;
overflow: hidden;
opacity: 0;
}
.dk_name:hover + .dk_resume,
.dk_resume:hover{
    max-height: 10000px;
    overflow: auto;
    padding: 15px 7vw;
    opacity: 1;
}
.dk_mes{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-pack: distribute;
        justify-content: space-around;
    margin: 25px 0;
    max-width: 400px;
}
.dk_mes-i{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin: 0 15px 15px 0;
    color: #E9E7E9;
    text-decoration: none;
}
.dk_mes-i svg{
    margin-right: 5px;
}
.dk_mes-i:hover{
    color: #ffffff;
    text-decoration: none;
}
@media (min-width:768px) {
    .dk_s--c{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
    .dk_s_b{
        width: 25%;
        padding: 100px 25px;
        border-bottom: none;
        min-height: 455px
    }
    .dk_s_b:hover{
        width: 100%;
    }
    .dk_s--c:hover > *:hover {
      opacity: 1;
      border-right: 1px dashed rgba(241, 153, 126,1);
      border-left: 1px dashed rgba(241, 153, 126,1);
      border-bottom: none;
    }
    .dk_s--d{
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin: 0;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }
    .dk_s--d-block{
        width: 50%;
        margin: 0;
    }
    .dk_s--d-block-r{
        padding: 50px 7vw;
    }
    .dk_s--d-block-l img{
        -webkit-box-shadow: 20px 20px 40px rgb(15 15 15 / 60%);
                box-shadow: 20px 20px 40px rgb(15 15 15 / 60%);
    }
    .dk_s_b-b{
        position: absolute;
        top: 175px;
        padding-right: 25px;
        left: 25px;
    }
}
@media (min-width:1024px) {
    .dk_s_b-b{
        top: 150px;
    }
    .dk_s_b{
        min-height: 370px;
    }
}