@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i');
/* use the font */
html {
    position: relative;
    min-height: 100%;
}

/*user avatar buttons ends here*/
body {
  font-family: 'Roboto ', sans-serif !important;
  font-size: 18px;
  color:#4b4b4b;
  font-family: Roboto !important;
  font-weight: 100;
  font-style: normal;
  font-weight:300;
  /*background:#f3f3f3 !important;*/
  line-height:30px !important;
   background: #e9e9e9 !important;
	margin-bottom: 295px;
}
button{
    font-family: 'Roboto ', sans-serif !important;
}
.custom-ss-staff-table-row td:first-child{
    font-size: 14px;
    width: 169px;
}
.custom-ss-border-error{
   border:1px solid #ff7c7c!important;
}
.custom-ss-reg-log-model .modal-dialog .modal-content {
    height: auto !important;
    overflow: hidden;
}
.custom-ss-reg-log-model .modal-dialog .modal-content .modal-header {
    background: #0f6ac1;
}
.custom-ss-reg-log-model .modal-dialog .modal-content .modal-header img {
    width: 170px;
}
.custom-ss-reg-log-model .modal-dialog .custom-ss-register-form-section, .custom-ss-reg-log-model .modal-dialog .custom-ss-login-form-section, .custom-ss-reg-log-model .modal-dialog .custom-ss-reset-password-form-section {
    padding: 15px;
}
.custom-ss-reg-log-model .modal-dialog {
    width: 370px;
    padding: 10px;
}
.custom-ss-service-job-btn-complete{
    margin-right: 54px;
}
.custom-ss-service-adcomment-btn {
  border-radius: 25px;
  background-color: #5cb85c;
  border: none;
  color: #FFFFFF;
  text-align: center;
  font-size: 14px!important;
  width: 98px;
  transition: all 0.5s;
  cursor: pointer;
  outline: none;
  margin: 0 0 10px 0;
  font-weight: 400;
}
i.custom-ss-com-icon.fa {
    margin-left: 15px;
}
.custom-ss-service-adcomment-btn span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
  color:#fff;
}

.custom-ss-service-adcomment-btn span:after {
  content: '\00bb';
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 0.5s;
}
.custom-ss-service-adcomment-btn:hover{
    background: #0e68c0;
}
.custom-ss-service-adcomment-btn:hover span {
  padding-right: 25px;
}
.custom-ss-service-adcomment-btn:focus{
    box-shadow: none;
    -webkit-box-shadow: none;
    border: 0!important;
}
.custom-ss-service-adcomment-btn:hover span:after {
  opacity: 1;
  right: 0;
}
.tip {
  width: 0px;
  height: 0px;
  position: absolute;
  background: transparent;
  border: 10px solid #ccc;
}
.tip-left {
  top: 14px;
  left: -5px;
  border-top-color: transparent;
  border-left-color: transparent;
  border-bottom-color: transparent;  
}
.custom-ss-service-job-btn {
	border: none;
	color: #f2f2f2;
	padding: 5px 10px;
	font-size: 14px!important;
	border-radius: 5px;
	position: relative;
	box-sizing: border-box;
	transition: all 500ms ease;
    border-radius: 25px;
}
.custom-ss-service-job-btn:hover {
	background: rgba(0,0,0,0);
	color: #5bc0de;
	box-shadow: inset 0 0 0 3px #5bc0de;
}
.custom-ss-table-servie-comment {
    overflow-y: auto;
    max-height: 200px;
    display: block;
    width: 100%;
}
.ui-dialog{
    top:100px!important;
}
.custom-ss-select-btn-auto{
    -moz-appearance: none;
    -webkit-appearance:none;
    font-size: 16px;  
    font-weight: normal;
    text-overflow: ellipsis;
    white-space: normal;
}
.custom-ss-select-btn-auto:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #fff;
}
.custom-ss-select-label-auto{
    overflow: hidden;   
    width: auto;
    position: relative;
}
.custom-ss-select-label-auto:after{
    content:"\f107";
    font-family: FontAwesome;
    padding: 10px 0;
    position: absolute;
    right: 0; 
    top: 0;
    width: 10%;
    height: auto; 
    pointer-events: none;
    color:#fff;
}
.ui-widget-overlay {
    z-index: 1111!important;
    background: #000!important;
    opacity: 0.7!important;
}
.custom-ss-service-date-logo-popup
{
 margin: 10px  -15px !important;
}
.custom-ss-assign-btn-new-grid
{
 background: none !important;
}
.custom-ss-comment-text
{
 width: 100% !important;
}
.custom-ss-complete-btn-col
{
 margin: 15px 0;
}
.custom-ss-service-comment-tbl tr th
{
 color: #0e68c0;
 background: #eee;
 text-align: center;
 font-weight: 300;
font-size: 14px;
}
.custom-ss-service-comment-tbl tr td
{
 text-align: center;
 font-weight: 300;
}
.custom-ss-badge-bg {
    background-color: #e91e63 !important;
    border-radius: 12px;
    padding: 5px 5px;
}

