/*#====================================Post Styles==========================================#*/

.post {
    margin-bottom: 40px;
}

.post .post-img {
    display: block;
    -webkit-transition: 0.2s opacity;
    transition: 0.2s opacity;
    position: relative;
}

.post .post-img:hover, .post .post-img:focus {
    opacity: 0.9;
}

.post .post-img > img {
    width: 100%;
    height: 250px;
}

.post .post-meta {
    margin-top: 10px;
    margin-bottom: 4px;
}

.post-meta .post-category {
    font-size: 13px;
    text-transform: uppercase;
    padding: 3px 10px;
    font-weight: 600;
    border-radius: 2px;
    margin-right: 15px;
    color: #FFF;
    background-color: #212631;
    -webkit-transition: 0.2s opacity;
    transition: 0.2s opacity;
}

.post-meta .post-category:hover, .post-meta .post-category:focus {
    text-decoration: none;
    opacity: 0.9;
}

.post-meta .post-category.cat-1 {
    background-color: #4BB92F;
}

.post-meta .post-category.cat-2 {
    background-color: #ff8700;
}

.post-meta .post-category.cat-3 {
    background-color: #8d00ff;
}

.post-meta .post-category.cat-4 {
    background-color: #0078ff;
}

.post-meta .post-date {
    font-size: 15px;
    font-weight: 600;
}

.post .post-title {
    font-size: 22px;
    margin-bottom: 10px;
}

.post .post-title a {
    text-decoration: none;
}

.post .post-title a:hover {
    border-bottom: 1px solid #555555;
}


.post-tags li {
    display: inline-block;
    margin-right: 3px;
    margin-bottom: 5px;
}

.post-tags li a {
    display: block;
    color: #fff;
    background-color: #212631;
    padding: 3px 10px;
    font-weight: 600;
    border-radius: 2px;
    -webkit-transition: 0.2s opacity;
    transition: 0.2s opacity;
}

.parent {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
}

.parent::before {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    content: "";
}
.parent > .child {
    width: 100%;
    display: inline-block;
    vertical-align: middle;
}

.watch-caption {
    opacity: 0;
}

.watch-caption:hover {
    opacity: 1;
}

.background-gray {
    background: rgba(135,204,212,.8);
}

.pos-absolute-center {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.transition-025s {
    -webkit-transition: all .25s;
    -moz-transition: all .25s;
    -ms-transition: all .25s;
    -o-transition: all .25s;
    transition: all .25s;
}

.text-decoration-none {
    text-decoration: none;
}

.text-decoration-none.underline.active,
.text-decoration-none.underline:hover {
    border-bottom: 1px solid #555;
}

.article a {
    border-bottom: 1px solid #555555;
}

.article h1, .article h2, .article h3, .article h4, .article h5, .article h6 {
    margin-bottom: .5em;
}

.article h1 {
    font-size: 1.7em;
}

.article h2 {
    font-size: 1.6em;
}

.article h3 {
    font-size: 1.5em;
}

.article h4 {
    font-size: 1.4em;
}

.article h5,
.article h6 {
    font-size: 1.25em;
}

.w-100{
    width: 100%;
}

.row-d-f-j-c {
    display: flex;
    justify-content: center;
}

.font-size-2 {
    font-size: 20px;
}

@media (max-width: 992px) {
   
   .post .post-img > img {
    	height: auto;
    }
	
}

/*#===============================/Post Styles=====================================#*/

/*============================= Custom Navbar ===========================*/

.custom-bla {
  font-weight: 900;
  font-size: 15px;
  line-height: 18px;
  text-transform: uppercase;
  color: #000000;
}

.custom-nav-item {
  display: none;
  flex-direction: column;
  padding-left: 50px;
}

.custom-nav:hover .custom-nav-item {
  display: flex;
}

/*============================= /Custom Navbar ===========================*/

/*============================= Starava Registrtion ===========================*/
.main {
    padding-bottom: 30px;
    padding-top: 30px;
}

.box_strava {
    position: relative;
}

/*.main__register {*/
/*    margin-top: 0;*/
/*}*/

.strava_registration {
    max-width: 500px;
    font-size: 30px;
    position: absolute;
    margin-top: 0;
    left: 50%;
    top: 50%;
    transform: translate(-250px, -33px);
}

#powered_by_strava {
    width: 400px;
}

