HOME | DD

spyed — Boldly Facing The Future
#deviantart #itscoming
Published: 2014-12-04 22:00:36 +0000 UTC; Views: 774543; Favourites: 6621; Downloads: 0
Redirect to original
Description body div#devskin11707339 .gr-box, body div#devskin11707339 body { font:400 18px/24px 'Arial', Calibre, Sans-Serif; background:#1f2224; color:#F2F2F2; position:relative; border-bottom:none; margin:0; padding:0; } /* ------------------------------------------------------- WRAP ------------------------------------------------------- */ body div#devskin11707339 .wrap { max-width:1080px; margin:auto; padding:0; position:relative; } body div#devskin11707339 .wrap .wrap { width:100%; padding:0; } body div#devskin11707339 .wrap.wide { max-width:1500px; } /* ------------------------------------------------------- COLUMNS ------------------------------------------------------- */ body div#devskin11707339 .col_1, body div#devskin11707339 .col_2, body div#devskin11707339 .col_3, body div#devskin11707339 .col_4, body div#devskin11707339 .col_5, body div#devskin11707339 .col_6, body div#devskin11707339 .col_7, body div#devskin11707339 .col_8, body div#devskin11707339 .col_9, body div#devskin11707339 .col_10, body div#devskin11707339 .col_11, body div#devskin11707339 .col_12 { display:inline; float:left; position:relative; margin-left:1.388%; margin-right:1.388%; } body div#devskin11707339 .col_1 { width:5.5550%; } body div#devskin11707339 .col_2 { width:13.888%; } body div#devskin11707339 .col_3 { width:22.222%; } body div#devskin11707339 .col_4 { width:30.555%; } body div#devskin11707339 .col_5 { width:38.888%; } body div#devskin11707339 .col_6 { width:47.222%; } body div#devskin11707339 .col_7 { width:55.555%; } body div#devskin11707339 .col_8 { width:63.888%; } body div#devskin11707339 .col_9 { width:72.222%; } body div#devskin11707339 .col_10 { width:80.555%; } body div#devskin11707339 .col_11 { width:88.888%; } body div#devskin11707339 .col_12 { width:97.222%; } /* ------------------------------------------------------- COLUMN BEFORE ------------------------------------------------------- */ body div#devskin11707339 .before_1 { padding-left:8.3330%; } body div#devskin11707339 .before_2 { padding-left:16.666%; } body div#devskin11707339 .before_3 { padding-left:25.000%; } body div#devskin11707339 .before_4 { padding-left:33.333%; } body div#devskin11707339 .before_5 { padding-left:41.667%; } body div#devskin11707339 .before_6 { padding-left:50.000%; } body div#devskin11707339 .before_7 { padding-left:58.333%; } body div#devskin11707339 .before_8 { padding-left:66.667%; } body div#devskin11707339 .before_9 { padding-left:75.000%; } body div#devskin11707339 .before_10 { padding-left:83.333%; } body div#devskin11707339 .before_11 { padding-left:91.667%; } /* ------------------------------------------------------- COLUMN AFTER ------------------------------------------------------- */ body div#devskin11707339 .after_1 { padding-right:8.3330%; } body div#devskin11707339 .after_2 { padding-right:16.667%; } body div#devskin11707339 .after_3 { padding-right:25.000%; } body div#devskin11707339 .after_4 { padding-right:33.333%; } body div#devskin11707339 .after_5 { padding-right:41.667%; } body div#devskin11707339 .after_6 { padding-right:50.000%; } body div#devskin11707339 .after_7 { padding-right:58.333%; } body div#devskin11707339 .after_8 { padding-right:66.667%; } body div#devskin11707339 .after_9 { padding-right:75.000%; } body div#devskin11707339 .after_10 { padding-right:83.333%; } body div#devskin11707339 .after_11 { padding-right:91.667%; } /* ------------------------------------------------------- PUSH BEFORE ------------------------------------------------------- */ body div#devskin11707339 .push_1 { left:8.3330%; } body div#devskin11707339 .push_2 { left:16.667%; } body div#devskin11707339 .push_3 { left:25.000%; } body div#devskin11707339 .push_4 { left:33.333%; } body div#devskin11707339 .push_5 { left:41.667%; } body div#devskin11707339 .push_6 { left:50.000%; } body div#devskin11707339 .push_7 { left:58.333%; } body div#devskin11707339 .push_8 { left:66.667%; } body div#devskin11707339 .push_9 { left:75.000%; } body div#devskin11707339 .push_10 { left:83.333%; } body div#devskin11707339 .push_11 { left:91.667%; } /* ------------------------------------------------------- PULL AFTER ------------------------------------------------------- */ body div#devskin11707339 .pull_1 { left:-8.3330%; } body div#devskin11707339 .pull_2 { left:-16.667%; } body div#devskin11707339 .pull_3 { left:-25.000%; } body div#devskin11707339 .pull_4 { left:-33.333%; } body div#devskin11707339 .pull_5 { left:-41.667%; } body div#devskin11707339 .pull_6 { left:-50.000%; } body div#devskin11707339 .pull_7 { left:-58.333%; } body div#devskin11707339 .pull_8 { left:-66.667%; } body div#devskin11707339 .pull_9 { left:-75.000%; } body div#devskin11707339 .pull_10 { left:-83.333%; } body div#devskin11707339 .pull_11 { left:-91.667%; } body div#devskin11707339 .alpha { margin-left:0!important; } body div#devskin11707339 .omega { margin-right:0!important; } /* ------------------------------------------------------- NESTED COLUMNS ------------------------------------------------------- */ body div#devskin11707339 .col_10 .wrap .col_10 { width:100.00%; margin-left:0.000%; margin-right:0.000%; } body div#devskin11707339 .col_10 .wrap .col_9 { width:89.655%; margin-left:1.724%; margin-right:1.724%; } body div#devskin11707339 .col_10 .wrap .col_7 { width:68.965%; margin-left:1.724%; margin-right:1.724%; } body div#devskin11707339 .col_10 .wrap .col_6 { width:58.620%; margin-left:1.724%; margin-right:1.724%; } body div#devskin11707339 .col_10 .wrap .col_3 { width:27.586%; margin-left:1.724%; margin-right:1.724%; } body div#devskin11707339 .col_9 .wrap .col_8 { width:88.461%; margin-left:1.923%; margin-right:1.923%; } body div#devskin11707339 .col_9 .wrap .col_7 { width:76.923%; margin-left:1.923%; margin-right:1.923%; } body div#devskin11707339 .col_9 .wrap .col_6 { width:65.384%; margin-left:1.923%; margin-right:1.923%; } body div#devskin11707339 .col_9 .wrap .col_5 { width:53.846%; margin-left:1.923%; margin-right:1.923%; } body div#devskin11707339 .col_9 .wrap .col_4 { width:42.307%; margin-left:1.923%; margin-right:1.923%; } body div#devskin11707339 .col_9 .wrap .col_3 { width:30.769%; margin-left:1.923%; margin-right:1.923%; } body div#devskin11707339 .col_8 .wrap .col_7 { width:86.956%; margin-left:2.173%; margin-right:2.173%; } body div#devskin11707339 .col_8 .wrap .col_6 { width:73.913%; margin-left:2.173%; margin-right:2.173%; } body div#devskin11707339 .col_8 .wrap .col_5 { width:60.869%; margin-left:2.173%; margin-right:2.173%; } body div#devskin11707339 .col_8 .wrap .col_4 { width:47.826%; margin-left:2.173%; margin-right:2.173%; } body div#devskin11707339 .col_8 .wrap .col_3 { width:34.782%; margin-left:2.173%; margin-right:2.173%; } body div#devskin11707339 .col_8 .wrap .col_2 { width:21.739%; margin-left:2.173%; margin-right:2.173%; } body div#devskin11707339 .col_8 .wrap .col_1 { width:08.695%; margin-left:2.173%; margin-right:2.173%; } body div#devskin11707339 .col_7 .wrap .col_7 { width:100.00%; margin-left:0.000%; margin-right:0.000%; } body div#devskin11707339 .col_7 .wrap .col_6 { width:85.000%; margin-left:2.500%; margin-right:2.500%; } body div#devskin11707339 .col_7 .wrap .col_5 { width:70.000%; margin-left:2.500%; margin-right:2.500%; } body div#devskin11707339 .col_7 .wrap .col_4 { width:55.000%; margin-left:2.500%; margin-right:2.500%; } body div#devskin11707339 .col_7 .wrap .col_3 { width:40.000%; margin-left:2.500%; margin-right:2.500%; } body div#devskin11707339 .col_7 .wrap .col_2 { width:25.000%; margin-left:2.500%; margin-right:2.500%; } body div#devskin11707339 .col_6 .wrap .col_6 { width:100.00%; margin-left:0.000%; margin-right:0.000%; } body div#devskin11707339 .col_6 .wrap .col_5 { width:82.352%; margin-left:2.941%; margin-right:2.941%; } body div#devskin11707339 .col_6 .wrap .col_4 { width:64.705%; margin-left:2.941%; margin-right:2.941%; } body div#devskin11707339 .col_6 .wrap .col_3 { width:47.058%; margin-left:2.941%; margin-right:2.941%; } body div#devskin11707339 .col_6 .wrap .col_2 { width:29.411%; margin-left:2.941%; margin-right:2.941%; } body div#devskin11707339 .col_5 .wrap .col_5 { width:100.00%; margin-left:0.000%; margin-right:0.000%; } body div#devskin11707339 .col_5 .wrap .col_4 { width:78.571%; margin-left:3.571%; margin-right:3.571%; } body div#devskin11707339 .col_5 .wrap .col_3 { width:57.142%; margin-left:3.571%; margin-right:3.571%; } body div#devskin11707339 .col_5 .wrap .col_2 { width:35.714%; margin-left:3.571%; margin-right:3.571%; } body div#devskin11707339 .col_4 .wrap .col_3 { width:72.727%; margin-left:4.545%; margin-right:4.545%; } body div#devskin11707339 .col_4 .wrap .col_2 { width:45.454%; margin-left:4.545%; margin-right:4.545%; } body div#devskin11707339 .col_3 .wrap .col_2 { width:62.500%; margin-left:6.250%; margin-right:6.250%; } /* ------------------------------------------------------- NESTED BEFORE ------------------------------------------------------- */ body div#devskin11707339 .col_10 .wrap .before_1 { padding-left:10.344%; } body div#devskin11707339 .col_9 .wrap .before_1 { padding-left:11.538%; } body div#devskin11707339 .col_8 .wrap .before_2 { padding-left:26.086%; } body div#devskin11707339 .col_8 .wrap .before_1 { padding-left:13.043%; } body div#devskin11707339 .col_8 .wrap .after_1 { padding-right:13.043%; } body div#devskin11707339 .col_8 .wrap .pull_1 { margin-left:-13.043%; } body div#devskin11707339 .col_7 .wrap .after_2 { padding-right:30.000%; } body div#devskin11707339 .col_7 .wrap .before_1 { padding-left:15.000%; } body div#devskin11707339 .col_7 .wrap .before_2 { padding-left:30.000%; } body div#devskin11707339 .col_7 .wrap .after_1 { padding-right:15.000%; } body div#devskin11707339 .col_6 .wrap .before_3 { padding-left:52.941%; } body div#devskin11707339 .col_6 .wrap .before_2 { padding-left:35.294%; } body div#devskin11707339 .col_6 .wrap .before_1 { padding-left:17.647%; } body div#devskin11707339 .col_6 .wrap .after_2 { padding-right:35.294%; } body div#devskin11707339 .col_6 .wrap .after_1 { padding-right:17.647%; } body div#devskin11707339 .col_5 .wrap .before_1 { padding-left:21.428%; } body div#devskin11707339 .col_5 .wrap .before_2 { padding-left:42.857%; } body div#devskin11707339 .col_5 .wrap .before_3 { padding-left:64.285%; } body div#devskin11707339 .col_5 .wrap .after_1 { padding-right:21.428%; } body div#devskin11707339 .col_4 .wrap .before_1 { padding-left:27.272%; } body div#devskin11707339 .col_4 .wrap .before_2 { padding-left:54.545%; } body div#devskin11707339 .col_4 .wrap .after_1 { padding-right:27.272%; } body div#devskin11707339 .col_3 .wrap .after_1 { padding-right:37.500%; } body div#devskin11707339 .col_3 .wrap .before_1 { padding-left:37.500%; } body div#devskin11707339 .clear:before, body div#devskin11707339 .clear:after { content:''; display:table; } body div#devskin11707339 .clear:after { clear:both; } body div#devskin11707339 .clear { clear:both; } /* ------------------------------------------------------- COMMON ------------------------------------------------------- */ body div#devskin11707339 h1, body div#devskin11707339 h2, body div#devskin11707339 h3, body div#devskin11707339 h4 { font-family:Arial, Sans-Serif; font-weight:bold; line-height:normal; letter-spacing:normal; position:relative; color:inherit; margin:0 0 30px 0; z-index:1; } body div#devskin11707339 h1 a, body div#devskin11707339 h2 a, body div#devskin11707339 h3 a, body div#devskin11707339 h4 a { color:inherit!important; font-weight:inherit!important; } body div#devskin11707339 h1 { font-size:72px; } body div#devskin11707339 h2 { font-size:44px; line-height:46px; } body div#devskin11707339 p { margin:0 0 24px; position:relative; font-weight:normal; } body div#devskin11707339 p.large { font-size:30px; line-height:36px; } body div#devskin11707339 a { color:#40CfC7; text-decoration:none; transition:all 0.15s ease; -moz-transition:all 0.15s ease; -webkit-transition:all 0.15s ease; -ms-transition:all 0.15s ease; -o-transition:all 0.15s ease; } body div#devskin11707339 p a, body div#devskin11707339 li a { color:#40CfC7; text-decoration:none; font-weight:normal; position:relative; transition:all 0.20s ease-in-out; -moz-transition:all 0.20s ease-in-out; -webkit-transition:all 0.20s ease-in-out; -ms-transition:all 0.20s ease-in-out; -o-transition:all 0.20s ease-in-out; } body div#devskin11707339 p a:hover, body div#devskin11707339 li a:hover { color:#D4F5F2; } body div#devskin11707339 .image img { max-width:100%; vertical-align:bottom; display:inline-block; } body div#devskin11707339 img.title { display:inline-block; max-width:100%; vertical-align:bottom; } body div#devskin11707339 .credit { position:relative; font-size:13px; line-height:16px; } body div#devskin11707339 .credit strong { display:block; } body div#devskin11707339 .credit strong a { color:inherit; font:inherit; } body div#devskin11707339 .credit a:hover, body div#devskin11707339 span[class*='user'] a:hover { color:#40CEC6!important; } body div#devskin11707339 .overlay { padding:50px 0; background:rgb(31, 34, 36); background:rgba(31,34,36,0.5); } body div#devskin11707339 .dark-bg { background:#1F2224; color:#fff; } body div#devskin11707339 span.user-symbol { display:none; } body div#devskin11707339 .background { background:#1f2224; overflow:hidden; position:relative; top:0; right:0; left:0; display:none; } body div#devskin11707339 .background img { width:100%; height:auto; max-width:none; display:inline-block; vertical-align:bottom; position:relative!important; } body div#devskin11707339 .align-center { text-align:center; } body div#devskin11707339 .align-right { text-align:right; } body div#devskin11707339 .align-left { text-align:left; } /* ------------------------------------------------------- -01 ------------------------------------------------------- */ body div#devskin11707339 .img-01 { background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/img-01.jpg) 50% 30%/cover no-repeat fixed; position:relative; padding:20% 0 90px 0; z-index:1; } body div#devskin11707339 .img-01 .overlay { position:absolute; top:0; right:0; bottom:0; left:0; background:rgb(31, 34, 36); background: -webkit-linear-gradient(0deg, rgba(31,34,36,0.95) 20%,rgba(31,34,36,0) 90%,rgba(31,34,36,0) 100%); background: -moz-linear-gradient(0deg, rgba(31,34,36,0.95) 20%,rgba(31,34,36,0) 90%,rgba(31,34,36,0) 100%); background:linear-gradient(0deg, rgba(31,34,36,0.95) 20%,rgba(31,34,36,0) 90%,rgba(31,34,36,0) 100%); background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/bg-gradient.png) 0 0/auto 100% repeat-x; z-index:-1; } body div#devskin11707339 .img-01 a { display:block; position:relative; } body div#devskin11707339 .img-01 img.title.boldy { margin:0 0 130px; width:auto; height:auto; } body div#devskin11707339 .img-01 .credit { margin-bottom:100px; } body div#devskin11707339 .img-01 img.title.future { margin:70px 0 30px; } body div#devskin11707339 .img-01 h2 { text-transform:uppercase; } /* ------------------------------------------------------- -02 ------------------------------------------------------- */ body div#devskin11707339 .img-02 { background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/img-02.jpg) 50% 50%/cover no-repeat fixed; position:relative; padding:100px 0 60px; z-index:1; } body div#devskin11707339 .img-02 .overlay { position:absolute; top:0; right:0; bottom:0; left:0; background:rgb(31, 34, 36); background: -webkit-linear-gradient(0deg, rgba(31,34,36,0.7) 20%, rgba(0,0,0,0) 100%); background: -moz-linear-gradient(0deg, rgba(31,34,36,0.7) 20%, rgba(0,0,0,0) 100%); background:linear-gradient(0deg, rgba(31,34,36,0.7) 20%, rgba(0,0,0,0) 100%); background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/bg-gradient.png) 0 0/auto 100% repeat-x; z-index:-1; } body div#devskin11707339 .img-02 img.title.bba { margin:0 0 100px; } /* ------------------------------------------------------- VALUES ------------------------------------------------------- */ body div#devskin11707339 .values { position:relative; z-index:1; } body div#devskin11707339 .values .overlay { padding:30px 0 0px; background:rgb(31, 34, 36); background:rgba(31, 34, 36, 0.5); display:none; } body div#devskin11707339 .values div[class*='img'] { padding:25% 0; position:relative; z-index:1; } body div#devskin11707339 .values div[class*='img']::before { content:''; position:absolute; padding:0; top:0; right:0; bottom:0; left:0; background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/bg-overlay.png?2) 50% 100%/100% 640px no-repeat fixed; opacity:0.6; filter:alpha(opacity=60); _zoom:1; z-index:-1; } body div#devskin11707339 .values div[class*='img']::after { content:''; position:absolute; padding:0; top:0; right:0; bottom:0; left:0; background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/copy-values_default.svg?3) 50% 100%/1400px auto no-repeat fixed; z-index:-1; } /* ------------------------------------------------------- -03 ------------------------------------------------------- */ body div#devskin11707339 .img-03 { background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/img-03.jpg) 50% 10%/cover no-repeat fixed; } body div#devskin11707339 .values div.img-03::after { background-image:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/copy-values_audacious.svg?3); } /* ------------------------------------------------------- -04 ------------------------------------------------------- */ body div#devskin11707339 .img-04 { background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/img-04.jpg) 50% 10%/cover no-repeat fixed; } body div#devskin11707339 .values div.img-04::after { background-image:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/copy-values_magnetic.svg?3); } /* ------------------------------------------------------- -05 ------------------------------------------------------- */ body div#devskin11707339 .img-05 { background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/img-05.jpg) 50% 10%/cover no-repeat fixed; } body div#devskin11707339 .values div.img-05::after { background-image:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/copy-values_kindred.svg?3); } /* ------------------------------------------------------- -06 ------------------------------------------------------- */ body div#devskin11707339 .img-06 { background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/img-06.jpg) 50% 10%/cover no-repeat fixed; } body div#devskin11707339 .values div.img-06::after { background-image:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/copy-values_inspired.svg?3); } /* ------------------------------------------------------- -07 ------------------------------------------------------- */ body div#devskin11707339 .img-07 { background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/img-07.jpg) 50% 50%/cover no-repeat fixed; color:#fff; padding:300px 0 60px; position:relative; z-index:1; } body div#devskin11707339 .img-07::after { content:''; position:absolute; top:0; right:0; bottom:0; left:0; background:rgb(31, 34, 36); background: -webkit-linear-gradient(180deg, rgba(31,34,36,0.7) 0, rgba(0,0,0,0) 100%); background: -moz-linear-gradient(180deg, rgba(31,34,36,0.7) 0, rgba(0,0,0,0) 100%); background:linear-gradient(180deg, rgba(31,34,36,0.7) 0, rgba(0,0,0,0) 100%); z-index:-1; } body div#devskin11707339 .img-07 p { margin-bottom:50px; } body div#devskin11707339 .img-07 h3 { max-width:360px; font-size:32px; line-height:32px; } body div#devskin11707339 .deviated-a { margin-bottom:200px; position:relative; z-index:1; } body div#devskin11707339 .deviated-a img { width:100%; vertical-align:bottom; display:inline-block; } body div#devskin11707339 .deviated-a img.right, body div#devskin11707339 .deviated-a img.left { position:absolute; width:100%; height:100%; top:0; opacity:0.20; filter:alpha(opacity=20); _zoom:1; z-index:-1; } body div#devskin11707339 .deviated-a img.left { right:100%; transform:scale(1,-1); -moz-transform:scale(1,-1); -webkit-transform:scale(1,-1); -ms-transform:scale(1,-1); -o-transform:scale(1,-1); } body div#devskin11707339 .deviated-a img.right { left:100%; transform:scale(-1,1); -moz-transform:scale(-1,1); -webkit-transform:scale(-1,1); -ms-transform:scale(-1,1); -o-transform:scale(-1,1); } body div#devskin11707339 .img-07 .credit { color:#6F6F6E; } /* ------------------------------------------------------- -08 ------------------------------------------------------- */ body div#devskin11707339 .img-08 { background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/img-08.jpg) 50% 100%/cover fixed no-repeat; padding:760px 0 0; position:relative; z-index:1; } body div#devskin11707339 .img-08 .overlay { padding:40px 0 60px; } body div#devskin11707339 .img-08 .title { margin-bottom:30px; } body div#devskin11707339 .img-08 p { margin-bottom:0; } body div#devskin11707339 .img-08 .credit { position:absolute; bottom:0; right:10%; } /* ------------------------------------------------------- HOW IT ALL WORKS ------------------------------------------------------- */ body div#devskin11707339 .logo-details { position:relative; } body div#devskin11707339 .sub { position:relative; padding-top:10px; display:block; max-width:none; border-top:1px solid #7D7F7F; margin:60px 0 40px; } body div#devskin11707339 img[src*='img-logo_lines.svg'] { margin:40px 0 60px; } body div#devskin11707339 img[src*='title-lockups_all.svg'] { margin-top:25px; } body div#devskin11707339 .logo-details .strip.green { margin-top:25px; } body div#devskin11707339 .typography-row { margin-top:40px; } body div#devskin11707339 img[src*='img-typography_2.svg'] { margin-top:15px; } body div#devskin11707339 img[src*='title-nurture_your_creative_nature.svg'] { margin-top:10px; margin-bottom:45px; } body div#devskin11707339 img.logo-mb { position:relative!important; bottom:165px; left:69%; width:21%; display:none; } body div#devskin11707339 .img-09 .credit { margin-top:10px; text-align:left; } body div#devskin11707339 .bg-deviated_a { margin-top:40px; background:#fff url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/bg-deviated_a_pattern.svg) 50% 50%/cover no-repeat fixed; padding:20% 0; } body div#devskin11707339 .section-strip { position:relative; background:#fff; } body div#devskin11707339 .section-strip span { height:75px; display:block; background-size:20px auto; background-repeat:repeat; background-position:0 0; background-attachment:fixed; } body div#devskin11707339 .section-strip .pattern-1 { background-image:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/bg-pattern_1.png); } body div#devskin11707339 .section-strip .pattern-2 { background-image:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/bg-pattern_2.png); } body div#devskin11707339 .section-strip .pattern-3 { background-image:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/bg-pattern_3.png); } body div#devskin11707339 .section-strip .pattern-4 { background-image:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/bg-pattern_4.png); } body div#devskin11707339 .section-strip + .strip { padding-bottom:60px; } body div#devskin11707339 .logo-details a.button { position:relative; margin:-11px 0 30px; right:0; float:right; line-height:0; } body div#devskin11707339 img.blur { position:absolute!important; vertical-align:bottom; display:inline-block; width:100%; top:0; right:0; bottom:0; left:0; margin:0; padding:0; opacity:0; filter:alpha(opacity=0); _zoom:1; transform:scale(1.10); -moz-transform:scale(1.10); -webkit-transform:scale(1.10); -ms-transform:scale(1.10); -o-transform:scale(1.10); transition:all 0.15s ease-in-out; -moz-transition:all 0.15s ease-in-out; -webkit-transition:all 0.15s ease-in-out; -ms-transition:all 0.15s ease-in-out; -o-transition:all 0.15s ease-in-out; } body div#devskin11707339 img.blur:hover { opacity:1; filter:alpha(opacity=100); _zoom:1; transform:scale(1); -moz-transform:scale(1); -webkit-transform:scale(1); -ms-transform:scale(1); -o-transform:scale(1); } /* ------------------------------------------------------- -10 ------------------------------------------------------- */ body div#devskin11707339 .img-10 { background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/img-10.jpg) 50% 0/cover no-repeat fixed; padding:760px 0 0; position:relative; z-index:1; } body div#devskin11707339 .img-10 .overlay { padding:40px 0 50px; } body div#devskin11707339 .img-10 .title { margin-bottom:30px; } body div#devskin11707339 .img-10 p { margin-bottom:0; } body div#devskin11707339 .img-10 .credit { position:absolute; bottom:0; right:10%; } body div#devskin11707339 img[src*='img-11.jpg'] { margin:60px 0 130px; } body div#devskin11707339 img.title[src*='title-app.svg'] { margin:0 0 130px; } /* ------------------------------------------------------- -12 ------------------------------------------------------- */ body div#devskin11707339 .img-12 { background:#b0b6b6 url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/img-12-fixed.jpg) 0% 50%/cover no-repeat fixed; padding:130px 0; position:relative; z-index:1; } body div#devskin11707339 .img-12 .wrap { max-width:1500px; } body div#devskin11707339 .img-12::after { content:''; position:absolute; top:0; right:0; bottom:0; left:0; background:rgba(0,0,0,0); background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(31,34,36,0.3) 50%,rgba(0,0,0,0) 100%); background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(31,34,36,0.3) 50%,rgba(0,0,0,0) 100%); background:linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(31,34,36,0.3) 50%,rgba(0,0,0,0) 100%); z-index:-1; } body div#devskin11707339 img[src*='title-worlds_largest.svg'] { margin-bottom:60px; } body div#devskin11707339 img[src*='title-get_it_now.svg'] { margin-top:10px; } body div#devskin11707339 img[src*='img-13.png'] { margin-bottom:80px; } body div#devskin11707339 .img-12 .mobile-app { vertical-align:middle; text-align:left; } body div#devskin11707339 .img-12 img.title { vertical-align:middle; } body div#devskin11707339 .img-12 a.button { position:relative; display:inline-block; margin:0 12px; } /* ------------------------------------------------------- FELLA ------------------------------------------------------- */ body div#devskin11707339 .bg-fella { background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/bg-fella_gradient.jpg) 50% 50%/cover no-repeat; padding:0 0 200px; position:relative; color:#000; } body div#devskin11707339 .bg-fella img[src*='img-fella.png'] { margin-top:75px; } body div#devskin11707339 .bg-fella .sub { border-color:#575756; } /* ------------------------------------------------------- -14 ------------------------------------------------------- */ body div#devskin11707339 .img-14 { background:#1f2224 url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/img-14.jpg) 50% 100%/cover no-repeat fixed; padding:760px 0 0; margin-top:65px; position:relative; z-index:1; } body div#devskin11707339 .img-14 .overlay { padding:40px 0 60px; } body div#devskin11707339 .img-14 .title { margin-bottom:30px; } body div#devskin11707339 .img-14 p { margin-bottom:0; } body div#devskin11707339 .img-14 .credit { position:absolute; bottom:0; right:10%; } body div#devskin11707339 img[src*='img-15.jpg'] { margin:65px 0; } body div#devskin11707339 img[src*='img-16.jpg'] { margin:0 0 30px; } body div#devskin11707339 img[src*='title-partnered.svg'] { margin:105px 0 130px; } body div#devskin11707339 img[src*='img-18.jpg'], body div#devskin11707339 img[src*='img-19.jpg'], body div#devskin11707339 img[src*='img-21.jpg'] { margin:0 0 30px; } body div#devskin11707339 img[src*='img-20.jpg'], body div#devskin11707339 img[src*='img-12.jpg'] { margin:0 0 60px; } /* ------------------------------------------------------- STRIP ------------------------------------------------------- */ body div#devskin11707339 .strip { background:#000 url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/bg-pattern_5_mobile.png) 0 0 repeat fixed; position:relative; padding:30px 0; z-index:1; } body div#devskin11707339 .strip::after { left:inherit; right:-125px; width:160px; } body div#devskin11707339 .strip img.title { margin:0; } body div#devskin11707339 .strip.color-pallet { background-attachment:fixed; margin:30px 0; padding:0 2%; } body div#devskin11707339 .strip.green { background-attachment:fixed; height:130px; padding:0; } body div#devskin11707339 .strip.color-pallet .full-set { display:none; } body div#devskin11707339 .strip.green i { background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/bg-green_stripe.svg?3) 50% 50%/150% auto no-repeat fixed; position:absolute; top:0; right:0; bottom:0; left:0; } body div#devskin11707339 .strip i::after { left:inherit; right:-125px; } body div#devskin11707339 .dark-bg.end { padding-bottom:40px; } body div#devskin11707339 .strip.end { padding:70px 0; text-align:center; } body div#devskin11707339 .strip.end img { width:25%; display:block; margin:auto; } /* ------------------------------------------------------- BOTTOM ------------------------------------------------------- */ body div#devskin11707339 .gr-body .bottom { display:none; background:transparent; border-left:1px solid transparent; margin:0; padding:0 0 0 15px; text-align:center; position:absolute; z-index:2; width:50%; right:0; height:20px; line-height:20px; bottom:60px; text-align:left; padding:0 0 0 15px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; } body div#devskin11707339 .bottom a.commentslink { font-family:'Alegreya Sans'; color:#E6DAAB; opacity:0.75; filter:alpha(opacity=75); _zoom:1; font-size:12px; font-weight:400; letter-spacing:1px; display:inline-block; text-decoration:none; position:relative; padding:0; margin:0; transition:all 0.20s ease-in-out; -moz-transition:all 0.20s ease-in-out; -webkit-transition:all 0.20s ease-in-out; -ms-transition:all 0.20s ease-in-out; -o-transition:all 0.20s ease-in-out; } body div#devskin11707339 .bottom a.commentslink:hover { color:#ffcb72; } body div#devskin11707339 .gr-body .bottom .prevlink { display:none; } /* ------------------------------------------------------- MISC ------------------------------------------------------- */ body div#devskin11707339 .links { position:absolute; top:0; right:0; left:0; padding:15px 30px; line-height:0; background:rgb(0, 0, 0); background:rgba(0,0,0,0.30); box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; text-align:right; z-index:3; } body div#devskin11707339 .links .title { float:left; position:relative; top:4px; height:12px; } body div#devskin11707339 .links .title img { height:100%; width:auto; } body div#devskin11707339 .links a, body div#devskin11707339 .social { display:inline-block; font-weight:400; font:bold 11px/18px Arial, Calibre, Sans-Serif; text-transform:uppercase; text-decoration:none; color:#fff; } body div#devskin11707339 .links > span { font-weight:100; font-size:12px; display:inline-block; line-height:20px; margin:0 20px; opacity:0; filter:alpha(opacity=0); _zoom:1; } body div#devskin11707339 .links a:hover, body div#devskin11707339 .links .social:hover { color:#40CfC7; text-decoration:none; } body div#devskin11707339 .social { position:relative; transition:all 0.2s ease-in-out; -moz-transition:all 0.2s ease-in-out; -webkit-transition:all 0.2s ease-in-out; -ms-transition:all 0.2s ease-in-out; -o-transition:all 0.2s ease-in-out; } body div#devskin11707339 .social::before { content:''; position:absolute; left:-22px; top:1px; width:16px; height:16px; background:url(https://www.da-files.com/artnetwork/default/icon_share-white.svg) 0 0 no-repeat; opacity:1; filter:alpha(opacity=100); _zoom:1; background-size:auto 16px; cursor:default; } body div#devskin11707339 .social .widgets { position:absolute; left:0; top:3em; width:100px; background:#181A1B; padding:5px; border:1px solid #181A1B; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; opacity:0; filter:alpha(opacity=0); _zoom:1; transform:scale(0.9) translate(-50%,0); -moz-transform:scale(0.9) translate(-50%,0); -webkit-transform:scale(0.9) translate(-50%,0); -ms-transform:scale(0.9) translate(-50%,0); -o-transform:scale(0.9) translate(-50%,0); transition:all 0.2s ease-in-out 3s; -moz-transition:all 0.2s ease-in-out 3s; -webkit-transition:all 0.2s ease-in-out 3s; -ms-transition:all 0.2s ease-in-out 3s; -o-transition:all 0.2s ease-in-out 3s; } body div#devskin11707339 .social .widgets::before { content:''; position:absolute; top:-20px; left:50%; margin-left:-10px; border-width:10px; border-style:solid; border-color:transparent transparent #181A1B transparent; width:0; height:0; } body div#devskin11707339 .social:hover .widgets { top:3.1em; transform:scale(1) translate(-50%,0); -moz-transform:scale(1) translate(-50%,0); -webkit-transform:scale(1) translate(-50%,0); -ms-transform:scale(1) translate(-50%,0); -o-transform:scale(1) translate(-50%,0); transition:all 0.2s ease-in-out; -moz-transition:all 0.2s ease-in-out; -webkit-transition:all 0.2s ease-in-out; -ms-transition:all 0.2s ease-in-out; -o-transition:all 0.2s ease-in-out; opacity:1; filter:alpha(opacity=100); _zoom:1; } body div#devskin11707339 .social div[class*='social'] { width:100px; letter-spacing:normal; margin-bottom:3px; vertical-align:baseline; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; padding:6px; height:34px; } body div#devskin11707339 .social-twitter { margin-top:1px!important; } body div#devskin11707339 .social-fb { margin-left:-3px!important; } body div#devskin11707339 .social-gp { margin-bottom:0!important; } body div#devskin11707339 span.ogpreview { display:none; } body div#devskin11707339 .title.hide, body div#devskin11707339 a.button.hide { display:none; } body div#devskin11707339 .gr-body { overflow:hidden; } body div#devskin11707339 i.gr1, body div#devskin11707339 i.gr1 i, body div#devskin11707339 i.gr2, body div#devskin11707339 i.gr2 i, body div#devskin11707339 i.gr3, body div#devskin11707339 .gr-top { display:none; } body div#devskin11707339 .gr-body { background:transparent; border:0!important; position:static; overflow:visible; } body div#devskin11707339 .gr-body .grf-indent { background:transparent; margin:auto; text-align:center; padding:0; } body div#devskin11707339 .gr-body .gr { border:0!important; position:static; background:none; } body div#devskin11707339 a.external::after { font-style:normal; display:none; } body div#devskin11707339 span[class*='user'] a { display:inline!important; white-space:normal; color:inherit; } body div#devskin11707339 span[class*='user'] *:hover { color:inherit; } body div#devskin11707339 span.user-symbol { font-size:.6em!important; } body div#devskin11707339 .text { padding:0; position:relative; text-align:left; } body div#devskin11707339 .text br { display:none; } body div#devskin11707339 .text a { font-weight:normal; } body div#devskin11707339 .list { height:0; width:0; clear:both; visibility:hidden; } @media only screen and (max-width: 767px) { body div#devskin11707339 .gr-box { font-size:16px; line-height:24px; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 .text .wrap { padding:0 15px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .text .wrap { width:auto; padding:0 10%; max-width:420px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .text .wrap div[class*='col'] { width:100%; float:none; height:auto; display:block; padding:0%; margin-left:0; margin-right:0; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .before_1, body div#devskin11707339 .before_2, body div#devskin11707339 .before_3, body div#devskin11707339 .before_4, body div#devskin11707339 .before_5, body div#devskin11707339 .before_6, body div#devskin11707339 .before_7, body div#devskin11707339 .before_8, body div#devskin11707339 .before_9, body div#devskin11707339 .before_10, body div#devskin11707339 .before_11, body div#devskin11707339 .after_1, body div#devskin11707339 .after_2, body div#devskin11707339 .after_3, body div#devskin11707339 .after_4, body div#devskin11707339 .after_5, body div#devskin11707339 .after_6, body div#devskin11707339 .after_7, body div#devskin11707339 .after_8, body div#devskin11707339 .after_9, body div#devskin11707339 .after_10, body div#devskin11707339 .after_11 { padding:0; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .push_1, body div#devskin11707339 .push_2, body div#devskin11707339 .push_3, body div#devskin11707339 .push_4, body div#devskin11707339 .push_5, body div#devskin11707339 .push_6 .push_7, body div#devskin11707339 .push_8, body div#devskin11707339 .push_9, body div#devskin11707339 .push_10, body div#devskin11707339 .push_11, body div#devskin11707339 .pull_1, body div#devskin11707339 .pull_2, body div#devskin11707339 .pull_3, body div#devskin11707339 .pull_4, body div#devskin11707339 .pull_5, body div#devskin11707339 .pull_6, body div#devskin11707339 .pull_7, body div#devskin11707339 .pull_8, body div#devskin11707339 .pull_9, body div#devskin11707339 .pull_10, body div#devskin11707339 .pull_11 { left:0; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .wrap .wrap { padding:0!important; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .image { padding:0; margin:0; top:0; right:0; bottom:0; left:0; max-width:100%; width:100%; float:none; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .sub { margin:40px 0 40px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .background { display:block; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .overlay { position:relative; padding:0!important; background:none!important; z-index:99; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .static { position:static!important; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 .static { position:static!important; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .credit { text-align:right; font-size:11px; line-height:12px; color:#fff; position:absolute; top:25px; right:8%; z-index:99; opacity:0.75; filter:alpha(opacity=75); _zoom:1; transition:all 0.15s ease-in-out; -moz-transition:all 0.15s ease-in-out; -webkit-transition:all 0.15s ease-in-out; -ms-transition:all 0.15s ease-in-out; -o-transition:all 0.15s ease-in-out; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 .credit { text-align:right; font-size:11px; line-height:12px; color:#fff; position:absolute; top:25px; right:8%; z-index:99; opacity:0.75; filter:alpha(opacity=75); _zoom:1; transition:all 0.15s ease-in-out; -moz-transition:all 0.15s ease-in-out; -webkit-transition:all 0.15s ease-in-out; -ms-transition:all 0.15s ease-in-out; -o-transition:all 0.15s ease-in-out; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .credit:hover { opacity:1; filter:alpha(opacity=100); _zoom:1; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .credit span[class*='user'] a:hover { color:#fff!important; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .section-strip span, body div#devskin11707339 .strip, body div#devskin11707339 div, body div#devskin11707339 ::before, body div#devskin11707339 ::after { background-attachment:scroll!important; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .hide { display:none; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 .text div { background-attachment:scroll!important; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 .text span { background-attachment:scroll!important; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 p.large { font-size:26px; line-height:32px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 p.large { font-size:16px; line-height:24px; } } /* ----------- BOLDY FACING THE FUTURE ----------- */ @media only screen and (max-width: 767px) { body div#devskin11707339 .img-01 { background:#1f2224; position:relative; padding:0 0 25px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-01 .background { height:400px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-01 .background img { top:-50px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-01 img.title.boldy { margin:-70px 0 20px 0; width:300px; height:auto; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-01 h2 { font-size:24px; line-height:26px; margin-bottom:15px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-01 img.title.future { margin:15px 0; max-width:100%; height:auto; } } /* ----------- STRIP ----------- */ @media only screen and (max-width: 767px) { body div#devskin11707339 .strip { min-height:92px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; background:url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/bg-pattern_5_mobile.png?1) 0 0 repeat; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip img.title { margin:0; max-height:32px; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 .strip { background:#000 url(https://www.da-files.com/artnetwork/new-da/boldy-facing-the-future/bg-pattern_5_mobile.png) 0 0 repeat scroll; } } /* ----------- BLEED BREED ART ----------- */ @media only screen and (max-width: 767px) { body div#devskin11707339 .img-02 { padding:0 0 25px; background:#1f2224; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-02 .background { height:360px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-02 img.title.bba { margin:-140px 0 30px; height:auto; width:290px; } } /* ----------- VALUES ----------- */ @media only screen and (max-width: 1023px) { body div#devskin11707339 .values div[class*='img'] { padding:25% 0 0; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 .values div[class*='img']::before, body div#devskin11707339 .values div[class*='img']::after { display:none; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 .values .overlay { display:block; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .values .background { z-index:-1; height:260px; position:relative; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .values div[class*='img'] { background:none; padding:0; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .values div[class*='img']::after, body div#devskin11707339 .values div[class*='img']::before { display:none; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .values img { display:block; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .values img[src*='title'] { height:26px; margin:15px 0 15px; position:relative; width:auto; max-width:none; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .values p { display:block; } } /* ----------- DEVIATED A ----------- */ @media only screen and (max-width: 767px) { body div#devskin11707339 .img-07 { background:#1f2224; position:relative; padding:0 0 25px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-07::after { display:none; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-07 .background { height:250px; z-index:1; overflow:hidden; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-07 .background::after { content:''; position:absolute; top:0; right:0; bottom:0; left:0; background:rgb(31, 34, 36); background: -webkit-linear-gradient(0deg, rgba(31, 34, 36, 0.7) 0, rgba(0, 0, 0, 0) 150%); background: -moz-linear-gradient(0deg, rgba(31, 34, 36, 0.7) 0, rgba(0, 0, 0, 0) 150%); background:linear-gradient(0deg, rgba(31, 34, 36, 0.7) 0, rgba(0, 0, 0, 0) 150%); z-index:0; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-07 .deviated-a { width:90px; margin:-50px auto 30px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-07 .credit { color:#fff; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 .img-07 .credit { color:#fff; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-07 p { margin-bottom:24px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-07 h3 { max-width:360px; font-size:24px; line-height:26px; margin-bottom:15px; } } /* ----------- HOW IT ALL WORKS ----------- */ @media only screen and (max-width: 767px) { body div#devskin11707339 .img-08 { padding:0; background:none; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-08 .background { height:300px; margin:0; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-08 .background img { position:absolute!important; bottom:0; opacity:0.9; filter:alpha(opacity=90); _zoom:1; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-08 .title { margin:25px 0 15px; width:320px; } } /* ----------- LOGO DETAILS ----------- */ @media only screen and (max-width: 767px) { body div#devskin11707339 .logo-details img[src*='img-logo_lines.svg'] { margin:0px 0 30px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .logo-details img[src*='title-bleed_green.svg'] { height:77px; float:left; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .logo-details .strip.green { margin:30px 0 0px; height:28px; min-height:0; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.green i { background:#05CC47; transform:skew(-28deg); -moz-transform:skew(-28deg); -webkit-transform:skew(-28deg); -ms-transform:skew(-28deg); -o-transform:skew(-28deg); margin:0 8%; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .bg-deviated_a { padding:0; background:#fff; } } /* ----------- COLOR PALLET ----------- */ @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet { margin-bottom:0; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet img { display:none; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .full-set { display:block; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color { margin:0 2%; padding:10px 8%; color:#fff; font-size:12px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; transform:skew(-28deg); -moz-transform:skew(-28deg); -webkit-transform:skew(-28deg); -ms-transform:skew(-28deg); -o-transform:skew(-28deg); display:block; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .full-set > div { padding:40px 8%; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .full-set h3 { margin-bottom:15px; font-size:16px; line-height:24px; text-transform:uppercase; border-bottom:1px solid #7D7F7F; padding-bottom:5px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-000000 { background:#000000; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-181A1B { background:#181A1B; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-4F5254 { background:#4F5254; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-7D8080 { background:#7D8080; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-F2F2F2 { background:#F2F2F2; color:#000; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-FFFFFF { background:#FFFFFF; color:#000; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-05CC47 { background:#05CC47; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-1F3833 { background:#1F3833; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-34807A { background:#34807A; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-40CfC7 { background:#40CfC7; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-D4F5F2 { background:#D4F5F2; color:#000; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-1F3626 { background:#1F3626; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-42794F { background:#42794F; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-4DC47D { background:#4DC47D; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-D4F5DE { background:#D4F5DE; color:#000; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color.c-F7590A { background:#F7590A; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.color-pallet .color span { display:block; transform:skew(28deg); -moz-transform:skew(28deg); -webkit-transform:skew(28deg); -ms-transform:skew(28deg); -o-transform:skew(28deg); } } /* ----------- TYPOGRAPHY ----------- */ @media only screen and (max-width: 767px) { body div#devskin11707339 div.typography-row { margin-top:0; } } @media only screen and (max-width: 767px) { body div#devskin11707339 div.typography-row div.col_4, body div#devskin11707339 div.typography-row div.col_3 { float:left!important; width:50%!important; text-align:center; margin-bottom:30px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 div.typography-row div.col_4 img { max-height:310px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 div.typography-row div.col_3 img { max-height:300px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 div.typography-row img { margin-top:0; } } @media only screen and (max-width: 767px) { body div#devskin11707339 div.typography-row div.col_5 { float:none; text-align:center; clear:both; width:100%; } } @media only screen and (max-width: 767px) { body div#devskin11707339 img[src*='title-nurture_your_creative_nature.svg'] { margin-bottom:30px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 div.typography-row .img-09 { position:relative; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 div.typography-row .img-09 .credit { margin-top:10px; position:relative; text-align:right; top:0; right:0; } } @media only screen and (max-width: 767px) { body div#devskin11707339 div.typography-row .img-09 .credit { margin:0; text-align:right; top:initial; right:15px; bottom:40px; } } /* ----------- DOWNLOAD ----------- */ @media only screen and (max-width: 767px) { body div#devskin11707339 .logo-details .strip.download { display:none; } } /* ----------- FELLA ----------- */ @media only screen and (max-width: 767px) { body div#devskin11707339 .bg-fella { padding:0 0 60px; background:none; overflow:hidden; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .bg-fella .background { position:absolute; top:0; left:0; right:0; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .bg-fella .background img { width:auto; height:100%; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .bg-fella img[src*='img-fella.png'] { margin:0; padding:0; width:80%; margin:auto; display:block; } } /* ----------- MOBILE ----------- */ @media only screen and (max-width: 767px) { body div#devskin11707339 .img-10 { padding:0; background:none; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-10 .background { top:0; height:300px; margin:0; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-10 .title[src*='mobile'] { margin:25px 0 15px; width:124px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 img[src*='img-11.jpg'] { margin:30px 0 130px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-10 img[src*='img-11.jpg'] { margin:30px 0; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 img.title[src*='title-app.svg'] { margin:0 auto 130px; max-width:80%; display:block; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-10 img.title[src*='title-app.svg'] { margin:0 auto 30px; max-width:100%; } } /* ----------- TIGER MOBILE APP ----------- */ @media only screen and (max-width: 767px) { body div#devskin11707339 .img-12 { background:#1f2224; padding:0; position:relative; z-index:1; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-12 .background { height:260px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-12 .background img { opacity:0.9; filter:alpha(opacity=90); _zoom:1; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 .img-12 img[src*='title-worlds_largest.svg'] { margin-bottom:90px; max-width:60%; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-12 img[src*='title-worlds_largest.svg'] { margin:-50px 0 30px; width:240px; max-width:none; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-12 img[src*='img-13.png'] { margin-bottom:20px; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 img[src*='img-13.png'] { margin-bottom:80px; max-width:70%; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-12 img[src*='available-dec-10.svg'] { margin:10px 0 30px 0; width:70%; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-12 img[src*='title-get_it_now.svg'] { margin:10px 0 30px 0; height:20px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-12 .mobile-app a.button { position:relative; margin:0; float:left; width:50%; text-align:center; display:none!important; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-12 .mobile-app a img { width:auto; height:40px; display:inline-block; } } @media only screen and (max-width: 767px) { body div#devskin11707339 iframe { height:240px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-12 .image { text-align:left; } } /* ----------- BEHIND THE SCENES ----------- */ @media only screen and (max-width: 767px) { body div#devskin11707339 .img-14 { padding:0; background:none; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-14 .background { height:260px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .img-14 .title[src*='behind_the_scenes'] { margin:15px 0 15px; width:390px; } } /* ----------- LAST ----------- */ @media only screen and (max-width: 767px) { body div#devskin11707339 img[src*='img-15.jpg'] { margin:30px 0; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 img[src*='img-15.jpg'] { margin:30px 0; } } @media only screen and (max-width: 1023px) { body div#devskin11707339 img[src*='title-partnered.svg'] { margin:60px auto 90px; max-width:80%; display:block; } } @media only screen and (max-width: 767px) { body div#devskin11707339 img[src*='title-partnered.svg'] { margin:30px auto 30px; max-width:100%; } } @media only screen and (max-width: 767px) { body div#devskin11707339 img.logo-mb { position:relative!important; bottom:25px; left:69%; width:21%; } } @media only screen and (max-width: 767px) { body div#devskin11707339 img[src*='img-20.jpg'], body div#devskin11707339 img[src*='img-22.jpg'] { margin:0 0 30px; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.end { padding:30px 0; text-align:center; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .strip.end img { width:55%; display:block; margin:auto; } } @media only screen and (max-width: 767px) { body div#devskin11707339 .dark-bg.end { padding-bottom:0; } }






