/* Layout */ .container.main-content { display: flex; margin-top: 80px; width: 100%; max-width: 100%; } .menu-container { width: 8%; } .main-content-container { width: 92%; padding: 0 20px; } .login-container { top: 25vh; } /* Common CSS */ .cp { cursor: pointer; } .frsa { display: flex; flex-direction: row; justify-content: space-between; } .white-well { min-height: 20px; padding: 19px; margin-bottom: 20px; background-color: #FFFFFF; border: 1px solid #e3e3e3; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05); box-shadow: inset 0 1px 1px rgba(0,0,0,.05); } .ls-none { list-style: none; } /* Side Menu */ .side-menu { padding-top: 10px; max-width: 100px; border-right: 1px solid #ccc; } .button-container { text-align: center; } .button-container a { color: black; } .side-menu-button { width: 65px; height: 65px; } .achievement-body { display: flex; flex-direction: row; justify-content: space-between; align-items: center; } .button-container.active .side-menu-button { color: #fff; background-color: #286090; border-color: #122b40; } .button-container.active .button-title { color: #286090; } .button-container a:hover { text-decoration: none; } .current-user-container { width: 100%; display: inline-block; font-size: 14px; text-align: left; background-color: #fff; height: 40px; -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,.2); box-shadow: 0 1px 1px 0 rgba(0,0,0,.1); margin-bottom: 10px; } .current-user-container:hover{ cursor: pointer; -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,.4); box-shadow: 0 1px 1px 0 rgba(0,0,0,.3); } .current-user-container > .current-user-split{ background: #337ab7; width: 33px; float: left; color: #fff!important; height: 100%; text-align: center; } .current-user-container > .current-user-split > .glyphicon{ position:relative; top: calc(50% - 9px)!important; /* 50% - 3/4 of icon height */ } .current-user-container > .current-user-split.update-success{ background: #5cb85c!important; } .current-user-container .current-user-text { color: black; } .current-user-container > .current-user-split.update-danger{ background: #d9534f!important; } .current-user-container > .current-user-split.update-info{ background: #5bc0de!important; } .current-user-container > .current-user-text{ line-height: 19px; padding-top: 11px; padding-left: 45px; padding-right: 20px; } .current-user-container i.fa.fa-user { padding: 10px; font-size: 20px; } .profiles { border: 1px solid #dddddd; margin-bottom: 20px; } .profile-content { width: 320px; padding: 15px; padding-bottom:0px; } .profile-content:before, .profile-content:after { display: table; content: ""; line-height: 0; } .profile-footer{ background-color:#DDD; } .profile-footer-content { padding:15px 15px 15px 15px; } .profile-container .divider { height: 1px; margin: 9px 0; overflow: hidden; background-color: #e5e5e5; } .demo-title { text-align: center; font-size: 3rem; margin-bottom: 50px; } .invite-option { border: 1px solid #e5e5e5; } .invite-card-container { flex-wrap: wrap; width: 100%; display: flex; } .invite-card-container .invite-option { width: 25%; background: white; float: left; padding: 2%; text-align: center; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; margin: 5px; } .invite-card-container .invite-option:hover { /*cursor: pointer;*/ box-shadow: 0px 2px 30px rgba(0, 0, 0, 0.3); -webkit-transform: scale(1.04); transform: scale(1.04); } .invite-card-container .invite-option:hover i, .invite-card-container .invite-option:hover h1, .invite-card-container .invite-option:hover span, .invite-card-container .invite-option:hover b { color: #286090; } .invite-card-container .invite-option:hover .front { opacity: 0; visibility: hidden; } .invite-card-container .invite-option:hover .back { opacity: 1 !important; visibility: visible !important; } .invite-card-container .invite-option:hover .back a.button { cursor: pointer; -webkit-transform: translateY(0px) !important; transform: translateY(0px) !important; } .invite-card-container .invite-option hr { border: none; border-bottom: 1px solid #F0F0F0; } .invite-card-container .invite-option i { color: #D8D8D8; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .invite-card-container .invite-option h1 { margin: 10px 0; color: #212121; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .invite-card-container .invite-option p { color: #999; padding: 0 10px; line-height: 1.3; } .invite-card-container .invite-option .price { position: relative; } .invite-card-container .invite-option .price .front span.price { font-size: 2rem; text-transform: uppercase; margin-top: 20px; display: block; font-weight: 700; position: relative; } .invite-card-container .invite-option .price .front span.price b { position: absolute; font-size: 1rem; margin-left: 2px; font-weight: 600; } .invite-card-container .invite-option .price .back { opacity: 0; visibility: hidden; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .invite-card-container .invite-option .price .back a.button { background: #286090; padding: 15px 20px; display: inline-block; text-decoration: none; color: white; position: absolute; font-size: 13px; top: -5px; left: 0; right: 0; width: 150px; margin: auto; text-transform: uppercase; -webkit-transform: translateY(20px); transform: translateY(20px); -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .invite-card-container .invite-option .price .back a.button:hover { background: #286090; } .invite-card-container .invite-option:hover i { color: white; } .website-card-button-group { display: flex; justify-content: space-around; } .media { border: 1px solid #d5dbdd; padding: 5px 20px; border-radius: 5px; box-shadow: 0px 2px 1px rgba(0,0,0,0.04); background: #fff; display: -ms-flexbox; display: flex; -ms-flex-align: start; align-items: flex-start; } .align-self-center { -ms-flex-item-align: center !important; align-self: center !important; } .rounded-circle { border-radius: 50%; } .media .media-left img { width: 75px; } .shares-container { list-style: none; -webkit-padding-start: 0px; } .file-tree-container .file_tree { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; } .file-tree-container .file_tree input[type=radio], .file-tree-container .file_tree input[type=checkbox] { width: 0; height: 0; opacity: 0; position: absolute; margin: 0; } .file-tree-container .file_tree label { display: block; width: 100%; font-size: 14px; color: black; height: 30px; line-height: 30px; padding: 0 8px; cursor: pointer; white-space: nowrap; } .file-tree-container .file_tree label:hover { color: #a4d3ff; } .file_tree .dir_wrapper { display: none; padding-left: 28px; } .file-tree-container .file_tree .dir_wrapper label { padding-left: 0; } .file-tree-container .file_tree input[type=checkbox] + label { color: black; padding-left: 30px; } .file-tree-container .file_tree input[type=checkbox] + label:hover { color: #a4d3ff; } .file-tree-container .file_tree input[type=radio]:checked + label { color: #337ab7; } .file-tree-container .file_tree input[type=checkbox]:checked + label + .dir_wrapper { display: block; } .file-tree-container .file_tree input[type=checkbox] + label { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAABQCAYAAABxs9dPAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjc0Q0FDNEY5NDFGQjExRTQ4MEQ4ODY5MEFBODE4RDk2IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjc0Q0FDNEZBNDFGQjExRTQ4MEQ4ODY5MEFBODE4RDk2Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NzRDQUM0Rjc0MUZCMTFFNDgwRDg4NjkwQUE4MThEOTYiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NzRDQUM0Rjg0MUZCMTFFNDgwRDg4NjkwQUE4MThEOTYiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7T+9ssAAABJ0lEQVR42uzZMQrCMBgF4FbE0UFPILg5qdAbCA7q5qK7p3Bw8BK6u4giboKCJxDB1cFdsOjapb5ACyoiNG3pj30P3hj4SBOaEPP6cFwjWG5oAz0aMSSjMaaIbtGqFJCP2qE1KSCVgjdTkaKyIccr1B49SwGp5NF6HCAbvRjJpOTN9htog/YTAs3QXthFbUja9gQRRBBBBBFEEEEEpQVkalyl0zVD6tYxlfbJZK0h13W5ywgiiCCCCCKIIIII+nGmnp/u4g75k4Bj1IviCHXiAg00xlXQbhwo3TXUQRdoTtKibqPLqFFhH/Ba6BpdSQGpNL3+793ej3pRHCbkGPuz/PnmekgIZPNfRhBBBBFEEEEEEURQ8DO1pXGtjirWN1DZKz/Za54CDABbrytKn66XKwAAAABJRU5ErkJggg==); background-size: 18px 40px; background-position: top 7px left 6px; background-repeat: no-repeat; vertical-align: middle; } .file-tree-container .file_tree input[type=checkbox] + label:hover { background-position: top -18px left 6px; }