
body .q2020 { font: 16px/1.5 'Roboto', sans-serif; font-weight: 300; }

.q2020 a:not(.btn) { color:#2772b2; }
.q2020 a:hover:not(.btn) { color:#4aa4ff; }

.q2020 .upper-side { background-color: #d8dbe4; height: 50px; }
.q2020 .upper-side .flag-eu {
    background: transparent;
    width: 100%;
    height: 50px;
    left: 0%;
    position: static;
    text-align: left; }
.q2020 .authInfo { color:#878a91 }
.q2020 .authInfo a { color:#878a91 !important }

.q2020 .top { height: auto; background: #fff; padding: 0; margin: 0; }
.q2020 .top-small { border-bottom:5px solid #015da0 }

.home-page-logo { text-align: center; padding: 30px 0 30px 0}
.home-page-logo img { max-width: 445px; }

.page-logo { text-align: left; padding: 15px 0 10px 0}
.page-logo img { max-width:190px; }

.q2020 .top .main-nav ul { display: flex; justify-content: space-between; width: 100%; font-size:20px; font-weight: 300; padding-bottom: 15px; }
.q2020 .top-small .main-nav ul { padding-bottom: 10px; }
.q2020 .top .main-nav li a { color:rgb(51,51,51); text-decoration: none; }
.q2020 .top .main-nav li a.s { font-weight: normal;}
.q2020 .top .main-nav li a:hover { text-decoration: none; border-bottom: 1px solid rgb(51,51,51); }

.q2020 .popup-nav { background:#d8dbe4;/* #e8e8e8;*/ border-top: 1px solid #ccc; padding: 0px 0; }
.q2020 .popup-nav a.nav-close { opacity: 0.5; transition: 0.3s; }
.q2020 .popup-nav a.nav-close { position: relative; display: block; }
.q2020 .popup-nav .nav-close img { display: block; position: absolute; top:10px; right: 0px; width: 32px; height: 32px; }
.q2020 .popup-nav ul { padding: 0; list-style-type: none; list-style-position: outside; margin: 30px 0px 20px 0px; }
.q2020 .popup-nav ul li { display: inline-block;margin: 0; padding: 0; width: 33%; padding: 5px 0 5px 0px; }
.q2020 .popup-nav a { color: #000; text-decoration: none; font-size: 16px; transition: 0.3s; }
.q2020 .popup-nav a:hover { color: #5f5f5f; text-decoration: underline; }


.q2020 .intro { background:#005da3; color:#fff;}
.q2020 .intro .intro-pic img { display: block}
.q2020 .intro .title {    font-size: 55px; font-weight: 300; padding-top: 10px;}
.q2020 .intro .sub-title {font-size: 23px; font-weight: 400; padding-bottom:1em;}
.q2020 .intro .abstr {font-size: 18px; }
.q2020 .social-links { margin: 0; height: 50px; padding: 52px 0 5px 0;}
.q2020 .social-links li { padding-right: 10px; }

.q2020 .section-about { padding-bottom: 80px; }
.q2020 .section-about .item { padding: 80px 16% 0 16%; }
.q2020 .section-about .item .pic { padding-bottom: 0.5em; transition: 0.3s;}
.q2020 .section-about .item .pic:hover { opacity:0.66}
.q2020 .section-about .item .pic img{ display: block; max-width: 80px; margin: 0 auto; padding: 0; }
.q2020 .section-about .item .head { text-align: center; color:#025fa2; font-size:22px; font-weight:400; padding-bottom: 1em; }
.q2020 .section-about .item .txt { text-align: center; }
.q2020 .section-about .item a { text-decoration: none }
.q2020 .section-about .item a:hover { text-decoration: underline }

.q2020 .section-fast-games {background-color:#d8dbe4; padding: 45px 0;}
.q2020 .section-fast-games .item { }
.q2020 .section-fast-games .item .circle { display:block; border-radius: 50%;  background:#0560a6; color:#fff;
width: 176px; height: 176px; margin: 0 auto; text-decoration: none; }
.q2020 .section-fast-games .item .head { font-size:22px; font-weight: 400; text-align: center; line-height: 1.2em; padding-top: 25px; }
.q2020 .section-fast-games .item .pic { }
.q2020 .section-fast-games .item .pic img { display: block; max-width:100px; margin: 0 auto; position: relative; top:-5px; }
.q2020 .section-fast-games .item .txt { color:#0560a6; text-align: center; padding: 20px 10% 0 10%; }
.q2020 .section-fast-games .shift { position: relative; top:-15px; }

.q2020 .home-blog { padding: 80px 0; }
.q2020 .home-blog .item { padding: 0px 0; min-height: 41em; }
.q2020 .home-blog .item .flat-head {background: #005da3; color: #fff; text-align: center; font-size:22px; font-weight: bold; padding: 5px 0; }
.q2020 .home-blog .item .head { font-size: 20px; font-weight: 400; line-height: 1.3; padding: 10px 0; }
.q2020 .home-blog .item .head a { text-decoration: none; color:#313131; }
.q2020 .home-blog .item .sub-head {margin-left: 0px; font-size: 90%; color: #aaa; padding-bottom: 1em; }
.q2020 .home-blog .item .a-pic { display: block; background-position: center center; background-size: cover; height:300px; width: 100%; }
.q2020 .home-blog .item .abstr { padding-bottom: 1em; }
.q2020 .home-blog .item .read-more { text-align: right;  padding-bottom: 1em; }
.q2020 .home-blog .item .read-more a { text-decoration: none; color:#aaa;}
.q2020 .home-blog .item .read-more a:hover { text-decoration:underline;}
.q2020 .home-blog .go-more { border-top:1px solid #4aa6fd; color:#005da3; text-transform: uppercase; text-align: center; padding: 20px 0; font-weight: 400;     font-size: 18px; }
.q2020 .home-blog .go-more a { text-decoration:none; color:#005da3;  }
.q2020 .home-blog .go-more a:hover { text-decoration:underline; }

.q2020 .footer { background: #d8dbe4; font-size: 16px; color: #4b4f50; padding: 35px 0 5px 0; text-align: center;}
.q2020 .footer .first-block { padding-bottom: 20px; }
.q2020 .footer .head-social { font-size:20px; }
.q2020 .footer .social-links { margin: 0; padding: 20px 0 30px 0; }
.q2020 .footer .social-links li { padding-right: 10px; display: inline-block;}
.q2020 .footer .all-text,
.q2020 .footer .spounsor { font-size:14px; font-weight: 400; color:#005da3; }
.q2020 .footer .all-text a,
.q2020 .footer .spounsor a { color:#005da3; }
.q2020 .footer .eu { text-align: left; }
.q2020 .footer .eu img.flag {float:left; padding-right:20px;}
.q2020 .footer .partners { text-align: right; }

.q2020 .copyr { font-size: 13px; background: #005da3; color: #fff; text-align: center; font-weight: 400; opacity: 1; }

.q2020 .hamburger-inner,
.q2020 .hamburger-inner::before,
.q2020 .hamburger-inner::after { width: 35px; height: 3px; }
.q2020 .hamburger { padding: 17px 15px 12px 15px; }

.q2020 .mobile-nav { display: none; overflow-y: scroll; background: rgba(255,255,255,0.98); position: fixed; width: 100%; height: 100%; text-align: center; z-index: 5000; top: 0px; left: 0px; }
.q2020 .nav-shrink { z-index: 5001; }

.q2020 .mobile-nav .nav-page-logo { width: 80%; margin: 0 auto; text-align: left; padding-top:20px;  }
.q2020 .mobile-nav .nav-page-logo img {     max-width: 150px; position: relative; left: -5px; }
.q2020 .mobile-nav .main-nav { display: block; }
.q2020 .mobile-nav .main-nav ul { text-align: left; }
.q2020 .mobile-nav .main-nav ul li { font-size:22px; width: 80%; margin: 0 auto; padding:7px 0; list-style: none; }
.q2020 .mobile-nav .main-nav ul li a { text-decoration: none; font-weight: normal; }
.q2020 .mobile-nav .main-nav ul li ul { padding-top: 0; }
.q2020 .mobile-nav .main-nav ul li ul li { padding-top: 0; font-size:18px; }
.q2020 .mobile-nav .main-nav .js-popup-content { display: none }

.q2020 h1 { color:#025da3; }

.q2020 .blog-articles {}
.q2020 .blog-articles .item { display:flex; width: 100%; padding-bottom: 40px;}
.q2020 .blog-articles .item .pic      { margin-right:30px; }
.q2020 .blog-articles .item .pic a { display: block; width:270px; height:180px; background: #f1f1f1 center center;     background-size: cover;}
.q2020 .blog-articles .item .data     { width: 100%; }
.q2020 .blog-articles .item .head     { font-size: 150%; padding-bottom:0; }
.q2020 .blog-articles .item .head a { text-decoration: none; }
.q2020 .blog-articles .item .head a:hover { text-decoration:underline; }
.q2020 .blog-articles .item .sub-head { font-size: 90%; color:#8e8e8e; }
.q2020 .blog-articles .item .sub-head span { padding-right: 20px; }
.q2020 .blog-articles .item .sub-head span.pub { padding-right: 20px; }
.q2020 .blog-articles .item .sub-head span.views { display:none; }
.q2020 .blog-articles .item .abstr    { padding-top: 15px; }
.q2020 .blog-articles .item .read-more { text-align: right;}
.q2020 .blog-articles .item .read-more a { color:#b0b0b0; }

.q2020 .blog-view { display: flex; flex-wrap: nowrap; width: 100%; padding-top:5px; padding-bottom: 2em;}
.q2020 .blog-view .main-side { width: calc(100% - 390px); }
.q2020 .blog-view .a-side { width: 390px; }

.q2020 .blog-view .pre-head { color:#025da3; font-size:220%; }
.q2020 .blog-view h1 { font-size:270%; font-weight: normal; color:#000;     line-height: 1.2em; }
.q2020 .blog-view .sub-head { font-size: 90%; color:#8e8e8e;padding-bottom: 1em;  }
.q2020 .blog-view .sub-head span { padding-right: 20px; }
.q2020 .blog-view .sub-head .pub {}
.q2020 .blog-view .sub-head .views { display: none; }
.q2020 .blog-view .sub-head .author { display: none; }
.q2020 .blog-view .img { padding-bottom: 1em; }
.q2020 .blog-view .img .inner {width: 100%; max-height: 600px; background: #fff center center no-repeat; background-size: contain;}
.q2020 .blog-view .img img {/* opacity: 0;*/
  /* width: 100%;  */
  display: block; margin: 0 auto; max-height: 450px; max-width: 100%; }
.q2020 .blog-view .abstr { font-size:130%; font-style: italic; font-weight: normal; }
.q2020 .blog-view .txt {}
.q2020 .blog-view .share-area { filter: saturate(0); opacity: 0.5; transition: 0.3s;     padding-top: 1em;}
.q2020 .blog-view .share-area:hover { filter: saturate(100%); opacity: 1;}
.q2020 .blog-view .border-left { border-left: 1px solid #808080; margin-left: 30px; padding-left: 30px; }
.q2020 .blog-view .recent-list { }
.q2020 .blog-view .recent-list .pre-head {color:#025da3; font-size: 120%; font-weight: normal; padding-bottom: 1em; }
.q2020 .blog-view .recent-list .item { padding-bottom: 3em;}
.q2020 .blog-view .recent-list .item .head { font-weight: normal; font-size:130%; line-height: 1.2;}
.q2020 .blog-view .recent-list .item .head a { text-decoration: none; color:#3d3d3d; }
.q2020 .blog-view .recent-list .item .head a:hover {  color:#4aa4ff; }
.q2020 .blog-view .recent-list .item .sub-head { font-size: 90%; color:#8e8e8e; padding-top:4px; }
.q2020 .blog-view .recent-list .item span { padding-right: 20px; }
.q2020 .blog-view .recent-list .item .views { display: none; }
.q2020 .blog-view .recent-list .item .abstr{ font-size:100%; font-style:normal; font-weight:300; }

.q2020 .btn-empty { border:1px solid #666; padding: 3px 10px; display: inline-block; color:#666; text-decoration: none;}
.q2020 .btn-empty:hover { border-color:#2772b2; background: #2772b2; color:#fff;}

.q2020 .pg-head .ctrl { display: flex; }
.q2020 .pg-head .ctrl a { margin-right:0px; font-size:120%; padding: 1px 25px; border:1px solid #666; text-decoration: none; color:#666; }
.q2020 .pg-head .ctrl a:hover { background-color: #eaeaea;}
.q2020 .pg-head .ctrl a.s { font-weight: normal; background-color:#005da3; color:#fff }
.q2020 .pg-head .form-select { border:1px solid #666; margin-left: 20px; }

.q2020 .list-posts .item { display: flex;     margin-bottom: 50px; }
.q2020 .list-posts .item .l-side { width:             150px; text-align: right; margin-right: 25px; }
.q2020 .list-posts .item .r-side { width: calc(100% - 150px - 25px)}
.q2020 .list-posts .item .avatar { width: 70px; height: 70px; border:none; float: none; margin-left: auto;}
.q2020 .list-posts .item .avatar img { border-radius: 50%; width: 100%; }
.q2020 .list-posts .item .name { margin-left: 0px; font-size: 100%; line-height: 1.2; padding-top: 10px; padding-bottom: 15px; }
.q2020 .list-posts .item .name a { color:#181818; }
.q2020 .list-posts .item .dt   { margin-left: 0px; padding-bottom: 10px; color:#7d7d7d; }
.q2020 .list-posts .item .org   { margin-left: 0px;color: #005ea8; font-size: 85%; font-weight: normal; }
.q2020 .list-posts .item .head { margin: 0px 0 10px 0; font-weight: 500; font-size: 130%; line-height: 1.2; padding-top: 2px; }
.q2020 .list-posts .item .head a { color: #181818; }
.q2020 .list-posts .item .head a:hover { text-decoration: underline; color:#2772b2}
.q2020 .list-posts .item .text { margin-left: 0px; margin-top: 0; padding-top: 2px; }
.q2020 .list-posts .item .pics { margin-left: 0px; }
.q2020 .list-posts .item .pics img { width: 240px;/* max-height: 120px;*/ display: block;     border: 1px solid #ccc !important;}
.q2020 .list-posts .item .flex { display: flex; }
.q2020 .list-posts .item .flex .flex-media { margin-right: 25px; width: 242px; }
.q2020 .list-posts .item .flex .flex-data  { width: 100%; }

.q2020 .list-posts .item .video { margin:0; }
.q2020 .list-posts .item .video .video-item { width: 240px; height:135px;  float: none; }
.q2020 .list-posts .item .video .video-item img { width: 240px; height: auto; left: 0; }

.q2020 .list-posts .item-related {display: block }
.q2020 .list-posts .item-related .author-info { display: flex; margin-bottom: 20px;  }
.q2020 .list-posts .item-related .author-info .avatar { width: 100px; margin: 0 20px 0 0; }
.q2020 .list-posts .item-related .link-read-more { padding-top: 10px; display: inline-block; }


.q2020 .post-view {}
.q2020 .post-view .pre-head { color: #025da3; line-height: 1.2;font-size: 200%; padding: 0 0 50px 0; }
.q2020 .post-view .head { color: #191919; line-height: 1.2;font-size:170%;}
.q2020 .post-view .post-content { display: flex; }
.q2020 .post-view .post-content .l-side { width: 150px; margin-right: 20px; text-align: left;}
.q2020 .post-view .post-content .r-side { width:calc(100% - 150px - 20px); }
.q2020 .post-view .avatar { width:100px; height:100px; border:none; float: none; }
.q2020 .post-view .avatar img { border-radius: 50%; width: 100%; }
.q2020 .post-view .name { margin-left: 0px; font-size: 100%; line-height: 1.2; padding-top: 10px; padding-bottom: 15px; }
.q2020 .post-view .name a { color:#181818; }
.q2020 .post-view .dt   { margin-left: 0px; padding-bottom: 10px; color:#7d7d7d; }
.q2020 .post-view .org   { margin-left: 0px;color: #005ea8; font-size: 85%; font-weight: normal; padding-left: 0; }
.q2020 .post-view .abstr {    margin-left: 0px; margin-top:20px; font-size: 120%; }
.q2020 .post-view .pics:first-child img { margin-left: 0; }
.q2020 .post-view .other-post-head { border-bottom:2px solid #838383; font-size:130%; font-weight: normal; text-align: left; margin: 30px 0 30px 0; color:#656565 }

.ul-yellow { margin: 50px 0 0 10px;}
.ul-yellow li { background: url(/i2020/yellow-bullet.png) 0px center no-repeat; margin-left: 0; list-style: none; padding: 0 0 0 30px; margin: 0 0 10px 0; }
.ul-yellow li a { color:#656565; text-decoration: none;}
.ul-yellow li a:hover { text-decoration: underline; }

.q2020 a.link-read-more { color:#7d7d7d; text-decoration: none; border-bottom: 1px solid #fff ; }
.q2020 a:hover.link-read-more { border-bottom: 1px solid #7d7d7d; }


.q2020 .pg-div .pg-info { display: none; }
.q2020 .pg-div .pages { padding: 0; }
.q2020 .pg-div .pages .pg-goto { border-radius: 50%; width: 30px; height: 30px; display: inline-flex; font-size: 90%; justify-content: center; align-items: center; line-height: 1; margin: 0 10px 10px 0; padding: 0; font-weight: bold; }

.q2020 .section-top-bg { min-height:260px; position: relative; top:-20px;     overflow: hidden; }
.q2020 .section-top-bg h1 { color:#fff; text-shadow:0 0 30px rgba(0,0,0,0.5), -30px 0px 70px rgba(0,0,0,1); position: absolute; bottom: 0px; left: 30px; line-height: 1.15; font-size:300%; font-weight: normal;     letter-spacing: -1px; }


.q2020 .netEU .ctrl-news-home { margin-top: 29px; }
.q2020 .netEU .list-news .item { margin-bottom:60px ;}
.q2020 .netEU .list-posts .item .flex { flex-direction: column; }
.q2020 .netEU .list-posts .item .pics { padding-bottom: 5px }
.q2020 .netEU-recent .pg-div { display: none;  }
.q2020 .netEU .list-news .item .head {font-weight: 500;  font-size: 130%; line-height: 1.2; padding-top: 12px; }
.q2020 .netEU .list-news .item .head a {color:#181818  }
.q2020 .netEU .list-news .item .head a:hover { text-decoration: underline; color: #2772b2; }

.q2020 .home-tiles .tile .text-on-bg { color:#fff; }

.q2020 .eu-list .blogArticles .blogItem .blogImg { border-radius:0%; width: 150px; height: 150px; padding-top: 0; }
.q2020 .eu-list .blogArticles .blogItem .blogImg img { display: block; }





.inverse { filter: invert(1); opacity: 0.5;}

.only-desktop { display: block; }
.only-tablet { display: none; }
.only-mobile { display: none; }
.only-tablet-mobile { display: none; }


/*** MEDIA ***/


@media screen and (max-width:1280px) {
  .q2020 .social-links { padding-top: 20px; }
}


@media screen and (max-width:1200px) {
  body .q2020 { font: 14px/1.5 'Roboto', sans-serif; font-weight: 300; }
  .q2020 .top .main-nav ul {font-size:18px; }

}


/* Mobile nav */
@media screen and (max-width:999px) {
  .main-nav { display: none; }
  .q2020 .intro .title { padding-top:0; }
  .q2020 .social-links { padding-top: 20px; }

  .q2020 .info-list { width: 50%; }

  .q2020 .list-lib-trn-practice .grid-25 { width: 50%; }
  .q2020 .section-top-bg h1 { font-size:220%;  }
}


@media screen and (max-width:768px) {
  .only-desktop { display: none; }
  .only-tablet { display: block; }
  .only-tablet-mobile { display: block; }

  .home-page-logo img { max-width: 300px; }
  .q2020 .intro .text { text-align: center; }
  .q2020 .intro .abstr br { display: none; }
  .q2020 .intro .intro-pic img { max-width: 400px; margin: 0 auto; display: block;}
  .q2020 .intro .social-area { display:none; }
  .q2020 .intro .social-mobile {padding-bottom: 20px;}

  .q2020 .blog-view h1 { font-size: 240%; }
  .q2020 .blog-view .pre-head { font-size: 200%; }
}

/* --- w < 767: Mobile --- */
@media screen and (max-width:760px) {
  .q2020 .blog-view .pre-head { font-size: 170%; }
  .q2020 .blog-view { flex-direction: column; }
  .q2020 .blog-view h1 { font-size: 200%; }
  .q2020 .blog-view .main-side { width: 100%;  border-bottom: 1px solid #808080; padding-bottom: 20px; }
  .q2020 .blog-view .border-left { margin-left: 20px;padding-left: 20px; }
  .q2020 .blog-view .recent-list .pre-head { padding-top: 1em; }
  .q2020 .blog-view .a-side { width: 100%; }
  .q2020 .blog-articles .item { flex-direction: column; }

  .q2020 .post-view .post-content { flex-direction: column; }
  .q2020 .post-view .post-content .l-side { width: 100%; }
  .q2020 .post-view .post-content .r-side { width: 100%; }
  .q2020 .post-view .dt { padding-bottom: 0px; }
  .q2020 .post-view .name { padding-bottom: 0; }

  .q2020 .library-contest-icon { width: 30%; }
  .q2020 .library-contest-icon img {display: block; margin: 19px auto; }
  .q2020 .info-list { width:100%; text-align: center; }
  .q2020 .list-lib-trn-practice .item .pic { height: 350px; }
  .q2020 .list-lib-trn-practice .grid-25 { width: 100%; }

  .q2020 .section-top-bg h1 { font-size:200%; left:0; text-align: center; width: 100%;}
}


/* --- w 360: Mobile --- */
@media screen and (max-width:576px) {
  .q2020 .intro .title { font-size: 40px; font-weight:500; }
  .q2020 .intro .sub-title { font-size: 19px; }
  .q2020 .intro .abstr { font-size: 16px; }
  .q2020 .section-fast-games .item .txt { padding-bottom: 30px; }
  .q2020 .footer .eu { text-align: center; padding-bottom: 30px; }
  .q2020 .footer .eu img.flag{float:none; padding-right:0px; display: block; margin: 0 auto}
  .q2020 .footer .partners { text-align: center; padding-bottom: 30px;}
  .q2020 .blog-articles .item .head { font-size: 140%; }
  .q2020 .blog-articles .item .sub-head { font-size: 80%; }

  .q2020 .list-posts .item .l-side { width: 100%; text-align: left; }
  .q2020 .list-posts .item .avatar {     margin-left: 0;}
  .q2020 .list-posts .item .dt { padding-bottom: 0; padding-left:0; }
  .q2020 .list-posts .item .org { padding-left: 0px; }
  .q2020 .list-posts .item { flex-direction: column; }
  .q2020 .list-posts .item .flex { flex-direction: column;}
  .q2020 .list-posts .item .flex .flex-media { width: 100%; }
  .q2020 .list-posts .item .r-side { width:100%; }
  .q2020 .list-posts .item .text { padding-top: 15px; }
  .q2020 .list-posts .item .name { padding-bottom: 0; }
  .q2020 .list-posts .item .head { padding-top: 10px; }
  .q2020 h1 { font-size:160%; }

  .q2020 .library-contest-icon { width: 40%; }
  .q2020 .list-lib-trn-practice .item .pic { height: 300px; }
}


@media screen and (max-width:340px) {
  .q2020 .blog-view .border-left { margin-left: 10px; padding-left: 15px;}
  .q2020 .blog-view h1 { font-size: 170%; }
  .q2020 .pg-head .ctrl { flex-direction: column; }
  .q2020 .pg-head .form-select { margin:20px 0 0px 0; }

  .q2020 .library-contest-icon span { border-bottom: none; }
  .q2020 .list-lib-trn-practice .item .pic { height: 200px; }
  .q2020 .pg-head .ctrl a { border-left: 1px solid #666 !important; }
}
