@charset "UTF-8";

/*
Theme Name: BasicTheme
Theme URI:
Author: OB
Author URI:
Description: BasicTheme just to show WP
Requires at least: 5.3
Tested up to: 8.1
Requires PHP: 7.4
Version: 1.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: BasicTheme
*/

* {
  box-sizing: border-box;
}

SVG {
  display: block;
}

body {
  font-family: 'Inter', sans-serif;
  margin: 0;
  background: #f5f7fa;
  color: #212121;
}
header {
  background: #0D47A1;
  padding: 20px 20px;
  text-align: center;
  color: white;
}

main {
  width:1140px;
  height:100%;
  margin: 0 auto;
}

section {
  margin-top: 100px;
}

section:last-child {
  margin-bottom: 100px;
}

#single_broker section {
    background: white;
    padding: 24px;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    margin-bottom: 24px !important;
    margin-top: 0px !important;
}

#single_broker H1 {
  font-size: 28px;
}

.plainsection {
  background: none !important;
  box-shadow:none !important;
}

.stars_line_dd {
  color: #a0a3a1;
  font-size: 12px;
}

.starline {
  display: flex;
  margin-top: 5px;
  margin-bottom: 5px;
  align-items: center;
  gap: 20px;
}

.user_rev_pan {
  display: flex;
  gap:40px;
}

.user_rev_pan_item {
  background: white;
  padding: 24px;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.broker_top_s {
  display: flex;
  gap:30px;
  align-items: center;
}

.com_ttl {
  font-weight: 600;
  margin-top: 10px;
  margin-bottom: 10px;
}

.ltop_left IMG {
  width:50px;
  max-height: 50px;
  border-radius: 10px;
}

.broker_top_s A {
  background: #0D47A1;
  border-radius:10px;
  text-decoration: none;
  color:#FFF;
  padding:10px;
}

.broker_big_ttl {
    color:#212121;
}

.broker_list_main {
  border:1px solid #bfc4c6;
  border-radius: 10px;
  background-color: #FFF;
  margin-top: 60px !important;
}

.breadcrumb {
  margin-top: 20px;
  margin-bottom: 40px;
}

.breadcrumb SPAN {
  color:#5d6061;
}

.breadcrumb A {
  color:#212121;
  text-decoration: none;
}

.broker_lbottom {
  display: flex;
  justify-content: space-between;
}

.ltop_left {
  display: flex;
  align-items: center;
  gap:20px;
}

.broker_lel {
  border-bottom: 1px solid #bfc4c6;
  padding: 20px;
}

.broker_lel:last-child {
  border-bottom:0px;
  margin-bottom: 0px;
}

.green {
  padding: 10px;
  display: flex;
  align-items: center;
  font-size: 15px;
  font-weight: 500;
  color:white;
  background: #00ba54;
  border-radius: 10px;
    max-width: 100px;
}

.lbottom_left {
  display: flex;
  align-content: center;
  gap:20px;
  flex-wrap: wrap;
}

.ratin_bl {
  display: flex;
  align-content: center;
  flex-wrap: wrap;
}

.ratin_bl SPAN {
  color: #00ba54;
  font-size: 16px;
  font-weight: 700;
  margin-left: 10px;
}

.lbottom_right A {
  background: #0D47A1;
  border-radius: 10px;
  text-decoration: none;
  color: #FFF;
  padding: 10px;
}

.ltop_right_ttl A{
  font-size: 25px;
  text-decoration: none;
  color:#212121;
}

.broker_ltop {
  display: flex;
  align-items: center;
  gap:40px;
}

.broker_bigdescr {
  margin-top: 20px;
  margin-bottom: 20px;
  color:#5d6061;
}

.cb_bottom {
  margin-top: 100px;
}

.card-grid {
  display: flex;
  justify-content: space-between;
  gap:20px;
}
.card {
  background: white;
  border-radius: 10px;
  padding: 20px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}

.toprated .card {
  flex-direction: column;
  align-items: flex-start !important;
}

.toprated .card .card_ttl {
  margin-bottom: 0px !important;
}

.toprated .card .card_stars {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

.logo_place {
  display: flex;
  gap:20px;
  font-weight: 600;
  align-items: center;
  justify-content: flex-start !important;
}

.logo_place A{
  font-weight: 600;
  text-decoration: none;
  color:#212121;
}

.logo_place DIV IMG {
  width:40px;
  max-height: 40px;
}

.comp_line_list {
  background: white;
  border-radius: 10px;
  padding: 20px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
  width:fit-content;
  margin:0 auto;
  margin-top: 40px;
}

.comp_line_list A {
  font-size:18px;
  font-weight: 500;
  text-decoration: none;
  margin-left: 20px;
  margin-right: 20px;
  color:#212121;
}

/***********Blog**************/
.blog {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 10px;
  padding: 20px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.05);
  margin-bottom: 40px;
}

.blog_ttl {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 20px;
}

.blog_ttl A {
  text-decoration: none;
  color:#212121;
}

.blog_right {
  margin-left: 40px;
}

.blog_right IMG {
  width:300px;
  max-height: 300px;
  border-radius: 10px;
}

.blog_more  {
  margin-top: 40px;
}

.blog_more A {
  background: #0D47A1;
  color: #FFF;
  font-weight: 500;
  border-radius: 10px;
  padding:10px;
  text-decoration: none;
}

.comp_line_list A:hover {
  font-weight: 600;
}

.cl_head {
  font-weight: 600;
}

.bolder {
  font-weight: 600 !important;
}

.broker_comp_ttl {
  text-align: center;
}

.broker_comp_subttl {
    text-align: center;
}

.comp_list_main {
  background: white;
  border-radius: 10px;
  border: 1px solid #bfc4c6;
  width:100%;
  display: flex;
  flex-direction: column;
  margin: 0 auto;
  margin: 40px;
}

.comp_row {
  display:flex;
  border-bottom: 1px solid #bfc4c6;
}

.comp_row > div {
  width:25%;
}

.comp_row:last-child {
  border-bottom: 0px;
}

.comp_list_main .tdbb {
      padding: 20px;
      align-items: center;
    display: flex;
    justify-content: center;
}

.cl_head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding: 20px;
  text-align: center;
  justify-content: center;
}

