/*
Theme Name: DoCode Theme
Version: 1.0
Author URI: https://docode.pro
*/


@font-face{
	font-family:'Inter';
	src:url('/wp-content/themes/docode_theme/fonts/Inter-Regular.ttf') format('truetype');
	font-weight:400;
	font-style:normal
}

@font-face{
	font-family:'Inter';
	src:url('/wp-content/themes/docode_theme/fonts/Inter-Medium.ttf') format('truetype');
	font-weight:500;
	font-style:normal
}

@font-face{
	font-family:'Inter';
	src:url('/wp-content/themes/docode_theme/fonts/Inter-Bold.ttf') format('truetype');
	font-weight:600;
	font-style:normal
}

:root {
	--bl: #060606;
	--wh: #fff;
	--wh-80: rgba(255, 255, 255, 80%);
	--wh-50: rgba(255, 255, 255, 50%);
	--wh-30: rgba(255, 255, 255, 30%);
	--shadow: 0 0 10px 3px #ffffff5e;
	--ye: #FFBD3C;
	--y-blue: #BBCEFF;
	--d-blue: #0035F2;
	--l-blue: #ECF1FF;
}

:focus {
	outline: none;
}

::placeholder{
	color: inherit;
}

liss:focus {
	
}

*{
	box-sizing: border-box;
	margin: 0;
}

html{
	font-size: 0.8vw;
	scroll-behavior: smooth;
}

body{
	font-family: 'Inter';
	font-size: 1.4rem;
}

button, input, select, textarea {
	font-size: inherit;
}

a {
	transition: .3s;
	text-decoration: none;
}
a:hover {
	text-decoration: none;
}

[type="password"],
[type="text"], 
[type="tel"], 
[type="email"], 
[type="number"], 
textarea, 
select {
	width: 100%;
	border: 0.1rem solid var(--bl);
	background: var(--sh);
	border-radius: 0.6rem;
	height: 4rem;
	color: inherit;
	padding: 1rem;
}

textarea {
	height: 16rem;
}

[type=button]:not(:disabled), 
[type=reset]:not(:disabled), 
[type=submit]:not(:disabled), 
button:not(:disabled) {
    transition: 0.3s;
    cursor: pointer;
    border-radius: 0.6rem;
    width: 100%;
    height: 4rem;
}

[type=button]:not(:disabled):hover, 
[type=reset]:not(:disabled):hover, 
[type=submit]:not(:disabled):hover, 
button:not(:disabled):hover {
}

p, ul {
    margin-bottom: 2rem;
}

h1, .h1 {
	font-size: 6rem;
	margin-bottom: 4rem;
}

h2, .h2 {
	font-size: 6rem;
	margin-bottom: 4rem;
}

h3, .h3 {
	font-size: 1.4rem;
	margin-bottom: 2rem;
}

img {
	max-width: 100%;
	height: auto;
}

iframe {
    max-width: 100%;
}

img.to_svg{
	display: none;
}

.table_wrap {
    width: 100%;
    overflow: auto;
    position: relative;
}

.container{
	margin: auto;
	max-width: 120rem;
}

.row{
	display: flex;
	flex-wrap: wrap;
	margin-left: -1rem;
	margin-right: -1rem;
}

.row-0{
	display: flex;
	flex-wrap: wrap;
}

/**** HEADER *****/
header {
    position: sticky;
    top: 0;
    z-index: 111;
    background: var(--y-blue);
}

.header_row {
    display: flex;
    flex-wrap: wrap;
    padding: 1rem 0;
    align-items: center;
    position: relative;
}

a.header_logo {
    display: block;
    line-height: 1;
    margin-right: 2rem;
}

a.header_logo img {
    width: auto;
    height: 3.7rem;
}

.ul_main_menu {
    margin: 0 0 0 auto;
    display: flex;
    list-style: none;
    padding: 0;
}

.ul_main_menu > li {
    margin: 0 1rem;
}