DeviantArt Timeline
|


Share



fav.me/d88nx5f','counturl':'ht… . Many of you have been in this community for a long time, but whether you’ve just joined or you’ve been a member since day one, this is your first impression of the new DeviantArt.','via':'DeviantArt'}">




spyed.deviantart.com/journal/B… }">















Artist Credit DanielaUhlig






Welcome.





Many of you have been in this community for a long time, but whether you’ve just joined or you’ve been a member since day one, this is your first impression of the new DeviantArt.


Change is not something that we take lightly, because it affects our collective identity. It was important for us to define who we are and what we’re made of at our core before we changed anything. We all have our own understanding of what that means, but the process of getting that core story down on paper took almost a year.


The result is “Bleed and Breed Art.” This is our center of gravity and our reason for getting out of bed in the morning.




It is the guide and the justification for everything, including our business partnerships, the development of the new app and the design of our new identity. Anything and everything we create is in service of our innate calling to Bleed and Breed Art.


This is who we are at our essence. When I say “we,” I mean you, too. We are not a company or a brand or a website—we are a community united in our love and support of art and artists. Our new look is not designed to compete or keep up with other companies, brands or websites—it’s designed to tell our story and showcase our art and artists in the best possible way. We are DeviantArt.







— Angelo (spyed ), CEO






















