html { 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
body{
     /* background: #3998b8 !important; /* For browsers that do not support gradients */        
     /* background: -webkit-linear-gradient(-90deg, #3998b8, #afd4ee) !important; /* For Safari 5.1 to 6.0 */
     /* background: -o-linear-gradient(-90deg, #3998b8, #afd4ee) !important; /* For Opera 11.1 to 12.0 */
    /*  background: -moz-linear-gradient(-90deg, #3998b8, #afd4ee) !important; /* For Firefox 3.6 to 15 */
     /* background: linear-gradient(-90deg, #3998b8, #afd4ee) !important; /* Standard syntax (must be last) */
    background: #b3e5fc !important;
    height: 100%;
    background-size:cover !important;
}
h1, .h1, h2, .h2, h3, .h3, h4, .h4 {
    font-weight: 300;
}

.wrapper {
    background-color:transparent !important;
}

.user-header{
	max-height:50px;
}


.form-control{
	width:400px;
	max-width:400px;
	min-width:100%;
	margin: 15px 3px;
}
.material-icons {
    direction: ltr;
    display: inline-block;
    float: left;
    font-family: "Material Icons";
    font-feature-settings: "liga";
    font-size: 34px;
    font-style: normal;
    font-weight: normal;
    letter-spacing: normal;
    line-height: 1;
    margin: 10px;
    overflow-wrap: normal;
    text-rendering: optimizelegibility;
    text-transform: none;
    white-space: nowrap;
}


.navbar-default {
    background-color: rgba(221, 221, 221, 1);
	border-bottom:#999999 solid 1px;
}
.main-panel {
    background: rgba(203, 203, 210, 0.15) none repeat scroll 0 0;
    margin: 0 auto;
    position: relative;
    width: 100%;
    z-index: 2;
	float:none !important;

	
}

iframe{
	border: medium none;
    min-height: 100%;
    overflow: hidden;
    scroll-behavior: smooth;
    width: 100%;
}
.visitor{
	margin: 15px 3px !important;
    padding: 5px 15px !important;
    position: relative;
    font-size:12px;
    font-weight:700;
}



.navbar .navbar-nav > li > a {
    margin: 5px 3px !important;
    padding: 5px 15px !important;
    position: relative;
}

/************Navigation Menu*******************************/
/* Navigation
============================================================================================== */
/* General menu styling */
/*<surfmarktag>*/

.nav 
{

position: relative;
margin: 0;
padding: 0;
line-height: 22px;
}
/* The main navigation link containers */
.category
{
 color:#1757Bb;
padding-top:15px;
}
.tab a{padding-left:20px;}
.nav>li {
display: block;
float: left; /* Displaying them on the same line */
margin: 0;
padding: 0;
}
/* The main navigation links */
.nav
{
	margin-left:200px;

}
.nav>li>a {
	/* Layout */
	display: block;
	position: relative;
	/* Text */
	font-family: "Open Sans Condensed", Arial, Helvetica, sans-serif;
	color: #333333;
	font-size: 16px;
	text-decoration: none;
	/* Background */
	background: none; /* Transparent background for modern browsers */
	/* Making the color to change on hover with a transition */
	-webkit-transition: color .3s ease-in;
	-moz-transition: color .3s ease-in;
	-o-transition: color .3s ease-in;
	-ms-transition: color .3s ease-in;
	padding-right:20px;
}
/* Changing the color on hover */
.nav>li>a:hover, .nav>li:hover>a {
color:none;
background-color:transparent !important;
}
/* The links which contain dropdowns menu are wider, because they have a little arrow */
.nav>.dropdown>a {

}
/* The arrow indicating the dropdown */
.dropdown>a::after {
/*content: "";
position: absolute;
top: 17px;
right: 10px;
width: 7px;
height: 7px;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
border-bottom: 1px solid #fff;
border-right: 1px solid #fff;*/
}
/* Changing the color of the arrow on hover */ 
.dropdown>a:hover::after, .dropdown:hover>a::after {
border-color: #1757B7;
}
/* The submenus */
.nav ul {
position: absolute;
margin: 0;
padding: 0;
list-style: none;
display: block;
}
/* General layout settings for the link containers of the submenus */
.nav ul li {
position: absolute;
top: -9999px; /* Hiding them */
height: 0px;
display: block;
margin: 0;
padding: 0;
/* Making them to expand their height with a transition, for a slide effect */
-webkit-transition: height .2s ease-in;
-moz-transition: height .2s ease-in;
-o-transition: height .2s ease-in;
-ms-transition: height .2s ease-in;
}
/* Displays the submenu links, by expading their containers (with a transition, previously defined) and by repositioning them */
.dropdown:hover>ul>li {
height: 40px;
position: relative;
top: auto;
}
/* The submenu links */
.nav ul li a {
	/* Layout */
	padding: 10px 10px;
	width: 300px;
	display: block;
	margin-bottom:20px;
	position: relative;
	z-index:1;
	/* Text */
	font-family: "Open Sans Condensed", Arial, Helvetica, sans-serif;
	color: rgba(245, 245, 245, 1);
	text-decoration: none;
	font-size: 14px;
	-webkit-transition: color .3s ease-in, background .3s ease-in;
	-moz-transition: color .3s ease-in, background .3s ease-in;
	-o-transition: color .3s ease-in, background .3s ease-in;
	-ms-transition: color .3s ease-in, background .3s ease-in;
}
/* Changing the link's color and background on hover */
.nav ul li:hover>a, .nav ul li a:hover {
	color: #afd4ee;
}
/* Making the level 2 (or higher) submenus to appear at the right of their parent */
.nav ul .dropdown:hover ul {
left: 160px;
top: 0px;
}
/* The submenu links have a different arrow which indicates another dropdown submenu */
.nav ul .dropdown a::after {
width: 6px;
height: 6px;
border-bottom: 0;
border-right: 1px solid #fff;
border-top: 1px solid #fff;
top: 12px;
}
/* Changing the color of the arrow on hover */
.nav ul .dropdown:hover>a::after, .nav ul .dropdown>a:hover::after {
border-right: 1px solid #0fd0f9;
border-top: 1px solid #0fd0f9;
}
.dropdown .sub-menu{background:rgba(34,136,170,1) !important; display:block; padding-bottom:20px;z-index:9999; border-radius:10px;}

#LogoutLink {
    margin-top: 20px;
}

