a.btn:hover {
  cursor: pointer;
  color: #0e4586;
  background-color: #fff;
}

section.buttons-wrap {
  display: flex;
  /*align-items: center;*/
  justify-content: center;
  min-height: calc(100vh - 280px);
}

.page-context-header .page-header-headings {
  display: none;
}

#top-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  background: url(//infodpopro.ru/learning/pix/h-bg.jpg) no-repeat, #0d4585;
  min-height: 135px;
  padding: 0 60px;
}

.ph-logo {
  display: flex;
  align-items: center;
}

.ph-logo span {
  font-size: 30px;
  line-height: 30px;
  color: #ffffff;
  margin-left: 15px;
}

section.info h1 {
  text-align: center;
}
section.info h2 {
  font-size: 20px;
  text-align: center;
  margin: 50px 0 25px;
}
.info li {
  margin: 0 0 5px;
}
.info p {
  line-height: 1.4;
}

.footer-row {
  display: flex;
  align-items: center;
  height: 181px;
  padding: 20px;
}

.footer-logo img {
  height: 85px;
  margin-right: 30px;
}

.footer-desc span {
  font-size: 20px;
  color: #fff;
}

/* Styles for wrapping the search box */

.panel {
  width: 750px;
  height: 400px;
  background: #838CC7;
  box-shadow: 1px 2px 3px 0px rgba(0,0,0,0.10);
  border-radius: 6px;
  overflow: hidden;
}

.panel-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 30px;
  height: 60px;
  background: #fff;
}
 
.title {
  color: #5E6977;
  font-weight: 500;
}
 
.calendar-views span {
  font-size: 14px;
  font-weight: 300;
  color: #BDC6CF;
  padding: 6px 14px;
  border: 2px solid transparent;
}

.panel-body {
  display: flex;
  height: 340px;
}

.categories {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex-basis: 25%;
  padding: 39px 0px 41px 26px;
}
.category {
  display: flex;
  flex-direction: column;
}
.category span:first-child {
  font-weight: 300;
  font-size: 14px;
  opacity: 0.6;
  color: #fff;
  margin-bottom: 6px;
}
.category span:last-child {
  font-size: 32px;
  font-weight: 300;
  color: #fff;
}

.chart {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  flex-grow: 2;
  position: relative;
}
 
.operating-systems {
  display: flex;
  justify-content: space-between;
  width: 215px;
  margin-top: 30px;
  margin-bottom: 50px;
}
span[class*="-os"] {
  font-size: 14px;
  font-weight: 300;
  font-size: 14px;
  color: #c3c6e4;  
}
span[class*="-os"] span {
  width: 9px;
  height: 9px;
  display: inline-block;
  border-radius: 50%;
  margin-right: 9px;
}
.android-os span {
  background: #80B354;
}
.ios-os span {
  background: #F5A623;
}
.windows-os span {
  background: #F8E71C;
}

.a_direction_education {
    display: block;
    padding: 25px 50px;
    color: #69757b;
    font-weight: 700;
    text-align: center;
    transition: all .15s;
    border-radius: 8px 8px 8px 8px;
    margin-right: 5px;
    border: 1px solid #cbcbcb;
    /*border-bottom: none;*/
    text-decoration: underline;
    width: 300px;
    margin: 10px;
}

@media (max-width: 1200px) {

  #top-header {
    flex-direction: column;
    padding: 30px;
  }

  .ph-logo span {
    font-size: 25px;
    text-align: center;
  }

  .ph-logo span br {
    display: none;
  }

}

@media (max-width: 768px) {
  .ph-logo img {
    display: none;
  }

  .ph-logo span,{
    font-size: 16px;
    line-height: 18px;
  }
}