Edit File by line

[0] Fix | Delete

Global CSS styles

[1] Fix | Delete

Theses styles can be used for different screens

[2] Fix | Delete

& In different SmashBalloon Plugins

[3] Fix | Delete

[4] Fix | Delete

* Transitions

[5] Fix | Delete

* Default, Hover & Focus Colors & Backgrounds

[6] Fix | Delete

* Social Colors

[7] Fix | Delete

* Buttons

[8] Fix | Delete

* Full Screen Boss

[9] Fix | Delete

* Add Source Popup

[10] Fix | Delete

* Confirm Dialog

[11] Fix | Delete

* Full Screen Loader

[12] Fix | Delete

* Tooltip

[13] Fix | Delete

[14] Fix | Delete

[15] Fix | Delete

body{

[16] Fix | Delete

--cl-orange: #FE544F;

[17] Fix | Delete

--cl-dark:#2C324C;

[18] Fix | Delete

--error-red: #D72C2C;

[19] Fix | Delete

--customizer-blue: #0096CC;

[20] Fix | Delete

--dark-blue: #2A65DB;

[21] Fix | Delete

--success-green: #59AB46;

[22] Fix | Delete

}

[23] Fix | Delete

#ctf-settings{

[24] Fix | Delete

visibility: hidden;

[25] Fix | Delete

opacity: 0;

[26] Fix | Delete

}

[27] Fix | Delete

#ctf-settings[data-app-loaded="true"]{

[28] Fix | Delete

visibility: visible;

[29] Fix | Delete

opacity: 1;

[30] Fix | Delete

}

[31] Fix | Delete

[32] Fix | Delete

[33] Fix | Delete

#ctf-builder-app {

[34] Fix | Delete

-webkit-font-smoothing: antialiased;

[35] Fix | Delete

}

[36] Fix | Delete

[37] Fix | Delete

Connect Account Popup

[38] Fix | Delete

[39] Fix | Delete

.ctf-fb-types, .ctf-fb-adv-types{

[40] Fix | Delete

padding: 22px 35px 0;

[41] Fix | Delete

}

[42] Fix | Delete

.ctf-fb-types h4, .ctf-fb-section-wh h4 {

[43] Fix | Delete

font-size:20px;

[44] Fix | Delete

line-height: 24px;

[45] Fix | Delete

font-weight: 600;

[46] Fix | Delete

margin: 0 0 4px 0;

[47] Fix | Delete

}

[48] Fix | Delete

.ctf-fb-connectaccount-pp-ctn .ctf-fb-connectaccount-popup{

[49] Fix | Delete

width: 874px;

[50] Fix | Delete

min-height: 280px;

[51] Fix | Delete

}

[52] Fix | Delete

.ctf-fb-source-inp-half{

[53] Fix | Delete

display: grid;

[54] Fix | Delete

grid-template-columns: 49% 49%;

[55] Fix | Delete

grid-column-gap: 1%;

[56] Fix | Delete

}

[57] Fix | Delete

.ctf-fb-connectaccount-popup[data-step="2"] h3{

[58] Fix | Delete

margin-bottom: 22px !important;

[59] Fix | Delete

}

[60] Fix | Delete

.ctf-fb-connectaccount-popup[data-step="2"] .sb-account-connection-button{

[61] Fix | Delete

margin-bottom: 30px;

[62] Fix | Delete

}

[63] Fix | Delete

.ctf-fb-connectaccount-btn{

[64] Fix | Delete

margin-left: 33px;

[65] Fix | Delete

margin-bottom: 36px;

[66] Fix | Delete

position: relative;

[67] Fix | Delete

padding: 13px 19px !important;

[68] Fix | Delete

}

[69] Fix | Delete

.ctf-fb-connectaccount-btn svg{

[70] Fix | Delete

margin-right: 10px;

[71] Fix | Delete

fill: currentColor;

[72] Fix | Delete

width: 17px;

[73] Fix | Delete

float: left;

[74] Fix | Delete

}

[75] Fix | Delete

[76] Fix | Delete

Transitions

[77] Fix | Delete

[78] Fix | Delete

.sb-tr-1{

[79] Fix | Delete

-webkit-transition: all .1s ease-in-out;

[80] Fix | Delete

transition: all .1s ease-in-out;

[81] Fix | Delete

}

