diff --git a/src/features/BuyMatchPopup/components/SelectSubscription/index.tsx b/src/features/BuyMatchPopup/components/SelectSubscription/index.tsx
index 6b12f02e..67bd9741 100644
--- a/src/features/BuyMatchPopup/components/SelectSubscription/index.tsx
+++ b/src/features/BuyMatchPopup/components/SelectSubscription/index.tsx
@@ -3,6 +3,7 @@ import { useState } from 'react'
 import styled from 'styled-components/macro'
 
 import map from 'lodash/map'
+import isNull from 'lodash/isNull'
 
 import { MDASH } from 'config'
 import { SelectSubscriptionData } from 'requests'
@@ -33,7 +34,15 @@ import {
 export const ChooseSub = styled.div`
   font-weight: 600;
   font-size: 16px;
-  margin: 30px 0;
+  margin: 35px 0 17px;
+`
+
+export const ChooseSubItem = styled(Item)`
+  min-height: auto;
+`
+
+export const ChooseSubList = styled(List)`
+  height: auto;
 `
 
 export const SelectSubscriptionStep = () => {
@@ -57,7 +66,7 @@ export const SelectSubscriptionStep = () => {
       ...subscription.packages,
       season: initialSubscription.season,
     })
-    setActive(index)
+    index === active ? setActive(null) : setActive(index)
     setSelectSubName(subscription.lexic)
   }
 
