a:hover { text-decoration: none; } .card { display: flex; justify-content: space-between; background: $card-background; align-items: center; margin-bottom: 10px; border-radius: 5px; box-shadow: 1px 1px 15px 1px rgba(0, 0, 0, 0.2); &:hover { box-shadow: inset 0px 0px 0px 2px $primary; } .info { display: flex; align-items: center; .text { p { padding: 0; margin: 0; } .darker { color: $text-darker; } } } .profile { margin-left: 15px; margin-right: 15px; margin-top: 15px; margin-bottom: 15px; img { width: 50px; } } .call { margin-left: 20px; margin-right: 20px; transform: scaleX(-1); -moz-transform: scaleX(-1); -webkit-transform: scaleX(-1); -ms-transform: scaleX(-1); i { color: $icon; font-size: 25px; } } } .video-feed { padding-top: 67px; padding-left: 50px; } .video-content { height: 485px; // background-color: black; } .half { width: 50%; } .text-color { color: white; } .contacts-container { display:flex; justify-content: center; align-items: center; } .modal-header { border-bottom: 0px; i { font-size: 50px; } } .modal-color { background-color: $card-background; } .vertical-alignment-helper { display:table; height: 100%; width: 100%; } .vertical-align-center { /* To center vertically */ display: table-cell; vertical-align: middle; } .modal-content { /* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */ width:35%; height:inherit; /* To center horizontally */ margin: 0 auto; } .modal-container { display: flex; justify-content: space-between; align-items: center; } .modal-text { display: flex; flex-direction: column; justify-content: center; align-items: center; }