@media (max-width: 1200px) {
    .strava_registration {
        max-width: 500px;
        left: 50%;
        top: 50%;
        line-height: 66px;
        transform: translate(-250px, -33px);
    }
    .main__register {
        padding: 0;
    }
}

@media (max-width: 992px) {
    .strava_registration {
        max-width: 300px;
        left: 50%;
        top: 50%;
        line-height: 50px;
        transform: translate(-150px, -25px);
    }

    .main__register {
        padding: 0;
    }
        #powered_by_strava {
            width: 350px;
        }
}

@media (max-width: 768px) {
    .strava_registration {
        max-width: 300px;
        font-size: 25px;
        left: 50%;
        top: 50%;
        transform: translate(-150px, -25px);
    }
    .main__title {
        font-size: 25px;
        /*line-height: 70px;*/
    }
    #powered_by_strava {
        width: 300px;
    }
    .main {
        min-height: 300px;
    }

    .index__date {
        margin: 0px 0 20px 0;
    }
}

@media (max-width: 578px) {
    .strava_registration {
        max-width: 250px;
        font-size: 25px;
        left: 50%;
        top: 50%;
        transform: translate(-125px, -25px);
    }

    #powered_by_strava {
        width: 250px;
        font-size: 15px;
    }
}

@media (max-width: 400px) {
    .strava_registration {
        max-width: 200px;
        font-size: 20px;
        left: 50%;
        top: 50%;
        line-height: 40px;
        transform: translate(-100px, -20px);
    }

    #powered_by_strava {
        width: 200px;
        line-height: 40px;
    }

    .main {
        padding-bottom: 15px;
        padding-top: 20px;
        min-height: 250px;
    }

    .main__title {
        line-height: 40px;
    }
}

@media (max-width: 300px) {
    .strava_registration {
        max-width: 150px;
        font-size: 15px;
        left: 50%;
        top: 49%;
        line-height: 30px;
        transform: translate(-75px, -15px);
    }

    #powered_by_strava {
        width: 140px;
        line-height: 30px;
    }
    .main {
        min-height: 200px;
        padding-bottom: 10px;
        padding-top: 15px;
    }
    .main__title {
        font-size: 15px;
        line-height: 30px;
    }
    .index__date {
        margin: 0px 0 15px 0;
    }
}

@media (max-width: 250px) {
    .strava_registration {
        max-width: 120px;
        font-size: 12px;
        left: 50%;
        top: 50%;
        line-height: 20px;
        transform: translate(-60px, -10px);
    }
    #powered_by_strava {
        width: 120px;
    }

    .main {
        min-height: 180px;
    }
}

/*============================= /Strava Registration ===========================*/


