:root{
    font-family: PeridotPE-Regular !important;
}
.profile-modal-title-new{
	font-weight:500px;
	font-size: 17px;
    font-family:PeridotPE-Regular;
 }
#modalShowUsers .profile-modal-body {
  height: 564px;
}
.active-users-list-in-panel li{
	margin-top:13px;
}
.active-users-list-in-panel{
	max-height:385px;	
}
#assigneesAssetsLabel{
	margin-top:25px;
}
#myULSearch {
  list-style-type: none;
}
#myULSearch {
}
#modalShowUsers strong {
  width: 100%;
  display: inline-block;
  text-align: center;

}
#assigneesAssets{
	max-height:124px; 
	overflow-x:auto;	
}
#supTermsCont{
	margin-left:25px;
	margin-right:25px;
}
#supTermsCont p{
	font-size:12px !important;
}
#myInput {
  	font-style: italic;
  	font-size: 10px;
  	width: 98%;
  	padding: 0px 20px 0px 20px;
  	background: #D4D4D4 0% 0% no-repeat padding-box;
  	border: 1px solid #496681;
 	border-radius: 8px;
	opacity: 1;
	height: 20px;
}
.profile-modal-title-new{
	display:inline;
    font-family: PeridotPE-Regular;
	
}
.assign-role-container strong{
	width:100%;
}
.upgraded-users-section{
	font-weight:700px;
	color:#3D5265;
	margin-top:16px;
}
#myInputSearch:focus{
	outline: none;
    box-shadow: none;
}
#myInput:focus{
    border:1px solid #74889A;
    outline: none;
}
#myInputSearch{
	height: 30px;
	border: 1px solid #496681 !important;
	border-radius: 8px;
	opacity: 1;
	max-width:500px;
/* 	margin-left:25px; */
/*     margin-right:25px; */
   	padding: 0px 35px 0px 35px !important;
    width: 100%;
}
.containerUpgradedUsers{
	color:#3D5265;
	max-height:385px;
}
#activeUsersPlus ul{
	min-height:385px;
	overflow-x:auto;
	max-height:385px;
	
}

#activeUsersPlus{
	margin-top:16px;
	text-align:left;
	max-width:100%;
	font-size: 12px;
	
}
#msisdnsList{
	max-height:78px;
	overflow-x: auto;
	width:100%;
}
#msisdnsList label{
	  display: inline-flex;
	  width: 100%;
	  background:#F7F7F7;
}
#msisdnsList strong {
  margin-top: 6px;
}
#assignees{
    max-height:250px;
    overflow-x:auto
}
#myUL.active-users-list{
    max-height: 200px;
    overflow-x:auto;   
}
.radio.msisdnItem {
  margin: 9px;
  width: 38px !important;
}

.search-pic-in-panel,
.search-wrapper {
    position: relative;
}
.search-wrapper-in-panel img{
	position: relative;
	top: 24px;
	left: 8px;
}
.search-wrapper img {
    position: absolute;
    top: 0px;
    left: 0px;
}

.search-pic-in-panel,
.search-pic {
 	margin-top: 6px !important;
 	width: auto !important;
 	height: auto;
}
div#profile-page {
    background: #f4f4f4;
    z-index: auto;
}

div#profile-page .container {
    background: #f4f4f4;
    border-left: 1px solid #e5e4e4;
    min-height: 0;
    /* header's min-height = 84
                                          (82 to always show scrollbar) */
}

.glyphicon-ok {
    position: absolute !important;
    color: #0E8103;
}


.dropdown-menu {
    max-height: 365px;
}

#myhyperbutton {
    background: none !important;
    border: none;
    padding: 0 !important;
    /*optional*/
    font-family: PeridotPE-Regular, arial, sans-serif;
    /*input has OS specific font-family*/
    color: #3D5265;
    text-decoration: underline;
    cursor: pointer;
    font-family: PeridotPE-Regular, Arial;
    font-size: 14px;
    font-style: normal;
}

.show-more {
    background: none !important;
    border: none;
    padding: 0 !important;
    /*optional*/
    font-family: PeridotPE-Regular, PeridotPE-Regular, sans-serif;
    font-size: 12px;
    /*input has OS specific font-family*/
    color: #4E6172;
    text-decoration: underline;
    cursor: pointer;
    float: right;
}

#button-email-img-more,
#button-phone-img-more {
    top: 3px;
    padding-left: 3px;
    margin-left: 3px;
}

.show-more .span {
    top: 3px;
}

/***** Profile Sidebar *****/
#sidebar-wrapper {
    position: relative;
    width: 260px;
    float: left;
}

.sidebar-nav {
    width: 100%;
    padding: 0;
    list-style: none;
    margin: 0;
    font-size: 14px;
    font-family: PeridotPE-Regular;
}

.sidebar-nav li {
    border-bottom: 1px solid #e5e4e4;
    background: #f4f4f4;
}

.sidebar-nav li a,
.sidebar-nav.nav > li > a,
.sidebar-nav > .sidebar-brand {
    display: table;
    table-layout: fixed;
    width: 100%;
    height: 50px;
    text-decoration: none;
    position: relative;
    outline: 0;
    padding: 0px 10px 0px 16px;
    color: #3d5265;
    border-left: 4px solid rgba(0, 0, 0, 0);
}

.sidebar-nav.nav > li a.active,
.sidebar-nav.nav li a:hover,
.sidebar-nav.nav li a:focus {
    color: #3d5265;
    background: #fff;
    border-left: 4px solid #3d5265;
}

.sidebar-nav > .sidebar-brand {
    background: #3d5265;
    color: #fff;
    height: 40px;
    box-shadow: 0px 2px 14px -1px rgba(159, 159, 159, 0.7);
    font-size: 14px;
    border-bottom: none;
}

.menu-icons {
    display: table-cell;
    height: 100%;
    vertical-align: middle;
    width: 34px;
    background: transparent;
}

.menu-icons:before {
    content: '';
    display: block;
    width: 22px;
    height: 22px;
    background-size: 44px 154px !important;
    background: url(../images/profile-icons.svg) no-repeat;
    background-position: 0 0;
}

.menu-icons.menu-icon-settings:before {
    background-position: 0 -132px;
}

.menu-icons.menu-icon-user:before {
    background-position: -22px 0;
}

.menu-icons.menu-icon-address:before {
    background-position: -22px -22px;
}

.menu-icons.menu-icon-payment:before {
    background-position: -22px -44px;
}

.menu-icons.menu-icon-services:before {
    background-position: -22px -66px;
}

.menu-icons.menu-icon-activity:before {
    background-position: -22px -88px;
}


.menu-text {
    line-height: 1.2em;
    display: table-cell;
    vertical-align: middle;
    font: Bold 14px/16px PeridotPE-Regular;


}

@media (max-width: 991px) {
    .sidebar-nav > .sidebar-brand {
        font-size: 18px;
    }
}

/***** Profile Content *****/
#main-content-profile {
    position: relative;
    margin-left: 260px;
    background: #f4f4f4;
    min-height: inherit;
    border-left: 1px solid #e5e4e4;
}

#main-content-profile h3 {
    font: Bold 16px/17px PeridotPE-Regular;
    margin-top: 25px;
    margin-bottom: 30px;
    /*     font-weight: 600; */
    /* 	font-family:PeridotPE-Regular; */
    /* 	font-weight:bold;  */
    color: #3D5265;
}

#main-content-profile p {
    color: #3d5265;
    text-align: left;
    margin-bottom: 20px;
    font-size: 14px;
    font-family: PeridotPE-Regular;
}

/*#main-content-profile .row > div > p {
	font-weight: 600;
}*/

#main-content-profile .tab-action {
    line-height: 44px;
    font-family: PeridotPE-Regular
}

#main-content-profile .btn-outline {
    background: none;
    border: 1px solid #3d5265;
    box-shadow: none;
    font-size: 1em;
    padding: 10px;
    color: #3d5265;
    outline: none;
    font-weight: 600;
}

#main-content-profile .btn-outline:hover,
#main-content-profile .btn-outline.active {
    background: #3d5265;
    color: #fff;
    text-decoration: none;
}

#main-content-profile .panel-group {
    margin-bottom: 0px;
}

.panel-heading.panel-blue-white {
    background: #3d5265;
    color: #fff;
    font-family: PeridotPE-Regular;
}

.panel-heading.panel-blue-white > h4 {
    color: #fff;
}

.panel-heading.panel-white-blue {
    background: #fff;
    color: #3d5265;
    font-family: PeridotPE-Regular;
}

.panel-heading.panel-grey {
    background: #ededed;
    color: #6d6e76;
}

@media (max-width: 991px) {


    #main-content-profile h3 {
        margin-bottom: 20px;
    }
}

@media only screen and (max-width: 767px) {
    #main-content-profile {
        margin-left: 0px;
        width: 100%;
        padding: 20px;
        background: #eef2f4;
    }

    #main-content-profile h3 {
        font-size: 1.2em;
        color: #fff;
        background: #3d5265;
        margin: -20px -20px 0 -20px;
        padding: 14px 20px;
    }

    #main-content-profile .tab-action {
        margin: 10px 0;
        font-family: PeridotPE-Regular
    }

    #main-content-profile .tab-action .btn-outline {
        color: #0E8103;
        border: none;
        background: none;
        font-family: PeridotPE-Regular;
    }
}

@media only screen and (min-width: 1199px) {
    #penMailPhone,
    #trashMailPhone {
        margin-top: 10px !important;
        margin-bottom: 10px !important;

    }
}

@media only screen and (min-width: 767px) {
    #penMailPhone,
    #trashMailPhone {
        margin-top: 10px !important;
        margin-bottom: 10px !important;
    }
}

/***** Profile Modal *****/
#main-content-profile .profile-modal form {
    margin: 0px;
}

.profile-modal.alternative .profile-modal-header {
    background: none;
    color: #3d5265;
    padding: 20px;
}

.profile-modal.alternative .profile-modal-header .profile-modal-title {
    font-size: 18px;
    font-weight: 600;
    display: inline-block;
    font-family: PeridotPE-Regular;
}

.profile-modal.alternative .profile-modal-body {
    padding: 20px;
}

.profile-modal.alternative .profile-modal-body p {
    margin: 0px !important;
}

/*.profile-modal.alternative .profile-modal-footer .btn.custom-button,
.profile-modal.alternative .profile-modal-footer .btn.btn-secondary {
	padding: 0 20px;
    line-height: 40px;
}*/

/* tooltip */
#main-content-profile .tooltip-inner {
    color: #3d5265;
    text-align: left;
    background-color: #ededed;
    box-shadow: -4px 4px 8px 0px rgba(61, 82, 101, 0.6);
    max-width: 100%;
    padding: 3px 10px;
}

#main-content-profile .tooltip.right .tooltip-arrow {
    border-right-color: #ededed;
}

#main-content-profile .tooltip.bottom .tooltip-arrow {
    border-bottom-color: #ededed;
}

#main-content-profile .tooltip.top .tooltip-arrow {
    border-top-color: #ededed;
}

#main-content-profile .tooltip.in {
    opacity: 1;
}

/***** Addresses *****/
input.form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #d2d2d2;
    opacity: 1; /* Firefox */
    font-weight: 400;
    font-family: PeridotPE-Regular;
}

input.form-control:-ms-input-placeholder, /* Internet Explorer 10-11 */
input.form-control::-ms-input-placeholder { /* Microsoft Edge */
    color: #d2d2d2;
    font-weight: 400;
}


.address-section {
    margin-bottom: 3em;
}

.address-list {
    position: relative;
    margin-bottom: 25px;
}

.address-list-col {
    max-width: 250px;
}

/*.address-list-actions {
    margin: 25px 0;
}*/
.address-list .card {
    background: #fff;
}

.address-list .card .card-body {
    padding: 15px;
    box-shadow: 5px 5px 20px 1px rgba(159, 159, 159, 0.6);
    border-radius: 2px;
    height: 190px;
}

#main-content-profile .address-list .card h4 {
    text-align: left;
    color: #217ba7;
    font-weight: 600;
    margin: 0;
    font-size: 16px;
}

.card-info {
    position: absolute;
    top: 12px;
    right: 15px; /*30px;*/
}

.card-info-content {
    background: #00aff0;
    color: #fff;
    width: auto;
    max-width: 90px;
    display: inline-block;
    padding: 10px 5px;
    border-radius: 5px;
    position: absolute;
    top: -10px;
    right: -5px;
    text-align: center;
    line-height: 14px;
    font-size: 12px;
    z-index: 1;
    word-break: break-word;
}

.card-info-content button {
    background: #000;
    border: none;
    width: 10px;
    height: 10px;
    border-radius: 100%;
    position: absolute;
    top: 1px;
    right: 1px;
    padding: 0;
    margin: 0;
}

.card-info-content button span {
    font-size: 11px;
    vertical-align: top;
    line-height: 11px;
}

.address-list .card h5 {
    font-weight: 600;
    margin: 5px 0;
    color: #3d5265;
}

#main-content-profile .address-list .card p {
    color: #3d5265;
    font-size: 13px;
    line-height: 14px;
    /*margin-bottom: 25px;*/
}