[82] Fix | Delete

.sb-tr-2{

[83] Fix | Delete

-webkit-transition: all .2s ease-in-out;

[84] Fix | Delete

transition: all .2s ease-in-out;

[85] Fix | Delete

}

[86] Fix | Delete

.sb-tr-3{

[87] Fix | Delete

-webkit-transition: all .3s ease-in-out;

[88] Fix | Delete

transition: all .3s ease-in-out;

[89] Fix | Delete

}

[90] Fix | Delete

.sb-tr-4{

[91] Fix | Delete

-webkit-transition: all .4s ease-in-out;

[92] Fix | Delete

transition: all .4s ease-in-out;

[93] Fix | Delete

}

[94] Fix | Delete

.sb-tr-5{

[95] Fix | Delete

-webkit-transition: all .5s ease-in-out;

[96] Fix | Delete

transition: all .5s ease-in-out;

[97] Fix | Delete

}

[98] Fix | Delete

.sb-tr-6{

[99] Fix | Delete

-webkit-transition: all .6s ease-in-out;

[100] Fix | Delete

transition: all .6s ease-in-out;

[101] Fix | Delete

}

[102] Fix | Delete

.sb-tr-7{

[103] Fix | Delete

-webkit-transition: all .7s ease-in-out;

[104] Fix | Delete

transition: all .7s ease-in-out;

[105] Fix | Delete

}

[106] Fix | Delete

.sb-tr-8{

[107] Fix | Delete

-webkit-transition: all .8s ease-in-out;

[108] Fix | Delete

transition: all .8s ease-in-out;

[109] Fix | Delete

}

[110] Fix | Delete

.sb-tr-9{

[111] Fix | Delete

-webkit-transition: all .9s ease-in-out;

[112] Fix | Delete

transition: all .9s ease-in-out;

[113] Fix | Delete

}

[114] Fix | Delete

.sb-tr-10{

[115] Fix | Delete

-webkit-transition: all 1s ease-in-out;

[116] Fix | Delete

transition: all 1s ease-in-out;

[117] Fix | Delete

}

[118] Fix | Delete

[119] Fix | Delete

[120] Fix | Delete

* Default, Hover & Focus Colors & Backgrounds

[121] Fix | Delete

[122] Fix | Delete

.sb-small-p,

[123] Fix | Delete

.sb-standard-p{

[124] Fix | Delete

font-style: normal;

[125] Fix | Delete

font-weight: normal;

[126] Fix | Delete

font-size: 14px;

[127] Fix | Delete

line-height: 160%;

[128] Fix | Delete

color: #8C8F9A;

[129] Fix | Delete

margin: 0;

[130] Fix | Delete

}

[131] Fix | Delete

.sb-standard-p{

[132] Fix | Delete

font-size: 16px;

[133] Fix | Delete

color: #141B38;

[134] Fix | Delete

}

[135] Fix | Delete

#ctf-settings h3 {

[136] Fix | Delete

font-style: normal;

[137] Fix | Delete

font-weight: 600;

[138] Fix | Delete

font-size: 24px;

[139] Fix | Delete

line-height: 120%;

[140] Fix | Delete

margin: 0 0 4px 0;

[141] Fix | Delete

letter-spacing: 0;

[142] Fix | Delete

}

[143] Fix | Delete

.sb-caption {

[144] Fix | Delete

font-style: normal;

[145] Fix | Delete

font-weight: normal;

[146] Fix | Delete

font-size: 13px;

[147] Fix | Delete

line-height: 150%;

[148] Fix | Delete

color: #141B38;

[149] Fix | Delete

}

[150] Fix | Delete

.sb-caption.sb-caption-lighter {

[151] Fix | Delete

color: #5F6368;

[152] Fix | Delete

}

[153] Fix | Delete

.sb-small-text {

[154] Fix | Delete

font-size: 12px;

[155] Fix | Delete

}

[156] Fix | Delete

.sb-bold {

[157] Fix | Delete

font-weight: 600;

[158] Fix | Delete

}

[159] Fix | Delete

.sb-dark-text {

[160] Fix | Delete

color: #141B38;

[161] Fix | Delete

}