We are where art starts, but that is only the beginning. We are a community for the creative in everyone to develop and heighten their personal sense of taste, but that’s not where it ends. We are the movement for the liberation of creative expression.


We believe that art is for everyone, and we’re creating the cultural context for how it is created, discovered and shared.


Artists love us because we are an inclusive and supportive community. We help them find their identity through self-expression. We provide the tools, resources and exposure to enable them to become better, more successful artists. We inspire people to create art by feeding their creativity.


We provide endless entertainment and inspiration. This is where you see it first. This is where whatever you’re into, no matter how niche, is embraced and expressed by a dedicated community of likeminded creatives. This is where the global undercurrent of creativity feeds the future of popular culture.


There’s no other place like DeviantArt. We are an unapologetically addictive experience. Our world is a prolific orgy of originality where creatives enjoy freedom of artistic expression. We are the deviation of creativity that shatters the confines of expectation. We can’t help it—it runs through our veins and compels us to nurture it in others. This is DeviantArt.







Artist Credit
Mark-Chadwick


















Artist CreditBenHeine





We are an unapologetically rebellious community of unconventional creatives. Never restricted by convention, we create the genres and sub genres that push the edge of the art world’s boundaries. We have a fearless confidence that comes with being the established alternative for millions of badass deviant artists. You will know us when you see us, because we’re like nothing you’ve ever seen.











