commit bae6a7f77e8317e2f908e2cf9e31d8d3b2ce46ed
Author: Olga Brani <olgabrani@grnet.gr>
Date:   Mon Oct 7 17:55:33 2013 +0300

    new ui: style fixes for vm creation wizard step 4

diff --git a/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_overlays.scss b/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_overlays.scss
index 0cdd187..e093576 100644
--- a/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_overlays.scss
+++ b/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_overlays.scss
@@ -478,11 +478,22 @@ Overlays (Todo: clean up)
 			}
 			.summary {
 				.row {
-					padding-top:1em;
-					margin-top:1em;
-					border-top:1px solid white;
+					.wrap {
+						max-width: $row-small;
+						border-top:1px solid white;
+						padding-top:2em;
+						margin-top:1em;
+					}
 					&:first-child {
-						border-top:0 none;
+						.wrap {
+							border-top:0 none;
+							margin-top:0;
+						}
+						dl {
+							dt {
+								font-weight: bold;
+							}
+						}
 					}
 				}
 				h2 {
@@ -492,17 +503,20 @@ Overlays (Todo: clean up)
 				dl {
 					margin-bottom:0;
 					span {
-						margin-right:10px;
+						width:40px;
+						display: inline-block;
 						font-size:20px;
 					}
 					dt {
 						display: inline-block;
-						width: 45%;
+						width: 42%;
 						vertical-align: top;
+						font-weight:600;
 					}
 					dd {
 						display: inline-block;
 						width:45%;
+						margin-bottom:1em;
 					}
 				}
 			}
diff --git a/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_settings.scss b/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_settings.scss
index 70d71d4..73cb6d8 100644
--- a/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_settings.scss
+++ b/snf-cyclades-app/synnefo/ui/new_ui/ui/sass/_settings.scss
@@ -110,7 +110,7 @@ $btn-height:30px;
 
 $row-full-width:100%;
 $row-width: 1200px;
-$row-small: emCalc(600px);
+$row-small: emCalc(580px);
 
 $conf-area-h-width: emCalc(300px);
 // $column-gutter: 1.875em;
diff --git a/snf-cyclades-app/synnefo/ui/new_ui/ui/stylesheets/app.css b/snf-cyclades-app/synnefo/ui/new_ui/ui/stylesheets/app.css
index 017608d..84922e8 100644
--- a/snf-cyclades-app/synnefo/ui/new_ui/ui/stylesheets/app.css
+++ b/snf-cyclades-app/synnefo/ui/new_ui/ui/stylesheets/app.css
@@ -7936,7 +7936,7 @@ body {
 /* line 47, ../sass/_networks.scss */
 #network-wizard .main .network_options {
   position: relative;
-  width: 37.5em;
+  width: 36.25em;
   margin: 0 auto;
 }
 /* line 49, ../sass/_networks.scss */
@@ -8744,118 +8744,127 @@ Overlays (Todo: clean up)
 .wizard .middle .step .flavor li .options-bar .options li a.current {
   color: #485057;
 }
-/* line 480, ../sass/_overlays.scss */
-.wizard .middle .step .summary .row {
-  padding-top: 1em;
-  margin-top: 1em;
+/* line 481, ../sass/_overlays.scss */
+.wizard .middle .step .summary .row .wrap {
+  max-width: 36.25em;
   border-top: 1px solid white;
+  padding-top: 2em;
+  margin-top: 1em;
 }
-/* line 484, ../sass/_overlays.scss */
-.wizard .middle .step .summary .row:first-child {
+/* line 488, ../sass/_overlays.scss */
+.wizard .middle .step .summary .row:first-child .wrap {
   border-top: 0 none;
+  margin-top: 0;
 }
-/* line 488, ../sass/_overlays.scss */
+/* line 493, ../sass/_overlays.scss */
+.wizard .middle .step .summary .row:first-child dl dt {
+  font-weight: bold;
+}
+/* line 499, ../sass/_overlays.scss */
 .wizard .middle .step .summary h2 {
   font-size: 1em;
   color: white;
 }
-/* line 492, ../sass/_overlays.scss */
+/* line 503, ../sass/_overlays.scss */
 .wizard .middle .step .summary dl {
   margin-bottom: 0;
 }
-/* line 494, ../sass/_overlays.scss */
+/* line 505, ../sass/_overlays.scss */
 .wizard .middle .step .summary dl span {
-  margin-right: 10px;
+  width: 40px;
+  display: inline-block;
   font-size: 20px;
 }
-/* line 498, ../sass/_overlays.scss */
+/* line 510, ../sass/_overlays.scss */
 .wizard .middle .step .summary dl dt {
   display: inline-block;
-  width: 45%;
+  width: 42%;
   vertical-align: top;
+  font-weight: 600;
 }
-/* line 503, ../sass/_overlays.scss */
+/* line 516, ../sass/_overlays.scss */
 .wizard .middle .step .summary dl dd {
   display: inline-block;
   width: 45%;
+  margin-bottom: 1em;
 }
-/* line 509, ../sass/_overlays.scss */
+/* line 523, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step {
   color: white;
 }
-/* line 511, ../sass/_overlays.scss */
+/* line 525, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step h2 {
   color: white;
   font-size: 1em;
   margin-bottom: 10px;
 }
-/* line 516, ../sass/_overlays.scss */
+/* line 530, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step p {
   font-size: 10px;
 }
-/* line 519, ../sass/_overlays.scss */
+/* line 533, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .snf-checkbox-checked, .wizard .middle .step .advanced-conf-step .snf-checkbox-unchecked {
   color: white;
 }
-/* line 522, ../sass/_overlays.scss */
+/* line 536, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .expand-btn {
   margin: 50px 0 45px;
 }
-/* line 524, ../sass/_overlays.scss */
+/* line 538, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .expand-btn a {
   color: white;
 }
-/* line 526, ../sass/_overlays.scss */
+/* line 540, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .expand-btn a span {
   padding-left: 24px;
 }
-/* line 537, ../sass/_overlays.scss */
+/* line 551, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .adv-main .vm-name h2 {
   color: white;
   font-size: 1em;
   margin-bottom: 0.5em;
 }
-/* line 546, ../sass/_overlays.scss */
+/* line 560, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .btn5:hover, .wizard .middle .step .advanced-conf-step .os li .btn-col a:hover, .wizard .middle .step .os li .btn-col .advanced-conf-step a:hover, .wizard .middle .step .advanced-conf-step .flavor li .options-bar .options li a:hover, .wizard .middle .step .flavor li .options-bar .options li .advanced-conf-step a:hover {
   color: white;
 }
-/* line 549, ../sass/_overlays.scss */
+/* line 563, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .btn5.current, .wizard .middle .step .advanced-conf-step .os li .btn-col a.current, .wizard .middle .step .os li .btn-col .advanced-conf-step a.current, .wizard .middle .step .advanced-conf-step .flavor li .options-bar .options li a.current, .wizard .middle .step .flavor li .options-bar .options li .advanced-conf-step a.current, .wizard .middle .step .advanced-conf-step .btn5.current:hover, .wizard .middle .step .advanced-conf-step .os li .btn-col a.current:hover, .wizard .middle .step .os li .btn-col .advanced-conf-step a.current:hover, .wizard .middle .step .advanced-conf-step .flavor li .options-bar .options li a.current:hover, .wizard .middle .step .flavor li .options-bar .options li .advanced-conf-step a.current:hover {
   color: #485057;
 }
-/* line 553, ../sass/_overlays.scss */
+/* line 567, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options {
   display: none;
 }
-/* line 555, ../sass/_overlays.scss */
+/* line 569, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .check {
   font-size: 20px;
 }
-/* line 558, ../sass/_overlays.scss */
+/* line 572, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .area {
   padding-top: 30px;
   padding-bottom: 30px;
 }
-/* line 562, ../sass/_overlays.scss */
+/* line 576, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .area .row * {
   margin-left: 0;
 }
-/* line 567, ../sass/_overlays.scss */
+/* line 581, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .area .row p {
   width: 340px;
   margin-bottom: 20px;
 }
-/* line 573, ../sass/_overlays.scss */
+/* line 587, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .area ul li {
   position: relative;
   list-style: none outside none;
   margin-bottom: 7px;
 }
-/* line 578, ../sass/_overlays.scss */
+/* line 592, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .area ul li.checkbox:hover {
   cursor: pointer;
 }
-/* line 582, ../sass/_overlays.scss */
+/* line 596, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .area ul li h3 {
   width: 18.75em;
   color: white;
@@ -8864,25 +8873,25 @@ Overlays (Todo: clean up)
   margin: 0 28px 0 0;
   display: inline-block;
 }
-/* line 594, ../sass/_overlays.scss */
+/* line 608, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .ssh-keys-area {
   background-color: #ff7049;
   padding-bottom: 60px;
 }
-/* line 597, ../sass/_overlays.scss */
+/* line 611, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .ssh-keys-area .btn5, .wizard .middle .step .advanced-conf-step .advanced-conf-options .ssh-keys-area .os li .btn-col a, .wizard .middle .step .os li .btn-col .advanced-conf-step .advanced-conf-options .ssh-keys-area a, .wizard .middle .step .advanced-conf-step .advanced-conf-options .ssh-keys-area .flavor li .options-bar .options li a, .wizard .middle .step .flavor li .options-bar .options li .advanced-conf-step .advanced-conf-options .ssh-keys-area a {
   margin-top: 3px;
 }
-/* line 602, ../sass/_overlays.scss */
+/* line 616, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .networks-area {
   background-color: #ff948c;
 }
-/* line 604, ../sass/_overlays.scss */
+/* line 618, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .networks-area ul {
   position: relative;
   left: -20px;
 }
-/* line 609, ../sass/_overlays.scss */
+/* line 623, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .networks-area li .net-icons {
   padding-right: 30px;
   display: inline-block;
@@ -8891,59 +8900,59 @@ Overlays (Todo: clean up)
   font-size: 30px;
   margin-bottom: 0;
 }
-/* line 621, ../sass/_overlays.scss */
+/* line 635, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .networks-area li .net-icons span.snf-modem {
   position: relative;
   top: -6px;
 }
-/* line 630, ../sass/_overlays.scss */
+/* line 644, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .networks-area li.more {
   background: #fff4f3;
   margin-bottom: 1em;
   padding: 30px 0;
   color: #ff948c;
 }
-/* line 636, ../sass/_overlays.scss */
+/* line 650, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .networks-area li.more h3 {
   color: #ff948c;
   padding-left: 145px;
 }
-/* line 640, ../sass/_overlays.scss */
+/* line 654, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .networks-area li.more .btn5, .wizard .middle .step .advanced-conf-step .advanced-conf-options .networks-area .os li.more .btn-col a, .wizard .middle .step .os .advanced-conf-step .advanced-conf-options .networks-area li.more .btn-col a, .wizard .middle .step .advanced-conf-step .advanced-conf-options .networks-area .flavor li.more .options-bar .options li a, .wizard .middle .step .flavor .advanced-conf-step .advanced-conf-options .networks-area li.more .options-bar .options li a {
   margin-top: 20px;
   border-color: #ff948c;
   color: #ff948c;
   margin-left: 145px;
 }
-/* line 648, ../sass/_overlays.scss */
+/* line 662, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .networks-area li.more .checkbox a span {
   color: #ff948c;
 }
-/* line 657, ../sass/_overlays.scss */
+/* line 671, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .tags-area {
   background-color: #4c71ff;
 }
-/* line 659, ../sass/_overlays.scss */
+/* line 673, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .tags-area .snf-color-picker {
   display: none;
 }
-/* line 662, ../sass/_overlays.scss */
+/* line 676, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .tags-area #picker {
   position: relative;
   width: 207px;
   margin: 30px 5px;
   display: inline-block;
 }
-/* line 674, ../sass/_overlays.scss */
+/* line 688, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .tags-area .btns {
   margin-top: 77px;
   margin-bottom: 30px;
 }
-/* line 681, ../sass/_overlays.scss */
+/* line 695, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .tags-area .btn5, .wizard .middle .step .advanced-conf-step .advanced-conf-options .tags-area .os li .btn-col a, .wizard .middle .step .os li .btn-col .advanced-conf-step .advanced-conf-options .tags-area a, .wizard .middle .step .advanced-conf-step .advanced-conf-options .tags-area .flavor li .options-bar .options li a, .wizard .middle .step .flavor li .options-bar .options li .advanced-conf-step .advanced-conf-options .tags-area a {
   margin-right: 20px;
 }
-/* line 685, ../sass/_overlays.scss */
+/* line 699, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .tags-area h3 {
   width: 18.75em;
   color: white;
@@ -8952,16 +8961,16 @@ Overlays (Todo: clean up)
   margin: 0 28px 0 0;
   display: inline-block;
 }
-/* line 694, ../sass/_overlays.scss */
+/* line 708, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .tags-area .list-header {
   position: relative;
   left: -14px;
 }
-/* line 697, ../sass/_overlays.scss */
+/* line 711, ../sass/_overlays.scss */
 .wizard .middle .step .advanced-conf-step .advanced-conf-options .tags-area .list-header h3 {
   margin-right: 35px;
 }
-/* line 708, ../sass/_overlays.scss */
+/* line 722, ../sass/_overlays.scss */
 .wizard .bottom {
   position: fixed;
   left: 0;
@@ -8970,12 +8979,12 @@ Overlays (Todo: clean up)
   border-top: 1px solid #636a70;
   background: #485057;
 }
-/* line 715, ../sass/_overlays.scss */
+/* line 729, ../sass/_overlays.scss */
 .wizard .bottom .row {
   height: 50px;
   line-height: 50px;
 }
-/* line 719, ../sass/_overlays.scss */
+/* line 733, ../sass/_overlays.scss */
 .wizard .bottom .nav {
   height: 50px;
   line-height: 50px;
@@ -8986,7 +8995,7 @@ Overlays (Todo: clean up)
   top: 10px;
   width: 100px;
 }
-/* line 728, ../sass/_overlays.scss */
+/* line 742, ../sass/_overlays.scss */
 .wizard .bottom .nav:hover {
   -webkit-transition: background 0ms ease-out;
   -moz-transition: background 0ms ease-out;
@@ -8994,14 +9003,14 @@ Overlays (Todo: clean up)
   -o-transition: background 0ms ease-out;
   transition: background 0ms ease-out;
 }
-/* line 731, ../sass/_overlays.scss */
+/* line 745, ../sass/_overlays.scss */
 .wizard .bottom .nav span {
   display: inline-block;
   height: 30px;
   line-height: 30px;
   float: left;
 }
-/* line 736, ../sass/_overlays.scss */
+/* line 750, ../sass/_overlays.scss */
 .wizard .bottom .nav span:hover {
   -webkit-transition: background 0ms linear;
   -moz-transition: background 0ms linear;
@@ -9009,80 +9018,80 @@ Overlays (Todo: clean up)
   -o-transition: background 0ms linear;
   transition: background 0ms linear;
 }
-/* line 740, ../sass/_overlays.scss */
+/* line 754, ../sass/_overlays.scss */
 .wizard .bottom .nav:focus {
   color: green;
 }
-/* line 744, ../sass/_overlays.scss */
+/* line 758, ../sass/_overlays.scss */
 .wizard .bottom .prev {
   float: left;
   height: 30px;
   padding-left: 18px;
   background: url("../images/nav-edge-lt.png") no-repeat left top;
 }
-/* line 749, ../sass/_overlays.scss */
+/* line 763, ../sass/_overlays.scss */
 .wizard .bottom .prev span {
   padding-right: 10px;
   background: url("../images/nav-lt.png") no-repeat right top;
 }
-/* line 754, ../sass/_overlays.scss */
+/* line 768, ../sass/_overlays.scss */
 .wizard .bottom .prev:hover, .wizard .bottom .prev.active, .wizard .bottom .items-list li .container:hover .prev.check, .items-list li .container:hover .wizard .bottom .prev.check {
   background-position: left bottom;
 }
-/* line 756, ../sass/_overlays.scss */
+/* line 770, ../sass/_overlays.scss */
 .wizard .bottom .prev:hover span, .wizard .bottom .prev.active span, .wizard .bottom .items-list li .container:hover .prev.check span, .items-list li .container:hover .wizard .bottom .prev.check span {
   background-position: right bottom;
 }
-/* line 761, ../sass/_overlays.scss */
+/* line 775, ../sass/_overlays.scss */
 .wizard .bottom .next {
   float: right;
   height: 30px;
   padding-right: 18px;
   background: url("../images/nav-edge-rt.png") no-repeat right top;
 }
-/* line 766, ../sass/_overlays.scss */
+/* line 780, ../sass/_overlays.scss */
 .wizard .bottom .next span {
   padding-left: 10px;
   background: url("../images/nav-rt.png") no-repeat left top;
   float: right;
 }
-/* line 772, ../sass/_overlays.scss */
+/* line 786, ../sass/_overlays.scss */
 .wizard .bottom .next:hover, .wizard .bottom .next.active, .wizard .bottom .items-list li .container:hover .next.check, .items-list li .container:hover .wizard .bottom .next.check {
   background-position: right bottom;
 }
-/* line 774, ../sass/_overlays.scss */
+/* line 788, ../sass/_overlays.scss */
 .wizard .bottom .next:hover span, .wizard .bottom .next.active span, .wizard .bottom .items-list li .container:hover .next.check span, .items-list li .container:hover .wizard .bottom .next.check span {
   background-position: left bottom;
   float: right;
 }
 
-/* line 784, ../sass/_overlays.scss */
+/* line 798, ../sass/_overlays.scss */
 .wizard-content {
   overflow: hidden;
   width: 100%;
 }
-/* line 787, ../sass/_overlays.scss */
+/* line 801, ../sass/_overlays.scss */
 .wizard-content .vm-wizard-carousel {
   position: relative;
   left: 0;
 }
-/* line 790, ../sass/_overlays.scss */
+/* line 804, ../sass/_overlays.scss */
 .wizard-content .vm-wizard-carousel .step {
   float: left;
 }
 
 /* Responive ------------------------------------------------ */
 @media only screen and (max-width: 768px) {
-  /* line 802, ../sass/_overlays.scss */
+  /* line 816, ../sass/_overlays.scss */
   .wizard .top {
     position: static;
   }
-  /* line 805, ../sass/_overlays.scss */
+  /* line 819, ../sass/_overlays.scss */
   .wizard .middle {
     padding-top: 0;
   }
 
-  /* line 810, ../sass/_overlays.scss */
+  /* line 824, ../sass/_overlays.scss */
   .overlay-wrapper .overlay-area {
     top: 0;
   }
diff --git a/snf-cyclades-app/synnefo/ui/new_ui/ui/vm_list.html b/snf-cyclades-app/synnefo/ui/new_ui/ui/vm_list.html
index 88a0974..31151ec 100644
--- a/snf-cyclades-app/synnefo/ui/new_ui/ui/vm_list.html
+++ b/snf-cyclades-app/synnefo/ui/new_ui/ui/vm_list.html
@@ -501,56 +501,64 @@ Confirm that the options you have selected are correct</p>
 								<div id="dummy-link-4" class="dummy-link">&nbsp;</div>
 								<div class="summary">
 									<div class="row">
-										<dl>
-										<a href="" id="topEl"></a>
-											<dt>Machine name</dt>
-											<dd>handsome frank</dd>
-										</dl>
+										<div class="wrap">
+											<dl>
+												<dt><span class="snf-PC_fill icon"></span>Machine name</dt>
+												<dd>handsome frank</dd>
+											</dl>
+										</div>
 									</div>
 									<div class="row">
-										<h2>Images</h2>
-										<dl>
-											<dt>Name</dt>
-											<dd>Debian Base</dd>
-											<dt>Desciption</dt>
-											<dd>open suse description open suse description open suse description open suse description open suse description</dd>
-											<dt>os</dt>
-											<dd>Debian</dd>
-											<dt>Size</dt>
-											<dd>10.4GB</dd>
-											<dt>GUI</dt>
-											<dd>No GUI</dd>
-											<dt>Kernel</dt>
-											<dd>2.3.4</dd>
-										</dl>
+										<div class="wrap">
+											<dl>
+												<dt>Image</dt>
+												<dd>Fedora</dd>
+												<dt>Name</dt>
+												<dd>Debian Base</dd>
+												<dt>Desciption</dt>
+												<dd>open suse description open suse description open suse description open suse description open suse description</dd>
+												<dt>os</dt>
+												<dd>Debian</dd>
+												<dt>Size</dt>
+												<dd>10.4GB</dd>
+												<dt>GUI</dt>
+												<dd>No GUI</dd>
+												<dt>Kernel</dt>
+												<dd>2.3.4</dd>
+											</dl>
+										</div>
 									</div>
 									<div class="row">
-										<h2>Flavor</h2>
-										<dl>
-											<dt><span class="snf-cpu icon"></span>CPUs</dt>
-											<dd>4x</dd>
-											<dt><span class="snf-ram icon"></span>Memory</dt>
-											<dd>512 MB</dd>
-											<dt><span class="snf-HDD icon"></span>Disk</dt>
-											<dd>4GB</dd>
-											<dt><span class="snf-HDD icon"></span>Storage Type</dt>
-											<dd>DRBD</dd>
-										</dl>
+										<div class="wrap">
+											<h2>Flavor</h2>
+											<dl>
+												<dt><span class="snf-cpu icon"></span>CPUs</dt>
+												<dd>4x</dd>
+												<dt><span class="snf-ram icon"></span>Memory</dt>
+												<dd>512 MB</dd>
+												<dt><span class="snf-HDD icon"></span>Disk</dt>
+												<dd>4GB</dd>
+												<dt><span class="snf-HDD icon"></span>Storage Type</dt>
+												<dd>DRBD</dd>
+											</dl>
+										</div>
 									</div>
 									<div class="row">
-										<dl>
-											<dt>Machine Tags</dt>
-											<dd>Database server</dd>
-											<dt>SSH Keys</dt>
-											<dd>
-												my public key 1<br>
-												my public key 3<br>
-											</dd>
-											<dt>IPs</dt>
-											<dd>192.168.1.3<br>192.168.1.3</dd>
-											<dt>Private networks</dt>
-											<dd>No private networks selected</dd>
-										</dl>
+										<div class="wrap">
+											<dl>
+												<dt>Machine Tags</dt>
+												<dd>Database server</dd>
+												<dt>SSH Keys</dt>
+												<dd>
+													my public key 1<br>
+													my public key 3<br>
+												</dd>
+												<dt>IPs</dt>
+												<dd>192.168.1.3<br>192.168.1.3</dd>
+												<dt>Private networks</dt>
+												<dd>No private networks selected</dd>
+											</dl>
+										</div>
 									</div>
 								</div>
 							</div>