.custom-ss-badge {
    font-weight: 400;
    position: absolute;
    top: 0;
    right: 6px;
    margin-top: -3px;
    border-radius: 12px;
    padding: 5px 5px;
    margin-right: -5px;
}
.badge {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    background-color: #777;
    border-radius: 10px;
}
.custom-ss-dis-count {
    background-color: #e91e63;
    border-radius: 50%;
    color: #fff;
    font-size: 9px;
    font-weight: bold;
    height: 13px;
    line-height: 13px;
    margin-left: -5px;
    margin-top: 0;
    padding: 0;
    position: absolute;
    text-align: center;
    width: 13px;
}
.custom-ss-service-displayed-name {
    background: none!important;
    border: none!important;
	text-align: center;
}
p.custom-ss-student-display
{
	color: #337ab7;
}
.custom-ss-service-assign-dialog {
    padding: .5em 15px !important;
    color:#4b4b4b;
 }
.custom-ss-service-date-logo {
    margin: 20px 0;
}
.custom-ss-service-name {
    font-size: 17px;
    margin-left: 4px;
    color: #0e68c0;
}
.custom-ss-date-list {
    border: 1px solid #ddd;
    border-radius: 6px;
    box-shadow: 1px 2px 3px 0 #cdcdcd;
    color: #fff;
    font-weight: bold;
    list-style: outside none none;
    padding: 0;
    text-align: center;
    width: 80px;
    line-height: 20px;
}
.custom-ss-date-list li:nth-child(1) {
    background: #5695d2;
    border-radius: 4px 4px 0 0;
	font-size: 11px;
}
.custom-ss-date-list li:nth-child(2) {
    font-size: 20px;
    color: #000;
}
.custom-ss-date-list li:nth-child(3) {
    color: #0e68c0;
	font-size: 10px;	
}
.custom-ss-moc-inner {
    margin-left: 33px;
}
.custom-ss-mfc-type p, .custom-ss-assigned-to-text p, .custom-ss-dialog-btn-grid p {
    font-size: 14px;
    word-break: break-all;
}
.custom-ss-service-date-logo .fa {
    margin-right: 5px;
}
.custom-ss-mfc-type span {
    color: #959595;
    font-size: 18px;
}

.custom-ss-services-preference {
    margin: 0;
    font-size: 16px;
}
.custom-ss-services-preference p, .custom-ss-service-requests-tabs li a {
    font-size: 17px;
}
.custom-ss-dialog-btn-grid {
    background: none;
}
.custom-ss-mfc-type p, .custom-ss-assigned-to-text p, .custom-ss-dialog-btn-grid p {
    font-size: 14px;
    word-break: break-all;
}

label.form-group-remember
{
	padding-left: 0 !important;
}
.custom-ss-student-text {
    float: right;
}
.custom-ss-req-det-dis-wrapper {
    display:block;
    border: 2px solid #fff;
    width: 98%;
    padding: 15px 15px 8px 15px;
    color: #0f6ac1;
	margin: 0 auto;
}
.custom-ss-req-det-dis-inwrapper {
    background: #fff;
    width: 100%;
    display: inline-block;
}
.custom-ss-chat-box-main {
    max-height:315px;
    overflow:auto;
}
.custom-ss-chat-box-div {
 background: #fff;
 width: 98%;
 margin: 0 auto;
} 
.custom-ss-chat-box-head {
    padding: 10px 15px;
border-bottom: 2px solid #A12EB3;
background-color: #B25AE5;
color: #fff;
text-align: center;

}