Artist Creditalexcherrypicks





We’re an addictive force of creativity. Always fun, entertaining and effortlessly captivating, we’re a mesmerizing visual experience. If being the source of the digital art world’s most prolific creativity is cool, we’re destined to be iconic. There’s a reason why our vast community keeps growing: once you get a taste, you’re hooked for life.











Artist Creditwlop





We are open to the creative in everyone. Our community is a family of visual communicators born with an innate appreciation for art. It is in the blood running through our collective veins. We are more than a collaborative creative environment, we are a safe, trustworthy place for the intimate act of bonding over art from the heart.











Artist Creditigreeny





We develop ingenious ways for the world to create and discover art. Our energy and knowledge comes from years of facilitating the vibrant creativity of our community. We put every ounce of our intellectual curiosity into developing an evolving environment that stimulates and inspires our artists to push the limits of their talents.

























Our new logo is symbolic of everything we believe. It is an audacious and inspired evolution of our original dA mark—literally turning the art world upside down. We love it because, like DA, people might not get it right away and, like all great art, it challenges perceptions and perspectives. Most importantly, it elevates DeviantArt and our artists.


WE TURN THE ART WORLD UPSIDE DOWN AND BACKWARDS.






Artist credit
Senzune






Artist Credit alexcherrypicks












You, the artist and the art enthusiast, are what truly define us, so you should have as much ownership over our identity as we do. Here you’ll find all of the elements of our new visual identity with high-level direction on how they should be used.