.address-list .card .form-actions {
    bottom: 15px;
    position: absolute;
    width: calc(100% - 30px);
}

.address-list .card .form-actions > div {
    width: 48%;
    display: inline-block;
}

.address-list .card .form-actions button {
    background: none;
    border: none;
    font-size: 11px;
    padding: 1px 5px;
    outline: none;
}

.address-list .card .form-actions button:last-child {
    padding-right: 0;
}

.address-list .card .form-actions button.edit-btn {
    border-right: 1px solid #3d5265;
    padding-right: 11px;
    line-height: 14px;
}

.address-list .card .form-actions button span {
    font-size: 11px;
    color: #217ba7;
}

.address-list .card .cosmote-checkbox {
    /*bottom: 12px;*/
    top: 10px; /*auto*/
    left: 37px; /*68px;*/
}

.address-list .card .cosmote-checkbox span {
    display: block;
}

/* GMap modal styling */
.gmap-search.profile-modal-body {
    padding: 1px;
    max-height: calc(100vh - 94px); /* modal's padding + modal's header = 40 + 54 = 94 */
    overflow: auto;
}

#main-content-profile .gmap-search .form-control {
    border: 1px solid #d1cfcf;
    font-size: 1.1em;
}

.place-search .info-msg {
    width: 100%;
    background: #fff;
    display: block;
    border: 1px solid #d1cfcf;
    border-top: none;
    padding: 6px 12px;
    color: #8a8989;
    font-size: 0.8em;
}

#main-content-profile input#gmap_address {
    height: 53px;
    border-radius: 0;
    outline: none;
    box-shadow: none;
    color: #3d5265;
    padding: 6px 12px;
    margin: 0;
}

#main-content-profile input#gmap_address:focus {
    outline: none;
    box-shadow: none;
}

input#gmap_address::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #d2d2d2;
    opacity: 1; /* Firefox */
}

input#gmap_address:-ms-input-placeholder, /* Internet Explorer 10-11 */
input#gmap_address::-ms-input-placeholder { /* Microsoft Edge */
    color: #d2d2d2;
}

#gmap {
    width: 100%;
    height: 450px;
    box-shadow: 3px 3px 20px 1px rgba(159, 159, 159, 0.6);
    border: 1px solid #d1cfcf;
    border-radius: 2px;
    margin: 1px 0;
}

.pac-container {
    border: 1px solid #d1cfcf;
    border-top: none;
    display: flex;
    flex-direction: column;
    z-index: 1100;
}

.pac-container .pac-item {
    line-height: 36px;
    font-size: 14px;
    color: #3d5265;
}

.pac-container .pac-item .pac-item-query {
    font-size: 14px;
    padding-left: 15px;
    color: #3d5265;
}

.pac-container .pac-item:hover {
    background-color: #1686b6;
    color: #fff;
}

.pac-container .pac-item:hover .pac-item-query {
    color: #fff;
}

.pac-container .pac-item.pac-item-noresult {
    order: 1;
}

.pac-container .pac-item.pac-item-noresult .pac-item-query {
    color: #1686b6;
}

.pac-container .pac-item.pac-item-noresult .pac-item-query span {
    font-weight: 600;
}

.pac-container .pac-item.pac-item-noresult:hover .pac-item-query {
    color: #fff;
}

.pac-logo:after,
.pac-container .pac-item .pac-icon-marker {
    display: none;
}

.place-info {
    border-top: 2px solid #3d5265;
}

.map-info-body {
    background: #fff;
    padding: 30px 20px 10px;
    border: 1px solid #d1cfcf;
    border-top: none;
    margin: 0;
    /*position: absolute;*/
    /*top: auto;*/
    z-index: 9;
    /*width: calc(100% - 42px);*/
    box-shadow: 0px 2px 10px 0px rgba(159, 159, 159, 0.6);
    position: relative;
}

.map-info-body label {
    font-weight: 500;
    width: 60px;
    color: #3d5265;
}

#main-content-profile .map-info-body .form-control {
    box-shadow: none;
    height: 32px;
    font-size: 1em;
    font-weight: 600;
    color: #3d5265;
    display: inline-block;
    width: calc(100% - 65px);
    padding: 6px 12px;
}

.map-info-body .form-item,
.form-item-sub {
    margin-bottom: 20px;
}

#main-content-profile .address-info {
    background: #fff;
    padding: 30px 20px 0px;
    border: 1px solid #d1cfcf;
    margin: 0;
    border-top: 2px solid #3d5265;
}

.address-info::before {
    content: '';
    position: relative;
    right: 80px;
    top: -32px;
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid #3d5265;
    /*clear: both;*/
    float: right;
}

.address-info label {
    font-weight: 500;
    width: 75px;
    color: #3d5265;
}

#main-content-profile .address-info .form-control {
    box-shadow: none;
    height: 32px;
    font-size: 1em;
    font-weight: 600;
    color: #3d5265;
    display: inline-block;
    width: calc(100% - 80px);
    padding: 6px 12px;
}

.address-info .form-item {
    margin-bottom: 20px;
    padding: 0 15px 0 0;
}

#main-content-profile .address-info .form-item.comments-item textarea {
    resize: none;
    height: 84px;
}

.address-info .form-item.comments-item label {
    vertical-align: top;
    width: 55px;
    margin-left: 20px;
}

#main-content-profile .place-info .btn-outline,
#main-content-profile .address-info .btn-outline {
    width: calc(100% - 65px);
    display: block;
    float: right;
    text-align: center;
    padding: 5px;
    margin-bottom: 20px;
}

#main-content-profile .address-info .btn-outline {
    margin-top: 53px;
}

/* error messages */
#main-content-profile .place-info .help-block,
#main-content-profile .address-info .help-block {
    padding: 0px;
    margin-bottom: 0px;
}

#main-content-profile .place-info .help-block {
    padding-left: 62px;
}

#main-content-profile .address-info .help-block {
    padding-left: 77px;
}

#main-content-profile .place-info .help-block label,
#main-content-profile .address-info .help-block label {
    color: #A40D15;
    font-weight: 500;
    width: auto;
    margin: 0px;
}

@media only screen and (max-width: 1199px) {
    .address-info .form-item.comments-item label {
        width: 75px;
        margin-left: 0px;
    }

    #main-content-profile .address-info .btn-outline {
        margin-top: 0;
        margin-bottom: 25px;
    }

    #main-content-profile .place-info .btn-outline,
    #main-content-profile .address-info .btn-outline {
        width: auto;
        padding: 5px 20px;
        margin-bottom: 15px;
    }
}

@media only screen and (max-width: 767px) {
    .address-list {
        margin-bottom: 5px;
    }

    /*.address-list-actions {
        margin: 5px 0 20px;
    }*/
    /*.address-list-actions .btn-outline,
    .address-list-actions .btn-outline:hover,
    .address-list-actions .btn-outline.active {
        color: #509e2f;
        border: none;
        background: none;
    }*/
    .address-list .card .cosmote-checkbox label {
        top: 3px !important;
    }

    /* GMap modal styling */
    #gmap {
        height: 400px;
    }

    .map-info-body {
        padding: 15px 20px 0px;
    }

    .map-info-body label,
    .address-info label {
        font-weight: 600;
        width: auto;
        display: block;
        margin: 0;
    }

    #main-content-profile .map-info-body .form-control,
    #main-content-profile .address-info .form-control {
        border: none;
        border-bottom: 1px solid #d1cfcf;
        border-radius: 0;
        width: 100%;
        padding-left: 0;
        color: #a2a0a0;
        font-weight: 500;
        height: 26px;
        font-family: PeridotPE-Regular;
    }

    .map-info-body .form-item,
    .form-item-sub {
        margin-bottom: 15px;
    }

    #main-content-profile .address-info {
        padding: 20px 20px 0px;
    }

    .address-info::before {
        top: -22px;
    }

    .address-info .form-item {
        margin-bottom: 0;
        padding: 0;
    }

    #main-content-profile .address-info .form-item.comments-item textarea {
        height: 40px;
    }

    .form-item-sub:first-child {
        margin-top: 15px;
    }

    #main-content-profile .address-info .btn-outline {
        margin: 10px -15px 15px;
    }

    /* error messages */
    #main-content-profile .place-info .help-block,
    #main-content-profile .address-info .help-block {
        padding-left: 0px;
    }
}

/***** Services *****/
.services-section {
    margin-bottom: 3em;
}

.services-list {
    /*     margin-bottom: 25px; */
    margin-top: 40px;
}

/*.services-list-actions {
    margin: 25px 0;
}*/
#main-content-profile .services-list-content .accordion-content {
    box-shadow: 0px 1px 2px 0px rgba(159, 159, 159, 0.7);
    margin-bottom: 0px;
}

/*#main-content-profile .services-list-content .panel-group:first-child {
    margin-top: 0;
}*/
#main-content-profile .services-list-content .panel-group .panel > .panel-heading {
    padding: 15px;
    border: none;
    color: #6d6e76;
}

#main-content-profile .services-list-content .panel-icon {
    display: inline-block;
    width: 60px;
    text-align: center;
    /*vertical-align: bottom;*/
    height: 16px;
    padding: 0px;
}

/* panel-cyan */
#main-content-profile .services-list-content .panel-group .panel > .panel-heading.panel-cyan {
    background: #1686b6;
    color: #fff;
    margin-top: 5px;
}

#main-content-profile .services-list-content .panel-group .panel > .panel-heading.panel-cyan > h4,
#main-content-profile .services-list-content .panel > .panel-heading.panel-cyan > h4 > .panel-title-action span {
    color: #fff
}

.services-list-content .panel-group .panel > .panel-heading.panel-cyan .panel-tag {
    background: #26608d;
    padding: 7px;
    border-radius: 5px;
    font-weight: 600;
    font-size: 12px;
    display: inline-block;
    width: 60px;
    text-align: center;
}

.services-list-content .panel-group .panel > .panel-heading.panel-cyan .panel-main-title {
    font-size: 15px;
    font-weight: 600;
    margin-left: 10px;
    display: inline-block;
    width: 180px;
}

.services-list-content .panel-group .panel > .panel-heading.panel-cyan .panel-subtitle {
    width: calc(50% - 90px);
    display: inline-block;
    font-style: italic;
    font-size: 14px;
    vertical-align: middle;
}

.services-list-content .panel-heading.panel-cyan .accordion-toggle:after {
    font-family: 'Glyphicons Halflings';
    content: "\2212";
    float: right;
    margin-top: 3px;
    font-size: 14px;
    color: #fff;
}

.services-list-content .panel-heading.panel-cyan .accordion-toggle.collapsed:after {
    content: "\002b";
    color: #fff;
}

/* panel-white */
#main-content-profile .services-list-content .panel-group .panel > .panel-heading.panel-white {
    background: #fbfbfb;
    border-bottom: 2px solid #3d5265;
}

/*#main-content-profile .services-list-content .panel-group .panel:last-child > .panel-heading.panel-white {
    border-bottom: none;
}*/
.services-list-content .panel-group .panel > .panel-heading.panel-white .panel-tag {
    background: #3d5265;
    padding: 7px;
    border-radius: 5px;
    font-weight: 600;
    font-size: 12px;
    display: inline-block;
    color: #fff;
    width: 100px;
    text-align: center;
}

.services-list-content .panel-group .panel > .panel-heading.panel-white .panel-main-title {
    font-weight: 600;
    font-size: 15px;
    margin-left: 10px;
    display: inline-block;
    width: 180px;
    padding: 0px;
}

.services-list-content .panel-group .panel > .panel-heading.panel-white .panel-subtitle {
    font-size: 14px;
    display: inline-block;
    font-style: italic;
    vertical-align: middle;
    width: calc(50% - 130px);
}

.services-list-content .panel-group .panel > .panel-heading.panel-white .panel-subtitle span {
    display: block;
}

#main-content-profile .services-list-content .panel-group .panel > .panel-heading.panel-white .panel-title-action span,
#main-content-profile .services-list-content .panel-heading.panel-white .accordion-toggle:after,
#main-content-profile .services-list-content .panel-heading.panel-white .accordion-toggle.collapsed:after {
    color: #3d5265;
}

/* panel-white-blue */
#main-content-profile .services-list-content .panel-group .panel > .panel-heading.panel-white-blue {
    background: #fafafa;
    border-bottom: 1px solid #e0e0e0;
}

#main-content-profile .services-list-content .panel-group .panel:last-child > .panel-heading.panel-white-blue {
    border-bottom: none;
}

.services-list-content .panel-group .panel > .panel-heading.panel-white-blue .panel-main-title {
    font-weight: 600;
    font-size: 15px;
    margin-left: 10px;
    display: inline-block;
    width: 180px;
    color: #6b6c74;
    padding: 0px;
}

.services-list-content .panel-heading.panel-white-blue .accordion-toggle:after,
.services-list-content .panel-heading.panel-white-blue .accordion-toggle.collapsed:after {
    color: #1686b6;
}

