﻿* {	margin:0px; padding:0px; box-sizing: border-box;}



/**************** PRINT ******************/








body {font-family:Arial, Helvetica, sans-serif; 
	
	
	


background-color:#25385c;
background-color:#FFFFFF;
background-color:#e4e4e5;
}


h2 {color:#666666;}

.bubble {padding:20px; font-size:20px; line-height:30px;border-radius:20px; margin:15px 0px 0px 0px; color:#666666;}	
/* .bubble:hover {padding:30px; transition-duration: 1s;}  */
.b-pink {background-color:#f4e8f2; }		 
.b-blue {background-color:#d7ecf5; }		
.b-green {background-color:#d7f5de; }	
.b-right {margin-left:50px;}
.b-left {margin-right:50px;}
.orange {background-color:#ebc696;}

hr {margin:30px 0px 30px 0px; clear:both; background-color:#eeeeee;}

.title {font-family:Noto Sans; padding:20px; font-size:30px; line-height:30px; border-radius:20px; text-decoration:none !important;  text-align:center; margin:0px 0px 15px 0px; color:#666666;}
.title a {text-decoration:none !important;}

textarea {font-size:20px; border-radius:20px; line-height:30px; padding:20px; color:#666666; width:100%; border:2px dashed #cccccc !important;}

textarea:focus, input:focus {outline:none !Important;}

input[type=submit] {padding:15px; margin:10px 0px 0px 0px; border-radius:20px; background-color:#ebc696; color:#ffffff; cursor:pointer;  border:0px; font-size:18px;}
input[type=submit]:hover {background-color:#debc90;}


.adminButton {padding:7px; border-radius:10px; cursor:pointer; background:none; color:#666666; border:1px solid #cccccc;}
.adminButton:hover {background-color:#cccccc;} 
.adminButton:active {background-color:#cccccc; border:0px;} 

.likeDiv {float:right !important; font-size:16px; text-align:right !important; margin:20px 2px 0px 0px; color:#999999;}
.likeDiv img {width:16px !Important; margin:0px 3px -2px 0px;}
	.likeDiv:hover img {width:20px !important; }
	.likeDiv:hover {font-size:24px !important; }
	



a {color:#25385c;}

.header {width:100%; 
background-color:#cccccc; 
height:60px; color:#FFFFFF; padding:00px 8px 00px 30px;  margin:0px 0px 30px 0px; border-bottom:10px solid #897327; }

.logo, logo a {
width:300px; 
font-family: "Gill Sans", "Gill Sans MT", "Calibri", "Trebuchet MS", sans-serif;
font-weight:normal; 
font-size:20px; 
padding:14px 0px 0px 0px; 
color:#FFFFFF !important;
float:left;}

.nav {padding:00px 0px 0px 0px; }
.nav ul {list-style-type:none; margin:0px; padding:0px; overflow:hidden;}
.nav li {float:left;}
.nav li a {display:block; color:#FFFFFF; padding: 18px 14px 22px 14px; text-decoration:none;}
.nav li a:hover {background-color:#897327; color:#FFFFFF;}



.tab30 {margin:0px 0px 0px 30px;}
.tab60 {margin:0px 0px 0px 60px;}
.tab90 {margin:0px 0px 0px 90px;}
.tab120 {margin:0px 0px 0px 120px;}
.tab150 {margin:0px 0px 0px 150px;}



.row:after {
    content: "";
    clear: both;
    display: -webkit-flex;
	display: flex;
}

.row {
 display: -webkit-flex;
 display: flex;
 width:100%;
}



.main {padding:30px 30px 30px 30px; border-radius:20px; margin:auto; margin-top:30px; position:inherit; }

@media screen and (max-width: 500px) {
	.main {padding:10px; border-radius:0px; position:inherit; }
	.topnav {margin:0px 0px 0px 0px !important;}
	.adminButton {margin:-20px 20px 0px 0px;}
}



.white {background-color:#ffffff;}

.lefts {background-color:#cccccc;}
.rights {background-color:#7E2021;}

.roleList {width:200px; float:left;}

.honey {display:none;}


.background {padding:10px 15px 10px 15px; background-color:#cccccc; width:100%; border-radius:5px;}




.one-half {width:50%;}

.w49 {width:49%;}
.w49 {width:49%;}
.w100 {width:100%;}
.right {float:right;}

.success_message_top {
	background-color:#d7f5de;
	color:#333333; padding:15px;
	}

.fade-in {visibility: visible;
  	opacity: 1; 
 	transition: opacity 5s linear;}


.success_message_in {
	background-color:#569c60;
	color:#FFFFFF; padding:10px; margin-top:5px; border-radius:5px;
	transition: transform 2s;
	
}


.success_subtract {margin:0px 0px 0px 0px !important;}

.massTimes-list {width:160px; float:left;}

.highlight {padding:15px 15px 15px 15px; border-radius:5px; background-color:#eeeeee;}


/* for showing open fields in special schedule faded out */
.open {color:#999999 !important;}


.glyphicons:before {padding:0px 8px 0px 0px;}





/****************  TABLES ******************/

.schedule table {border-spacing:0px; border-collapse:collapse; overflow-x:auto;   }
.schedule td {border:1px solid #cccccc; padding:10px 12px 10px 12px; font-siz:14px; background-color:#ffffff; }

.schedule th {background-colors:#d7ecf5; border:1px solid #cccccc; color:#333333;  padding:20px 12px 20px 12px; font-size:18px; font-weight:normal; }




.adminTable table {border-spacing:0px; border-collapse:collapse; overflow-x:auto;}
.adminTable td {border:1px solid #CCCCCC; padding:10px 12px 10px 12px; font-size:15px !Important; }
.adminTable th {background-color:#41557c; border:1px solid #CCCCCC; color:#FFFFFF; padding:10px 12px 10px 12px; font-size:15px !Important; font-weight:normal; }


a .admin {display:inline;}

/****************  LINKS AND BUTTONS *******************/
a.adminbutton {
    text-decoration: none;
}


a.delete:link  {
	color:#bd1313 !important;
}

a.delete:visited {
	color:#bd1313 !important;
}

.editbutton {float:right;; width:80px; height:15px !important; text-align:right; margin-top:5px;}


.message {background-color:#e4e4e5; padding:12px 12px 12px 12px; border-radius:5px; margin:10px 0px 0px 0px; line-height:22px; font-size:16px; }


.message-light-blue {background-color:#ccd7dc; padding:12px 12px 12px 12px; border-radius:5px; margin:10px 0px 0px 0px; line-height:22px; font-size:16px;}

.message-blue {background-color:#41557c; color:#ffffff;  padding:12px 12px 12px 12px; border-radius:5px; margin:10px 0px 0px 0px; line-height:22px; font-size:16px;}


.tip {background-color:#e4e4e5; padding:10px 10px 10px 32px; border-radius:5px; margin:10px 0px 0px 0px; line-height:22px; font-size:14px;}


.tip span {margin:0px 0px 0px -22px; line-height:22px;}
.light-green {background-color:#85d287;}

.green {color:#1B7020;}
.blue-text {color:#25385c;}

.warning {padding:15px 15px 15px 15px; border-radius:5px; background-color:#ebe495; font-size:16px !important;}

.blue {background: #41557c;}
.green2 {background: #74ba83;}
.green3 {background: #0B6022;} 

.blue:hover {background:#999999;}

.grey9 {background-color:#999999;}
.grey9:hover {background-color:#41557c;}


.grey6 {background-color:#666666;}

.light-grey {background-color:#eef2f5;}
.gold { background: #898667; cursor: pointer;}
.gold:hover {background:#777457;} 
.red {background-color:#cc3333; color:#FFFFFF;}
.red:hover {background-color:#cc0000;} 
.yellow {background-color:#f3f0a8 !important;}
.light-yellow {background-color:#f7faf0 !important;}



.label {
	font-weight:bold !Important;
	margin-bottom:3px;
	
}


.buttonimg img {

	margin:0px 8px -2px 0px;
	
}

.button-footer {  
	display:inline-block;  
    height:30px;
    padding:0px;
    margin:auto;
    text-align:center;
    color: #FFFFFF;
    text-align: center;
    font-size:14px;
    text-shadow: 1px 1px #333333;
    border-radius:3px !Important;
    margin:0px 0px 15px 3px;
    border:0px !Important;
    line-height:22px;
    cursor:pointer;
    text-decoration: none;
    padding:0px 10px 0px 10px;
       }


.button-medium {  
	display:inline-block;  
    text-align:center;
    color: #FFFFFF;
    font-size:15px;
    text-shadows: 1px 1px #333333;
    border-radius:3px !Important;
    margin:0px 0px 15px 0px;
    border:0px !Important;
    line-height:15px;
    cursor:pointer;
    text-decoration: none;
    padding:15px 15px 15px 15px;
    vertical-align:middle;
	widths:200px;
       }

.button-medium img {
	margin:0px 8px -2px 0px;
}


.button-large {  
	display:inline-block;  
    heights:30px;
    padding:0px;
    margin:auto;
    text-align:center;
    color: #FFFFFF;
    text-align: center;
    font-size:17px;
    text-shadows: 1px 1px #333333;
    border-radius:3px !Important;
    margin:0px 0px 15px 0px;
    border:0px !Important;
    line-height:20px;
    cursor:pointer;
    text-decoration: none;
    padding:22px 20px 22px 10px;
    vertical-align:middle;
	widths:200px;
       }


.home-button-large {  
	display:inline-block;  
    width:100%;
    min-height:100px;
    max-width: 300px;
    max-height:150px;
    padding:0px;
    margin:auto;
    text-align:center;
    color: #FFFFFF;
    text-align: center;
    font-size:1.3em !Important;
    text-shadow: 1px 1px #333333;
    border-radius:3px !Important;
    margin:0px 3px 15px 0px;
    border:0px !Important;
    line-height:22px;
    cursor:pointer;
    text-decoration: none;
    box-shadow: 1px 1px 1px 0px #666666;
   
    }



.button-small {
	display:inline-block;  
    heights:30px;
    padding:0px;
    margin:auto;
    text-align:center;
    color: #FFFFFF;
    text-align: center;
    font-size:12px;
    text-shadows: 1px 1px #333333;
    border-radius:3px !Important;
    margin:0px 0px 0px 0px;
    border:0px !Important;
    line-height:12px;
    cursor:pointer;
    text-decoration: none;
    padding:5px 12px 5px 12px;
    vertical-align:middle;
	widths:200px;
       }

.green-bg {background-color:#89a597 !important; color:#ffffff !Important; }

.button-signup {  
	displays:inline-block;  
    height:30px;
    padding:0px;
    margin:auto;
    text-align:center;
    color: #FFFFFF;
    text-align: center;
    font-size:14px;
    text-shadows: 1px 1px #333333;
    border-radius:3px !Important;
    margin:0px 0px 0px 3px;
    border:0px !Important;
    line-height:22px;
    cursor:pointer;
    font-size:15px;
    text-decoration: none;
    padding:4px 10px 4px 10px;
    vertical-align:middle;
    
    }




.button-admin {  
	displays:inline-block;  
    heights:30px;
    margin:auto;
    text-align:center;
    color: #ffffff;
    text-align: center;
    font-size:14px !important;
    text-shadows: 1px 1px #333333;
    border-radius:15px !Important;
    margin:0px 0px 0px 2px;
    border:0px !Important;
    line-height:15px;
    cursor:pointer;
    font-size:17px !important;
    text-decoration: none;
    padding:15px 14px 15px 14px;
    vertical-align:middle;
	font-weight:normal;
    
    }

.button-admin img {margin:0px 10px -2px 0px;}

.button-sub {  
	displays:inline-block;  
    heights:30px;
    margin:auto;
    text-align:center;
    color: #FFFFFF;
    text-align: center;
    font-size:14px;
    text-shadows: 1px 1px #333333;
    border-radius:3px !Important;
    margin:0px 0px 0px 2px;
    border:0px !Important;
    line-height:22px;
    cursor:pointer;
    
    text-decoration: none;
    padding:-2px 10px -2px 1px;
    vertical-align:middle;
	font-size:10px;
    
    }



.pending {color:#666666; font-style:italic; }

.pendingRow td {background-color:yellow !important; font-style:italic; color:#333333;}

.pendingCell {background-color:#ffffcc !important; font-style:italic; color:#000000; font-size:12px;}
.approvedCell {background-color:#ccd7dc !important; font-style:italic; color:#000000; font-size:12px;}

/**************** MINISTERS PAGE ******************/
.ministers table {border-spacing:0px; border-collapse:collapse;}
.ministers td, .ministers th {border:1px solid #CCCCCC; padding:10px 15px 10px 15px;}
.ministers th {background-color:#25385c; color:#FFFFFF; padding:5px 10px 5px 10px; font-weight:bold; }

.ministerRoles {font-size:12px !important;}

/**************** Vacation Dates Table ******************/
.vacationDates table {border-spacing:0px; border-collapse:collapse; border-radius:5px; }
.vacationDates td, .ministers th {border:1px solid #CCCCCC; padding:10px 15px 10px 15px;}
.vacationDates th {background-color:#eeeeee; color:#333333; padding:5px 10px 5px 10px; font-weight:bold; border:1px solid #CCCCCC; border-radius:5px; }

.vacationDates table th:first-child {
    border-radius: 6px 0 0 0;
}

.vacationDates table th:last-child {
    border-radius: 0 6px 0 0;
}

.vacationDates table th:only-child{
    border-radius: 6px 6px 0 0;
}

/******************** Mobile Phones: *********************/

@media only screen and (max-width: 1000px) {



	.header {margin:0px;	}
	
	
	[class*="col-"] {width: 100% !important;} 
	
	.row {display:block;
	width:100%;
	
	}

/* hide my phone nav stuff so below from w3schools can work
	.nav ul, .nav li {float:none;}
	.nav {
	display:none;
	}

*/	

/* from w3schools */

  .nav a:not(:first-child) {display: none;}
  .nav a.icon {
    float: right;
    display: block;
  }

 .nav.responsive {position: relative;}
 .nav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .nav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }



}


/******************** Desktop *********************/

@media only screen and (min-width: 1000px) {

.nav .icon {
    display: none;
}


	
	.left {
	-webkit-order: -1;
    order: -1;}
	
	.row {
 display: -webkit-flex;
 display: flex;
 width:100%;
}
	 
	
	
	
	
	.col-1 {width: 8.33%;}
	.col-2 {width: 16.66%;}
	.col-3 {width: 25%;}
	.col-4 {width: 33.33%;}
	.col-5 {width: 41.66%;}
	.col-6 {width: 50%;}
	.col-7 {width: 58.33%;}
	.col-8 {width: 66.66%;}
	.col-9 {width: 75%;}
	.col-10 {width: 83.33%;}
	.col-11 {width: 91.66%;}
	.col-12 {width: 100%;}


	[class*="col-"] {
    float: left;
   
/*
 padding: 25px 25px 50px 25px;
*/
	}
}
	
    




/*************** FORMS *************************/

.form2 label {margin:00px 0px 8px 0px; display:inline-block; font-weight:bold;}




.form3 label {
  display: block;
  padding-left: 0px;
  text-indent: 0px;
  font-weight:normal !important;
}
.form3 input {
  width: 20px;
  height: 16px;
  margin:0px 5px 0px 0px !Important;;
  padding: 0;
  
  vertical-align: bottom;
  position: relative;
  top: -1px;
  *overflow: hidden;
}


.inline {
	width:50px !important;
	
  
  margin:0px 5px 0px 0px !Important;;
  padding: 6px 6px 6px 6px !important;
  border-radius:5px !important;
  font-size:16px !important;
 


}



#submit-form, .form {


padding:00px; border-radius:3px;
background-colors:#f4f0e2;
background-colors:#FFFFFF;
}

input[type=checkbox] {
width:20px;
height:20px;
margin:2px 0px 0px 0px;
padding:3px 5px 0px 0px;

}


input[type=date] {

margin:2px 0px 0px 0px;
padding:10px;
font-size:18px;

}


#submit-form input[type=text], .form input[type=text], 
#submit-form input[type=number], .form input[type=number], 
#submit-form input[type=password], .form input[type=password], 
#submit-form input[type=email], .form input[type=email], 
#submit-form input[type=tel], .form input[type=tel], 
#submit-form input[type=url], .form input[type=url], 
#submit-form select, .form select, 
#submit-form textarea, .form textarea, .formItem {
    width:100%;
    box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
    -webkit-box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
    -moz-box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
    border:1px solid #CCC;
    background:#FFF;
    margin:5px 0px 15px 0px;
    padding:10px 15px 10px 10px;
    border-radius:5px;
    font-size:18px;
}





#submit-form select, .form select {
	
	max-width:300px !Important;
		
		}


.selectwide {
	
	width:100%;
}


#submit-form label span, .form label {
	cursor:pointer;
	color:#333333;
	display:block;
	margin:0px 0;
	font-weight:bold;
}



#submit-form input[type=tel], .form input[type=tel] {width:31%;} 




#submit-form button[type=submit], .form button[type=submit] {
    cursor:pointer;
    width:100%;
    border:none;
     color:#FFF;
    margin:0 0 5px;
    
    border-radius:5px;
    font-size:16px;
    text-shadow: 1px 1px #333333;
    line-height:17px;
	padding:15px 10px 15px 10px;

}

::-webkit-input-placeholder {
    color:#888;
}
:-moz-placeholder {
    color:#888;
}
::-moz-placeholder {
    color:#888;
}
:-ms-input-placeholder {
    color:#888;
}



/* show and hide */
.hide {
	display:none;
}


.show {
	
	display:block;
}

/* ////////////////////////////

W3 Schools Navigation styling

///////////////////////////////


/* Add a black background color to the top navigation */
.topnav {
    background-color: #cccccc;
    overflow: hidden;
	border-bottom: 0px solid #cccccc;
	margin:0px 0px 0px 0px;
	

}

/* Style the links inside the navigation bar */
.topnav a {
    float: left;
    display: block;
    color: #333333;
    text-align: center;
    padding: 25px 16px 25px 16px;
    text-decoration: none;
    font-size: 16px;
	margin:0px 0px 0px 0px;
}

.navLogo {
	font-size:20px !Important; 
	padding: 25px 120px 20px 15px !Important;
	margin:0px 0px 0px 0px !important;
}

.logOut {
	float:right !Important;
}

/* Change the color of links on hover */
.topnav a:hover {
    background-color: #999999;
    color: #333333;
} 
.active {background-color:#999999; color:#333333;}


/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
    display: none;
	font-size:24px;
	padding:10px 10px 10px 10px;
}


/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 1000px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 1000px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
	
	  
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  
  .logOut {
	display:block;
	float:none !important;
	text-align:left;
}

  
  
}





@media print {
	
	
	.main {margin-top:20px !important;}
	.message-light-blue {background-color:#eeeeee !Important;}
	
	.no-print {display:none !Important; visibility:hidden !Important;}
	
	
	.schedulesss table {page-break-after: always;}
	.scheduless {page-break-after: always;}
	
	.header, .headers, .previous, .page-nav, page-title, .page-title, .glyphicons, .no-print, .topnav, #mytopNav, hr {display:none;}
	.schedule th {color:#000000 !Important; font-size:14px; background-color:#ffffff !important; }
	.schedule td {font-size:12px;}	
	 @page { size: portrait; margin:0mm 0mm 0mm 0mm;}
	
	body {background-color:#ffffff !important; magin-top:50px;}
	
	.printOnly {display:block !important;}
	
	
}