Artist Credit
alexcherrypicks
















The construction of our brand mark is a combination of our symbol and a completely customized wordmark, all of which use the angle of 62 degrees to cut the letter forms.



























These are the five preferred lockups of our logo and wordmark.




















There is no question that DeviantArt is green. Like art, it is in our blood. We considered every shade of green imaginable before deciding unanimously on the bold, vibrant “DeviantArt Green” you see now. Most importantly, we’ve defined a system for using it selectively rather than pervasively.





















As well as DeviantArt Green, we’ve established a neutral color palette of greys chosen specifically for their qualities to showcase art. Now, DA is represented in DeviantArt Green and our art can represent itself in the best light.










Core Gray Scale

#000000


#181A1B


#4F5254


#7D8080


#F2F2F2


#FFFFFF




DA Green

#05CC47




Secondary Color

#1F3833


#34807A


#40CfC7


#D4F5F2


#1F3626


#42794F


#4DC47D


#D4F5DE




UI Orange

#F7590A














Our typeface is called Calibre (not Calibri) by a type foundry called Klim. We use caps whenever possible and give it a custom treatment by cutting off the first and last letters of words and/or sentences with the diagonal angle of our logo.






















Artist Credit
michalivan














Another great thing about our symbol is that it can tessellate to form a beautiful pattern. It is particularly powerful because, when the symbol tessellates, it allows the two “A”s to become more clear.



