.custom-ss-chat-box-left {
    width: 100%;
    height: auto;
    padding: 15px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    position: relative;
    border: 1px solid #C5C5C5;
}
.custom-ss-chat-box-left:after {
    top: 100%;
    left: 10%;
    border: solid transparent;
    content: " ";
    position: absolute;
    border-top-color: #C5C5C5;
    border-width: 15px;
    margin-left: -15px;
}

.custom-ss-chat-box-name-left {
    margin-top: 30px;
    margin-left: 60px;
    text-align:left;
    color:#049E64;
}
    .custom-ss-chat-box-name-left img {
        max-width:40px;
        border: 2px solid #049E64;
		height: 40px;
    }

    .custom-ss-chat-box-right {
    width: 100%;
    height: auto;
    padding: 15px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    position: relative;
    border: 1px solid #C5C5C5;
}
.custom-ss-chat-box-right:after {
    top: 100%;
    right: 10%;
    border: solid transparent;
    content: " ";
    position: absolute;
    border-top-color: #C5C5C5;
    border-width: 15px;
    margin-left: -15px;
}

.custom-ss-chat-box-name-right {
    color: #354EA0;
    margin-top: 30px;
    margin-right: 60px;
    text-align:right;
}
.custom-ss-chat-box-name-right img {
        max-width:40px;
        border: 2px solid #354EA0;
    }

.custom-ss-chat-box-footer {
    background-color: #D8D8D8;
    padding: 10px;
	margin-bottom: 20px;
}
input.custom-ss-chatbox-file {
    opacity: 0;
}
span.custom-ss-chatbox-attach {
    position: absolute;
    left: 31px;
    font-size: 32px;
	color: #0f6ac1 ;
}
.custom-ss-chatbox-model
{
	top: 100px;
}
.custom-ss-chatbox-model .modal-content {
    height: auto;
    overflow-y: scroll;
    overflow-x: hidden;
}
.custom-ss-chatbox-model .modal-title
{
	padding: 0 15px;
}
.custom-ss-chatbox-model .modal-dialog {
    width: 766px;
}
/* Sr discussion style starts*/
.right pre{
    background-color: #def5c1;
    border:none;
    padding: 0;
    margin: 0;
    font-family: roboto;
    color: #67b145;
}
.left pre{
    background-color: #afceed;
    border:none;
    padding: 0;
    margin: 0;
    font-family:roboto;
    color: #0e66bc;
}

.messages {
  position: relative;
  list-style: none;
  padding: 20px 10px 0 10px;
  margin: 0;
}
.messages .message {
  clear: both;
  overflow: hidden;
  margin-bottom: 5px;
  transition: all 0.5s linear;
  opacity: 0;
}
.messages .message.left .avatar {
  /*background-color: #f5886e;*/
  float: left;
}
.messages .message.left .text_wrapper {
  background-color: #afceed;
  margin-left: 20px;
}
.messages .message.left .text_wrapper::after, .messages .message.left .text_wrapper::before {
  right: 100%;
  border-right-color: #afceed;
}
.messages .message.left .text {
  color: #0e66bc;
}
.messages .message.right .avatar {
  /*background-color: #fdbf68;*/
  float: right;
}
.messages .message.right .text_wrapper {
  background-color: #def5c1;
  margin-right: 20px;
  float: right;
}
.messages .message.right .text_wrapper::after, .messages .message.right .text_wrapper::before {
  left: 100%;
  border-left-color: #def5c1;
}
.messages .message.right .text {
  color: #67b145;
}
.messages .message.appeared {
  opacity: 1;
}
.messages .message .avatar {
  width: 60px;
  height: 67px;
  border-radius: 50%;
  display: inline-block;
}
.messages .message .text_wrapper {
  display: inline-block;
  padding: 10px 20px;
  border-radius: 6px;
  width: calc(100% - 85px);
  min-width: 100px;
  position: relative;
  min-height: 50px;
}
.messages .message .text_wrapper::after, .messages .message .text_wrapper:before {
  top: 10px;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}