/* panel-blue-nested */
#main-content-profile .services-list-content .panel-group .panel > .panel-heading.panel-blue-nested {
    background: #3d5265;
    border: none;
    padding: 13px 15px;
    border-bottom: 2px solid #fafafa;
}

#main-content-profile .services-list-content .panel-group .panel:last-child > .panel-heading.panel-blue-nested {
    border-bottom: none;
}

.services-list-content .panel-group .panel > .panel-heading.panel-blue-nested .panel-main-title {
    font-weight: 400;
    font-size: 15px;
    margin-left: 10px;
    display: inline-block;
    width: 210px;
    color: #fff;
}

.services-list-content .panel-group .panel > .panel-heading.panel-blue-nested .panel-subtitle {
    font-size: 14px;
    display: inline-block;
    font-style: italic;
    vertical-align: middle;
    width: calc(50% - 120px);
    color: #fff;
}

#main-content-profile .services-list-content .panel-group .panel > .panel-heading.panel-blue-nested .panel-action {
    color: #fff;
    font-size: 13px;
    position: absolute;
    right: 20px;
    top: 50%;
    margin-top: -6px;
}

#main-content-profile .services-list-content .panel > .panel-heading.panel-blue-nested > h4 > .panel-title-action span {
    color: #fff;
}

.panel-actions {
    margin: 10px 0;
    text-align: right;
}

.panel-actions a, .panel-actions a:hover, .panel-actions a:focus {
    color: #3d5265;
    font-size: 13px;
    vertical-align: top;
}

.panel-actions a .glyphicon {
    color: #3d5265;
    font-size: 18px;
    padding: 2px;
    margin-right: 10px;
    float: inherit;
}

.panel-actions a span {
    vertical-align: middle;
}

/*#main-content-profile .panel-heading > h4 .glyphicon.glyphicon-info-sign {
    top: 3px;
    left: 0;
    position: relative;
    margin: 0 84px 0 10px;
    padding: 0px;
    font-size: 16px;
}*/

#main-content-profile .services-info {
    top: 2px;
    position: relative;
    margin: 0 84px 0 10px;
    background: url('../images/info_icon.png') no-repeat;
    padding: 1px 10px;
}

/* tooltip */
.services-list-content .tooltip.in {
    opacity: 1;
}

.services-list-content .tooltip.right {
    padding: 0px 15px;
    margin-left: 10px;
}

.services-list-content .tooltip.right .tooltip-arrow {
    margin-top: -7px;
    border-width: 7px 15px 7px 0;
    border-right-color: white;
}

.services-list-content .tooltip.top {
    padding: 15px 0px;
    margin-top: -10px;
}

.services-list-content .tooltip.top .tooltip-arrow {
    margin-left: -7px;
    border-width: 15px 7px 0 7px;
    border-top-color: white;
}

/*.services-list-content .tooltip.bottom {
	padding: 15px 0px;
   	margin-top: 10px;
}
.services-list-content .tooltip.bottom .tooltip-arrow {
	margin-left: -7px;
	border-width: 0 7px 15px 7px;
   	border-bottom-color: white;
}*/
.services-list-content .tooltip-inner {
    max-width: 180px;
    background-color: white;
    color: #6b6c74;
    padding: 0 10px;
}

@media (max-width: 991px) {
    #main-content-profile .services-list-content .panel-group .panel > .panel-heading {
        padding: 10px;
    }

    .services-list-content .panel-group .panel > .panel-heading.panel-cyan .panel-subtitle,
    .services-list-content .panel-group .panel > .panel-heading.panel-white .panel-subtitle,
    .services-list-content .panel-group .panel > .panel-heading.panel-blue-nested .panel-subtitle,
    .services-list-content .panel-group .panel > .panel-heading.panel-white-cyan .panel-subtitle {
        display: inline-block;
        width: auto;
        margin: 5px 0 0px 75px;
    }

    #main-content-profile .services-list-content .panel > .panel-heading.panel-cyan > h4 > .panel-title-action,
    #main-content-profile .services-list-content .panel > .panel-heading.panel-white > h4 > .panel-title-action,
    #main-content-profile .services-list-content .panel > .panel-heading.panel-blue > h4 > .panel-title-action,
    #main-content-profile .services-list-content .panel > .panel-heading.panel-blue-nested > h4 > .panel-title-action {
        display: inline-block;
        vertical-align: bottom;
    }

    .services-list-content .panel-group .panel > .panel-heading.panel-white .panel-subtitle,
    .services-list-content .panel-group .panel > .panel-heading.panel-blue .panel-subtitle {
        margin: 5px 0 0px 120px;
    }

    #main-content-profile .services-list-content .panel-group .panel > .panel-heading.panel-white-blue,
    #main-content-profile .services-list-content .panel-group .panel > .panel-heading.panel-white-cyan {
        padding: 15px 10px;
    }
}

@media only screen and (max-width: 767px) {
    .services-list {
        margin-bottom: 5px;
        margin-top: 0px;
    }

    /*.services-list-actions {
        margin: 5px 0 20px;
    }*/
    /*#main-content-profile .services-list-actions .btn-outline,
    #main-content-profile .services-list-actions .btn-outline:hover,
    #main-content-profile .services-list-actions .btn-outline.active {
        color: #509e2f;
        border: none;
        background: none;
    }*/
    #main-content-profile .services-section .accordion-content {
        border: none;
    }
}

@media only screen and (max-width: 480px) {
    /*#main-content-profile .panel-heading > h4 .glyphicon.glyphicon-info-sign {
        margin-right: 0px;
    }*/
    #main-content-profile .services-info {
        margin-right: 0px;
    }
}

/***** New Services *****/
.services-list .panel-group > .panel {
    border-radius: 4px;
}

.services-list .panel-group > .panel > .panel-heading {
    display: flex;
    align-items: center;
    padding: 9px 15px;
    border: none;
    border-radius: 4px;
    box-shadow: 0px 2px 14px -1px rgba(159, 159, 159, 0.7);
    margin-bottom: 4px;
}

.services-list .panel-group > .panel > .panel-heading.panel-blue-white {
    line-height: 27px;
}

.services-list .panel-heading .tag-blue {
    background: #26608d;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    font-weight: 700;
    font-size: 12px;
    align-self: flex-start;
    margin-right: 5px;
    vertical-align: text-bottom;
}

.services-list .panel-heading > div:first-child > strong:last-of-type {
    margin-right: 10px;
}

.services-list .panel-heading > div:not(.panel-heading-actions) {
    width: calc(100% - 45px);
    word-break: break-word;
}

.services-list .panel-heading .glyphicon-info-sign {
    font-size: 18px;
    position: relative;
    margin: 0 10px;
    left: 0;
}

.services-list .panel .panel-body {
    margin-bottom: 5px;
    padding: 15px;
}

.services-list .panel-body .panel {
    margin-bottom: 8px;
}

.services-list .panel-body .panel-heading {
    padding: 5px 15px;
    box-shadow: 0px 3px 3px 0px rgba(159, 159, 159, 0.7);
    font-size: 12px;
}

.services-list .panel-body .account-info {
    display: inline-block;
    vertical-align: top;
    margin-right: 10px;
}

.services-list .panel-body .account-info > span {
    color: #b7b7b7;
}

.services-list .panel-body .panel-heading .connected-role,
.services-list .panel-body .panel-heading .connected-role strong ~ span {
    background-color: #fff;
}

.services-list .panel-body .panel-heading-actions .dropdown {
    padding: 21px 5px;
}

.services-list .panel-body .panel-body {
    margin-bottom: 0px;
    padding: 0px;
}

.services-list .panel-body .section {
    border-bottom: 1px solid #26608d;
    color: #26608d;
    font-weight: 600;
    display: flex;
    align-items: center;
    height: 45px;
}

.services-list .panel-body .section img {
    margin: 0 20px;
}

.services-list .panel-body .section.corporate-title {
    color: #3d5265;
    border-bottom: 1px solid #3d5265;
}

.services-list .panel-body .section.corporate {
    border-bottom: none;
}

.services-list .panel-body .asset {
    padding: 10px 20px;
    font-size: 12px;
    position: relative;
}

.services-list .panel-body .asset:hover {
    box-shadow: 0px 2px 14px -1px rgba(159, 159, 159, 0.7);
}

.services-list .panel-body .asset .asset-info {
    display: inline-block;
    margin-right: 10px;
    max-width: calc(100% - 15px);
    word-break: break-word;
}

.services-list .panel-body .asset .asset-properties {
    color: #26608d;
}

.services-list .panel-body .asset .asset-properties > .glyphicon {
    color: #b7b7b7;
}

.services-list .panel-body .asset .asset-properties > strong {
    color: #737e85;
}

.services-list .panel-body .asset .asset-properties > span:last-child {
    font-style: italic;
}

.services-list .panel-heading-actions {
    display: flex;
    align-items: center;
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    font-size: 15px;
}

.services-list .panel-heading-actions a.panel-toggle {
    padding: 0px 10px;
    display: inline-block;
}

.services-list .panel-heading .panel-toggle:after {
    content: "\e252";
    color: #2e5481;
    font-family: 'Glyphicons Halflings';
    position: relative;
    top: 2px;
}

.services-list .panel-heading .panel-toggle.collapsed:after {
    content: "\e253";
    color: #3d5265;
}

.services-list .panel-heading-actions .dropdown {
    display: flex;
    align-items: center;
    border-left: 2px solid #bfbfbf;
    height: 100%;
    padding: 10px 5px 10px;
    font-size: 18px;
}

.services-list .panel-heading-actions .dropdown > span {
    cursor: pointer;
    top: 0px;
}

.services-list .panel-body .asset .dropdown {
    display: inline-block;
    position: absolute;
    right: 0;
    top: 8px;
    padding-right: 5px;
    font-size: 18px;
    color: #b7b7b7;
    cursor: pointer;
}

.services-list .panel-body .asset .dropdown:hover {
    color: #3d5265;
}

.services-list .data-container.disabled {
    opacity: 0.5;
    z-index: 15;
}

.services-list .data-container .glyphicon-eye-open,
.services-list .data-container.disabled a.panel-toggle,
.services-list .data-container.disabled .dropdown-services {
    display: none;
}

.services-list .data-container.disabled .glyphicon-eye-open {
    display: inline-block;
    font-size: 15px;
}

.services-list .data-container.disabled .panel-heading-actions .glyphicon-eye-open {
    padding: 12px 10px;
}

.services-list .connected-roles-wrapper {
    display: inline-block;
    margin-top: 7px;
}

.services-list .connected-role {
    display: inline-block;
    background-color: #ededed;
    border-radius: 4px;
    padding: 0px;
    /*padding-left: 24px;*/
    position: relative;
    margin-right: 10px;
    /*background-position: 4px 2px;
    background-repeat: no-repeat;*/
}

.services-list .connected-roles-wrapper .role-dropdown-activator {
    cursor: pointer;
}

.services-list .connected-roles-wrapper .role-popup {
    position: absolute;
    top: 33px;
    right: 0px;
    z-index: 1000;
    background-color: #ededed;
    border: 1px solid #e7e7e7;
    border-radius: 3px;
    width: 100%;
    font-size: 12px !important;
    color: #394e61;
}

.services-list .connected-roles-wrapper .role-popup::after {
    position: absolute;
    top: -8px;
    /* left: 139px; */
    right: 0px;
    display: inline-block;
    border-right: 11px solid transparent;
    border-bottom: 11px solid #ededed;
    border-left: 11px solid transparent;
    border-top: 0;
    content: '';
}

.services-list .connected-roles-wrapper .active-users-title, .pending-users-title {
    font-size: 12px !important;
    margin: 0px !important;
    padding: 4px 4px 4px 8px;
    border-bottom: 1px solid #a7afb7;
    font-weight: bold;
    /* background-color: lightgoldenrodyellow; */
}

.services-list .connected-roles-wrapper .active-users-list, .pending-users-list {
    font-size: 12px !important;
    margin: 0px;
    padding: 4px 4px 4px 20px;
    word-wrap: break-word;
    /* background-color: lightcoral; */
}

.services-list .connected-roles-wrapper .active-users-showall, .pending-users-showall {
    font-size: 12px !important;
    margin: 0px !important;
    padding: 0px;
    text-align: center !important;
    /* background-color: lightgreen; */
}

.services-list .connected-roles-wrapper .active-users-showall a, .pending-users-showall a {
    cursor: pointer;
    display: inline-block;
    font-style: normal;
    color: #989898;
    padding: .1rem 1rem .1rem .1rem;
    text-decoration: underline !important;
}

.services-list .connected-roles-wrapper .active-users-showall a .folded, .pending-users-showall a .folded {
    background: url("../images/showall-role.png") right top no-repeat;
    display: inline-block;
    width: 14px;
    height: 11px;
}

.services-list .connected-roles-wrapper .active-users-showall a .expanded, .pending-users-showall a .expanded {
    background: url("../images/hideall-role.png") right top no-repeat;
    display: inline-block;
    width: 14px;
    height: 10px;
    margin-left: 4px;
}

