/* xs-breakpoint */
@media (max-width: 576px)
{

.searchwindow
{
	position : absolute;
	top : 25% !important;
	width : 100%;
	
}
	
}

/* sm-breakpoint */
@media (min-width: 576px) {  

.searchwindow
{
	position : absolute;
	top : 20%;
	width : 100%;
}
}



.topwindow
{
	position : relative;

}
.mynav
{
	position : absolute;
	top : 0;
	left : 0;
	z-index : 20;
	width : 100%;
	height : auto;
	
}
.stick
{
	position : fixed;
	top : 0;
	background-color : rgba(105, 36, 166, 0.9) !important;
	z-index : 15;
	width : 100%;
	box-shadow : 0px 5px 5px 5px rgba(125, 116, 115, 0.8);
	transition : 0.7s ease all;
}
.stick .stickhide
{
	display : none;
	transition : 0.4s ease all;
}

.logo
{
	width : 100%;
	height : auto;
}
.navcontainer
{
	padding-top : 0.5em;
	padding-bottom : 0.5em;
}
.nav-anchor
{
	text-decoration : none;
	color : #656168;	
	padding-left : 10px;
	padding-right : 10px;
	border-bottom : 1px solid transparent;
	
	
}
.nav-anchor:hover
{
	text-decoration : none;
	color : #6924a6;
	padding-left : 10px;
	padding-right : 10px;
	
	border-bottom : 1px solid #6924a6;
	transition : 1s ease all;
	
	
}
.action-anchor
{
	padding : 7px;
	padding-left : 10px;
	padding-right : 10px;
	border : 1px solid gray;
	border-radius : 3px;
	text-decoration : none;
	margin-right : 6px;
	color : #656168;
	transition : 0.4s ease all;
	
}
.action-anchor:hover
{
	padding : 7px;
	padding-left : 10px;
	padding-right : 10px;
	border : 1px solid gray;
	border-radius : 3px;
	text-decoration : none;
	margin-right : 6px;
	color : #ffffff;
	background-color : #6924a6;
	transition : 0.4s ease all;
	
}
.logodark
{
	display : block;
}
.logolight
{
	display : none;
}

.stick .action-anchor
{
	color : white;
}

.stick .nav-anchor
{
	color : white;
	border-bottom : 1px solid transparent;
}
.stick .nav-anchor:hover
{
	color : white;
	border-bottom : 1px solid #ffffff;
	transition : 1s ease all;
}
.stick .logodark
{
	display : none;
}
.stick .logolight
{
	display : block;
}

.stick .action-anchor:hover
{
	padding : 7px;
	padding-left : 10px;
	padding-right : 10px;
	border : 1px solid gray;
	border-radius : 3px;
	text-decoration : none;
	margin-right : 6px;
	color :  #6924a6;
	background-color : #ffffff;
	transition : 0.4s ease all;
	
}

.anchorsdiv
{
	padding-top : 0.55em;
	
}
.actionsdiv
{
	padding-top : 0.38em;
}
.menuburger
{
	font-size : 1.2em;
	margin-left : 0.4em;
	margin-right : auto;
	color : #656168;
	
}
.stick .menuburger
{
	font-size : 1.2em;
	margin-left : 0.4em;
	margin-right : auto;
	color : #ffffff;
	
	
}
.burgericon
{
	color : #656168;
	text-align : center;
}
.stick .burgericon
{
	
	color : #ffffff;
}










.searchwindow
{
	position : absolute;
	top : 40%;
	width : 100%;
}

.search-container
{
	background-color : #c7c3c3;
	padding : 0.65em;
	border-radius : 0.35em;
}
.searchminibox
{
	display : block;
}

.searchminibox .microlabel
{
	font-size : 0.7em;
	margin-bottom : 0.42em;
}
.searchminibox .searchlist
{
	width : 100%;
	padding : 0.5em;
	outline : none;
	border : none;
	border-radius : 0.22em;
	margin-bottom : 0.675em;
	
}
.searchminibox .border-right-1px
{
	
	border-right : 1px solid #c4c3c9;
}





.logincards
{
	width : 100%;
	height : auto;
}
.logincards > button
{
	width : 49%;
	height : auto;
	padding : 8px;
	text-align : center;
	display : inline-block;
	border : none;
	margin : none;
	cursor : pointer;
	margin-right : 0px !important;
}

.highletercard
{
	background-color : #3949ab;
	color : #ffffff;
}











.footer
{
	background-color : #edf2ee;
	color : #7a827c;
}

.footer-tile
{
	padding : 1.2em;
	
}

.footer-tile-decorator
{
	padding-bottom : 0.6em;
}
.footer-tile-content
{
	font-size : 0.85em;
}

