/*----------------------------------------------------------------------
                            Sitewide Styling
 ----------------------------------------------------------------------*/
/* Used in: index, register, login, 404, error, maintenance */

html {
  font-family: "noto sans";
  
}

body {
  color: #f0ffff;
  font-family: "noto sans";
}

/* 
  --Relating with sticky footer-- 
*/
#wise-user-warpp 
{
    height:auto !important;
    min-height:100%;
    height:100%;
    position: relative;
    width : 100%;
    margin : 0 auto;
}


#support-other
{
    padding: 15px 10px;
}

/********************************/
/************** Div *************/
/********************************/
/*
div.container-top-light {
  padding-top: 88px;
  background-color: #FAFAFA;
  color: #454948;
}
*/
div.body-container-light {
  padding-top: 30px;
  padding-bottom: 40px;
  background-color: #FAFAFA;
  color: #454948;
}

div.body-container-dark {
  padding-top: 30px;
  padding-bottom: 40px;
}


/********************************/
/************* Texts ************/
/********************************/

.green-title-md {
  color: #26a69a;
}

.news-date {
  margin-bottom: 20px;
  color: #999999;
}

a {
  color: #ff9800;
  cursor:pointer;
}

a:hover {
  color: #ff9800;
}

p.lowlight-text {
  padding-top: 10px;
  color: #999999;
  font-size: 14px;
}

/*.no-style{
    display:inline;
}*/

/*----------------------------------------------------------------------
                              Text Styling
----------------------------------------------------------------------*/
/* Used in: index, register, login */


.title-style {
  padding-bottom: 10px;
  border-bottom: 2px solid #26a69a;
  margin-bottom: 40px;
}

h1 {
    font-size: 36;
    font-style: bold;
}

h1 span {font-size: 14; color: #ff9800;}

p {
  font-size: 14px;
}

h5{
  font-weight: bold;
}

hr {
  border-top: 1px solid #575757;
}
/*----------------------------------------------------------------------
                            Forms and Input
----------------------------------------------------------------------*/
/* Used in: index, register, login */

.input-contact:focus,
.form-control:focus,
.input-settings:focus {
  border-color:  #ff9800;
  box-shadow: inset 0 1px 1px rgb(255, 152, 0, 0.5), 0 0 8px rgb(255, 152, 0, 0.5);
}

.input-contact,
.input-contact input,
.input-contact label,
.input-contact select,
.input-contact textarea {
  background-color: #424242;
  border: 1px solid #212121;
  color: #f0ffff;
}

/* input settings */
  .input-dark:focus {
    border-color:  #ff9800;
    box-shadow: inset 0 1px 1px rgb(255, 152, 0, 0.5), 0 0 8px rgb(255, 152, 0, 0.5);
  }

  .input-dark,
  .input-dark input,
  .input-dark label,
  .input-dark select,
  .input-dark textarea {
    background-color: #424242;
    border: 1px solid #212121;
     min-width: 100%;
    /*min-width: 300px;
    max-width: 400px; */
    border-radius: 2px;
    color: #f0ffff;
    padding: 8px;
    color: #999999;
  }



/* shadow around input */
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
  border-color: rgba(255, 152, 0, 0.8);
  box-shadow: 0 1px 1px rgba(255, 183, 77, 0.075) inset, 0 0 8px rgba(255, 183, 77, 0.6);
  outline: 0 none;
}




/*--------------
Errors
--------------*/

h2.error {
  font-size: 60;
  padding-bottom: 10px;
  border-bottom: 1px solid #16a085;
  margin-bottom: 40px;
}

div.error-container {
  padding-top: 60px;
  background-color: #303030;
}



/*--------------
Header Navigation
--------------*/

span.input-start-language {
  max-width: 100px;
}

.header-nav-language {
  margin-top: 20px;
  height: 26px;
  max-width: 180px;
  z-index: 210;
  margin-bottom: none;
  align-self: flex-start;
}

.header-nav-language-input {
  background-color: #212121;
  border: none;
  height: 26px;
}

.header-nav-language select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
}

.header-nav-language-dropdown {
  background-color: #212121;
  color: #f0ffff;
  border: 1px solid #505050;
  border-radius: 2px;
}