/*.services-list .connected-role .glyphicon {
	color: #26608d;
    font-size: 14px;
    line-height: 24px;
    position: absolute;
    top: 0;
    left: 5px;
}*/
.services-list .connected-role img {
    padding: 0 1px 0 1px;
    margin: 0 4px;
    width: 16px;
}

.services-list .connected-role .info-icon {
}

.services-list .connected-role strong {
    border-left: 1px solid #ccc;
    font-size: 12px;
    line-height: 20px;
    display: inline-block;
    padding: 2px 5px;
    margin-right: 12px;
    color: #737e85;
    /*border-left: 1px solid #ccc;*/
    /*font-size: 12px;*/
    /*line-height: 20px;*/
    /*display: inline-block;*/
    /*padding: 2px 5px;*/
    /*color: #737e85;*/
}

/*.services-list .connected-role strong ~ span {*/
/*    position: absolute;*/
/*    !* top: -7px; *!*/
/*    background: url("../images/info_icon.png") right top no-repeat;*/
/*    !* right: -7px; *!*/
/*    !* background-color: #ededed; *!*/
/*    width: 24px;*/
/*    height: 24px;*/
/*    color: #3d5265;*/
/*!* padding: 0 4px; *!*/
/*!* border-radius: 50%; *!*/
/*!* font-size: 9px; *!*/
/*!* border: 1px solid;*!*/
/*}*/

.services-list .connected-role strong ~ span {
    position: absolute;
    top: -7px;
    right: -7px;
    background-color: #ededed;
    color: #3d5265;
    padding: 0 4px;
    border-radius: 50%;
    font-size: 9px;
    border: 1px solid;
}

@media only screen and (max-width: 767px) {
    .services-list .panel-group .panel .panel-heading {
        padding: 9px 10px;
    }

    .services-list .panel .panel-body {
        padding: 0px;
    }

    .services-list .panel-body .panel {
        margin-bottom: 0px;
    }

    .services-list .panel-body .panel .panel-heading {
        box-shadow: none;
        border-bottom: 1px solid #bfbfbf;
        padding-left: 40px;
    }

    .services-list .panel-body .section,
    .services-list .panel-body .section.corporate,
    .services-list .panel-body .section.corporate-title {
        border-bottom: 1px solid #bfbfbf;
        height: 38px;
        font-size: 14px;
    }

    .services-list .panel-body .section img {
        margin: 0 10px;
    }

    .services-list .panel-body .asset {
        padding: 10px;
        border-bottom: 1px solid #bfbfbf;
    }

    .services-list .panel-body .asset:hover {
        background-color: #e9edf1;
    }

    .services-list .panel-body .asset .asset-info {
        margin-right: 0px;
        padding-left: 30px;
    }

    /*.services-list .panel-body .asset:not(:last-child) {
        border-bottom: 1px solid #bfbfbf;
    }*/
    .services-list .panel-heading-actions a.panel-toggle {
        padding: 0px 5px;
    }

    .services-list .panel-heading .panel-toggle:after {
        content: "\e114";
    }

    .services-list .panel-heading .panel-toggle.collapsed:after {
        content: "\e113";
    }

    .services-list .panel-heading-actions .dropdown,
    .services-list .panel-body .panel-heading-actions .dropdown {
        padding: 9px 3px 9px 2px;
    }

    .services-list .connected-roles-wrapper {
        display: block;
        padding: 10px;
        background-color: #f4f4f4;
        border: 1px solid #ccc;
        border-radius: 4px;
        margin-top: 10px;
    }

    .services-list .connected-roles-wrapper > span.visible-xs {
        margin: 5px 0 10px 0;
        color: #3d5265;
        font-size: 12px;
        font-weight: 600;
    }

    .services-list .connected-role {
        display: block;
        background: white;
        border: 1px solid #ccc;
        padding-top: 5px;
        padding-bottom: 5px;
        margin-right: 0px;
    }

    .services-list .connected-role ~ .connected-role {
        margin-top: 5px;
    }

    /*.services-list .connected-role .glyphicon {
        line-height: 34px;
    }*/
    .services-list .connected-role strong {
        padding-right: 0;
    }

    .services-list .connected-role strong ~ span {
        position: static;
        background: none;
        border: none;
        font-size: 14px;
        color: #737e85;
        font-weight: 600;
        padding-left: 10px;
    }

    .services-list .connected-role strong ~ span.visible-xs {
        display: inline !important;
        padding: 1px;
    }
}

/* Dropdown actions */
.dropdown.dropdown-services .dropdown-menu {
    padding: 0px;
    margin: 0px;
    top: 0px;
    left: 45px;
    width: 260px;
    overflow: inherit;
    cursor: auto;
    max-height: fit-content;
    border: none;
}

.dropdown.dropdown-services .dropdown-menu:after {
    position: absolute;
    top: 9px;
    left: -13px;
    right: inherit;
    display: inline-block;
    border-right: 13px solid #ffffff;
    border-bottom: 13px solid transparent;
    border-left: 0;
    border-top: 13px solid transparent;
    content: '';
}

.dropdown.dropdown-services .dropdown-head {
    background: #3d5265;
    color: #fff;
    padding: 12px;
    border-radius: 4px;
}

.dropdown.dropdown-services .dropdown-head .glyphicon {
    float: right;
    cursor: pointer;
}

.dropdown.dropdown-services .dropdown-body {
    padding: 10px 10px 20px 10px;
}

.dropdown.dropdown-services .dropdown-body > div {
    border-bottom: 1px solid #ccc;
    margin-bottom: 5px;
    position: relative;
    padding-right: 22px;
    padding-bottom: 4px;
}

.dropdown.dropdown-services .dropdown-body > div > strong {
    display: block;
    margin-bottom: 10px;
    color: #3d5265;
}

.dropdown.dropdown-services .dropdown-body > div > label {
    margin: 0px;
    color: #6d6e76;
}

.dropdown.dropdown-services .dropdown-body > div > a > .glyphicon {
    color: #3d5265;
    position: absolute;
    right: 0;
    bottom: 6px;
    top: auto;
}

.dropdown.dropdown-services .dropdown-body > div > span {
    font-size: 12px;
    display: inline-block;
    margin-bottom: 4px;
    color: #6d6e76;
}

.dropdown.dropdown-services .dropdown-body > div > div > a {
    font-size: 12px;
    color: #3d5265;
    border-bottom: 1px solid;
}

.dropdown.dropdown-services .dropdown-body > div > div > a.disabled {
    color: #ccc;
    cursor: not-allowed;
}

.asset .dropdown.dropdown-services .dropdown-menu {
    top: -13px;
}

@media only screen and (max-width: 1199px) {
    .dropdown.dropdown-services .dropdown-menu {
        top: 98%; /*43px*/
        left: inherit;
        right: -2px;
        width: 670px;
    }

    .panel-body .dropdown.dropdown-services .dropdown-menu {
        width: calc(670px - 28px);
    }

    .dropdown.dropdown-services .dropdown-menu:after {
        position: absolute;
        top: -23px;
        right: 3px;
        left: inherit;
        display: inline-block;
        border-right: 13px solid transparent;
        border-bottom: 10px solid #3d5265;
        border-left: 13px solid transparent;
        content: '';
    }

    .asset .dropdown.dropdown-services .dropdown-menu {
        top: 30px;
    }
}

@media only screen and (max-width: 991px) {
    .dropdown.dropdown-services .dropdown-menu {
        width: 460px;
    }

    .panel-body .dropdown.dropdown-services .dropdown-menu {
        width: calc(460px - 28px);
    }
}

@media only screen and (max-width: 767px) {
    .dropdown.dropdown-services .dropdown-head {
        border-radius: 0;
        padding: 8px 15px;
    }

    .dropdown.dropdown-services .dropdown-menu {
        top: 98%; /*35px*/
        right: 0;
        border-radius: 0;
        border: 1px solid #3d5265;
        width: calc(100vw - 42px) !important;
    }

    .dropdown.dropdown-services .dropdown-menu:after {
        display: none;
    }
}

/* Modals */
#modalEditServiceLabel .profile-modal-body input {
    width: 80%;
    float: left;
    font-weight: bold;
}

#modalEditServiceLabel .profile-modal-body .maxlength {
    float: right;
    font-size: 14px;
    color: #3d5265;
    padding: 10px 0;
}

.modal-open .profile-modal.services-modal {
    overflow: auto;
}

.profile-modal.services-modal .profile-modal-header {
    padding: 11px 15px;
}

.profile-modal.services-modal .profile-modal-title {
    display: inline;
}

.profile-modal.services-modal .glyphicon-remove {
    float: right;
    cursor: pointer;
    line-height: 22px;
}

.profile-modal.services-modal .profile-modal-body {
    color: #3d5265;
    padding: 20px;
}

@media only screen and (max-width: 767px) {
    .profile-modal.services-modal .profile-modal-body {
        padding: 10px;
    }

    .profile-modal.services-modal .profile-modal-footer {
        padding: 20px 10px;
    }
}

/* mpete */

.pass-warn-change {
    font-size: 12px;
    color: #3d5265;
    margin: 10px auto;
    padding: 20px;
    font-family: PeridotPE-Regular;
}

.pass-warn-icon {
    margin: 0 0 0 8px;

}

#modalDeleteAfm .profile-modal-dialog {
    max-width: 550px;
}

#modalDeleteAfm .tooltip-inner {
    padding: 20px 8px;
}

#modalDeleteAfm .profile-modal-header {
    text-align: center;
}

#modalDeleteAfm .profile-modal-footer {
    text-align: center;
    padding: 0px 0px 20px 0px;
}

#modalDeleteAfm .profile-modal-body {
    margin-right: 20px;
    margin-left: 20px;
    margin-bottom: 20px;
    margin-top: 50px;
}

#modalDeleteAfm .section {
    margin-top: 20px;
    /*min-height: 160px;*/
}

#modalDeleteAfm .section:first-child {
    margin-bottom: 10px;
    margin-top: 0;
}

#modalDeleteAfm .section:last-child {
    margin-bottom: 20px;
}

#modalDeleteAfm .section:last-child .section-body strong {
    margin-bottom: 10px;
}

#modalDeleteAfm .section:last-child .section-body-second strong {
    margin-bottom: 10px;
}

#modalDeleteAfm .section:not(:first-child) {
    margin-top: 20px;
    /*min-height: 160px;*/
}

#modalDeleteAfm .section:not(:last-child) {
    display: inline-flex;
    margin-bottom: 20px;
    width: 100%;
    /*border-bottom: 1px solid #e5e4e4;*/
}

#modalDeleteAfm .section:nth-child(2) {
    display: block;
    margin-bottom: 40px;
    width: 100%;
    padding-bottom: 0;
    margin-top: 0;
}

#modalDeleteAfm .section:nth-child(2) .section-body {
    display: inline-block;
    vertical-align: top;
}

#modalDeleteAfm .section:nth-child(2) .section-body-second {
    display: inline-block;
    vertical-align: top;
}

#modalDeleteAfm .delete-afm-container {
    text-align: center;
}

#modalDeleteAfm .delete-afm-container .section {
    display: inline-block;
    margin-bottom: 0;
    width: 100%;
    padding-bottom: 0;
    border-bottom: 0 solid #e5e4e4;
}

#modalDeleteAfm .delete-afm-container strong {
    font-weight: 500;
}

#modalDeleteAfm section {
    display: block;
    font: Italic 12px/14px PeridotPE-Regular;
    letter-spacing: 0;
    color: #3D5265;
    padding-top: 8px;
    border-top: 1px solid #737E85;
}

#modalDeleteAfm .section-num {
    background-color: #3d5265;
    color: #fff;
    padding: 2px 6px;
    border-radius: 5px;
    margin-right: 5px;
    font-weight: bold;
}

#modalDeleteAfm .section:first-child {
    margin-bottom: 25px;
    margin-top: 0;
}

#modalDeleteAfm .section-body {
    display: inline-block;
    vertical-align: top;
    font-size: 16px;
    font-family: PeridotPE-Regular;
}

#modalDeleteAfm .section-body-second {
    display: inline-block;
    vertical-align: top;
    text-align: left;
}

#modalDeleteAfm .section-body > strong {
    display: inline-block;
    margin-bottom: 10px;
}

#modalDeleteAfm .profile-modal-body .section input {
    border: 1px solid #cdcdcd;
    padding: 5px 10px;
    width: calc(100% - 10px);
    margin-top: 10px;
    color: #3d5265;
    font-weight: bold;
    outline: none;
}

#modalDeleteAfm .profile-modal-body .section input::placeholder {
    font-size: 12px;
    text-align: left;
}

#modalDeleteAfm .info-message {
    display: block;
    font-size: 12px;
    font-style: italic;
    margin-top: 5px;
    padding: 0px 0px 0px 5px;
    width: calc(100% - 60px);
}

#modalDeleteAfm .section-body .help-block {
    padding: 0 0 0 5px;
    /*margin: 10px 0 0;*/
    font-style: italic;
}

#modalDeleteAfm .section-body {
    font-size: 16px;
    font-family: PeridotPE-Regular;
}

