.adminx-content{
	padding-left: 4rem;
	padding-right: 4rem;
}

.pt10{
	padding-top: 10px !important;
}

.pt5{
	padding-top: 5px !important;
}

.pt15{
	padding-top: 15px !important;
}

.pt20{
	padding-top: 20px !important;
}

.pt25{
	padding-top: 25px !important;
}

.pt30{
	padding-top: 30px !important;
}

.pb10{
	padding-bottom: 10px !important;
}

.pb5{
	padding-bottom: 5px !important;
}

.pb15{
	padding-bottom: 15px !important;
}

.pb20{
	padding-bottom: 20px !important;
}

.pb25{
	padding-bottom: 25px !important;
}

.pb30{
	padding-bottom: 30px !important;
}

.p-init{
	padding: 0px !important;
}
.center{
	text-align: center !important;
}

#carbonads{
	display: none !important; 
}
.hide{
	display: none !important;
}

ul{
	list-style-type:none !important;
}

.text-right{
	text-align: right !important;
}

/*===================================================*/
/*=============== Quiz Box ==========================*/
/*===================================================*/

.questionsBox{ display:block; border:solid 1px #4e9675; padding:10px 20px 0px; box-shadow:inset 0 0 30px rgba

(000,000,000,0.1), inset 0 0 4px rgba(255,255,255,1); border-radius:3px; margin:0 10px;}
.questions{background:#4e9675;color:#FFF;font-size:20px;padding:8px 30px;margin:0 -30px 10px;position:relative;}
/*.questions{background:#4e9675;color:#FFF;font-size:22px;padding:8px 30px;font-weight:300;margin:0 -30px 10px;position:relative;}*/
.questions:before, .questions:after{background:url(./demo/img/icon.png) no-repeat left 

0;display:block;position:absolute;top:100%;width:9px;height:7px;content:'.';left:0;text-align:left;font-size:0;}
.questions:after{ left:auto; right:0; background-position:-10px 0}
.answerList{ margin-bottom:15px; padding-left: 0px !important;}
.answerList li{ padding:3px 0;}
.answerList li:first-child{ border-top-width:0}
.answerList label{ display:block; padding:6px; border-radius:6px; border:solid 1px #dde7e8; font-weight:400; font-

size:13px; cursor:pointer; font-family:Arial, sans-serif }
.answerList li:hover label{ border-color:#d1d1d1;  background:#f2fafb; }
.answerList li.selected label{ border-color:#b2d9ee;  background:#dcedf6;}

.questionsRow { background:#dee3e6; margin:0 -20px; padding:10px 20px; border-radius:0 0 3px 3px; }
.questionsRow span{ float:right; display:inline-block; line-height:30px; border:solid 1px #aeb9c0; padding:0 10px; 

background:#FFF; color:#4e9675; }



/*===================================================*/
/*=============== CSS talk bubble ===================*/
/*===================================================*/

.talk-bubble {
	margin: 10px 40px;
  display: inline-block;
  position: relative;
	width: auto;
	height: auto;
	background-color: #e1eaec;
}

.talk-bubble-reply {
	margin: 10px 40px;
  display: inline-block;
  position: relative;
	width: auto;
	height: auto;
	background-color: #83ffab;
}

.reply{
	border: 22px solid;
    border-color: #83ffab transparent transparent transparent;
}


.border{
  border: 8px solid #666;
}
.round{
  border-radius: 30px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;

}

/* Right triangle placed top left flush. */
.tri-right.border.left-top:before {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: -40px;
	right: auto;
  top: -8px;
	bottom: auto;
	border: 32px solid;
	border-color: #666 transparent transparent transparent;
}
.tri-right.left-top:after{
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: -20px;
	right: auto;
  top: 0px;
	bottom: auto;
	border: 22px solid;
	border-color: #e1eaec transparent transparent transparent;
}

/* Right triangle, left side slightly down */
.tri-right.border.left-in:before {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: -40px;
	right: auto;
  top: 30px;
	bottom: auto;
	border: 20px solid;
	border-color: #666 #666 transparent transparent;
}
.tri-right.left-in:after{
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: -20px;
	right: auto;
  top: 38px;
	bottom: auto;
	border: 12px solid;
	border-color: #e1eaec #e1eaec transparent transparent;
}

/*Right triangle, placed bottom left side slightly in*/
.tri-right.border.btm-left:before {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
	left: -8px;
  right: auto;
  top: auto;
	bottom: -40px;
	border: 32px solid;
	border-color: transparent transparent transparent #666;
}
.tri-right.btm-left:after{
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
	left: 0px;
  right: auto;
  top: auto;
	bottom: -20px;
	border: 22px solid;
	border-color: transparent transparent transparent #e1eaec;
}

/*Right triangle, placed bottom left side slightly in*/
.tri-right.border.btm-left-in:before {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
	left: 30px;
  right: auto;
  top: auto;
	bottom: -40px;
	border: 20px solid;
	border-color: #666 transparent transparent #666;
}
.tri-right.btm-left-in:after{
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
	left: 38px;
  right: auto;
  top: auto;
	bottom: -20px;
	border: 12px solid;
	border-color: #e1eaec transparent transparent #e1eaec;
}

/*Right triangle, placed bottom right side slightly in*/
.tri-right.border.btm-right-in:before {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: auto;
	right: 30px;
	bottom: -40px;
	border: 20px solid;
	border-color: #666 #666 transparent transparent;
}
.tri-right.btm-right-in:after{
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: auto;
	right: 38px;
	bottom: -20px;
	border: 12px solid;
	border-color: #e1eaec #e1eaec transparent transparent;
}
/*
	left: -8px;
  right: auto;
  top: auto;
	bottom: -40px;
	border: 32px solid;
	border-color: transparent transparent transparent #666;
	left: 0px;
  right: auto;
  top: auto;
	bottom: -20px;
	border: 22px solid;
	border-color: transparent transparent transparent #e1eaec;

/*Right triangle, placed bottom right side slightly in*/
.tri-right.border.btm-right:before {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: auto;
	right: -8px;
	bottom: -40px;
	border: 20px solid;
	border-color: #83ffab  #83ffab  transparent transparent;
}
.tri-right.btm-right:after{
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: auto;
	right: 0px;
	bottom: -20px;
	border: 12px solid;
	border-color: #83ffab  #83ffab  transparent transparent;
}

/* Right triangle, right side slightly down*/
.tri-right.border.right-in:before {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: auto;
	right: -40px;
  top: 30px;
	bottom: auto;
	border: 20px solid;
	border-color: #83ffab  transparent transparent #83ffab ;
}
.tri-right.right-in:after{
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: auto;
	right: -20px;
  top: 38px;
	bottom: auto;
	border: 12px solid;
	border-color: #83ffab  transparent transparent #83ffab ;
}

/* Right triangle placed top right flush. */
.tri-right.border.right-top:before {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: auto;
	right: -40px;
  top: -8px;
	bottom: auto;
	border: 32px solid;
	border-color: #83ffab  transparent transparent transparent;
}
.tri-right.right-top:after{
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
  left: auto;
	right: -20px;
  top: 0px;
	bottom: auto;
	border: 20px solid;
	border-color: #83ffab  transparent transparent transparent;
}

/* talk bubble contents */
.talktext{
  padding: 1em;
	text-align: left;
  line-height: 1.5em;
}
.talktext p{
  /* remove webkit p margins */
  -webkit-margin-before: 0em;
  -webkit-margin-after: 0em;
}

.message{
	padding: 10px !important;
	vertical-align : middle;
	border-radius: 5px;
	font-weight: 600;
}
.message-success{ background-color:  #5ad776 !important; 	color: #fff !important; }
.message-fail{ background-color:  #dc3545 !important; 	color: #fff !important; }
#loading {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,.5);
    -webkit-transition: all .5s ease;
    z-index: 1000;
}

#spinner {
    position: absolute;
    width: 100px;
    height: 100px;
    top: 50%;
    left: 50%;
    margin-top: -50px;
    margin-left: -50px;
    -webkit-transition: all 1000s linear;
}

.rotate {
  animation: rotation 8s infinite linear;
}

.is-invalid {
    color: #dc3545;
}


/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  /*padding-top: 100px; /* Location of the box */
  padding-top: 15%; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  border: 1px solid #888;
  width: 60%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

/* The Close Button */
.close {
  color: white;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal-header {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}

.modal-body {padding: 2px 16px;}

.modal-footer {
  padding: 2px 16px;
  background-color: #5cb85c;
  color: white;
}


.btn-primary {
	background : #007bff linear-gradient(180deg,#007fbe,#007bff) repeat-x !important;
}

.card {
	border: 1px solid #6dffce !important;
}

.card-header{
	background: #7fffd4 !important;
}


select.form-control:not([size]):not([multiple]){
	height : calc(2.34rem + 1.5px) !important;
}

.blink_me {
  animation: blinker 1s linear infinite;
}

@keyframes blinker {
  50% {
    opacity: 0;
  }
}

/* Breadcrumb */
	.breadcrumb {
        /*centering*/
        display: inline-block;
        box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.35);
        overflow: hidden;
        border-radius: 5px;
        /*Lets add the numbers for each link using CSS counters. flag is the name of the counter. to be defined using counter-reset in the parent element of the links*/
        counter-reset: flag; 
      }

      .breadcrumb a {
        text-decoration: none;
        outline: none;
        display: block;
        float: left;
        font-size: 12px;
        line-height: 36px;
        color: white;
        /*need more margin on the left of links to accomodate the numbers*/
        padding: 0 10px 0 60px;
        background: #666;
        background: linear-gradient(#666, #333);
        position: relative;
      }
      /*since the first link does not have a triangle before it we can reduce the left padding to make it look consistent with other links*/
      .breadcrumb a:first-child {
        padding-left: 46px;
        border-radius: 5px 0 0 5px; /*to match with the parent's radius*/
      }
      .breadcrumb a:first-child:before {
        left: 14px;
      }
      .breadcrumb a:last-child {
        border-radius: 0 5px 5px 0; /*this was to prevent glitches on hover*/
        padding-right: 20px;
      }

      /*hover/active styles*/
      .breadcrumb a.active, .breadcrumb a:hover{
        background: #333;
        background: linear-gradient(#333, #000);
      }
      .breadcrumb a.active:after, .breadcrumb a:hover:after {
        background: #333;
        background: linear-gradient(135deg, #333, #000);
      }

      /*adding the arrows for the breadcrumbs using rotated pseudo elements*/
      .breadcrumb a:after {
        content: '';
        position: absolute;
        top: 0; 
        right: -18px; /*half of square's length*/
        /*same dimension as the line-height of .breadcrumb a */
        width: 36px; 
        height: 36px;
        /*as you see the rotated square takes a larger height. which makes it tough to position it properly. So we are going to scale it down so that the diagonals become equal to the line-height of the link. We scale it to 70.7% because if square's: 
        length = 1; diagonal = (1^2 + 1^2)^0.5 = 1.414 (pythagoras theorem)
        if diagonal required = 1; length = 1/1.414 = 0.707*/
        transform: scale(0.707) rotate(45deg);
        /*we need to prevent the arrows from getting buried under the next link*/
        z-index: 1;
        /*background same as links but the gradient will be rotated to compensate with the transform applied*/
        background: #666;
        background: linear-gradient(135deg, #666, #333);
        /*stylish arrow design using box shadow*/
        box-shadow: 
          2px -2px 0 2px rgba(5, 116, 121, 0.57), 
          3px -3px 0 2px rgba(255, 255, 255, 0.1);
        /*
          5px - for rounded arrows and 
          50px - to prevent hover glitches on the border created using shadows*/
        border-radius: 0 5px 0 50px;
      }
      /*we dont need an arrow after the last link*/
      .breadcrumb a:last-child:after {
        content: none;
      }
      /*we will use the :before element to show numbers*/
      .breadcrumb a:before {
        content: counter(flag);
        counter-increment: flag;
        /*some styles now*/
        border-radius: 100%;
        width: 20px;
        height: 20px;
        line-height: 20px;
        margin: 8px 0;
        position: absolute;
        top: 0;
        left: 30px;
        background: #444;
        background: linear-gradient(#444, #222);
        font-weight: bold;
      }


      .flat a, .flat a:after {
        background: white;
        color: #2b0101;
        transition: all 0.5s;
      }
      .flat a:before {
        background: white;
        box-shadow: 0 0 0 1px #ccc;
      }
      .flat a:hover, .flat a.active, 
      .flat a:hover:after, .flat a.active:after{
        background: #00dce6;
      }

      audio::-webkit-media-controls-play-button,
      audio::-webkit-media-controls-panel {
        background-color: #1fed5d;
        color: #a0276e;
      }