.dropdown-menu-header  {
  top: 75px;
  background: #212121;
  radius: 2px;
  border: 1px solid #303030;
  min-width: 300px;
  -webkit-box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.5);
  box-shadow: 2px 2px 2px 0px rgba(0,0,0,0.5);
}


/*--------------
Other
--------------*/
/*
div#body-content {
  border-top: 2px solid #16a085;
}

div#pageTitle {
  font-size: 48;
  border: 2px;
  padding: 10px;
  margin-top: 20px;
  font-style: bold;
}

*/
div#body-wrap {
  display: flex;
  flex-wrap: wrap;
}

p#billing {
  margin-top: 12px;
}

div.tile-dark {
  background-color: #424242;
  border-radius: 2px;
  padding: 10px;
  -webkit-box-shadow: inset 2px 2px 2px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: inset 2px 2px 2px 0px rgba(0,0,0,0.5);
  box-shadow: inset 2px 2px 2px 0px rgba(0,0,0,0.5);
}

div.tile-dark-up {
    background-color: #424242;
  border-radius: 2px;
  padding: 20px;
  -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.5);
  -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.5);
  box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.5);
}


.header-text h2 {
    font-size: 40px;
}

h2 span {
    color: #4db6ac;
	padding: 10px;
}

.header-text h3 span {
	background-color: #000;
  color: #b2dfdb;
  font-size: 50px;
}

.gap {min-height: 30px;}
.gap-lg {min-height: 60px;}
.gap-sm {min-height: 15px;}

/*--------------
 Profiles
 --------------*/

.company-logo,
.company-logo-small {
  border: 2px solid #f0ffff;
}

.company-logo {
  margin-top: 20px;
  width: 150px;
  height: 150px;
}

.company-logo-small {
  float: left;
  width: 50px;
  height: 50px;
}



/*--------------
 Company Page
 --------------*/

.company-tiles {
  background: #303030;
  float: left;
  padding-top: 20px;
  padding-bottom: 20px;
  border-left: 8px solid #424242;
  border-right: 8px solid #424242;
}

/*--------------
 Cookie Message
 --------------*/

.cookies {
 position: absolute;
 left: 0;
 top: 50px;
 width: 100%;
 background-color: #424242 ;
 color: #f0ffff ;
 border: 1px solid #575757 ;
 padding-top: 22px;
}

.cookies .material-icons{margin-top:-5 !important;}

/*--------------
Rotate
---------------*/


#wise-login-web-checking,
#wise-login-browser-checking,
#wise-userinfo-adduser-checking
 {
    -webkit-animation:rotation 1s linear infinite;
    -moz-animation:rotation 1s linear infinite;
    -ms-animation:rotation 1s linear infinite;
    -o-animation:rotation 1s linear infinite;
}

@-moz-keyframes rotation { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes rotation {    
    from 
    {
        -webkit-transform: rotate(0deg);
    }
    to
    {
        -webkit-transform: rotate(359deg);
    }
}
@-ms-keyframes rotation { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }
@-o-keyframes rotation { 100% { -moz-transform: rotate(360deg); } }



/* logo */
.navbar-brand {
  padding: 0px;
}

.navbar-brand>img {
  padding-top: 12px;
  padding-bottom: 2px;
  max-height: 50px;
  margin-top: -1px;
}

ul, li{
  list-style-type: none;
}


/********************************/
/************* Forms ************/
/********************************/

/* shadow around input */
textarea[type="text"]:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
  border-color: rgba(255, 152, 0, 0.5);
  box-shadow: 0 1px 1px rgba(255, 183, 77, 0.075) inset, 0 0 8px rgba(255, 183, 77, 0.5);
  outline: 0 none;
	-webkit-transition: all 0.30s ease-in-out;
	-moz-transition: all 0.30s ease-in-out;
	-ms-transition: all 0.30s ease-in-out;
	-o-transition: all 0.30s ease-in-out;
}

/* Green Title */
h4.green-title-md {
  color: #26a69a;
}

body a {
    cursor: pointer;
}

#wise-userinfo-dialog {
    visibility: visible;
}


