[SITE] update bootstap - xs breakpoint changed, img-rounded was renamed

assets/css/foundation.css

@@ -6,7 +6,10 @@
   *::before,
   *::after,
   *::first-letter,
-  *::first-line {
+  p::first-line,
+  div::first-line,
+  blockquote::first-line,
+  li::first-line {
     text-shadow: none !important;
     box-shadow: none !important; }
   a,
@@ -14,6 +17,8 @@
     text-decoration: underline; }
   abbr[title]::after {
     content: " (" attr(title) ")"; }
+  pre {
+    white-space: pre-wrap !important; }
   pre,
   blockquote {
     border: 1px solid #999;
@@ -185,9 +190,7 @@ input,
 button,
 select,
 textarea {
-  margin: 0;
+  line-height: inherit; }
-  line-height: inherit;
-  border-radius: 0; }
 
 input[type="radio"]:disabled,
 input[type="checkbox"]:disabled {
@@ -279,7 +282,7 @@ hr {
 
 small,
 .small {
-  font-size: 80%;
+  font-size: 0.875rem;
   font-weight: normal; }
 
 mark,
@@ -342,18 +345,22 @@ dl.row > dd + dt {
     content: "";
     display: table;
     clear: both; }
-  @media (min-width: 544px) {
+  @media (min-width: 576px) {
     .container {
-      max-width: 576px; } }
+      width: 540px;
+      max-width: 100%; } }
   @media (min-width: 768px) {
     .container {
-      max-width: 720px; } }
+      width: 720px;
+      max-width: 100%; } }
   @media (min-width: 992px) {
     .container {
-      max-width: 940px; } }
+      width: 960px;
+      max-width: 100%; } }
   @media (min-width: 1200px) {
     .container {
-      max-width: 1140px; } }
+      width: 1140px;
+      max-width: 100%; } }
 
 .container-fluid {
   margin-left: auto;
@@ -366,18 +373,50 @@ dl.row > dd + dt {
     clear: both; }
 
 .row {
-  margin-left: -15px;
+  margin-right: -15px;
-  margin-right: -15px; }
+  margin-left: -15px; }
   .row::after {
     content: "";
     display: table;
     clear: both; }
+  @media (min-width: 576px) {
+    .row {
+      margin-right: -15px;
+      margin-left: -15px; } }
+  @media (min-width: 768px) {
+    .row {
+      margin-right: -15px;
+      margin-left: -15px; } }
+  @media (min-width: 992px) {
+    .row {
+      margin-right: -15px;
+      margin-left: -15px; } }
+  @media (min-width: 1200px) {
+    .row {
+      margin-right: -15px;
+      margin-left: -15px; } }
 