.head_desc_all {
    margin-left: auto;
    font-weight: 600;
}

.ul_main_menu a {
    color: var(--bl);
}

.ul_main_menu a:hover {
    color: var(--d-blue);
}

body.menu_open {
    overflow: hidden;
}
	
.burger {
    width: 3rem;
    height: 4rem;
    position: relative;
    cursor: pointer;
    display: none;
}
	
.burger span {
    display: block;
    position: absolute;
    width: 100%;
    height: 0.2rem;
    top: 2rem;
    left: 0px;
    transition: 0.3s;
    background: var(--bl);
}
	
.burger span:first-child {
    top: 0.9rem;
}
	
.burger span:last-child {
    top: 2.9rem;
}
	
.menu_open .burger span:first-child,
.menu_open .burger span:last-child {
    opacity: 0;
}
	
.menu_open .burger span:nth-child(2) {
    transform: rotate(45deg);
}
	
.menu_open .burger span:nth-child(3) {
    transform: rotate(-45deg);
}
	
.mobile_menu {
    position: absolute;
    width: 100%;
    height: calc(100vh - 8.6rem);
    display: none;
    overflow: auto;
    background: var(--wh);
}
	
.ul_mob_menu a {
    color: var(--bl);
    margin-bottom: 1rem;
    display: block;
    text-align: center;
    border-bottom: 0.1rem solid var(--bl);
    padding-bottom: 1rem;
}

.ul_mob_menu .sub-menu a {
    font-size: 1.6rem;
}
	
.menu_open .mobile_menu {
    display: block;
}
	
.ul_mob_menu {
    display: block;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 1.8rem;
    padding-top: 5rem;
}
/**** END HEADER ****/

/*** BANNER ***/
section.banner {
    position: relative;
    height: 50rem;
    display: flex;
}

.banner_text {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

section.banner .container {
    flex: 1;
}

section.banner > img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    top: 0;
    left: 0;
}

section.banner h1 {
    position: relative;
    font-size: 6rem;
    /* padding-top: 4rem; */
    width: 60%;
    text-align: center;
    margin-bottom: 0;
}

.banner_desc {
    position: relative;
    font-size: 2rem;
    margin-top: 2rem;
    width: 50%;
    text-align: center;
}

/*** END BANNER ***/

/*** WINNER ***/
section.winner {
    background: var(--d-blue);
    padding: 6rem 0 3rem;
    color: var(--wh);
    position: relative;
}

.winner_info {
    width: 50%;
    display: flex;
    flex-direction: column;
    height: 60rem;
    padding-right: 4rem;
}

.winner_fio {
    font-size: 3rem;
    margin-bottom: 1rem;
}

.winner_firm {
    margin-bottom: 4rem;
    opacity: 0.8;
}

a.linkedin_lnk {
    display: block;
    width: max-content;
    padding: 0.5rem 0;
    border-bottom: 0.1rem solid;
}

a.linkedin_lnk.winner_link {
    color: var(--wh);
    margin-bottom: 2rem;
}

a.linkedin_lnk.winner_link:hover {
    color: var(--y-blue);
}

a.interview_lnk {
    display: flex;
    border-radius: 10rem;
    padding: 0.5rem;
    background: var(--wh);
    width: max-content;
    align-items: center;
    color: var(--d-blue);
}

a.interview_lnk.winner_inter {
    margin-top: 2rem;
}

.inter_arrow {
    position: relative;
    border-radius: 50%;
    background: var(--d-blue);
    width: 4rem;
    height: 4rem;
    margin-left: 2rem;
    transition: 0.3s;
}

a.interview_lnk span {
    margin-left: 2rem;
    font-weight: 600;
}