#modalDeleteAfm .section-body textarea {
    display: inline-block;
    margin-top: 5px;
    padding: 0 0 0 5px;
    width: calc(100% - 10px);
    resize: none;
    border: none;
    font: Italic 12px/14px PeridotPE-Regular;
    outline: none !important;
}

#modalDeleteAfm .section-body .help-block label {
    font-weight: 500;
}

#modalDeleteAfm .tag-blue {
    color: #3D5265;
    padding: 5px 10px;
    border-radius: 5px;
    font: Bold 14px/16px PeridotPE-Regular;
    align-self: flex-start;
    margin-right: 5px;
    vertical-align: text-bottom;
}

@media only screen and (max-width: 767px) {
    #modalDeleteAfm .info-message {
        display: block;
        font-size: 12px;
        margin-top: 10px;
        padding: 10px;
        background-color: #ededed;
        border-radius: 4px;
    }
}

/* tete */
#modalShowUsers .profile-modal-dialog,
#modalRoleAssignment .profile-modal-dialog {
    max-width: 550px;
}

#modalRoleAssignment .tooltip-inner {
    padding: 20px 8px;
}

.modal-backdrop.fade.in,
.modal-backdrop.fade.show {
    background-color: #3d5265 !important;
    opacity: 0.42 !important;
}

#modalShowUsers .profile-modal-header,
#modalRoleAssignment .profile-modal-header {
    text-align: center;
}

#modalRoleAssignment .profile-modal-footer {
    text-align: center;
    padding: 0px 0px 20px 0px;
}

#modalRoleAssignment .profile-modal-footer .loader-container {
    min-height: 30px;
    min-width: 30px;
    width: 55%;
    margin-bottom: 10px;
}

#modalRoleAssignment .profile-modal-body {
    margin-right: 0;
    margin-left: 0;
}

#modalRoleAssignment .section {
    margin-top: 20px;
    /*min-height: 160px;*/
}

#modalRoleAssignment .section:first-child {
    margin-bottom: 10px;
    margin-top: 0;
}

#modalRoleAssignment .section:last-child {
    margin-bottom: 20px;
}

#modalRoleAssignment .section:last-child .section-body strong {
    margin-bottom: 10px;
}

#modalRoleAssignment .section:not(:first-child) {
    margin-top: 20px;
    /*min-height: 160px;*/
}

#modalRoleAssignment .section:not(:last-child) {
    display: inline-flex;
    margin-bottom: 20px;
    width: 100%;
    /*border-bottom: 1px solid #e5e4e4;*/
}

#modalRoleAssignment .section:nth-child(2) {
    display: block;
    margin-bottom: 40px;
    width: 100%;
    padding-bottom: 0;
    margin-top: 0;
}

#modalRoleAssignment .section:nth-child(2) .section-body {
    display: inline-block;
    vertical-align: top;
}

#modalRoleAssignment .assign-role-response-container {
    text-align: center;
}

#modalRoleAssignment .assign-role-response-container .section {
    display: inline-block;
    margin-bottom: 0;
    width: 100%;
    padding-bottom: 0;
    border-bottom: 0 solid #e5e4e4;
}

#modalRoleAssignment .assign-role-response-container strong {
    font-weight: 500;
}

#modalRoleAssignment .assign-role-response-container img {
    width: 64px;
    height: 64px;
    margin: 0 24px 10px 24px;
}

#modalRoleAssignment section {
    display: block;
    font: Italic 12px/14px PeridotPE-Regular;
    letter-spacing: 0;
    color: #3D5265;
    padding-top: 8px;
    border-top: 1px solid #737E85;
}

#modalRoleAssignment .section-num {
    background-color: #3d5265;
    color: #fff;
    padding: 2px 6px;
    border-radius: 5px;
    margin-right: 5px;
    font-weight: bold;
}

#modalRoleAssignment .section:first-child {
    margin-bottom: 25px;
    margin-top: 0;
}

#modalRoleAssignment .section-body {
    display: inline-block;
    vertical-align: top;
}

#modalRoleAssignment .section-body > strong {
    display: inline-block;
    margin-bottom: 10px;
}

#modalRoleAssignment .profile-modal-body .section input {
    border: 1px solid #cdcdcd;
    padding: 5px 10px;
    width: calc(100% - 10px);
    margin-top: 10px;
    color: #3d5265;
    font-weight: bold;
    outline: none;
}

#modalRoleAssignment .profile-modal-body .section input::placeholder {
    font-size: 12px;
    text-align: left;
}

#modalRoleAssignment .info-message {
    display: block;
    font-size: 12px;
    font-style: italic;
    margin-top: 5px;
    padding: 0px 0px 0px 5px;
    width: calc(100% - 60px);
}

#modalRoleAssignment #roles {
    display: flex;
    flex-wrap: wrap;
}

#modalRoleAssignment .role {
    width: 100px;
    text-align: center;
    margin-bottom: 10px;
    margin-right: 10px;
}

#modalRoleAssignment ul {
    padding-left: 20px;
    padding-top: 10px;
    text-align: left;
}

#modalRoleAssignment ul li::before {
    color: #3d5265;
}

#modalRoleAssignment ul li::after {
    color: #3d5265;
}

#modalRoleAssignment ul li {
    color: #737e85;
    font-weight: 500;
    padding-right: 10px;
}

#modalRoleAssignment .role input {
    display: none;
}

#modalRoleAssignment .role label,
#modalRoleAssignment .role .role-desc {
    font-size: 12px;
    padding: 8px;
    word-break: break-word;
}

#modalRoleAssignment .role label {
    min-height: 80px;
    min-width: 200px;
    display: flex;
    pointer-events: none;
    flex-flow: column;
    justify-content: center;
    box-shadow: 0 4px 7px 1px rgba(100, 122, 141, 0.3);
    -webkit-box-shadow: 0 4px 7px 1px rgba(100, 122, 141, 0.3);
    /*border: 1px solid #cdcdcd;*/
    border-radius: 8px;
    margin: 0px;
    position: relative;
    cursor: pointer;
}

#modalRoleAssignment .role input:checked + label:after {
    content: "\e084";
    font-family: 'Glyphicons Halflings';
    position: absolute;
    top: -8px;
    right: -3px;
    font-size: 20px;
}

#modalRoleAssignment .role label > strong {
    line-height: 12px;
}

#modalRoleAssignment .role img {
    margin: 0 15px 10px 5px;
    width: 24px;
    float: left;
}

/*#modalRoleAssignment .role .glyphicon {
    font-size: 22px;
    margin-bottom: 5px;
}*/
@media (min-width: 1200px) {
    /*.col-lg-8 {*/
    /*    width: 500px !important;*/
    /*}*/
    .col-lg-offset-1 {
        margin-left: 15px !important;
    }
}

#modalRoleAssignment .role i.arrow-down {
    position: absolute;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid;
    left: calc(50% - 10px);
    bottom: -10px;
}

#modalRoleAssignment .role-desc {
    margin-top: 6px;
    background-color: #ededed;
    border-radius: 4px;
}

#modalRoleAssignment .role .tooltip {
    max-width: calc(100% - 100px);
}

#modalRoleAssignment .connection-info {
    margin-top: 10px;
    margin-left: 2px;
    margin-bottom: 5px;
}

#modalRoleAssignment .connection-info .icon-info-sign {
    margin-left: 28px;
}

#modalRoleAssignment .connection-info strong {
    color: #3D5265;
    font: Bold 14px/16px PeridotPE-Regular;
}

#modalRoleAssignment .section-body .help-block {
    padding: 0 0 0 5px;
    /*margin: 10px 0 0;*/
    font-style: italic;
}

#modalRoleAssignment .section-body textarea {
    display: inline-block;
    margin-top: 5px;
    padding: 0 0 0 5px;
    width: calc(100% - 10px);
    resize: none;
    border: none;
    font: Italic 12px/14px PeridotPE-Regular;
    outline: none !important;
}

#modalRoleAssignment .section-body .help-block label {
    font-weight: 500;
}

#modalRoleAssignment .tag-blue {
    color: #3D5265;
    padding: 5px 10px;
    border-radius: 5px;
    font: Bold 14px/16px PeridotPE-Regular;
    align-self: flex-start;
    margin-right: 5px;
    vertical-align: text-bottom;
}

@media only screen and (max-width: 767px) {
    #modalRoleAssignment .info-message {
        display: block;
        font-size: 12px;
        margin-top: 10px;
        padding: 10px;
        background-color: #ededed;
        border-radius: 4px;
    }

    /*#modalRoleAssignment .role .tooltip {
        position: relative;
        top: -50px !important;
        left: 0px !important;
        height: 0;
        margin: 0;
        padding: 0;
        width: fit-content;
    }*/
    #modalRoleAssignment .role .tooltip .tooltip-inner {
        background-color: #fff;
        border: 1px solid #cdcdcd;
        border-radius: 0;
    }

    #modalRoleAssignment .role .tooltip .tooltip-arrow {
        display: none;
    }
}

#modalRoleRemoval .profile-modal-dialog {
    max-width: 520px;
}

#modalRoleRemoval .profile-modal-header {
    text-align: center;
}

#modalRoleRemoval .profile-modal-footer {
    text-align: center;
    padding: 0px 0px 20px 0px;
}

#modalRoleRemoval .tooltip-inner {
    padding: 20px 8px;
}

#modalRoleRemoval .loader-container {
    min-height: 30px;
    min-width: 30px;
    width: 55%;
    margin-bottom: 10px;
}

#modalRoleRemoval .section {
    padding-bottom: 30px;
}

#modalRoleRemoval .section .connection-role strong {
    color: #737E85;
}

#modalRoleRemoval .section > strong {
    display: block;
    margin-bottom: 40px;
    text-align: left;
}

#modalRoleRemoval .section > img {
    margin: 0 20px 0 0;
    vertical-align: initial;
}

#modalRoleRemoval .remove-role-response-container,
#modalRoleRemoval .remove-assets-response-container {
    text-align: center;
}

#modalRoleRemoval .remove-role-response-container .section,
#modalRoleRemoval .remove-assetss-response-container .section {
    display: inline-block;
    margin-bottom: 0;
    width: 100%;
    padding-bottom: 0;
    border-bottom: 0 solid #e5e4e4;
}

#modalRoleRemoval .remove-assets-response-container strong,
#modalRoleRemoval .remove-role-response-container strong {
    font-weight: 500;
}

#modalRoleRemoval .remove-assets-response-container img, 
#modalRoleRemoval .remove-role-response-container img {
    width: 64px;
    height: 64px;
    margin: 0 24px 10px 24px;
}

#modalRoleRemoval .connection-info {
    margin-top: 10px;
    margin-left: 2px;
}

#modalRoleRemoval .connection-info .icon-info-sign {
    margin-left: 28px;
}

#modalRoleRemoval .connection-info strong {
    color: #7d888e;
    margin-left: 8px;
    font-size: 16px;
}

/*#modalRoleRemoval .connection-info {*/
/*    display: inline-block;*/
/*    margin-bottom: 20px;*/
/*    color: #26608d;*/
/*    border: 1px solid #ccc;*/
/*    padding: 10px;*/
/*    box-shadow: 0 3px 10px 0px rgba(0,0,0,.3);*/
/*    -webkit-box-shadow: 0 3px 10px 0px rgba(0,0,0,.1);*/
/*    max-width: calc(100% - 41px);*/
/*    vertical-align: middle;*/
/*    word-break: break-word;*/
/*}*/
#modalRoleRemoval .tag-blue {
    background: #26608d;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    font-weight: 700;
    font-size: 12px;
    align-self: flex-start;
    margin-right: 5px;
    vertical-align: text-bottom;
}

#modalRoleRemoval #assignees {
    width: 100%;
    /*margin: auto;*/
}

#modalRoleRemoval .connection-role {
    /*display: block;
    margin: 0 20%;*/
    background-color: #fff;
    /*border: 1px solid #ccc;*/
    border-bottom: 1px solid #ccc;
    padding: 10px;
    /*box-shadow: 0 3px 10px 0px rgba(0,0,0,.3);*/
    /*-webkit-box-shadow: 0 3px 10px 0px rgba(0,0,0,.1);*/
}

#modalRoleRemoval .connection-role:first-child {
    border-top: 1px solid #ccc;
    /*border-radius: 8px 8px 0 0;*/
}

#modalRoleRemoval .connection-role:last-child {
    /*!*border-radius: 0 0 8px 8px;*!*/
    /*border-bottom-width: 1px;*/
}

/*#modalRoleRemoval .connection-role .glyphicon {
    /*font-size: 25px;
    line-height: 40px;*/
/*margin-right: 10px;
vertical-align: top;
}*/
#modalRoleRemoval .connection-role img {
    width: 20px;
    margin-left: 10px;
}

#modalRoleRemoval .connection-role .details {
    display: inline-block;
    padding: 10px 10px 10px 20px;
    width: calc(100% - 66px);
    vertical-align: middle;
}

#modalRoleRemoval .connection-role .details > span {
    display: block;
    color: #3d5265;
    word-break: break-word;
}

#modalRoleRemoval .connection-role input[type=checkbox] {
    display: none;
}