.messages .message .text_wrapper::after {
  border-width: 9px;
  margin-top: 0px;
}
.messages .message .text_wrapper::before {
  border-width: 10px;
  margin-top: 0px;
}
.messages .message .text_wrapper .text {
  font-size: 18px;
  font-weight: 300;
}
button.btn.btn-info.custom-ss-srd-send
	{
		width: 100px;
		height: 36px;
		border-radius: 36px;
		background: #269b64 !important;
		border:0;
		margin-top: 10px;
	}
	button.btn.btn-info.custom-ss-srd-send:active,
	button.btn.btn-info.custom-ss-srd-send:focus,
	button.btn.btn-info.custom-ss-srd-send:hover
	{
		outline:inherit;
	}
	.custom-ss-srd-message {
  /* box-sizing: padding-box; */
  overflow:hidden !important;
  /* demo only: */
  padding:10px;
  width:50%;
  font-size:14px;
  display:block;
  border-radius:10px;
  height: 100px!important;
  resize: none;
  outline: inherit !important;
  transition: all linear 0.5s;
  -webkit-transition:all linear 1s;
  border: 4px solid #ccc;
}
.avatar img {
    display: block;
}
img.custom-ss-srd-send
{
	cursor: pointer;
}
/* SR discussion styles END */
.custom-ss-checkbox label:after, 
 {
    content: '';
    display: table;
    clear: both;
}
.custom-ss-checkbox .cr {
    position: relative;
    display: inline-block;
    border: 1px solid #a9a9a9;
    border-radius: .25em;
    width: 1.3em;
    height: 1.3em;
    float: left;
    margin-right: .5em;
}

.cr {
    border-radius: 50%;
}

.custom-ss-checkbox .cr .cr-icon
{
    position: absolute;
    font-size: .8em;
    line-height: 0;
    top: 50%;
    left: 20%;
    color: #337ab7;
}

.custom-ss-checkbox label input[type="checkbox"] {
    display: none;
}

.custom-ss-checkbox label input[type="checkbox"] + .cr > .cr-icon {
    transform: scale(3) rotateZ(-20deg);
    opacity: 0;
    transition: all .3s ease-in;
}

.custom-ss-checkbox label input[type="checkbox"]:checked + .cr > .cr-icon
{
    transform: scale(1) rotateZ(0deg);
    opacity: 1;
}

.custom-ss-checkbox label input[type="checkbox"]:disabled + .cr {
    opacity: .5;
}
.custom-ss-login-staff-btn
{
	background-color: #0f68bf;
	color: #fff;
}
.custom-ss-scroll {
    height: auto;
    overflow-y: auto;
/*	padding: 0 10px 0 10px;*/
	max-height:245px;
    padding: 20px;
    background: #eee;
    border-radius: 5px;
    margin-bottom: 20px;
}
.custom-ss-scroll:hover{
    border:2px solid #fff;
    box-shadow: 0 0 25px rgba(15, 104, 191, 0.6);
}
.custom-ss-staff-service-requests-alert
{
	padding:5px 10px;
	font-size: 16px;
	line-height: 20px;
	margin-bottom: 5px;
}
.custom-ss-staff-service-requests-alert-text
{
	/*width: 90%;
	float: left;*/
}
button.custom-ss-staff-service-requests-alert-accept.close {
    margin-right: 5px;
}
button.custom-ss-staff-service-requests-alert-accept i
{
	color: #39b54a;
}
button.custom-ss-staff-service-requests-close i {
    color: #eb3e79;
}
button.custom-ss-staff-service-requests-close.close,
button.custom-ss-staff-service-requests-alert-accept.close
{
	opacity: 1;
}
.custom-ss-staff-service-requests-alerts
{
	margin-top: 40px;
}
.card-content.table-responsive.custom-ss-service-request-dashboardpage-table {
    border-top: none;
}
.custom-ss-staff-sr-pagination
{
	float:right;
	display:table;
}
.custm-ss-pagination-active {
    border: 1px solid #ddd;
    color: #333;
    padding: 5px 10px;
    margin: 3px;
}
.custm-ss-pagination-current {
    background: #337ab7;
    color: #fff;
    padding: 5px 10px;
    border: 1px solid #2e6da4;
    margin: 3px;
}
.custom-ss-service-request-dashboardpage-nav
{
	height: 80px;
	background: #0f68bf;
}
.custom-ss-service-request-dashboardpage-container
{
	display: table;
	height: 100%;
	width: 100%;
}
.custom-ss-service-request-dashboardpage-innnercontainer
{
	display: table-cell;
	vertical-align: middle;
	
}
ul.nav.navbar-nav.navbar-right.custom-ss-service-request-dashboardpage-rightnav li a {
    color: #fff;
	background: none !important;
}
ul.nav.navbar-nav.navbar-right.custom-ss-service-request-dashboardpage-rightnav li ul li a
{
	/*color: #000 !important;*/
}
.custom-ss-service-request-dashboardpage-innnercontainer .navbar-brand {
    float: left;
    height: auto;
    padding:inherit;
    font-size: 18px;
    line-height: 20px;
}
.custom-ss-service-request-dashboardpage-innnercontainer .navbar-brand img
{
	width: 160px;
	height: 80px;
}
_:-ms-fullscreen, :root .custom-ss-service-request-dashboardpage-innnercontainer .navbar-brand img
{ 
	height:80px;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .custom-ss-service-request-dashboardpage-innnercontainer .navbar-brand img
	{
		height:80px;
	}
}
@media screen and (min-width:0\0) {
    .custom-ss-service-request-dashboardpage-innnercontainer .navbar-brand img
	{
		height:80px\9;
	} /* backslash-9 removes ie11+ & old Safari 4 */
}

