@charset "utf-8"; /*
Designer : Om Prakash Choudhary
Designer's ID : omtonk@gmail.com
Company : The Catalyst
Company Website : www.thecatalystindia.in
*************** THEME-OM SETTINGS *******************************************************************/
html { background-color:#fff; margin:0; padding:0;}
body { background-color:#fff; color:#1a2d39; font:100% 'Roboto', Arial, Helvetica, sans-serif; cursor:default; margin:0; padding:0;}
* { box-sizing:border-box; outline:none;}
a { text-decoration:none;}
a img { border:none; outline:none;}
a, img { outline:none; color:inherit;}
a:focus { outline:none; text-decoration:none;}
a:hover { color:inherit; text-decoration:none;}
a[href],
[onclick],
[ng-click] { cursor:pointer;}
img { max-width:100%;}
ul { margin-top:0; margin-bottom:0; padding-left:0;}
hr { border:none; border-bottom:1px solid #ccc;}
.container { width:100%; max-width:1320px; margin-left:auto; margin-right:auto;}
.container2 { width:100%; max-width:992px; margin-left:auto; margin-right:auto;}
.container-full { width:100%; margin-left:auto; margin-right:auto;}
.theme-row { display:flex; flex-wrap:wrap; width:100%;}
.theme-row-main { display:inline-block; width:100%;}
.col-full { display:inline-block; float:left; padding-left:15px; padding-right:15px; width:100%;}
.col-half { display:inline-block; float:left; padding-left:15px; padding-right:15px; width:50%;}
.col-oneThird { display:inline-block; float:left; padding-left:15px; padding-right:15px; width:33.3333%;}
.col-twoThird { display:inline-block; float:left; padding-left:15px; padding-right:15px; width:66.6666%;}
.col-oneFourth { display:inline-block; float:left; padding-left:15px; padding-right:15px; width:25%;}
.col-threeFourth{ display:inline-block; float:left; padding-left:15px; padding-right:15px; width:75%;}
.col-oneFifth { display:inline-block; float:left; padding-left:15px; padding-right:15px; width:20%;}
.col-twoFifth { display:inline-block; float:left; padding-left:15px; padding-right:15px; width:40%;}
.col-threeFifth { display:inline-block; float:left; padding-left:15px; padding-right:15px; width:60%;}
.col-fourFifth { display:inline-block; float:left; padding-left:15px; padding-right:15px; width:80%;}
[block="box"] { width:100%; display:inline-block;}
[block="100"] { width:100%; display:inline-block; float:left;}
[block="50"] { width:50%; display:inline-block; float:left;}
.relv { position:relative;}
.text-left { text-align:left;}
.text-center { text-align:center;}
.text-right { text-align:right;}
.text-justify { text-align:justify;}
.lFloat { float:left;}
.rFloat { float:right;}
.noFloat { float:none !important;}
.max { max-width:100%;}
.padded,.Padded { padding-left:0 !important; padding-right:0 !important;}
.clear { width:100%; display:inline-block; clear:both;}
.clear:after { content:""; display:table; clear:both;}
.ellipsis { overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.Image { background:#fff; padding:4px; border:1px solid #ddd;}
.lImage { float:left; margin-right:15px; max-width:100%;}
.rImage { float:right; margin-left:15px; max-width:100%;}
.cImage { text-align:center;}
.cImage img { max-width:100%;}
.fImage { width:100%; margin:10px 0;}
.white { color:#fff;}
.margin-1em-all { margin:15px;}
.margin-1em-top { margin-top:15px;}
.margin-1em-right { margin-right:15px;}
.margin-1em-bottom { margin-bottom:15px;}
.margin-1em-left { margin-left:15px;}
.margin-2em-all { margin:30px;}
.margin-2em-top { margin-top:30px;}
.margin-2em-right { margin-right:30px;}
.margin-2em-bottom { margin-bottom:30px;}
.margin-2em-left { margin-left:30px;}
.margin-top-20 { margin-top:20px;}
.margin-top-60 { margin-top:60px;}
.padding-1em-all { padding:15px;}
.padding-1em-top { padding-top:15px;}
.padding-1em-right { padding-right:15px;}
.padding-1em-bottom { padding-bottom:15px;}
.padding-1em-left { padding-left:15px;}
.padding-2em-all { padding:30px;}
.padding-2em-top { padding-top:30px;}
.padding-2em-right { padding-right:30px;}
.padding-2em-bottom { padding-bottom:30px;}
.padding-2em-left { padding-left:30px;}
.no-margin { margin:0 !important;}
.no-margin-top { margin-top:0 !important;}
.no-margin-right { margin-right:0 !important;}
.no-margin-bottom { margin-bottom:0 !important;}
.no-margin-left { margin-left:0 !important;}
.error-message { color: red; margin-top: 5px; font-size: 12px;}
/** PATTERN *****************************************************************************************/
.parallax { background-repeat:no-repeat; background-position:center center; background-size:cover; background-attachment:fixed; position:relative;}
.pattern { position:relative;}
.pattern:after { content:""; background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABhJREFUeNpiYGBgePz//38GRhABAgABBgBFTAbfCBNE2AAAAABJRU5ErkJggg==); width:100%; height:100%; position:absolute; top:0; left:0; z-index:0;}
.pattern > div { position:relative; z-index:1;}
/** SCROLLBAR ***************************************************************************************/
.scroll { overflow-y:auto; scrollbar-face-color:rgba(220,225,225,.6); scrollbar-track-color:rgba(220,225,225,.8); scrollbar-arrow-color:rgba(220,225,225,.6); max-height:150px;}
.scroll::-webkit-scrollbar { width:12px; background:rgba(220,225,225,.3);}
.scroll::-webkit-scrollbar-thumb { background:rgba(220,225,225,.6);}
.scroll:hover::-webkit-scrollbar { background:rgba(220,225,225,.4);}
/** TOOLTIP *****************************************************************************************/
*[tooltip] { position:relative; display:inline-block;}
*[tooltip]:before { position:absolute; bottom:100%; left:0; padding:7px 10px; margin-bottom:9px; content:attr(tooltip); display:none; background:#333; color:#fff; font:600 11px/15px Arial, Helvetica, sans-serif; text-align:center; z-index:5555; border-radius:3px; text-shadow:1px 1px 1px rgba(0,0,0,.4); box-shadow:1px 2px 3px rgba(0, 0, 0, 0.2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; box-sizing:border-box;}
*[tooltip]:after { position:absolute; bottom:100%; left:7px; margin-bottom:-9px; content:""; width:0; height:0; border:9px solid transparent; border-top-color:#333; z-index:5556; display:none;}
*[tooltip-right]:before { left:auto; right:0;}
*[tooltip-right]:after { left:auto; right:7px;}
*[tooltip-bottom]:before { bottom:auto; top:100%; margin-bottom:0; margin-top:9px;}
*[tooltip-bottom]:after { bottom:auto; top:100%; margin-bottom:0; margin-top:-9px; border-top-color:transparent; border-bottom-color:#333;}
*[tooltip-center]:before { width:70%; left:15%;}
*[tooltip-center]:after { left:calc(50% - 9px);}
*[tooltip]:not([tooltip=""]):hover:before,
*[tooltip]:not([tooltip=""]):hover:after { display:block;}
/** LARGE TOOLTIP ***********************************************************************************/
tooltip { display:inline-block; color:#888;}
tooltip[relv] { position:relative;}
tooltip-info { width:250px; position:absolute; bottom:100%; left:0; padding:10px 13px; margin-bottom:9px; background:rgba(0,0,0,.7); color:#fff; font:13px Arial, Helvetica, sans-serif; z-index:1111; border-radius:3px; text-shadow:1px 1px 1px rgba(0,0,0,.4); box-shadow:1px 2px 3px rgba(0, 0, 0, 0.2); text-align:left;}
tooltip-info:after { position:absolute; top:100%; left:10px; margin-bottom:-9px; content:""; width:0; height:0; border:9px solid transparent; border-top-color:rgba(0,0,0,.7); z-index:1112;}
[tooltip-right] tooltip-info { left:auto; right:0;}
[tooltip-right] tooltip-info:after { left:auto; right:7px;}
/*
info
...
*/
/** TABLE *******************************************************************************************/
.sarni { width:100%; display:inline-block; overflow-x:auto;}
.sarni table { width:100%; border-collapse:separate; border-spacing:0 5px; text-align:left;}
.sarni table thead { text-align:left;}
.sarni table tr td { border-right:1px solid #f5f5f5; background:#f0f0f0; text-shadow:none; font:14px 'Roboto', Arial, Helvetica, sans-serif; vertical-align:top;}
.sarni table thead th { background:#0393ef; border-right:1px solid rgba(255,255,255,.5); color:#fff; font:500 16px 'Roboto', Arial, Helvetica, sans-serif; border:none;}
.sarni table tfoot th { border-right:1px solid #f5f5f5; background:#f0f0f0; text-shadow:none; font:700 14px 'Roboto', Arial, Helvetica, sans-serif; vertical-align:top;}
.sarni table tr:nth-child(even) td { background:#eee;}
.thNowrap th { white-space:nowrap;}
/** IMAGE THUMBNAIL *********************************************************************************/
.imgThumb { width:140px; display:inline-flex; background:#fff; border:1px solid #e1e1e1; border-radius:3px; box-shadow:0 0 3px rgba(0,0,0,.06); margin:10px; padding:6px; position:relative;}
.imgThumb img { max-width:125px; max-height:82px;}
.imgThumb name { position:relative; display:inline-block; width:100%; padding-right:30px;}
.imgThumb name span { width:100%; display:inline-block; margin-top:8px; color:#00ccff; font:500 13px 'Roboto', Arial, Helvetica, sans-serif; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.imgThumb remove { position:absolute; top:0; right:0;}
.imgThumb remove i { color:#666; display:inline-block; cursor:pointer;}
.imgThumb remove:hover i { color:rgb(255, 0, 138);}
.imgThumb[fix-height] { height:120px;}
.imgThumb[fix-height] name { width:calc(100% - 14px); position:absolute; left:7px; bottom:0;}
.imgThumb[no-name] { height:98px;}
/** SPINNERS ****************************************************************************************/
.blur { filter:blur(5px);}
.loaderOverlay { width:100%; height:100%; display:inline-block; padding-top:25%; text-align:center; overflow:hidden; position:fixed; left:0; top:0; z-index:111; background:rgba(255,255,255,.9);}
.loaderOverlay.inline { position:absolute; padding-top:0; z-index:99;}
.loaderOverlay.inline .rotateSpinner { position:absolute; top:calc(50% - 15px); left:calc(50% - 15px);}
.loaderOverlay.inline .windowsSpinner { position:absolute; bottom:0; left:0;}
.loaderOverlay.inline .printingSpotSpinner { position:absolute; top:calc(50% - 13px); left:0;}
.loaderOverlay.inline .easelnOutSpinner { position:absolute; top:calc(50% - 24px); left:0;}
.loaderOverlay.inline .renGMSpinner { position:absolute; top:calc(50% - 62px); left:0;}
.rotateSpinner { width:30px; height:30px; display:inline-block; border-radius:50%; box-sizing:border-box; box-shadow:0 -9px 0 12px #00cafd inset; animation:rotateSpinner 1s infinite linear;}
/**/
.windowsSpinner { width:100%; height:6px; display:inline-block; margin:10px auto; position:relative; overflow:hidden;}
.windowsSpinner span { width:6px; height:6px; position:absolute; left:-6px; top:0; background:#00cafd; animation:windowsSpinner 4s infinite cubic-bezier(.2, .64, .81, .23);}
.windowsSpinner span:nth-child(2) { animation-delay:100ms;}
.windowsSpinner span:nth-child(3) { animation-delay:200ms;}
.windowsSpinner span:nth-child(4) { animation-delay:300ms;}
/*
*/
.printingSpotSpinner { width:100%; height:16px; display:inline-block; margin:10px auto;}
.printingSpotSpinner span { width:16px; height:16px; display:inline-block; border-radius:50%; position:absolute; left:50%; margin-left:-8px; animation:3s infinite linear;}
.printingSpotSpinner span:nth-child(1) { background:#00cafd; animation:printingSpotSpinnerKiri 1.2s infinite linear;}
.printingSpotSpinner span:nth-child(2) { background:#ff008a; z-index:100;}
.printingSpotSpinner span:nth-child(3) { background:#ffc42c; animation:printingSpotSpinnerKanan 1.2s infinite linear;}
/*
*/
.easelnOutSpinner { margin:15px auto; width:70px; text-align:center; display:inline-block; width:100%;}
.easelnOutSpinner > span { width:18px; height:18px; background-color:#00cafd; border-radius:100%; display:inline-block; animation: easelnOutSpinner-bouncedelay 2s infinite ease-in-out both;}
.easelnOutSpinner span:nth-child(1) { -webkit-animation-delay:-0.64s; animation-delay:-0.64s;}
.easelnOutSpinner span:nth-child(2) { -webkit-animation-delay:-0.32s; animation-delay:-0.32s;}
/*
*/
.renGMSpinner { width:100%; height:125px; display:inline-block; margin:0 auto; position:relative;}
.loaderOverlay .renGMSpinner { top:-63px;}
.renGMSpinner span { width:50px; height:50px; border-radius:50%; position:absolute; top:calc(50% - 25px); left:calc(50% - 25px);}
.renGMSpinner span:nth-child(1) { border:15px solid #ddd; z-index:9;}
.renGMSpinner span:nth-child(2) { border:15px solid; border-top-color:rgba(44,44,44,0); border-right-color:rgba(55,55,55,0); border-bottom-color:rgba(66,66,66,0); border-left-color:rgba(33,33,33,0); z-index:10; animation:renGMSpinnerEr 3s infinite;}
.renGMSpinner span:nth-child(3),
.renGMSpinner span:nth-child(4) { width:70px; height:70px; border:20px solid; border-top-color:#333; border-left-color:#fff; border-bottom-color:#333; border-right-color:#fff; top:calc(50% - 35px); left:calc(50% - 35px); opacity:0.2; animation:renGMSpinnerPoof 5s infinite;}
.renGMSpinner span:nth-child(4) { opacity:0.1; transform:rotate(90deg); animation:renGMSpinnerPoofity 5s infinite; animation-delay:1s;}
.renGMSpinner:after { content:attr(text); width:100%; color:#888; text-align:center; position:absolute; bottom:0; left:0; animation:renGMSpinnerOpaa 10s infinite;}
/*
*/
p ul { padding-left:revert }
/** KEYFRAMES ***************************************************************************************/
@keyframes fadeInDown
{
0% { opacity:0; transform:translateY(-10px);}
100%{ opacity:1; transform:translateY(0);}
}
@keyframes windowsSpinner
{
0% { left:0%;}
75% { left:100%;}
100%{ left:100%;}
}
@keyframes rotateSpinner {
0% { transform:rotate(0deg);}
100%{ transform:rotate(360deg);}
}
@keyframes printingSpotSpinnerKanan
{
0% { transform:translateX(20px);}
50% { transform:translateX(-20px);}
100%{ transform:translateX(20px); z-index:200;}
}
@keyframes printingSpotSpinnerKiri
{
0% { transform:translateX(-20px); z-index:200;}
50% { transform:translateX(20px);}
100%{ transform:translateX(-20px);}
}
@keyframes easelnOutSpinner-bouncedelay {
0%,
80%,
100%{ -webkit-transform: scale(0); transform: scale(0);}
40% { -webkit-transform: scale(1.0); transform: scale(1.0);}
}
@keyframes renGMSpinnerEr {
0% { border-top-color:rgba(44,44,44,0); border-right-color:rgba(55,55,55,0); border-bottom-color:rgba(66,66,66,0); border-left-color:rgba(33,33,33,0);}
10.4% { border-top-color:rgba(44,44,44,.5); border-right-color:rgba(55,55,55,0); border-bottom-color:rgba(66,66,66,0); border-left-color:rgba(33,33,33,0);}
20.8% { border-top-color:rgba(44,44,44,0); border-right-color:rgba(55,55,55,0); border-bottom-color:rgba(66,66,66,0); border-left-color:rgba(33,33,33,0);}
31.2% { border-top-color:rgba(44,44,44,0); border-right-color:rgba(55,55,55,.5); border-bottom-color:rgba(66,66,66,0); border-left-color:rgba(33,33,33,0);}
41.6% { border-top-color:rgba(44,44,44,0); border-right-color:rgba(55,55,55,0); border-bottom-color:rgba(66,66,66,0); border-left-color:rgba(33,33,33,0); transform: rotate(40deg); }
52% { border-top-color:rgba(44,44,44,0); border-right-color:rgba(55,55,55,0); border-bottom-color:rgba(66,66,66,.5); border-left-color:rgba(33,33,33,0);}
62.4% { border-top-color:rgba(44,44,44,0); border-right-color:rgba(55,55,55,0); border-bottom-color:rgba(66,66,66,0); border-left-color:rgba(33,33,33,0);}
72.8% { border-top-color:rgba(44,44,44,0); border-right-color:rgba(55,55,55,0); border-bottom-color:rgba(66,66,66,0); border-left-color:rgba(33,33,33,.5);}
}
@keyframes renGMSpinnerPoof {
0% { transform:scale(1,1) rotate(0deg); opacity:0.2;}
50% { transform:scale(4,4) rotate(360deg); opacity:0;}
}
@keyframes renGMSpinnerPoofity {
0% { transform:scale(1,1) rotate(90deg); opacity:0.1;}
50% { transform:scale(4,4) rotate(-360deg); opacity:0;}
}
@keyframes renGMSpinnerOpaa {
0% { opacity:1;}
10% { opacity:0.5;}
15% { opacity:1;}
30% { opacity:1;}
65% { opacity:0.3;}
90% { opacity:0.8;}
}
/** MEDIA SCREENS ***********************************************************************************/
@media screen and (min-width:0) and (max-width:768px)
{
.col-half, .col-oneThird, .col-twoThird, .col-oneFourth, .col-threeFourth, .col-oneFifth, .col-twoFifth, .col-threeFifth, .col-fourFifth { width:100%;}
.hide768 { display:none;}
}
@media screen and (max-width:600px)
{
.mob-m1em-bottom { margin-bottom:15px;}
.mob-m2em-bottom { margin-bottom:30px;}
.mob-text-center { text-align:center;}
}