.inter_arrow svg {
    width: 30%;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

a.interview_lnk:hover {
    color: var(--bl);
}

.inter_arrow path {
    fill: var(--wh);
    transition: 0.3s;
}

a.interview_lnk:hover .inter_arrow path {
    fill: var(--bl);
}

a.interview_lnk:hover .inter_arrow {
    background: var(--y-blue);
}

.winner_foto {
    width: 50%;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
}

.winner_foto img {
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
    height: 100%;
    object-fit: cover;
    object-position: top;
}

.gallery_trigger {
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    background: var(--y-blue);
    position: relative;
    cursor: pointer;
    transition: 0.3s;
    display: none;
}

.gallery_trigger:hover {
    background: var(--wh);
}

.gallery_trigger > svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 50%;
}

.gallery_trigger.show_item {
    display: block;
}

.winner_text {
    margin-top: auto;
}

/*** END WINNER ***/

/*** TOP 3 ***/
section.top3 {
    padding: 9rem 0 6rem;
}

.top3_card {
    margin: 0 1rem;
    background: var(--l-blue);
    flex: 25%;
    padding: 2rem;
    display: flex;
    flex-direction: column;
}

.top3_fio {
    font-size: 2.4rem;
    line-height: 110%;
    margin-bottom: 1rem;
}

.top3_firm {
    margin-bottom: 2rem;
    margin-top: auto;
    font-weight: 600;
}

a.linkedin_lnk.top3_link {
    margin: 2rem 0;
    color: var(--bl);
    font-weight: 500;
}

a.linkedin_lnk.top3_link:hover {
    color: var(--d-blue);
}

.top3_foto {
    background: var(--y-blue);
    border-radius: 50%;
    position: relative;
    margin: 0 auto;
    overflow: hidden;
    width: 30rem;
    height: 30rem;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.top3_foto img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

a.interview_lnk.top3_inter {
    margin-top: 4rem;
    width: 100%;
    justify-content: space-between;
    color: var(--bl);
}

a.interview_lnk.top3_inter .inter_arrow {
    background: var(--y-blue);
}

a.interview_lnk.top3_inter .inter_arrow path {
    fill: var(--bl);
}

a.interview_lnk.top3_inter:hover .inter_arrow path {
    fill: var(--wh);
}

a.interview_lnk.top3_inter:hover .inter_arrow {
    background: var(--d-blue);
}

a.interview_lnk.top3_inter:hover {
    color: var(--d-blue);
}


/*** END TOP 3 ***/

/*** TOP 10 ***/
section.top10 {
    padding: 6rem 0 3rem;
}

.top10_card {width: 50%;padding: 2rem;background: var(--l-blue);}

.top10_card:nth-child(4n+2), .top10_card:nth-child(4n+3) {
    background: var(--wh);
}

.top10_head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 2rem;
}

.top10_fio {
    font-size: 2.4rem;
}

.top10_firm {
    font-weight: 600;
}

a.linkedin_lnk.top10_link {
    color: var(--bl);
}

a.linkedin_lnk.top10_link:hover {
    color: var(--d-blue);
}

.top10_wrap {
    display: flex;
    flex-wrap: wrap;
}

.top10_foto {
    position: relative;
    width: 40%;
    height: 23rem;
    padding: 0.5rem;
    display: flex;
    justify-content: flex-end;
}

.top10_foto img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
    top: 0;
    left: 0;
}

.top10_text {
    flex: 1;
    padding-left: 2rem;
    display: flex;
    flex-direction: column;
}

a.interview_lnk.top10_inter {
    width: 100%;
    justify-content: space-between;
    margin-top: auto;
    color: var(--bl);
}

a.interview_lnk.top10_inter:hover {
    color: var(--d-blue);
}

a.interview_lnk.top10_inter .inter_arrow {
    background: var(--y-blue);
}

a.interview_lnk.top10_inter:hover .inter_arrow {
    background: var(--d-blue);
}

a.interview_lnk.top10_inter .inter_arrow path {
    fill: var(--bl);
}

a.interview_lnk.top10_inter:hover .inter_arrow path {
    fill: var(--wh);
}