[162] Fix | Delete

.sb-small {

[163] Fix | Delete

font-style: normal;

[164] Fix | Delete

font-weight: bold;

[165] Fix | Delete

font-size: 10px;

[166] Fix | Delete

line-height: 160%;

[167] Fix | Delete

letter-spacing: 0.08em;

[168] Fix | Delete

text-transform: uppercase;

[169] Fix | Delete

color: #141B38;

[170] Fix | Delete

}

[171] Fix | Delete

.sb-button-no-border {

[172] Fix | Delete

border-radius: 0 !important;

[173] Fix | Delete

border: none !important;

[174] Fix | Delete

}

[175] Fix | Delete

.sb-icon-small svg {

[176] Fix | Delete

height: 10px;

[177] Fix | Delete

}

[178] Fix | Delete

.sb-dark-hover:hover svg, .sb-dark-hover:hover path {

[179] Fix | Delete

fill: #141B38;

[180] Fix | Delete

}

[181] Fix | Delete

/*orange*/

[182] Fix | Delete

.sb-btn-orange{

[183] Fix | Delete

background: #FE544F!important;

[184] Fix | Delete

color: #fff!important;

[185] Fix | Delete

}

[186] Fix | Delete

.sb-btn-orange:hover{

[187] Fix | Delete

background: #EC352F!important;

[188] Fix | Delete

border-color: #EC352F!important;

[189] Fix | Delete

color: #fff!important;

[190] Fix | Delete

}

[191] Fix | Delete

.sb-btn-orange:focus,

[192] Fix | Delete

.sb-btn-orange:active{

[193] Fix | Delete

background: #BC120E!important;

[194] Fix | Delete

border-color: #BC120E!important;

[195] Fix | Delete

color: #fff!important;

[196] Fix | Delete

}

[197] Fix | Delete

[198] Fix | Delete

/*red*/

[199] Fix | Delete

.sb-btn-red{

[200] Fix | Delete

background: #D72C2C!important;

[201] Fix | Delete

color: #fff!important;

[202] Fix | Delete

}

[203] Fix | Delete

.sb-btn-red:hover{

[204] Fix | Delete

background: #DF5757!important;

[205] Fix | Delete

color: #fff!important;

[206] Fix | Delete

}

[207] Fix | Delete

.sb-btn-red:focus,

[208] Fix | Delete

.sb-btn-red:active{

[209] Fix | Delete

background: #841919!important;

[210] Fix | Delete

color: #fff!important;

[211] Fix | Delete

}

[212] Fix | Delete

[213] Fix | Delete

/*red*/

[214] Fix | Delete

.sb-btn-blue{

[215] Fix | Delete

background: #0068A0!important;

[216] Fix | Delete

color: #fff!important;

[217] Fix | Delete

}

[218] Fix | Delete

.sb-btn-blue:hover{

[219] Fix | Delete

background: #0096CC!important;

[220] Fix | Delete

border-color: #0096CC!important;

[221] Fix | Delete

color: #fff!important;

[222] Fix | Delete

}

[223] Fix | Delete

.sb-btn-blue:focus,

[224] Fix | Delete

.sb-btn-blue:active{

[225] Fix | Delete

background: #004D77!important;

[226] Fix | Delete

border-color: #004D77!important;

[227] Fix | Delete

color: #fff!important;

[228] Fix | Delete

}

[229] Fix | Delete

[230] Fix | Delete

/*grey*/

[231] Fix | Delete

.sb-btn-grey{

[232] Fix | Delete

background: #F3F4F5!important;

[233] Fix | Delete

color: #141B38!important;

[234] Fix | Delete

border: 1px solid #D0D1D7!important;

[235] Fix | Delete

}

[236] Fix | Delete

.sb-btn-grey:hover{

[237] Fix | Delete

background: #fff!important;

[238] Fix | Delete

color: #141B38!important;

[239] Fix | Delete

border: 1px solid #DCDDE1!important;

[240] Fix | Delete

}

[241] Fix | Delete

.sb-btn-grey:focus,

[242] Fix | Delete