-.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 {
+.col-xs, .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-xl, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 {
   position: relative;
   min-height: 1px;
   padding-right: 15px;
   padding-left: 15px; }
+  @media (min-width: 576px) {
+    .col-xs, .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-xl, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 {
+      padding-right: 15px;
+      padding-left: 15px; } }
+  @media (min-width: 768px) {
+    .col-xs, .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-xl, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 {
+      padding-right: 15px;
+      padding-left: 15px; } }
+  @media (min-width: 992px) {
+    .col-xs, .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-xl, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 {
+      padding-right: 15px;
+      padding-left: 15px; } }
+  @media (min-width: 1200px) {
+    .col-xs, .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-xl, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 {
+      padding-right: 15px;
+      padding-left: 15px; } }
 
 .col-xs-1 {
   float: left;
@@ -538,7 +577,7 @@ dl.row > dd + dt {
 .offset-xs-11 {
   margin-left: 91.66667%; }
 
-@media (min-width: 544px) {
+@media (min-width: 576px) {
   .col-sm-1 {
     float: left;
     width: 8.33333%; }
@@ -1595,6 +1634,12 @@ input[type="button"].btn-block {
   .collapse.in {
     display: block; }
 
+tr.collapse.in {
+  display: table-row; }
+
+tbody.collapse.in {
+  display: table-row-group; }
+
 .collapsing {
   position: relative;
   height: 0;
@@ -1607,7 +1652,6 @@ input[type="button"].btn-block {
   background-color: #f7f7f9; }
 
 .bg-primary {
-  color: #fff !important;
   background-color: #0275d8 !important; }
 
 a.bg-primary:focus,
@@ -1615,7 +1659,6 @@ a.bg-primary:hover {
   background-color: #025aa5 !important; }
 
 .bg-success {
-  color: #fff !important;
   background-color: #5cb85c !important; }
 
 a.bg-success:focus,
@@ -1623,7 +1666,6 @@ a.bg-success:hover {
   background-color: #449d44 !important; }
 
 .bg-info {
-  color: #fff !important;
   background-color: #5bc0de !important; }
 
 a.bg-info:focus,
@@ -1631,7 +1673,6 @@ a.bg-info:hover {
   background-color: #31b0d5 !important; }
 
 .bg-warning {
-  color: #fff !important;
   background-color: #f0ad4e !important; }
 
 a.bg-warning:focus,
@@ -1639,7 +1680,6 @@ a.bg-warning:hover {
   background-color: #ec971f !important; }
 
 .bg-danger {
-  color: #fff !important;
   background-color: #d9534f !important; }
 
 a.bg-danger:focus,
@@ -1647,13 +1687,34 @@ a.bg-danger:hover {
   background-color: #c9302c !important; }
 
 .bg-inverse {
-  color: #fff !important;
   background-color: #373a3c !important; }
 
 a.bg-inverse:focus,
 a.bg-inverse:hover {
   background-color: #1f2021 !important; }
 
+.rounded {
+  border-radius: 0.25rem; }
+
+.rounded-top {
+  border-top-right-radius: 0.25rem;
+  border-top-left-radius: 0.25rem; }
+
+.rounded-right {
+  border-bottom-right-radius: 0.25rem;
+  border-top-right-radius: 0.25rem; }
+
+.rounded-bottom {
+  border-bottom-right-radius: 0.25rem;
+  border-bottom-left-radius: 0.25rem; }
+
+.rounded-left {
+  border-bottom-left-radius: 0.25rem;
+  border-top-left-radius: 0.25rem; }
+
+.rounded-circle {
+  border-radius: 50%; }
+
 .clearfix::after {
   content: "";
   display: table;
@@ -1668,45 +1729,45 @@ a.bg-inverse:hover {
 .d-inline {
   display: inline !important; }
 
-.pull-xs-left {
+.float-xs-left {
   float: left !important; }
 
-.pull-xs-right {
+.float-xs-right {
   float: right !important; }
 
-.pull-xs-none {
+.float-xs-none {
   float: none !important; }
 
-@media (min-width: 544px) {
+@media (min-width: 576px) {
-  .pull-sm-left {
+  .float-sm-left {
     float: left !important; }
-  .pull-sm-right {
+  .float-sm-right {
     float: right !important; }
-  .pull-sm-none {
+  .float-sm-none {
     float: none !important; } }
 
 @media (min-width: 768px) {
-  .pull-md-left {
+  .float-md-left {
     float: left !important; }
-  .pull-md-right {
+  .float-md-right {
     float: right !important; }
-  .pull-md-none {
+  .float-md-none {
     float: none !important; } }
 
 @media (min-width: 992px) {
-  .pull-lg-left {
+  .float-lg-left {
     float: left !important; }
-  .pull-lg-right {
+  .float-lg-right {
     float: right !important; }
-  .pull-lg-none {
+  .float-lg-none {
     float: none !important; } }
 
 @media (min-width: 1200px) {
-  .pull-xl-left {
+  .float-xl-left {
     float: left !important; }
-  .pull-xl-right {
+  .float-xl-right {
     float: right !important; }
-  .pull-xl-none {
+  .float-xl-none {
     float: none !important; } }
 
 .sr-only {
@@ -1731,191 +1792,194 @@ a.bg-inverse:hover {
 .w-100 {
   width: 100% !important; }
 
-.m-x-auto {
+.h-100 {
+  height: 100% !important; }
+
+.mx-auto {
   margin-right: auto !important;
   margin-left: auto !important; }
 
-.m-a-0 {
+.m-0 {
   margin: 0 0 !important; }
 
-.m-t-0 {
+.mt-0 {
   margin-top: 0 !important; }
 
-.m-r-0 {
+.mr-0 {
   margin-right: 0 !important; }
 
-.m-b-0 {
+.mb-0 {
   margin-bottom: 0 !important; }
 
-.m-l-0 {
+.ml-0 {
   margin-left: 0 !important; }
 
-.m-x-0 {
+.mx-0 {
   margin-right: 0 !important;
   margin-left: 0 !important; }
 
-.m-y-0 {
+.my-0 {
   margin-top: 0 !important;
   margin-bottom: 0 !important; }
 
-.m-a-1 {
+.m-1 {
   margin: 1rem 1rem !important; }
 
-.m-t-1 {
+.mt-1 {
   margin-top: 1rem !important; }
 
-.m-r-1 {
+.mr-1 {
   margin-right: 1rem !important; }
 
-.m-b-1 {
+.mb-1 {
   margin-bottom: 1rem !important; }
 
-.m-l-1 {
+.ml-1 {
   margin-left: 1rem !important; }
 
-.m-x-1 {
+.mx-1 {
   margin-right: 1rem !important;
   margin-left: 1rem !important; }
 
-.m-y-1 {
+.my-1 {
   margin-top: 1rem !important;
   margin-bottom: 1rem !important; }
 
-.m-a-2 {
+.m-2 {
   margin: 1.5rem 1.5rem !important; }
 
-.m-t-2 {
+.mt-2 {
   margin-top: 1.5rem !important; }
 
-.m-r-2 {
+.mr-2 {
   margin-right: 1.5rem !important; }
 
-.m-b-2 {
+.mb-2 {
   margin-bottom: 1.5rem !important; }
 
-.m-l-2 {
+.ml-2 {
   margin-left: 1.5rem !important; }
 
-.m-x-2 {
+.mx-2 {
   margin-right: 1.5rem !important;
   margin-left: 1.5rem !important; }
 
-.m-y-2 {
+.my-2 {
   margin-top: 1.5rem !important;
   margin-bottom: 1.5rem !important; }
 
-.m-a-3 {
+.m-3 {
   margin: 3rem 3rem !important; }
 
-.m-t-3 {
+.mt-3 {
   margin-top: 3rem !important; }
 
-.m-r-3 {
+.mr-3 {
   margin-right: 3rem !important; }
 
-.m-b-3 {
+.mb-3 {
   margin-bottom: 3rem !important; }
 
-.m-l-3 {
+.ml-3 {
   margin-left: 3rem !important; }
 
-.m-x-3 {
+.mx-3 {
   margin-right: 3rem !important;
   margin-left: 3rem !important; }
 
-.m-y-3 {
+.my-3 {
   margin-top: 3rem !important;
   margin-bottom: 3rem !important; }
 
-.p-a-0 {
+.p-0 {
   padding: 0 0 !important; }
 
-.p-t-0 {
+.pt-0 {
   padding-top: 0 !important; }
 
-.p-r-0 {
+.pr-0 {
   padding-right: 0 !important; }
 
-.p-b-0 {
+.pb-0 {
   padding-bottom: 0 !important; }
 
-.p-l-0 {
+.pl-0 {
   padding-left: 0 !important; }
 
-.p-x-0 {
+.px-0 {
   padding-right: 0 !important;
   padding-left: 0 !important; }
 
-.p-y-0 {
+.py-0 {
   padding-top: 0 !important;
   padding-bottom: 0 !important; }
 
-.p-a-1 {
+.p-1 {
   padding: 1rem 1rem !important; }
 
-.p-t-1 {
+.pt-1 {
   padding-top: 1rem !important; }
 
-.p-r-1 {
+.pr-1 {
   padding-right: 1rem !important; }
 
-.p-b-1 {
+.pb-1 {
   padding-bottom: 1rem !important; }
 
-.p-l-1 {
+.pl-1 {
   padding-left: 1rem !important; }
 
-.p-x-1 {
+.px-1 {
   padding-right: 1rem !important;
   padding-left: 1rem !important; }
 
-.p-y-1 {
+.py-1 {
   padding-top: 1rem !important;
   padding-bottom: 1rem !important; }
 
-.p-a-2 {
+.p-2 {
   padding: 1.5rem 1.5rem !important; }
 
-.p-t-2 {
+.pt-2 {
   padding-top: 1.5rem !important; }
 
-.p-r-2 {
+.pr-2 {
   padding-right: 1.5rem !important; }
 
-.p-b-2 {
+.pb-2 {
   padding-bottom: 1.5rem !important; }
 
-.p-l-2 {
+.pl-2 {
   padding-left: 1.5rem !important; }
 
-.p-x-2 {
+.px-2 {
   padding-right: 1.5rem !important;
   padding-left: 1.5rem !important; }
 
-.p-y-2 {
+.py-2 {
   padding-top: 1.5rem !important;
   padding-bottom: 1.5rem !important; }
 
-.p-a-3 {
+.p-3 {
   padding: 3rem 3rem !important; }
 
-.p-t-3 {
+.pt-3 {
   padding-top: 3rem !important; }
 
-.p-r-3 {
+.pr-3 {
   padding-right: 3rem !important; }
 
-.p-b-3 {
+.pb-3 {
   padding-bottom: 3rem !important; }
 
-.p-l-3 {
+.pl-3 {
   padding-left: 3rem !important; }
 
-.p-x-3 {
+.px-3 {
   padding-right: 3rem !important;
   padding-left: 3rem !important; }
 
-.p-y-3 {
+.py-3 {
   padding-top: 3rem !important;
   padding-bottom: 3rem !important; }
 
@@ -1946,7 +2010,7 @@ a.bg-inverse:hover {
 .text-xs-center {
   text-align: center !important; }
 
-@media (min-width: 544px) {
+@media (min-width: 576px) {
   .text-sm-left {
     text-align: left !important; }
   .text-sm-right {
@@ -1996,47 +2060,57 @@ a.bg-inverse:hover {
 .font-italic {
   font-style: italic; }
 
+.text-white {
+  color: #fff !important; }
+
 .text-muted {
   color: #818a91 !important; }
 
 a.text-muted:focus,
 a.text-muted:hover {
-  color: #687077; }
+  color: #687077 !important; }
 
 .text-primary {
   color: #0275d8 !important; }
 
 a.text-primary:focus,
 a.text-primary:hover {
-  color: #025aa5; }
+  color: #025aa5 !important; }
 
 .text-success {
   color: #5cb85c !important; }
 
 a.text-success:focus,
 a.text-success:hover {
-  color: #449d44; }
+  color: #449d44 !important; }
 
 .text-info {
   color: #5bc0de !important; }
 
 a.text-info:focus,
 a.text-info:hover {
-  color: #31b0d5; }
+  color: #31b0d5 !important; }
 
 .text-warning {
   color: #f0ad4e !important; }
 
 a.text-warning:focus,
 a.text-warning:hover {
-  color: #ec971f; }
+  color: #ec971f !important; }
 
 .text-danger {
   color: #d9534f !important; }
 
 a.text-danger:focus,
 a.text-danger:hover {
-  color: #c9302c; }
+  color: #c9302c !important; }
+
+.text-gray-dark {
+  color: #373a3c !important; }
+
+a.text-gray-dark:focus,
+a.text-gray-dark:hover {
+  color: #1f2021 !important; }
 
 .text-hide {
   font: 0/0 a;
@@ -2051,11 +2125,11 @@ a.text-danger:hover {
 .hidden-xs-up {
   display: none !important; }
 
-@media (max-width: 543px) {
+@media (max-width: 575px) {
   .hidden-xs-down {
     display: none !important; } }
 
-@media (min-width: 544px) {
+@media (min-width: 576px) {
   .hidden-sm-up {
     display: none !important; } }
 
@@ -2108,7 +2182,7 @@ a.text-danger:hover {
   .hidden-print {
     display: none !important; } }
 
-@media (max-width: 543px) {
+@media (max-width: 575px) {
   .row {
     margin-left: 0;
     margin-right: 0; } }

assets/css/main.css

@@ -98,7 +98,7 @@ nav {
     nav ul.nav a:hover, nav ul.nav a:focus {
       text-decoration: none; }
 
-@media (min-width: 544px) {
+@media (min-width: 576px) {
   nav {
     float: right; }
     nav ul.nav a {
@@ -112,7 +112,7 @@ nav {
     nav ul.nav a.section {
       font-weight: 500; } }
 
-@media (max-width: 543px) {
+@media (max-width: 575px) {
   nav button.navbar-toggler {
     float: right;
     margin-top: 24px;
@@ -142,7 +142,7 @@ footer {
   color: #000; }
   footer p {
     margin-bottom: 0; }
-  @media (max-width: 543px) {
+  @media (max-width: 575px) {
     footer {
       text-align: center; }
       footer p {
@@ -168,7 +168,7 @@ html {
   position: relative;
   min-height: 100%; }
 
-@media (min-width: 544px) {
+@media (min-width: 576px) {
   body {
     /* Margin bottom by footer height */
     margin-bottom: 115px; }
@@ -178,7 +178,7 @@ html {
     width: 100%;
     height: 85px; } }
 
-@media (max-width: 543px) {
+@media (max-width: 575px) {
   body {
     /* Margin bottom by footer height */
     margin-bottom: 205px; }
@@ -197,7 +197,7 @@ html {
 .center {
   text-align: center; }
 
-@media (max-width: 543px) {
+@media (max-width: 575px) {
   .col-xxs-12.right, .col-xxs-12.center {
     text-align: inherit; } }
 
@@ -205,7 +205,7 @@ html {
 .visible-xxs {
   display: none !important; }
 
-@media (max-width: 543px) {
+@media (max-width: 575px) {
   .col-xxs-12 {
     float: none;
     width: 100%;

assets/css/templates/photo.css

@@ -13,13 +13,13 @@ a {
 main p a:visited {
   color: #cccccc; }
 
-@media (min-width: 544px) {
+@media (min-width: 576px) {
   nav ul.nav {
     color: #fff; }
     nav ul.nav a.section:hover, nav ul.nav a.section:focus {
       border: none; } }
 
-@media (max-width: 543px) {
+@media (max-width: 575px) {
   .navbar-toggler {
     color: #fff; } }
 
@@ -33,26 +33,18 @@ div.carousel {
 
 .img-fluid, .carousel-inner > .carousel-item > img,
 .carousel-inner > .carousel-item > a > img {
-  display: block;
   max-width: 100%;
   height: auto; }
 
-.img-rounded {
-  border-radius: 0.3rem; }
-
 .img-thumbnail {
   padding: 0.25rem;
   background-color: #fff;
   border: 1px solid #ddd;
   border-radius: 0.25rem;
   transition: all 0.2s ease-in-out;
-  display: inline-block;
   max-width: 100%;
   height: auto; }
 
-.img-circle {
-  border-radius: 50%; }
-
 .figure {
   display: inline-block; }
 
@@ -208,7 +200,7 @@ div.carousel {
   .carousel-caption .btn {
     text-shadow: none; }
 
-@media (min-width: 544px) {
+@media (min-width: 576px) {
   .carousel-control .icon-prev,
   .carousel-control .icon-next {
     width: 30px;

assets/css/templates/project.css

@@ -2,26 +2,18 @@
  * for specific template
  */
 .img-fluid {
-  display: block;
   max-width: 100%;
   height: auto; }
 
-.img-rounded {
-  border-radius: 0.3rem; }
-
 .img-thumbnail {
   padding: 0.25rem;
   background-color: #fff;
   border: 1px solid #ddd;
   border-radius: 0.25rem;
   transition: all 0.2s ease-in-out;
-  display: inline-block;
   max-width: 100%;
   height: auto; }
 
-.img-circle {
-  border-radius: 50%; }
-
 .figure {
   display: inline-block; }
 

assets/css/templates/projects.css

@@ -10,26 +10,18 @@
     text-decoration: underline; }
 
 .img-fluid {
-  display: block;
   max-width: 100%;
   height: auto; }
 
-.img-rounded {
-  border-radius: 0.3rem; }
-
 .img-thumbnail {
   padding: 0.25rem;
   background-color: #fff;
   border: 1px solid #ddd;
   border-radius: 0.25rem;
   transition: all 0.2s ease-in-out;
-  display: inline-block;
   max-width: 100%;
   height: auto; }
 
-.img-circle {
-  border-radius: 50%; }
-
 .figure {
   display: inline-block; }
 
@@ -82,6 +74,7 @@
 
 .card-header {
   padding: 0.75rem 1.25rem;
+  margin-bottom: 0;
   background-color: #f5f5f5;
   border-bottom: 1px solid rgba(0, 0, 0, 0.125); }
   .card-header::after {
@@ -89,7 +82,7 @@
     display: table;
     clear: both; }
   .card-header:first-child {
-    border-radius: 0.25rem 0.25rem 0 0; }
+    border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0; }
 
 .card-footer {
   padding: 0.75rem 1.25rem;
@@ -100,7 +93,7 @@
     display: table;
     clear: both; }
   .card-footer:last-child {
-    border-radius: 0 0 0.25rem 0.25rem; }
+    border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px); }
 
 .card-header-tabs {
   margin-right: -0.625rem;
@@ -197,7 +190,7 @@
   border-left: 0; }
 
 .card-img {
-  border-radius: 0.25rem; }
+  border-radius: calc(0.25rem - 1px); }
 
 .card-img-overlay {
   position: absolute;
@@ -208,14 +201,14 @@
   padding: 1.25rem; }
 
 .card-img-top {
-  border-top-right-radius: 0.25rem;
+  border-top-right-radius: calc(0.25rem - 1px);
-  border-top-left-radius: 0.25rem; }
+  border-top-left-radius: calc(0.25rem - 1px); }
 
 .card-img-bottom {
-  border-bottom-right-radius: 0.25rem;
+  border-bottom-right-radius: calc(0.25rem - 1px);
-  border-bottom-left-radius: 0.25rem; }
+  border-bottom-left-radius: calc(0.25rem - 1px); }
 
-@media (min-width: 544px) {
+@media (min-width: 576px) {
   .card-deck {
     display: table;
     width: 100%;
@@ -230,7 +223,7 @@
     margin-right: -1.25rem;
     margin-left: -1.25rem; } }
 
-@media (min-width: 544px) {
+@media (min-width: 576px) {
   .card-group {
     display: table;
     width: 100%;
@@ -261,7 +254,7 @@
         .card-group .card:not(:first-child):not(:last-child) .card-img-bottom {
           border-radius: 0; } }
 
-@media (min-width: 544px) {
+@media (min-width: 576px) {
   .card-columns {
     column-count: 3;
     column-gap: 1.25rem; }

assets/css/templates/webdesign.css

@@ -12,32 +12,24 @@ main.webdesign .container {
   .featurette img {
     margin-top: 50px; } }
 
-@media (max-width: 543px) {
+@media (max-width: 575px) {
   .featurette img {
     margin: 0 auto;
     max-height: 200px; } }
 
 .img-fluid {
-  display: block;
   max-width: 100%;
   height: auto; }
 
-.img-rounded {
-  border-radius: 0.3rem; }
-
 .img-thumbnail {
   padding: 0.25rem;
   background-color: #fff;
   border: 1px solid #ddd;
   border-radius: 0.25rem;
   transition: all 0.2s ease-in-out;
-  display: inline-block;
   max-width: 100%;
   height: auto; }
 
-.img-circle {
-  border-radius: 50%; }
-
 .figure {
   display: inline-block; }
 

assets/scss/_mainvariables.scss

@@ -7,7 +7,7 @@ $link_color: $color_accent;
 $link_active: darken($color_accent, 10%);
 $link_visited: lighten($color_font, 60%);
 
-$col_xxs_bp: 543px;
+$col_xxs_bp: 575px;
 
 $nav_fgColor: #fff;
 

assets/vendors/bootstrap

@@ -1 +1 @@
-Subproject commit 6844745db5bdddca62fe7caf5c88dfda744babbe
+Subproject commit cf5d94f6d5685c371dcb157af74a3c6b14ec8d8e

assets/vendors/masonry

@@ -1 +1 @@
-Subproject commit 17e8737991be300c7137aa08f35bd935f0a87116
+Subproject commit 15de33ab47c8c6d0f1f2fc76338e74229d6317be

site/config/config.php

@@ -60,7 +60,7 @@ c::set('plg_carousel.dir', 'asc');   // sortBy direction: asc, desc
 c::set('plg_masonry.enable', true);
 c::set('plg_masonry.width', 155);
 c::set('plg_masonry.quality', 75);
-c::set('plg_masonry.class', 'img-rounded');
+c::set('plg_masonry.class', 'rounded');
 //c::set('plg_masonry.sizelimit', 1300);  // limit the source image size (long edge)
 c::set('plg_masonry.sort', 'sort');     // sortBy parameter: sort, title, etc.
 c::set('plg_masonry.dir', 'asc');       // sortBy direction: asc, desc

site/templates/webdesign.php

@@ -22,7 +22,7 @@ snippet('base/cont-header');
       </div>
       <div class="col-sm-3">
         <?php if ($img = $page->images()->find($page->featurette_img())) {
-          echo ThumbExt($img, ['width'=>235,'quality'=>70,'class'=>"img-fluid img-rounded",'alt'=>"Portrait",'inline-size'=>false]);
+          echo ThumbExt($img, ['width'=>235,'quality'=>70,'class'=>"img-fluid rounded",'alt'=>"Portrait",'inline-size'=>false]);
         }?>
       </div>
     </div>