html{
margin:0;
padding:0;
-webkit-text-size-adjust:100%;
-ms-text-size-adjust:100%;
perspective:unset !important;
-webkit-perspective:unset !important
}
*{
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box
}
::-moz-selection{
background:#6aa6d1;
color:#fff
}
::selection{
background:#6aa6d1;
color:#fff
}
body{
font-family:"PT Sans",Arial,Tahoma;
font-size:16px;
line-height:20px;
margin:0;
padding:0;
background:#f9f9f9;
color:#333
}
a{
color:#333;
text-decoration:none;
transition:color .5s
}
a:hover{
color:#24a3f1;
text-decoration:underline
}
.flexbox{
display:flex
}
.flexbox.flexbox-center{
align-items:center
}
.is-only-mobile,.is-only-mobile-block{
display:none
}
body.mobile .is-only-mobile{
display:inline !important
}
body.mobile .is-not-mobile{
display:none !important
}
body.mobile .is-only-mobile-block{
display:block !important
}
body.mobile .mobile-column-reverse{
flex-direction:column-reverse
}
body.mobile .mobile-column{
flex-direction:column
}
body.mobile .flexbox.mobile-column-left{
align-items:start !important
}
body.mobile .flexbox.mobile-column-center{
align-items:center !important
}
body.mobile .mobile-no-margin{
margin:0 !important
}
body.mobile .mobile-no-padding{
padding:0 !important
}
body.mobile .mobile-no-right{
margin-left:0 !important
}
body.mobile .mobile-no-left{
margin-right:0 !important
}
body.mobile .mobile-fullsize{
width:100% !important
}
body.mobile .mobile-last{
margin-bottom:15px !important
}
body.mobile .mobile-school{
width:70% !important
}
body.mobile .mobile-driver{
padding-left:20px !important
}
.is-only-tablet{
display:none
}
body.tablet .is-only-tablet{
display:block
}
body.tablet .is-not-tablet{
display:none !important
}
.field{
overflow:hidden
}
.field select,.field textarea,.field input{
border:1px solid #ccc;
box-shadow:inset 0 1px 3px #ddd;
background:#fff;
border-radius:8px;
height:64px;
padding-left:15px;
padding-right:15px;
padding-top:22px;
font-size:16px;
font-family:Arial !important;
line-height:20px;
outline:0;
width:100%;
color:#333;
font-weight:bold
}
.field select:hover,.field textarea:hover,.field input:hover{
border-color:#b6b6b6
}
.field select::placeholder,.field textarea::placeholder,.field input::placeholder{
opacity:0;
color:#9e9e9e
}
.field select:-ms-input-placeholder,.field textarea:-ms-input-placeholder,.field input:-ms-input-placeholder{
color:#fff
}
.field select::-moz-placeholder,.field textarea::-moz-placeholder,.field input::-moz-placeholder{
opacity:0;
color:#9e9e9e
}
.field select::-ms-input-placeholder,.field textarea::-ms-input-placeholder,.field input::-ms-input-placeholder{
opacity:0;
color:#9e9e9e
}
.field select::-webkit-input-placeholder,.field textarea::-webkit-input-placeholder,.field input::-webkit-input-placeholder{
opacity:0;
color:#9e9e9e
}
.field select:active,.field textarea:active,.field input:active,.field select:focus,.field textarea:focus,.field input:focus{
border-color:#129fea
}
.field select:active::placeholder,.field textarea:active::placeholder,.field input:active::placeholder,.field select:focus::placeholder,.field textarea:focus::placeholder,.field input:focus::placeholder{
opacity:1
}
.field select:active::-moz-placeholder,.field textarea:active::-moz-placeholder,.field input:active::-moz-placeholder,.field select:focus::-moz-placeholder,.field textarea:focus::-moz-placeholder,.field input:focus::-moz-placeholder{
opacity:1
}
.field select:active::-ms-input-placeholder,.field textarea:active::-ms-input-placeholder,.field input:active::-ms-input-placeholder,.field select:focus::-ms-input-placeholder,.field textarea:focus::-ms-input-placeholder,.field input:focus::-ms-input-placeholder{
opacity:1
}
.field select:active::-webkit-input-placeholder,.field textarea:active::-webkit-input-placeholder,.field input:active::-webkit-input-placeholder,.field select:focus::-webkit-input-placeholder,.field textarea:focus::-webkit-input-placeholder,.field input:focus::-webkit-input-placeholder{
opacity:1
}
.field select:active+label,.field textarea:active+label,.field input:active+label,.field select:focus+label,.field textarea:focus+label,.field input:focus+label,.field select:valid+label,.field textarea:valid+label,.field input:valid+label,.field select:disabled+label,.field textarea:disabled+label,.field input:disabled+label{
font-size:14px;
line-height:34px
}
.field select:disabled,.field textarea:disabled,.field input:disabled{
background:#f0f0f0
}
.field select::-ms-clear,.field textarea::-ms-clear,.field input::-ms-clear{
display:none
}
.field.invalid select,.field.invalid input,.field.invalid textarea{
background:#fffdb8
}
.field.invalid textarea+label{
background:#fffdb8
}
.field.invalid select::placeholder,.field.invalid input::placeholder,.field.invalid textarea::placeholder{
color:#bdbb6d
}
.field.invalid select::-moz-placeholder,.field.invalid input::-moz-placeholder,.field.invalid textarea::-moz-placeholder{
color:#bdbb6d
}
.field.invalid select::-ms-input-placeholder,.field.invalid input::-ms-input-placeholder,.field.invalid textarea::-ms-input-placeholder{
color:#bdbb6d
}
.field.invalid select::-webkit-input-placeholder,.field.invalid input::-webkit-input-placeholder,.field.invalid textarea::-webkit-input-placeholder{
color:#bdbb6d
}
.field.invalid select:-ms-input-placeholder,.field.invalid input:-ms-input-placeholder,.field.invalid textarea:-ms-input-placeholder{
color:#fffdb8
}
.field select+label:before{
content:"";
position:absolute;
right:0;
top:28px;
width:0;
height:0;
border-left:5px solid transparent;
border-right:5px solid transparent;
border-top:10px solid #000
}
.field label{
position:absolute;
font-size:16px;
left:16px;
right:16px;
top:0;
color:#6b6b6b;
z-index:10;
transition:line-height .15s ease-out,font-size .15s ease-out;
cursor:text;
white-space:nowrap;
pointer-events:none;
line-height:64px
}
.field textarea{
min-height:66px;
height:auto;
padding-top:34px;
min-width:100%;
max-width:100%
}
.field textarea+label{
background:#fff;
top:1px;
right:20px
}
@-moz-document url-prefix(){
.field textarea+label{
top:2px
}
}
.field-date{
text-align:left;
white-space:nowrap;
height:64px;
padding-left:15px;
padding-right:15px
}
.field-date label{
position:absolute;
left:16px;
right:16px;
top:0;
color:#6b6b6b;
z-index:10;
cursor:text;
white-space:nowrap;
font-size:14px;
line-height:34px;
height:30px
}
.field-date .bg{
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
border:1px solid #ccc;
box-shadow:inset 0 1px 3px #ddd;
background:#fff;
border-radius:8px;
z-index:0
}
.field-date select{
margin-top:32px;
border:0 none;
font-size:16px;
font-family:Arial !important;
line-height:20px;
outline:0;
color:#333;
font-weight:bold;
z-index:1;
background:#fff
}
.field-date select.day{
width:34px
}
.field-date select.month{
margin-left:6px
}
.field-date select.month[data-value="0"]{
width:78px
}
.field-date select.month[data-value="1"]{
width:92px
}
.field-date select.month[data-value="2"]{
width:60px
}
.field-date select.month[data-value="3"]{
width:78px
}
.field-date select.month[data-value="4"]{
width:52px
}
.field-date select.month[data-value="5"]{
width:64px
}
.field-date select.month[data-value="6"]{
width:64px
}
.field-date select.month[data-value="7"]{
width:72px
}
.field-date select.month[data-value="8"]{
width:94px
}
.field-date select.month[data-value="9"]{
width:84px
}
.field-date select.month[data-value="10"]{
width:76px
}
.field-date select.month[data-value="11"]{
width:84px
}
.field-date select.month.incline[data-value="0"]{
width:74px
}
.field-date select.month.incline[data-value="1"]{
width:88px
}
.field-date select.month.incline[data-value="2"]{
width:64px
}
.field-date select.month.incline[data-value="3"]{
width:74px
}
.field-date select.month.incline[data-value="4"]{
width:48px
}
.field-date select.month.incline[data-value="5"]{
width:60px
}
.field-date select.month.incline[data-value="6"]{
width:60px
}
.field-date select.month.incline[data-value="7"]{
width:76px
}
.field-date select.month.incline[data-value="8"]{
width:90px
}
.field-date select.month.incline[data-value="9"]{
width:80px
}
.field-date select.month.incline[data-value="10"]{
width:74px
}
.field-date select.month.incline[data-value="11"]{
width:82px
}
.field-date select.year{
margin-left:6px;
width:56px
}
.field-date select:active ~ div.bg,.field-date select:focus ~ div.bg{
border-color:#129fea
}
.field-date .arrow{
white-space:nowrap;
width:0;
height:0;
position:absolute;
bottom:17px;
border-left:5px solid transparent;
border-right:5px solid transparent;
border-top:10px solid #000;
z-index:2;
margin-top:9px;
pointer-events:none;
user-select:none;
display:inline-block;
margin-left:-14px
}
@-moz-document url-prefix(){
.field-date .arrow{
bottom:16px;
margin-left:-12px
}
}
.field-date.month select.month{
margin-left:0
}
@-moz-document url-prefix(){
.field-date.month .arrow{
bottom:15px
}
}
.field-date:hover .bg{
border-color:#b6b6b6
}
.field-date.disabled select{
color:#888;
background:#e9e9e9
}
.field-date.disabled .bg{
background:#e9e9e9
}
.field-date.disabled .arrow{
border-top-color:#888
}
.field-date.invalid .bg{
background:#fffdb8
}
.field-date.invalid select{
background:#fffdb8
}
.field-checkbox input{
position:absolute;
opacity:0;
left:0;
height:20px;
width:20px
}
.field-checkbox input+label:before{
content:"";
position:absolute;
width:24px;
height:24px;
border:1px solid #d8d8d8;
background:#fff;
border-radius:4px;
margin-left:-34px
}
.field-checkbox input+label:after{
content:"";
border-bottom:4px solid #fff;
border-left:4px solid #fff;
width:0;
height:6px;
position:absolute;
left:5px;
top:6px;
transform:rotate(-45deg);
transition:width .3s
}
.field-checkbox input:active+label:before,.field-checkbox input:focus+label:before{
border-color:#129fea !important
}
.field-checkbox input:checked:active+label:before,.field-checkbox input:checked:focus+label:before{
border-color:#1d76e0 !important
}
.field-checkbox input:checked+label:before{
background-color:#338ffc;
border-color:#338ffc
}
.field-checkbox input:checked+label:after{
width:12px
}
.field-checkbox:hover label:before{
border-color:#b6b6b6
}
.field-checkbox label{
pointer-events:unset;
position:static;
line-height:26px !important;
font-size:16px !important;
padding-left:34px;
cursor:default
}
.field-checkbox.black label{
color:#333
}
.field,.field-date{
position:relative;
text-align:left;
margin-bottom:15px
}
.field.last,.field-date.last{
margin-bottom:0
}
.field select,.field-date select{
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
position:relative
}
.field select::-ms-expand,.field-date select::-ms-expand{
display:none
}
.field-photo{
width:222px;
height:222px;
background:url("../svg/material/outline-camera_alt-24px.svg") center 62px no-repeat #fff;
background-size:48px;
border:1px solid #ccc;
box-shadow:inset 0 1px 3px #ddd;
border-radius:8px;
overflow:hidden
}
.field-photo input{
width:100%;
height:100%;
opacity:0;
z-index:1;
position:absolute
}
.field-photo label{
white-space:normal;
text-align:center
}
.field-photo label.big{
top:90px;
font-size:14px;
line-height:58px !important
}
.field-photo label.small{
top:auto;
bottom:10px;
font-size:12px;
line-height:16px !important;
color:#929292
}
.field-photo .view{
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
overflow:hidden;
z-index:0
}
.field-photo .delete{
opacity:.5;
position:absolute;
right:12px;
top:12px;
display:none;
transition:opacity .5s;
cursor:pointer;
z-index:2;
background:#fff;
padding:5px;
border-radius:100%
}
.field-photo .delete:hover{
opacity:1
}
.field-photo:hover{
border-color:#b6b6b6
}
.field-photo.filled label{
display:none
}
.field-photo.filled .preview{
display:block
}
.field-photo.filled:hover .delete{
display:block
}
.field-set{
box-shadow:0 1px 3px 0 rgba(0,0,0,0.3);
border-radius:8px;
line-height:40px;
overflow:hidden;
display:flex;
color:#5f5f5f
}
.field-set>div{
border-right:1px solid #dedede;
text-align:center;
cursor:pointer;
width:100%
}
.field-set>div:hover{
background-color:#f2f2f2
}
.field-set>div:active{
box-shadow:inset 0 1px 1px rgba(0,0,0,0.1);
background-color:#f2f2f2
}
.field-set>div.selected{
color:#fff;
cursor:default;
box-shadow:inset 0 1px 1px rgba(0,0,0,0.1);
background-color:#869fb1;
text-shadow:1px 1px 0 rgba(0,0,0,0.2)
}
.field-set>div:last-of-type{
border-right:0
}
body.tablet .field textarea+label{
top:3px
}
body.tablet .field-date .arrow{
margin-left:-10px
}
.agreement{
padding-left:36px
}
.agreement .field{
overflow:visible
}
.agreement .field input{
left:-35px
}
.agreement .field input+label:before{
margin-left:-35px
}
.agreement .field input+label:after{
margin-left:-35px
}
.agreement .field label{
white-space:normal;
line-height:16px !important;
font-size:14px !important;
padding-left:0
}
.agreement .field label a{
color:#24a3f1;
text-decoration:underline
}
body.mobile .field textarea+label{
top:3px
}
body.mobile .field-date .arrow{
margin-left:-10px
}
section.buttons{
padding-bottom:30px
}
section.buttons .right{
margin-left:15px
}
.button{
height:52px;
line-height:52px;
border:0;
outline:0;
font-family:"PT Sans";
font-weight:bold;
line-height:20px;
font-size:16px;
color:#333;
box-shadow:0 1px 2px 0 rgba(0,0,0,0.2),0 1px 3px 0 rgba(0,0,0,0.1);
border-radius:8px;
padding:0 20px;
cursor:pointer;
transition:background .5s;
margin: 5px;
}
.button:hover{
color:#333;
text-decoration:none
}
.button.yellow{
background:#ffea2e
}
.button.yellow:hover{
background:#f2de2a
}
.button.yellow:active{
box-shadow:inset 0 1px 2px 0 rgba(0,0,0,0.2),inset 0 1px 3px 0 rgba(0,0,0,0.1)
}
.button.yellow:disabled{
background:#f9f9f9;
color:gray;
box-shadow:0 1px 2px 0 rgba(0,0,0,0.2),0 1px 3px 0 rgba(0,0,0,0.1)
}
.button.gray,.button.add{
box-shadow:0 3px 6px 0 rgba(0,0,0,0.23),0 3px 6px 0 rgba(0,0,0,0.16)
}
.button.gray:hover,.button.add:hover{
background-color:#f2f2f2
}
.button.gray:active,.button.add:active{
box-shadow:inset 0 1px 2px 0 rgba(0,0,0,0.2),inset 0 1px 3px 0 rgba(0,0,0,0.1)
}
.button.add{
width:50px;
height:50px;
background:url("../../../resume/res/svg/actions/add.svg") #fff no-repeat 17px 17px
}
.button.scroll{
width:40px;
height:40px;
box-shadow:0 3px 6px 0 rgba(0,0,0,0.23),0 3px 6px 0 rgba(0,0,0,0.16);
background:url("../../../resume/res/svg/arrows/up-white.svg") #53809e no-repeat center center
}
.button.scroll:hover{
background-color:#53809e
}
.button.scroll:active{
box-shadow:inset 0 1px 2px 0 rgba(0,0,0,0.2),inset 0 1px 3px 0 rgba(0,0,0,0.1)
}
.button.back{
box-shadow:0 3px 6px 0 rgba(0,0,0,0.23),0 3px 6px 0 rgba(0,0,0,0.16);
background:#fff url("../../../resume/res/svg/arrows/left.svg") 20px center no-repeat;
padding-left:50px;
padding-right:20px
}
.button.back:hover{
background-color:#f9f9f9
}
.button.back:active{
box-shadow:inset 0 1px 2px 0 rgba(0,0,0,0.2),inset 0 1px 3px 0 rgba(0,0,0,0.1)
}
body.mobile .button.back{
padding-right:50px
}
.auth{
max-width:600px;
margin:0 auto;
padding:10px
}
.login__title{
font-size:18px;
line-height:18px;
font-weight:bold;
margin-top:20px;
margin-bottom:10px;
display:none
}
.login__message{
font-size:14px;
margin-top:16px
}
.login__message--post{
color:#838383;
padding-bottom:10px
}
.login__message--pre{
margin-top:30px
}
.login__button{
margin-top:16px;
width:100%
}
.login__contact,.login__code{
margin-top:10px
}
.login__error{
background:#f2dede;
border:1px solid #ebccd1;
padding:10px 15px;
color:#a94442;
font-size:14px;
text-align:center;
line-height:18px;
border-radius:8px;
margin-top:16px
}
.login__repeat{
text-align:center;
font-size:12px;
text-decoration:underline;
color:#24a3f1;
margin-top:10px;
cursor:pointer
}
.login .field{
margin-bottom:0
}
body.mobile .login__title{
display:block
}
body.mobile .login__message--pre{
margin-top:30px
}
.logout__name{
margin-top:20px;
font-weight:bold;
font-size:16px
}
.logout__label{
color:#838383;
font-size:14px;
margin-top:10px
}
.logout__value{
font-size:14px;
margin-top:2px
}
.logout__value__red{
color:red
}
.logout__value__green{
color:green
}
.logout__create{
margin-top:6px;
text-align:center;
display:block;
line-height:50px;
height:50px;
cursor:pointer
}
.logout__button{
margin-top:20px;
text-align:center;
display:block;
line-height:50px;
height:50px
}
.logout__button__icon{
display:inline-block;
width:24px;
height:24px;
vertical-align:middle;
background:url("../svg/logout.svg") transparent no-repeat;
margin-right:10px
}
.logout__resume{
position:relative;
display:flex;
padding:16px;
background:#fff;
border:1px solid #dedede;
box-shadow:-1px 3px 9px 0 #dedede;
border-radius:8px;
margin-top:6px
}
.logout__resume__left{
width:100%;
overflow:hidden
}
.logout__resume__right{
flex-shrink:0;
padding-left:20px
}
.logout__resume__last{
flex-shrink:0;
padding-left:10px
}
.logout__resume__button{
height:40px;
line-height:40px;
display:inline-block
}
.logout__resume__delete{
height:40px;
line-height:40px;
padding:0 8px;
display:flex;
transition:none;
align-items:center
}
.logout__resume__delete:hover{
background:#f74400
}
.logout__resume__delete:hover img{
fill:#fff
}
.logout__resume__delete:active{
background:#c7181f
}
.logout__resume__delete img{
width:24px;
height:24px;
fill:#000
}
.logout__resume__updated{
color:#999;
font-style:italic;
font-size:12px;
cursor:default
}
.logout__resume__position{
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
cursor:default
}
.logout__resume:hover{
border-color:#6aa6d1
}
body.mobile .logout__button{
margin-bottom:10px
}
body.mobile .logout__resume__delete:hover{
background:inherit !important
}
body.mobile .logout__resume__delete:active{
background:#f74400 !important
}
body{
background:#fff
}
html{
margin:0;
padding:0;
-webkit-text-size-adjust:100%;
-ms-text-size-adjust:100%;
perspective:unset !important;
-webkit-perspective:unset !important
}
*{
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box
}
::-moz-selection{
background:#6aa6d1;
color:#fff
}
::selection{
background:#6aa6d1;
color:#fff
}
body{
font-family:"PT Sans",Arial,Tahoma;
font-size:16px;
line-height:20px;
margin:0;
padding:0;
background:#f9f9f9;
color:#333
}
a{
color:#333;
text-decoration:none;
transition:color .5s
}
a:hover{
color:#24a3f1;
text-decoration:underline
}
.flexbox{
display:flex
}
.flexbox.flexbox-center{
align-items:center
}
.overview{
background:url("../i/bg.jpg") center center no-repeat;
background-size:cover;
text-align:center
}
.overview>div{
background: rgb(0 117 239 / 85%);
padding:75px 10px 80px 10px
}
.overview h1{
margin:0;
color:#fff;
font-size:48px;
font-weight:bold;
line-height:62px
}
.overview h3{
font-size:18px;
line-height:24px;
color:#fff;
margin:20px auto;
font-weight:normal;
max-width:600px
}
.overview button{
width:220px
}
.overview .how{
margin:20px 0 24px 0
}
.overview .how span,.overview .how a{
color:#fff;
margin-left:26px;
cursor:pointer;
font-size:16px;
line-height:20px;
position:relative
}
.overview .how span:before,.overview .how a:before{
content:"";
position:absolute;
width:24px;
height:24px;
opacity:.75;
left:-31px
}
.overview .how a{
border-bottom:1px #fff solid
}
.overview .how a:hover{
text-decoration:none
}
.overview .how .play{
border-bottom:1px #fff dotted
}
.overview .how .play:before{
background:url("../svg/material/baseline-play_circle_filled-24px.svg")
}
.overview .how .examples:before{
background:url("../svg/material/baseline-view_module-24px.svg")
}
.overview .count{
margin:18px 0;
text-align:center;
color:#fff;
font-size:14px
}
.overview .count span{
display:inline-block;
padding-left:20px
}
.overview .count span:before{
content:"";
position:absolute;
margin-left:-16px;
margin-top:6px;
width:8px;
height:8px;
border-radius:4px;
background-color:#fff;
animation:pulse 2.5s infinite
}
body.tablet .overview>div{
padding-left:30px;
padding-right:30px
}
body.mobile .overview>div{
padding:20px 20px 40px 20px
}
body.mobile .overview h1{
/* font-size:20px;
line-height:20px;
margin:10px 0 */
}
body.mobile .overview h3{
font-size:16px;
margin-bottom:26px;
line-height:20px
}
body.mobile .overview .how span,body.mobile .overview .how a{
font-size:14px
}
body.shared section.overview{
display:none
}
@keyframes pulse{
0%{
opacity:1
}
50%{
opacity:0
}
100%{
opacity:1
}
}
section.buttons{
padding-bottom:30px
}
section.buttons .right{
margin-left:15px
}
.button{
font-family: "PT Sans",Arial,Tahoma;
height:52px;
line-height:52px;
border:0;
outline:0;
font-weight:bold;
line-height:20px;
font-size:16px;
color:#333;
box-shadow:0 1px 2px 0 rgba(0,0,0,0.2),0 1px 3px 0 rgba(0,0,0,0.1);
border-radius:8px;
padding:0 20px;
cursor:pointer;
transition:background .5s
}
.button:hover{
color:#333;
text-decoration:none
}
.button.yellow{
background:#ffea2e
}
.button.yellow:hover{
background:#f2de2a
}
.button.yellow:active{
box-shadow:inset 0 1px 2px 0 rgba(0,0,0,0.2),inset 0 1px 3px 0 rgba(0,0,0,0.1)
}
.button.yellow:disabled{
background:#f9f9f9;
color:gray;
box-shadow:0 1px 2px 0 rgba(0,0,0,0.2),0 1px 3px 0 rgba(0,0,0,0.1)
}
.button.gray,.button.add{
box-shadow:0 3px 6px 0 rgba(0,0,0,0.23),0 3px 6px 0 rgba(0,0,0,0.16)
}
.button.gray:hover,.button.add:hover{
background-color:#f2f2f2
}
.button.gray:active,.button.add:active{
box-shadow:inset 0 1px 2px 0 rgba(0,0,0,0.2),inset 0 1px 3px 0 rgba(0,0,0,0.1)
}
.button.add{
width:50px;
height:50px;
background:url("../svg/actions/add.svg") #fff no-repeat 17px 17px
}
.button.scroll{
width:40px;
height:40px;
box-shadow:0 3px 6px 0 rgba(0,0,0,0.23),0 3px 6px 0 rgba(0,0,0,0.16);
background:url("../svg/arrows/up-white.svg") #53809e no-repeat center center
}
.button.scroll:hover{
background-color:#53809e
}
.button.scroll:active{
box-shadow:inset 0 1px 2px 0 rgba(0,0,0,0.2),inset 0 1px 3px 0 rgba(0,0,0,0.1)
}
.button.back{
box-shadow:0 3px 6px 0 rgba(0,0,0,0.23),0 3px 6px 0 rgba(0,0,0,0.16);
background:#fff url("../svg/arrows/left.svg") 20px center no-repeat;
padding-left:50px;
padding-right:20px
}
.button.back:hover{
background-color:#f9f9f9
}
.button.back:active{
box-shadow:inset 0 1px 2px 0 rgba(0,0,0,0.2),inset 0 1px 3px 0 rgba(0,0,0,0.1)
}
body.mobile .button.back{
padding-right:50px
}
section.about{
background:#fff;
box-shadow:0 1px 2px 0 rgba(0,0,0,0.2),0 1px 3px 0 rgba(0,0,0,0.1);
border-radius:8px;
display:flex;
max-width:780px;
margin:0 auto
}
section.about>div{
padding:30px;
flex:1
}
section.about>div>img{
width:60px;
height:60px
}
section.about>div>h5{
font-size:14px;
line-height:18px;
color:#333;
margin:10px 0 0 0
}
section.about>div>p{
font-size:14px;
line-height:18px;
color:gray;
margin:10px 0 0 0
}
body.table section.about{
max-width:none;
margin-left:40px;
margin-right:40px
}
body.mobile section.about{
overflow:hidden;
display:flex
}
body.tablet header .box{
width:auto;
margin-left:40px;
margin-right:40px
}
body.mobile header{
height:auto;
box-shadow:none
}
body.mobile header .box{
margin:0;
width:100%;
flex-direction:column;
border-bottom:1px solid #d8d8d8
}
body.mobile header .box .hamburger{
width:20px;
height:17px;
border-top:3px solid #5f5f5f;
border-bottom:3px solid #5f5f5f;
position:absolute;
display:block;
cursor:pointer;
left:20px;
top:28px
}
body.mobile header .box .hamburger:after{
content:" ";
position:absolute;
width:20px;
height:3px;
background:#5f5f5f;
margin-top:4px
}
body.mobile header .box .hamburger:before{
content:"";
position:absolute;
background:#fff;
opacity:0;
width:75px;
height:75px;
top:-32px;
left:-20px
}
body.shared header{
display:none
}
section.page{
background:#f9f9f9;
text-align:center;
padding:0 10px
}
section.page .block{
max-width:780px;
margin:0 auto
}
section.page section.border{
background:#fff;
box-shadow:0 1px 2px 0 rgba(0,0,0,0.2),0 1px 3px 0 rgba(0,0,0,0.1);
border-radius:8px;
padding:30px;
margin-bottom:20px;
position:relative
}
section.page section.border .actions{
position:absolute;
display:none;
right:30px;
top:30px
}
section.page section.border .actions img{
cursor:pointer;
display:inline-block;
margin-left:6px;
opacity:.5;
transition:opacity .5s;
background:#fff
}
section.page section.border .actions img.delete{
margin-left:12px
}
section.page section.border .actions img:hover{
opacity:1
}
section.page section.border:hover .actions{
display:block
}
section.page section.border:first-of-type .actions .up{
display:none
}
section.page section.border:last-of-type .actions .down{
display:none
}
body.tablet section.page .block{
max-width:none;
margin-left:40px;
margin-right:40px
}
body.tablet section.page section.border .actions{
display:block
}
body.mobile section.page{
padding:0 20px;
overflow:hidden;
background:#fff
}
body.mobile section.border{
padding:20px;
border:1px solid #e6e6e6
}
body.mobile section.border .actions{
display:block;
top:auto;
right:0
}
body.mobile section.border .actions img{
margin-left:20px !important
}
body.mobile section.mobile-no-border{
padding:0;
border:0 none !important;
background:none !important;
border-radius:0;
box-shadow:none;
padding-top:20px;
border-top:1px solid #ccc !important
}
body.mobile section.mobile-no-border:first-of-type{
padding-top:0;
border-top:0 none !important
}
body.shared section.page{
background:#fff;
padding:0 20px
}
body.shared section.border{
border:1px solid #e6e6e6
}
section.process{
position:relative;
margin-top:35px !important;
margin-bottom:35px !important
}
section.process>div{
display:flex;
justify-content:space-between
}
section.process>div>span{
display:block;
font-size:14px;
color:#333;
line-height:18px;
background:#f9f9f9;
line-height:40px;
z-index:1;
padding:0 12px;
cursor:pointer;
transition:color .5s
}
section.process>div>span:hover{
color:#24a3f1
}
section.process>div>span:before{
font-size:20px;
display:inline-block;
background:#ddd;
width:40px;
height:40px;
border-radius:100%;
text-align:center;
color:#fff;
margin-right:10px
}
section.process>div>span.step1{
padding-left:0
}
section.process>div>span.step1:before{
content:"1"
}
section.process>div>span.step2:before{
content:"2"
}
section.process>div>span.step3{
padding-right:0
}
section.process>div>span.step3:before{
content:"3"
}
section.process>div>span.active{
font-weight:bold
}
section.process>div>span.active:before{
background:#8cc453;
font-weight:bold
}
section.process.active1>div>.step1,section.process.active2>div>.step1,section.process.active3>div>.step1{
font-weight:bold
}
section.process.active1>div>.step1:before,section.process.active2>div>.step1:before,section.process.active3>div>.step1:before{
background:#8cc453;
font-weight:bold
}
section.process.active2>div>.step2,section.process.active3>div>.step2{
font-weight:bold
}
section.process.active2>div>.step2:before,section.process.active3>div>.step2:before{
background:#8cc453;
font-weight:bold
}
section.process.active3>div>.step3{
font-weight:bold
}
section.process.active3>div>.step3:before{
background:#8cc453;
font-weight:bold
}
section.process>hr{
z-index:0;
position:absolute;
width:100%;
border-top:1px solid #d8d8d8;
border-bottom:0 none;
margin-top:-18px;
left:0;
display:inline-block
}
body.mobile section.process{
/* margin:30px 0 20px 0 !important */
}
body.mobile section.process>div>span{
position:relative;
text-align:center;
padding:40px 0 0 0;
flex-basis:100%;
flex-shrink:1;
flex-grow:1;
background:0
}
body.mobile section.process>div>span:before{
position:absolute;
margin-top:-40px;
margin-left:-20px;
left:50%
}
body.mobile section.process>hr{
left:15%;
width:70%;
margin-top:-60px
}
body.shared section.process{
margin-top:20px !important
}
body.shared section.process>div>span{
background:#fff
}
body.mobile section.process>div>span{
background:#fff
}
@font-face{
font-family:'social-icon';
src:url('/resume/res/share/social-icon.eot?pzyb1y');
src:url('/resume/res/share/social-icon.eot?pzyb1y#iefix') format('embedded-opentype'),url('/resume/res/share/social-icon.ttf?pzyb1y') format('truetype'),url('/resume/res/share/social-icon.woff?pzyb1y') format('woff'),url('/resume/res/share/social-icon.svg?pzyb1y#social-icon') format('svg');
font-weight:normal;
font-style:normal
}
.social-button__icon:before{
font-family:'social-icon' !important;
speak:none;
font-style:normal;
font-weight:normal;
font-variant:normal;
text-transform:none;
line-height:1;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale
}
.b-social-button--googleplus .social-button__icon:before{
content:"\e907"
}
.b-social-button--facebook .social-button__icon:before{
content:"\e90a"
}
.b-social-button--odnoklassniki .social-button__icon:before{
content:"\e909"
}
.b-social-button--vkontakte .social-button__icon:before{
content:"\e904"
}
.b-social-button--twitter .social-button__icon:before{
content:"\e905"
}
.b-social-button--moimir .social-button__icon:before{
content:"\e908"
}
.b-social-button--lj .social-button__icon:before{
content:"\e901"
}
.b-social-button--linkedin .social-button__icon:before{
content:"\e906"
}
.container-social-buttons{
font-size:0
}
.container-social-buttons *{
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box
}
.b-social-button{
display:inline-block;
font-size:28px;
color:#000;
cursor:pointer;
border-radius:8px
}
.b-social-button:last-child{
border-right:0
}
.b-social-button .social-button__components{
padding:0 4px;
display:table-cell;
table-layout:fixed;
width:100%
}
.b-social-button .social-button__icon{
display:table-cell;
vertical-align:middle;
padding:.2em;
line-height:1px
}
.b-social-button .social-button__text,.b-social-button .social-button__count{
display:table-cell;
font-size:.5em;
padding:5px 8px;
vertical-align:middle;
padding-left:0
}
.b-social-button .social-button__count--empty[data-count='0']{
display:none
}
.b-social-button--default{
background:#efefef
}
.b-social-button--default .social-button__components>div{
border-right:1px solid #e0e0e0
}
.b-social-button--default .social-button__components>div:last-child{
border-right:0
}
.b-social-button--default .social-button__icon{
background:#FFF
}
.b-social-button--default .social-button__icon:before{
color:#a9adb6
}
.b-social-button--default:hover{
background:#FFF
}
.b-social-button--default:hover .social-button__icon{
border-right-color:transparent
}
.b-social-button--default:hover .social-button__icon:before{
color:#FFF
}
.b-social-button--default.b-social-button--googleplus:hover .social-button__icon{
background-color:#c25234
}
.b-social-button--default.b-social-button--facebook:hover .social-button__icon{
background-color:#3c5a98
}
.b-social-button--default.b-social-button--odnoklassniki:hover .social-button__icon{
background-color:#ff9f4d
}
.b-social-button--default.b-social-button--vkontakte:hover .social-button__icon{
background-color:#48729e
}
.b-social-button--default.b-social-button--twitter:hover .social-button__icon{
background-color:#00aced
}
.b-social-button--default.b-social-button--moimir:hover .social-button__icon{
background-color:#2164ad
}
.b-social-button--default.b-social-button--lj:hover .social-button__icon{
background-color:#0d425a
}
.b-social-button--default.b-social-button--linkedin:hover .social-button__icon{
background-color:#0083be
}
.b-social-button--color{
margin-right:10px;
background-color:#FFF
}
.b-social-button--color .social-button__components{
color:#FFF
}
.b-social-button--color.b-social-button--googleplus{
background-color:#c25234
}
.b-social-button--color.b-social-button--googleplus:hover{
background-color:#ae4a2f
}
.b-social-button--color.b-social-button--facebook{
background-color:#3c5a98
}
.b-social-button--color.b-social-button--facebook:hover{
background-color:#354f86
}
.b-social-button--color.b-social-button--odnoklassniki{
background-color:#ff9f4d
}
.b-social-button--color.b-social-button--odnoklassniki:hover{
background-color:#ff9133
}
.b-social-button--color.b-social-button--vkontakte{
background-color:#48729e
}
.b-social-button--color.b-social-button--vkontakte:hover{
background-color:#40658c
}
.b-social-button--color.b-social-button--twitter{
background-color:#00aced
}
.b-social-button--color.b-social-button--twitter:hover{
background-color:#0099d4
}
.b-social-button--color.b-social-button--moimir{
background-color:#2164ad
}
.b-social-button--color.b-social-button--moimir:hover{
background-color:#1d5898
}
.b-social-button--color.b-social-button--lj{
background-color:#0d425a
}
.b-social-button--color.b-social-button--lj:hover{
background-color:#0a3244
}
.b-social-button--color.b-social-button--linkedin{
background-color:#0083be
}
.b-social-button--color.b-social-button--linkedin:hover{
background-color:#0071a5
}
section.import h4{
margin:0
}
section.import p{
font-size:14px;
margin:0
}
section.import .b-social-button{
margin:10px 5px 0 5px
}
body.mobile section.import .b-social-button .social-button__text{
display:none
}
section.message{
color:#000;
font-size:14px;
line-height:18px;
display:inline-block;
border-radius:8px;
margin:25px 0 !important
}
section.message.confirm{
background:#eef6e5 url("../svg/material/outline-security-24px.svg") 15px center no-repeat;
background-size:24px;
border:1px solid #d8edc0;
padding:10px 15px 10px 50px
}
section.message.complete{
background:#eef6e5 url("../svg/material/round-check_circle_outline-24px.svg") 15px center no-repeat;
background-size:24px;
border:1px solid #d8edc0;
padding:10px 15px 10px 50px
}
section.message.alert{
background:#eef6e5 url("../svg/material/outline-notifications_active-24px.svg") 15px center no-repeat;
background-size:24px;
border:1px solid #d8edc0;
padding:10px 15px 10px 50px
}
section.message.success{
background:#eef6e5;
border:1px solid #d8edc0;
padding:10px 15px
}
section.message.warning{
background:#faf5c1;
border:1px solid #d5c136;
padding:10px 15px
}
section.message.left{
text-align:left
}
section.message.top{
margin-top:0 !important
}
body.mobile section.message{
margin-top:0 !important
}
body.mobile section.message.warning{
margin-bottom:20px !important
}
section.form{
text-align:left
}
section.form>p{
margin-top:-10px
}
section.form .flexbox>div.left{
margin-right:7px
}
section.form .flexbox>div.right{
margin-left:8px
}
section.form h3{
margin-top:36px;
text-align:left
}
section.form label.bold{
font-weight:bold
}
body.mobile section.form h3{
margin-top:20px;
margin-bottom:16px
}
.field{
overflow:hidden
}
.field select,.field textarea,.field input{
border:1px solid #ccc;
box-shadow:inset 0 1px 3px #ddd;
background:#fff;
border-radius:8px;
height:64px;
padding-left:15px;
padding-right:15px;
padding-top:22px;
font-size:16px;
font-family:Arial !important;
line-height:20px;
outline:0;
width:100%;
color:#333;
font-weight:bold
}
.field select:hover,.field textarea:hover,.field input:hover{
border-color:#b6b6b6
}
.field select::placeholder,.field textarea::placeholder,.field input::placeholder{
opacity:0;
color:#9e9e9e
}
.field select:-ms-input-placeholder,.field textarea:-ms-input-placeholder,.field input:-ms-input-placeholder{
color:#fff
}
.field select::-moz-placeholder,.field textarea::-moz-placeholder,.field input::-moz-placeholder{
opacity:0;
color:#9e9e9e
}
.field select::-ms-input-placeholder,.field textarea::-ms-input-placeholder,.field input::-ms-input-placeholder{
opacity:0;
color:#9e9e9e
}
.field select::-webkit-input-placeholder,.field textarea::-webkit-input-placeholder,.field input::-webkit-input-placeholder{
opacity:0;
color:#9e9e9e
}
.field select:active,.field textarea:active,.field input:active,.field select:focus,.field textarea:focus,.field input:focus{
border-color:#129fea
}
.field select:active::placeholder,.field textarea:active::placeholder,.field input:active::placeholder,.field select:focus::placeholder,.field textarea:focus::placeholder,.field input:focus::placeholder{
opacity:1
}
.field select:active::-moz-placeholder,.field textarea:active::-moz-placeholder,.field input:active::-moz-placeholder,.field select:focus::-moz-placeholder,.field textarea:focus::-moz-placeholder,.field input:focus::-moz-placeholder{
opacity:1
}
.field select:active::-ms-input-placeholder,.field textarea:active::-ms-input-placeholder,.field input:active::-ms-input-placeholder,.field select:focus::-ms-input-placeholder,.field textarea:focus::-ms-input-placeholder,.field input:focus::-ms-input-placeholder{
opacity:1
}
.field select:active::-webkit-input-placeholder,.field textarea:active::-webkit-input-placeholder,.field input:active::-webkit-input-placeholder,.field select:focus::-webkit-input-placeholder,.field textarea:focus::-webkit-input-placeholder,.field input:focus::-webkit-input-placeholder{
opacity:1
}
.field select:active+label,.field textarea:active+label,.field input:active+label,.field select:focus+label,.field textarea:focus+label,.field input:focus+label,.field select:valid+label,.field textarea:valid+label,.field input:valid+label,.field select:disabled+label,.field textarea:disabled+label,.field input:disabled+label{
font-size:14px;
line-height:34px
}
.field select:disabled,.field textarea:disabled,.field input:disabled{
background:#f0f0f0
}
.field select::-ms-clear,.field textarea::-ms-clear,.field input::-ms-clear{
display:none
}
.field.invalid select,.field.invalid input,.field.invalid textarea{
background:#fffdb8
}
.field.invalid textarea+label{
background:#fffdb8
}
.field.invalid select::placeholder,.field.invalid input::placeholder,.field.invalid textarea::placeholder{
color:#bdbb6d
}
.field.invalid select::-moz-placeholder,.field.invalid input::-moz-placeholder,.field.invalid textarea::-moz-placeholder{
color:#bdbb6d
}
.field.invalid select::-ms-input-placeholder,.field.invalid input::-ms-input-placeholder,.field.invalid textarea::-ms-input-placeholder{
color:#bdbb6d
}
.field.invalid select::-webkit-input-placeholder,.field.invalid input::-webkit-input-placeholder,.field.invalid textarea::-webkit-input-placeholder{
color:#bdbb6d
}
.field.invalid select:-ms-input-placeholder,.field.invalid input:-ms-input-placeholder,.field.invalid textarea:-ms-input-placeholder{
color:#fffdb8
}
.field select+label:before{
content:"";
position:absolute;
right:0;
top:28px;
width:0;
height:0;
border-left:5px solid transparent;
border-right:5px solid transparent;
border-top:10px solid #000
}
.field label{
position:absolute;
font-size:16px;
left:16px;
right:16px;
top:0;
color:#6b6b6b;
z-index:10;
transition:line-height .15s ease-out,font-size .15s ease-out;
cursor:text;
white-space:nowrap;
pointer-events:none;
line-height:64px
}
.field textarea{
min-height:66px;
height:auto;
padding-top:34px;
min-width:100%;
max-width:100%
}
.field textarea+label{
background:#fff;
top:1px;
right:20px
}
@-moz-document url-prefix(){
.field textarea+label{
top:2px
}
}
.field-date{
text-align:left;
white-space:nowrap;
height:64px;
padding-left:15px;
padding-right:15px
}
.field-date label{
position:absolute;
left:16px;
right:16px;
top:0;
color:#6b6b6b;
z-index:10;
cursor:text;
white-space:nowrap;
font-size:14px;
line-height:34px;
height:30px
}
.field-date .bg{
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
border:1px solid #ccc;
box-shadow:inset 0 1px 3px #ddd;
background:#fff;
border-radius:8px;
z-index:0
}
.field-date select{
margin-top:32px;
border:0 none;
font-size:16px;
font-family:Arial !important;
line-height:20px;
outline:0;
color:#333;
font-weight:bold;
z-index:1;
background:#fff
}
.field-date select.day{
width:34px
}
.field-date select.month{
margin-left:6px
}
.field-date select.month[data-value="0"]{
width:78px
}
.field-date select.month[data-value="1"]{
width:92px
}
.field-date select.month[data-value="2"]{
width:60px
}
.field-date select.month[data-value="3"]{
width:78px
}
.field-date select.month[data-value="4"]{
width:52px
}
.field-date select.month[data-value="5"]{
width:64px
}
.field-date select.month[data-value="6"]{
width:64px
}
.field-date select.month[data-value="7"]{
width:72px
}
.field-date select.month[data-value="8"]{
width:94px
}
.field-date select.month[data-value="9"]{
width:84px
}
.field-date select.month[data-value="10"]{
width:76px
}
.field-date select.month[data-value="11"]{
width:84px
}
.field-date select.month.incline[data-value="0"]{
width:74px
}
.field-date select.month.incline[data-value="1"]{
width:88px
}
.field-date select.month.incline[data-value="2"]{
width:64px
}
.field-date select.month.incline[data-value="3"]{
width:74px
}
.field-date select.month.incline[data-value="4"]{
width:48px
}
.field-date select.month.incline[data-value="5"]{
width:60px
}
.field-date select.month.incline[data-value="6"]{
width:60px
}
.field-date select.month.incline[data-value="7"]{
width:76px
}
.field-date select.month.incline[data-value="8"]{
width:90px
}
.field-date select.month.incline[data-value="9"]{
width:80px
}
.field-date select.month.incline[data-value="10"]{
width:74px
}
.field-date select.month.incline[data-value="11"]{
width:82px
}
.field-date select.year{
margin-left:6px;
width:56px
}
.field-date select:active ~ div.bg,.field-date select:focus ~ div.bg{
border-color:#129fea
}
.field-date .arrow{
white-space:nowrap;
width:0;
height:0;
position:absolute;
bottom:17px;
border-left:5px solid transparent;
border-right:5px solid transparent;
border-top:10px solid #000;
z-index:2;
margin-top:9px;
pointer-events:none;
user-select:none;
display:inline-block;
margin-left:-14px
}
@-moz-document url-prefix(){
.field-date .arrow{
bottom:16px;
margin-left:-12px
}
}
.field-date.month select.month{
margin-left:0
}
@-moz-document url-prefix(){
.field-date.month .arrow{
bottom:15px
}
}
.field-date:hover .bg{
border-color:#b6b6b6
}
.field-date.disabled select{
color:#888;
background:#e9e9e9
}
.field-date.disabled .bg{
background:#e9e9e9
}
.field-date.disabled .arrow{
border-top-color:#888
}
.field-date.invalid .bg{
background:#fffdb8
}
.field-date.invalid select{
background:#fffdb8
}
.field-checkbox input{
position:absolute;
opacity:0;
left:0;
height:20px;
width:20px
}
.field-checkbox input+label:before{
content:"";
position:absolute;
width:24px;
height:24px;
border:1px solid #d8d8d8;
background:#fff;
border-radius:4px;
margin-left:-34px
}
.field-checkbox input+label:after{
content:"";
border-bottom:4px solid #fff;
border-left:4px solid #fff;
width:0;
height:6px;
position:absolute;
left:5px;
top:6px;
transform:rotate(-45deg);
transition:width .3s
}
.field-checkbox input:active+label:before,.field-checkbox input:focus+label:before{
border-color:#129fea !important
}
.field-checkbox input:checked:active+label:before,.field-checkbox input:checked:focus+label:before{
border-color:#1d76e0 !important
}
.field-checkbox input:checked+label:before{
background-color:#338ffc;
border-color:#338ffc
}
.field-checkbox input:checked+label:after{
width:12px
}
.field-checkbox:hover label:before{
border-color:#b6b6b6
}
.field-checkbox label{
pointer-events:unset;
position:static;
line-height:26px !important;
font-size:16px !important;
padding-left:34px;
cursor:default
}
.field-checkbox.black label{
color:#333
}
.field,.field-date{
position:relative;
text-align:left;
margin-bottom:15px
}
.field.last,.field-date.last{
margin-bottom:0
}
.field select,.field-date select{
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
position:relative
}
.field select::-ms-expand,.field-date select::-ms-expand{
display:none
}
.field-photo{
width:222px;
height:222px;
background:url("../svg/material/outline-camera_alt-24px.svg") center 70px no-repeat #fff;
background-size:48px;
border:1px solid #ccc;
box-shadow:inset 0 1px 3px #ddd;
border-radius:8px;
overflow:hidden
}
.field-photo input{
width:100%;
height:100%;
opacity:0;
z-index:1;
position:absolute
}
.field-photo label{
white-space:normal;
text-align:center
}
.field-photo label.big{
top:100px;
font-size:14px;
line-height:58px !important
}
.field-photo label.small{
top:auto;
bottom:10px;
font-size:12px;
line-height:16px !important;
color:#929292
}
.field-photo .view{
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
overflow:hidden;
z-index:0
}
.field-photo .delete{
opacity:.5;
position:absolute;
right:12px;
top:12px;
display:none;
transition:opacity .5s;
cursor:pointer;
z-index:2;
background:#fff;
padding:5px;
border-radius:100%
}
.field-photo .delete:hover{
opacity:1
}
.field-photo:hover{
border-color:#b6b6b6
}
.field-photo.filled label{
display:none
}
.field-photo.filled .preview{
display:block
}
.field-photo.filled:hover .delete{
display:block
}
.field-set{
box-shadow:0 1px 3px 0 rgba(0,0,0,0.3);
border-radius:8px;
line-height:40px;
overflow:hidden;
display:flex;
color:#5f5f5f
}
.field-set>div{
border-right:1px solid #dedede;
text-align:center;
cursor:pointer;
width:100%
}
.field-set>div:hover{
background-color:#f2f2f2
}
.field-set>div:active{
box-shadow:inset 0 1px 1px rgba(0,0,0,0.1);
background-color:#f2f2f2
}
.field-set>div.selected{
color:#fff;
cursor:default;
box-shadow:inset 0 1px 1px rgba(0,0,0,0.1);
background-color:#73a3c7;
text-shadow:1px 1px 0 rgba(0,0,0,0.2)
}
.field-set>div:last-of-type{
border-right:0
}
body.tablet .field textarea+label{
top:3px
}
body.tablet .field-date .arrow{
margin-left:-10px
}
.agreement{
padding-left:36px
}
.agreement .field{
overflow:visible
}
.agreement .field input{
left:-35px
}
.agreement .field input+label:before{
margin-left:-35px
}
.agreement .field input+label:after{
margin-left:-35px
}
.agreement .field label{
white-space:normal;
line-height:16px !important;
font-size:14px !important;
padding-left:0
}
.agreement .field label a{
color:#24a3f1;
text-decoration:underline
}
body.mobile .field textarea+label{
top:3px
}
body.mobile .field-date .arrow{
margin-left:-10px
}
section.payments{
background:#6aa6d1 !important;
background-size:cover;
padding:0
}
section.payments .payments__title{
font-size:23px;
color:#fff;
font-weight:bold
}
section.payments .payments__list{
padding:30px 0 15px 0
}
section.payments ul{
display:flex;
padding:0;
margin:0;
text-align:left;
color:#fff;
flex-wrap:wrap;
margin-top:25px;
padding-left:30px
}
section.payments ul li{
display:block;
padding:0 20px 0 0;
margin:0;
width:50%;
white-space:nowrap;
text-overflow:ellipsis;
overflow:hidden;
margin-bottom:15px
}
section.payments ul li .name{
text-transform:capitalize
}
section.payments ul li .time{
font-size:14px
}
body.tablet section.payments{
margin-bottom:30px
}
body.mobile section.payments{
margin-top:10px;
margin-bottom:26px;
padding:0
}
body.mobile section.payments .payments__list{
padding:22px 20px 10px 20px
}
body.mobile section.payments h2{
line-height:26px
}
body.mobile section.payments ul{
display:block;
padding-left:0;
width:100%
}
body.mobile section.payments ul li{
width:100%
}
body.shared section.payments{
background:none !important
}
body.shared section.payments h2{
color:#000
}
body.shared section.payments ul{
color:#333
}
body.shared section.payments ul li .time{
color:#8a8a8a
}
section.brand{
background:#f9f9f9;
padding:30px 0 15px 0;
border-bottom:1px solid #eaeaea;
text-align:center
}
section.brand .brand__title{
font-size:23px;
color:#5d5d5d;
font-weight:bold;
line-height: 25px;
}
section.brand img{
display:inline-block;
margin:20px 30px;
opacity:.7;
vertical-align:middle;
-webkit-filter:grayscale(100%);
filter:grayscale(100%)
}
section.brand img:hover{
opacity:1;
filter:none
}
section.brand section.block{
margin-top:10px
}
body.tablet section.brand{
padding-left:50px;
padding-right:50px;
padding-top:0
}
body.mobile section.brand{
margin-top:10px;
margin-bottom:30px;
padding-bottom:10px
}
body.mobile section.brand h2{
line-height:26px
}
body.shared section.brand{
margin-top:20px;
border-bottom:0 none;
margin-bottom:20px
}
section.share{
padding:30px 0 25px 0
}
section.share .share__title{
font-size:23px;
color:#000;
font-weight:bold
}
section.share p{
margin:20px auto;
max-width:620px
}
section.share .b-social-button .social-button__components{
padding:0
}
body.mobile section.share h2{
line-height:26px
}
body.mobile section.share .b-social-button--googleplus,body.mobile section.share .b-social-button--moimir{
display:none !important
}
section.block.preview{
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
box-shadow:0 1px 3px 0 rgba(0,0,0,0.3);
border-radius:8px;
margin-bottom:20px;
margin-top:20px;
text-align:left;
padding:40px
}
section.block.preview .marker{
padding-left:5px !important;
padding-right:5px !important
}
section.block.preview .marker.yellow{
background:#ffe594
}
@media print{
section.preview{
box-shadow:none !important;
border-radius:0 !important;
margin-bottom:0 !important;
margin-top:0 !important;
padding:0 !important
}
section.preview .marker{
padding:0 !important;
background:none !important
}
}
body.mobile section.preview{
width:800px
}
div.carousel.active1 section.preview,div.carousel.active3 section.preview{
display:none
}
section.price .cost{
font-size:24px;
color:#333;
line-height:32px;
font-weight:bold;
margin:0
}
section.price .cost .old{
text-decoration:line-through
}
section.price .cost .old.single{
text-decoration:none
}
section.price .cost .new{
color:#dd2c00
}
section.price .sale{
text-align:center;
font-size:12px;
margin-top:10px;
line-height:16px
}
section.price .platforms{
margin-top:20px;
display:flex;
align-items:center;
justify-content:center
}
section.price .platforms img{
display:flex;
margin:0 6px
}
section.price .select{
font-size:14px;
margin:8px 0 0 0;
color:gray
}
section.price button{
margin:14px 3px 0 3px;
width:220px
}
section.price .yandex{
font-size:12px;
color:gray;
line-height:18px
}
section.price .yandex p{
margin-bottom:0
}
section.price .agreement{
padding-left:0;
margin:20px auto;
max-width:510px
}
section.price .additional{
display:flex;
justify-content:center
}
section.price .additional a{
cursor:pointer;
font-size:12px;
display:inline-block;
margin:0 6px
}
section.price .additional a.disabled{
pointer-events:none;
color:#666
}
body.mobile section.price .agreement{
margin:20px 10px 20px 40px
}
body.mobile section.price .additional{
flex-direction:column
}
section.instruction{
font-size:14px;
text-align:left;
margin-top: 20px;
}
section.instruction.top{
text-align:center;
padding-bottom:0
}
section.instruction a{
color:#24a3f1;
text-decoration:underline
}
section.instruction ul{
padding-left:20px
}
body.mobile section.instruction.top>p{
margin-top:0
}
section.send{
position:relative;
overflow:hidden
}
section.send a{
color:#24a3f1;
text-decoration:underline
}
section.send .warning{
position:relative;
padding:10px 10px 10px 50px;
border:1px solid #d5c136;
background:#faf5c1;
border-radius:5px;
font-size:14px;
line-height:18px;
margin-bottom:15px
}
section.send .warning img{
width:30px;
height:30px;
position:absolute;
margin-left:-40px
}
section.send .loading,section.send .success,section.send .error{
background:rgba(255,255,255,0.95);
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
z-index:10;
text-align:center
}
section.send .loading .title,section.send .success .title,section.send .error .title{
font-size:18px;
font-weight:bold;
margin:30px 0 6px 0
}
section.send .loading .desc,section.send .success .desc,section.send .error .desc{
font-size:14px
}
section.send .loading .i,section.send .success .i,section.send .error .i{
height:80px;
margin:20px 0
}
section.send .success .i{
background:url("/resume/res/svg/material/round-sentiment_satisfied-24px.svg") no-repeat center center;
background-size:80px
}
section.send .error .i{
background:url("/resume/res/svg/material/round-sentiment_dissatisfied-24px.svg") no-repeat center center;
background-size:80px
}
section.send .loading .spinner{
display:inline-block;
width:64px;
height:64px;
position:absolute;
left:50%;
top:50%;
margin-left:-32px;
margin-top:-32px
}
section.send .loading .spinner:after{
content:" ";
display:block;
width:46px;
height:46px;
margin:1px;
border-radius:50%;
border:5px solid #6aa6d1;
border-color:#6aa6d1 transparent #6aa6d1 transparent;
animation:spinner 1.2s linear infinite
}
@keyframes spinner{
0%{
transform:rotate(0)
}
100%{
transform:rotate(360deg)
}
}
body.mobile section.send{
padding:0;
border:0 none;
background:0;
border-radius:0;
box-shadow:none;
border-top:0 none !important
}
body.mobile section.send .loading,body.mobile section.send .success,body.mobile section.send .error{
border-radius:6px
}
body.mobile section.send .success .i-box,body.mobile section.send .error .i-box{
height:50px
}
body.mobile section.send .success .i,body.mobile section.send .error .i{
margin:10px 0;
transform:scale(0.4);
transform-origin:center top
}
section.struct{
position:fixed;
left:50%;
top:100px;
margin-left:400px;
opacity:0;
visibility:hidden;
transition:opacity .5s,visibility .5s
}
section.struct ol{
text-align:left
}
section.struct ol li{
line-height:18px;
max-width:200px;
padding:5px 0;
color:#333;
cursor:pointer
}
section.struct ol li span{
border-bottom:1px #333 dotted;
font-size:14px
}
section.struct ol li.active,section.struct ol li:hover{
color:#24a3f1
}
section.struct ol li.active span,section.struct ol li:hover span{
border-bottom:0 none
}
section.struct.show{
opacity:1;
visibility:visible
}
section.scroll{
position:fixed;
bottom:10px;
left:50%;
margin-left:-460px
}
section.scroll button{
opacity:0;
visibility:hidden;
transition:opacity .5s,visibility .5s
}
section.scroll button.show{
opacity:1;
visibility:visible
}
body.tablet section.scroll{
display:none
}
body.mobile section.scroll{
display:none
}
body.shared section.scroll{
display:none
}
.logo{
display:inline-block;
width:136px;
height:33px;
background:url("/resume/res/svg/logo.svg") transparent no-repeat 0 0;
margin:0;
margin-top:-2px
}
body.tablet .logo{
flex:none
}
body.mobile .logo{
flex-basis:74px;
margin:0;
background-position:0 center
}
header .paid{
display:none;
line-height:44px;
border-radius:8px;
background:#eef6e5 url("../svg/actions/done.svg") 20px center no-repeat;
padding-left:46px;
padding-right:15px;
position:relative;
transition:background-color .5s;
flex-grow:1;
flex-shrink:0;
position:fixed;
right:20px;
top:14px;
z-index:100
}
header .paid>span{
font-size:14px;
color:#8cc453;
font-weight:bold
}
header .paid>div{
position:absolute;
visibility:hidden;
opacity:0;
font-size:14px;
line-height:24px;
padding:12px 15px;
top:56px;
right:0;
z-index:101;
background:#333;
box-shadow:0 6px 6px 0 rgba(0,0,0,0.26),0 10px 20px 0 rgba(0,0,0,0.19);
border-radius:8px;
color:#fff;
transition:visibility .5s,opacity .5s,margin-top .5s;
white-space:nowrap;
margin-top:8px
}
header .paid>div p{
margin:0
}
header .paid>div::before{
content:"";
position:absolute;
width:0;
height:0;
border-left:6px solid transparent;
border-right:6px solid transparent;
border-bottom:8px solid #333;
top:-8px;
right:50px
}
header .paid:hover{
background-color:#d4eabb
}
header .paid:hover>div{
visibility:visible;
opacity:1;
margin-top:0
}
header .paid.show{
display:inline-block
}
body.tablet header .paid{
height:44px
}
body.tablet header .paid>span{
display:none
}
body.tablet header .paid>div{
white-space:normal;
transition:none
}
body.tablet header .paid>div::before{
right:30px
}
body.tablet header .paid.expanded>div{
visibility:visible !important;
opacity:1;
margin-top:0
}
body.tablet header .paid:hover>div{
visibility:hidden
}
body.mobile header .paid{
right:12px;
padding-left:40px;
padding-right:8px;
background-position:15px center;
height:44px
}
body.mobile header .paid>span{
display:none
}
body.mobile header .paid>div{
white-space:normal;
transition:none
}
body.mobile header .paid>div::before{
right:20px
}
body.mobile header .paid>div span{
white-space:nowrap
}
body.mobile header .paid.expanded>div{
visibility:visible !important;
opacity:1;
margin-top:0
}
body.mobile header .paid:hover>div{
visibility:hidden
}
.carousel{
position:relative;
overflow:hidden
}
.carousel>div{
position:absolute;
width:100%;
margin-left:100%;
transition:margin-left .25s,opacity .25s;
opacity:0;
top:0
}
.carousel.active1 .page1{
position:static;
margin-left:0;
opacity:1
}
.carousel.active2 .page1{
margin-left:-100%
}
.carousel.active2 .page2{
position:static;
margin-left:0;
opacity:1
}
.carousel.active3 .page1,.carousel.active3 .page2{
margin-left:-100%
}
.carousel.active3 .page3{
position:static;
margin-left:0;
opacity:1
}
body.mobile .carousel{
overflow:visible
}
@media print{
body{
background:0
}
header,footer,article,section.overview,section.payments,section.brand,section.share,section.scroll,section.comments,section.review,div.demo,div.fb_reset{
display:none !important
}
section.page{
padding:0;
background:0
}
section.page section.border{
background:0;
border:0 none;
border-radius:0 !important;
box-shadow:none !important;
margin:0
}
section.page div.page1,section.page div.page3,section.page section.process,section.page section.price,section.page section.instruction{
display:none
}
section.page div.page2 section.message,section.page div.page2 section.selector,section.page div.page2 section.buttons{
display:none
}
section.page div.page2 .block{
max-width:none
}
section.page div.page2 .preview{
padding:0 !important;
background:none !important
}
section.page #preview{
transform:none !important
}
section.page #preview-box{
height:auto !important
}
@page{
size:auto;
margin:.6in
}
}
.demo{
cursor:none;
display:none
}
.demo.demo--running{
display:block
}
.demo .demo__background{
position:fixed;
top:0;
left:0;
right:0;
bottom:0;
background:rgba(0,0,0,0.1);
z-index:10000
}
.demo .demo__message{
z-index:11000;
text-align:center;
position:fixed;
bottom:20px;
width:460px;
left:50%;
margin-left:-230px;
background:rgba(0,0,0,0.75);
border-radius:8px;
color:#fff;
padding:10px 0
}
.demo .demo__mouse{
position:absolute;
z-index:12000
}
.demo .demo__mouse .demo__mouse__v{
width:16px;
height:16px;
background:url("../i/cursor.png") transparent no-repeat 0 0;
position:absolute;
z-index:1;
margin-top:-1px;
margin-left:-3px
}
.demo .demo__mouse .demo__mouse__o{
display:none;
opacity:1;
transition:width .2s,height .2s,margin-top .2s,margin-left .2s,border-radius .2s,opacity .2s;
width:20px;
height:20px;
background:#999;
border:1px solid #888;
box-shadow:1px 1px 2px rgba(0,0,0,0.5);
position:absolute;
margin-left:-10px;
margin-top:-10px;
border-radius:20px;
z-index:0
}
.demo .demo__mouse.demo__mouse--click-down .demo__mouse__o{
display:block
}
.demo .demo__mouse.demo__mouse--click-up .demo__mouse__o{
width:40px;
height:40px;
margin-left:-20px;
margin-top:-20px;
border-radius:40px;
opacity:0
}
body.mobile .demo .demo__message{
left:20px;
right:20px;
margin:0;
width:auto
}
section.comments .comments__list{
text-align:left
}
section.comments .comments__item{
margin-bottom:10px
}
section.comments .comments__item .comments__item__head{
font-weight:bold
}
.is-only-mobile,.is-only-mobile-block{
display:none
}
body.mobile .is-only-mobile{
display:inline !important
}
body.mobile .is-not-mobile{
display:none !important
}
body.mobile .is-only-mobile-block{
display:block !important
}
body.mobile .mobile-column-reverse{
flex-direction:column-reverse
}
body.mobile .mobile-column{
flex-direction:column
}
body.mobile .flexbox.mobile-column-left{
align-items:start !important
}
body.mobile .flexbox.mobile-column-center{
align-items:center !important
}
body.mobile .mobile-no-margin{
margin:0 !important
}
body.mobile .mobile-no-padding{
padding:0 !important
}
body.mobile .mobile-no-right{
margin-left:0 !important
}
body.mobile .mobile-no-left{
margin-right:0 !important
}
body.mobile .mobile-fullsize{
width:100% !important
}
body.mobile .mobile-last{
margin-bottom:15px !important
}
body.mobile .mobile-school{
width:70% !important
}
body.mobile .mobile-driver{
padding-left:20px !important
}
.is-only-tablet{
display:none
}
body.tablet .is-only-tablet{
display:block
}
body.tablet .is-not-tablet{
display:none !important
}
body.shared{
background:#fff !important;
overflow:hidden !important;
margin:0 !important
}
body.shared>.main{
background-color:#fff;
border-radius:10px
}
body.shared .is-not-shared{
display:none
}
section.review{
padding-bottom:36px
}
section.review .review__title{
font-size:23px;
color:#5d5d5d;
font-weight:bold;
margin:30px 0
}
section.review .review__list{
display:flex
}
section.review .review__item{
flex:1;
background:#fff;
box-shadow:0 1px 2px 0 rgba(0,0,0,0.2),0 1px 3px 0 rgba(0,0,0,0.1);
border-radius:8px;
padding:20px;
text-align:left;
margin:0 10px;
font-size:14px;
position:relative
}
section.review .review__item:last-of-type{
margin-right:0
}
section.review .review__item:first-of-type{
margin-left:0
}
section.review .review__item__head{
padding-left:50px
}
section.review .review__item__head img{
position:absolute;
width:40px;
height:40px;
border-radius:8px;
margin-left:-50px
}
section.review .review__item__head__name{
font-weight:bold
}
section.review .review__item__head__position{
font-size:13px
}
section.review .review__item__head__city{
color:#666;
font-size:13px
}
section.review .review__item__body{
margin-top:14px;
font-size:15px;
font-style:italic
}
body.mobile section.review .review__list{
flex-direction:column
}
body.mobile section.review .review__item{
margin-bottom:20px;
margin-left:0;
margin-right:0
}
.auth{
position:absolute;
background:#fff;
box-shadow:0 10px 10px 0 rgba(0,0,0,0.2);
border-radius:8px;
padding:0 15px 15px 15px;
z-index:1000;
top:-10000px;
transition:visibility .5s,opacity .5s;
flex-direction:line;
width:400px;
right:50%;
margin-right:-420px;
display:flex
}
.auth iframe{
border:0;
display:block;
width:100%
}
.auth.expanded{
top:65px
}
body.tablet .auth{
right:0;
margin-right:20px
}
body.mobile .auth{
display:none;
position:static;
border-top:1px solid #d8d8d8;
max-width:none;
box-shadow:none;
border-radius:0;
margin-right:0;
margin-left:0;
padding:0 15px;
width:100%
}
body.mobile .auth.expanded{
display:block
}
body.mobile .auth iframe{
width:1px;
min-width:100%;
*width:100%
}
.login{
max-width:150px;
overflow:hidden;
text-overflow:ellipsis;
text-align:right;
font-weight:bold;
padding-bottom:3px;
line-height:74px;
display:inline-block;
margin-left:25px
}
.login__link{
color:#000;
text-decoration:none !important
}
.login__link:hover{
color:#000
}
.login__link.active{
color:#000;
border-bottom:3px #000 solid
}
.login__link::before{
content:"";
position:absolute;
background:url("/auth/res/svg/login.svg") transparent no-repeat 0 0;
width:24px;
height:24px;
margin-left:-28px;
top:26px
}
.login--finish .login__link::before{
background:url("/auth/res/svg/profile.svg") transparent no-repeat 0 0
}
body.mobile .login{
position:absolute;
top:0;
right:0;
width:50px;
height:75px;
padding-left:50px;
margin-left:0
}
body.mobile .login .login__link::before{
margin-left:-40px
}
.editor{
position:fixed;
width:560px;
top:50%;
left:50%;
margin-left:-280px;
border-radius:12px;
background:#666;
box-shadow:-1px 13px 20px 0 rgba(0,0,0,0.7);
z-index:61000;
overflow:hidden;
display:none;
flex-direction:column;
height:640px;
margin-top:-320px
}
.editor--show{
display:flex
}
.editor__top{
flex-basis:100%;
position:relative;
overflow:hidden
}
.editor__image{
position:absolute;
width:400px;
height:400px;
left:80px;
top:50%;
margin-top:-200px
}
.editor__shadow{
position:absolute;
background:rgba(0,0,0,0.6);
font-size:14px;
color:#fff;
padding:12px;
pointer-events:none
}
.editor__shadow--top,.editor__shadow--bottom{
left:80px;
width:400px;
bottom:50%;
height:1000px;
margin-bottom:200px;
text-align:center
}
.editor__shadow--top{
bottom:50%;
margin-bottom:200px
}
.editor__shadow--bottom{
top:50%;
margin-top:200px
}
.editor__shadow--left,.editor__shadow--right{
width:1000px;
top:0;
bottom:0
}
.editor__shadow--left{
right:50%;
margin-right:200px
}
.editor__shadow--right{
left:50%;
margin-left:200px
}
.editor__bottom{
display:flex;
background:#1d1d1d;
padding:24px;
flex-shrink:0;
align-items:center
}
.editor__bottom img{
pointer-events:none
}
.editor__cancel{
color:#fff;
cursor:pointer;
margin-right:24px
}
.editor__cancel:hover{
text-decoration:underline
}
.editor__actions{
display:flex;
align-items:center
}
.editor__button{
flex-shrink:0;
background:#fff;
border-radius:8px;
padding:12px;
margin-right:12px;
display:flex;
cursor:pointer;
user-select:none
}
.editor__button:hover{
background:#dedede
}
.editor__button:active{
background:silver
}
.editor__button img{
width:24px;
height:24px
}
.editor__space{
flex-basis:100%
}
.mobile .editor{
width:auto;
left:10px;
top:10px;
right:10px;
margin:0;
height:auto
}
.mobile .editor--show{
display:block
}
.mobile .editor__top{
height:340px
}
.mobile .editor__bottom{
display:block;
padding:12px 24px;
text-align:center
}
.mobile .editor__button{
display:inline-flex;
margin:0 6px 12px 6px
}
.mobile .editor__actions{
display:flex;
flex-direction:column-reverse;
padding:12px 0
}
.mobile .editor__cancel{
margin:12px 0 0 0;
display:block
}
.mobile .editor__image{
width:250px;
height:250px;
top:45px;
left:50%;
margin-top:0;
margin-left:-125px
}
.mobile .editor__shadow--top,.mobile .editor__shadow--bottom{
left:0;
right:0;
height:45px;
margin:0;
width:auto
}
.mobile .editor__shadow--top{
top:0
}
.mobile .editor__shadow--bottom{
top:295px;
text-align:center
}
.mobile .editor__shadow--left,.mobile .editor__shadow--right{
width:1000px;
top:45px;
height:250px;
bottom:unset
}
.mobile .editor__shadow--left{
right:50%;
margin-right:125px
}
.mobile .editor__shadow--right{
left:50%;
margin-left:125px
}
.velum{
position:fixed;
left:0;
right:0;
top:0;
bottom:0;
z-index:60000;
background:rgba(0,0,0,0.7);
display:none
}
.velum--show{
display:block
}
.velum--white{
background:rgba(255,255,255,0.7)
}
.mobile .velum{
position:fixed
}
section.preview .classic{
text-align:left
}
section.preview .classic .multiline p{
white-space:pre-wrap
}
section.preview .classic .left{
border:1px solid #d0d0d0;
border-radius:10px;
overflow:hidden;
width:220px;
height:220px;
flex-shrink:0;
background:url("https://pdf.resumeonline.pro/res/svg/person.svg") no-repeat #f0f0f0 center center;
background-size:75%
}
section.preview .classic .right{
margin-left:30px
}
section.preview .classic .position{
margin-top:0;
margin-bottom:12px
}
section.preview .classic .list div{
border-top:1px solid #d0d0d0;
margin-top:14px;
padding-top:8px
}
section.preview .classic .list div:first-of-type{
border-top:0 none;
margin-top:0;
padding-top:0
}
section.preview .classic h3{
margin:0 0 12px 0;
padding:2px 0
}
section.preview .classic h4{
margin:25px 0 15px 0
}
section.preview .classic p{
margin:6px 0;
font-size:15px
}
section.preview .classic b{
font-weight:normal;
color:#757575
}
section.preview .classic ul{
margin-top:8px;
margin-bottom:8px
}
section.preview .classic ul li{
margin-bottom:8px
}
section.preview .classic ul li:last-of-type{
margin-bottom:0
}
section.preview .moscow{
display:flex;
font-size:14px;
line-height:18px;
text-align:left
}
section.preview .moscow__column{
flex:1
}
section.preview .moscow__column--left{
flex-basis:70%
}
section.preview .moscow__column--right{
flex-basis:30%
}
section.preview .moscow__head{
position:relative;
padding-left:150px;
display:flex;
flex-direction:column;
height:120px
}
section.preview .moscow__head__photo{
width:120px;
height:120px;
border-radius:10px;
position:absolute;
margin-left:-150px;
border:1px solid #d0d0d0;
overflow:hidden;
background:url("/res/svg/person.svg") no-repeat #f0f0f0 center center;
background-size:75%
}
section.preview .moscow__head__name{
font-weight:bold;
font-size:24px;
line-height:26px;
flex-shrink:0;
padding-bottom:10px;
text-transform:capitalize
}
section.preview .moscow__head__position{
font-weight:bold;
color:#5c7c94;
flex-basis:100%;
font-size:16px
}
section.preview .moscow__head__geo{
flex-shrink:0;
margin-bottom:4px;
color:#666;
padding-left:24px;
background:url("../i/templates/moscow/place.svg") transparent no-repeat 0 0;
background-size:20px 20px;
font-size:14px;
line-height:14px;
min-height:20px;
display:flex;
align-items:center
}
section.preview .moscow__title{
font-weight:bold;
margin-top:30px;
line-height:26px;
background-size:24px 24px;
padding-left:32px;
font-size:16px
}
section.preview .moscow__title--personal{
background:url("../i/templates/moscow/person.svg") transparent no-repeat 0 0
}
section.preview .moscow__title--expirience{
background:url("../i/templates/moscow/work.svg") transparent no-repeat 0 0
}
section.preview .moscow__title--education{
background:url("../i/templates/moscow/education.svg") transparent no-repeat 0 0
}
section.preview .moscow__title--traning{
background:url("../i/templates/moscow/traning.svg") transparent no-repeat 0 0
}
section.preview .moscow__title--info{
background:url("../i/templates/moscow/info.svg") transparent no-repeat 0 0
}
section.preview .moscow__group{
margin-left:12px;
padding-left:20px;
border-left:1px solid #d0d0d0;
margin-top:10px
}
section.preview .moscow__group p{
margin-top:3px;
margin-bottom:3px
}
section.preview .moscow__group p b{
display:inline-block;
padding-right:4px;
font-weight:normal;
color:#757575
}
section.preview .moscow__group li{
margin:8px 0
}
section.preview .moscow__group li:last-of-type{
margin-bottom:0
}
section.preview .moscow__expirience__position{
font-size:16px;
line-height:20px
}
section.preview .moscow__expirience__company{
margin-top:4px
}
section.preview .moscow__expirience__period{
margin-top:3px;
color:#5c7c94
}
section.preview .moscow__expirience__details{
padding-top:6px;
margin-top:2px
}
section.preview .moscow__education__school{
font-size:16px;
line-height:20px
}
section.preview .moscow__education__class{
margin-top:4px
}
section.preview .moscow__education__year{
margin-top:3px;
color:#5c7c94
}
section.preview .moscow__details{
margin-bottom:20px
}
section.preview .moscow__details__email{
color:#5c7c94
}
section.preview .moscow__details__title{
font-size:16px;
margin-bottom:10px
}
section.preview .moscow__salary{
margin-bottom:20px
}
section.preview .moscow__salary__amount{
color:#5c7c94
}
section.preview .moscow__salary__title{
font-size:16px;
margin-bottom:10px
}
section.preview .moscow__salary__tick{
padding-left:30px;
background:url("https://pdf.resumeonline.pro/res/i/templates/moscow/done.svg") transparent no-repeat 0 0;
margin-bottom:10px
}
section.preview .moscow__skils p{
padding-left:30px;
background:url("https://pdf.resumeonline.pro/res/i/templates/moscow/done.svg") transparent no-repeat 0 0;
margin-bottom:10px
}
section.preview .leningrad{
text-align:left;
font-size:14px
}
section.preview .leningrad ul{
margin-top:6px;
margin-bottom:6px
}
section.preview .leningrad p{
margin-top:4px;
margin-bottom:4px
}
section.preview .leningrad__head{
display:flex;
align-items:center;
justify-content:center;
flex-direction:column
}
section.preview .leningrad__head__photo{
width:110px;
height:110px;
border:1px solid #d0d0d0;
overflow:hidden;
margin-bottom:24px;
background:url("/res/svg/person.svg") no-repeat #f0f0f0 center center;
background-size:75%
}
section.preview .leningrad__head__name{
font-size:26px;
text-transform:uppercase;
font-weight:bold
}
section.preview .leningrad__head__position{
margin-top:10px;
font-size:18px
}
section.preview .leningrad__head__salary{
margin-top:16px
}
section.preview .leningrad__head__contacts{
margin-top:4px;
display:flex;
width:100%;
justify-content:space-between;
text-align:center;
align-items:flex-end;
line-height:16px
}
section.preview .leningrad__head__contacts__phone{
flex-shrink:0;
padding-right:20px;
white-space:nowrap
}
section.preview .leningrad__head__contacts__email{
flex-shrink:0;
padding-left:20px;
white-space:nowrap
}
section.preview .leningrad__group{
margin-top:10px
}
section.preview .leningrad__group__title{
font-size:13px;
text-transform:uppercase;
text-align:center;
line-height:26px;
background:#e0e0e0
}
section.preview .leningrad__group__lines{
margin-top:10px
}
section.preview .leningrad__group__lines p{
display:flex
}
section.preview .leningrad__group__lines p b{
flex-shrink:0;
padding-right:10px
}
section.preview .leningrad__group__lines p span{
flex-shrink:0;
padding-left:10px
}
section.preview .leningrad__group__lines p i{
flex-basis:100%;
border-bottom:1px dotted #a8a8a8;
height:16px
}
section.preview .leningrad__info__label{
margin-top:10px;
font-weight:bold
}
section.preview .leningrad__expirience{
margin-top:10px;
padding-left:20px
}
section.preview .leningrad__expirience__company{
position:relative;
display:flex;
align-items:flex-start;
justify-content:space-between
}
section.preview .leningrad__expirience__company b{
padding-right:10px
}
section.preview .leningrad__expirience__company span{
padding-left:10px;
text-align:right
}
section.preview .leningrad__expirience__company:before{
content:"§";
position:absolute;
margin-left:-14px;
font-weight:bold
}
section.preview .leningrad__education{
margin-top:10px;
padding-left:20px
}
section.preview .leningrad__education__school{
position:relative;
display:flex;
align-items:flex-start;
justify-content:space-between
}
section.preview .leningrad__education__school b{
padding-right:10px
}
section.preview .leningrad__education__school span{
padding-left:10px;
text-align:right
}
section.preview .leningrad__education__school:before{
content:"§";
position:absolute;
margin-left:-14px;
font-weight:bold
}
section.preview .leningrad__traning{
margin-top:10px;
padding-left:20px
}
section.preview .leningrad__traning__name{
position:relative;
display:flex;
align-items:flex-start;
justify-content:space-between
}
section.preview .leningrad__traning__name b{
padding-right:10px
}
section.preview .leningrad__traning__name span{
padding-left:10px;
text-align:right
}
section.preview .leningrad__traning__name:before{
content:"§";
position:absolute;
margin-left:-14px;
font-weight:bold
}
section.preview .novorossiysk__head{
text-align:center
}
section.preview .novorossiysk__head__photo{
display:inline-block;
width:120px;
height:120px;
border-radius:10px;
border:1px solid #d0d0d0;
overflow:hidden;
background:url("/res/svg/person.svg") no-repeat #f0f0f0 center center;
background-size:75%
}
section.preview .novorossiysk__head__name{
font-weight:bold;
font-size:28px;
line-height:28px;
text-transform:uppercase;
margin-top:16px
}
section.preview .novorossiysk__head__info{
justify-content:center;
align-items:baseline;
display:flex;
font-size:14px;
margin-top:16px;
color:#757575
}
section.preview .novorossiysk__head__info__position{
padding-right:16px;
flex-shrink:0;
font-size:16px;
max-width:300px;
text-align:right;
line-height:18px
}
section.preview .novorossiysk__head__info__geo{
flex-shrink:0;
padding-left:24px;
background:url("../i/templates/novorossiysk/place.svg") transparent no-repeat 0 0;
background-size:20px 20px;
max-width:400px;
text-align:left;
line-height:18px
}
section.preview .novorossiysk__body{
text-align:left;
display:flex
}
section.preview .novorossiysk__column{
flex:1
}
section.preview .novorossiysk__column--left{
flex-basis:30%
}
section.preview .novorossiysk__column--right{
flex-basis:70%
}
section.preview .novorossiysk__title{
font-weight:bold;
margin-top:30px;
line-height:26px;
background-size:24px 24px;
background-color:transparent;
background-position:0 0;
background-repeat:no-repeat;
padding-left:32px;
font-size:14px;
text-transform:uppercase;
padding-bottom:4px
}
section.preview .novorossiysk__title--personal{
background-image:url("../i/templates/novorossiysk/person.svg")
}
section.preview .novorossiysk__title--expirience{
background-image:url("../i/templates/novorossiysk/work.svg")
}
section.preview .novorossiysk__title--education{
background-image:url("../i/templates/novorossiysk/education.svg")
}
section.preview .novorossiysk__title--traning{
background-image:url("../i/templates/novorossiysk/traning.svg")
}
section.preview .novorossiysk__title--info{
background-image:url("../i/templates/novorossiysk/info.svg")
}
section.preview .novorossiysk__group{
margin-left:12px;
padding-left:20px;
border-left:1px solid #333;
padding-top:6px;
padding-bottom:8px;
position:relative
}
section.preview .novorossiysk__group p{
margin-top:3px;
margin-bottom:3px
}
section.preview .novorossiysk__group p b{
display:inline-block;
padding-right:4px;
font-weight:normal;
color:#757575
}
section.preview .novorossiysk__group p:first-of-type{
margin-top:0
}
section.preview .novorossiysk__group li{
margin:8px 0
}
section.preview .novorossiysk__group li:last-of-type{
margin-bottom:0
}
section.preview .novorossiysk__group:before{
position:absolute;
content:"";
width:9px;
height:9px;
border-radius:9px;
border:1px solid #333;
background:#fff;
left:0;
margin-left:-6px;
margin-top:4px
}
section.preview .novorossiysk__expirience__position{
font-size:16px;
line-height:20px;
font-weight:bold
}
section.preview .novorossiysk__expirience__company{
margin-top:10px
}
section.preview .novorossiysk__expirience__period{
margin-top:8px;
color:#757575
}
section.preview .novorossiysk__expirience__details{
padding-top:6px;
padding-left:20px;
margin-top:6px
}
section.preview .novorossiysk__education__school{
font-size:16px;
line-height:20px;
font-weight:bold
}
section.preview .novorossiysk__education__class{
margin-top:6px
}
section.preview .novorossiysk__education__year{
margin-top:6px;
color:#757575
}
section.preview .novorossiysk__details{
text-align:center
}
section.preview .novorossiysk__details__label{
font-weight:bold;
margin-top:31px;
line-height:26px;
font-size:12px;
text-transform:uppercase;
padding-bottom:4px
}
section.preview .novorossiysk__details__label:after,section.preview .novorossiysk__details__label:before{
position:absolute;
content:"";
width:5px;
height:5px;
border-radius:10px;
border:1px solid #333;
background:#fff;
margin-top:10px
}
section.preview .novorossiysk__details__label:before{
margin-left:-16px
}
section.preview .novorossiysk__details__label:after{
margin-left:8px
}
section.preview .novorossiysk__details__line--small{
font-size:14px;
line-height:16px
}
section.preview .novorossiysk__details p{
margin-top:3px;
margin-bottom:3px;
padding-left:8px;
padding-right:8px
}
section.preview .novorossiysk__details__lines span{
display:inline;
border-bottom:1px solid #333
}
section.preview .novorossiysk__details__lines p{
margin-bottom:10px;
font-size:14px
}
p:empty:before {
content: "";
display:none;
}