.sb-btn-grey:active{

[243] Fix | Delete

background: #E8E8EB!important;

[244] Fix | Delete

color: #141B38!important;

[245] Fix | Delete

border: 1px solid #D0D1D7!important;

[246] Fix | Delete

}

[247] Fix | Delete

/*gray*/

[248] Fix | Delete

.sb-btn-gray {

[249] Fix | Delete

background: #F9F9FA !important;

[250] Fix | Delete

color: #141B38 !important;

[251] Fix | Delete

border: 1px solid #E6E6EB!important;

[252] Fix | Delete

}

[253] Fix | Delete

/*dark*/

[254] Fix | Delete

.sb-btn-dark{

[255] Fix | Delete

background: #2C324C!important;

[256] Fix | Delete

color: #fff!important;

[257] Fix | Delete

}

[258] Fix | Delete

.sb-btn-dark:hover{

[259] Fix | Delete

background: #434960!important;

[260] Fix | Delete

color: #fff!important;

[261] Fix | Delete

}

[262] Fix | Delete

.sb-btn-dark:focus,

[263] Fix | Delete

.sb-btn-dark:active{

[264] Fix | Delete

background: #141B38!important;

[265] Fix | Delete

color: #fff!important;

[266] Fix | Delete

}

[267] Fix | Delete

[268] Fix | Delete

/*orange*/

[269] Fix | Delete

.ctf-btn-orange{

[270] Fix | Delete

background: #FE544F!important;

[271] Fix | Delete

color: #fff!important;

[272] Fix | Delete

}

[273] Fix | Delete

.ctf-btn-orange:hover{

[274] Fix | Delete

background: #EC352F!important;

[275] Fix | Delete

color: #fff!important;

[276] Fix | Delete

}

[277] Fix | Delete

.ctf-btn-orange:focus,

[278] Fix | Delete

.ctf-btn-orange:active{

[279] Fix | Delete

background: #BC120E!important;

[280] Fix | Delete

color: #fff!important;

[281] Fix | Delete

}

[282] Fix | Delete

[283] Fix | Delete

/*red*/

[284] Fix | Delete

.ctf-btn-red{

[285] Fix | Delete

background: #D72C2C!important;

[286] Fix | Delete

color: #fff!important;

[287] Fix | Delete

}

[288] Fix | Delete

.ctf-btn-red:hover{

[289] Fix | Delete

background: #DF5757!important;

[290] Fix | Delete

color: #fff!important;

[291] Fix | Delete

}

[292] Fix | Delete

.ctf-btn-red:focus,

[293] Fix | Delete

.ctf-btn-red:active{

[294] Fix | Delete

background: #841919!important;

[295] Fix | Delete

color: #fff!important;

[296] Fix | Delete

}

[297] Fix | Delete

[298] Fix | Delete

/*red*/

[299] Fix | Delete

.ctf-btn-blue{

[300] Fix | Delete

background: #0068A0!important;

[301] Fix | Delete

color: #fff!important;

[302] Fix | Delete

}

[303] Fix | Delete

.ctf-btn-blue:hover{

[304] Fix | Delete

background: #0096CC!important;

[305] Fix | Delete

color: #fff!important;

[306] Fix | Delete

}

[307] Fix | Delete

.ctf-btn-blue:focus,

[308] Fix | Delete

.ctf-btn-blue:active{

[309] Fix | Delete

background: #004D77!important;

[310] Fix | Delete

color: #fff!important;

[311] Fix | Delete

}

[312] Fix | Delete

[313] Fix | Delete

/*grey*/

[314] Fix | Delete

.ctf-btn-grey{

[315] Fix | Delete

background: #F3F4F5!important;

[316] Fix | Delete

color: #141B38!important;

[317] Fix | Delete

border: 1px solid #D0D1D7!important;

[318] Fix | Delete

}

[319] Fix | Delete

.ctf-btn-grey:hover{

[320] Fix | Delete

background: #fff!important;

[321] Fix | Delete

color: #141B38!important;

[322] Fix | Delete

border: 1px solid #DCDDE1!important;

[323] Fix | Delete

}

[324] Fix | Delete

.ctf-btn-grey:focus,

[325] Fix | Delete

.ctf-btn-grey:active{

[326] Fix | Delete

background: #E8E8EB!important;

[327] Fix | Delete

color: #141B38!important;

[328] Fix | Delete

border: 1px solid #D0D1D7!important;

[329] Fix | Delete

}