.navbar-nav.navbar-right.avatar-account {
  list-style: outside none none;
}

/* Hyperlinks
============================================================================================== */
a {text-decoration: none; color:#CC66FF
}
a:hover {text-decoration: none}
a:focus {outline: thin dotted}
a:hover, a:active {outline: none;} /* Better CSS Outline Suppression */


/******************End of Navigation Menu***********************/

.card-transparent {
    background-color:transparent !important;
    margin-bottom: 20px;
	/*height:200px;*/
	text-align:center;
}

.card-transparent a {
    color: #333333;
}
.card-transparent:hover {
    color: #555555;
}
.card-transparent .header {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 20px;
    margin-top: 10px;
}

.card-transparent .desc {
    font-size: 14px;
    margin-bottom: 5px;
    margin-top: 0;
}
.card-transparent .desc2 {
    font-size: 14px;
    margin-bottom: 5px;
    margin-top: 0px;
    padding: 10%;
    margin-left: 10%;
    margin-right: 10%;
    text-align: left !important;
    background-color: #dddddd;
    min-height: 250px;
    border-radius: 10PX;
}

.mdi {
    font-size:8em;
	text-align:center;
}
.logo{
	font-size:28px;
	padding:10px;    
	color:#000;
}
.logo img{
	width:20%;
    	/*padding:2px 10px;*/
	}

.navbar-default .navbar-nav > li > a:not(.btn) {
    color: #ed1f24 !important;
}

.navbar-default .navbar-nav > li > a:not(.btn):hover {
    color: #333333 !important;
}