#modalRoleRemoval .connection-role input + label {
    cursor: pointer;
    width: 20px;
    height: 20px;
    vertical-align: middle;
    margin: 0px;
    border: 1px solid #3d5265;
    border-radius: 4px;
    position: relative;
}

#modalRoleRemoval .connection-role input + label:after {
    opacity: 0;
    content: '';
    position: absolute;
    width: 15px;
    height: 8px;
    top: 3px;
    left: 2px;
    border: 3px solid #3d5265;
    border-top: none;
    border-right: none;
    transform: rotate(-50deg);
}

#modalRoleRemoval .connection-role input:checked + label:after {
    opacity: 1;
}

@media only screen and (max-width: 767px) {
    #modalRoleRemoval .section {
        text-align: left;
    }

    #modalRoleRemoval .section > strong {
        margin-bottom: 10px;
    }

    #modalRoleRemoval .section > img {
        margin: 0 5px;
        vertical-align: text-bottom;
    }

    #modalRoleRemoval .connection-info {
        border: none;
        box-shadow: none;
        -webkit-box-shadow: none;
        padding: 0;
        max-width: calc(100% - 31px);
        vertical-align: text-top;
    }

    #modalRoleRemoval #assignees {
        width: 100%;
        padding: 1px 16px;
        background-color: #ededed;
        border-radius: 4px;
    }

    #modalRoleRemoval .connection-role {
        border-radius: 4px;
        margin: 15px 0;
        box-shadow: none;
        -webkit-box-shadow: none;
    }

    #modalRoleRemoval .connection-role img {
        width: 14px;
        vertical-align: top;
    }

    #modalRoleRemoval .connection-role .details {
        border-left: 1px solid #ccc;
        width: calc(100% - 45px);
    }
}

/***** Payments *****/
/* Cards */
.cards-section .owl-carousel {
    margin: 0;
    list-style: none;
    padding: 30px 0 0;
    text-align: left;
}

.cards-section .owl-carousel .owl-stage {
    margin: 0px;
}

.cards-section .owl-item:after {
    content: none;
}

.cards-section .owl-nav {
    font-size: 30px;
}

.cards-section .owl-nav .owl-prev {
    left: -34px;
    top: -150px;
}

.cards-section .owl-nav .owl-next {
    right: -34px;
    top: -150px;
}

.cards-section .owl-nav .arrow-left {
    background: url(../images/left-arrow.png) center no-repeat;
    padding: 15px;
}

.cards-section .owl-nav .arrow-right {
    background: url(../images/right-arrow.png) center no-repeat;
    padding: 15px;
}

.cards-section .card {
    display: flex;
    align-items: center;
    margin-bottom: 60px;
    position: relative;
    width: 230px;
    height: 140px;
    background: #fff;
    border: 1px solid #fff;
    border-radius: 4px;
    box-shadow: 1px 4px 10px 2px rgba(159, 159, 159, 0.7);
}

.cards-section .card.active,
.cards-section .card:hover {
    border: 1px solid #3d5265;
}

.cards-section .card > .card-body {
    margin: 10px; /*15px;*/
    width: 100%;
}

.cards-section .card > .card-body a {
    text-decoration: none;
    color: #404040;
}

.cards-section .card .credit-card span {
    display: inline-block;
}

.cards-section .card .credit-card span:first-child {
    margin-bottom: 14px;
}

.cards-section .card .credit-card .card-number {
    font-size: 18px;
    color: #3d5265;
}

.cards-section .card .credit-card .card-expiration {
    font-size: 11px;
    margin-bottom: 8px;
}

.cards-section .card .credit-card .card-holder {
    font-weight: 600;
}

.cards-section .card .credit-card img {
    position: absolute;
    right: 15px;
    bottom: 17px;
}

.cards-section .card .paypal {
    word-break: break-all;
}

.cards-section .card .paypal .glyphicon {
    font-size: 11px;
    vertical-align: bottom;
    color: #26608d;
}

.cards-section .card .paypal img {
    margin: 17px auto;
}

.cards-section .card > a { /* delete link */
    position: absolute;
    bottom: -22px;
    right: 0px;
    color: #737e85;
    opacity: 0.8;
}

.cards-section .card .disabled-overlay {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    top: 0;
    background-color: rgba(244, 244, 244, 0.8);
    border-radius: 4px;
    z-index: 1;
    display: none;
}

.cards-section .card .disabled-overlay div {
    background: #737e85;
    border-radius: 4px;
    padding: 10px 30px;
    color: #fff;
    margin: auto;
}

.cards-section .card.disabled .disabled-overlay {
    display: flex;
}

.cards-section .card.disabled:hover {
    border: 1px solid #fff;
}

.cards-section .tooltip {
    max-width: 100%;
}

@media only screen and (max-width: 767px) {
    .add-action-icon.visible-xs {
        display: inline-block !important;
    }
}

/* Recurring Payments */
.payment-options {
    margin-bottom: 20px;
}

.payment-options .panel .panel-heading {
    color: #6d6e76;
}

.payment-options .panel-group > .panel {
    background: #f4f4f4;
}

.payment-options .panel > .panel-heading.panel-blue-white {
    padding: 15px;
    margin-top: 5px;
    border-radius: 4px;
    margin-bottom: 3px;
}

.payment-options .panel-heading .panel-icon {
    display: inline-block;
    width: 26px;
    text-align: center;
    vertical-align: bottom;
    height: 18px;
    padding: 0px;
}

.payment-options .panel-icon.icon-activity-white {
    background: url(../images/icon-activity-white.png) center no-repeat;
}

.payment-options .panel-heading .panel-main-title {
    font-size: 15px;
    font-weight: 600;
    margin-left: 10px;
    display: inline-block;
    padding: 0px;
}

.payment-options .panel > .panel-heading.panel-white-blue {
    padding: 10px 15px 15px;
    box-shadow: 0px 2px 14px -1px rgba(159, 159, 159, 0.7);
    margin-bottom: 4px;
}

.payment-options .panel > .panel-heading.panel-white-blue h4.panel-title {
    display: inline-block;
}

.payment-options .panel > .panel-heading.panel-white-blue .panel-main-title {
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 10px;
    margin-left: 2px;
    color: #3d5265;
}

.payment-options .panel .panel-empty-desc {
    padding: 13px 0;
    font-weight: 600;
}

.payment-options .panel .panel-account-details {
    display: inline;
    margin-top: 4px;
    font-size: 12px;
    color: #737e85;
    background: #eef2f4;
    padding: 5px 2px;
    border-radius: 4px;
}

.payment-options .panel .panel-info {
    margin-top: 10px;
}

.payment-options .panel .panel-info-details {
    display: inline-block;
}

.payment-options .panel .panel-actions {
    margin: 0;
    float: right;
    color: #737e85;
}

.payment-options .panel .panel-actions a {
    display: inline-block;
    margin-top: 1px;
}

.payment-options .panel .panel-actions a .glyphicon {
    margin-right: 0px;
    color: #bababa;
    font-size: 13px;
}

.payment-options .panel .panel-actions a:hover .glyphicon {
    color: #3d5265;
}

.payment-options .panel .cosmotetv-title {
    margin-top: 16px;
}

.payment-options .panel .cosmotetv-title > span:not(.glyphicon) {
    color: #26608d;
}

@media (max-width: 991px) {
    .payment-options .panel > .panel-heading.panel-blue-white {
        padding: 10px;
    }

    .payment-options .panel > .panel-heading.panel-white-blue {
        padding: 15px 10px;
    }
}

/* Recurring Modal */
#modalRecurringPaymentEdit {
    overflow: auto;
}

#modalRecurringPaymentEdit .profile-modal-dialog {
    max-width: 500px;
}

.profile-modal-section {
    color: #3d5265;
    padding-bottom: 30px;
    text-align: center;
}

.profile-modal-section:first-child {
    margin-top: 15px;
}

.profile-modal-section:last-child {
    border-bottom: 1px solid #e5e4e4;
}

.profile-modal-section .section-title {
    background: #f7f7f7;
    font-weight: 600;
    padding: 5px 10px;
    margin-bottom: 25px;
}

.profile-modal-separator {
    width: 70%;
    text-align: center;
    border-bottom: 1px solid #000;
    line-height: 0.1em;
    margin: 30px auto 20px;
}

.profile-modal-separator span {
    background: #fff;
    padding: 0 40px;
}

.profile-modal-section .btn-outline {
    display: inline-block;
    margin-bottom: 10px;
}

.profile-modal-section .selected {
    background: #3d5265;
    color: #fff;
    padding: 10px 20px;
    border-radius: 4px;
    margin: 0 !important;
    font-size: 16px;
}

.profile-modal-section ul.modal-selection {
    list-style: none;
    margin: 0;
    padding: 0;
    text-align: center;
}

.profile-modal-section ul.modal-selection li {
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
    margin: 10px 15px;
    vertical-align: top;
    cursor: pointer;
}

.profile-modal-section ul.modal-selection li span {
    display: block;
    font-size: 9px;
}

.recurring-selection-container > span {
    font-weight: 600;
}

.recurring-selection-container .select2-container .select2-selection {
    background-color: #3d5265;
    padding: 10px 15px;
    border-radius: 4px !important;
    border: none;
    height: 100%;
    outline: none;
}

.recurring-selection-container .select2-container .select2-selection__rendered {
    color: #fff;
    line-height: inherit;
    padding: 0px;
    margin-right: 12px;
    width: 20px;
}

.recurring-selection-container .select2-container .select2-selection__arrow {
    height: 0;
    width: 0;
    top: 50%;
    right: 15px;
}

.recurring-selection-container .select2-container .select2-selection__arrow b {
    border-color: #fff transparent transparent transparent;
    border-width: 5px 5px 0 5px;
}

.recurring-selection-container .select2-container.select2-container--open .select2-selection__arrow b {
    border-color: transparent transparent #fff transparent;
    border-width: 0 5px 5px 5px;
}

.recurring-dropdown.select2-dropdown {
    background-color: #ededed;
    margin-top: 5px;
    border: none;
    border-radius: 4px;
}

.recurring-dropdown .select2-results {
    padding: 5px;
}

.recurring-dropdown .select2-results > .select2-results__options {
    max-height: 100px;
}

.recurring-dropdown .select2-results__option {
    text-align: center;
    padding: 2px;
}

.recurring-dropdown .select2-results__option[aria-selected=true] {
    background-color: #ededed;
    color: inherit;
}

.recurring-dropdown .select2-results__option--highlighted[aria-selected] {
    background-color: #3d5265;
    color: #fff;
}

.recurring-dropdown .select2-results__options::-webkit-scrollbar {
    width: 5px;
}

.recurring-dropdown .select2-results__options::-webkit-scrollbar-track {
    border-radius: 10px;
}

.recurring-dropdown .select2-results__options::-webkit-scrollbar-thumb {
    background: #737e85;
    border-radius: 10px;
}

/******************* SECURITY MANAGEMENT TAB ***********************/
.tabset {
    padding-left: 30px;
    padding-right: 30px;
    font-family: PeridotPE-Regular;
}

.tabset > input[type="radio"] {
    position: absolute;
    display: none;
}

.tabset .tab-panel {
    display: none;
    font-family: PeridotPE-Regular;
}

.tabset > input:first-child:checked ~ .tab-panels > .tab-panel:first-child,
.tabset > input:nth-child(3):checked ~ .tab-panels > .tab-panel:nth-child(2),
.tabset > input:nth-child(5):checked ~ .tab-panels > .tab-panel:nth-child(3),
.tabset > input:nth-child(7):checked ~ .tab-panels > .tab-panel:nth-child(4),
.tabset > input:nth-child(9):checked ~ .tab-panels > .tab-panel:nth-child(5),
.tabset > input:nth-child(11):checked ~ .tab-panels > .tab-panel:nth-child(6) {
    display: block;
    font-family: PeridotPE-Regular;
}

.tabset > label {
    position: relative;
    display: inline-block;
    border-radius: 12px;
    margin: 25px 0px 25px 0px;
    height: 4px;
    /*width: 20px;*/
    opacity: 1;
    border-bottom: 0;
    cursor: pointer;
    font-weight: 600;
    font-family: PeridotPE-Regular;
}

.tabset > label::after {
    content: "";
    position: absolute;
    left: -13px;
    right: auto;
    bottom: 17px;
    width: 101px;
    top: 25px;
    height: 4px;
    border-radius: 12px;
    opacity: 1;
    font-family: PeridotPE-Regular;
}

.tabset > label:hover,
.tabset > input:focus + label {
    color: #3D5265;
}

.tabset > label:hover::after,
.tabset > input:focus + label::after,
.tabset > input:checked + label::after {
    background: #3D5265 0% 0% no-repeat padding-box;
    font-family: PeridotPE-Regular;
}

.tab-panel {
    border-top: 1px solid #ebebeb;
    font-family: PeridotPE-Regular;
}

#label-app {
    margin-left: 65px;
}

#label-web {
    margin-left: 81px;
}

.tabset a {
    color: #9BA0A3;
    top: 4px;
    position: relative;
    font-family: PeridotPE-Regular;
}