Our identity is as much yours as it is ours, so we wanted you to have all of the pieces to bring it to life in your own ways. Download, share and create as you see fit.

















If you haven’t met Fella, he’s our mascot, and he’s not going anywhere. Fella’s look has changed over the years, and those changes have always been made by the community. That’s not going to change. He is yours and yours alone. Here he is with the new logo.













Artist Creditjasinski












The new mobile app was a long time coming, and it is truly amazing. Art has never looked better on a mobile device. This is not a mobile version of our website—it’s a revolutionary new way to access the entire community, submit and browse art and experience DeviantArt on the go from your mobile device.



Artist Credit
jasinski

























































Artist CreditAymen-Ouertani







Artist CreditDosshaus












Taking a deep dive into introspection required the guidance and perspective of a trusted partner. We chose to work with Moving Brands, who we consider to be the greatest independent creative company in the world. Check out their work for yourself at MovingBrands.com.



Artist Credit
Dosshaus
















We spent months together, at one point even locking ourselves in repurposed warehouse space in downtown LA for an intensive 12 hour workshop. Every voice was heard. Everything was put on the table. We were exposed—stripped back to our essence and forced to reconcile our past with our future.


Tough questions were asked and answered. What does it mean to be a deviant? What is the nature of art and of artists? What are the universal truths about DA? Who are we, really?


