/* Create three equal columns that floats next to each other */
.column {
    float: left;
    text-align: center;
    width: 33.33%;
    padding: 1px;
    padding-left: 10px;
    padding-right: 10px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Make images responsive to smaller screens */
.img {
	height: auto;
    max-width: 100%;
}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width: 700px) {
  .column {
    width: 100%;
    text-align: center;
    padding-top: 5px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 5px;
  }
}


.dash-cta-deck .dash-cta-link:before { border: 1px solid #1f8a86; }

.dash-cta-deck .dash-cta-link:after { background-color: #1f8a86; }

.dash-cta-deck .dash-cta-link .dash-cta-badge { background: #cc235c; }

.dash-placements .card a .placements-header { background: #1f8a86; }

.dashboard-content>section .container .section-btn,
.dashboard-content>section .container-fluid .section-btn { background: #cc235c; }

.dashboard-content>section .container .section-btn:hover:not(.disabled),
.dashboard-content>section .container .section-btn:focus:not(.disabled),
.dashboard-content>section .container-fluid .section-btn:hover:not(.disabled),
.dashboard-content>section .container-fluid .section-btn:focus:not(.disabled) { background: #85002c !important; }


.romeo .cta span.badge { background-color: #cc235c; }


.romeo .btn-primary { background: #cc235c !important; }

.romeo .btn-primary:hover:not(.disabled), .romeo .btn-primary:focus:not(.disabled) { background: #85002c !important; }

.romeo .content-body .table-header { background-color: #282f6d; }

.romeo .content-body.wrapper-with-sidebar .content-container .content-block .table-header, .romeo .content-body.wrapper-with-sidebar .content-container .widget-simple-plain .table-header, .romeo .content-body.wrapper-with-sidebar .content-container .widget-simple-stat .table-header { background: #282f6d; }

.heading, .panel-heading {
    background-color: #282f6d;
    border-color: #282f6d;
}

.btn-default, .btn-simple {
    /* Changed by back by James Hall 03/11/2021*/
    /* REMOVED BY GTI/ANG - 05/11/24
    /*background: #cc235c !important;*/
    /*color: #ffffff !important;*/
}

.btn-default:hover:not(.disabled), .btn-simple:hover:not(.disabled), .btn-default:focus:not(.disabled), .btn-simple:focus:not(.disabled) {
    /* Changed by back by James Hall 03/11/2021*/
    color: #ffffff !important;
    background: #85002c !important;
}

.dropdown.btn-group .dropdown-menu li .btn {
    /* Added as fix to white dropdown text */
    color: #000000 !important;
}

.romeo .btn-secondary { background: #cc235c !important; }

.romeo .btn-secondary:hover:not(.disabled), .romeo .btn-secondary:focus:not(.disabled) { background: #85002c !important; }


.romeo .content-body .table-footer .btn-group .btn.btn-default {
    background: #999 !important;
    margin-right: 5px;
}

.romeo .content-body .table-footer .btn-group .btn.btn-primary {
    background: #1f8a86 !important;
    margin-right: 5px;
}

.romeo .content-body .table-footer .pagination.pagination-sm li.active {
    margin-left: 5px;
    border-radius: 2px;
}

.romeo .content-body .table-footer .pagination.pagination-sm li.active a {
    background-color: #1f8a86 !important;
    margin-left: 5px;
}

.romeo .content-body .table-footer .pagination.pagination-sm li {
    margin-left: 5px;
    border-radius: 2px;
}

.romeo .content-body .table-footer .pagination.pagination-sm li a {
    background-color: #999 !important;
    color: #fff;
    margin-left: 5px;
}

.romeo .content-body .table-footer .pagination.pagination-sm li>span {
    background: #999 !important;
    color: #fff;
    margin-left: 5px;
    margin-right: 0;
    border-radius: 2px;
}

.fa {
    padding-right: 0;
}

.btn .btn-no-icon {
    border-radius: 2px;
}

.romeo .nav-tabs li.active .btn-tab, .romeo .nav-tabs li .btn-tab:hover, .romeo .nav-tabs li .btn-tab:focus, .romeo .nav-tabs>li.active>a, .romeo .nav-tabs>li.active>a:focus, .romeo .nav-tabs>li.active>a:hover {
    background-color: #282f6d;
    color: #fff;
    border: 1px solid #282f6d;
}

.romeo .nav-tabs {
    border-bottom: 2px solid #282f6d;
}

#activity-modal .modal-dialog {
    max-width: 1000px;
}

@media (min-width: 768px) {
    .modal-dialog {
        width: 1000px;
    }
}


/* --------------------- */
/* Stacking Icons */
/* --------------------- */

.icon_column {
  position: relative;
  width: 33.33%;
  padding: 10px;
  margin: 0;
  float: left;
  display: inline-block;
  text-align: center;
}

/* Added by GTI/Graeme to allow for occasional 4 column usage */
.icon_column_4 {
  position: relative;
  width: 25%;
  padding: 10px;
  margin: 0;
  float: left;
  display: inline-block;
  text-align: center;
}
/* End of CSS added by GTI/Graeme */

/** GTI/Graeme - appointments custom pane - based on  - TC-23118 **/
 
.cp-well.row-no-gutters [class*=col-] {

    padding-left:0;
    padding-right:0;
    }

.cp-well {
     margin: 0;
    }

.cp-well .at-image {
    background-image: url(https://i.ibb.co/nnd4h0d/Appointment-panes.png);
    background-size: cover;
    background-position: center;
    height:150px;
    }

@media (min-width: 992px) {
    .cp-well .at-image {
        width: 150px;
        }
    }

/** End of CSS added by Graeme **/

.icon_column_icon {
  width: 100%;
  position: relative;
  float: left;
}

.icon_column_copy {
  width: 100%;
  position: relative;
  float: left;
}

.icon_column_icon_icon {
  width: 50px;
  height: 50px;
}

.icon_column_icon_icon_back {
  width: 50px;
  height: 50px;
  background-color: #02a7e2;
  padding: 15px;
  border-radius: 200px;
  margin: 5px;
}

@media screen and (max-width: 787px) {
  .icon_column {
    width: 100%;
  }
  
  .icon_column_icon {
    width: 30%;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 5%;
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  
  .icon_column_copy {
    width: 70%;
    float: right;
    padding-right: 10%;
  }
}