/* Safari 11+ */

@media not all and (min-resolution:.001dpcm)
{ @supports (-webkit-appearance:none) and (stroke-color:transparent) {

    .custom-ss-service-request-dashboardpage-innnercontainer .navbar-brand img { 
      height:80px;
    }
}}

/* Safari 5+ */
@media screen and (-webkit-min-device-pixel-ratio:0) { 
    /* Safari only override */
   .custom-ss-service-request-dashboardpage-innnercontainer .navbar-brand img { 
      height:80px;
    }
}

header.clearfix {
    min-height: 80px;
}
h4.custom-ss-service-request-dashboardpage-title {
    margin-top: 40px;
    margin-bottom: 25px;
    color: #0f68bf;
    font-size: 28px;
    font-weight: normal !important;
}
.custom-ss-service-request-dashboardpage-wrapper
{
   background: #fff;
/*	box-shadow: 2px 2px 1px rgba(211,211,211,0.5);*/
	padding: 20px;
	margin-top: 10px;
}
span.custom-ss-service-request-dashboardpage-user-proimg {
    display: block;
    width: 45px;
    height: 45px;
    position: relative;
    top: -8px;
    left: -10px;
    float: left;
}
span.custom-ss-service-request-dashboardpage-user-proimg img
{
	width: 45px;
	border-radius: 50%;
	border: 3px solid #f3f3f3;
}
.custom-ss-service-request-dashboardpage-user-name
{
	color: #0f68bf;
	font-size: 18px;
	font-weight: 400;
}
.custom-ss-service-request-dashboardpage-select
{
	border-radius: 20px;
	width: 196px;
	height: 39px;
	background: #0f68bf;
	color: #fff;
	outline: none;
}
.custom-ss-service-request-dashboardpage-select option
{
	padding-left: 10px;
	padding-right: 10px;
	color: #fff;
}
.custom-ss-panel-body a.active { 
	box-shadow: 0 0 25px rgba(15,104,191,.6);
	border: 2px solid #fff;
		transform: scale(1.1);
	-webkit-transform:scale(1.1);
	-moz-transform:scale(1.1);
	opacity: 1;
}
a.actve
{
		box-shadow: 0 0 25px rgba(15,104,191,.6);
	border: 2px solid #fff;
		transform: scale(1.1);
	-webkit-transform:scale(1.1);
	-moz-transform:scale(1.1);
	opacity: 1;
}