Design sensibilities were explored exhaustively. Colors, textures, patterns and typefaces were examined and discussed extensively.


Moving Brands are pros, and their guidance was invaluable in filtering through the myriad of insights, impressions and opinions to find the common threads. It’s how we got to “Bleed and Breed Art,” which informed everything else from logo and color choices to the layout of the website and the functionality of our amazing new app.













































Bleed and Breed Art is more than a tagline. We’re using it to guide all of our decisions. In other words, before we add a feature or design an app or make a business partnership, the question, “will this Bleed and Breed Art?” is the first thing we ask of ourselves. If the answer is anything but an emphatic “yes,” we go back to the drawing board.


In many ways, “Bleed and Breed Art” is the most important piece that came out of this journey. It has always been true and will always be true.




There will be more changes and new additions in the future as we continue to grow. Some may have obvious benefits, while the reasoning behind others may not be so immediately apparent. Whatever the case may be, know that the motivation behind everything we do will always be to Bleed and Breed Art—for our 32 million registered members, for the new artists and art lovers of the future, and for the world.











Related content
Comments: 23902

seasidehill [2024-01-07 09:09:24 +0000 UTC]

👍: 0 ⏩: 0

emmawow12 [2023-10-22 02:06:39 +0000 UTC]

👍: 0 ⏩: 0