/*============================= List of Participants ===========================*/

    .participant-name-number {
        padding: 10px 5px;
        background-color: #dddddd;
        border-bottom: 1px solid black;
        margin-bottom: 6px;
    }

    .participant-name-number p {
        margin: 0;
        font-size: 18px;
        font-weight: 505;
    }
    .participant-search {
        font-size: 16px;
        text-transform: uppercase;
    }

    #mainsearch-user_id, #participantsearch-firstname, #participantsearch-lastname,
    #participantsearch-discipline, #participantsearch-city,  #participantsearch-club,
    #paidparticipantsearch-user_id, #mainsearch-firstname, #mainsearch-lastname,
    #mainsearch-discipline, #mainsearch-city,  #mainsearch-club{
        border-radius: 0;
        background-color: #ff00ff;
        color: white;
        text-transform: uppercase;

    }

    #participantsearch-discipline option, #participantsearch-city option,  #participantsearch-club option,
    #mainsearch-discipline option, #mainsearch-city option,  #mainsearch-club option{
        background-color: white;
        color: black;
    }

    .searchSubmitButton {
        border-radius: 0;
        background-color: #ff00ff;
        color: white;
        font-size: 16px;
        text-transform: uppercase;
        margin-top: 27px;
        margin-left: 15px;
    }

    .participiants table thead {
        background-color: #ff00ff;
        color: white;
        text-transform: uppercase;
    }

    .pagination {
        margin-top: -40px;
    }
    .pagination li.active a {
        background-color: white;
        color: #ff00ff;
    }

    .pagination li {
        margin: 0 10px;
        font-size: 18px;
    }

    .pagination li.disabled, .pagination li.prev {
        margin-left: 0;
    }

    .pagination li.disabled span {
        padding: 10px 20px;
        background-color: #ff00ff;
        color: white;

    }
    .pagination>li>a {
        padding: 10px 20px;
        background-color: #ff00ff;
        color: white;
    }

    #show-more {
        display: block;
        text-align: center;
        background-color: #ff00ff;
        padding: 10px 0;
        color: white;
        font-size: 25px;
        line-height: 1;
        text-transform: uppercase;
        text-decoration: none;
    }

    .show-by-number {
        display: flex;
        justify-content: flex-end;
        margin-top: 20px;

    }

    .show-by-number select {
        cursor: pointer;
        background-color: #ff00ff;
        color: white;
        padding: 5px 20px 5px 10px;
        font-size: 20px;
        text-transform: uppercase;
    }

    .show-by-number select option {
        background-color: white;
        color: black;
    }

/*==================== walking styles in main page =====================================*/

.fifty {
        cursor: pointer;
        position: relative;
   }

.activeWalk {
    color: #9AFE1C;
}

.fifty::after {
    content: '';
    display: block;
    height: 2px;
    width: 0;
    background: #9AFE1C;
    position: absolute;
    transition: 0.2s all ease-out;
}

.fifty:hover .fifty::after {
    content: '';
    display: block;
    height: 2px;
    width: 50px;
    background: #9AFE1C;
    position: absolute;
}

/*==================== /walking styles in main page =====================================*/


@media (max-width: 992px) {
    .pagination {
        margin-top: 20px;
    }

    .show-by-number {
        justify-content: flex-start;
        margin-top: 20px;
        margin-bottom: 20px;
    }
}

@media (max-width: 768px) {
    .participant-search{
        padding: 0 5px;
    }
    #mainsearch-user_id, #participantsearch-firstname, #participantsearch-lastname,
    #paidparticipantsearch-user_id, #mainsearch-firstname, #mainsearch-lastname{
        height: 34px;
    }
    .show-by-number select {
        padding: 5px 15px 5px 5px;
        font-size: 16px;
    }

    .pagination {
        margin-top: 0px;
    }

    #show-more {
        font-size: 20px;
    }
}

@media (max-width: 578px) {
        .pagination li.disabled span {
            padding: 6px 12px;
            background-color: #ff00ff;
            color: white;
        }
        .pagination>li>a {
            padding: 6px 12px;
            background-color: #ff00ff;
            color: white;
        }

        .pagination li {
            margin: 0 5px;
            font-size: 10px;
        }
        #show-more {
            font-size: 15px;
        }
        .show-by-number select {
            padding: 5px 15px 5px 5px;
            font-size: 13px;
        }
    }

    @media (max-width: 400px) {
        .table-responsive {
            margin-bottom: 0;
        }
        .pagination {
            margin: 10px 0;
        }
        .pagination>li>a {
            padding: 4px 8px;
            background-color: #ff00ff;
            color: white;
        }

        .pagination li.disabled span {
            padding: 4px 8px;
            background-color: #ff00ff;
            color: white;
        }

        .pagination li {
            margin: 0 3px;
            font-size: 10px;
        }

        .show-by-number {
            justify-content: center;
            margin: 10px 0;
        }
    }

.live {
    font-weight:bold;
    animation: myanimation 5s infinite;
}

@keyframes myanimation {
    0% {color: white;}
    25%{color: #9d529d;}
    50%{color: #ff00ff;}
    75%{color: #991799;}
    100% {color: white;}
}

/*============================= /List of Participants ===========================*/