#ui-id-1,
.ui-menu {
    background-color: #424242;
    color: #999999;
    height: 150px;
    overflow-y: auto;
    overflow-x: hidden;
    position: absolute;
}

.navbar-nomargin{
	margin-bottom: 0;
}

/* navbar border*/
.navbar-border{
  border-bottom:1px solid #575757 !important;
}

/********************/
/* navheader survey */
/********************/
.navheader-survey{
  background-color: rgba(0, 155, 119, 0.8);
}

.navheader-survey a{
  color: #FFF !important;
}

@media screen and (max-width: 767px) {
  .navheader-survey a{
    margin-top: 4px;
  }
}

/*****************/
/* navbar survey */
/*****************/
/* survey navbar border */
.navbar-survey{
  border: none;
  background-color: #424242;
}
/* survey navbar brand color */
.navbar-survey .navbar-brand{
  color: rgba(255, 152, 0, 0.8) !important;
}
.navbar-survey .navbar-brand .material-icons{
  margin-top: -2px;
  padding-right: 5px;
}

/* survey navbar divider */
.navbar-survey .clearfix{
  border-bottom:1px solid rgba(255,255,255,0.12);
  margin-left: -15px;
  margin-right: -15px;
}

.navbar-survey .navbar-brand,
.navbar-survey .navbar-nav a{
  margin-top: 7px;
  margin-bottom: 7px;
  padding-top: 5px;
  padding-bottom: 5px;
  height: 30px;
  color: #FFF !important;
  font-weight: bold;
  margin-top: 12px;
}

.navbar-survey .navbar-nav > .active{
  background-color: transparent !important;
}
.navbar-survey .navbar-nav > .active > a,
.navbar-survey .navbar-nav > .active > a:hover,
.navbar-survey .navbar-nav > .active > a:focus{
  background-color: transparent !important;
  border-radius: 25px;
  background-color: rgba(0, 155, 119, 0.8) !important;
}
@media screen and (max-width: 767px) {
  .navbar-survey .navbar-nav > .active > a,
  .navbar-survey .navbar-nav > .active > a:hover,
  .navbar-survey .navbar-nav > .active > a:focus{
    border-radius: 1px;
  }
}

/*****************/
/* subnav survey */
/*****************/
.subnav-survey{
  /* background-color: transparent; */
  border-bottom: 1px solid #575757;
  background-color: #424242;
}

.subnav-survey a{
  color:#FFF !important;
  border-bottom: 3px solid #424242;
}

.subnav-survey .navbar-brand,
.subnav-survey .navbar-nav a{
  /* padding-top: 5px;
  padding-bottom: 5px;
  height: 30px; */
}

.subnav-survey .navbar-nav > .active{
  background-color: transparent !important;
}

.subnav-survey .navbar-nav > .active > a,
.subnav-survey .navbar-nav > .active > a:hover,
.subnav-survey .navbar-nav > .active > a:focus {
    color: rgba(255, 171, 64,0.8);
    background-color: transparent !important;
    border-bottom: 3px solid rgba(0, 155, 119, 0.8);
}

.well-nomargin{
  margin-bottom: 0px !important;
}

/* jumbotron text - if text needs resize for mobile */
@media screen and (max-width: 767px) {
 .jumbotron-text{
   font-size: 16px !important;
 }
}

.overlay {
    background: rgba(0,0,0,0.4);
    display:none;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0.5;
    z-index: 20;
}

/*****************/
/* banner header */
/*****************/

/* jumbotron banner */
.full-banner{
	background: url('../img/banner-image-small.jpg') no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	background-size: cover;
	-o-background-size: cover;
	height:100%;
	margin: -17px -15px 15px -15px;
	border-bottom: 1px solid #575757;
}

@media (min-width: 1000px) {    
	.full-banner{        
		background: url('../img/banner-image-medium.jpg') no-repeat center center fixed;
	} 
}
@media (min-width: 2000px) {    
	.full-banner{        
		background: url('../img/banner-image-large.jpg') no-repeat center center fixed;
	} 
}

.jumbotron-transparent{
  background-color: rgba(0,0,0,0.3);
  margin-top: 50px;
}