style.css 68 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829283028312832283328342835283628372838283928402841284228432844284528462847284828492850285128522853285428552856285728582859286028612862286328642865286628672868286928702871287228732874287528762877287828792880288128822883288428852886288728882889289028912892289328942895289628972898289929002901290229032904290529062907290829092910291129122913291429152916291729182919292029212922292329242925292629272928292929302931293229332934293529362937293829392940294129422943294429452946294729482949295029512952295329542955
  1. /*
  2. Template Name: Acme Business Template with Bootstrap 3
  3. Template Version: 1.0
  4. Author: cosmic
  5. Website:
  6. */
  7. body {
  8. color: #373a3c;
  9. padding: 0px !important;
  10. margin: 0px !important;
  11. font-size: 14px;
  12. }
  13. a {
  14. text-decoration: none;
  15. outline: none;
  16. }
  17. a:hover,
  18. a:focus {
  19. text-decoration: underline;
  20. outline: none;
  21. color: #046DBC;
  22. }
  23. .external.text:hover, .external.text:focus {
  24. color: #015301;
  25. }
  26. p { line-height: 22px }
  27. /*header*/
  28. .head-section { border-bottom: 1px solid #eee }
  29. .head-section .navbar {
  30. margin-bottom: 0;
  31. }
  32. .navbar-default { border: none }
  33. .navbar-brand {
  34. color: #bcc0cd;
  35. font-size: 30px;
  36. font-weight: 100;
  37. line-height: 30px;
  38. margin-top: 30px;
  39. padding: 0;
  40. }
  41. .navbar-brand span { color: rgb(44, 62, 80) }
  42. .head-section .navbar-collapse ul.navbar-nav {
  43. float: right;
  44. margin-right: 0;
  45. z-index: 199;
  46. }
  47. .head-section .navbar-default { background-color: #fff }
  48. .head-section .nav li a,
  49. .head-section .nav li.active ul.dropdown-menu li a {
  50. color: #373A3C;
  51. font-size: 14px;
  52. font-weight: 300;
  53. background: none;
  54. }
  55. ul.dropdown-menu { border: none }
  56. .head-section .nav li a:hover,
  57. .head-section .nav li a:focus,
  58. .head-section .nav li.active a,
  59. .head-section .nav li.active a:hover,
  60. .head-section .nav li a.dropdown-toggle:hover,
  61. .head-section .nav li a.dropdown-toggle:focus,
  62. .head-section .nav li.active ul.dropdown-menu li a:hover,
  63. .head-section .nav li.active ul.dropdown-menu li.active a {
  64. color: #fff;
  65. background-color: rgb(44, 62, 80);
  66. -webkit-transition: all .3s ease;
  67. -moz-transition: all .3s ease;
  68. -ms-transition: all .3s ease;
  69. -o-transition: all .3s ease;
  70. transition: all .3s ease;
  71. }
  72. .head-section .navbar-default .navbar-nav > .open > a,
  73. .head-section .navbar-default .navbar-nav > .open > a:hover,
  74. .head-section .navbar-default .navbar-nav > .open > a:focus {
  75. color: #fff;
  76. background-color: rgb(44, 62, 80);
  77. -webkit-transition: all .3s ease;
  78. -moz-transition: all .3s ease;
  79. -ms-transition: all .3s ease;
  80. -o-transition: all .3s ease;
  81. transition: all .3s ease;
  82. }
  83. .head-section .navbar { min-height: 85px }
  84. .head-section .navbar-nav > li {
  85. padding-bottom: 25px;
  86. padding-top: 30px;
  87. }
  88. .head-section ul.navbar-nav li:last-child() { margin-left: 10px !important }
  89. .head-section .navbar-nav > li > a {
  90. padding-bottom: 5px;
  91. padding-top: 5px;
  92. margin-left: 2px;
  93. line-height: 30px;
  94. -webkit-transition: all .3s ease;
  95. -moz-transition: all .3s ease;
  96. -ms-transition: all .3s ease;
  97. -o-transition: all .3s ease;
  98. transition: all .3s ease;
  99. }
  100. .dropdown-menu li a:hover { color: #fff !important }
  101. .head-section .navbar-default .navbar-nav > .open > a .caret,
  102. .navbar-default .nav li.dropdown > a:focus .caret {
  103. border-top-color: #ffffff;
  104. border-bottom-color: #ffffff;
  105. -webkit-transition: all .3s ease;
  106. -moz-transition: all .3s ease;
  107. -ms-transition: all .3s ease;
  108. -o-transition: all .3s ease;
  109. transition: all .3s ease;
  110. color: #fff;
  111. }
  112. .dropdown-menu { box-shadow: none }
  113. .head-section .nav li .dropdown-menu {
  114. padding: 0;
  115. box-shadow: 0 2px 5px rgba(50,50,50,0.1);
  116. }
  117. .head-section .nav li .dropdown-menu li a {
  118. line-height: 25px;
  119. padding: 3px 12px;
  120. border-bottom: none;
  121. }
  122. /*search*/
  123. .search {
  124. margin-top: 3px;
  125. border-radius: 0px;
  126. -webkit-border-radius: 0px;
  127. -moz-border-radius: 0px;
  128. width: 180px;
  129. -webkit-transition: all .3s ease;
  130. -moz-transition: all .3s ease;
  131. -ms-transition: all .3s ease;
  132. -o-transition: all .3s ease;
  133. transition: all .3s ease;
  134. border: 1px solid #fff;
  135. box-shadow: none;
  136. background: none;
  137. padding-left: 10px;
  138. color: #fff;
  139. margin-left: 10px;
  140. }
  141. #searchInput:hover, #searchInput:focus {
  142. color: gray;
  143. }
  144. #searchInput {
  145. border-color: gray;
  146. color: gray;
  147. }
  148. .search:focus {
  149. margin-top: 3px;
  150. width: 180px;
  151. border: 1px solid #eaeaea;
  152. box-shadow: none;
  153. -webkit-transition: all .3s ease;
  154. -moz-transition: all .3s ease;
  155. -ms-transition: all .3s ease;
  156. -o-transition: all .3s ease;
  157. transition: all .3s ease;
  158. color: gray;
  159. font-weight: 300;
  160. margin-left: 10px;
  161. }
  162. /*homepage features*/
  163. .feature-head { padding: 10px 0 }
  164. .feature-head h1 {
  165. color: #797979;
  166. font-size: 30px;
  167. font-weight: 300;
  168. text-transform: uppercase;
  169. margin-top: 40px;
  170. margin-bottom: 20px;
  171. }
  172. .feature-head p {
  173. color: #8a8b8b;
  174. font-size: 18px;
  175. font-weight: 300;
  176. text-align: center;
  177. padding-bottom: 5px;
  178. margin-bottom: 20px;
  179. }
  180. .f-box {
  181. background: #f4f4f4;
  182. padding: 20px;
  183. text-align: center;
  184. min-height: 210px;
  185. margin-bottom: 20px;
  186. transition-duration: 500ms;
  187. transition-property: width, background;
  188. transition-timing-function: ease;
  189. -webkit-transition-duration: 500ms;
  190. -webkit-transition-property: width, background;
  191. -webkit-transition-timing-function: ease;
  192. }
  193. .f-box i {
  194. font-size: 50px;
  195. line-height: normal;
  196. margin-top: 40px;
  197. display: block;
  198. color: rgb(44, 62, 80);
  199. }
  200. .f-box:hover,
  201. .f-box.active {
  202. background: rgb(44, 62, 80);
  203. padding: 20px;
  204. text-align: center;
  205. min-height: 210px;
  206. margin-bottom: 20px;
  207. transition-duration: 500ms;
  208. transition-property: width, background;
  209. transition-timing-function: ease;
  210. -webkit-transition-duration: 500ms;
  211. -webkit-transition-property: width, background;
  212. -webkit-transition-timing-function: ease;
  213. }
  214. .f-box:hover i,
  215. .f-box.active i {
  216. font-size: 50px;
  217. line-height: normal;
  218. margin-top: 40px;
  219. display: block;
  220. color: #fff;
  221. }
  222. .f-box:hover h2,
  223. .f-box.active h2 { color: #fff }
  224. .f-box h2 {
  225. font-size: 20px;
  226. text-transform: uppercase;
  227. font-weight: 400;
  228. }
  229. .f-text {
  230. font-size: 14px;
  231. font-weight: 300;
  232. padding-bottom: 10px;
  233. margin-bottom: 15px;
  234. }
  235. /*quote*/
  236. .quote {
  237. margin: 40px 0 40px 0;
  238. display: inline-block;
  239. width: 100%;
  240. }
  241. .quote-info {
  242. padding: 20px;
  243. min-height: 72px;
  244. margin-top: 10px;
  245. }
  246. .quote-info h1 {
  247. color: #fff;
  248. font-weight: 400;
  249. font-size: 26px;
  250. margin: 0 0 15px 0;
  251. text-transform: uppercase;
  252. }
  253. .quote-info p {
  254. color: #9eb3c4;
  255. font-weight: 300;
  256. font-size: 16px;
  257. margin: 0 0 20px 0px;
  258. }
  259. .purchase-btn {
  260. width: 200px;
  261. height: 60px;
  262. line-height: 46px;
  263. font-size: 20px;
  264. font-weight: 400;
  265. text-transform: uppercase;
  266. color: #000;
  267. transition-duration: 500ms;
  268. transition-property: width, background, color;
  269. transition-timing-function: ease;
  270. -webkit-transition-duration: 500ms;
  271. -webkit-transition-property: width, background;
  272. -webkit-transition-timing-function: ease;
  273. }
  274. .purchase-btn:hover {
  275. background-color: #16a085;
  276. border: 1px solid #16a085;
  277. color: #fff;
  278. transition-duration: 500ms;
  279. transition-property: width, background, color;
  280. transition-timing-function: ease;
  281. -webkit-transition-duration: 500ms;
  282. -webkit-transition-property: width, background;
  283. -webkit-transition-timing-function: ease;
  284. }
  285. .accordion {
  286. margin-bottom: 40px;
  287. display: inline-block;
  288. width: 100%;
  289. }
  290. /*tabs*/
  291. .tab { background: transparent; }
  292. .tab .nav > li > a { padding: 18px 15px }
  293. .tab-bg-dark-navy-blue {
  294. background: #6f6f6f;
  295. border-bottom: none;
  296. padding: 0;
  297. }
  298. .tab-bg-dark-navy-blue .nav > li > a:hover,
  299. .tab-bg-dark-navy-blue .nav > li > a:focus {
  300. background-color: #f4f4f4;
  301. text-decoration: none;
  302. }
  303. .panel-heading .nav > li > a,
  304. .panel-heading .nav > li.active > a,
  305. .panel-heading .nav > li.active > a:hover,
  306. .panel-heading .nav > li.active > a:focus {
  307. border-width: 0;
  308. border-radius: 0;
  309. }
  310. .panel-heading .nav > li > a { color: #fff }
  311. .panel-heading .nav > li.active > a,
  312. .panel-heading .nav > li > a:hover {
  313. color: #6f6f6f;
  314. background: #f4f4f4;
  315. }
  316. .panel-heading .nav > li:first-child.active > a,
  317. .panel-heading .nav > li:first-child > a:hover { }
  318. .tab .nav-tabs.nav-justified > li { border-right: 1px solid #f4f4f4 }
  319. .tab .nav-tabs.nav-justified > li:last-child { border-right: none }
  320. .p-head {
  321. color: rgb(44, 62, 80);
  322. font-size: 14px;
  323. font-weight: 400;
  324. }
  325. .cmt-head {
  326. font-size: 14px;
  327. font-weight: 400;
  328. }
  329. .p-thumb img {
  330. border-radius: 3px;
  331. -moz-border-radius: 3px;
  332. -webkit-border-radius: 3px;
  333. height: 50px;
  334. width: 50px;
  335. }
  336. /*testimonial*/
  337. .about-testimonial ul li { list-style: none }
  338. .about-testimonial {
  339. margin: 20px 0 0 0;
  340. position: relative;
  341. }
  342. ul.about-flex-slides { margin-left: 0 }
  343. .flex-direction-nav {
  344. position: absolute;
  345. right: 10px;
  346. top: 30px;
  347. width: 70px;
  348. }
  349. .flex-direction-nav li {
  350. display: inline-block;
  351. width: 12px;
  352. }
  353. .flex-direction-nav li a { outline: none }
  354. .flex-direction-nav li a i { color: #cccccc }
  355. .flex-control-paging { display: none }
  356. .about-carousel { margin-top: 8px }
  357. .about-testimonial .about-testimonial-image {
  358. float: left;
  359. margin: 0 15px;
  360. position: relative;
  361. }
  362. .about-testimonial .about-testimonial-image img {
  363. border-radius: 5px;
  364. -moz-border-radius: 5px;
  365. -webkit-border-radius: 5px;
  366. height: 100px !important;
  367. width: 100px !important;
  368. }
  369. .about-flexslider .about-flex-slides img {
  370. display: block;
  371. width: 100%;
  372. }
  373. .about-testimonial a.about-testimonial-author {
  374. display: inline-block;
  375. font-size: 15px;
  376. text-transform: uppercase;
  377. font-weight: bold;
  378. line-height: 11px;
  379. margin: 30px 0 8px 0;
  380. color: #504946;
  381. font-weight: 300;
  382. }
  383. .about-testimonial .about-testimonial-company {
  384. display: block;
  385. font-size: 13px;
  386. line-height: 14px;
  387. color: #ababab;
  388. font-weight: 300;
  389. }
  390. .about-testimonial.boxed-style .about-testimonial-content {
  391. background-color: #fff;
  392. margin-right: 1px;
  393. border: 1px solid #e9e9e9;
  394. }
  395. .about-testimonial .about-testimonial-content {
  396. margin-top: 55px;
  397. padding: 20px;
  398. position: relative;
  399. }
  400. .about-testimonial .about-testimonial-content p {
  401. line-height: 20px;
  402. margin: 0;
  403. }
  404. .about-testimonial.boxed-style .about-testimonial-content:before {
  405. background-color: #fff;
  406. border-top: 1px solid #e9e9e9;
  407. border-left: 1px solid #e9e9e9;
  408. top: -8px;
  409. content: "";
  410. display: block;
  411. height: 14px;
  412. left: 60px;
  413. position: absolute;
  414. transform: rotate(45deg);
  415. -moz-transform: rotate(45deg);
  416. -webkit-transform: rotate(45deg);
  417. width: 15px;
  418. display: none\0/;
  419. _display: none;
  420. }
  421. /*----image hove----*/
  422. .view {
  423. float: left;
  424. overflow: hidden;
  425. position: relative;
  426. text-align: center;
  427. cursor: default;
  428. background: #fff;
  429. }
  430. .view .mask,
  431. .view .content {
  432. position: absolute;
  433. overflow: hidden;
  434. top: 0;
  435. left: 0;
  436. height: 100%;
  437. width: 100%;
  438. }
  439. .view img {
  440. display: block;
  441. position: relative;
  442. }
  443. .view h2 {
  444. text-transform: uppercase;
  445. color: #fff;
  446. text-align: center;
  447. position: relative;
  448. font-size: 16px;
  449. padding: 10px;
  450. background: rgba(0, 0, 0, 0.8);
  451. margin: 5px 0 0 0;
  452. }
  453. .view p {
  454. font-size: 12px;
  455. position: relative;
  456. color: #fff;
  457. padding: 10px 20px 20px;
  458. text-align: center;
  459. margin-bottom: 10px;
  460. }
  461. .view a.info {
  462. display: inline-block;
  463. background-color: rgba(0,0,0,0.6);
  464. width: 50px;
  465. height: 50px;
  466. line-height: 50px;
  467. border-radius: 60px;
  468. -moz-border-radius: 60px;
  469. -webkit-border-radius: 60px;
  470. }
  471. .view a.info:hover { background-color: rgb(44, 62, 80) }
  472. .mask a i {
  473. color: #fff !important;
  474. font-size: 16px;
  475. }
  476. .view-tenth img {
  477. -webkit-transform: scaleY(1);
  478. -moz-transform: scaleY(1);
  479. -o-transform: scaleY(1);
  480. -ms-transform: scaleY(1);
  481. transform: scaleY(1);
  482. -webkit-transition: all 0.4s ease-in-out;
  483. -moz-transition: all 0.4s ease-in-out;
  484. -o-transition: all 0.4s ease-in-out;
  485. -ms-transition: all 0.4s ease-in-out;
  486. transition: all 0.4s ease-in-out;
  487. }
  488. .view-tenth .mask {
  489. background-color: rgba(0, 0, 0, 0.3);
  490. -webkit-transition: all 0.5s linear;
  491. -moz-transition: all 0.5s linear;
  492. -o-transition: all 0.5s linear;
  493. -ms-transition: all 0.5s linear;
  494. transition: all 0.5s linear;
  495. -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
  496. filter: alpha(opacity=0);
  497. opacity: 0;
  498. }
  499. .view-tenth h2 {
  500. background: transparent;
  501. margin: 0px 10px;
  502. -webkit-transform: scale();
  503. -moz-transform: scale();
  504. -o-transform: scale();
  505. -ms-transform: scale();
  506. transform: scale();
  507. color: #333;
  508. -webkit-transition: all 0.5s linear;
  509. -moz-transition: all 0.5s linear;
  510. -o-transition: all 0.5s linear;
  511. -ms-transition: all 0.5s linear;
  512. transition: all 0.5s linear;
  513. -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
  514. filter: alpha(opacity=0);
  515. opacity: 0;
  516. }
  517. .view-tenth p {
  518. color: #333;
  519. line-height: normal;
  520. -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
  521. filter: alpha(opacity=0);
  522. opacity: 0;
  523. -webkit-transform: scale();
  524. -moz-transform: scale();
  525. -o-transform: scale();
  526. -ms-transform: scale();
  527. transform: scale();
  528. -webkit-transition: all 0.5s linear;
  529. -moz-transition: all 0.5s linear;
  530. -o-transition: all 0.5s linear;
  531. -ms-transition: all 0.5s linear;
  532. transition: all 0.5s linear;
  533. }
  534. .view-tenth a.info {
  535. -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
  536. filter: alpha(opacity=0);
  537. opacity: 0;
  538. -webkit-transform: scale();
  539. -moz-transform: scale();
  540. -o-transform: scale();
  541. -ms-transform: scale();
  542. transform: scale();
  543. -webkit-transition: all 0.5s linear;
  544. -moz-transition: all 0.5s linear;
  545. -o-transition: all 0.5s linear;
  546. -ms-transition: all 0.5s linear;
  547. transition: all 0.5s linear;
  548. }
  549. .view-tenth:hover img {
  550. -webkit-transform: scale(5);
  551. -moz-transform: scale(5);
  552. -o-transform: scale(5);
  553. -ms-transform: scale(5);
  554. transform: scale(5);
  555. -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
  556. filter: alpha(opacity=.5);
  557. opacity: .5;
  558. }
  559. .view-tenth:hover .mask {
  560. -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
  561. filter: alpha(opacity=100);
  562. opacity: 1;
  563. }
  564. .view-tenth:hover h2,
  565. .view-tenth:hover p,
  566. .view-tenth:hover a.info {
  567. -webkit-transform: scale(1);
  568. -moz-transform: scale(1);
  569. -o-transform: scale(1);
  570. -ms-transform: scale(1);
  571. transform: scale(1);
  572. -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
  573. filter: alpha(opacity=100);
  574. opacity: 1;
  575. }
  576. /*imageview icon hover*/
  577. [data-zlname] {
  578. position: relative;
  579. overflow: hidden;
  580. -moz-box-sizing: border-box;
  581. -webkit-box-sizing: border-box;
  582. box-sizing: border-box;
  583. }
  584. /*IMGS IN CONTAINER*/
  585. [data-zlname] > img {
  586. display: block;
  587. max-width: 100%;
  588. }
  589. /*POP UP ELEMENTS*/
  590. [data-zlname] [data-zl-popup] {
  591. position: absolute;
  592. display: block;
  593. padding: 1px;
  594. height: 40px;
  595. width: 40px;
  596. background: #323231;
  597. color: #fff;
  598. overflow: hidden;
  599. display: none;
  600. text-align: center;
  601. }
  602. /*OVERLAY*/
  603. /*classic*/
  604. [data-zl-overlay] {
  605. top: 0;
  606. left: 0;
  607. position: absolute;
  608. width: 100%;
  609. height: 100%;
  610. display: none;
  611. padding: inherit;
  612. }
  613. /*four*/
  614. [data-zl-ovzoom0],
  615. [data-zl-ovzoom1],
  616. [data-zl-ovzoom2],
  617. [data-zl-ovzoom3] {
  618. position: absolute;
  619. width: 25%;
  620. height: 100%;
  621. }
  622. /*rolling*/
  623. [data-zl-ovrolling] {
  624. position: absolute;
  625. display: none;
  626. width: 100%;
  627. height: 100%;
  628. }
  629. /*double*/
  630. [data-zl-ovdouble0],
  631. [data-zl-ovdouble1] {
  632. position: absolute;
  633. display: none;
  634. }
  635. /*-------*/
  636. [data-zlname = reverse-effect] [data-zl-popup = link] {
  637. background: rgba(256,256,256,1);
  638. border-radius: 50%;
  639. -webkit-border-radius: 50%;
  640. -moz-border-radius: 50%;
  641. }
  642. [data-zlname = reverse-effect] [data-zl-popup = link2] {
  643. background: rgba(256,256,256,1);
  644. border-radius: 50%;
  645. -webkit-border-radius: 50%;
  646. -moz-border-radius: 50%;
  647. }
  648. [data-zlname = reverse-effect] [data-zl-popup = link]:hover,
  649. [data-zlname = reverse-effect] [data-zl-popup = link2]:hover { opacity: .5 }
  650. .bx-wrapper { }
  651. /*pricing table*/
  652. .price-two-container {
  653. margin-bottom: 50px;
  654. margin-top: 15px;
  655. }
  656. .mar-two { margin-bottom: 3px }
  657. .service-price-one h1 {
  658. margin-top: 30px;
  659. margin-bottom: 20px;
  660. display: inline-block;
  661. border-bottom: 1px solid #c7c7c7;
  662. padding-bottom: 5px;
  663. text-transform: uppercase;
  664. }
  665. .pricing-table {
  666. background: #fff;
  667. text-align: center;
  668. margin: 0 -8px 30px;
  669. padding: 0 0 25px 0;
  670. border: 1px solid #eee;
  671. border-radius: 1px;
  672. -moz-border-radius: 1px;
  673. -webkit-border-radius: 1px;
  674. }
  675. .pricing-table.most-popular {
  676. top: -20px;
  677. position: relative;
  678. }
  679. .most-popular {
  680. background: rgb(44, 62, 80);
  681. color: #fff;
  682. border: 1px solid #16a085;
  683. }
  684. .most-popular h1 {
  685. font-size: 25px !important;
  686. padding-bottom: 10px;
  687. padding-top: 17px !important;
  688. }
  689. .most-popular h2 {
  690. background: #16a085 !important;
  691. margin-top: 20px !important;
  692. }
  693. .most-popular ul li { border-bottom: 1px dotted #fff !important }
  694. .most-popular .price-actions .btn {
  695. background: #f35958 !important;
  696. margin: 10px 0;
  697. cursor: pointer;
  698. }
  699. .pricing-table .price-actions .btn {
  700. border-radius: 5px;
  701. -moz-border-radius: 5px;
  702. -webkit-border-radius: 4px;
  703. background: rgb(44, 62, 80);
  704. color: #fff;
  705. border: none;
  706. box-shadow: none;
  707. text-shadow: none;
  708. padding: 10px 20px;
  709. width: 90%;
  710. cursor: pointer;
  711. }
  712. .pricing-head h1 {
  713. font-size: 20px;
  714. font-weight: 300;
  715. padding-top: 15px;
  716. }
  717. .pricing-head h2 {
  718. padding: 30px 0;
  719. background: #EEC;
  720. font-size: 50px;
  721. border-radius: 50%;
  722. -moz-border-radius: 50%;
  723. -webkit-border-radius: 50%;
  724. font-weight: 100;
  725. }
  726. .pricing-table ul {
  727. margin: 15px 0;
  728. padding: 0;
  729. }
  730. .pricing-table ul li {
  731. border-bottom: 1px dotted #CCCCCC;
  732. margin: 0 2em;
  733. padding: 1em 0;
  734. text-align: center;
  735. font-weight: 300;
  736. }
  737. .pricing-head span.note {
  738. display: inline;
  739. font-size: 25px;
  740. line-height: 0.8em;
  741. position: relative;
  742. top: -18px;
  743. }
  744. .pricing-quotation,
  745. .team-info {
  746. background: #EEEEEE;
  747. padding: 20px 20px 35px 20px;
  748. margin-bottom: 100px;
  749. display: inline-block;
  750. width: 100%;
  751. text-align: center;
  752. border-radius: 5px;
  753. -moz-border-radius: 5px;
  754. -webkit-border-radius: 5px;
  755. }
  756. .pricing-quotation h3,
  757. .team-info h3 { font-weight: 300 }
  758. .pricing-quotation p,
  759. .team-info p { margin-bottom: 0px }
  760. .pricing-plan,
  761. .team-info-wrap { position: relative }
  762. .pricing-quotation:before,
  763. .team-info:before {
  764. background-color: #EEEEEE;
  765. border-color: #EEEEEE;
  766. border-image: none;
  767. border-right: 1px solid #EEEEEE;
  768. border-style: none;
  769. top: -7px;
  770. content: "";
  771. display: block;
  772. height: 14px;
  773. left: 48%;
  774. position: absolute;
  775. transform: rotate(45deg);
  776. -moz-transform: rotate(45deg);
  777. -webkit-transform: rotate(45deg);
  778. width: 15px;
  779. }
  780. .breadcrumbs {
  781. background:rgb(44, 62, 80);
  782. color: #fff;
  783. padding: 25px 0;
  784. margin-bottom: 40px;
  785. }
  786. .breadcrumb {
  787. margin-bottom: 0;
  788. background: none;
  789. }
  790. .breadcrumb li a { color: white }
  791. .breadcrumb li.active { color: #fff }
  792. .breadcrumbs h1 {
  793. font-size: 24px;
  794. margin: 3px 0 0;
  795. text-transform: none;
  796. }
  797. /*contact*/
  798. .contact-map {
  799. margin-top: 40px;
  800. margin-bottom: 40px;
  801. }
  802. .contact-form { margin-bottom: 20px }
  803. .address h4 {
  804. color: #797979;
  805. margin-top: -3px;
  806. text-transform: uppercase;
  807. margin-bottom: 20px;
  808. }
  809. section.contact-infos {
  810. border: 1px solid #eee;
  811. margin-bottom: 15px;
  812. padding: 10px;
  813. }
  814. /*about us*/
  815. .about-us img { width: 100% }
  816. .about ul { line-height: 25px }
  817. .carousel-control.left,
  818. .carousel-control.right {
  819. background: none;
  820. -webkit-transition: all .3s ease;
  821. -moz-transition: all .3s ease;
  822. -ms-transition: all .3s ease;
  823. -o-transition: all .3s ease;
  824. transition: all .3s ease;
  825. }
  826. .carousel-control {
  827. background: #000000 !important;
  828. bottom: 40%;
  829. color: #FFFFFF;
  830. font-size: 20px;
  831. left: 0;
  832. line-height: 53px;
  833. opacity: 0.5;
  834. position: absolute;
  835. text-align: center;
  836. text-shadow: 0 0px 0px rgba(0, 0, 0, 0);
  837. top: 40%;
  838. width: 10%;
  839. }
  840. .carousel-control:hover {
  841. color: #FFFFFF;
  842. text-decoration: none;
  843. }
  844. .carousel-control:hover,
  845. .carousel-control:focus { opacity: 0.6 }
  846. .carousel-caption {
  847. background: rgba(0,0,0,0.6);
  848. padding-bottom: 0px;
  849. bottom: 0;
  850. color: #FFFFFF;
  851. left: 0 !important;
  852. padding-bottom: 5px;
  853. padding-top: 10px;
  854. position: absolute;
  855. right: 0 !important;
  856. text-align: center;
  857. text-shadow: 0 0px 0px rgba(0, 0, 0, 0);
  858. z-index: 10;
  859. }
  860. .carousel-caption p { text-align: center }
  861. .about h3 {
  862. color: #475168;
  863. margin-top: 4px;
  864. }
  865. .icon-wrap {
  866. font-size: 2em;
  867. height: 60px;
  868. width: 60px;
  869. float: left;
  870. line-height: 60px;
  871. text-align: center;
  872. color: #fff;
  873. margin-right: 30px;
  874. }
  875. .ico-bg { background: rgb(44, 62, 80) }
  876. .round-five {
  877. border-radius: 5px;
  878. -moz-border-radius: 5px;
  879. -webkit-border-radius: 5px;
  880. }
  881. .round-fifty {
  882. border-radius: 50px;
  883. -moz-border-radius: 50px;
  884. -webkit-border-radius: 50px;
  885. margin-left: 40%;
  886. margin-top: -25px;
  887. }
  888. .content h3,
  889. .media h3 {
  890. margin-top: 0;
  891. color: #475168;
  892. font-size: 20px;
  893. }
  894. .media h3 { margin-top: 20px }
  895. .media-body h4 {
  896. font-size: 16px;
  897. color: #475168;
  898. }
  899. .media-body a {
  900. -webkit-transition: all .3s ease;
  901. -moz-transition: all .3s ease;
  902. -ms-transition: all .3s ease;
  903. -o-transition: all .3s ease;
  904. transition: all .3s ease;
  905. }
  906. .hiring,
  907. .services {
  908. margin-bottom: 30px;
  909. display: inline-block;
  910. width: 100%;
  911. }
  912. .price-container-service {
  913. margin-top: 30px;
  914. padding-bottom: 30px;
  915. }
  916. .service-price-one { padding-bottom: 10px }
  917. .hiring {
  918. margin-top: 20px;
  919. border-top: 1px solid #eee;
  920. padding-top: 30px;
  921. }
  922. .hiring h2 {
  923. text-align: center;
  924. padding-bottom: 10px;
  925. margin-bottom: 50px;
  926. text-transform: uppercase;
  927. }
  928. .gray-box {
  929. background: #f2f2f2;
  930. padding: 30px 0;
  931. margin-bottom: 15px;
  932. }
  933. .progress { background-color: #E1E1E1 }
  934. .flexslider {
  935. background: none;
  936. border: none;
  937. }
  938. .about-skill-meter .sr-only { position: static !important }
  939. .about-skill-meter .progress-bar {
  940. background-color: #e1e1e1;
  941. text-align: left;
  942. }
  943. .about-skill-meter .progress {
  944. height: 30px;
  945. box-shadow: none;
  946. line-height: 30px;
  947. }
  948. .about-skill-meter .progress-bar-danger { box-shadow: none }
  949. .skills {
  950. margin-bottom: 25px;
  951. color: #47506a;
  952. font-size: 20px;
  953. }
  954. /*team*/
  955. .person { margin-bottom: 10px }
  956. .person img {
  957. width: 210px;
  958. height: 210px;
  959. border-radius: 1%;
  960. -webkit-border-radius: 1%;
  961. -moz-border-radius: 1%;
  962. }
  963. .team-social-link {
  964. display: block;
  965. margin: 10px 0 5px 0;
  966. text-align: center;
  967. }
  968. .team-social-link a {
  969. display: inline-block !important;
  970. color: #cac8c7;
  971. font-size: 20px;
  972. border: 1px solid #eee;
  973. padding-right: 8px;
  974. padding-left: 8px;
  975. -webkit-transition: all .3s ease;
  976. -moz-transition: all .3s ease;
  977. -ms-transition: all .3s ease;
  978. -o-transition: all .3s ease;
  979. transition: all .3s ease;
  980. }
  981. .team-social-link a:hover {
  982. color: rgb(44, 62, 80);
  983. -webkit-transition: all .3s ease;
  984. -moz-transition: all .3s ease;
  985. -ms-transition: all .3s ease;
  986. -o-transition: all .3s ease;
  987. transition: all .3s ease;
  988. }
  989. .person-info h4,
  990. .person-info h4 a {
  991. color: #f37c6b;
  992. font-weight: 300;
  993. margin-bottom: 5px;
  994. }
  995. .mtop30 { margin-top: 30px }
  996. /*typography*/
  997. .highlight-1 {
  998. background: #a0d468;
  999. color: #FFFFFF;
  1000. }
  1001. .highlight-2 {
  1002. background: #656d78;
  1003. color: #FFFFFF;
  1004. }
  1005. .highlight-3 {
  1006. background: #Ffce54;
  1007. color: #242424;
  1008. }
  1009. .dropcap {
  1010. background-color: #666666;
  1011. color: #FFFFFF;
  1012. float: left;
  1013. font-size: 30px;
  1014. line-height: 30px;
  1015. margin: 4px 8px 0 0;
  1016. padding: 5px 10px;
  1017. text-align: center;
  1018. }
  1019. .dropcap2 {
  1020. background-color: #666666;
  1021. border-radius: 50%;
  1022. -moz-border-radius: 50%;
  1023. -webkit-border-radius: 50%;
  1024. color: #FFFFFF;
  1025. float: left;
  1026. font-size: 35px;
  1027. height: 41px;
  1028. line-height: 25px;
  1029. margin: 3px 8px 0 0;
  1030. padding: 10px;
  1031. text-align: center;
  1032. }
  1033. /*buttons*/
  1034. .btn-row { margin-bottom: 30px }
  1035. /*blog*/
  1036. .blog-item {
  1037. margin-bottom: 40px;
  1038. padding-bottom: 40px;
  1039. border-bottom: 1px dashed #ddd;
  1040. }
  1041. /*blog-2-col*/
  1042. .blog-left {
  1043. border: 1px solid #eee;
  1044. margin-bottom: 30px;
  1045. }
  1046. .blog-left .btn {
  1047. margin-left: 20px;
  1048. margin-bottom: 20px;
  1049. }
  1050. .blog-right {
  1051. border: 1px solid #eee;
  1052. margin-bottom: 30px;
  1053. }
  1054. .blog-right .btn {
  1055. margin-left: 20px;
  1056. margin-bottom: 20px;
  1057. }
  1058. .blog-two-info { padding: 15px 10px 0 20px }
  1059. .blog-two-info .label-info {
  1060. background-color: rgb(44, 62, 80);
  1061. opacity: .7;
  1062. margin-right: 4px;
  1063. }
  1064. .blog-content { padding: 20px }
  1065. .video-container {
  1066. position: relative;
  1067. padding-bottom: 56.25%;
  1068. padding-top: 30px;
  1069. height: 0;
  1070. overflow: hidden;
  1071. }
  1072. .single-video { padding-bottom: 43% !important }
  1073. .video-container iframe,
  1074. .video-container object,
  1075. .video-container embed {
  1076. position: absolute;
  1077. top: 0;
  1078. left: 0;
  1079. width: 100%;
  1080. height: 100%;
  1081. }
  1082. /*blog 2*/
  1083. .date-wrap,
  1084. .comnt-wrap { margin-bottom: 20px }
  1085. .date-wrap span,
  1086. .comnt-wrap span {
  1087. display: block;
  1088. padding: 10px 0;
  1089. text-align: center;
  1090. }
  1091. .date-wrap .date {
  1092. font-size: 30px;
  1093. font-weight: 300;
  1094. background: rgb(44, 62, 80);
  1095. color: #fff;
  1096. border-radius: 1px 1px 0 0;
  1097. -webkit-border-radius: 1px 1px 0 0;
  1098. -moz-border-radius: 1px 1px 0 0;
  1099. }
  1100. .date-wrap .month {
  1101. font-size: 16px;
  1102. font-weight: 300;
  1103. background: #f6f5f0;
  1104. color: #a19fa2;
  1105. border-radius: 0 0 1px 1px;
  1106. -webkit-border-radius: 0 0 1px 1px;
  1107. -moz-border-radius: 0 0 1px 1px;
  1108. }
  1109. .comnt-wrap .comnt-ico {
  1110. background: #efeee9;
  1111. color: #a0a0a0;
  1112. border-radius: 1px 1px 0 0;
  1113. -webkit-border-radius: 44px;
  1114. font-size: 20px;
  1115. }
  1116. .comnt-wrap .value {
  1117. background: #f6f5f0;
  1118. color: #a0a0a0;
  1119. border-radius: 0 0 1px 1px;
  1120. -moz-border-radius: 0 0 1px 1px;
  1121. -webkit-border-radius: 0 0 1px 1px;
  1122. }
  1123. .blog-img img {
  1124. width: 100%;
  1125. border-radius: 1px;
  1126. -webkit-border-radius: 1px;
  1127. -moz-border-radius: 1px;
  1128. }
  1129. .blog-item h1,
  1130. .blog-item h1 a {
  1131. font-size: 25px;
  1132. color: rgb(44, 62, 80);
  1133. font-weight: 300;
  1134. }
  1135. .blog-item h1 {
  1136. margin-bottom: 20px;
  1137. line-height: 35px;
  1138. }
  1139. .blog-item h1 a:hover { text-decoration: none }
  1140. .author {
  1141. margin: 25px 0 30px 0;
  1142. font-size: 16px;
  1143. }
  1144. .author a,
  1145. .st-view a { color: rgb(44, 62, 80) }
  1146. .st-view { margin-top: 20px }
  1147. .st-view ul li { margin-bottom: 5px }
  1148. .blog-side-item h3 {
  1149. margin-top: 30px;
  1150. color: #475268;
  1151. font-size: 18px;
  1152. }
  1153. .blog-side-item ul li {
  1154. margin-bottom: 5px;
  1155. border-bottom: 1px solid #efefef;
  1156. line-height: 35px;
  1157. }
  1158. .blog-side-item ul li a {
  1159. display: inline-block;
  1160. width: 100%;
  1161. -webkit-transition: all .3s ease;
  1162. -moz-transition: all .3s ease;
  1163. -ms-transition: all .3s ease;
  1164. -o-transition: all .3s ease;
  1165. transition: all .3s ease;
  1166. }
  1167. .media p { line-height: normal }
  1168. ul.tag {
  1169. display: inline-block;
  1170. width: 100%;
  1171. }
  1172. ul.tag li {
  1173. float: left;
  1174. margin: 0px 5px 0 0;
  1175. border-bottom: none;
  1176. padding-top: ;
  1177. list-style: none;
  1178. }
  1179. ul.tag li a {
  1180. border: 1px solid #e8e8e8;
  1181. border-radius: 4px;
  1182. line-height: 15px;
  1183. padding: 5px;
  1184. border-radius: 1px 1px 10px 1px;
  1185. -moz-border-radius: 1px 1px 10px 1px;
  1186. -webkit-border-radius: 1px 1px 10px 1px;
  1187. }
  1188. .media img.media-object {
  1189. border-radius: 3%;
  1190. -moz-border-radius: 3%;
  1191. -webkit-border-radius: 3%;
  1192. height: 80px;
  1193. width: 80px;
  1194. }
  1195. /*footer*/
  1196. .footer {
  1197. background: rgb(44, 62, 80);
  1198. color: #fff;
  1199. padding: 50px 0;
  1200. display: inline-block;
  1201. width: 100%;
  1202. font-weight: 300;
  1203. }
  1204. .footer h1 {
  1205. font-size: 20px;
  1206. text-transform: uppercase;
  1207. font-weight: 400;
  1208. margin-top: 0;
  1209. margin-bottom: 20px;
  1210. }
  1211. .footer address a { color: rgb(44, 62, 80) }
  1212. .tweet-box {
  1213. background: #505b71;
  1214. padding: 8px 15px;
  1215. border-radius: 1px;
  1216. -moz-border-radius: 1px;
  1217. -webkit-border-radius: 1px;
  1218. border-bottom: 1px solid #636F79;
  1219. font-size: 14px;
  1220. }
  1221. .tweet-box:before {
  1222. background-color: #505b71;
  1223. border-color: #505b71;
  1224. border-image: none;
  1225. border-right: 1px none #505b71;
  1226. border-style: none;
  1227. content: "";
  1228. display: block;
  1229. height: 22px;
  1230. left: 60px;
  1231. position: absolute;
  1232. top: 32px;
  1233. transform: rotate(45deg);
  1234. -webkit-transform: rotate(45deg);
  1235. width: 22px;
  1236. }
  1237. .tweet-box a,
  1238. .tweet-box i { color: #00adef }
  1239. .tweet-box a:hover { color: rgb(44, 62, 80) }
  1240. .tweet-box i {
  1241. font-size: 40px;
  1242. float: left;
  1243. margin-right: 15px;
  1244. }
  1245. .social-link-footer li {
  1246. float: right;
  1247. margin: 5px 10px 5px 0px;
  1248. padding-bottom: 5px;
  1249. }
  1250. .social-link-footer li a {
  1251. color: #fff;
  1252. background: #505b71;
  1253. padding: 10px;
  1254. width: 50px;
  1255. height: 50px;
  1256. border-radius: 50px;
  1257. -moz-border-radius: 50px;
  1258. -webkit-border-radius: 50px;
  1259. float: left;
  1260. text-align: center;
  1261. font-size: 20px;
  1262. -webkit-transition: all .3s ease;
  1263. -moz-transition: all .3s ease;
  1264. -ms-transition: all .3s ease;
  1265. -o-transition: all .3s ease;
  1266. transition: all .3s ease;
  1267. }
  1268. .social-link-footer li a:hover {
  1269. background: rgb(44, 62, 80);
  1270. -webkit-transition: all .3s ease;
  1271. -moz-transition: all .3s ease;
  1272. -ms-transition: all .3s ease;
  1273. -o-transition: all .3s ease;
  1274. transition: all .3s ease;
  1275. }
  1276. .copyright {
  1277. color: #fff;
  1278. padding-top: 15px;
  1279. }
  1280. .page-footer { padding: 0% 13% }
  1281. .page-footer h1 { padding-left: 4% }
  1282. ul.page-footer-list {
  1283. list-style: none;
  1284. padding: 0px 10px;
  1285. }
  1286. ul.page-footer-list li {
  1287. line-height: 35px;
  1288. border-bottom: 1px dashed #636F79;
  1289. }
  1290. ul.page-footer-list a { color: #fff }
  1291. ul.page-footer-list li i { padding-right: 10px }
  1292. .footer-small {
  1293. background-color: rgb(44, 62, 80);
  1294. margin-top: 30px;
  1295. padding-top: 5px;
  1296. }
  1297. .text-footer {
  1298. padding-left: 10px;
  1299. margin-left: 10px;
  1300. }
  1301. .text-footer p { text-align: left }
  1302. .address p {
  1303. text-align: left;
  1304. margin-bottom: 10px;
  1305. }
  1306. /*slider css*/
  1307. .main-slider {
  1308. background: #475168;
  1309. color: #fff;
  1310. z-index: 1;
  1311. position: relative;
  1312. overflow: hidden;
  1313. }
  1314. .slider-colored {
  1315. z-index: 1;
  1316. position: relative;
  1317. border-top: solid 1px #eee;
  1318. border-bottom: solid 1px #eee;
  1319. }
  1320. .slide_title {
  1321. font-weight: 300;
  1322. color: rgb(44, 62, 80);
  1323. text-transform: uppercase;
  1324. font-size: 35px;
  1325. }
  1326. .slide_subtitle {
  1327. font-weight: 400;
  1328. padding: 5px;
  1329. color: #fff;
  1330. text-transform: uppercase;
  1331. font-size: 18px;
  1332. }
  1333. .slide_list_item {
  1334. font-weight: 400;
  1335. padding: 5px;
  1336. color: #fff;
  1337. text-transform: uppercase;
  1338. font-size: 14px;
  1339. }
  1340. .slide_desc {
  1341. color: #fff;
  1342. font-size: 14px;
  1343. line-height: 24px;
  1344. font-weight: lighter;
  1345. }
  1346. .slide_desc_bordered {
  1347. border-left: 3px solid #ddd !important;
  1348. padding-left: 5px;
  1349. }
  1350. .slide_btn {
  1351. font-weight: 300;
  1352. background: rgb(44, 62, 80);
  1353. padding: 15px 20px;
  1354. color: #fff;
  1355. font-size: 14px;
  1356. text-transform: uppercase;
  1357. cursor: pointer;
  1358. }
  1359. .slide_btn:hover,
  1360. .slide_btn:focus {
  1361. font-weight: 300;
  1362. background: #16a085;
  1363. padding: 15px 20px;
  1364. color: #fff;
  1365. font-size: 14px;
  1366. text-transform: uppercase;
  1367. cursor: pointer;
  1368. }
  1369. .dark-text { color: #797d87 }
  1370. .yellow-txt { color: #ffe582 }
  1371. #home-services { text-align: center }
  1372. #home-services h2 {
  1373. margin-bottom: 65px;
  1374. text-transform: uppercase;
  1375. margin-top: 45px;
  1376. padding-bottom: 5px;
  1377. text-align: center;
  1378. font-size: 25px;
  1379. }
  1380. .h-service {
  1381. border: 1px solid #eee;
  1382. margin-bottom: 25px;
  1383. }
  1384. #home-services .h-service-content h3 {
  1385. padding-top: 40px;
  1386. text-align: center;
  1387. }
  1388. .h-service-content p {
  1389. text-align: center;
  1390. padding: 5px 21px 20px;
  1391. }
  1392. .h-service-content a {
  1393. color: #e74c3c;
  1394. -webkit-transition: all .3s ease;
  1395. -moz-transition: all .3s ease;
  1396. -ms-transition: all .3s ease;
  1397. -o-transition: all .3s ease;
  1398. transition: all .3s ease;
  1399. }
  1400. .h-service-content a:hover { color: #16a085 }
  1401. /*recent work*/
  1402. .recent h3{
  1403. text-align: center;
  1404. /*margin-bottom: 20px;*/
  1405. text-transform: uppercase;
  1406. margin-top: 50px;
  1407. font-weight: 400;
  1408. padding-bottom: 5px;
  1409. margin-bottom: 20px;
  1410. /*text-align: center;*/
  1411. }
  1412. .recent p {
  1413. text-align: center;
  1414. text-transform:uppercase;
  1415. margin-bottom: 35px;
  1416. }
  1417. .recent {
  1418. margin-bottom: 50px;
  1419. }
  1420. .bx-wrapper { position: relative }
  1421. .bx-wrapper .bx-controls-direction a {
  1422. background-color: #f7f7f7;
  1423. position: absolute;
  1424. top: 25px;
  1425. outline: 0;
  1426. width: 24px;
  1427. height: 24px;
  1428. z-index: 9;
  1429. text-indent: -9999px;
  1430. }
  1431. /*property*/
  1432. .property {
  1433. padding: 80px 0;
  1434. margin-bottom: 60px;
  1435. background-color: #fafafa;
  1436. }
  1437. .bg-lg { background:#f9f9f3 }
  1438. .gray-bg { background: #f9f9f3 }
  1439. .property h1 {
  1440. color: #475168;
  1441. font-size: 24px;
  1442. text-transform: uppercase;
  1443. font-weight: 400;
  1444. margin-bottom: 30px;
  1445. }
  1446. .property hr { border-color: #dfdcdf }
  1447. .property i { color: rgb(44, 62, 80) }
  1448. a.btn-purchase {
  1449. background: #475168;
  1450. color: #fff;
  1451. text-transform: uppercase;
  1452. border-radius: 4px;
  1453. -webkit-border-radius: 4px;
  1454. -moz-border-radius: 4px padding: 20px 40px;
  1455. margin-top: 30px;
  1456. -webkit-transition: all .3s ease;
  1457. -moz-transition: all .3s ease;
  1458. -ms-transition: all .3s ease;
  1459. -o-transition: all .3s ease;
  1460. transition: all .3s ease;
  1461. }
  1462. a.btn-purchase:hover,
  1463. a.btn-purchase:focus {
  1464. background: rgb(44, 62, 80);
  1465. color: #fff;
  1466. -webkit-transition: all .3s ease;
  1467. -moz-transition: all .3s ease;
  1468. -ms-transition: all .3s ease;
  1469. -o-transition: all .3s ease;
  1470. transition: all .3s ease;
  1471. }
  1472. /*clients*/
  1473. .clients { padding: 0 0 30px }
  1474. .clients h2 {
  1475. margin-bottom: 20px;
  1476. margin-top: 20px;
  1477. text-align: left;
  1478. text-transform: uppercase;
  1479. padding-bottom: 5px;
  1480. }
  1481. .clients ul li {
  1482. display: inline-block;
  1483. margin: 10px 30px;
  1484. }
  1485. .clients ul li:hover {
  1486. background-color: #f7f7f7;
  1487. -webkit-transition: all .5s ease;
  1488. -moz-transition: all .5s ease;
  1489. -ms-transition: all .5s ease;
  1490. -o-transition: all .5s ease;
  1491. transition: all .5s ease;
  1492. }
  1493. .our-clients {
  1494. position: relative;
  1495. margin-top: 15px; }
  1496. .our-clients h2 {
  1497. margin-top: 3px;
  1498. margin-bottom: 10px;
  1499. }
  1500. .clients-list { margin: 0 }
  1501. .clients-list li {
  1502. background: #f9f9f9;
  1503. position: relative;
  1504. }
  1505. .clients-list li img.color-img {
  1506. top: 0;
  1507. left: 0;
  1508. display: none;
  1509. position: absolute;
  1510. }
  1511. .clients-list li:hover img.color-img { display: block }
  1512. /*portfolio*/
  1513. .pf-img img {
  1514. width: 100%;
  1515. border-radius: 1px;
  1516. -moz-border-radius: 1px;
  1517. -webkit-border-radius: 1px;
  1518. }
  1519. .pf-detail {
  1520. padding-bottom: 15px;
  1521. font-size: 15px;
  1522. }
  1523. .pf-detail p {
  1524. font-family: 'Lato',sans-serif;
  1525. }
  1526. .pf-list {
  1527. line-height: 30px;
  1528. font-size: 15px;
  1529. }
  1530. .pf-list i { color: #c7c7c7 }
  1531. .image-caption a { padding: 10px 15px }
  1532. .pad-ten { padding-bottom: 30px }
  1533. .title { margin-top: 40px }
  1534. /*Photo Gallery*/
  1535. #gallery {
  1536. margin: auto;
  1537. position: relative;
  1538. width: 100%;
  1539. }
  1540. #gallery h2 {
  1541. color: #fff;
  1542. padding-top: 30px;
  1543. }
  1544. .gallery-container {
  1545. margin: 0 auto 40px auto;
  1546. position: relative;
  1547. width: 100%;
  1548. }
  1549. .col-4 .item {
  1550. width: 23%;
  1551. margin-right: 2%;
  1552. margin-bottom: 2%;
  1553. }
  1554. .col-4 .item img { height: 230px }
  1555. ul#filters {
  1556. display: inline-block;
  1557. width: 100%;
  1558. margin: 25px 0 25px 0;
  1559. }
  1560. ul#filters li {
  1561. float: left;
  1562. margin-right: 10px;
  1563. margin-bottom: 10px;
  1564. }
  1565. ul#filters li a {
  1566. background: #E2E0E1;
  1567. padding: 10px 15px;
  1568. display: inline-block;
  1569. color: #7D797A;
  1570. outline: none;
  1571. border-radius: 5px;
  1572. -webkit-border-radius: 5px;
  1573. -moz-border-radius: 5px;
  1574. transition-duration: 500ms;
  1575. transition-property: width, background;
  1576. transition-timing-function: ease;
  1577. -moz-transition-duration: 500ms;
  1578. -moz-transition-property: width, background;
  1579. -moz-transition-timing-function: ease;
  1580. -webkit-transition-duration: 500ms;
  1581. -webkit-transition-property: width, background;
  1582. -webkit-transition-timing-function: ease;
  1583. }
  1584. ul#filters > li > a:hover,
  1585. ul#filters > li > a:focus,
  1586. ul#filters > .active > a,
  1587. ul#filters > .active > span {
  1588. background: rgb(44, 62, 80);
  1589. padding: 10px 15px;
  1590. display: inline-block;
  1591. color: #fff;
  1592. border-radius: 5px;
  1593. -webkit-border-radius: 5px;
  1594. -moz-border-radius: 5px;
  1595. transition-duration: 500ms;
  1596. transition-property: width, background;
  1597. transition-timing-function: ease;
  1598. -moz-transition-duration: 500ms;
  1599. -moz-transition-property: width, background;
  1600. -moz-transition-timing-function: ease;
  1601. -webkit-transition-duration: 500ms;
  1602. -webkit-transition-property: width, background;
  1603. -webkit-transition-timing-function: ease;
  1604. }
  1605. .item img {
  1606. width: 100%;
  1607. height: 100%;
  1608. }
  1609. .text-grid a { color: #fff }
  1610. .text-grid div { padding: 0 10px }
  1611. .text-grid p { margin-bottom: 10px }
  1612. /*parallax*/
  1613. .parallax1 {
  1614. background-size: cover;
  1615. width: 100%;
  1616. min-height: 400px;
  1617. background-color: rgb(44, 62, 80);
  1618. font-style: italic;
  1619. }
  1620. .parallax1 h1 {
  1621. text-align: center;
  1622. color: #fff;
  1623. font-size: 25px;
  1624. font-weight: 300;
  1625. line-height: 40px;
  1626. margin-top: 160px;
  1627. }
  1628. /*newsletter*/
  1629. #newsletter {
  1630. background-color: rgb(44, 62, 80);
  1631. padding: 60px 0;
  1632. }
  1633. #newsletter p.lead {
  1634. color: white;
  1635. padding-top: 0px;
  1636. margin-top: -5px;
  1637. }
  1638. #newsletter input {
  1639. border: none;
  1640. border-radius: 0px;
  1641. -webkit-border-radius: 0px;
  1642. -moz-border-radius: 0px;
  1643. margin-left: -1px;
  1644. }
  1645. #newsletter-faq p.lead {
  1646. color: white;
  1647. padding-top: 6px;
  1648. }
  1649. #newsletter-faq input {
  1650. border: none;
  1651. border-bottom-left-radius: 3px;
  1652. border-top-left-radius: 3px;
  1653. margin-left: -1px;
  1654. }
  1655. .btn.btn-inverse {
  1656. background-color: #475168;
  1657. color: #fff;
  1658. height: 45px;
  1659. -webkit-transition: all .3s ease;
  1660. -moz-transition: all .3s ease;
  1661. -ms-transition: all .3s ease;
  1662. -o-transition: all .3s ease;
  1663. transition: all .3s ease;
  1664. }
  1665. .btn.btn-inverse:hover {
  1666. background-color: #415b76;
  1667. color: #fff;
  1668. height: 45px;
  1669. -webkit-transition: all .3s ease;
  1670. -moz-transition: all .3s ease;
  1671. -ms-transition: all .3s ease;
  1672. -o-transition: all .3s ease;
  1673. transition: all .3s ease;
  1674. }
  1675. .newsletter-input { height: 45px }
  1676. .btn-nl {
  1677. border-radius: 3px;
  1678. -webkit-border-radius: 3px;
  1679. -moz-border-radius: 3px;
  1680. }
  1681. .btn-nl:hover {
  1682. border-radius: 3px;
  1683. -webkit-border-radius: 3px;
  1684. -moz-border-radius: 3px;
  1685. }
  1686. .wh-bg {
  1687. background-color: #fff;
  1688. padding: 15px;
  1689. margin: 35px 0;
  1690. border: 1px solid #eee;
  1691. z-index: 20;
  1692. }
  1693. .position { text-align: center }
  1694. .wh-bg h3 { text-align: center }
  1695. /*faq*/
  1696. #newsletter-faq {
  1697. padding: 72px 0;
  1698. background: url("../img/tg-black-bg.png") no-repeat fixed top rgba(0,0,0,0.7);
  1699. height: 200px;
  1700. margin-top: 30px;
  1701. margin-bottom: 30px;
  1702. }
  1703. #faq-other mark {
  1704. background: rgb(44, 62, 80);
  1705. color: #fff;
  1706. }
  1707. .faq-square { margin: 40px 0 20px }
  1708. /*registration*/
  1709. .registration-bg {
  1710. margin-top: -40px;
  1711. background-color: #f1f2f7;
  1712. }
  1713. /*login*/
  1714. .login-page {
  1715. min-width: 25%;
  1716. max-width: 25%;
  1717. padding: 35px 30px 30px;
  1718. background: #fcfcfc;
  1719. border: solid 1px #eee;
  1720. margin: 40px auto;
  1721. border: 17px solid #eee;
  1722. }
  1723. .gr-bg {
  1724. background-color: rgb(44, 62, 80);
  1725. margin-top: -40px;
  1726. margin-bottom: -50px;
  1727. }
  1728. #btn-login {
  1729. background-color: rgb(44, 62, 80);
  1730. border: none;
  1731. border-radius: 1px;
  1732. -webkit-border-radius: 1px;
  1733. -moz-border-radius: 1px;
  1734. font-size: 17px;
  1735. }
  1736. #btn-fblogin {
  1737. background-color: #3B5998;
  1738. border: none;
  1739. border-radius: 1px;
  1740. -webkit-border-radius: 1px;
  1741. -moz-border-radius: 1px;
  1742. font-size: 17px;
  1743. }
  1744. .panel {
  1745. z-index: 100;
  1746. box-shadow: 0 1px 1px rgba(0,0,0,0.12);
  1747. border-radius: 1px;
  1748. -moz-border-radius: 1px;
  1749. -webkit-border-radius: 1px;
  1750. }
  1751. .panel-heading {
  1752. border-top-right-radius: 1px;
  1753. border-top-left-radius: 1px;
  1754. background-color: rgb(44, 62, 80);
  1755. border: none;
  1756. }
  1757. .panel-info>.panel-heading {
  1758. color: #eee;
  1759. background-color: rgb(44, 62, 80);
  1760. }
  1761. .panel-info>.panel-heading a:hover { color: #eee }
  1762. .panel-body {
  1763. border-radius: 1px;
  1764. -moz-border-radius: 1px;
  1765. -webkit-border-radius: 1px;
  1766. border: 1px solid #eee;
  1767. }
  1768. .form-control {
  1769. border: 1px solid #d9d9d9;
  1770. border-radius: 3px;
  1771. }
  1772. .form-control:focus {
  1773. border: none;
  1774. border: 1px solid #d9d9d9;
  1775. }
  1776. .input-group-addon {
  1777. border: border: 1px solid #d9d9d9;
  1778. border-radius: 1px;
  1779. -moz-border-radius: 1px;
  1780. -webkit-border-radius: 1px;
  1781. }
  1782. #signupbox { margin-bottom: 20px }
  1783. #btn-signup {
  1784. background-color: rgb(44, 62, 80);
  1785. border-radius: 1px;
  1786. -moz-border-radius: 1px;
  1787. -webkit-border-radius: 1px;
  1788. border: none;
  1789. font-size: 17px;
  1790. }
  1791. #signinlink:hover { color: #fff }
  1792. #btn-fbsignup {
  1793. background-color: #3B5998;
  1794. border: none;
  1795. border-radius: 1px;
  1796. -moz-border-radius: 1px;
  1797. -webkit-border-radius: 1px;
  1798. font-size: 17px;
  1799. width: 100%;
  1800. padding-top: 10px;
  1801. padding-bottom: 10px;
  1802. }
  1803. #btn-twsignup {
  1804. background-color: #52D2D8;
  1805. border: none;
  1806. border-radius: 1px;
  1807. -moz-border-radius: 1px;
  1808. -webkit-border-radius: 1px;
  1809. font-size: 17px;
  1810. width: 100%;
  1811. padding-top: 10px;
  1812. padding-bottom: 10px;
  1813. }
  1814. #search id="search" { background-color: #fff }
  1815. .btn-lg {
  1816. border-radius: 1px;
  1817. -webkit-border-radius: 1px;
  1818. -moz-border-radius: 1px;
  1819. }
  1820. #owl-demo { margin-bottom: 15px }
  1821. #owl-demo .item { margin: 3px }
  1822. #owl-demo .item img {
  1823. display: block;
  1824. width: 100%;
  1825. height: auto;
  1826. }
  1827. /*login*/
  1828. /*login page*/
  1829. .login-body { background-color: #f1f2f7 }
  1830. .form-signin {
  1831. max-width: 330px;
  1832. margin: 50px auto 50px;
  1833. background: #fff;
  1834. border-radius: 3px;
  1835. -moz-border-radius: 3px;
  1836. -webkit-border-radius: 3px;
  1837. }
  1838. .form-signin h2.form-signin-heading {
  1839. margin: 0;
  1840. padding: 20px 15px;
  1841. text-align: center;
  1842. background: rgb(44, 62, 80);
  1843. border-radius: 3px 3px 0 0;
  1844. -moz-border-radius: 3px 3px 0 0;
  1845. -webkit-border-radius: 3px 3px 0 0;
  1846. color: #fff;
  1847. font-size: 18px;
  1848. text-transform: uppercase;
  1849. font-weight: 300;
  1850. }
  1851. .form-signin .checkbox { margin-bottom: 14px }
  1852. .form-signin .checkbox {
  1853. font-weight: normal;
  1854. color: #b6b6b6;
  1855. font-weight: 300;
  1856. }
  1857. .form-signin .form-control {
  1858. position: relative;
  1859. font-size: 16px;
  1860. height: 38px;
  1861. padding: 10px;
  1862. -webkit-box-sizing: border-box;
  1863. -moz-box-sizing: border-box;
  1864. box-sizing: border-box;
  1865. }
  1866. .form-signin .form-control:focus { z-index: 2 }
  1867. .form-signin input[type="text"],
  1868. .form-signin input[type="password"] {
  1869. margin-bottom: 15px;
  1870. border-radius: 3px;
  1871. -webkit-border-radius: 3px;
  1872. -moz-border-radius: 3px;
  1873. border: 1px solid #eaeaea;
  1874. box-shadow: none;
  1875. font-size: 12px;
  1876. }
  1877. .form-signin .btn-login {
  1878. background: rgb(44, 62, 80);
  1879. color: #fff;
  1880. text-transform: uppercase;
  1881. font-weight: 300;
  1882. margin-bottom: 20px;
  1883. border-radius: 3px;
  1884. -webkit-border-radius: 3px;
  1885. -moz-border-radius: 3px;
  1886. -webkit-transition: all .3s ease;
  1887. -moz-transition: all .3s ease;
  1888. -ms-transition: all .3s ease;
  1889. -o-transition: all .3s ease;
  1890. transition: all .3s ease;
  1891. }
  1892. .form-signin .btn-login:hover {
  1893. background: #37BC9B;
  1894. border-radius: 3px;
  1895. -webkit-border-radius: 3px;
  1896. -moz-border-radius: 3px;
  1897. -webkit-transition: all .3s ease;
  1898. -moz-transition: all .3s ease;
  1899. -ms-transition: all .3s ease;
  1900. -o-transition: all .3s ease;
  1901. transition: all .3s ease;
  1902. }
  1903. .form-signin p {
  1904. text-align: center;
  1905. color: #b6b6b6;
  1906. font-size: 16px;
  1907. font-weight: 300;
  1908. }
  1909. .form-signin a { color: #41cac0 }
  1910. .form-signin a:hover { color: #b6b6b6 }
  1911. .login-wrap {
  1912. padding: 20px;
  1913. -webkit-border-radius: 3px;
  1914. -moz-border-radius: 3px;
  1915. border-radius: 3px;
  1916. }
  1917. .login-social-link {
  1918. display: inline-block;
  1919. margin-top: 20px;
  1920. margin-bottom: 15px;
  1921. }
  1922. .login-social-link a {
  1923. color: #fff;
  1924. padding: 15px 28px;
  1925. border-radius: 1px;
  1926. -webkit-border-radius: 1px;
  1927. -moz-border-radius: 1px;
  1928. }
  1929. .login-social-link a:hover { color: #fff }
  1930. .login-social-link a i {
  1931. font-size: 20px;
  1932. padding-right: 10px;
  1933. }
  1934. .login-social-link a.facebook {
  1935. background: #5D9CEC;
  1936. margin-right: 15px;
  1937. border-radius: 3px;
  1938. -moz-border-radius:3px;
  1939. -webkit-border-radius:3px;
  1940. margin-bottom: 2px;
  1941. float: left;
  1942. -webkit-transition: all .3s ease;
  1943. -moz-transition: all .3s ease;
  1944. -ms-transition: all .3s ease;
  1945. -o-transition: all .3s ease;
  1946. transition: all .3s ease;
  1947. }
  1948. .login-social-link a.facebook:hover {
  1949. background: #4A89DC;
  1950. border-radius: 3px;
  1951. -moz-border-radius:3px;
  1952. -webkit-border-radius:3px;
  1953. -webkit-transition: all .3s ease;
  1954. -moz-transition: all .3s ease;
  1955. -ms-transition: all .3s ease;
  1956. -o-transition: all .3s ease;
  1957. transition: all .3s ease;
  1958. }
  1959. .login-social-link a.twitter {
  1960. background: #4FC1E9;
  1961. border-radius: 3px;
  1962. -moz-border-radius:3px;
  1963. -webkit-border-radius:3px;
  1964. float: left;
  1965. -webkit-transition: all .3s ease;
  1966. -moz-transition: all .3s ease;
  1967. -ms-transition: all .3s ease;
  1968. -o-transition: all .3s ease;
  1969. transition: all .3s ease;
  1970. }
  1971. .login-social-link a.twitter:hover {
  1972. background: #3BAFDA;
  1973. border-radius: 3px;
  1974. -moz-border-radius:3px;
  1975. -webkit-border-radius:3px;
  1976. -webkit-transition: all .3s ease;
  1977. -moz-transition: all .3s ease;
  1978. -ms-transition: all .3s ease;
  1979. -o-transition: all .3s ease;
  1980. transition: all .3s ease;
  1981. }
  1982. .form-wrapper { padding-bottom: 70px }
  1983. .login-bg {
  1984. margin-top: -40px;
  1985. margin-bottom: -50px;
  1986. background-color: #f1f2f7;
  1987. }
  1988. .modal-content {
  1989. border-radius: 1px;
  1990. -webkit-border-radius: 1px;
  1991. -moz-border-radius: 1px;
  1992. }
  1993. .modal-input { border: 1px solid #eee }
  1994. .modal-input:focus { border: 1px solid #eee }
  1995. .panel-faq { }
  1996. #accordion .panel-heading-faq { border: 1px solid #c7c7c7 }
  1997. #accordion .panel-body {
  1998. border-width: 0px 1px 1px 1px;
  1999. border-color: #c7c7c7;
  2000. border-style: solid;
  2001. background-color: #fff;
  2002. }
  2003. #accordion .panel {
  2004. box-shadow: none;
  2005. border: none;
  2006. }
  2007. .panel-group .panel {
  2008. border-radius: 1px;
  2009. -webkit-border-radius: 1px;
  2010. -moz-border-radius: 1px;
  2011. }
  2012. .headline {
  2013. display: block;
  2014. margin: 10px 0 25px 0;
  2015. }
  2016. .margin { margin-bottom: 20px }
  2017. .add li { margin-bottom: 6px }
  2018. ul.unstyled,
  2019. ol.unstyled {
  2020. margin-left: 0;
  2021. list-style: none;
  2022. }
  2023. #heading { text-align: center }
  2024. #heading p{
  2025. padding-top: 10px;
  2026. padding-bottom: 20px;
  2027. text-align: center;
  2028. }
  2029. .thumbnail {
  2030. position: relative;
  2031. padding: 0px;
  2032. margin-bottom: 30px;
  2033. border-radius: 1px;
  2034. -webkit-border-radius: 1px;
  2035. -moz-border-radius: 1px;
  2036. }
  2037. .thumbnail img { width: 100% }
  2038. .profile { margin-top: 20px }
  2039. .profile h2 {
  2040. text-align: center;
  2041. padding-bottom: 5px;
  2042. padding-top: 5px;
  2043. margin-bottom: 40px;
  2044. }
  2045. .about-hiring { padding-bottom: 15px }
  2046. .height { height: 40px }
  2047. .skill_bar_progress {
  2048. width: 0%;
  2049. padding-left: 10px;
  2050. padding-top: 4px;
  2051. border-radius: 1px;
  2052. -webkit-border-radius: 1px;
  2053. -moz-border-radius: 1px;
  2054. color: #fff;
  2055. height: 100%;
  2056. background: rgb(44, 62, 80);
  2057. }
  2058. .skill_bar {
  2059. width: 100%;
  2060. height: 30px;
  2061. background: #e1e1e1;
  2062. margin-bottom: 20px;
  2063. border-radius: 1px;
  2064. -webkit-border-radius: 1px;
  2065. -moz-border-radius: 1px;
  2066. overflow: hidden;
  2067. }
  2068. #progressbar {
  2069. width: 100%;
  2070. clear: both;
  2071. }
  2072. #progress {
  2073. background: rgb(44, 62, 80); /*-- Color of the bar --*/
  2074. width: 0%;
  2075. color: #fff;
  2076. padding-left: 8px;
  2077. max-width: 100%;
  2078. float: left;
  2079. -webkit-animation: progress 2s 1 forwards;
  2080. -moz-animation: progress 2s 1 forwards;
  2081. -ms-animation: progress 2s 1 forwards;
  2082. animation: progress 2s 1 forwards;
  2083. }
  2084. @-webkit-keyframes progress {
  2085. from { }
  2086. to { width: 70% }
  2087. }
  2088. @-moz-keyframes progress {
  2089. from { }
  2090. to { width: 36% }
  2091. }
  2092. @-ms-keyframes progress {
  2093. from { }
  2094. to { width: 36% }
  2095. }
  2096. @keyframes progress {
  2097. from { }
  2098. to { width: 36% }
  2099. }
  2100. /* carousel */
  2101. #quote-carousel {
  2102. padding: 0 10px 30px 10px;
  2103. margin-top: 30px 0px 0px;
  2104. }
  2105. /* Control buttons */
  2106. #quote-carousel .carousel-control {
  2107. background: none;
  2108. color: #222;
  2109. font-size: 2.3em;
  2110. text-shadow: none;
  2111. margin-top: 30px;
  2112. }
  2113. /* Previous button */
  2114. #quote-carousel .carousel-control.left { left: -12px }
  2115. /* Next button */
  2116. #quote-carousel .carousel-control.right { right: -12px !important }
  2117. /* Changes the position of the indicators */
  2118. #quote-carousel .carousel-indicators {
  2119. right: 50%;
  2120. top: auto;
  2121. bottom: 0px;
  2122. margin-right: -19px;
  2123. }
  2124. /* Changes the color of the indicators */
  2125. #quote-carousel .carousel-indicators li { background: #c0c0c0 }
  2126. #quote-carousel .carousel-indicators .active { background: #333333 }
  2127. #quote-carousel img {
  2128. width: 250px;
  2129. height: 100px;
  2130. }
  2131. /* End carousel */
  2132. .item blockquote {
  2133. border-left: none;
  2134. margin: 0;
  2135. }
  2136. .item blockquote img { margin-bottom: 10px }
  2137. .item blockquote p:before {
  2138. content: "\f10d";
  2139. font-family: 'Fontawesome';
  2140. float: left;
  2141. margin-right: 10px;
  2142. }
  2143. /**
  2144. MEDIA QUERIES
  2145. */
  2146. /* Small devices (tablets, 768px and up) */
  2147. @media (min-width: 768px) {
  2148. #quote-carousel {
  2149. margin-bottom: 0;
  2150. padding: 30px;
  2151. }
  2152. }
  2153. /* Small devices (tablets, up to 768px) */
  2154. @media (max-width: 767px) {
  2155. /* Make the indicators larger for easier clicking with fingers/thumb on mobile */
  2156. #quote-carousel .carousel-indicators { bottom: -20px !important }
  2157. #quote-carousel .carousel-indicators li {
  2158. display: inline-block;
  2159. margin: 0px 5px;
  2160. width: 15px;
  2161. height: 15px;
  2162. }
  2163. #quote-carousel .carousel-indicators li.active {
  2164. margin: 0px 5px;
  2165. width: 20px;
  2166. height: 20px;
  2167. }
  2168. }
  2169. #filters {
  2170. margin: 1%;
  2171. padding: 0;
  2172. list-style: none;
  2173. }
  2174. #filters li { float: left }
  2175. #filters li span {
  2176. display: block;
  2177. padding: 5px 20px;
  2178. text-decoration: none;
  2179. color: #666;
  2180. cursor: pointer;
  2181. }
  2182. #filters li span.active {
  2183. background: rgb(44, 62, 80);
  2184. color: #fff;
  2185. }
  2186. #portfoliolist-three .portfolio {
  2187. -webkit-box-sizing: border-box;
  2188. -moz-box-sizing: border-box;
  2189. -o-box-sizing: border-box;
  2190. width: 32%;
  2191. margin-right: 1%;
  2192. margin-bottom: 1%;
  2193. display: none;
  2194. float: left;
  2195. overflow: hidden;
  2196. }
  2197. #portfoliolist .portfolio {
  2198. -webkit-box-sizing: border-box;
  2199. -moz-box-sizing: border-box;
  2200. -o-box-sizing: border-box;
  2201. width: 24%;
  2202. margin-right: 1%;
  2203. margin-bottom: 1%;
  2204. display: none;
  2205. float: left;
  2206. overflow: hidden;
  2207. }
  2208. .portfolio-wrapper {
  2209. overflow: hidden;
  2210. position: relative !important;
  2211. background: #666;
  2212. cursor: pointer;
  2213. }
  2214. .portfolio img {
  2215. max-width: 100%;
  2216. position: relative;
  2217. }
  2218. span.filter {
  2219. border-radius: 3px;
  2220. -webkit-border-radius: 3px;
  2221. -moz-border-radius: 3px;
  2222. }
  2223. /* #Tablet (Portrait) */
  2224. @media only screen and (min-width: 768px) and (max-width: 959px) {
  2225. .container { width: 768px }
  2226. }
  2227. /* #Mobile (Portrait) - Note: Design for a width of 320px */
  2228. @media only screen and (max-width: 767px) {
  2229. .container { width: 95% }
  2230. #portfoliolist .portfolio {
  2231. width: 97%;
  2232. margin: 2%;
  2233. }
  2234. #portfoliolist-three .portfolio {
  2235. width: 97%;
  2236. margin: 2%;
  2237. }
  2238. }
  2239. /* #Mobile (Landscape) - Note: Design for a width of 480px */
  2240. @media only screen and (min-width: 480px) and (max-width: 767px) {
  2241. .container { width: 70% }
  2242. }
  2243. .portfolio-hover {
  2244. position: relative;
  2245. overflow: hidden;
  2246. }
  2247. .portfolio-hover .icon {
  2248. background-color: #000;
  2249. border-radius: 50px;
  2250. -webkit-border-radius: 50px;
  2251. -moz-border-radius: 50px;
  2252. opacity: .7;
  2253. -webkit-transition: all .3s ease;
  2254. -moz-transition: all .3s ease;
  2255. -ms-transition: all .3s ease;
  2256. -o-transition: all .3s ease;
  2257. transition: all .3s ease;
  2258. }
  2259. .image-caption {
  2260. position: absolute;
  2261. top: 0;
  2262. right: 0;
  2263. background: rgba(0, 0, 0, 0.5);
  2264. width: 100%;
  2265. height: 100%;
  2266. padding-top: 35%;
  2267. display: none;
  2268. text-align: center;
  2269. color: #fff !important;
  2270. z-index: 2;
  2271. }
  2272. .price-container {
  2273. margin-top: -40px;
  2274. margin-bottom: -50px;
  2275. }
  2276. .price-one h1 { padding-top: 10px }
  2277. .price-one p {
  2278. text-align: center;
  2279. padding-bottom: 40px;
  2280. }
  2281. .taglist { }
  2282. /*pricing table*/
  2283. .pricing-table-two {
  2284. background-color: #fff;
  2285. border-radius: 1px;
  2286. -webkit-border-radius: 1px;
  2287. -moz-border-radius: 1px;
  2288. padding: 7px 0;
  2289. margin: 20px -5px;
  2290. border: 1px solid #eee;
  2291. }
  2292. .pricing-table-two .title {
  2293. font-size: 24px;
  2294. padding: 15px 20px;
  2295. color: #000000;
  2296. }
  2297. .pricing-table-two .price { color: #E74c3c }
  2298. .pricing-table-two .desc { padding: 5px 20px }
  2299. .pricing-table-two .inner { padding: 0 10px }
  2300. .pricing-table-two ul.items {
  2301. list-style: none;
  2302. padding-left: 0;
  2303. margin: 0 8px;
  2304. margin-top: 14px;
  2305. margin-bottom: 17px;
  2306. }
  2307. .pricing-table-two ul.items li {
  2308. margin-bottom: 5px;
  2309. padding: 13px 15px;
  2310. border-radius: 1px;
  2311. -webkit-border-radius: 1px;
  2312. -moz-border-radius: 1px;
  2313. clear: both;
  2314. }
  2315. .pricing-table-two ul.items li.available { background-color: #f2f4f5 }
  2316. .pricing-table-two ul.items li .icon-holder {
  2317. display: inline-block;
  2318. vertical-align: top;
  2319. font-size: 18px;
  2320. padding-left: 13px;
  2321. position: relative;
  2322. padding-top: 3px;
  2323. }
  2324. .pricing-table-two ul.items li .desc {
  2325. display: inline-block;
  2326. width: 85%;
  2327. }
  2328. .pricing-table-two ul.items li .checkbox label {
  2329. padding-left: 2px;
  2330. margin-bottom: 14px;
  2331. }
  2332. .pricing-table-two ul.items li label {
  2333. cursor: pointer;
  2334. margin-bottom: 0;
  2335. font-size: 13px;
  2336. }
  2337. .pricing-table-two.highlighted {
  2338. border: 1px solid #0aa699;
  2339. position: relative;
  2340. top: -15px;
  2341. padding-bottom: 20px;
  2342. padding-top: 25px;
  2343. }
  2344. .pricing-table-two .btn-block {
  2345. width: 60%;
  2346. margin-left: 20%;
  2347. margin-bottom: 10px;
  2348. padding: 9px 0;
  2349. }
  2350. .feature-item {
  2351. margin: 0 50px;
  2352. text-align: center;
  2353. }
  2354. .pricing-table-two .price-actions .btn {
  2355. border-radius: 5px;
  2356. -moz-border-radius: 5px;
  2357. -webkit-border-radius: 5px;
  2358. background: rgb(44, 62, 80);
  2359. color: #fff;
  2360. border: none;
  2361. box-shadow: none;
  2362. text-shadow: none;
  2363. padding: 10px 20px;
  2364. margin-left: 16%;
  2365. margin-bottom: 3%;
  2366. width: 70%;
  2367. cursor: pointer;
  2368. }
  2369. .muted { color: #b6bfc5 }
  2370. .text-error { color: #e74c3c }
  2371. .f-w-n { font-weight: normal }
  2372. .hlight { }
  2373. .pr-10 { padding-right: 10px }
  2374. .pr-5 { padding-right: 5px }
  2375. .error-inner {
  2376. text-align: center;
  2377. padding: 15%;
  2378. }
  2379. .career-contact {
  2380. border: 1px solid #eee;
  2381. background-color: #f7f7f7;
  2382. padding-top: 9px;
  2383. }
  2384. .career-inner {
  2385. margin-top: -40px;
  2386. padding: 30px 0;
  2387. }
  2388. .career-head h1 { text-align: center }
  2389. .candidate ul li { padding: 3px 0 }
  2390. .candidate h1 { margin-bottom: 20px }
  2391. .align-left { text-align: left }
  2392. .privacy-terms h3 { text-align: left }
  2393. .terms-list {
  2394. padding-left: 15px;
  2395. padding-bottom: 25px;
  2396. line-height: 1.6;
  2397. }
  2398. .owl-prev {
  2399. float: left;
  2400. padding: 8px 20px;
  2401. margin-left: 2px;
  2402. border-radius: 2px;
  2403. -webkit-border-radius: 2px;
  2404. -moz-border-radius: 2px;
  2405. margin-top: 5px;
  2406. background-color: #eee;
  2407. }
  2408. .owl-next {
  2409. float: right;
  2410. padding: 8px 20px;
  2411. margin-right: 2px;
  2412. border-radius: 2px;
  2413. -webkit-border-radius: 2px;
  2414. -moz-border-radius: 2px;
  2415. margin-top: 5px;
  2416. background-color: #eee;
  2417. }
  2418. /*404 page*/
  2419. .fof { margin-top: -40px }
  2420. .fof h1 { margin-top: 0px }
  2421. /*submenu test*/
  2422. .dropdown-submenu { position: relative }
  2423. .dropdown-submenu>.dropdown-menu {
  2424. top: 0;
  2425. left: 100%;
  2426. margin-top: 0px;
  2427. margin-left: -1px;
  2428. -webkit-border-radius: 1px;
  2429. -moz-border-radius: 1px;
  2430. border-radius: 1px;
  2431. }
  2432. .dropdown-submenu:hover>.dropdown-menu { display: block }
  2433. .dropdown-submenu>a:after {
  2434. display: block;
  2435. content: " ";
  2436. float: right;
  2437. width: 0;
  2438. height: 0;
  2439. border-color: transparent;
  2440. border-style: solid;
  2441. border-width: 5px 0 5px 5px;
  2442. border-left-color: #ccc;
  2443. margin-top: 9px;
  2444. margin-right: -10px;
  2445. }
  2446. .dropdown-submenu:hover>a:after { border-left-color: #fff }
  2447. .dropdown-submenu.pull-left { float: none }
  2448. .dropdown-submenu.pull-left>.dropdown-menu {
  2449. left: -100%;
  2450. margin-left: 10px;
  2451. -webkit-border-radius: 1px;
  2452. -moz-border-radius: 1px;
  2453. border-radius: 1px;
  2454. }
  2455. .pad-bot-fifty { padding-bottom: 50px }
  2456. .jumbotron { margin-bottom: 0px }
  2457. .mar-b-30 { margin-bottom: 30px }
  2458. .mar-b-40 { margin-bottom: 40px }
  2459. .mar-b-50 { margin-bottom: 50px }
  2460. .mar-b-60 { margin-bottom: 60px }
  2461. .mar-b-70 { margin-bottom: 70px }
  2462. .btn {
  2463. border-radius: 4px;
  2464. -webkit-border-radius: 4px;
  2465. -moz-border-radius: 4px;
  2466. }
  2467. /*
  2468. Component: Buttons
  2469. -------------------------
  2470. */
  2471. .btn {
  2472. font-weight: 500;
  2473. -webkit-border-radius: 3px;
  2474. -moz-border-radius: 3px;
  2475. border-radius: 3px;
  2476. border: 1px solid transparent;
  2477. }
  2478. .btn.btn-default {
  2479. background-color: #fafafa;
  2480. color: #666;
  2481. border-color: #ddd;
  2482. border-bottom-color: #ddd;
  2483. -webkit-transition: all .3s ease;
  2484. -moz-transition: all .3s ease;
  2485. -ms-transition: all .3s ease;
  2486. -o-transition: all .3s ease;
  2487. transition: all .3s ease;
  2488. }
  2489. .btn.btn-default:hover,
  2490. .btn.btn-default:active,
  2491. .btn.btn-default.hover {
  2492. background-color: #f4f4f4!important;
  2493. -webkit-transition: all .3s ease;
  2494. -moz-transition: all .3s ease;
  2495. -ms-transition: all .3s ease;
  2496. -o-transition: all .3s ease;
  2497. transition: all .3s ease;
  2498. }
  2499. .btn.btn-default.btn-flat {
  2500. border-bottom-color: #d9dadc;
  2501. -webkit-transition: all .3s ease;
  2502. -moz-transition: all .3s ease;
  2503. -ms-transition: all .3s ease;
  2504. -o-transition: all .3s ease;
  2505. transition: all .3s ease;
  2506. }
  2507. .btn.btn-primary {
  2508. background-color: #3bafda;
  2509. -webkit-transition: all .3s ease;
  2510. -moz-transition: all .3s ease;
  2511. -ms-transition: all .3s ease;
  2512. -o-transition: all .3s ease;
  2513. transition: all .3s ease;
  2514. }
  2515. .btn.btn-primary:hover,
  2516. .btn.btn-primary:active,
  2517. .btn.btn-primary.hover {
  2518. background-color: #4fc1e9;
  2519. -webkit-transition: all .3s ease;
  2520. -moz-transition: all .3s ease;
  2521. -ms-transition: all .3s ease;
  2522. -o-transition: all .3s ease;
  2523. transition: all .3s ease;
  2524. }
  2525. .btn.btn-success {
  2526. background-color: #8cc152;
  2527. border: none;
  2528. -webkit-transition: all .3s ease;
  2529. -moz-transition: all .3s ease;
  2530. -ms-transition: all .3s ease;
  2531. -o-transition: all .3s ease;
  2532. transition: all .3s ease;
  2533. }
  2534. .btn.btn-success:hover,
  2535. .btn.btn-success:active,
  2536. .btn.btn-success.hover {
  2537. background-color: #a0d468;
  2538. border: none;
  2539. -webkit-transition: all .3s ease;
  2540. -moz-transition: all .3s ease;
  2541. -ms-transition: all .3s ease;
  2542. -o-transition: all .3s ease;
  2543. transition: all .3s ease;
  2544. }
  2545. .btn.btn-info {
  2546. background-color: #37bc9b;
  2547. border: none;
  2548. -webkit-transition: all .3s ease;
  2549. -moz-transition: all .3s ease;
  2550. -ms-transition: all .3s ease;
  2551. -o-transition: all .3s ease;
  2552. transition: all .3s ease;
  2553. }
  2554. .btn.btn-info:hover,
  2555. .btn.btn-info:active,
  2556. .btn.btn-info.hover {
  2557. background-color: rgb(44, 62, 80);
  2558. border: none;
  2559. -webkit-transition: all .3s ease;
  2560. -moz-transition: all .3s ease;
  2561. -ms-transition: all .3s ease;
  2562. -o-transition: all .3s ease;
  2563. transition: all .3s ease;
  2564. }
  2565. .btn.btn-danger {
  2566. background-color: #E74c3c;
  2567. border: none;
  2568. -webkit-transition: all .3s ease;
  2569. -moz-transition: all .3s ease;
  2570. -ms-transition: all .3s ease;
  2571. -o-transition: all .3s ease;
  2572. transition: all .3s ease;
  2573. }
  2574. .btn.btn-danger:hover,
  2575. .btn.btn-danger:active,
  2576. .btn.btn-danger.hover {
  2577. background-color: #f4543c;
  2578. border: none;
  2579. -webkit-transition: all .3s ease;
  2580. -moz-transition: all .3s ease;
  2581. -ms-transition: all .3s ease;
  2582. -o-transition: all .3s ease;
  2583. transition: all .3s ease;
  2584. }
  2585. .btn.btn-warning {
  2586. background-color: #f6bb42;
  2587. border: none;
  2588. -webkit-transition: all .3s ease;
  2589. -moz-transition: all .3s ease;
  2590. -ms-transition: all .3s ease;
  2591. -o-transition: all .3s ease;
  2592. transition: all .3s ease;
  2593. }
  2594. .btn.btn-warning:hover,
  2595. .btn.btn-warning:active,
  2596. .btn.btn-warning.hover {
  2597. background-color: #ffce54;
  2598. border: none;
  2599. -webkit-transition: all .3s ease;
  2600. -moz-transition: all .3s ease;
  2601. -ms-transition: all .3s ease;
  2602. -o-transition: all .3s ease;
  2603. transition: all .3s ease;
  2604. }
  2605. .btn-group .btn.btn-success { border: 1px solid #7ab03f }
  2606. .btn-group .btn.btn-info { border: 1px solid #2fa084 }
  2607. .btn-group .btn.btn-danger { border: 1px solid #d13a24 }
  2608. .btn-group .btn.btn-warning { border: 1px solid #efa50b }
  2609. .btn-group-vertical .btn.btn-success { border: 1px solid #7ab03f }
  2610. .btn-group-vertical .btn.btn-info { border: 1px solid #2fa084 }
  2611. .btn-group-vertical .btn.btn-danger { border: 1px solid #d13a24 }
  2612. .btn-group-vertical .btn.btn-warning { border: 1px solid #efa50b }
  2613. .open .dropdown-toggle.btn-warning {
  2614. background-color: #f6bb42;
  2615. border-color: #efa50b;
  2616. }
  2617. .open .dropdown-toggle.btn-info {
  2618. background-color: rgb(44, 62, 80);
  2619. border-color: #2fa084;
  2620. }
  2621. .btn.btn-flat {
  2622. -webkit-border-radius: 0;
  2623. -moz-border-radius: 0;
  2624. border-radius: 0;
  2625. -webkit-box-shadow: none;
  2626. -moz-box-shadow: none;
  2627. box-shadow: none;
  2628. border-width: 1px;
  2629. }
  2630. .btn:active {
  2631. -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  2632. -moz-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  2633. box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  2634. }
  2635. .btn:focus { outline: none }
  2636. .btn.btn-file {
  2637. position: relative;
  2638. width: 120px;
  2639. height: 35px;
  2640. overflow: hidden;
  2641. }
  2642. .btn.btn-file > input[type='file'] {
  2643. display: block !important;
  2644. width: 100% !important;
  2645. height: 35px !important;
  2646. opacity: 0 !important;
  2647. position: absolute;
  2648. top: -10px;
  2649. cursor: pointer;
  2650. }
  2651. .btn.btn-app {
  2652. position: relative;
  2653. padding: 15px 5px;
  2654. margin: 0 0 10px 10px;
  2655. min-width: 80px;
  2656. height: 60px;
  2657. -webkit-box-shadow: none;
  2658. -moz-box-shadow: none;
  2659. box-shadow: none;
  2660. -webkit-border-radius: 0;
  2661. -moz-border-radius: 0;
  2662. border-radius: 0;
  2663. text-align: center;
  2664. color: #666;
  2665. border: 1px solid #ddd;
  2666. background-color: #fafafa;
  2667. font-size: 12px;
  2668. }
  2669. .btn.btn-app > .fa,
  2670. .btn.btn-app > .glyphicon,
  2671. .btn.btn-app > .ion {
  2672. font-size: 20px;
  2673. display: block;
  2674. }
  2675. .btn.btn-app:hover {
  2676. background: #f4f4f4;
  2677. color: #444;
  2678. border-color: #aaa;
  2679. }
  2680. .btn.btn-app:active,
  2681. .btn.btn-app:focus {
  2682. -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  2683. -moz-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  2684. box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  2685. }
  2686. .btn.btn-app > .badge {
  2687. position: absolute;
  2688. top: -3px;
  2689. right: -10px;
  2690. font-size: 10px;
  2691. font-weight: 400;
  2692. }
  2693. .btn.btn-social-old {
  2694. -webkit-box-shadow: none;
  2695. -moz-box-shadow: none;
  2696. box-shadow: none;
  2697. opacity: 0.9;
  2698. padding: 0;
  2699. }
  2700. .btn.btn-social-old > .fa {
  2701. padding: 10px 0;
  2702. width: 40px;
  2703. }
  2704. .btn.btn-social-old > .fa + span { border-left: 1px solid rgba(255, 255, 255, 0.3) }
  2705. .btn.btn-social-old span { padding: 10px }
  2706. .btn.btn-social-old:hover { opacity: 1 }
  2707. .btn.btn-circle {
  2708. width: 30px;
  2709. height: 30px;
  2710. line-height: 30px;
  2711. padding: 0;
  2712. -webkit-border-radius: 50%;
  2713. -moz-border-radius: 50%;
  2714. border-radius: 50%;
  2715. }
  2716. /* Background colors */
  2717. .bg-red,
  2718. .bg-yellow,
  2719. .bg-aqua,
  2720. .bg-blue,
  2721. .bg-light-blue,
  2722. .bg-green,
  2723. .bg-navy,
  2724. .bg-teal,
  2725. .bg-olive,
  2726. .bg-lime,
  2727. .bg-rgb(44, 62, 80),
  2728. .bg-fuchsia,
  2729. .bg-purple,
  2730. .bg-maroon,
  2731. .bg-black { color: #f9f9f9 !important }
  2732. .bg-gray { background-color: #eaeaec !important }
  2733. .bg-black { background-color: #222222 !important }
  2734. .bg-red { background-color: #f56954 !important }
  2735. .bg-yellow { background-color: #f39c12 !important }
  2736. .bg-aqua { background-color: #00c0ef !important }
  2737. .bg-blue { background-color: #0073b7 !important }
  2738. .bg-light-blue { background-color: #3c8dbc !important }
  2739. .bg-green { background-color: #00a65a !important }
  2740. .bg-navy { background-color: #001f3f !important }
  2741. .bg-teal { background-color: #39cccc !important }
  2742. .bg-olive { background-color: #3d9970 !important }
  2743. .bg-lime { background-color: #01ff70 !important }
  2744. .bg-rgb(44, 62, 80) { background-color: #ff851b !important }
  2745. .bg-fuchsia { background-color: #f012be !important }
  2746. .bg-purple { background-color: #932ab6 !important }
  2747. .bg-maroon { background-color: #85144b !important }
  2748. .tag-line-section {
  2749. background: url("../img/tg-black-bg.png") no-repeat fixed top rgba(0,0,0,0.7);
  2750. height: 300px;
  2751. margin-bottom: 30px;
  2752. }
  2753. .mfp-fade.mfp-bg {
  2754. opacity: 0;
  2755. -webkit-transition: all 0.3s ease-out;
  2756. -moz-transition: all 0.3s ease-out;
  2757. transition: all 0.3s ease-out;
  2758. }
  2759. /* overlay animate in */
  2760. .mfp-fade.mfp-bg.mfp-ready { opacity: 0.8 }
  2761. /* overlay animate out */
  2762. .mfp-fade.mfp-bg.mfp-removing { opacity: 0 }
  2763. /* content at start */
  2764. .mfp-fade.mfp-wrap .mfp-content {
  2765. opacity: 0;
  2766. -webkit-transition: all 0.3s ease-out;
  2767. -moz-transition: all 0.3s ease-out;
  2768. transition: all 0.3s ease-out;
  2769. }
  2770. /* content animate it */
  2771. .mfp-fade.mfp-wrap.mfp-ready .mfp-content { opacity: 1 }
  2772. /* content animate out */
  2773. .mfp-fade.mfp-wrap.mfp-removing .mfp-content { opacity: 0 }
  2774. /* Recent work hover effect */
  2775. .view-sixth img {
  2776. -webkit-transition: all 0.4s ease-in-out 0.5s;
  2777. -moz-transition: all 0.4s ease-in-out 0.5s;
  2778. -o-transition: all 0.4s ease-in-out 0.5s;
  2779. -ms-transition: all 0.4s ease-in-out 0.5s;
  2780. transition: all 0.4s ease-in-out 0.5s;
  2781. }
  2782. .view-sixth .mask {
  2783. background-color: rgba(0,0,0,0.5);
  2784. -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
  2785. filter: alpha(opacity=0);
  2786. opacity: 0;
  2787. -webkit-transition: all 0.3s ease-in 0.4s;
  2788. -moz-transition: all 0.3s ease-in 0.4s;
  2789. -o-transition: all 0.3s ease-in 0.4s;
  2790. -ms-transition: all 0.3s ease-in 0.4s;
  2791. transition: all 0.3s ease-in 0.4s;
  2792. }
  2793. .view-sixth a.info {
  2794. -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
  2795. filter: alpha(opacity=0);
  2796. opacity: 0;
  2797. -webkit-transform: translateY(100px);
  2798. -moz-transform: translateY(100px);
  2799. -o-transform: translateY(100px);
  2800. -ms-transform: translateY(100px);
  2801. transform: translateY(100px);
  2802. -webkit-transition: all 0.3s ease-in-out 0.1s;
  2803. -moz-transition: all 0.3s ease-in-out 0.1s;
  2804. -o-transition: all 0.3s ease-in-out 0.1s;
  2805. -ms-transition: all 0.3s ease-in-out 0.1s;
  2806. transition: all 0.3s ease-in-out 0.1s;
  2807. }
  2808. .view-sixth:hover .mask {
  2809. -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
  2810. filter: alpha(opacity=100);
  2811. opacity: 1;
  2812. -webkit-transition-delay: 0s;
  2813. -moz-transition-delay: 0s;
  2814. -o-transition-delay: 0s;
  2815. -ms-transition-delay: 0s;
  2816. transition-delay: 0s;
  2817. }
  2818. .view-sixth:hover img {
  2819. -webkit-transition-delay: 0s;
  2820. -moz-transition-delay: 0s;
  2821. -o-transition-delay: 0s;
  2822. -ms-transition-delay: 0s;
  2823. transition-delay: 0s;
  2824. }
  2825. .view-sixth:hover a.info {
  2826. -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
  2827. filter: alpha(opacity=100);
  2828. opacity: 1;
  2829. -webkit-transform: translateY(0px);
  2830. -moz-transform: translateY(0px);
  2831. -o-transform: translateY(0px);
  2832. -ms-transform: translateY(0px);
  2833. transform: translateY(0px);
  2834. -webkit-transition-delay: 0.3s;
  2835. -moz-transition-delay: 0.3s;
  2836. -o-transition-delay: 0.3s;
  2837. -ms-transition-delay: 0.3s;
  2838. transition-delay: 0.3s;
  2839. }
  2840. .view {
  2841. float: left;
  2842. overflow: hidden;
  2843. position: relative;
  2844. text-align: center;
  2845. cursor: default;
  2846. }
  2847. .view .mask,
  2848. .view .content {
  2849. position: absolute;
  2850. overflow: hidden;
  2851. top: 0;
  2852. left: 0;
  2853. }
  2854. .view img {
  2855. display: block;
  2856. position: relative;
  2857. }
  2858. .view a.info {
  2859. display: inline-block;
  2860. text-decoration: none;
  2861. position: relative;
  2862. top: 35%;
  2863. color: #fff;
  2864. }
  2865. .feature-box {
  2866. margin-top: 15px;
  2867. margin-bottom: 15px;
  2868. }
  2869. .feature-box-heading i {
  2870. color: rgb(44, 62, 80);
  2871. width: 40px;
  2872. height: 40px;
  2873. display: inline-block;
  2874. border-radius: 50px;
  2875. border: 1px solid rgb(44, 62, 80);
  2876. line-height: 40px;
  2877. }
  2878. .border-one {
  2879. border: 1px solid #ffffff;
  2880. padding: 5px 15px;
  2881. }
  2882. .border-one:hover {
  2883. border: 1px solid #eee;
  2884. padding: 5px 15px;
  2885. opacity: .9;
  2886. }
  2887. /* Back-to-top */
  2888. #back-to-top {
  2889. display:none;
  2890. position:fixed;
  2891. bottom:30px;
  2892. right:30px;
  2893. height:40px;
  2894. width:40px;
  2895. cursor:pointer;
  2896. background:#000000;
  2897. line-height:1em;
  2898. -webkit-border-radius:2px;
  2899. -moz-border-radius:2px;
  2900. border-radius:2px;
  2901. background-image:url(../img/triangle.png);
  2902. background-position: 12px 16px;
  2903. background-repeat:no-repeat;
  2904. -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  2905. filter: alpha(opacity=80);
  2906. opacity:0.5;
  2907. -webkit-transition: all .3s ease;
  2908. -moz-transition: all .3s ease;
  2909. -ms-transition: all .3s ease;
  2910. -o-transition: all .3s ease;
  2911. transition: all .3s ease;
  2912. }
  2913. #back-to-top:hover {
  2914. background-color:rgb(44, 62, 80);
  2915. -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  2916. filter: alpha(opacity=80);
  2917. opacity:0.8;
  2918. -webkit-transition: all .3s ease;
  2919. -moz-transition: all .3s ease;
  2920. -ms-transition: all .3s ease;
  2921. -o-transition: all .3s ease;
  2922. transition: all .3s ease;
  2923. }
  2924. div#logo a img{
  2925. float:left;
  2926. height:75px;
  2927. }
  2928. div.header h3{
  2929. margin-left:15px;
  2930. }
  2931. .hr{
  2932. height:1px;
  2933. width: 30%;
  2934. margin:30px auto;
  2935. background-color:#ececec;
  2936. position: relative;
  2937. line-height: 1px;
  2938. }
  2939. .hr-inner{
  2940. width:8px;
  2941. height: 9px;
  2942. background-color: #fff;
  2943. border: 1px solid #ececec;
  2944. position: absolute;
  2945. left:50%;
  2946. top:-4px;
  2947. }