[330] Fix | Delete

[331] Fix | Delete

/*dark*/

[332] Fix | Delete

.ctf-btn-dark{

[333] Fix | Delete

background: #2C324C!important;

[334] Fix | Delete

color: #fff!important;

[335] Fix | Delete

}

[336] Fix | Delete

.ctf-btn-dark:hover{

[337] Fix | Delete

background: #434960!important;

[338] Fix | Delete

color: #fff!important;

[339] Fix | Delete

}

[340] Fix | Delete

.ctf-btn-dark:focus,

[341] Fix | Delete

.ctf-btn-dark:active{

[342] Fix | Delete

background: #141B38!important;

[343] Fix | Delete

color: #fff!important;

[344] Fix | Delete

}

[345] Fix | Delete

[346] Fix | Delete

/*disabled*/

[347] Fix | Delete

.sb-btn-orange[data-active="false"],

[348] Fix | Delete

.sb-btn-blue[data-active="false"],

[349] Fix | Delete

.sb-btn-red[data-active="false"],

[350] Fix | Delete

.sb-btn-grey[data-active="false"],

[351] Fix | Delete

.sb-btn-dark[data-active="false"]{

[352] Fix | Delete

background: #E8E8EB !important;

[353] Fix | Delete

color: #8C8F9A !important;

[354] Fix | Delete

}

[355] Fix | Delete

[356] Fix | Delete

[357] Fix | Delete

[358] Fix | Delete

* Social Colors

[359] Fix | Delete

[360] Fix | Delete

[361] Fix | Delete

/*Facebook*/

[362] Fix | Delete

.sb-cl-facebook,

[363] Fix | Delete

.sb-clhv-facebook:hover{

[364] Fix | Delete

color: #006BFA!important;

[365] Fix | Delete

}

[366] Fix | Delete

.ctf-bg-facebook,

[367] Fix | Delete

.ctf-bghv-facebook:hover{

[368] Fix | Delete

background: #006BFA!important;

[369] Fix | Delete

}

[370] Fix | Delete

[371] Fix | Delete

/*Instagram*/

[372] Fix | Delete

.sb-cl-instagram,

[373] Fix | Delete

.sb-clhv-instagram:hover{

[374] Fix | Delete

color: #BA03A7!important;

[375] Fix | Delete

}

[376] Fix | Delete

.ctf-bg-instagram,

[377] Fix | Delete

.ctf-bghv-instagram:hover{

[378] Fix | Delete

background: #BA03A7!important;

[379] Fix | Delete

}

[380] Fix | Delete

[381] Fix | Delete

/*Twitter*/

[382] Fix | Delete

.sb-cl-twitter,

[383] Fix | Delete

.sb-clhv-twitter:hover{

[384] Fix | Delete

color: #1B90EF!important;

[385] Fix | Delete

}

[386] Fix | Delete

.ctf-bg-twitter,

[387] Fix | Delete

.ctf-bghv-twitter:hover{

[388] Fix | Delete

background: #1B90EF!important;

[389] Fix | Delete

}

[390] Fix | Delete

[391] Fix | Delete

/*YouTube*/

[392] Fix | Delete

.sb-cl-youtube,

[393] Fix | Delete

.sb-clhv-youtube:hover{

[394] Fix | Delete

color: #EB2121!important;

[395] Fix | Delete

}

[396] Fix | Delete

.ctf-bg-youtube,

[397] Fix | Delete

.ctf-bghv-youtube:hover{

[398] Fix | Delete

background: #EB2121!important;

[399] Fix | Delete

}

[400] Fix | Delete

[401] Fix | Delete

/*Linkedin*/

[402] Fix | Delete

.sb-cl-linkedin,

[403] Fix | Delete

.sb-clhv-linkedin:hover{

[404] Fix | Delete

color: #007bb6!important;

[405] Fix | Delete

}

[406] Fix | Delete

.ctf-bg-linkedin,

[407] Fix | Delete

.ctf-bghv-linkedin:hover{

[408] Fix | Delete

background: #007bb6!important;

[409] Fix | Delete

}

[410] Fix | Delete