.top10_card:nth-child(4n+2) a.interview_lnk.top10_inter, 
.top10_card:nth-child(4n+3) a.interview_lnk.top10_inter {
    background: var(--y-blue);
}

.top10_card:nth-child(4n+2) a.interview_lnk.top10_inter:hover, 
.top10_card:nth-child(4n+3) a.interview_lnk.top10_inter:hover {
    background: var(--d-blue);
    color: var(--wh)
}

.top10_card:nth-child(4n+2) a.interview_lnk.top10_inter .inter_arrow,
.top10_card:nth-child(4n+3) a.interview_lnk.top10_inter .inter_arrow {
    background: var(--wh);
}

.top10_card:nth-child(4n+2) a.interview_lnk.top10_inter:hover .inter_arrow path,
.top10_card:nth-child(4n+3) a.interview_lnk.top10_inter:hover .inter_arrow path {
    fill: var(--d-blue);
}

/*** END TOP 10 ***/

/*** ALL MEMBERS ***/
section.all_members {
    padding: 6rem 0 6rem;
}

.all_members_card {
    display: flex;
    flex-wrap: wrap;
    border-top: 0.1rem solid #E3E3E3;
    padding: 2rem 0;
}

.all_members_foto {
    position: relative;
    width: 10rem;
    height: 10rem;
    margin-right: 2rem;
}

.all_members_foto img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
}

.all_members_text {
    flex: 1;
    display: flex;
    align-items: flex-start;
}

.all_members_content {
    flex: 1;
    margin: 0 4rem;
}

a.linkedin_lnk.all_members_link {
    color: var(--bl);
}

a.linkedin_lnk.all_members_link:hover {
    color: var(--d-blue);
}

.all_members_title {
    width: 30%;
}

.all_members_fio {
    font-size: 2rem;
    margin-bottom: 1rem;
}

/*** END ALL MEMBERS ***/

span#winner,
span#top3,
span#top10,
span#all_members {
    position: relative;
    top: -9rem;
}



/*** FOOTER ***/
footer {
    background: var(--y-blue);
    padding: 2rem 0;
}

a.footer_logo {
    display: block;
    margin-bottom: 2rem;
}

a.footer_logo img {
    height: 3.7rem;
    width: auto;
}

.footer_logo_wrap {
    width: 40%;
    margin-right: auto;
}

.footer_desc_all {
    font-weight: 500;
    margin-bottom: 2rem;
}

.footer_row {
    margin: 0;
}

.copywrite {
    margin-top: 5rem;
    border-top: 0.1rem solid var(--l-blue);
    padding-top: 2rem;
}

.footer_title {
    font-weight: 500;
    margin-bottom: 2rem;
}

.contacts_wrap {
    display: flex;
    flex-wrap: wrap;
}

.footer_contacts {
}

.contacts_col {
    display: flex;
    align-items: flex-start;
    margin-left: 2rem;
}

.contacts_col > img {
    margin-right: 1rem;
    width: 2.4rem;
    height: 2.4rem;
    object-fit: contain;
}

.contacts_list {
    display: flex;
    flex-direction: column;
    max-width: 20rem;
    align-items: flex-start;
}

.contacts_list a, .contacts_list span {
    margin-bottom: 1rem;
    color: var(--bl);
}

.contacts_col:first-child {
    margin-left: 0;
}

.contacts_list a:hover {
    color: var(--d-blue);
}
/*** END FOOTER ***/


main {
    min-height: 70vh;
}