.tabset a.active {
    color: #3D5265;
    top: 4px;
    position: relative;
    font-family: PeridotPE-Regular ;
}

.tabset a:hover, .tabset a:target {
    color: #3D5265;
    font-family: PeridotPE-Regular;
}

#rlcs tr {
    height: 66px !important;
}

#security-rlc-desc, #user-data-subheader {
    text-align: left;
    font: italic normal normal 12px/14px PeridotPE-Regular;
    letter-spacing: 0px;
    color: #9BA0A3;
}

#yolos tr {
    height: 60px !important;
}

#tables-padding-yolos {
    padding: 0px 0px 0px 0px !important;
}

#tables-padding-rlcs {
    padding: 0px 30px 0px 30px !important;
}

.security-info {
    text-align: left;
    color: #3d5265;
}

.security-info-desc {
    font: normal normal bold 12px/16px PeridotPE-Regular;
    letter-spacing: 0px;
    color: #9BA0A3;
    opacity: 1;
    text-align: left;
    padding-bottom: 10px;
}

.rlc-table-mobiles {
    text-align: left;
    font: Bold 16px/24px PeridotPE-Regular;
    letter-spacing: 0px;
    color: #000000DE !important;
    font-size: 16px !important;
    opacity: 0.69;
    padding-left: 0px !important;
}

.rlc-table-dates {
    text-align: center !important;
    font: 12px/16px PeridotPE-Regular !important;
    letter-spacing: 0px;
    color: #302D2D8A !important;
    opacity: 1;
    padding: 0px;
}

.yolo-table-description {
    text-align: left;
    font: normal normal bold 12px/14px PeridotPE-Regular !important;
    letter-spacing: 0px;
    color: #3D5265;
    opacity: 1;
    padding: 10px 0px 10px 60px;
}

.yolo-table-description-websites {
    text-align: left;
    font: normal normal bold 12px/14px PeridotPE-Regular !important;
    letter-spacing: 0px;
    color: #3D5265;
    opacity: 1;
    padding: 7px 0px 10px 80px;
}

.sites-and-apps {
    text-align: left;
    font: Bold 14px/20px PeridotPE-Regular;
    letter-spacing: 0px;
    color: #3D5265;
    opacity: 1;
    padding: 15px;
}

.security-info-not-found {
    text-align: center;
    font: Bold 14px/20px PeridotPE-Regular;
    letter-spacing: 0px;
    color: #3D5265;
    opacity: 1;
    padding: 20px;

}

.channel-icon {
    min-height: 35px;
    max-height: 35px;
    min-width: 35px;
    max-width: 45px;
    float: left;
    margin: 0px -30px 0px 0px;
}

.channel-icon-websites {
    min-height: 28px;
    max-height: 35px;
    min-width: 35px;
    max-width: 70px;
    float: left;
    margin: 0px -30px 0px 0px;
}


.info-icon-blue {
    padding-right: 0rem;
    background: #3D5265 0% 0% no-repeat padding-box;
    /*box-shadow: 1px 2px 2px #00000029;*/
    border-radius: 12px;
    margin: 0px 5px 0px 0px;
    height: 18px;
    width: 18px;

}

.rlc-info-modal-desc {
    color: grey;
    font-style: italic;
    font-size: 12px;
    text-align: center;
    padding: 10px;
    display: block;
}

.btn.security {
    background: transparent;
    text-align: right !important;
    font: 12px/14px PeridotPE-Regular;
    letter-spacing: 0px;
    color: #3D5265;
    opacity: 1;
    float: right !important;
}

.btn:focus {
    text-decoration: none !important;
    outline: 5px transparent !important;
    outline-offset: -2px !important;
}

.btn:active {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.btn.security-cancel {
    line-height: 40px !important;
    border-radius: 0 !important;
    border: 1px solid !important;
    font-weight: 600;
    color: #fff;
    padding: 0 2em !important;
    height: 42px;
    font-size: 1.1em !important;
    background: -webkit-linear-gradient(right, #dee2e6, #00000052) !important;
    background: -o-linear-gradient(right, #dee2e6, #00000052) !important;
    background: -moz-linear-gradient(right, #dee2e6, #00000052) !important;
    background: linear-gradient(to right, #dee2e6, #00000052) !important;

}

.btn.security-cancel:hover {
    text-decoration: none;
    color: #fff;
}

.btn.security-cancel:focus {
    outline: 0;
    box-shadow: #FFFFFF;
    color: #fff;
}

#showAll {
    right: -136px;
    position: relative;
}

.underlined {
    text-decoration: underline;
}

.profile-icon,
.addresses-icon,
.services-icon,
.payment-icon,
.security-icon {
    margin: 10px 10px 10px 10px;
    height: 26px;
    width: 26px;
}

.profile-text,
.addresses-text,
.services-text,
.payment-text,
.security-text {
    line-height: 4.2em;
    margin: 0px 10px 0px 10px;
    position: inherit;
    font-weight: bold;
}

.dropdown-decouple-text {
    font: 10px/14px PeridotPE-Regular;
    letter-spacing: 0px;
    color: #FFFFFF !important;
    cursor: pointer;
    transform: rotate(180deg);
    width: -moz-available; /* WebKit-based browsers will ignore this. */
    width: -webkit-fill-available; /* Mozilla-based browsers will ignore this. */
    width: fill-available;
    position: absolute;
    text-align: center;
    padding: 1px;
    letter-spacing: 0px;
    opacity: 1;

}

.dropdown-menu.dropdown-decouple {
    position: absolute;
    top: -100%;
    left: auto;
    right: -16px;
    width: 245px;
    height: 71px;
    z-index: 1000;
    text-align: left;
    display: none;
    vertical-align: middle;
    font-size: 7px;
    list-style: none;
    -webkit-background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, .15);
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    background: #3D5265 0% 0% no-repeat padding-box;
    border-radius: 5px;
    opacity: 1;
    overflow: inherit;
    cursor: pointer;
    transform: rotate(180deg);
}

.dropdown-menu.dropdown-decouple:after {
    position: absolute;
    top: -10px;
    color: initial;
    right: 185px;
    display: inline-block;
    border-right: 13px solid transparent;
    border-bottom: 13px solid #3d5265;
    border-left: 13px solid transparent;
    content: '';
}

.security-card-content {
    background: none;
    /*box-shadow: 0px 3px 8px #3E649229;*/
    border-radius: 5px !important;
    opacity: 1;
    padding: 0;
    margin-bottom: 25px;
}

.rlc-info {
    float: left;
    opacity: 1;
    padding-right: 1rem;
    padding-left: 0rem;
    margin-left: 1rem;
    padding-bottom: 10px;
    padding-top: 10px;

}

#security-labels {
    margin: 0px !important;
    padding: 0px 0px 8px 0px !important;
    padding-left: 0px !important;
    border-bottom: 1px solid #ebebeb !important;
    display: block !important;
    position: relative !important;
}

.profile-modal-dialog.yolo-modal-devices {
    vertical-align: middle !important;
    margin-top: 0px;
    border-radius: 5px;
    position: static;
    margin-bottom: 75px;
    max-width: 620px !important;
    max-height: 398px !important;
}

.profile-modal-body.yolo-modal-devices {
    background: white;
    padding: 0px 0 0 !important;
    overflow-y: scroll;
    display: inline-block !important;
    width: 100%;
    width: -moz-available; /* WebKit-based browsers will ignore this. */
    width: -webkit-fill-available; /* Mozilla-based browsers will ignore this. */
    width: fill-available;
    max-height: 70%;
    vertical-align: middle !important;
    position: static;
    max-width: 620px !important;
    max-height: 335px !important;
}

.profile-modal button.close {
    top: -25px;
    right: -15px;
}

#yolo-revoke-warn {
    font: normal normal normal 12px/16px PeridotPE-Regular !important;
    margin: 0px 68px 15px 68px !important;
    padding: 10px;
    text-align: center !important;
    letter-spacing: 0;
    color: #3D5265;
    opacity: 1;
}

.yolo-revoke-web-p1, .yolo-revoke-web-p2 {
    text-align: left;
    font: normal normal normal 12px/14px PeridotPE-Regular !important;
    letter-spacing: 0px;
    color: #3D5265;
    opacity: 1;
}

.yolo-revoke-web-p1 {
    padding: 20px 30px 192px 30px;
    font-family: PeridotPE-Regular;
}

.yolo-revoke-web-p2 {
    padding: 25px 20px 139px 30px;
}

#yolo-delete-message {
    margin: 15px 65px 0px 65px !important;
    font: normal normal normal 14px/20px PeridotPE-Regular !important;
    padding: 10px;
    text-align: center;

}

.modal-accept {
    height: 250px !important;
    max-width: 452px !important;
}

#rlc-delete-message {
    text-align: center !important;
    padding: 10px;
}

#rlc-info-icon {
    background: transparent;
    padding-right: 0rem;
    float: right;
}

#yolos.table-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

#rlcs.table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

#yolos.table-responsive > .table-bordered {
    border: 0;
}

#rlcs.table-responsive > .table-bordered {
    border: 0;
}

.cosmoteid-related-info-rlc {
    text-align: left;
    font: 13px/18px PeridotPE-Regular;
    letter-spacing: 0px;
    color: #3D5265;
    opacity: 1;
}

#rlcs p {
    margin-bottom: 0px !important;
}

#yolos p {
    margin-bottom: 0px !important;
}

#showMoreWebYolos, #showMoreAppYolos {
    text-align: left;
    text-decoration: underline;
    font: normal normal normal 12px/16px PeridotPE-Regular !important;
    letter-spacing: 0px;
    color: #B1B1B1;
    opacity: 1;
    float: none;
    background-color: transparent;
}

/*.table > tbody + tbody {*/
/*    border-top: 1px solid #ebebeb !important;*/
/*}*/

/*.table > thead > tr > th {*/
/*    vertical-align: bottom!important;*/
/*    border-bottom: 1px solid #ddd!important;*/
/*}*/

#yolos.table > thead > tr > th, #yolos.table > tbody, #yolos.table > tbody + tbody {
    border-bottom: none !important;
    border-top: none !important;
}

#rlcs.table > thead > tr > th, #rlcs.table > tbody, #rlcs.table > tbody + tbody {
    border-bottom: none !important;
}

#yolos.table > thead tr td:first-child, #yolos.table > tbody tr td:first-child, #yolos.table > tfoot tr td:first-child, #rlcs.table > thead tr td:first-child, #rlcs.table > tbody tr td:first-child, #rlcs.table > tfoot tr td:first-child {
    border-bottom: none !important;
    border-top: none !important;
    padding-left: 15px;
    /*padding-top: 5px;*/
}

#rlcs.table > tbody > tr > td, #rlcs.table > tbody > tr > th, #rlcs.table > tfoot > tr > td, #rlcs.table > tfoot > tr > th, #rlcs.table > thead > tr > td, #rlcs.table > thead > tr > th {
    line-height: 1.42857143;
    vertical-align: middle !important;
    border-top: 1px solid transparent;

}

#yolos.table > tbody > tr > td, #yolos.table > tbody > tr > th, #yolos.table > tfoot > tr > td, #yolos.table > tfoot > tr > th, #yolos.table > thead > tr > td, #yolos.table > thead > tr > th {
    /*padding: 0px;*/
    line-height: 1.42857143;
    vertical-align: middle !important;
    border-top: none !important;
    border-bottom: none !important;
}

/******************* Profile Security  Width Props  ***********************/

@media (max-width: 902px) and (min-width: 481px) {
    .channel-icon {
        text-align: center;
        font: 10px/14px PeridotPE-Regular;
        letter-spacing: 0px;
        color: #0000008A;
        opacity: 1;
        height: 40px;
        max-width: 45px;
        float: left;
    }
}

@media (max-width: 767px) {


    .security-text {
        margin: 0px 10px 0px 0px !important;
    }
}

@media (max-width: 992px) and (min-width: 768px) {
    #yolos {
        /* display: block !important;*/
        overflow-x: auto;
    }

    #tables-padding {
        padding: 0px 20px 0px 20px !important;
    }

    #yolos.table > thead tr td:first-child, #yolos.table > tbody tr td:first-child, #yolos.table > tfoot tr td:first-child {
        padding-left: 15px !important;
        padding-right: 0px !important;
        /*padding-top: 5px!important;*/
    }


}

@media (max-width: 767px) and (min-width: 200px) {

    .col-lg-10, .col-lg-12, .col-md-12, .col-sm-12, .col-xs-12 {
        position: relative;
        min-height: 1px;
        padding-right: 0px !important;
        padding-left: 0px !important;
        font-family: PeridotPE-Regular;
    }

    .security-desc {
        margin-top: 15px;
        padding: 2px 0px 2px 2px;
    }

    #security-rlc-info {
        display: block !important;
        cursor: pointer;
        padding-top: 15px;
        padding-bottom: 15px;
        position: sticky;
    }

    .tooltip.scale.fade.in {
        top: -170px;
        left: -173px;
        display: block;
        width: 220px;
    }

    #security-rlc-desc {
        display: none !important;
    }

    #tbodyYolosModal p {
        font-size: 10px !important;
    }

    #tables-padding {
        padding: 0px 0px 0px 0px !important;
    }

}