[411] Fix | Delete

/*Mail*/

[412] Fix | Delete

.sb-cl-mail,

[413] Fix | Delete

.sb-clhv-mail:hover{

[414] Fix | Delete

color: #666!important;

[415] Fix | Delete

}

[416] Fix | Delete

.ctf-bg-mail,

[417] Fix | Delete

.ctf-bghv-mail:hover{

[418] Fix | Delete

background: #666!important;

[419] Fix | Delete

}

[420] Fix | Delete

[421] Fix | Delete

.sb-cursor-pointer{

[422] Fix | Delete

cursor: pointer;

[423] Fix | Delete

}

[424] Fix | Delete

[425] Fix | Delete

/*Buttons*/

[426] Fix | Delete

.sb-btn{

[427] Fix | Delete

display: flex;

[428] Fix | Delete

flex-direction: row;

[429] Fix | Delete

justify-content: center;

[430] Fix | Delete

align-items: center;

[431] Fix | Delete

padding: 9px 38px;

[432] Fix | Delete

font-style: normal;

[433] Fix | Delete

font-weight: 500;

[434] Fix | Delete

font-size: 14px;

[435] Fix | Delete

line-height: 17px;

[436] Fix | Delete

border-radius: 2px;

[437] Fix | Delete

cursor: pointer;

[438] Fix | Delete

color: #fff;

[439] Fix | Delete

outline: none;

[440] Fix | Delete

box-shadow: none;

[441] Fix | Delete

border: none;;

[442] Fix | Delete

}

[443] Fix | Delete

.sb-btn:focus{

[444] Fix | Delete

box-shadow: none;

[445] Fix | Delete

}

[446] Fix | Delete

[447] Fix | Delete

.ctf-small-chevron svg{

[448] Fix | Delete

width: 6px;

[449] Fix | Delete

height: 8px;

[450] Fix | Delete

top: 14px;

[451] Fix | Delete

left: 18px;

[452] Fix | Delete

}

[453] Fix | Delete

[454] Fix | Delete

.sb-btn-right-icon{

[455] Fix | Delete

display: flex;

[456] Fix | Delete

justify-content: flex-start;

[457] Fix | Delete

padding: 15px 12px;

[458] Fix | Delete

}

[459] Fix | Delete

.sb-btn-right-txt{

[460] Fix | Delete

display: flex;

[461] Fix | Delete

justify-content: flex-start;

[462] Fix | Delete

align-items: center;

[463] Fix | Delete

line-height: 1em;

[464] Fix | Delete

}

[465] Fix | Delete

.sb-btn-right-txt svg{

[466] Fix | Delete

float: left;

[467] Fix | Delete

margin-right: 10px;

[468] Fix | Delete

}

[469] Fix | Delete

[470] Fix | Delete

.sb-btn-right-chevron{

[471] Fix | Delete

width: 7px;

[472] Fix | Delete

height: 7px;

[473] Fix | Delete

border-right: 2px solid currentColor;

[474] Fix | Delete

border-bottom: 2px solid currentColor;

[475] Fix | Delete

-webkit-transform: rotate(-45deg);

[476] Fix | Delete

transform: rotate(-45deg);

[477] Fix | Delete

margin-left: auto;

[478] Fix | Delete

margin-right: 10px;

[479] Fix | Delete

}

[480] Fix | Delete

[481] Fix | Delete

/*Add Source*/

[482] Fix | Delete

[483] Fix | Delete

Add new Source Popup

[484] Fix | Delete

[485] Fix | Delete

.ctf-fb-popup-cls{

[486] Fix | Delete

height: 14px;

[487] Fix | Delete

width: 14px;

[488] Fix | Delete

position: absolute;

[489] Fix | Delete

cursor: pointer;

[490] Fix | Delete

right: 17px;

[491] Fix | Delete

top: 17px;

[492] Fix | Delete

z-index: 3;

[493] Fix | Delete

}

[494] Fix | Delete

.ctf-fb-center-boss{

[495] Fix | Delete

display: flex;

[496] Fix | Delete

justify-content: center;

[497] Fix | Delete

align-items: center;

[498] Fix | Delete

}

[499] Fix | Delete

12 3 4 5 6 7