.content li {
    list-style: outside none none;
}
h1, .h1, h2, .h2, h3, .h3, h4, .h4 {
    font-weight: 300;
    margin: 0px 0 15px !important;
}
/*.e-services-content {
	padding-top:50px;
    background: red; /* For browsers that do not support gradients */        
    /*background: -webkit-linear-gradient(-90deg, #3998b8, #afd4ee); /* For Safari 5.1 to 6.0 */
    /*background: -o-linear-gradient(-90deg, #3998b8, #afd4ee); /* For Opera 11.1 to 12.0 */
    /*background: -moz-linear-gradient(-90deg, #3998b8, #afd4ee); /* For Firefox 3.6 to 15 */
    /*background: linear-gradient(-90deg, #3998b8, #afd4ee); /* Standard syntax (must be last) */
	
/*}*/
.container{
	width:100% !Important;
}
.footer {
    background-color: #dddddd;
    bottom: 0 !important;
    line-height: 15px !important;
    position:relative;
	width:100%;
	height:4em !important;
	overflow:hidden;
	
}
.footer-logo{width:70px;padding:5px;}
.footer-logo img{
		width:80%;height:80%;padding:5px;}
.footer .copyright {
    color: #333333 !important;
    font-size: 14px;
    line-height: 20px;
    margin: 10px 3px;
    padding: 10px 5px;
}

