SALT-NLP/Design2Code
This dataset consists of 484 webpages from the C4 validation set, serving the purpose of testing multimodal LLMs on converting visual designs into code implementations. Each example is a pair of source HTML and screenshot ({id}.html and {id}.png). See the dataset in the huggingface format here. Note that all images in these webpages are replaced by a placeholder image (rick.jpg) Please refer to our project page and our paper for more information. Example Usage For example, you… See the full description on the dataset page: https://huggingface.co/datasets/SALT-NLP/Design2Code.
221.7k
1<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "">2<html lang="en">3 <head>4 <style>5 *{font-family:lucida,Arial,Verdana,Helvetica,sans-serif;font-size:100%;margin:0;padding:0}html{overflow-y:scroll}body{background:#eee url(img/bg_l.png) left top repeat-x;color:#666;font-size:75%;text-align:center}a{text-decoration:underline}a,:focus{outline:0}a{color:#ffa200}a:hover,a:focus{color:#734d0a;text-decoration:none}h1{font-size:200%;font-weight:400}h2{font-size:150%;font-weight:400}h4{font:500 20px normal verdana,sans-serif;word-spacing:.5pt}ul{list-style:none}ul li{background:url(img/li_bullet1.gif) left 8px no-repeat;display:block;padding:5px 0 5px 12px}ul li ul{margin:5px 0 15px 20px}ul li li{background:url(img/li_bullet2.gif) left 8px no-repeat;font-size:95%;padding:2px 0 0 12px}a,a *,button,button *{cursor:pointer}img{border:0}small{font-size:75%}.bookmarklet,.button{-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;background:#ffa200 url(img/th_bg.gif) left top repeat-x;border:0;color:#fff;font-size:12px;padding:4px 15px;text-align:center;text-decoration:none}.button:hover,.bookmarklet:hover,input.button:hover{background:#80cdf5;color:#333}input[disabled].button,input[disabled].button:hover{background:#ddd;color:#444}input.text_input,textarea.text_input,select.text_input{-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;background:#fefefe;border-color:#ddd;border-style:solid;border-width:1px;color:#999;font-size:12px;margin:0 0 2px;padding:4px;width:250px}label{display:block;font-size:16px;font-weight:500;margin:0 auto 5px;text-align:center;width:220px}select.text_input{width:150px}.left{float:left}.clear_both{clear:both}#wrap{margin:0 auto;text-align:left;width:860px}#ImageWidget{clear:both;display:none;float:none;margin:0 15px 20px;width:auto}#ImageWidget .dimensions{display:none}#ImageWidget .imageSize{display:none}#header{border-bottom:5px solid #444;padding:20px 0 10px;position:relative}#header .languages{position:absolute;right:0;top:15px}#header #language{background:#f5f5f5;display:none;margin:2px 0 0;padding:5px;position:relative;z-index:2001}#header .lan_on{display:block;text-align:center}#header .lan_on img{vertical-align:bottom}#search{position:absolute;right:0;top:40px}#search input.text_input{-moz-border-radius:5px 0 0 5px;-webkit-border-radius:5px 0 0 5px;border-radius:5px 0 0 5px;background:#fff;border-width:0;color:#333;font-size:12px;margin:0 0 2px;padding:4px 5px;width:150px}#search input.button{-moz-border-radius:0 5px 5px 0;-webkit-border-radius:0 5px 5px 0;border-radius:0 5px 5px 0;padding:3px 12px}#logo{display:block;height:80px}#logo h1,#logo h1 a{font-size:50px;color:#444;font-weight:400;text-decoration:none}#logo h2{color:#555;font-size:14px;font-weight:400;padding:5px 0 10px}#msg{display:none;opacity:0;filter:alpha(opacity=0);-ms-filter:"alpha(opacity=0)";-khtml-opacity:0;-moz-opacity:0}#nav{float:right;font-size:90%;padding-top:1.4em;width:500px;position:absolute;right:0;top:65px}#nav ul{float:right}#nav li,#nav li a{background:0 0;display:block;float:left;text-align:center;text-decoration:none}#nav li{padding:0 0 0 10px}#nav,#nav *{color:#777;text-transform:uppercase}#nav a{padding:3px 3px 5px;border-bottom:1px solid #666}#nav a:hover,#nav a:focus,#nav a.current{color:#444;border-color:#ffa200}#nav a.current{border-width:2px}#content{padding:10px 0}#content .contentBox{margin:0 auto 15px}#content p{font-size:100%;line-height:140%;padding-bottom:30px}#content .teaser{font-size:110%;padding:20px;text-align:center}#content .top_ad{margin-bottom:15px;text-align:center}#content .footer_ad{display:block;width:728px;margin:0 auto 15px}#footer{display:block;padding:10px 0 20px}#footer p{display:inline-block;font-size:95%;padding:0 5px 1px 0}#footer,#footer *{color:#555;text-decoration:none}#footer a:hover{color:#999}#footer .sp{border-top:1px solid #ccc;padding:0}#feed{-moz-border-radius:0 3px 3px 0;-webkit-border-radius:0 3px 3px 0;border-radius:0 3px 3px 0;background:none repeat scroll 0 0 #f5f5f5;border:1px solid #ccc;display:inline-block;float:right;padding:1px 6px;position:relative;text-align:right;top:7px}#feed a{background:url(img/rss.png) no-repeat scroll 100% 0 transparent;padding-right:19px;padding-top:1px}#thumb .img_ad_box{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background:#fff;border:1px solid #ddd;margin:20px 15px;min-height:150px;padding:30px;width:772px}#thumb .nextbox{}#thumb h3{font-size:14px;padding:14px 0 0 140px}#thumb div.full{float:none;margin:20px 15px;width:830px}#thumb div.full .code_box{margin:0 auto;width:830px}#thumb div.full .code_box label{font-size:12px;margin:0 10px;width:200px}#thumb div.full .code_box input.text_input{padding:4px;width:500px}#thumb .full h3{padding-left:240px}#thumb div.full .bookmarking{width:500px}#thumb .thumb_Ad2,#thumb .thumb_Ad{float:right;padding:20px}#thumb .thumb_Ad2{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background:#fff;border:1px solid #ddd;float:none;margin:10px 10px 20px;padding:10px;position:relative;text-align:center}#thumb .bookmarking{-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;background:#fff;border:1px solid #aeaeae;color:#333;display:block;float:left;height:16px;overflow:hidden;padding:5px;text-decoration:none;width:280px}#thumb .addthis{display:block;height:20px;overflow:hidden;padding:5px 0;width:280px}#thumb .addthis a:hover{margin:-2px 0 0}#thumb .img_box{margin:0 auto;padding:0;position:relative;text-align:center;width:410px}#thumb .img_box .thumb{border:10px solid #fff;margin:0 auto;outline:1px solid #ddd}#thumb .img_box a{text-decoration:none;color:#444;display:inline-block;max-width:340px}#thumb .img_box a span{-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;background:none repeat scroll 0 0 #f5f5f5;border:1px solid #ddd;display:block;margin:3px 0;padding:5px 0}#thumb .toolbar{display:inline-block;margin-right:5px;vertical-align:top;width:34px}#thumb #rating{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background:#fff;border:1px solid #ddd}#thumb #rating .ratingCounter{background:#333;color:#eee;display:block;padding:2px 0}#thumb #rating .vote{display:block;height:25px;width:30px;cursor:pointer}#thumb #rating .voteup{background:url(img/like.gif) no-repeat scroll 0 0 transparent}#thumb #rating .votedown{background:url(img/dislike.gif) no-repeat scroll 0 0 transparent}#thumb #imgDownload a,#thumb #imgReport a{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background:url(img/warning1.gif) no-repeat scroll 8px 8px #fff;border:1px solid #ddd;height:32px;margin:5px 0 0;width:32px}#thumb #imgDownload a{background:url(img/download.png) no-repeat scroll 3px 3px #fff}.boxpanel{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background-color:#fff;border:1px solid #ddd;color:#666;float:right;margin:0 10px 20px 0;padding:0 0 10px;width:445px}.boxpanel h2.boxtitle{-moz-border-radius:5px 5px 0 0;-webkit-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0;background-color:#f5f5f5;border-bottom:1px solid #ddd;color:#666;cursor:auto;font-size:12px;margin:0 0 10px;padding:3px 10px}.code_box{clear:both;height:25px;padding:5px 0;width:450px}.code_box label{float:left;font-size:11px;margin:0 5px;padding:5px 0 0;text-align:right;width:130px}.code_box input.text_input{float:left;font-size:12px;padding:3px;width:280px}input.long,textarea.long{width:420px}#gallery .search_sug,#gallery h4.search{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background:#f5f5f5;color:#bbb;font-weight:700;margin:20px auto;padding:10px;text-transform:none;width:770px}#gallery .search_for{color:#666}#gallery p.search_sug{color:#888;padding:10px}#gallery .gallery_ad{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background:none repeat scroll 0 0 #f5f5f5;border:1px solid #ddd;left:2px;margin:10px auto 5px;padding:10px;position:relative;text-align:center;width:770px}#gallery .img_report{-moz-border-radius:0 0 0 10px;-webkit-border-radius:0 0 0 10px;border-radius:0 0 0 10px;background-color:#fff;display:none;margin-top:-1px;padding:3px 16px;position:absolute;right:0;top:0}#gallery .img_report a{text-decoration:none;color:#777;font-size:11px}#gallery .info{color:#aaa;font-size:10px;height:22px;margin:0 auto;padding:0;text-shadow:1px 1px 1px #fff;width:150px}#gallery .dimensions{background:0 0;float:left;padding:2px 0 0}#gallery .imageSize{display:none}#gallery .commentsCount{background:url(img/comment.gif) no-repeat scroll 0 3px transparent;float:right;padding:2px 0 0 15px}#gallery .viewRating{background:url(img/heart.gif) no-repeat scroll 0 3px transparent;float:right;margin-right:5px;min-height:16px;padding:2px 0 0 12px;text-align:left}#gallery .viewCount{background:url(img/eye.gif) no-repeat scroll 0 0 transparent;float:right;margin-right:5px;min-height:16px;padding:2px 0 0 17px}ul.gallery{display:block;height:230px;margin:0 auto;padding:0;width:830px}ul.gallery li{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background:#fff;border:1px solid #ddd;display:inline;float:left;margin:15px 15px 5px 20px;padding:0;position:relative}ul.gallery li a.thumb{display:table-cell;height:170px;text-align:center;vertical-align:middle;width:170px}ul.gallery img{margin:0 auto;max-height:150px;max-width:150px}ul.gallery li:hover{border:1px solid #fff;-moz-box-shadow:0 0 3px #222;-webkit-box-shadow:0 0 3px #222;box-shadow:0 0 3px #222}ul.gallery li h2 a{color:#555;display:block;font-size:10px;margin:0 auto;overflow:hidden;padding:0 0 5px;text-decoration:none;white-space:nowrap;width:150px}#home .fileinput_button{-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;background:url(img/th_bg.gif) repeat-x scroll left top #ffa200;border:0;color:#fff;padding:4px 15px;text-align:center}#home .file_input_hidden{font-size:74px;height:100px;position:absolute;right:0;top:0;opacity:0;filter:alpha(opacity=0);-ms-filter:"alpha(opacity=0)";-khtml-opacity:0;-moz-opacity:0}#home .linklocal,#home .linkremote{-moz-border-radius:3px 3px 0 0;-webkit-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0;background:#fff;border:1px solid #ddd;border-bottom:none;font-size:12px;margin-right:2px;padding:4px 10px 2px;text-decoration:none;text-transform:uppercase}#home .upform input.uploadbutton{-moz-border-radius:0 0 3px 3px;-webkit-border-radius:0 0 3px 3px;border-radius:0 0 3px 3px;float:left;font-size:13px;font-weight:700;margin:-20px 35px 30px;text-transform:uppercase}#home a.show,#home .linklocal:hover,#home .linkremote:hover{background-color:#f5f5f5;color:#333;position:relative;z-index:2001}#home .upload_op{display:block;margin:0 auto -10px;text-align:center}#home .upform{display:block;margin:0 auto;text-align:center;width:450px}#home .preferences{-moz-border-radius:0 5px 5px 5px;-webkit-border-radius:0 5px 5px 5px;border-radius:0 5px 5px 5px;background-color:#fff;border:1px solid #ddd;color:#666;display:none;line-height:25px;margin:0 auto;padding:10px;text-align:left}#home .pref_title{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background:url(img/downarrow.png) no-repeat scroll 125px 5px #fff;border:1px solid #ddd;color:#666;cursor:pointer;font-size:12px;margin:10px 0 0;padding:2px 0 2px 10px;position:relative;text-align:left;text-transform:capitalize;width:150px;z-index:2005}#home .open_pref{-moz-border-radius:5px 5px 0 0;-webkit-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0;background:url(img/uparrow.png) no-repeat scroll 125px 5px #fff;border-bottom:none}#home .uploadbox .preferences label{display:inline;font-size:12px;margin:0;text-align:left}#home .preferences .title{display:block;font-weight:700}#home .preferences .small{display:block;font-size:10px;line-height:10px}#home .preferences input.text_input{padding:1px;width:75px}#home .bookmarklet{display:block;font-size:12px;font-weight:700;margin:5px auto;text-decoration:none;text-transform:uppercase;width:250px}#home .bml{margin:0 50px}#home .uploadbox{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background-color:#f5f5f5;border:1px solid #ddd;margin:10px auto 20px;padding:15px;width:380px;position:relative}div.hide{display:none;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px}.upload_form{height:55px;display:block}.upload_form label{width:auto}form.upform .file_input_div{height:31px;overflow:hidden;position:relative;width:380px;*width:390px}form.upform .file_input_div input.text_input{position:relative;z-index:1002;top:2px;width:280px}#home .uploadbox .closeUpload{background:url(img/cross_grey_small.png) repeat scroll 0 0 transparent;display:none;height:7px;position:absolute;right:10px;top:10px;width:7px}#home .loading{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background-color:#f5f5f5;border:1px solid #ddd;display:none;margin:15px auto;padding:25px 15px 35px;text-align:center;width:380px}#home .loading #uoloadingImage{-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;background:url(img/loading2.gif) repeat scroll 0 0 #ffa800;display:block;height:20px;margin:0 auto;width:335px}#home .ad_index{margin:0 auto 20px;text-align:center}input.long_des,input#imgUrl{width:370px}#home .add_another_file_input{background:url(img/add.png) repeat scroll 0 0 transparent;display:block;height:16px;left:5px;position:absolute;top:5px;vertical-align:middle;width:16px}#home .Upload_Multiple{-moz-border-radius:0 0 5px 5px;-webkit-border-radius:0 0 5px 5px;border-radius:0 0 5px 5px;background-color:#f5f5f5;border:1px solid #ddd;border-top:0;float:right;height:26px;margin:-21px 35px 0 0;position:relative;text-align:center;width:26px;z-index:2002}#home .Upload_Multiple small,.Upload_Multiple span{display:none}#faq{margin:10px 30px}#faq h2{color:#777;font-size:20px;margin:0}.faq_box{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background:#f5f5f5;margin:5px 5px 10px;padding:5px 10px}.faq_box .title{font-size:14px;font-weight:700}.faq_box .answer{color:#888;font-size:13px;line-height:20px;margin:5px 10px;padding:0 0 10px}#tos{margin:10px 30px}#tos h2{color:#777;font-size:20px;margin:0}#tos ul{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background:#f5f5f5;list-style:none;margin:5px;padding:15px}#tos ul li{background:none transparent;display:list-item;font-size:13px;list-style:disc outside none;margin:0 0 0 15px;padding:5px 0 15px}#tos ul li ul{margin:0 0 15px;padding-top:5px}#tos ul li li{list-style:circle outside none;padding:4px 0 0}#contact{margin:10px 30px}#contact h2{color:#777;font-size:20px;margin:0}#contact .contact_box{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background:#f5f5f5;margin:5px;padding:0 10px 20px}#contact #form{margin:0 auto;width:600px}#contact .contactbox{padding:15px}#contact .code_box{padding:5px}#contact .code_box label{font-size:14px}#contact .contact{height:125px;width:600px}#contact .contact textarea.long{height:115px;width:400px}#contact .error_message{color:red;display:block;font-size:10px;margin-left:145px;text-align:left}#contact .captcha{}.pagination{clear:both;margin:15px 35px}.pagination span.pagecount,.pagination span.disabled,.pagination span.current,.pagination a{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background:none repeat scroll 0 0 #fff;color:#333;display:inline-block;font-size:11px;font-weight:700;height:25px;line-height:24px;margin:0 2px;min-width:15px;padding:0 5px;text-align:center;text-decoration:none}.pagination a{color:#666}.pagination a:hover,div.pagination a:active,.pagination span.current{background-color:#ffa200;color:#fff}.pagination span.disabled{color:#868686}.pagination span.pagecount{background:#333;color:#eee}.orderby{display:inline-block;clear:both;margin:10px 35px}.orderbyTitle,.orderby span.disabled,.orderby span.current,.orderby a{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;background:none repeat scroll 0 0 #fff;color:#333;display:inline-block;font-size:11px;font-weight:700;height:25px;line-height:24px;margin:0 2px;min-width:15px;padding:0 5px;text-align:center;text-decoration:none}.orderby a:hover,div.orderby a:active,.orderby span.current{background-color:#ffa200;color:#fff}.orderby span.disabled{color:#868686}.orderbyTitle{background:none repeat scroll 0 0 #f5f5f5;color:#999}.albums{display:inline-block;float:right;margin:10px 35px}.albums label{width:auto}.albums .text_input{color:#333;font-size:11px;font-weight:700;padding:4px 5px}#comments{}#commentsblock{float:left;margin:0 0 20px;padding:0 0 0 10px;width:375px}#addCommentContainer,#comments{margin-right:0;width:370px}.comment{margin:0;min-height:40px}.comment .avatar{width:80px;display:inline-block;text-align:center}.comment .avatar img{width:40px;height:40px}.comment .info{display:inline-block;margin:0 0 0 -2px;vertical-align:top;width:275px}.comment .name{margin:-2px 0 5px;width:auto;color:#333;font-weight:700;font-size:12px;line-height:20px}.comment .date{color:#666;float:right;font-size:10px;margin:-2px 0 5px;width:auto}#commentslist .comment p{display:block;font-size:12px;line-height:18px;margin:-25px 20px 0 80px;overflow-x:hidden;padding:0}#comments ul{list-style-type:none;margin:0 auto}#comments ul li{background:0 0;border-bottom:1px dotted #ccc;margin:0 0 10px;padding:0 0 10px;width:100%}#addCommentForm{padding:0 15px 10px}#addCommentContainer{margin:0 auto;display:block}#addCommentContainer .text_input{width:155px}#addCommentContainer textarea.text_input{width:330px}#addCommentContainer label{font-size:10px;margin:5px 0 0;padding-bottom:0;text-align:left;width:auto}#addCommentContainer label span.error{color:red;position:relative;right:-10px;background:0 0}.comEmail{float:left}.comName{float:left;margin-right:10px}.comCap{display:inline-block;width:210px}.comCapin{display:inline-block}#addCommentContainer .comCap .text_input{width:75px}.comCap img{vertical-align:bottom}.nextComment{display:block;margin:0 auto;text-align:center;width:250px}.notification{-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;border:1px solid;display:block;font-size:13px;font-style:normal;line-height:1.5em;margin:5px auto 0;padding:5px 10px 5px 30px;position:relative;text-align:left}.success{background:#d5ffce url(img/tick_circle.png) no-repeat 10px 8px;border-color:#9adf8f;color:#556652}.error{background:url(img/cross_circle.png) no-repeat scroll 10px 8px #ffcece;border-color:#df8f8f;color:#665252}.notification .close{background:url(img/cross_grey_small.png) no-repeat scroll 0 0 transparent;font-size:9px;height:7px;position:absolute;right:5px;top:5px;width:7px}.tipsy{font-size:11px;position:absolute;padding:9px;z-index:1800}.tipsy-inner{background-color:#333;color:#fff;max-width:300px;text-align:center;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;padding:8px 8px 6px;margin:-1px}.tipsy-arrow{position:absolute;width:0;height:0}.tipsy-n .tipsy-arrow-border,.tipsy-nw .tipsy-arrow-border,.tipsy-ne .tipsy-arrow-border{top:0;margin-left:0;position:absolute}.tipsy-n .tipsy-arrow,.tipsy-nw .tipsy-arrow,.tipsy-ne .tipsy-arrow{top:2px;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid #333;margin-left:-7px}.tipsy-s .tipsy-arrow-border,.tipsy-sw .tipsy-arrow-border,.tipsy-se .tipsy-arrow-border{bottom:0;margin-left:0;position:absolute}.tipsy-s .tipsy-arrow,.tipsy-sw .tipsy-arrow,.tipsy-se .tipsy-arrow{bottom:2px;border-left:7px solid transparent;border-right:7px solid transparent;border-top:7px solid #333;margin-left:-7px}.tipsy-n .tipsy-arrow,.tipsy-n .tipsy-arrow-border,.tipsy-s .tipsy-arrow,.tipsy-s .tipsy-arrow-border{left:50%}.tipsy-nw .tipsy-arrow,.tipsy-nw .tipsy-arrow-border,.tipsy-sw .tipsy-arrow,.tipsy-sw .tipsy-arrow-border{left:10px}.tipsy-ne .tipsy-arrow,.tipsy-ne .tipsy-arrow-border,.tipsy-se .tipsy-arrow,.tipsy-se .tipsy-arrow-border{right:10px}.tipsy-e .tipsy-arrow,.tipsy-e .tipsy-arrow-border,.tipsy-w .tipsy-arrow,.tipsy-w .tipsy-arrow-border{top:50%;margin-top:0}.tipsy-e .tipsy-arrow-border{right:0;position:absolute}.tipsy-e .tipsy-arrow{right:2px;border-top:7px solid transparent;border-left:7px solid #333;border-bottom:7px solid transparent;margin-top:-7px}.tipsy-w .tipsy-arrow-border{left:0;position:absolute}.tipsy-w .tipsy-arrow{left:2px;border-top:7px solid transparent;border-right:7px solid #333;border-bottom:7px solid transparent;margin-top:-7px}6 </style>7 <meta charset="utf-8">8 <title>9 CyberPics < - Terms of Service10 </title>11 <meta content="Terms of Service page for CyberPics" name="description">12 <meta content name="keywords">13 <meta content="index,follow" name="robots">14 </head>15 <body id="tos_page">16 <div id="wrap">17 <div class="clear_both" id="header">18 <div id="logo">19 <h1>20 <a title="CyberPics Home">21 CyberPics22 </a>23 </h1>24 <h2>25 Free Image Host26 </h2>27 </div>28 <div id="search">29 <form action="" method="get">30 <input class="text_input" id="searchBox" name="search" onblur="if(this.value=='')value='Image Search';" onfocus="if(this.value=='Image Search')value=''" size="28" type="text" value="Image Search">31 <input class="button" type="submit" value="Search">32 </form>33 </div>34 <div id="nav">35 <ul id="main-nav">36 <li id="page_home">37 <a title="Home">38 Home39 </a>40 </li>41 <li id="page_faq_page">42 <a title="FAQ">43 FAQ44 </a>45 </li>46 <li id="page_tos_page">47 <a class="current" title="Terms of Service">48 Terms of Service49 </a>50 </li>51 <li id="page_contact_page">52 <a title="Contact Us">53 Contact Us54 </a>55 </li>56 </ul>57 </div>58 <div class="clear_both">59 </div>60 </div>61 <div id="content">62 <div id="msg">63 </div>64 <div class="contentBox">65 <div id="tos">66 <h2>67 Terms of Service68 </h2>69 <ul>70 <li>71 CyberPics reserves the right to disable or delete any file which might compromise the security of our servers, uses excessive bandwidth, violates this Terms of Service or is otherwise considered undesirable (at our sole discretion).72 </li>73 <li>74 The image hosting service is provided as-is with no implied warranties of any kind. We can not be held responsible for the loss of data or other damages which may result from (lack of) functionality of our service.75 </li>76 <li>77 CyberPics does not allow the following types of files to be uploaded:78 <ul>79 <li>80 Images which violate copyrights or patents are not allowed.81 </li>82 <li>83 Images which contain adult content such as pornography or excessive nudity.84 </li>85 <li>86 Images which contain gruesome scenes, such as dead people or mutilations.87 </li>88 <li>89 Images which violate the privacy of the individuals depicted are not allowed.90 </li>91 </ul>92 </li>93 <li>94 Files will not be deleted unless they have not been accessed for some time or violate our Terms of Service.95 </li>96 </ul>97 <br>98 <br>99 <h2>100 Privacy Policy101 </h2>102 <ul>103 <li>104 We will never sell, rent, or lease our customer information to third parties.105 </li>106 </ul>107 </div>108 </div>109 <div class="clear_both">110 </div>111 </div>112 <div id="footer">113 <p>114 Copyright © CyberPics - All Rights Reserved.115 </p>116 <div id="feed">117 <a title="image Feed">118 <span>119 image Feed120 </span>121 </a>122 </div>123 <div class="sp">124 </div>125 <p>126 Powered By127 <a title>128 KenSoft LLC129 </a>130 | Design By131 <a title="CyberPics">132 cyberpics.net133 </a>134 </p>135 </div>136 </div>137 <!--[if lt IE 7 ]>138 139 140 <![endif]-->141 </body>142</html>143