BOTOFan [2023-08-16 20:41:19 +0000 UTC]

👍: 0 ⏩: 0

NerdyBoy1803 [2023-08-10 00:35:03 +0000 UTC]

👍: 1 ⏩: 0

deddett [2023-08-07 16:52:08 +0000 UTC]

👍: 3 ⏩: 1

spyed In reply to deddett [2023-08-09 10:30:04 +0000 UTC]

👍: 3 ⏩: 1

deddett In reply to spyed [2023-08-10 00:53:44 +0000 UTC]

👍: 1 ⏩: 0

stupidbear190 [2023-03-26 16:44:31 +0000 UTC]

👍: 0 ⏩: 0

QueenPhantom11 [2023-03-23 20:13:40 +0000 UTC]

👍: 1 ⏩: 0

HankthePrank [2023-02-05 07:57:27 +0000 UTC]

👍: 0 ⏩: 0

mk568 [2022-11-14 20:53:42 +0000 UTC]

👍: 0 ⏩: 0

domiartist2008 [2022-07-19 13:52:29 +0000 UTC]

👍: 0 ⏩: 0

HyTruong [2022-05-17 03:45:33 +0000 UTC]

👍: 0 ⏩: 0

Sharletlyn [2022-04-11 22:10:55 +0000 UTC]

👍: 0 ⏩: 0

PKMNTrainerRick [2022-01-21 06:17:42 +0000 UTC]

👍: 0 ⏩: 0

NileyMapa [2022-01-16 07:23:09 +0000 UTC]

👍: 0 ⏩: 0

NileyMapa [2021-12-26 15:53:25 +0000 UTC]

👍: 0 ⏩: 0

NileyMapa [2021-12-26 15:35:50 +0000 UTC]

👍: 0 ⏩: 0

RedRoadu [2021-11-20 04:42:11 +0000 UTC]

👍: 1 ⏩: 0

iiKittyCream [2021-10-20 10:28:53 +0000 UTC]

👍: 0 ⏩: 0

AmathistRime [2021-09-21 19:53:47 +0000 UTC]

👍: 0 ⏩: 0

DarkKent0 [2021-09-06 06:28:19 +0000 UTC]

👍: 1 ⏩: 0

Cherrycatz-0w0 [2021-09-05 19:22:05 +0000 UTC]

👍: 1 ⏩: 0

OliviaandOlly [2021-08-31 23:57:25 +0000 UTC]

👍: 0 ⏩: 0

elfebrianto [2021-08-28 04:50:33 +0000 UTC]

👍: 0 ⏩: 0

SarahSuresh [2021-08-23 04:36:19 +0000 UTC]

👍: 0 ⏩: 0

h0llip0lliy0zza [2021-08-09 14:40:45 +0000 UTC]

👍: 0 ⏩: 0

babagoat [2021-07-18 09:17:44 +0000 UTC]

👍: 0 ⏩: 0

YuGiohTam [2021-07-07 18:58:40 +0000 UTC]

👍: 0 ⏩: 0

EndouArata-2019 [2021-06-18 04:32:38 +0000 UTC]

👍: 0 ⏩: 0

honeyymxlk [2021-05-03 15:06:02 +0000 UTC]

👍: 0 ⏩: 0

honeyymxlk [2021-05-03 15:04:44 +0000 UTC]

👍: 0 ⏩: 0

Reececup11 [2021-03-26 20:53:26 +0000 UTC]

👍: 0 ⏩: 0

h0llip0lliy0zza [2021-02-23 04:03:43 +0000 UTC]

👍: 0 ⏩: 0

Ladypunkkittyx16 [2021-02-09 07:59:16 +0000 UTC]

👍: 0 ⏩: 0

RalkCell [2020-11-13 14:00:05 +0000 UTC]

👍: 0 ⏩: 0

MicromirOfTheNorth [2020-09-02 11:07:00 +0000 UTC]

👍: 0 ⏩: 0

Lady-Pixel [2020-06-18 02:32:43 +0000 UTC]

👍: 0 ⏩: 0

Emerald-Wolf13 [2020-06-12 14:21:04 +0000 UTC]

👍: 3 ⏩: 0

SONSIEmagazine [2020-06-12 01:15:06 +0000 UTC]

👍: 4 ⏩: 1

Wolfluver02 In reply to SONSIEmagazine [2020-07-29 16:53:50 +0000 UTC]

👍: 0 ⏩: 0

KRPH-TV10 [2020-05-19 15:59:06 +0000 UTC]

Forever

👍: 0 ⏩: 0

WandaBaby1990 [2020-05-15 02:59:43 +0000 UTC]

I've seen it!   

👍: 0 ⏩: 0

WaterKirby1994 [2020-05-13 21:27:47 +0000 UTC]

Eclipse is awful & we only have a week left to enjoy Art the way we have been for several years. The zoom feature gets messed up by Eclipse, & we won't be able to learn the date something was submitted by hovering over the images that appear in the More from, Featured in Collections, & More from DeviantArt with Eclipse.

👍: 0 ⏩: 0

Ari-Nova [2020-05-12 03:12:49 +0000 UTC]

I've seen it   

👍: 0 ⏩: 0

Twitchybloke [2020-05-08 07:27:49 +0000 UTC]

👍: 0 ⏩: 0

Davinci975 [2020-05-05 23:20:23 +0000 UTC]

No one likes eclipse

👍: 3 ⏩: 0

Azazellon [2020-05-04 15:02:20 +0000 UTC]

lmao idk if it's the design or what but did they really just make me scroll down several images before getting to read more. That's terrible design.

👍: 0 ⏩: 0

DaughterofSachmet [2020-04-27 07:19:38 +0000 UTC]

👍: 0 ⏩: 0

OsamI-Rut0Art [2020-04-27 01:17:14 +0000 UTC]

I've seen it   

👍: 0 ⏩: 0


| Next =>