@media (max-width: 480px){
    .card-transparent{margin-left:0% !important;margin-right:0% !important;}
	.e-services-content {height: cover}
	.form-control{width:100%;max-width:100%;}
	.mdi {font-size:6em;text-align:center;}
    .footer-logo{width:60px;padding:5px;}
    .footer-logo img{width:80%;height:80%;padding:5px;}
    .footer .copyright {color: #333333 !important; font-size: 11px; line-height: 15px;margin: 10px 3px;padding: 10px 5px;}
    .logo{	font-size:20px;	padding:10px;	color:#333333;    text-align:center;}
    .navbar-nav > li {    float: left;    position: relative;    display: block;}
    .avatar-account {margin:0 auto; width:100%; border-top:1px solid #cccccc; }
    .card-transparent .desc2 {    font-size: 14px;    margin-bottom: 5px;    margin-top: 0;    padding:10%;    text-align:left !important;}
    .visitor{font-size:10px !important; }
    .log-out { font-size: 10px !important;  }

}
@media(max-width: 800px){
     .visitor {    float: left !important;}
     /*.nav{margin-left:20% !important;}*/
     .nav{margin-left:100% !important;}
	

}

@media (max-width: 768px){
    .visitor {    float: left !important;}
    .card-transparent{margin-left:20%;margin-right:20%;}
	.e-services-content {height: cover}
	.form-control{width:100%;max-width:100%;}
	.mdi {font-size:6em;text-align:center;}
    .logo{	font-size:20px;	padding:10px;	color:#333333;    text-align:center;}
    .navbar-nav > li {    float: left;    position: relative;    display: block;}
    .avatar-account {margin:0 auto; width:100%; border-top:1px solid #cccccc; }


}
@media (max-width: 700px){
    .card-transparent .desc2 {
    font-size: 14px;
    margin-bottom: 5px;
    margin-top: 0;
    padding:10%;
    text-align:left !important;
}
	.e-services-content {height: cover}
	.form-control{width:100%;max-width:100%;}
	.mdi {font-size:6em;text-align:center;}
    .logo{	font-size:20px;	padding:10px;	color:#333333;    text-align:center;}
    .navbar-nav > li {    float: left;    position: relative;    display: block;}
    .avatar-account {margin:0 auto; width:100%; border-top:1px solid #cccccc; }
}
@media (min-width: 992px){
	.e-services-content {height: 100%}
    .typo-line{
        padding-left: 140px;
        margin-bottom: 40px;
        position: relative;
    }

    .typo-line .category{
        transform: translateY(-50%);
        top: 50%;
        left: 0px;
        position: absolute;
    }
}

.all-icons [class*="pe-"]{
    font-size: 40px;
}
.all-icons input{
    border: 0;
}
.all-icons .font-icon-detail{
    text-align: center;
    padding: 45px 0px 30px;
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    margin: 15px 0;
}
.all-icons .font-icon-detail input{
    margin: 25px auto 0;
    width: 100%;
    text-align: center;
    display: block;
    color: #aaa;
    font-size: 13px;
}

#map{
    position:relative;
    width:100%;
    height: calc(100% - 60px);
}

.places-buttons .btn{
    margin-bottom: 30px
}
.sidebar .nav > li.active-pro{
    position: absolute;
    width: 100%;
    bottom: 10px;
}
.sidebar .nav > li.active-pro a{
    background: rgba(255, 255, 255, 0.14);
    opacity: 1;
    color: #FFFFFF;
}

.table-upgrade td:nth-child(2),
.table-upgrade td:nth-child(3){
    text-align: center;
}

/*old  ---- main background color
.main-panel {
    background: rgba(203, 203, 210, 0.15) none repeat scroll 0 0;
    margin: 0 auto;
    position: relative;
    width: 100%;
    z-index: 2;
    float:none !important;
   
    /*overflow:scroll;
   
}*/
 .main-panel {
    background: #81d4fa;
    margin: 0 auto;
    position: relative;
    width: 100%;
    z-index: 2;
    float:none !important;
   
    
   
}
.content li {
    list-style: outside none none;
}

.e-services-content {
    padding-top:50px;
    padding-bottom:100px;
   
}


.card .content {
    padding: 15px 15px 10px 15px;
    margin-bottom: 100px;
}
#ContentPlaceHolder1_btnSearch {
    border: medium none;
    border-radius: 0 5px 5px 0;
    color: #222222;
    height: 30px;
    width: 70px;
}
#ContentPlaceHolder1_txtSearch {
    border: medium none;
    border-radius: 5px 0 0 5px;
    height: 30px;
    padding: 0 10px;
    width: 300px;
                border:1px solid #dddddd;
}
.input-group {
    margin-bottom: 30px;
    margin-left: auto;
    margin-right: auto;
    width: 400px;
}

.log-out {
    border-left: 1px solid #999999;
    margin-top: 10px;
    font-size:12px;
    float:right !important;
}
.log-out a:hover {
    color:#ef2c2c !important;
}
.breadcrumb {
    padding: 0 15px 0 15px !important;
    margin-bottom: 20px !important;
    background-color: #e7e7e7 !important;
    list-style: none !important;
    border-radius: 4px !important;
    margin-left:10% !important;
    margin-right:10% !important;
}

.panel-default > .panel-heading {
    color: #ffffff;
    background-color: rgba(0,0,0,0.3) !important;
    border-color: rgba(0,0,0,0.3) !important;
    border-radius: 10px 10px 0 0 !important;
}

.panel-default {
    border-color:none !important;
    border:none !important;
    width: 80% !important;
    margin: 0 auto !important;
    padding-top: 50px !important;
    background-color: none !important;
    background:none !important;

}
.panel-body {
    background-color: #efefef;
    min-height: 200px;
    border-color: lightGray !important;
    border-radius: 0 0 10px 10px !important;
}

.mdi {
    padding: 20px !important;
    /*border: 1px solid #dddddd !important;*/
    border-radius: 10px !important;
    /*background-color: #efefef;*/

}



@media screen and (-webkit-min-device-pixel-ratio:0) {
/* Safari-Opera specific declarations here */

.footer{   position:absolute !important;   bottom:0 !important}
}

/*custom header color
.navbar-default {
    background-color: #dedede;
    /*border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom: 1px solid medium;
}*/
 .navbar-default {
    background-color: #eeeeee;
    /*background-image: url(/img/GACSMSb-04.png);*/
    background-image: url(/img/GACSMSb.jpg);
    height: 140px !important;
    background-size: cover;
    border-bottom: 1px solid medium;
}

ul.nav {
    margin-top: 40px;
}


.mGrid th {
    color: #fff !important;
}