/* RESET
--------------------------------*/
* { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: middle; outline: none; -webkit-appearance: none;}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, b-footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse; border-spacing: 0;}
thead {display: table-header-group; vertical-align: middle; border-color: inherit;}
tbody {display: table-row-group; vertical-align: middle; border-color: inherit;}
tr {display: table-row; vertical-align: inherit; border-color: inherit;}
td, th {padding: 0;}
th {background-color: #78ABC9; color: white}
/* REUSABLE STYLES
---------------------------------*/
.hidden {display: none;}
.clearfix:after {content: ''; display: block; height: 0; clear: both; visibility: hidden;}
.invisible {opacity: 0;}
.affix {position: fixed;}
.afabs {position: absolute;}
.pull-left {float: left;}
.pull-right {float: right;}
.two-column {width: 50%; display: inline-block;}
.bxbb {box-sizing: border-box;}
.child-center:before {content: ''; display: inline-block; height: 100%; vertical-align: middle;}

/* FONTS
---------------------------------*/
body {font: 300 20px/1.4 'Roboto', sans-serif;}
.font-bold {font: 700 20px/1.4 'Roboto Slab', serif;}

/* FOUNDATION
---------------------------------*/
html {height: 100%;}
body {color: #56575b; background-color: #fff; }
a, button {transition: all 0.3s ease; cursor: pointer;}
html.applePointer, body.applePointer {cursor: pointer;}
strong {font-weight: 700;}
button, input[type="submit"] {cursor: pointer;}
img { border: none;}
svg {pointer-events: none;}
a:hover {text-decoration: none;}
::-webkit-input-placeholder {color:#b4b6bf;}
::-moz-placeholder          {color:#b4b6bf;}/* Firefox 19+ */
:-moz-placeholder           {color:#b4b6bf;}/* Firefox 18- */
:-ms-input-placeholder      {color:#b4b6bf;} 
:focus::-webkit-input-placeholder {color: transparent}
:focus::-moz-placeholder          {color: transparent}
:focus:-moz-placeholder           {color: transparent}
:focus:-ms-input-placeholder      {color: transparent}

/* GENERAL
---------------------------------*/
.wrap {max-width: 1010px; margin: 0 auto;}
.grey-bg {background-color: #edf2ee;}
.red-bg{text-align: center; padding: 40px 0; background-color: #ffeef1;}
.faq_red-bg-header{font-size: 24px; color: #DE0019}
.btn {width: 154px; border: none; border-radius: 4px; line-height: 50px; color: #fff; text-align: center; background-color: #2b527b; text-transform: uppercase; transition: all 0.3s ease; letter-spacing: 2px;}
.btn:hover {background-color: #315d8b;}
@media only screen and (max-width: 1010px){
  .wrap {margin: 0 15px;}
}
@media only screen and (max-width: 765px){
  body {font-size: 16px;}
}

/* header
---------------------------------*/
.header {padding: 19px 0;display: flex; justify-content: space-between; max-width: 1010px; margin: 0 auto;}
.header__logo {margin: auto 0}
.header__logo img {width: 78px}
.phone-info {margin: auto 0;}
.header__phone-info div {width: 198px; display: inline-block}
.header__phone-info span {margin-right: 8px}
.header__phone-info a {color: #2b527b; text-decoration: none;}
.header-language-switch { flex-basis: 185px;height: 100%; margin: auto 0; }
.header-language-switch select { width: 100%;height: 100%;background: none;border: none;-webkit-appearance: none;cursor: pointer;padding: 10px;text-indent: 5px; }
.header-language-switch__select { background: #ffffff;border: 1px solid #83868d;border-radius: 4px;position: relative; }
.header-language-switch__select:after { content: '';width: 0;height: 0;border-style: solid;border-width: 10px 7px 0;border-color: #000000 transparent transparent transparent;position: absolute;top: 50%;right: 11px;transform: translateY(-50%);cursor: pointer; }
@media only screen and (max-width: 1010px){
  .header {margin: 0 15px; padding: 12px 0;}
  .header__logo img {width: 250px;}
  .header-language-switch { flex-basis: 240px; }
}
@media only screen and (max-width: 765px){
  .header__phone-info div {width: 167px;}
}
@media only screen and (max-width: 700px){
  .header {padding: 10px 0;}
  .header__logo img {width: 180px; }
}
@media only screen and (max-width: 477px){
  .header {text-align: center; display: inline}
  .header__logo {margin-bottom: 10px}
  .header-language-switch { width: 115px; margin: 20px auto 0; }
}
/* card-charged
---------------------------------*/
.card-charged {position: relative; padding: 115px 0 227px; text-align: center; background: #e6e6e6 url(../img/bg.png) no-repeat center bottom / cover; color: black;}
.card-charged__heading {margin-bottom: 20px; font-size: 3rem;}
.card-charged__subheading {max-width: 810px; margin: 0 auto; font-weight: 600;}
.card-charged__mouser-scroll {position: absolute; left: 50%; bottom: 84px; width: 20px; transform: translateX(-50%);}
@media only screen and (max-width: 1010px){
  .card-charged {padding: 85px 0 200px;}
  .card-charged__heading {font-size: 51px;} 
}
@media only screen and (max-width: 765px){
  .card-charged {padding: 50px 0 150px;}
  .card-charged__heading {font-size: 41px;}
  .card-charged__mouser-scroll {bottom: 58px;}
}
@media only screen and (max-width: 520px){
  .card-charged {padding: 48px 0 115px;}
  .card-charged__heading {font-size: 30px; line-height: 1.2;} 
  .card-charged__mouser-scroll {bottom: 41px;} 
}
/* descriptor
---------------------------------*/
.descriptor{padding: 60px 0 60px 0; width: auto; border-bottom: 1px solid black;}
.descriptor__list{display: flex}
.descriptor_text{width: 50%; font-size: 18px}
.descriptor_text-header{font-size: 24px;color: #78ABC9;}
.descriptor_table{width: 40%; margin-left: 10%;}
.table {width: 100%; max-width: 100%; margin-bottom: 20px; background-color: transparent;}
.statement-illu { box-shadow: 0 0 25px 2px rgba(0, 0, 0, 0.2); }
.statement-illu .descriptor_string {background: #fff;outline: solid 1px rgba(0, 0, 0, 0.15);box-shadow: 0 0 18px 2px rgba(0, 0, 0, 0.3);z-index: 100;width: 40%;}
.statement-illu tbody tr:not(.descriptor_string) {-webkit-filter: blur(1px); filter: blur(1px);}
.table-striped>tbody>tr:nth-of-type(odd) { background-color: #f9f9f9;}
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {padding: 8px;line-height: 1.42857143;vertical-align: top;border-top: 1px solid #ddd;}
@media only screen and (max-width: 820px){
  .descriptor{text-align: -webkit-center}
  .descriptor__list{display: block;}
  .descriptor_text{width: 90%;}
  .descriptor_table{margin: 20px 0 0;}
}
@media only screen and (max-width: 765px){
  .descriptor_table{width: 50%;}
  .descriptor_text{font-size: 16px;}
}
@media only screen and (max-width: 500px){
  .descriptor_table{width: 70%;}
}
/* opportun__list
---------------------------------*/
.opportun {padding: 62px 0 45px;}
.opportun__list {display: flex; flex-direction: row; justify-content: space-around;}
.opportun__item {text-align: center;}
.opportun__icon {display: inline-block;}
.opportun__heading {margin: 20px 0 7px; font-size: 28px; color: #5f795e;}
.opportun__text {max-width: 240px;}
@media only screen and (max-width: 1010px){
  .opportun__heading {font-size: 26px;}
  .opportun__text {max-width: 226px;}
}
@media only screen and (max-width: 765px){
  .opportun__item_middle {margin: 0 15px; }
  .opportun__icon-holder {min-height: 136px;}
  .opportun__icon {width: 120px;}
  .opportun__heading {margin: 12px 0 4px; font-size: 20px;}
}
@media only screen and (max-width: 530px){
  .opportun {padding: 45px 0;}
  .opportun__icon {width: 95px;}
  .opportun__icon-holder {min-height: 109px;}
  .opportun__heading {margin-top: 9px; font-size: 16px;}
  .opportun__text {font-size: 14px;}
}
@media only screen and (max-width: 420px){
  .opportun__list {display: block;}
  .opportun__item_middle {margin: 0;}  
  .opportun__item {margin-top: 30px;}
  .opportun__item:first-child {margin-top: 0;}
  .opportun__text {max-width: 100%;}
  .opportun__heading {font-size: 20px;}
}

/* support__email
---------------------------------*/
.support-email {padding: 40px 0 55px; /*border-top: 1px solid #54555a;*/}
.support-email__heading {font-size: 48px; text-align: center;}
.support-email__subheading {margin-top: 38px; font-size: 20px;}
.support-email__form {margin-top: 27px;}
.form__field-box {position: relative; margin-top: 24px;}
.form-support__name {margin-top: 22px;}
.form__label {display: block; margin-bottom: 7px;}
.form__input {width: 100%; border: 1px solid #83868d; padding: 10px; border-radius: 4px; background-color: #fff; font-size: 18px;}
.form-support__input-message {min-height: 135px; resize: vertical;}
.form__error {display: none; position: absolute; left: 0; bottom: -30px; height: 26px; width: 100%; font-size: 12px; line-height: 1.1; color: #ee1f3b;}
.form__field-box_error .form__error {display: block;}
.form__field-box_error .form__input {border-color: #ee1f3b;}
.form-support__name,
.form-support__email {width: 49%; margin-top: 0;}
.form-support__submit {position: relative; top: 3px; width: 251px;}
.form-support__message-type {width: 49%; margin-top: 23px;}
.form-support__message-type select {width: 100%; height: 100%; background: none; border: none; -webkit-appearance: none; cursor: pointer; padding: 10px; text-indent: 5px;}
.form-support__message-type .form-support__message-type-select {background: #ffffff; border: 1px solid #83868d;border-radius: 4px; position: relative;}
.form-support__message-type .form-support__message-type-select:after {content: ''; width: 0;height: 0; border-style: solid; border-width: 10px 7px 0; border-color: #000000 transparent transparent transparent; position: absolute; top: 50%; right: 11px; transform: translateY(-50%); cursor: pointer}
.form__required {color: #dba400;}
@media only screen and (max-width: 750px){
  .support-email__heading {font-size: 40px;}
}
@media only screen and (max-width: 560px){
  .support-email__heading {font-size: 36px;}
  .support-email__subheading {margin-top: 30px;}
  .support-email__form {margin-top: 19px;}
  .form-support__name, .form-support__email {width: 100%; float: none;}
  .form-support__email {margin-top: 24px;}
  .form-support__message-type {
    width: 100%;
  }
}
@media only screen and (max-width: 480px){
  .support-email {padding: 38px 0 47px;}
  .support-email__heading {font-size: 30px;}
  .form-support__req-submit-hold {margin-top: 19px;}
  .form-support__required-info {float: none;}
  .form-support__submit {float: none; width: 100%; margin-top: 22px;}
}

/* support-phone
---------------------------------*/
.support-phone {padding: 42px 0;}
.support-phone__content {width: 790px; margin: 0 auto;}
.support-phone__phone-illustration {width: 237px; height: 237px;}
.support-phone__info {margin-left: 356px; padding-top: 25px;}
.support-phone__heading {font-size: 48px;}
.support-phone__subheading {margin-top: 24px;}
.support-phone__phone-number {font-size: 48px; color: #5f795e; float: left;}
@media only screen and (max-width: 820px){
  .support-phone__content {width: 600px;}
  .support-phone__phone-illustration {width: 190px; height: 190px;}
  .support-phone__info {margin-left: 280px; padding-top: 22px;}
  .support-phone__heading {font-size: 36px;}
  .support-phone__subheading {margin-top: 21px; font-size: 17px;}
  .support-phone__phone-number {font-size: 35px;}
}
@media only screen and (max-width: 630px){
  .support-phone__content {width: 100%; text-align: center;}
  .support-phone__phone-illustration-holder {float: none;}
  .support-phone__phone-illustration {display: inline-block; width: 170px; height: 170px;}
  .support-phone__info {margin-left: 0;}
  .support-phone__info div{margin-top: 19px}
}
@media only screen and (max-width: 480px){
  .support-phone {padding: 42px 0 37px;}
  .support-phone__phone-illustration {width: 155px; height: 155px;}
  .support-phone__info {padding-top: 15px;}
  .support-phone__heading {font-size: 30px;}
  .support-phone__phone-number {display: block; margin-top: 4px; font-size: 32px;}
}

/* customer-care
---------------------------------*/
.customer-care {padding: 48px 0; text-align: center; /*background: url(../images/customer-care-bg.svg) no-repeat center bottom / 1010px auto;*/}
.customer-care__heading {margin: 37px 0 17px; font-size: 24px; color: #5f795e;}
@media only screen and (max-width: 765px){
  .customer-care {padding: 43px 0;}
}

/* faq
---------------------------------*/
.faq {padding-top: 35px; border-top: 1px solid #54555a;}
.faq__heading {text-align: center; font-size: 48px;}
.faq__list-block {margin-top: 34px; padding: 32px 0 55px;}
.list-faq__item {padding: 10px 0 10px 33px; /*background: url(../images/list-faq-separator.png) left top repeat-x;*/}
.list-faq__item:first-child {padding-top: 0; padding-bottom: 0; background: none;}
.list-faq__item:last-child {padding-bottom: 0; padding-top: 0;}
.title-list-faq {position: relative;}
.title-list-faq__icon-holder {position: absolute; left: -33px; top: 7px; display: block; width: 18px; height: 18px; background-color: #2b527b; border-radius: 50%; border: 1px solid #2b527b; cursor: pointer;}
.title-list-faq__icon:before, 
.title-list-faq__icon:after {content: ''; position: absolute; top: 4px; left: 7px; width: 2px; height: 9px; display: block; background: #fff; transform: rotate(0deg); transition: all 0.4s ease-out;} 
.title-list-faq__icon:before {transform: rotate(90deg);}
.list-faq__item_active .title-list-faq__icon-holder {background-color: #fff;}
.list-faq__item_active .title-list-faq__icon:before, 
.list-faq__item_active .title-list-faq__icon:after {background-color: #2b527b;}
.list-faq__item_active .title-list-faq__icon:after {transform: rotate(90deg);}
.title-list-faq__text {font-size: 22px; color: #2b527b; line-height: 1.3; cursor: pointer;}
.list-faq__item_active .title-list-faq__text {color: #55565a;}
.list-faq__text {display: none; margin-top: 20px;}
@media only screen and (max-width: 1010px){
  .faq__heading {font-size: 44px;}
}
@media only screen and (max-width: 767px){
  .faq__list-block {padding-bottom: 44px;}
  .faq__heading {font-size: 38px;}
  .list-faq__item {padding-top: 34px;}
  .title-list-faq__text {font-size: 20px;}
  .title-list-faq__icon-holder {top: 5px;}
}
@media only screen and (max-width: 480px){
  .title-list-faq__text {font-size: 18px;}
  .title-list-faq__icon-holder {top: 2px;}
} 

/* footer
---------------------------------*/
.footer {padding: 33px 0 32px; background-color: #e6e6e6;}
.footer__logo {width: 50px; height: 45px;}
.footer__phones {display: inline-block; font-size: 16px; font-weight: bold; position: relative; margin-left: 4%;}
.footer__phones a {color: #2b527b; text-decoration: none; float: right;}
.footer__copyright {padding-top: 1px; color: #9b9c9f;}
@media only screen and (max-width: 765px){
  .footer__phones {margin-left: 10%;}
  .footer__copyright {padding-top: 7px;}
}
@media only screen and (max-width: 480px){
  .footer {padding: 28px 0 25px; text-align: center;}
  .footer__logo-holder,
  .footer__copyright {float: none;}
  .footer__logo {display: inline-block;}
  .footer__phones {margin-left: 0;}
  .footer__copyright {display: block; margin-top: 13px;}
}

/* popup
---------------------------------*/
.popup-holder {display: none; position: fixed; left: 0; top: 0; z-index: 5; width: 100%; height: 100%; background-color: #000; background-color: rgba(0,0,0,.5);}
.popup {display: none; position: fixed; left: 50%; top: 200px; z-index: 6; width: 576px; padding: 37px 15px 50px; border-radius: 5px; background-color: #fff; overflow: hidden; transform: translateX(-50%); color: #55565a; text-align: center;}
.popup__icon {position: relative; left: 4px; display: inline-block; width: 80px;}
.popup__heading {font-size: 32px; margin-top: 15px;}
.popup__subheading {margin-top: 9px; font-size: 18px;}
.popup__btn-holder {margin-top: 24px;}
.popup__close-icon {position: absolute; right: 14px; top: 12px; width: 22px; height: 22px; opacity: 0.8; transition: all 0.3s ease; cursor: pointer;}
.popup__close-icon:hover {opacity: 1;}
.popup__close-icon:before, .popup__close-icon:after {position: absolute; left: 15px; content: ''; height: 22px; width: 2px; background-color: #54555a; }
.popup__close-icon:before {transform: rotate(45deg);}
.popup__close-icon:after {transform: rotate(-45deg);}
@media only screen and (max-width: 1000px){
  .popup {top: 130px;}
}
@media only screen and (max-width: 576px){
  .popup {left: 10px; right: 10px; width: auto; padding: 35px 10px 25px; transform: translateX(0);}
  .popup__icon {width: 60px;}
  .popup__heading {margin-top: 4px; font-size: 36px;}
  .popup__subheading {font-size: 20px;}
  .popup__btn-holder {margin-top: 16px;}
}
.text-png {
  position: relative;
  top: 4px;
}
.footer__address {
  color: #9b9c9f; margin-top: 18px;text-align: center;
}