.cl_head A {
  font-weight: 600;
  text-decoration: none;
}

.star_place {
  display: flex;
  gap:20px;
  flex-direction: column;
  align-content: center;
  justify-content: center;
  font-weight: 500;
}

.star_place DIV {
  text-align: center;
}

.card_substr Ul LI IMG {
    width: 15px;
    height: 15px;
    margin-right: 10px;
}

.card_substr Ul LI {
    margin-bottom: 15px;
}

.comapre .card-grid .card{
  flex-direction: column !important;
  align-items: flex-start;
  gap:0px;
}

.comapre .card-grid .card .card_ttl {
  margin-bottom: 20px;
  text-align: left;
}

.card_ttl strong A {
  text-decoration: none;
  color: #212121;
}

.card_substr Ul {
  list-style: none;
  margin:0px;
  padding: 0px;
}

.card-grid .card {
display: flex;
gap:20px;
align-items: center;
}

.review_blocks .card-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

.review_blocks .card-grid .card {
  justify-content: space-between;
  align-items: center;
}

.review_blocks .card-grid .card .card_ttl {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0px;
}

.card_ttl {
  margin-bottom: 40px;
}

.one_b { background: #FFD54F; }
.two_b { background: #448AFF; }
.three_b { background: #66BB6A; }
.four_b { background: #4DD0E1; }

.cg_block {
  border-radius: 8px;
  border: 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content:center;
  width:250px;
  height:250px;
}

.cg_block .card {
  background: none;
  border:0px;
  box-shadow: none;
}

.subttl_cgb {
  text-align: center;
  font-weight: 600;
  font-size: 20px;
  color:#FFF;
  margin-top: 10px;
}

.subttl_cgb A {
  font-weight: 600;
  font-size: 20px;
  color:#FFF;
  text-decoration: none;
}

.cg_block .card img {
  width:100px;
}

.search-bar {
  border-radius: 8px;
  padding: 10px;
  background: #345991;
  width:600px;
  margin: 0 auto;
}

.sb_top {
  display: flex;
  align-items: center;
  gap:10px;
  margin-bottom: 10px;
  width:100%;
}

.search-bar BUTTON {
  background: #FFD54F;
  border-radius: 8px;
  color: #0D47A1;
  font-weight: 600;
  font-style: 20px;
  height: 40px;
  border: 0px;
  width:100%;
  text-transform: uppercase;
}

.sb_top INPUT {
  color: #0D47A1;
  height: 40px;
  background: #FFF;
  padding: 5px;
  border: 0px;
  width:100%;
  border-radius: 8px;
}

.sb_top SELECT {
  color: #0D47A1;
  height: 40px;
  background: #FFF;
  padding: 5px;
  border: 0px;
  border-radius: 8px;
}

.card_stars {
  margin-top: 10px;
  margin-bottom: 10px;
}

.categories {
  display: flex;
  flex-direction: column;
}

.color_blocks .card-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

/*****footer****/
.site-header, .site-footer {
  width: 100%;
}
.logo {
  font-size: 20px;
  font-weight: bold;
  color: #0D47A1;
}
.main-nav {
  display: flex;
  justify-content: space-between;
  align-items:center;
  margin-bottom: 50px;
}
.main-nav a {
  text-decoration: none;
  color: #333;
  font-weight: 500;
}

.main_menu A {
  font-weight: 600;
  font-size: 20px;
  margin-right: 20px;
  color:#FFF;
}

.cta {
  background: #FFC107;
  padding: 8px 14px;
  border-radius: 6px;
  color: black;
  font-weight: 600;
}
.mobile-menu-toggle {
  display: none;
  font-size: 28px;
  cursor: pointer;
}
.site-footer {
  background: #0A0F19;
  color: white;
  padding: 40px 20px;
  font-size: 14px;
  justify-content: center;
}
.footer-top {
  display: flex;
  gap: 40px;
  justify-content: center;
}

.foot_col_el A {
  color: #FFF;
  text-decoration: none;
}

.foot_col_head {
  text-transform: capitalize;
  color: #E0E0E0;
  margin-bottom: 20px;
}

.foot_col_el A:hover {
  color: #FFD700;
  text-decoration: none;
}

.foot_col_el {
  margin-bottom: 10px;
}

.footer-bottom {
  text-align: center;
  padding-top: 20px;
  font-size: 14px;
  color: #ccc;
}

.mobmenu {
  top: 0px;
  left: 0px;
  width: 100%;
  background: #0A0F19;
  height: 100%;
  position: absolute;
  display: none;
}

.mobmenu_item A {
  text-decoration: none;
  color: #FFFFFF;
  font-weight: 600;
  font-size: 16px;
}

.mobmenu_item {
  margin-bottom: 20px;
}

.mobmenu_top {
  display: flex;
  justify-content: flex-end;
  margin-top: 50px;
  margin-bottom: 40px;
  padding-left: 20px;
  padding-right: 20px;
}

.closebnt SVG {
  width:30px;
  height: 30px;
}

.formfield {
  display: flex;
  align-items: center;
  flex-direction: column;
  margin-bottom: 40px;
}

.formfield IMG {
  width:30px;
  height:30px;
}

.errorbox {
  color:red;
  font-size: 12px;
  text-align: center;
}

.ty {
  display: none;
}

.loader {
  display: none;
}

LABEL {
  font-weight: 600;
  font-size: 18px;
  margin-bottom: 20px;
}

.formfield INPUT {
  width:600px;
  height: 40px;
  border-radius: 10px;
  border: 1px solid #5d6061;
  padding: 10px;
}

.formfield TEXTAREA {
  width:600px;
  height: 100px;
  border-radius: 10px;
  border: 1px solid #5d6061;
  padding: 10px;
}

.formfield INPUT[type="submit"] {
  border-radius: 10px;
  background:#0A0F19;
  width:600px;
  font-weight: 600;
  cursor: pointer;
  height: 40px;
  color:#FFF;
  display: flex;
  align-items: center;
  justify-content:center;
  padding: 10px;
}

@media (max-width: 768px) {

  .footer-top {
    flex-direction: column;
    gap:0px;
  }

  .foot_col_el {
    display: none;
  }

  .main-nav {
    display: none;
  }
  .mobile-menu-toggle {
    display: block;
  }
}

.pros-cons {
  display: flex;
  gap: 30px;
}
.pros-cons div {
  flex: 1;
}
.pros-cons ul {
  list-style: none;
  padding-left: 0;
}
.pros-cons li::before {
  content: '✔';
  color: #4CAF50;
  margin-right: 6px;
}
.pros-cons li.negative::before {
  content: '✖';
  color: #f44336;
}

.single_img IMG {
  max-width: 1140px;
}

.single_ttl {
  font-size: 30px;
  font-style: 700;
  text-align: center;
}

.single_subttl {
  margin-top: 20px;
  margin-bottom: 20px;
  font-size: 16px;
  color:#5d6061;
  text-align: center;
}

.single_meta {
  display: flex;
  justify-content:space-between;
  color:#5d6061;
  font-style: italic;
  margin-top: 20px;
  margin-bottom: 20px;
}

.auth_face IMG {
  width:50px;
  height: 50px;
  border-radius: 10px;
}

.author {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.auth_abttl {
  margin-bottom: 20px;
  text-transform: capitalize;
  color: #5d6061;
  font-weight: 600;
  font-size: 18px;
}

.auth_body {
  display: flex;
  gap:40px;
  align-items: flex-start;
}

.auth_descr SPAN A {
  color: #0D47A1;
  font-weight: 600;
  margin-top: 10px;
  text-decoration: none;
}

.auth_descr {
  display: flex;
  flex-direction: column;
  gap:10px;
  justify-content: center;
}

.auth_descr DIV {
  font-weight: 600;
}

.also_wrap {
  display: flex;
  gap:40px;
}

.also_top {
  display: flex;
  align-items: center;
  gap:20px;
}

.also_item_tag A {
  color:#FFF;
  background: #0D47A1;
  font-weight: 600;
  border-radius: 10px;
  text-decoration: none;
  padding: 10px;
}

.also_item_tag {
  margin-bottom: 10px;
}

.also_item_link A {
  color: #0D47A1;
  font-weight: 600;
  margin-top: 10px;
  text-decoration: none;
}

.also_item_ttl A {
  text-decoration: none;
  margin-top: 10px;
  font-size: 16px;
  color:#212121;
  font-weight: 700;
}

.also_item_descr {
  color:#5d6061;
}

.auth_card_face IMG{
  width:100px;
  height:100px;
  border-radius: 10px;
}

.auth_body{
  display: none;
  align-items: center;
}

.auth_card_auth_descr {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap:20px;
}

.auth_card_auth_descr DIV {
  font-weight: 600;
}

.author_card {
  display: flex;
  align-items: center;
  gap:40px;
}

@media (max-width: 480px) {

  .comp_line_list A {
    margin-bottom: 20px;
  }

    .comp_line_list {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
    }

  .comp_list_main {
    margin: 40px 0px 0px 0px;
  }

  .comp_row{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }

  .cl_head {
    font-weight: 600;
  }

  .comp_row > div {
    width:auto;
  }

  .formfield INPUT {
    width:100%;
  }

  .formfield TEXTAREA {
    width:100%;
  }

  .formfield INPUT[type="submit"] {
    width:100%;
  }

  .author_card {
    flex-direction: column;
  }

  .user_rev_pan {
    flex-direction: column;
  }

  .single_img IMG {
   max-width: auto;
   width:100%;
  }

  .blog {
    flex-direction: column;
  }

  .blog_left {
    order:2;
  }

  .blog_right {
    order:1;
    margin-left: 0px;
    width:100%;
    margin-bottom: 10px;
  }

  .blog_right IMG {
    width:100%;
    border-radius: 10px;
  }

  .blog_more  {
    margin-top: 40px;
  }

  .blog_more A {
  width:100%;
  padding-top: 15px;
  padding-bottom: 15px;
  display: flex;
  justify-content: center;
  margin-bottom: 10px;
  }

  .blog_ttl {
    text-align: center;
  }

  main {
    width:100%;
    padding-left: 10px;
    padding-right: 10px;
  }
  .card-grid {
    flex-direction: column;
  }

  .cg_block {
    width:100%;
  }

  .search-bar {
    width:100%;
  }

  .review_blocks .card-grid {
    display: flex;
    flex-direction: column;
  }

}