Как сделать блочный элемент в блоке flex контейнера шириной не во весь блок?

<div class = "container1">
        <div class="content1">
            <div class ="travel">ПУТЕШЕСТВИЯ ПО РОССИИ</div><br>
         <div class="block"></div>
            <p>
                Самые интересные уголки России<br>
                Самые необычные маршруты<br>
            </p>
        </div>
        <div class="content2">
            <div class ="travel">ПУТЕШЕСТВИЯ ПО ЕВРОПЕ</div><br>
            <p>
                Разные страны, разные культуры, исторические<br>
                места и все самое интересное в современной<br>
                Европе
            </p>
        </div>
        <div class="content3">
             <div class ="travel">ПУТЕШЕСТВИЯ ПО АФРИКЕ</div><br>
            <p>
                Дикая природа, крокодилы, обезьяны, сафари<br>
                на джипах, гостиницы на деревьях и самые<br>
                опасные приключения ждут тебя
            </p>
        </div>
    </div>

.container1 {
    width:1200px;
    display: flex;
   }
.container1 div {
    width: 400px;
    color: darkblue;
    box-sizing: border-box;
}
img {
    margin: 15px;
}
.content1 {
     text-align: center;
     border: 4px solid darkblue;
}
.travel {
    font-size: 16px;
    padding-top: 5px;
}
.block {
    height: 5px;
    background: gold;
    flex-shrink: 50px;
}
.content1 p {
    color: darkblue;
    padding-top: 15px; 
    font-size: 14px;  
    }