.custom-ss-service-request-dashboardpage-tab-btn
{
	background: #f62459;
	padding: 22px;
	border-radius: 5px;
	margin: 0 10px;
	color: #fff;
		transition: all ease 1s;
	-webkit-transition:all ease 1s;
	opacity: 0.4;
}
.custom-ss-service-request-dashboardpage-tab-btn:hover,
.custom-ss-service-request-dashboardpage-tab-btn:focus
{
	color: #fff;
	transform: scale(1.1);
	-webkit-transform:scale(1.1);
	-moz-transform:scale(1.1);
	opacity: 1;
			box-shadow: 0 0 25px rgba(15,104,191,.6);
	border: 2px solid #fff;
}
.custom-ss-col-3
{
	width: 22%;
}
.custom-ss-service-request-dashboardpage-tab-btn.one
{
	background: #fd9a14;
}
.custom-ss-service-request-dashboardpage-tab-btn.two
{
	background: #09b2c7;
}
.custom-ss-service-request-dashboardpage-tab-btn.three
{
	background: #eb3e79;
}
.custom-ss-service-request-dashboardpage-tab-btn.four
{
	background: #39b54a;
}
.custom-ss-service-request-dashboardpage-tab-btn-bottom-text
{
	margin-top: 20px;
}
.custom-ss-service-request-dashboardpage-tab-btn-bottom-text h4
{
	font-weight: 400;
}
.custom-ss-service-request-dashboardpage-tab-btn-count
{
	font-weight: 300;
}
.custom-ss-service-request-dashboardpage-table
{
	/*margin-top: 40px;*/
}
.custom-ss-service-request-dashboardpage-table table
{
	font-weight: 300;
	font-size: 16px;
}
.custom-ss-service-request-dashboardpage-table table tr td
{
	border-top:1px solid #d7e6f4;
}
.table-hover>tbody>tr:hover {
    background-color: #d7e6f4;
}
.custom-ss-table-head
{
	background: #87b3df;
	color: #fff;
}
.custom-ss-table-head th
{
	border-bottom: none !important;
	font-weight: 300 !important;
}
.custom-ss-table-head-bottom
{
	background: none;
}
.custom-ss-table-head-bottom thead
{
	color: #918f8f;
}
label.custom-ss-searchlabel input
{
	border-top: none;
	border-left: none;
	border-right: none;
	color: #39b54a !important;
	font-weight: 300 !important;
	border-bottom: none;
	outline: none;
	
  /* Set up the hover */
  /* If you aren't using autoprefix, remember to prefix the gradient for other browsers
	 */
    background-image: linear-gradient(#0f68bf, #0f68bf), linear-gradient(#e6e8e9, #D2D2D2);
    background-size: 0 2px, 100% 1px;
    background-repeat: no-repeat;
    /*background-position: center bottom, center calc(100% - 1px);*/
    background-color: transparent;
    transition: background 0s ease-out;
    float: none;
    box-shadow: none;
    border-radius: 0;
    font-weight: 400;
}


label.custom-ss-searchlabel input::placeholder
{
	color: #39b54a !important;
}

label.custom-ss-searchlabel input:focus
{
	/* The following line makes the underline only as wide as the text */
  /* background-size: calc(100% - 2em) 5px, auto; 
  background-size: 100% 2px, auto;*/
	    outline: none;
    background-image: linear-gradient(#0f68bf, #0f68bf), linear-gradient(#e6e8e9, #e6e8e9);
    background-size: 100% 2px, 100% 1px;
    box-shadow: none;
    transition-duration: 0.3s;
}
.custom-ss-staff-sr-id
{
	color:#39b54a;
	margin-right:10px;
}
.custom-ss-search-btn
{
	border-radius: 50%;
	width: 40px;
	height: 40px;
	margin-bottom: -5px;
}
.custom-ss-search-btn:focus
{
	outline: none;
}
.custom-ss-service-request-dashboradpage-action-icon
{
	margin: 0 5px;
}
.custom-ss-service-request-selectbox
{
    color: #fff;
    background: #0f68bf;
    border-radius: 20px;
    padding: 0 10px;
    height: 36px;
    width: 200px;
	margin-left: 20px;
	outline: none;
	font-size: 16px;
	border: none;
	margin-top: 7px;
}
.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 60px;
    background-color: #535353;
}
 .custom-ss-footer-last-section.custom-ss-line p {
    padding: 20px 0;
    color: #fff;
    font-size: 13px;
    margin: 0;
}
ul.nav.navbar-nav.custom-ss-footer-last-list {
    margin-top: 20px;
    float: right;
	color: #fff;
}
ul.nav.navbar-nav.custom-ss-footer-last-list li {
    border: none;
}
ul.nav.navbar-nav.custom-ss-footer-last-list li a {
    color: #fff;
    font-size: 14px;
    text-decoration: none;
    padding-top: 5px;
}
.custom-ss-copyright p {
    padding: 15px 0;
    color: #fff;
    font-size: 13px;
    margin: 0;
}
ul.nav.navbar-nav.custom-ss-footer-last-list li a:hover, ul.nav.navbar-nav.custom-ss-footer-first-list li a:hover {
    background: none;
    color: #269b64;
}
.custom-ss-service-request-dashboardpage-rightnav
{
	margin-top: 10px;
}
.custom-ss-service-request-dashboardpage-rightnav .dropdown-menu {
    margin-top: -15px !important;
    margin-right: 28px;
    width: 210px;
	background: #0f68bf;
}
.custom-ss-date-range-picker {
	font-weight: 300;
	font-size: 16;
	position: relative;
    top: 16px;
}
span.custom-ss-date-range-picker label
{
	font-weight: 300 !important;
	padding: 5px;
}
.custom-ss-date-range-picker input
{
	width: 100px;
	height: 27px;
	border-top: none;
	border-left: none;
	border-right: none;
	outline: none;
	color: #39b54a !important;
    border-bottom: none;
	
	background-image: linear-gradient(#0f68bf, #0f68bf), linear-gradient(#e6e8e9, #D2D2D2);
    background-size: 0 2px, 100% 1px;
    background-repeat: no-repeat;
    background-position: center bottom, center calc(100% - 1px);
    background-color: transparent;
    transition: background 0s ease-out;
    float: none;
    box-shadow: none;
    border-radius: 0;
    font-weight: 300;
}
.custom-ss-date-range-picker.custom-ss-search input
{
	width:200px;
}
.custom-ss-date-range-picker input:focus
{
	    outline: none;
    background-image: linear-gradient(#0f68bf, #0f68bf), linear-gradient(#e6e8e9, #e6e8e9);
    background-size: 100% 2px, 100% 1px;
    box-shadow: none;
    transition-duration: 0.3s;
}

.custom-ss-date-range-picker input::placeholder
{
	color: #39b54a !important;
}
/*student details for staff page START*/
.custom-ss-personal-details-btn{
  position: relative;
 display:block;
 background: transparent;
 width:400px;
 height:40px;
 line-height:40px;
 font-size:15px;
 text-decoration:none;
 text-transform:uppercase;
 margin:-20px auto 20px;
 text-align: center;
 z-index: 1;
}
.custom-ss-personal-details-btn:before, .custom-ss-personal-details-btn:after {
 width:400px;
  left: 0px;
 height:20px;
  z-index: -1;
}

.student-details-btn{ 
    color: #fff!important;
    font-weight: 400;
}
/* Button Border Style */


.student-details-btn:before,.student-details-btn:after {
 border: 3px solid #39b54a;
}

.custom-ss-personal-details-btn:before{
  position: absolute;
  content: '';
  border-bottom: none;
  -webkit-transform: perspective(30px) rotateX(5deg);
  -moz-transform: perspective(30px) rotateX(5deg);
  transform: perspective(30px) rotateX(5deg);  
}
.custom-ss-personal-details-btn:after{
  position: absolute;
  top: 20px;
  content: '';
  border-top: none;
  -webkit-transform: perspective(30px) rotateX(-5deg);
  -moz-transform: perspective(30px) rotateX(-5deg);
  transform: perspective(30px) rotateX(-5deg);
}

/* Button Hover Style */

.student-details-btn:hover:before, .student-details-btn:hover:after {
 background: #39b54a;
}
.student-details-btn:before, .student-details-btn:after {
 background: #39b54a;
}
.custom-ss-personal-details-btn:hover{
 color:#fff;
}
.custom-ss-student-personal-details-block,.custom-ss-student-acadamic-details-block{
    border: 1px solid #ccc;
    padding: 0 20px 20px;
    background: #fff;
    margin: 20px 0 45px 0;
}
.custom-ss-student-personal-details-block .form-group p{
    margin: 0;
    word-break: break-all;
    word-wrap: break-word;
}
.custom-ss-student-personal-details-block label,.custom-ss-student-acadamic-details-block label{
    color: #0f68bf;
    font-weight: normal;
}
.custom-ss-student-personal-details-block .form-group{
    margin-bottom: 0;
}
.custom-ss-student-personal-details-block .form-control-static{
    padding-top: 3px;
}
.custom-ss-student-acadamic-details-block p{
    color: #269b64;
}
.custom-ss-academic-details-row p{
    margin: 0 0 5px;
}
.custom-ss-student-acadamic-details-block span{
    word-break: break-all;
    word-wrap: break-word;
}
.custom-ss-acadamic-details-table th{
    background:#0f68bf;
    color: #fff;
    font-weight: normal;
    border: none;
}
.custom-ss-acadamic-details-table{
    margin-top: 5px;
}
.custom-ss-acadamic-details-table,.custom-ss-acadamic-details-table td,.custom-ss-acadamic-details-table th{
    border:1px solid #ccc;
}
.custom-ss-staff-portal-student-scores span{
    margin-right: 15px;
}
/*student details for staff page End*/

.custom-ss-search-div{
	margin-top: 42px;
	margin-bottom: 0px;
	
}

.hexa, .hexa div {
  margin: 0 auto;
  transform-origin: 50% 50%;
  overflow: hidden;
  width: 300px;
  height: 300px;
}
.hexa {
  width: 100px;
  height: 120px;
   
}
.hexa div,.hex2 img {
  width: 100%;
  height: 100%;
}
.hexa {
  transform: rotate(120deg);
}
.hex1 {
  transform: rotate(-60deg);
}
.hex2 {
  transform: rotate(-60deg);
}
.custom-ss-label-col{
    padding: 0;
    color: #0f68bf;
    width: 5px;
}
@media only screen 
  and (min-width: 768px) 
  and (max-width: 1024px) 
 {

	.custom-ss-col-3
{
	width: 22%;
}
}

@media only screen 
  and (min-width: 320px) 
  and (max-width: 767px) 
{
.custom-ss-col-3
{
	width: 21%;
}
}
/*-------styles added by harikrishna on 13th Aug 2019------*/
.custom-ss-modal-header{
    background-color: #0f6ac1;
    color: white;
    
}
label{
    font-weight: 400 !important;
}
.custom-ss-btn-bg{
    background-color: #0f6ac1 !important;
    color: white !important;
    margin-left: 10px !important;
    
}
.custom-ss-invitation-model .modal-dialog{
    width: 370px !important;
    padding: 10px !important;

}
form.custom-ss-reg-user-invitations {
    margin-bottom: -10px;
}
.custom-ss-reg-user-invitations .fa{
    color: #7bbd5c;
}
.custom-ss-bg-table{
    background-color: #fff;
}
.custom-ss-bg-table .btn{
    background-color: #7bbd5c;
    color: #fff;
}
.custom-ss-panel-body{
    padding-top:15px !important;
    padding-bottom: 0px;

}
.custom-ss-panel-top{
    margin-top: 30px !important;
}
.custom-ss-panel-header{
margin-top: 5px !important;
margin-bottom: 10px !important;
color: #269B64 ;
font-weight: 400;
}
.custom-ss-staff-sr-pagination{
    margin-top: 15px;
}
.custom-ss-staff-sr-pagination a:hover{
    background:#337ab7; 
    color: #fff;
    text-decoration: none;
}

/*-------styles added by harikrishna on 14th Aug 2019------*/
.custom-ss-bg-table,tr,td{
    vertical-align: 0 !important;
}
.custom-ss-reg-username::placeholder{
    color: #7bbd5c !important;

}
.custom-ss-reg-useremail::placeholder{
    color: #7bbd5c !important;
}

/*---------stles added by harikrishna on 26th Aug 2019-----*/
.custom-ss-send-invitation-right{

    float: right !important;
    position: relative;
    top:-60px;
   
}
.custom-ss-send-invitation-right a{
    color: #fff !important;
    text-decoration: none !important;
}
 .custom-ss-countperpage{
    float: right !important;
    position: relative;
    top:-32px;
    margin-bottom: -6px;
} 
.custom-ss-count-pages{
    float: right;
    position: relative;
    top: 3px;
}

.custom-ss-count-perpage-records{
    padding-left: 0px !important;
    padding-right: 0px !important;
}