@@ -77,10 +86,10 @@ export const SelectSubscriptionStep = () => {
         </HeaderActions>
       </Header>
       <Body marginTop={15}>
-        <List>
+        <ChooseSubList>
           {
             map(initialSubscription.data, (subscription, index) => (
-              <Item
+              <ChooseSubItem
                 key={subscription.id}
                 onClick={() => onItemClick(subscription, index)}
                 active={active === index}
@@ -96,17 +105,17 @@ export const SelectSubscriptionStep = () => {
                     <T9n t={subscription.lexic3} />
                   </Description>
                 </InfoWrapper>
-              </Item>
+              </ChooseSubItem>
             ))
           }
-        </List>
+        </ChooseSubList>
       </Body>
       <Footer>
         {loader
           ? <ArrowLoader width='204px' disabled />
           : (
             <Button
-              disabled={!selectedSubscriptionPackage}
+              disabled={!selectedSubscriptionPackage || isNull(active)}
               onClick={onChooseSub}
             >
               <T9n t='next_choose' />
diff --git a/src/features/BuyMatchPopup/components/SubscriptionSelectionStep/index.tsx b/src/features/BuyMatchPopup/components/SubscriptionSelectionStep/index.tsx
index 6637ea7d..6cdd180f 100644
--- a/src/features/BuyMatchPopup/components/SubscriptionSelectionStep/index.tsx
+++ b/src/features/BuyMatchPopup/components/SubscriptionSelectionStep/index.tsx
@@ -54,8 +54,7 @@ export const SubscriptionSelectionStep = () => {
   return (
     <Wrapper>
       <Header>
-        {selectedSubStep
-        && (
+        {selectedSubStep && (
           <HeaderActions position='left'>
             <ButtonPrevious
               onClick={getSub}
@@ -78,7 +77,7 @@ export const SubscriptionSelectionStep = () => {
           <CloseButton onClick={close} />
         </HeaderActions>
       </Header>
-      <Body marginTop={15}>
+      <Body marginTop={20}>
         <Subscriptions />
         <SelectedCard />
       </Body>
diff --git a/src/features/BuyMatchPopup/components/SubscriptionsList/styled.tsx b/src/features/BuyMatchPopup/components/SubscriptionsList/styled.tsx
index 2d1fc843..5fc6d70e 100644
--- a/src/features/BuyMatchPopup/components/SubscriptionsList/styled.tsx
+++ b/src/features/BuyMatchPopup/components/SubscriptionsList/styled.tsx
@@ -15,7 +15,7 @@ export const List = styled.ul`
   display: flex;
   flex-direction: column;
   overflow-y: auto;
-  margin-top: 15px;
+  margin-top: 25px;
   padding: 0 40px;
 
   ${popupScrollbarStyles}
@@ -63,7 +63,6 @@ export const Item = styled.li.attrs(() => ({
   justify-content: space-between;
   align-items: center;
   cursor: pointer;
-  overflow: auto;
 
   :not(:last-child) {
     margin-bottom: 20px;
diff --git a/src/features/BuyMatchPopup/store/hooks/index.tsx b/src/features/BuyMatchPopup/store/hooks/index.tsx
index 99988e3d..c733670d 100644
--- a/src/features/BuyMatchPopup/store/hooks/index.tsx
+++ b/src/features/BuyMatchPopup/store/hooks/index.tsx
@@ -10,6 +10,7 @@ import type { PaymentIntent, StripeError } from '@stripe/stripe-js'
 
 import last from 'lodash/last'
 import isEmpty from 'lodash/isEmpty'
+import size from 'lodash/size'
 
 import { PAGES, ProfileTypes } from 'config'
 
@@ -97,7 +98,7 @@ export const useBuyMatchPopup = () => {
 
   useEffect(() => {
     if (!isEmpty(initialSubscription)) {
-      !initialSubscription?.data
+      !initialSubscription?.data || size(initialSubscription?.data) === 1
         ? setSteps([Steps.Subscriptions])
         : setSteps([Steps.SelectSubscription])
     }
diff --git a/src/features/BuyMatchPopup/store/hooks/useSubscriptions.tsx b/src/features/BuyMatchPopup/store/hooks/useSubscriptions.tsx
index c449d2db..dc65693a 100644
--- a/src/features/BuyMatchPopup/store/hooks/useSubscriptions.tsx
+++ b/src/features/BuyMatchPopup/store/hooks/useSubscriptions.tsx
@@ -7,6 +7,7 @@ import {
 import find from 'lodash/find'
 import isEmpty from 'lodash/isEmpty'
 import first from 'lodash/first'
+import size from 'lodash/size'
 
 import { getSubscriptions, SubscriptionsByPeriods } from 'requests'
 
@@ -43,10 +44,16 @@ export const useSubscriptions = () => {
 
   const fetchSubscriptions = useCallback(async (match: Match) => {
     const subscriptions = await getSubscriptions(match.sportType, match.id)
-    if (!subscriptions.data) {
+    const subscriptionData = subscriptions.data && size(subscriptions.data) === 1
+      ? {
+        ...subscriptions.data[0].packages,
+        season: subscriptions.season,
+      }
+      : subscriptions
+    if (!subscriptions.data || size(subscriptions.data) === 1) {
       const convertedSubscriptions = transformSubsciptions({
         match,
-        subscriptions,
+        subscriptions: subscriptionData,
         suffix,
       })
       setInitialSubscription(subscriptions)
diff --git a/src/features/BuyMatchPopup/styled.tsx b/src/features/BuyMatchPopup/styled.tsx
index 92628770..68e9e103 100644
--- a/src/features/BuyMatchPopup/styled.tsx
+++ b/src/features/BuyMatchPopup/styled.tsx
@@ -84,7 +84,7 @@ export const Wrapper = styled.div<WrapperProps>`
   position: relative;
   height: ${({ height }) => (height ? `${height}px` : 'auto')};
   width: ${({ width }) => (width ? `${width}px` : '830px')};
-  padding: 20px 0 20px;
+  padding: 40px 0;
 
   @media (max-width: 750px){
     width: 100%;
@@ -152,10 +152,6 @@ export const Footer = styled.div<FooterProps>`
   display: flex;
   justify-content: center;
   margin-top: 40px;
-
-  @media (max-width: 1370px) {
-    margin-top: 0px;
-  }
   ${isMobileDevice
     ? css`
       @media screen and (orientation: landscape){
@@ -186,7 +182,7 @@ export const SmallButton = styled(Button)`
 `
 
 export const ButtonPrevious = styled(Arrow)`
-  top: 30px;
+  top: 45px;
   left: 30px;
   cursor: pointer;
 `
diff --git a/src/features/PaymentPeriodTabs/index.tsx b/src/features/PaymentPeriodTabs/index.tsx
index 61bda02e..37e5ece3 100644
--- a/src/features/PaymentPeriodTabs/index.tsx
+++ b/src/features/PaymentPeriodTabs/index.tsx
@@ -12,9 +12,8 @@ import { getCorrectPaymentTabs } from './helpers'
 
 const List = styled.ul`
   display: flex;
-  justify-content: center;
   min-width: 395px;
-  width: 70%;
+  justify-content: space-between;
   ${isMobileDevice
     ? css`
       min-width: 90%;
@@ -36,7 +35,6 @@ type ItemProps = {
 
 const Item = styled.li<ItemProps>`
   position: relative;
-  width: 33.33%;
   font-weight: 600;
   font-size: 16px;
   line-height: 47px;
@@ -53,13 +51,10 @@ const Item = styled.li<ItemProps>`
         ::after {
           position: absolute;
           content: '';
-          bottom: 9px;
-          width: 100%;
+          bottom: 0px;
+          width: 130px;
           height: 3px;
           background-color: #fff;
-          @media screen and (orientation: landscape){
-            bottom: 6px;
-          }
         }
       `
       : ''