.footer-anchor
{
	text-decoration : none;
	display : block;
	color : inherit;
}

.footer-anchor-sm
{
	font-size : 1.2rem;
	text-decoration : none;
	padding : 0.2em;	
	color : inherit;
	transition : 0.5s ease all;
	
}
.footer-anchor-sm:hover
{
	font-size : 1.2rem;
	text-decoration : none;
	padding : 0.2em;	
	color : #5f5fde;
	transition : 0.5s ease all;
}


.center-text
{
	text-align : center;
}
.footer2
{
	padding : 0.75em;
	background-color : #c8cfca;
	color : #7a827c;
	font-size : 0.85em;
}








/* The side nav begins */



.sidenavx
{
	 height: 100%; /* 100% Full-height */
    width: 0; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 98; /* Stay on top */
    top: 0; /* Stay at the top */
    left: 0;
    background-color: rgba(0, 0, 0, 0.6); 
	color : #8f8f8f;
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 10px; /* Place content 60px from the top */
    /* 0.5 second transition effect to slide in the sidenav */
}

/* The side navigation menu */
.sidenav {
    height: 100%; /* 100% Full-height */
    width: 0; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 99; /* Stay on top */
    top: 0; /* Stay at the top */
    left: 0;
    background-color: #ffffff; 
	color : #8f8f8f;
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 10px; /* Place content 60px from the top */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

/* The navigation menu links */
.sidenav > a {
    padding: 8px 8px 8px 18px;
    text-decoration: none;
    font-size: 1em;
    color: #8f8f8f;
    display: block;
    transition: 0.3s;
	border-bottom : 1px dotted #099e48;
	
}

/* When you mouse over the navigation links, change their color */
.sidenav > a:hover {
    color: #f1f1f1;
	background-color : #212429;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
    position: absolute;
    top : 0;
    right: 25px;
    font-size: 1rem;
    margin-top: 7px;
    margin-left: 25px;
	background-color : red;
	
	border-radius : 50%;
}







/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
    .sidenav {padding-top: 15px;}
    .sidenav a {font-size: 18px;}
}


.sidenav-drop
{
	display : none;
}
.sidenav-drop-anchor
{
	font-size : 0.85em;
	font-weight : bold;
	 padding: 8px 8px 8px 50px;
    text-decoration: none;
    
    color: #000000;
    display: block;
    transition: 0.3s;
	border-bottom : 1px dotted #f78c00;
}
.sidenav-drop-anchor:hover
{
	font-size : 0.85em;
	font-weight : bold;
	 padding: 8px 8px 8px 50px;
    text-decoration: none;
    
    color: #000000;
    display: block;
    transition: 0.3s;
	border-bottom : 1px dotted #f78c00;
}








/* The side nav ends */




.redformbg
{
	border : 2px solid red;
	background-color : #ffe2e2;
}


.orangebg
{
	background-color : orange !important;
}








.jobcard
{
	padding : 0.6em;
	padding-left : 1em;
	padding-right : 1em;
	background-color : #f5f5fa; /* or f0 fo f5 */
	color : #666566;
	margin-top : 1em;
	border-radius : 0.4em;
	transition : 0.3s ease all;
}

.jcshadow
{

	box-shadow : 0px 2px 2px 2px rgba(125, 116, 115, 0.2);
	transition : 0.3s ease all;
}

.jobcard:hover
{
	padding : 0.6em;
	padding-left : 1em;
	padding-right : 1em;
	background-color : #ffffff; /* or f0 fo f5 */
	color : #666566;
	margin-top : 1em;
	border-radius : 0.4em;
	transition : 0.3s ease all;
}
.jcshadow:hover
{

	box-shadow : 0px 3px 3px 3px rgba(125, 116, 115, 0.5);
	transition : 0.3s ease all;
}
.jc-jobtitle
{
	font-size : 1.1em;
	font-weight : bold;
}
.tidbits
{
	padding : 0.35em;
	border : 1px solid #f2f5f7;
	border-radius : 0.8em;
	box-shadow : 0px 1px 1px 1px rgba(125, 116, 115, 0.25);
	margin : 0.25em;
	display : inline-block;
	cursor : pointer;
}
.tidbits:hover
{
	padding : 0.35em;
	border : 1px solid #f2f5f7;
	border-radius : 0.8em;
	box-shadow : 0px 1px 1px 1px rgba(125, 116, 115, 0.25);
	margin : 0.25em;
	display : inline-block;
	cursor : pointer;
	color : white;
	background-color : #6924a6;
}