@media(max-width: 800px){
	span#winner,
	span#top3,
	span#top10,
	span#all_members {
	    position: relative;
	    top: -12rem;
	}

	
	html{
		font-size: 2.5vw;
	}

	.container {
	    max-width: 100%;
	    padding: 0px 2rem;
	}
	
	.ul_main_menu {
	    display: none;
	}
	
	.head_desc_all {
	    margin-top: 1rem;
	    order: 2;
	}
	
	a.header_logo {
	    order: 0;
	}
	
	.burger {
	    display: block;
	    order: 1;
	    margin-left: auto;
	}
	
	section.banner h1 {
	    width: 100%;
	    font-size: 4rem;
	}
	
	.banner_desc {
	    width: 100%;
	    font-weight: 500;
	}
	
	.winner_info {
	    width: 100%;
	    order: 1;
	    padding-top: 2rem;
	    padding-right: 0;
	    height: auto;
	}
	
	.winner_foto img {
	    width: 100%;
	    position: relative;
	}
	
	.winner_foto {
	    width: calc(100% + 4rem);
	    order: 0;
	    margin: 0 -2rem;
	}
	
	section.winner {
	    padding-top: 0;
	}
	
	h2, .h2 {
	    font-size: 4rem;
	    text-align: center;
	    margin-bottom: 2rem;
	}
	
	.winner_fio {
	    font-size: 2.6rem;
	    text-align: center;
	    order: 1;
	}
	
	.winner_firm {
	    margin-bottom: 2rem;
	    text-align: center;
	    order: 2;
	}
	
	.winner_info h2 {
	    order: 0;
	}
	
	.winner_text {
	    margin: 0;
	    order: 3;
	}
	
	a.linkedin_lnk.winner_link {
	    order: 4;
	}
	
	a.interview_lnk.winner_inter {
	    width: 100%;
	    justify-content: space-between;
	    order: 6;
	}
	
	section.top3 {
	    padding: 6rem 0 1rem;
	}
	
	.top3_card {
	    margin-bottom: 2rem;
	}
	
	section.top10 {
	    padding: 6rem 0 3rem;
	}
	
	.top10_card {
	    width: 100%;
	}
	
	.top10_foto {
	    width: 100%;
	    height: 32rem;
	}
	
	.top10_text {
	    padding: 2rem 0 0;
	}
	
	.top10_card:nth-child(4n+2), .top10_card:nth-child(4n+3) {
	    background: var(--l-blue);
	}
	
	.top10_card:nth-child(2n) {
	    background: var(--wh);
	}
	
	.top10_card:nth-child(4n+2) a.interview_lnk.top10_inter, .top10_card:nth-child(4n+3) a.interview_lnk.top10_inter {
	    background: var(--wh);
	}
	
	.top10_card:nth-child(2n) a.interview_lnk.top10_inter {
	    background: var(--y-blue);
	}
	
	.top10_card:nth-child(4n+2) a.interview_lnk.top10_inter .inter_arrow, .top10_card:nth-child(4n+3) a.interview_lnk.top10_inter .inter_arrow {
	    background: var(--y-blue);
	}
	
	.top10_card:nth-child(2n) a.interview_lnk.top10_inter .inter_arrow {
	    background: var(--wh);
	}
	
	.all_members_foto {
	    width: 100%;
	    margin: 0 0 2rem;
	    height: 35rem;
	}
	
	.all_members_title {
	    width: 60%;
	    order: 0;
	}
	
	a.linkedin_lnk.all_members_link {}
	
	a.linkedin_lnk.all_members_link {
	    order: 1;
	    margin-left: auto;
	}
	
	.all_members_content {
	    order: 2;
	    margin: 2rem 0 0;
	}
	
	.all_members_text {
	    flex-wrap: wrap;
	    flex-wrap: wrap;
	}
	
	a.footer_logo img {
	    width: 100%;
	    height: auto;
	}
	
	.footer_logo_wrap {
	    width: 100%;
	}
	
	.footer_desc {
	    margin-bottom: 4rem;
	}
	
	.contacts_col {
	    margin: 0 0 4rem;
	}
	
	.footer_title {
	    margin-bottom: 4rem;
	    font-size: 3rem;
	}
	
	.contacts_col:last-child {
	    margin-bottom: 0;
	}
	
	.copywrite {
	    margin-top: 2rem;
	}
}