Customers portal : Started CSS rework to simply change BS theme

git-svn-id: http://svn.code.sf.net/p/itop/code/trunk@4213 a333f486-631f-4898-b8df-5754b55c2be0

datamodels/2.x/itop-portal-base/portal/web/css/portal.css

@@ -1,1177 +0,0 @@
-/*******************/
-/* Global settings */
-/*******************/
-@media (max-width: 768px){
-	body{
-		padding-top: 60px;
-	}
-	body.home{
-		padding-top: 70px;
-	}
-}
-footer{
-	margin: 5em 1em;
-}
-
-/* Navigation menu */
-.navbar-nav .dropdown-menu a .glyphicon,
-.user_infos .dropdown-menu a .glyphicon{
-	margin-right: 15px;
-}
-.nav > li > a > span.brick_icon,
-.dropdown-menu > li > a > span.brick_icon{
-	margin-right: 20px;
-	vertical-align: sub;
-}
-/* Topbar */
-#topbar .navbar-header{
-	position: relative;
-	z-index: 2;
-}
-#topbar .navbar-collapse{
-	position: relative;
-	z-index: 1;
-	overflow-y: auto;
-}
-#topbar .navbar-collapse > .navbar-nav{
-	padding-top: 30px;
-}
-#topbar .navbar-collapse > .navbar-nav .divider{
-	height: 1px;
-    margin: 8px 15px;
-    overflow: hidden;
-	background-color: #292827;
-    opacity: 0.6;
-}
-#topbar .navbar-brand{
-	padding: 5px 15px;
-}
-#topbar .navbar-brand > img{
-	max-height: 100%;
-}
-#topbar .user_infos{
-	text-decoration: none;
-}
-#topbar .user_photo{
-	position: absolute;
-	display: block;
-	top: 5px;
-	left: 10px;
-	width: 65px;
-	height: 65px;
-	background-size: 100%;
-	background-position: center center;
-	background-color: #585653;
-	border: 2px solid #FFFFFF;
-	border-radius: 100%;
-	box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.4);
-}
-#topbar .user_fullname{
-	display: inline-block;
-	position: absolute;
-	padding-left: 85px;
-	max-width: 55%;
-	color: #FFFFFF;
-	white-space: nowrap;
-	text-overflow: ellipsis;
-	overflow-x: hidden;
-}
-/* Sidebar */
-@media (min-width: 768px){
-	#sidebar{
-		position: fixed;
-		top: 0px;
-		left: 0px;
-		padding: 0px; /* Overriding BS */
-		height: 100%;
-	}
-	#sidebar .user_card{
-		padding: 30px 0px;
-		background-color: #EA7D1E;
-		background-image: url('../img/backgrounds/geometric-orange.svg');
-		background-size: 170%;
-		background-position: 60% 60%;
-		text-align: center;
-		box-shadow: -3px 2px 3px rgba(0, 0, 0, 0.4);
-	}
-	#sidebar .user_card .user_photo{
-		margin: 0px auto 10px auto;
-		width: 80px;
-		height: 80px;
-		background-size: 100%;
-		background-position: center center;
-		background-color: #585653;
-		background-repeat: no-repeat;
-		border: 2px solid #FFFFFF;
-		border-radius: 100%;
-	}
-	#sidebar .user_card .user_infos{
-		font-size: 1em;
-		color: #FFFFFF;
-	}
-	#sidebar .user_card .user_infos .dropdown-toggle{
-		color: #FFFFFF;
-	}
-	#sidebar .user_card .user_options.dropdown-menu{
-		width: 92%;
-		left: 4%;
-	}
-	#sidebar .user_card .user_fullname{
-		font-weight: 600;
-	}
-	#sidebar .menu{
-		max-height: 59%;
-		overflow-y: auto;
-	}
-	#sidebar .menu .nav > li{
-		line-height: 3.0em;
-	}
-	#sidebar .menu .nav > li:after{
-		content: "";
-		display: block;
-		position: relative;
-		/*margin-left: 6.8em;
-		width: 56%;*/
-		color: #FFFFFF;
-		border-bottom: 1px solid #7D7D7D;
-	}
-	#sidebar .menu .nav > li.active{
-		box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.8) inset;
-	}
-	#sidebar .menu .nav > li.active:after{
-		content: " ";
-		position: absolute;
-		right: 0px;
-		top: 0px;
-		border: 30px solid transparent;
-		border-right-width: 20px;
-		border-right-color: #EDECEC;
-	}
-	#sidebar .menu .nav > li.active > a{
-		margin-top: -1px; /* To mask border from previous li item */
-		/*margin-left: 4em;
-		padding-left: 1em;*/
-	}
-	#sidebar .menu .nav > li > a{
-		/*padding-left: 3em;*/
-		padding-left: 10%;
-		overflow-x: hidden;
-		text-overflow: ellipsis;
-		white-space: nowrap;
-	}
-	#sidebar .menu .nav > li > a > .brick_icon{
-		width: 1.2em;
-		vertical-align: sub;
-		text-align: center;
-		margin-right: 10px;
-	}
-	#sidebar .logo{
-		position: absolute;
-		bottom: 15px;
-		width: 100%;
-		text-align: center;
-	}
-	#sidebar .logo img{
-	width: 40%;
-	max-width: 100%;
-}
-}
-@media (min-width: 992px){
-	
-}
-/* Warning : Not a offical BS breakpoint */
-@media (min-width: 1600px){
-	#sidebar .user_card .user_photo{
-		width: 120px;
-		height: 120px;
-	}
-	#sidebar .menu .nav > li > a > .brick_icon{
-		margin-right: 20px;
-	}
-}
-
-/* Main content */
-@media (min-width: 768px) {
-	#main-wrapper{
-		margin-top: 20px;
-	}
-}
-
-/* Overlays*/
-.global_overlay{
-	z-index: 9999;
-    display: none;
-    position: fixed;
-    top: 0px;
-    left: 0px;
-    width: 100%;
-    height: 100%;
-    background-color: black;
-    opacity: 0.5;
-}
-#page_overlay .overlay_content{
-	margin-top: 20em;
-	width: 100%;
-	color: white;
-}
-.overlay_content{
-	text-align: center;
-}
-.content_loader .icon{
-	margin-bottom: 0.3em;
-	/*width: 52px;*/
-	height: 38px; /* 50px; *//* Hack to make loader circle perfectly */
-	font-size: 3em; /* 4em; */
-	animation: spin 1.2s linear infinite;
-	-webkit-animation: spin 1.2s linear infinite;
-	-moz-animation: spin 1.2s linear infinite;
-	-ms-animation: spin 1.2s linear infinite;
-}
-.content_loader .message{
-	font-size: 1.5em; /* 2em; */
-}
-
-.datatables_overlay{
-	padding: 5% 0px !important;
-	background-color: white;
-}
-
-/******************/
-/* Global classes */
-/******************/
-.vertical-center {
-	/* Make it a flex container */
-	display: -webkit-box;
-	display: -moz-box;
-	display: -ms-flexbox;
-	display: -webkit-flex;
-	display: flex; 
-  
-	/* Align the bootstrap's container vertically */
-	-webkit-box-align : center;
-	-webkit-align-items : center;
-	-moz-box-align : center;
-	-ms-flex-align : center;
-	align-items : center;
-  
-	/* Also 'margin: 0 auto' doesn't have any effect on flex items in such web browsers
-	hence the bootstrap's container won't be aligned to the center anymore.
-  
-	Therefore, we should use the following declarations to get it centered again */
-	-webkit-box-pack : center;
-	-moz-box-pack : center;
-	-ms-flex-pack : center;
-	-webkit-justify-content : center;
-	justify-content : center;
-}
-
-/*********************/
-/* Global animations */
-/*********************/
-/* Spin */
-@keyframes spin{
-	100% {
-		transform: rotate(360deg);
-	}
-}
-@-webkit-keyframes spin{
-	100% {
-		-webkit-transform: rotate(360deg);
-	}
-}
-@-moz-keyframes spin{
-	100% {
-		-moz-transform: rotate(360deg);
-	}
-}
-@-ms-keyframes spin{
-	100% {
-		-ms-transform: rotate(360deg);
-	}
-}
-
-/***************/
-/* BS override */
-/***************/
-@font-face {
-  font-family: 'Glyphicons Halflings';
-
-  src: url('../lib/bootstrap/fonts/glyphicons-halflings-regular.eot');
-  src: url('../lib/bootstrap/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../lib/bootstrap/fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../lib/bootstrap/fonts/glyphicons-halflings-regular.woff') format('woff'), url('../lib/bootstrap/fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../lib/bootstrap/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
-}
-label{
-	font-weight: bold;
-}
-
-/*********************/
-/* BS theme override */
-/*********************/
-body{
-	background-color: #EDECEC;
-}
-a{
-	color: #D46201;
-}
-a:hover, a:focus{
-	color: #C15A02; /* TODO : Darken #D46201 */
-}
-.pagination{
-	margin: 14px 0px; 
-}
-.list-group.tree{
-	margin-top: 11px;
-	margin-bottom: -11px;
-}
-.list-group-item{
-	padding-right: 0px; /* To align all actions on the right without indent */
-}
-.tooltip-inner{
-	max-width: 400px;
-	padding: 15px;
-}
-
-/* Navbars */
-.navbar-fixed-top .navbar-header{
-	box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.4);
-}
-.navbar-fixed-top .navbar-collapse, 
-.navbar-fixed-bottom .navbar-collapse{
-	max-height: 400px;
-}
-
-.navbar-default .navbar-toggle {
-    border-top: none;
-	border-right: none;
-	border-bottom: none;
-	border-radius: 0px;
-	margin-right: 0px;
-}
-.navbar-default .navbar-toggle:hover,
-.navbar-default .navbar-toggle:focus{
-	background-color: inherit;
-}
-.navbar-default .navbar-toggle .icon-bar{
-	height: 3px;
-}
-.navbar-default .navbar-collapse, 
-.navbar-default .navbar-form{
-	border: none;
-}
-
-.navbar-default{
-	background-color: #585653;
-	border: none;
-}
-.navbar-default .nav > li > a,
-.navbar-default .nav.navbar-nav > li > a{
-	color: #FFFFFF;
-}
-.navbar-default .nav > li > a:focus,
-.navbar-default .nav > li > a:hover,
-.navbar-default .nav.navbar-nav > li > a:focus,
-.navbar-default .nav.navbar-nav > li > a:hover{
-	background-color: #FFFFFF;
-	color: #EA7D1E;
-}
-.navbar-default .nav > li.active,
-.navbar-default .nav.navbar-nav > li.active > a{
-	background-color: #292827; /* TODO Darken #585653 */
-	color: #FFFFFF;
-	font-weight: 600;
-}
-
-/* Dropdowns */
-.dropdown-menu>li>a:hover,
-.dropdown-menu>li>a:focus {
-	text-decoration: none;
-    color: #FFFFFF;
-    background-color: #EA7D1E;
-}
-
-.navbar-default .navbar-nav .open .dropdown-menu > li > a{
-	color: #FFFFFF;
-    background-color: inherit;
-}
-
-/* Buttons */
-/* - Default */
-.btn-default,
-.btn-default:active, .btn-default.active,
-.btn-default:hover, .btn-default:focus{
-	color: inherit;
-    background-color: #FFFFFF;
-	background-image: none;
-    border: 1px solid rgba(0, 0, 0, 0.15);
-}
-.btn-default:hover, .btn-default.active:focus{
-	background-color: #FAFAFA; /* TODO : Darken white */
-}
-.btn-default:active, .btn-default.active{
-	background-color: transparent; /* Body background */
-	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15) inset;
-	border: none;
-	border-bottom-color: #EBEAEA;
-}
-.btn-default:active:hover, .btn-default.active:hover, 
-.btn-default:active:focus, .btn-default.active:focus,
-.btn-default:active.focus, .btn-default.active.focus {
-	color: inherit;
-    background-color: #EAEAEA; /* Darken body background */
-	border: inherit;
-}
-/* - Primary */
-.btn-primary,
-.btn-primary:active, .btn-primary.active,
-.btn-primary:hover, .btn-primary:focus{
-	color: #FFFFFF;
-    background-color: #EA7D1E;
-	background-image: none;
-    border: 1px solid rgba(0, 0, 0, 0.15);
-}
-.btn-primary:hover,
-.btn-primary:active:hover, .btn-primary.active:hover, 
-.btn-primary:active:focus, .btn-primary.active:focus, 
-.btn-primary:active.focus, .btn-primary.active.focus{
-	background-color: #DA751C; /* TODO : Darken #EA7D1E */
-}
-
-/* Button groups */
-.btn-group.btn_group_explicit{
-	padding: 7px;
-	background-color: #292827;
-	border: 1px solid #EBEAEA;
-	border-radius: 30px;
-	box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.4) inset;	
-}
-.btn-group.btn_group_explicit .btn{
-	color: #FFFFFF;
-	background-color: transparent;
-	border: none;
-}
-.btn-group.btn_group_explicit .btn.active{
-	color: #6B6965;
-	background-color: #EDECEC;
-	border-radius: 37px !important;
-	box-shadow: -1px 1px 2px rgba(0, 0, 0, 0.4);
-}
-
-/* Panels */
-.panel{
-	border: none;
-	border-radius: 0px;
-	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
-}
-
-/* Forms */
-.form-control{
-	border-radius: 0px;
-}
-
-/* Pagination */
-.pagination>.active>a,
-.pagination>.active>span,
-.pagination>.active>a:hover,
-.pagination>.active>span:hover,
-.pagination>.active>a:focus,
-.pagination>.active>span:focus {
-    background-color: #EA7D1E;
-    border-color: #EA7D1E;
-}
-.pagination>li>a:hover,
-.pagination>li>span:hover, 
-.pagination>li>a:focus, 
-.pagination>li>span:focus {
-    background-color: #EA7D1E;
-    border-color: #EA7D1E;
-}
-
-/* Modal */
-.modal-content{
-	border-radius: 0px;
-}
-
-/* Custom "glyphicons" */
-.glyphicon-ext-hierarchy:before {
-    content: url('../img/icons/hierarchy-white-13px.png');
-}
-
-/**********************/
-/* BS plugin override */
-/**********************/
-/* Datatables */
-.table-striped > tbody > tr:hover {
-	background-color: #fdf5d0;
-}
-
-/******************/
-/* Modal settings */
-/******************/
-.modal-content .content_loader{
-	margin: 7em 0em;
-	text-align: center;
-}
-
-@media (min-width: 992px){
-	.modal-lg {
-		width: 80%;
-		max-width: 1200px;
-	}
-}
-
-/**************************/
-/* MagnificPopup settings */
-/**************************/
-.mfp-bg{
-	z-index: 1200;
-}
-.mfp-wrap{
-	z-index: 1210;
-}
-
-/********************/
-/* Typeahed setting */
-/********************/
-.twitter-typeahead .tt-menu{
-	max-height: 200px;
-	overflow-y: auto;
-}
-@media (min-width: 768px){
-	.twitter-typeahead .tt-menu{
-		max-height: 300px;
-	}
-}
-
-.twitter-typeahead .tt-dataset > .content_loader{
-	margin: 10px 0px;
-	text-align: center;
-	font-size: 0.6em;
-}
-.twitter-typeahead .tt-dataset > .content_loader .icon{
-	height: 25px;
-}
-.twitter-typeahead .tt-dataset .no_result{
-	text-align: center;
-	font-style: italic;
-}
-
-/*****************/
-/* Home settings */
-/*****************/
-.home #main-wrapper{
-	padding-top: 15px;
-}
-
-.home .tile{
-	display: block;
-	margin-bottom: 8px;
-	padding: 0em 1em;
-	min-height: 4em;
-	background-color: #FFFFFF;
-    background-image: none;
-    border: none;
-	border-radius: 0px;
-    text-align: center;
-	text-decoration: none;
-	white-space: normal;
-	line-height: 4em;
-	box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
-}
-.home .tile .tile_decoration{
-	position: absolute;
-	top: 0.3em;
-	left: 2.5em;
-}
-.home .tile .tile_title{
-	font-weight: bold;
-	color: #333;
-}
-.home .tile .tile_description{
-	display: none;
-	color: #555555;
-}
-@media (min-width: 768px) {
-	.home .tile{
-		display: block;
-		margin-bottom: 25px;
-		padding: 40px 40px 30px 40px;
-		min-height: 10em;
-		text-align: left;
-		transition: all 0.2s linear;
-	}
-	.home .tile:hover{
-		box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.10);
-	}
-	.home .tile .tile_decoration{
-		display: block;
-		position: relative;
-		float: left;
-		top: 1.5em;
-		left: initial;
-		margin: 0px 30px 15px 0px;
-	}
-	.home .tile .tile_body{
-		display: block;
-		padding-left: 4.3em;
-		text-align: left;
-		line-height: 1.5em;
-	}
-	.home .tile .tile_title{
-		margin-bottom: 1em;
-		font-size: 1.0em;
-	}
-	.home .tile .tile_description{
-		display: block;
-		text-align: left;
-	}
-}
-@media (min-width: 992px) {
-	.home .tile{
-		min-height: 14em;
-		padding: 30px 40px 30px 40px;
-	}
-	.home .tile .tile_decoration > span.icon{
-		font-size: 4em;
-	}
-	.home .tile .tile_body{
-		padding-left: 6.3em;
-	}
-	.home .tile .tile_title{
-		font-size: 1.4em;
-	}
-	.home .tile .tile_description{
-		font-size: 1.2em;
-	}
-}
-@media (min-width: 1200px) {
-	.home .tile{
-		margin-bottom: 40px;
-		min-height: 15em;
-		padding: 40px 50px 30px 50px;
-	}
-	.home .tile .tile_decoration{
-		margin: 0px 40px 15px 0px;
-		top: 1.5em;
-	}
-	.home .tile .tile_decoration > span.icon{
-		font-size: 6em;
-	}
-	.home .tile .tile_body{
-		padding-left: 9.1em;
-	}
-	.home .tile .tile_title{
-		font-size: 1.5em;
-	}
-	.home .tile .tile_description{
-		font-size: 1.2em;
-	}
-}
-
-/********************/
-/* Modules settings */
-/********************/
-
-#main-header{
-	text-align: center;
-}
-#main-header-title{
-	margin-bottom: 15px;
-}
-
-#main-header-actions{
-	margin-bottom: 15px;
-}
-#main-header-actions .btn-group .btn{
-	padding: 0em 1.5em;
-	line-height: 2.4em;
-	font-size: 14px;
-}
-@media (min-width: 768px) {
-	#main-header:after{
-		clear: both;
-	}
-	#main-header-title{
-		float: left;
-		margin-bottom: 0px;
-		min-height: 6em;
-		text-align: left;
-	}
-	#main-header-actions{
-		float: right;
-		margin-bottom: 0px;
-	}
-}
-
-.dataTables_wrapper{
-	padding: 10px 10px;
-}
-#brick_content_toolbar{
-	/* margin: 10px 0px 6px 0px; */
-	padding: 10px;
-}
-#brick_content_toolbar > div label{
-	font-weight: normal;
-	white-space: nowrap;
-	text-align: left;
-}
-#brick_content_toolbar > div label input{
-	margin-left: 0.5em;
-	display: inline-block;
-	width: 130px;
-}
-
-/***********************/
-/* Brick communication */
-/***********************/
-/* Home tile */
-.home .tile.tile_communication{
-    padding: 20px;
-	background-color: #EDEDED;
-	border: none;
-	font-weight: initial;
-}
-.home .tile_communication .carousel{
-	margin-bottom: 0px;
-	width: 100%;
-	height: 200px;
-}
-
-/**********************/
-/* Brick user profile */
-/**********************/
-.home .userprofile-brick{
-	background-color: #E8E7E7;
-}
-
-/****************/
-/* Brick browse */
-/****************/
-/* - Tree mode  */
-/****************/
-#brick_content_tree{
-	position: relative;
-}
-.panel > .list-group:last-child .list-group-item:last-child,
-.panel > .panel-collapse > .list-group:last-child .list-group-item:last-child{
-	margin-bottom: 1px;
-}
-
-.list-group-item > .list-group-item-actions{
-	/*display: none; Displaying actions only when hovering was not unanimous in the team */
-	position: absolute;
-	top: 10px;
-	right: 10px;
-}
-.list-group-item:hover > .list-group-item-actions{
-	display: block;
-}
-.list-group-item .list-group-item-actions a:not(:first-child){
-	margin-left: 10px;
-}
-.list-group-item .list-group-item-text{
-	margin-left: 5px;
-	font-size: 1em;
-	line-height: 1em;
-}
-.list-group-item .keep-spinning{
-	animation: spin 1s linear infinite;
-	-webkit-animation: spin 1s linear infinite;
-	-moz-animation: spin 1s linear infinite;
-	-ms-animation: spin 1s linear infinite;
-}
-
-/* Secondary actions */
-table .group-actions{
-	position: relative;
-}
-.list-group-item-actions a.glyphicon-menu-hamburger,
-table .group-actions a.glyphicon-menu-hamburger{
-	cursor: pointer;
-	text-decoration: none;
-}
-.list-group-item-actions .item-action-wrapper,
-table .group-actions .item-action-wrapper
-{
-	display: none;
-	position: absolute;
-	z-index: 5;
-	bottom: 5px;
-	right: 0px;
-	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15);
-	-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15);
-	box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15);
-}
-.list-group-item-actions .item-action-wrapper .glyphicon,
-table .group-actions .item-action-wrapper .glyphicon{
-	margin-right: 0.6em;
-}
-.list-group-item-actions .item-action-wrapper.collapse.in,
-table .group-actions .item-action-wrapper.collapse.in{
-	display: block;
-}
-.list-group-item-actions .item-action-wrapper .panel-body > p,
-table .group-actions .item-action-wrapper .panel-body > p{
-	white-space: nowrap;
-}
-.list-group-item-actions .item-action-wrapper .panel-body > p:last-child,
-table .group-actions .item-action-wrapper .panel-body > p:last-child{
-	margin-bottom: 0px;
-}
-
-#brick_content_empty{
-	display: none;
-    padding: 40px;
-	font-size: 1.3em;
-    font-style: italic;
-}
-
-/* Loader */
-#brick_tree_overlay{
-	/*z-index: 10;*/
-	display: none;
-	padding: 8% 0px;
-	/*position: absolute;
-	top: 0px;
-	left: 0px;
-	width: 100%;
-	height: 100%;
-	min-height: 130px;*/
-	/*background-color: black;*/
-	border-radius: 0px 0px 4px 4px;
-	/*opacity: 0.5;
-	color: white;*/
-	font-size: 1em;
-}
-/****************/
-/* - List mode  */
-/****************/
-
-
-/*********/
-/* Forms */
-/*********/
-.form_fields textarea{
-	height: 160px;
-}
-.form_field .form_mandatory .control-label:after{
-	content: "\002a";
-	position: relative;
-	left: 3px;
-	color: red; /* TODO : SASS this */
-	font-size: 0.9em;
-}
-/* Subform field */
-.subform_field > fieldset{
-	margin: inherit;
-	margin-bottom: 15px; /* TODO : SASS this from .form-group */
-	padding: 10px 15px;
-	border: 1px solid #dddddd; /* TODO : SASS this */
-	border-radius: 4px; /* TODO : SASS this */
-}
-.subform_field > fieldset > legend{
-	margin: 0px 0px;
-	padding: 0px 7px;
-	width: inherit;
-	border: none;
-	font-size: 1em;
-	font-weight: bold;
-	color: #777777; /* TODO : SASS this */
-}
-/* CaseLog field */
-.caselog_field_entry{
-	border: 1px solid #dddddd;
-	border-top: none;
-}
-.caselog_field_entry_header{
-	padding: 6px;
-	font-size: 1em;
-	border-bottom: 1px solid #FFFFFF;
-	background-color: #F2F2F2;
-}
-.caselog_field_entry_button{
-	display: block;
-	width: 15px;
-    height: 15px;
-    text-align: center;
-	line-height: 15px;
-	font-size: 16px;
-    border: 1px solid #a6a6a6;
-    border-bottom-color: #979797;
-}
-.caselog_field_entry_button:hover{
-	background-color: #cccccc;
-}
-.caselog_field_entry_button:before{
-	content: "▴";
-}
-.caselog_field_entry_button.collapsed:before{
-	content: "▾";
-}
-.caselog_field_entry_content{
-	margin: 10px;
-	overflow-x: auto;
-}
-/* LinkedSet*/
-.form_linkedset_toggler,
-.form_linkedset_toggler:hover,
-.form_linkedset_toggler:focus{
-	margin-left: 0.4em;
-	text-decoration: none;
-	color: inherit;
-}
-.form_linkedset_toggler > .text:before{
-	content: "(";
-}
-.form_linkedset_toggler > .text:after{
-	content: ")";
-}
-.form_linkedset_toggler > .glyphicon{
-	margin-left: 0.5em;
-	font-size: 0.85em;
-	color: #EA7D1E; /* TODO : SASS this to primary color */
-	transition: transform 0.2s linear;
-}
-.form_linkedset_toggler > .glyphicon.collapsed{
-	transform: rotateZ(-90deg);
-}
-/* - DataTables : Loader */
-.form_linkedset_wrapper .datatables_overlay{
-	padding: 8px !important;
-}
-.form_linkedset_wrapper .overlay_content{
-	font-size: 0.6em;
-}
-.form_linkedset_wrapper .content_loader{
-	margin: 0px;
-}
-.form_linkedset_wrapper .content_loader .icon{
-	height: 23px;
-}
-/* - DataTables : Fit the table in the form */
-.form_linkedset_wrapper .dataTables_wrapper{
-	margin-bottom: 5px;
-	padding: 0px;
-}
-/* FileUpload */
-.fileupload_field_content{
-	padding: 8px 23px;
-	border: 1px solid #DDDDDD; /* TODO : SASS this */
-	background-color: #F9F9F9; /* TODO : SASS this*/
-}
-.fileupload_field_content > div{
-	margin-bottom: 15px;
-}
-.attachments_container .attachment {
-	height: 95px;
-	overflow-x: hidden;
-	text-align: center;
-}
-.attachments_container .attachment:hover {
-	background-color: #e0e0e0;
-}
-.attachments_container .attachment .attachment_name{
-	overflow-x: hidden;
-	text-overflow: ellipsis;
-	white-space: nowrap;
-}
-.attachments_container .attachment .btn{
-	margin-top: 3px;
-}
-.upload_container input{
-	display: inline;
-}
-.upload_container .loader{
-	visibility: hidden;
-	margin-left: 7px;
-	font-size: 1.2em;
-	animation: spin 1.0s linear infinite;
-	-webkit-animation: spin 1.0s linear infinite;
-	-moz-animation: spin 1.0s linear infinite;
-	-ms-animation: spin 1.0s linear infinite;
-}
-#drag_overlay{
-	display: block;
-	top: inherit;
-	bottom: 0px;
-	height: 0px;
-}
-#drag_overlay .overlay_content{
-	margin-top: 5em;
-    width: 100%;
-    color: white;
-}
-#drag_overlay .overlay_content .icon{
-	font-size: 3em;
-}
-#drag_overlay .overlay_content .message{
-	font-size: 1.5em;
-}
-/* Attachments drag & drop zone, only for none mobile devices */
-@media (min-width: 768px){
-	#drag_overlay.drag_in{
-		animation: show-drop-zone 0.3s ease-out forwards;
-		-webkit-animation: show-drop-zone 0.3s ease-out forwards;
-		-moz-animation: show-drop-zone 0.3s ease-out forwards;
-		-ms-animation: show-drop-zone 0.3s ease-out forwards;
-	}
-	#drag_overlay.drag_out{
-		animation: hide-drop-zone 0.3s ease-out forwards;
-		-webkit-animation: hide-drop-zone 0.3s ease-out forwards;
-		-moz-animation: hide-drop-zone 0.3s ease-out forwards;
-		-ms-animation: hide-drop-zone 0.3s ease-out forwards;
-	}
-	@keyframes show-drop-zone{
-		100% {
-			height: 20%;
-		}
-	}
-	@-webkit-keyframes show-drop-zone{
-		100% {
-			height: 20%;
-		}
-	}
-	@-moz-keyframes show-drop-zone{
-		100% {
-			height: 20%;
-		}
-	}
-	@-ms-keyframes show-drop-zone{
-		100% {
-			height: 20%;
-		}
-	}
-	@keyframes hide-drop-zone{
-		0% {
-			height: 20%;
-		}
-		100% {
-			height: 0%;
-		}
-	}
-	@-webkit-keyframes hide-drop-zone{
-		0% {
-			height: 20%;
-		}
-		100% {
-			height: 0%;
-		}
-	}
-	@-moz-keyframes hide-drop-zone{
-		0% {
-			height: 20%;
-		}
-		100% {
-			height: 0%;
-		}
-	}
-	@-ms-keyframes hide-drop-zone{
-		0% {
-			height: 20%;
-		}
-		100% {
-			height: 0%;
-		}
-	}
-}
-
-.form_field .form-control-static img{
-	max-width: 100% !important;
-	height: initial !important;
-}
-
-.form_buttons{
-	padding-top: 20px;
-	text-align: center;
-}
-.form_buttons .form_btn_transitions{
-	margin-bottom: 20px;
-}
-.form_buttons .btn .glyphicon{
-	margin-right: 0.5em;
-}
-.form_btn_regular.sticky{
-	display: none;
-}
-@media (min-width: 768px){
-	.form_buttons .form_btn_transitions{
-		float: left !important;
-	}
-	.form_buttons .form_btn_regular{
-		text-align: right;
-	}
-	.form_buttons .form_btn_regular btn{
-		width: inherit;
-	}
-	/* Making regular button sticky */
-	.form_btn_regular.sticky{
-		display: block;
-		position: fixed;
-		bottom: 5em;
-		right: -2px; /* TODO : SASS this to col-xs-12 padding */
-		padding: 15px;
-		background-color: #FFF; /* TODO : SASS this to panel bg */
-		border: 1px solid #DDD; /* TODO : SASS this to panel border */
-		border-radius: 4px; /* TODO : SASS this to panel border */
-		transition: right 0.3s;
-	}
-	.form_btn_regular.sticky.closed{
-		right: -75px;
-	}
-	.form_btn_regular.sticky button{
-		display: block;
-	}
-	.form_btn_regular.sticky button:first-child{
-		margin-bottom: 4px;
-	}
-	/* - Adjustments for modal sticky buttons */
-	.modal.in .form_btn_regular.sticky{
-		/*right: 15px;*/ /* TODO : SASS this to col-xs-12 padding */
-	}
-}
-
-/* CKEditor : Adding BS error feedback */
-.form_field div.cke{
-    border: 1px solid #dddddd; /* TODO : SASS this */
-}
-.form_field.has-error div.cke{
-	border: 1px solid #D9230F; /* TODO : SASS this */
-	border-radius: 3px; /* TODO : SASS this */
-	box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
-}
-/* CKEditor : Styling notifications based on BS alerts */
-.cke_notification{
-    position: relative;
-	padding: 15px;
-    margin-bottom: 18px;
-    border: 1px solid transparent;
-    border-radius: 4px;
-	background-color: #FFFFFF
-}
-.cke_notification_close{
-	position: absolute;
-	top: 2px;
-	right: 5px;
-}
-.cke_notification_message{
-	margin-bottom: 0px;
-	line-height: 1em;
-	font-size: 1em;
-}
-.cke_notification_success{ /* TODO : SASS this */
-	display: none;
-	background-color: #dff0d8;
-    border-color: #d6e9c6;
-    color: #468847;
-}
-.cke_notification_warning{ /* TODO : SASS this */
-    background-color: #fcf8e3;
-    border-color: #fbeed5;
-    color: #c09853;
-}
-
-/* DataTables : Selection inputs */
-.dataTable.table th span.row_input,
-.dataTable.table td span.row_input{
-	display: inline-block;
-	width: 100%;
-	text-align: center;
-}