.tag-heading
{
	font-size : 1.4em;
	font-weight : bold;
	color : gray;
}
tag
{
	font-size : 0.8em;
	color : gray;
}












.header-stick
{
	background-color : rgba(240, 232, 255, 1);
}


.clear-both
{
	clear : both;
	
}


.panel
{
	border : 1px solid #cbcbd4;
	border-radius : 0.35em;
	color : #49494d;
	margin-bottom : 1em;
}
.panel-header
{
	background-color : #dad3e6;
	padding-top : 0.4em;
	padding-right : 0.5em;
	padding-bottom : 0.4em;
	padding-left : 0.5em;
	font-weight : bold;
	font-size : 0.85em;
}
.panel-content
{
	padding : 0.5em;
}
.panel-footer
{
	padding : 0.2em;
	border-top : 1px solid #cbcbd4;
	font-size : 0.75em
}


input[type="range"] {
  accent-color: coral;
}

.generic-title
{
	margin-bottom : 0.6em;
}



.gtinput
{
	padding : 0.35em;
	width : 100%;
	display : block;
	outline : none;
	border : none;
	
	border-bottom : 1px solid #9d95ab;
	margin-bottom : 0.6em;
}

.gtinput:focus
{
	padding : 0.35em;
	width : 100%;
	display : block;
	outline : none;
	border : none;
	border-bottom : 1px solid #9d95ab;
	border-radius : 0.3em;
	box-shadow : 0px 2px 2px 2px rgba(125, 116, 115, 0.2);
	margin-bottom : 0.6em;
	
}
.gtinput-text
{
	font-size : 0.6em;
}
.gt-theme-color
{
	background-color : #ffffff;
	color : rgb(105, 36, 166);
	border: 1px solid rgb(105, 36, 166);
}
.gt-theme-color:hover
{
	background-color : rgba(105, 36, 166, 1);
	color : #ffffff;
	border: 1px solid rgb(105, 36, 166);
}

.fontsm
{
	font-size : 0.8em;
}
.fontxs
{
	font-size : 0.6em;
}
.fontbold
{
	font-weight : bold;
}
.deletebtn
{
	color : #ff0000;
	padding : 0.7em;
	cursor : pointer;
}

.tictac
{
	padding : 0.25em;
	padding-left : 1em;
	padding-right : 1em;
	border : 1px solid #f2f5f7;
	border-radius : 0.8em;
	box-shadow : 0px 1px 1px 1px rgba(125, 116, 115, 0.25);
	margin : 0.25em;
	display : inline-block;
	cursor : pointer;
}
.tictac:hover
{
	padding : 0.25em;
	padding-left : 1em;
	padding-right : 1em;
	border : 1px solid #f2f5f7;
	border-radius : 0.8em;
	box-shadow : 0px 1px 1px 1px rgba(125, 116, 115, 0.25);
	margin : 0.25em;
	display : inline-block;
	cursor : pointer;
	color : white;
	background-color : #6924a6;
}
.tictacbtn
{
	width : 1.8em;
	text-align : center;
	
	color : #ff0000;
	display : inline-block;
	border-radius : 1em;
	padding-bottom : 0.25em;
}
.tictacbtn:hover
{
	width : 1.8em;
	text-align : center;
	color : #ff0000;
	background-color : #ff0000;
	color : #ffffff;
		display : inline-block;
		border-radius : 1em;
	padding-bottom : 0.25em;
}

.profilerange
{
	padding : 0.2em;
	border-radius : 0.2em;
	background-color : #6924a6;
	display : inline-block;
	margin : 0;
	height : 0.4em;
	line-height : 0.4em;
	
}

.gt-hide
{
	display : none;
}

.cpointer
{
	cursor : pointer;
}
.overflow-x-hidden
{
	overflow-x : hidden;
}
.user-profile-picture
{
	width : 60%;
	height : auto;
	margin-left : 20%;
}


.gt-ruler
{
	padding : 1em;
	padding-top : 0.5em;
	padding-bottom : 0.5em;
	background-color: #edf2ee;
    color: #7a827c;
	text-decoration : none;
	display : block;
	margin-bottom : 0.68em;
}

.gt-ruler:hover
{
	padding : 1em;
	padding-top : 0.5em;
	padding-bottom : 0.5em;    
	background-color: rgba(240, 232, 255, 1);
    color: #7a827c;
	text-decoration : none;
	display : block;
	margin-bottom : 0.68em;
}


.gt-ruler-active
{
	padding : 1em;
	padding-top : 0.5em;
	padding-bottom : 0.5em;
	background-color: rgba(240, 232, 255, 1);
    color: #7a827c;
	text-decoration : none;
	display : block;
	margin-bottom : 0.68em;
}