.button { border: none; cursor: pointer; font-family: opensans; transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; line-height: 1; }

.button1 { position: relative; width: 100%; display: block; padding: 13px 10px; box-sizing: border-box; background-color: #001C43; color: #fff; font-size: 1.15em;font-weight: 400; text-align: center; border: 1px solid #001C43; border-radius: 5px; }
    .button1:hover, .button1:focus { background-color: #003c8f; }

.button2 { position: relative; width: 100%; display: block; padding: 13px 10px; box-sizing: border-box; background-color: transparent; color: #2A2A2A; font-size: 1.2em; font-weight: 400; text-align: center; border: 1px solid #5F6368; border-radius: 5px; }
    .button2:hover, .button2:focus { background-color: #5F6368; color: #fff; }

.button3 { position: relative; width: 100%; display: block; padding: 14px 10px; box-sizing: border-box; background-color: transparent; color: #1C63C2; font-size: 1.5em; font-weight: 500; text-align: center; border: 1px solid #1C63C2; }
    .button3:hover, .button3:focus { background-color: #1C63C2; color: #fff; }

.button4 { position: relative; width: 100%; display: block; padding: 12px 10px; box-sizing: border-box; background-color: #0F1078; color: #fff; font-size: 1.2em; box-shadow: 0px 3px 6px #00000029; font-weight: 400; text-align: center; border-radius: 0; border: 1px solid #0F1078; }
    .button4:hover, .button4:focus { background-color: #0002c6; }

.button5 { position: relative; width: 100%; display: block; padding: 15px 10px; box-sizing: border-box; background-color: #fff; color: #000000; font-size: 1.3em; font-weight: 500; text-align: center; border: 1px solid #000000; }
    .button5:hover, .button4:focus { background-color: #000000; color: #fff; }

.button6 { position: relative; width: 100%; display: block; padding: 12px 50px; box-sizing: border-box; background-color: #fff; color: #212121; font-size: 1.2em; box-shadow: 0px 3px 6px #00000029; font-weight: 400; text-align: center; border-radius: 0; border: 1px solid #fff; }
    .button6:hover, .button6:focus { background-color: #212121;color:#fff; }


.join_club_button { width: 100%; display: flex; justify-content: center; align-items: center; padding: 12px 25px; box-sizing: border-box; background-color: #FF8AA9; color: #fff; font-size: 1.2em;  font-weight: 400; text-align: center; }
.join_club_button img {margin-left:10px; }
    .join_club_button:hover, .join_club_button:focus { background-color: #f10040; }

.search_button { width: 100%; display: flex; justify-content: center; align-items: center; padding: 12px 25px; box-sizing: border-box; background-color: #FF7C03; color: #fff; font-size: 1.2em; font-weight: 400; text-align: center; }
    .search_button img { margin-left: 10px; }
    .search_button:hover, .search_button:focus { background-color: #8b4300; }

.login_button { width: 100%; display: flex; justify-content: center; align-items: center; padding: 12px 25px; box-sizing: border-box; background-color: #5DCEFF; color: #fff; font-size: 1.2em; font-weight: 400; text-align: center; }
    .login_button img { margin-left: 10px; }
    .login_button:hover, .login_button:focus { background-color: #00b2ff; }


.button1_new { position: relative; width: 100%; display: block; padding: 12px 10px; box-sizing: border-box; background-color: #001C43; color: #fff; font-size: 1.2em; box-shadow: 0px 5px 10px #00000029; font-weight: 400; text-align: center; border: 1px solid #001C43; border-radius: 5px; }
    .button1_new:hover, .button1_new:focus { background-color: #002db0; }