@media (max-width: 1370px) and (min-width: 480.98px) {
    #rlcs {
        display: inline-table !important;
    }
}

@media (min-width: 397px) and (max-width: 480.98px) {
    #yolos.table-responsive-sm {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    #rlcs.table-responsive-sm {
        /*display: block;*/
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    #yolos.table-responsive-sm > .table-bordered {
        border: 0;
    }

    #rlcs.table-responsive-sm > .table-bordered {
        border: 0;
    }
}

@media (min-width: 200px) and (max-width: 397px) {
    #yolos.table-responsive-xs {
        /*display: block;*/
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    #rlcs.table-responsive-xs {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

}

@media (max-width: 480px) and (min-width: 200px) {
    .channel-icon {
        text-align: center;
        font: 10px/14px PeridotPE-Regular;
        letter-spacing: 0px;
        color: #0000008A;
        opacity: 1;
        height: 30px;
        max-width: 45px;
        margin: 0px 6px 0px 0px !important;
        float: left;

    }

    #showMoreRlcs, #showMoreYolos {
        font-size: 12px !important;
    }

    #rlc-info-icon {
        padding-right: 0rem !important;
    }

    .rlc-table-mobiles {
        text-align: left !important;
        font: Bold 12px/24px PeridotPE-Regular;
        font-size: 16px !important;
    }

    .rlc-table-dates {
        text-align: center !important;
        font: 11px/16px PeridotPE-Regular !important;
        font-size: 12px !important;
        /*width: 12rem;*/
    }

    .sites-and-apps {
        font: Bold 14px/16px PeridotPE-Regular;
    }

    .yolo-table-sites-devices {
        text-align: left;
        font: 11px/16px PeridotPE-Regular !important;

    }

    .yolo-table-date-platform {
        text-align: left;
        font: 10px/16px PeridotPE-Regular !important;

    }

    .channel-icon {
        height: 28px;
        width: 45px;
        min-width: 45px;
        max-width: 45px;
    }

    .btn.security {
        font: 11px/16px PeridotPE-Regular;
    }

    #rlcs.table > thead tr td:first-child, #rlcs.table > tbody tr td:first-child, #rlcs.table > tfoot tr td:first-child {
        padding-left: 5px !important;
        padding-top: 5px !important;
    }

    #yolos.table > thead tr td:first-child, #yolos.table > tbody tr td:first-child, #yolos.table > tfoot tr td:first-child {
        padding-left: 0px !important;
        /*padding-top: 5px!important;*/
    }

}

#download-data-content {
    margin-top: 17px !important;
    border-bottom: 1px solid transparent!important;
}

.cookies-profile {
    display: flex;
    background: #f4f4f4;
    position: relative;
    bottom: 20px;
    width: 500px;
    left: 15%;
    right: auto;
    font-family: PeridotPE-Regular;
}

#verifyPasswordLabel {
    font: normal normal normal 14px/16px PeridotPE-Regular;
    letter-spacing: 0.28px;
    color: #3D5265!important;
}

.delete_user_div {
    margin-bottom: 5px;
    margin-top: 30px;
    display: inline-block;
    position: relative;
}

.user-data-headers {
    text-align: left;
    font: normal normal bold 12px/16px PeridotPE-Regular !important;
    letter-spacing: 0px;
    margin-bottom: 7px !important;
    color: #3D5265!important;
    opacity: 1;
}

.user-data-desc {
    text-align: left;
    font: normal normal normal 12px/16px PeridotPE-Regular !important;
    letter-spacing: 0px;
    margin-bottom: 10px !important;
    color: #3D5265!important;
    opacity: 1;
}

#delete-user-failure {
    font: normal normal normal 14px/20px PeridotPE-Regular;
    letter-spacing: 0.28px;
    color: #3D5265!important;
}

#delete-user-warn {
    font-weight: bold;
    letter-spacing: 0.28px;
    color: #3D5265!important;
    padding: 15px 10px 15px 0px;

}

#delete-user-warn-desc {
    font: normal normal normal 14px/16px PeridotPE-Regular;
    letter-spacing: 0.28px;
    color: #3D5265!important;
    margin-bottom: 10px;

}

#delete-user-success-svg {
    background-image: url('../images/security-icons/Group 50.svg');
    background-repeat: no-repeat;
    background-position:center;
    width: auto;
    height: 90px;
}

#delete-user-success {
    font: normal normal bold 14px/16px PeridotPE-Regular!important;
    letter-spacing: 0.28px;
    color: #3D5265!important;
    padding:15px!important;
}

#delete-user-password-validation {
    font: normal normal normal 14px/18px PeridotPE-Regular;
    letter-spacing: 0.28px;
    color: #3D5265!important;
    padding: 20px 0px;
}

#servicesList {
    font: normal normal normal 14px/22px PeridotPE-Regular;
    margin: 0px 30px 0px 30px!important;
    letter-spacing: 0.28px;
    color: #3D5265!important;
}

#servicesList li {
    margin: 0px 90px 0px 50px!important;
}

#servicesList li::marker {
    font-size:1.7em!important;
}

/******************* Security Wait loader ***********************/

@keyframes scale {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
    }
}

.scale {
    animation: scale 200ms cubic-bezier(0, 0, 0.2, 1);
}


@-webkit-keyframes uil-ripple {
    0% {
        width: 0;
        height: 0;
        opacity: 0;
        margin: 0
    }

    33% {
        width: 44%;
        height: 44%;
        margin: -22% 0 0 -22%;
        opacity: 1
    }

    to {
        width: 88%;
        height: 88%;
        margin: -44% 0 0 -44%;
        opacity: 0
    }
}

@keyframes uil-ripple {
    0% {
        width: 0;
        height: 0;
        opacity: 0;
        margin: 0
    }

    33% {
        width: 44%;
        height: 44%;
        margin: -22% 0 0 -22%;
        opacity: 1
    }

    to {
        width: 88%;
        height: 88%;
        margin: -44% 0 0 -44%;
        opacity: 0
    }
}

.uil-ripple-css-box-center {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 320px;
    height: 270px;
    z-index: 999
}

.uil-ripple-css-box-center p {
    color: #fff;
    font-size: 15px;
    text-align: center;
    font-family: sans-serif;
    width: 100%;
    position: absolute;
    left: 0;
    top: 50px
}

.uil-ripple-css-box-center .uil-ripple-css {
    background: 0 0;
    width: 300px;
    height: 300px;
    margin: auto
}

.uil-ripple-css-box-center .uil-ripple-css div {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: 0;
    width: 0;
    height: 2;
    opacity: 0;
    border-radius: 50%;
    border-width: 8px;
    border-style: solid;
    -webkit-animation: uil-ripple 2s ease-out infinite;
    animation: uil-ripple 2s ease-out infinite
}

.uil-ripple-css-box-center .uil-ripple-css div:nth-of-type(1) {
    border-color: #97d700
}

.uil-ripple-css-box-center .uil-ripple-css div:nth-of-type(2) {
    border-color: #007aa9;
    -webkit-animation-delay: 1s;
    animation-delay: 1s
}

.uil-ripple-css-overlay {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    background-color: rgba(0, 0, 0, .7);
    z-index: 999
}

/* Popup box BEGIN */
.hover_bkgr_fricc {
    background: rgba(244, 244, 244, 1.0);
    /*cursor:pointer;*/
    display: none;
    height: 100%;
    position: fixed;
    text-align: center;
    /*top:0;*/
    width: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    word-wrap: break-word;
    z-index: 1000; /* so that the div stays on top of others */
    top: 0px; /* distance from the top */
    left: 0px;
    /*height: 400px; /*set as neccessary
    width: 400px;  /*set as neccessary */

    /* To center the box */
    margin-left: auto;
    margin-right: auto;
}

.popup_first_line {
    width: 100%;
    height: 100px;
    position: fixed;
    z-index: 1;
}

.hover_bkgr_fricc .helper {
    /*display:inline-block;
    height:100%;
    vertical-align:middle;
    overflow: auto;
    overflow-x:hidden;
    word-wrap: break-word;
    overflow-y:scroll;
    -webkit-overflow-scrolling: touch;
    word-wrap: break-word*/

    display: inline-block;
    width: 110px;
    height: 110px;
    vertical-align: middle;
    overflow: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    word-wrap: break-word;

}

.hover_bkgr_fricc > div {
    background-color: #fff;
    box-shadow: 0px 2px 10px 0px rgba(159, 159, 159, 0.6);
    display: inline-block;
    height: auto;
    max-width: 551px;
    min-height: 100px;
    max-height: 80%;
    vertical-align: middle;
    width: 60%;
    position: relative;
    border-radius: 8px;
    padding: 15px 5%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    word-wrap: break-word;
    margin: 5%;
}


.popup_header_fricc {
    position: fixed;
    float: left;
    overflow: hidden;
    background-color: white;
    z-index: 1;
    /*width: 40%;
    height: 5%;*/
    top: 5.9%;
    border-bottom: 1px solid grey;
    width: 90%;
    height: 20px;
}

.popup_body_fricc {
    float: left;
    /*overflow: scroll;*/
    /*position: fixed;*/
    top: 10%;
    /*height: 100%;*/
    /* background-color: #fff; */
    /* box-shadow: 10px 10px 60px #555; */
    display: inline-block;
    height: auto;
    max-width: 551px;
    min-height: 100px;
    max-height: 80%;
    vertical-align: middle;
    /*width: 60%;*/
    /*position: relative;*/
    border-radius: 8px;
    padding: 15px 5%;
    /*overflow: auto;*/
    -webkit-overflow-scrolling: touch;
    word-wrap: break-word;
    margin-top: 5%;
    position: relative;
    padding-top: 50px;
    overflow-y: auto;
}

/* Popup box end */

/*test */
.terms_container {
    width: 50%;
    height: 80%;
    transform: translate(1%, 1%);
    background-color: #fff;
    box-shadow: 0px 2px 10px 0px rgba(159, 159, 159, 0.6);
    display: inline-block;
    vertical-align: middle;
    border-radius: 5px;
    padding: 0px 2.5%;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    word-wrap: break-word;
    margin: 5%;
    text-align: justify;

}

.title {
    margin-top: 2%;
    width: 100%;
    height: 100px;
    position: fixed;
    z-index: 1;

}

.title_one {
    width: 85%;
    height: 50px;
    float: left;
    background-color: white;
    z-index: 1;
    /*border-bottom: 1px solid grey;*/
    text-align: center;
    vertical-align: middle;
    padding-top: 15px;
    font-size: 15px;
    font-weight: bold;
}

.title_one:after {
    content: "";
    display: block;
    margin: 0 auto;
    width: 50%;
    padding-top: 20px;
    border-bottom: 2px solid grey;
}

.title_two {
    width: 10%;
    height: 50px;
    background-color: white;
    cursor: pointer;
    font-family: PeridotPE-Regular;
    font-weight: bold;
    font-size: 20px;
    line-height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/*.title_two:hover {
    background-color: #ccc;
}*/
.terms_container_body {
    position: relative;
    background-color: white;
    /*padding-top: 50px;*/
    overflow-y: auto;
    height: 76%;
    margin-top: 18%;
}

.terms_container_body::-webkit-scrollbar {
    width: 1.5em;
    height: 0;
}

.terms_container_body::-webkit-scrollbar-thumb {
    height: 1em;
    border: 0.5em solid rgba(0, 0, 0, 0);
    background-clip: padding-box;
    -webkit-border-radius: 1em;
    background-color: #cecece;
    -webkit-box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.025);
}

.terms_container_footer {
    background-color: purple;
}

.trigger_popup_access_commit,
.trigger_popup_terms_container {
    cursor: pointer;
    display: inline-block;
    font-family: PeridotPE-Regular;
}

.hover_bkgr_terms_container_prof {
    background: rgba(61, 82, 101, 0.42);
    /*cursor:pointer;*/
    display: none;
    height: 100%;
    position: fixed;
    text-align: center;
    top: 0px;
    left: 0px;
    width: 100%;
    z-index: 10000;
}

.hover_bkgr_personaldata_container_prof {
    background: rgba(61, 82, 101, 0.42);
    /*cursor:pointer;*/
    display: none;
    height: 100%;
    position: fixed;
    text-align: center;
    top: 0px;
    left: 0px;
    width: 100%;
    z-index: 10000;
}

.trigger_popup_personaldata_container {
    cursor: pointer;
    display: inline-block;
    font-family: PeridotPE-Regular;
}

.personaldata_container {
    width: 60%;
    height: 80%;
    transform: translate(1%, 1%);
    background-color: #fff;
    box-shadow: 0px 2px 10px 0px rgba(159, 159, 159, 0.6);
    display: inline-block;
    vertical-align: middle;
    border-radius: 5px;
    padding: 0px 2.5%;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    word-wrap: break-word;
    margin: 5%;
    text-align: justify;
}

.required_label_asterisk{
    color: red;
    margin-left: 4px;
}