body { color:#444; }
        /** {
              box-sizing: border-box;
            }*/
         .modal3 {
         display: none;
         height: 100%;
         left: 0;
         position: fixed;
         top: 0;
         width: 100%;
         }
         .modal3.open {
         display: grid;
         grid-template-rows: 48px auto 35px;
         }
         .modal3__content {
         overflow-y: auto;

            background-image: linear-gradient(#fff, #eee);
         }
         iframe {
         display: block;       /* iframes are inline by default */
         border: none;         /* Reset default border */
         height: 100vh;        /* Viewport-relative units */
         width: 100vw;
         }
         .footer {
         text-align: center;
         display: flex;
         justify-content:center;
         align-content:center;
         flex-direction:column; /* column | row */
         border-top: 1px solid #ccc;
         background-image: linear-gradient(#fff, #eee);
         }
         /*
         .footer-shadow {
         webkit-box-shadow: 0 -3px 10px 0 rgba(0,0,0,.0785);
         box-shadow: 0 -3px 10px 0 rgba(0,0,0,.0785);
         margin-top: 10px;
         }
         */
         body {margin:0;font-family:Arial}
         .topnav {
         overflow: hidden;
         /*background-color: #333;*/
         /*box-shadow: inset 0px 0px 150px 0px rgba(50, 50, 50, 0.12);*/
         background: white;
            background-image: linear-gradient(#fff, #eee /*#ddd*/);
         }
         .topnav a {
         float: left;
         display: block;
         color: #444;
         text-align: center;
         padding: 14px 16px;
         text-decoration: none;
         font-size: 17px;
         }
         .active {
         background-color: #aeaeae;
         color: black !important;
         }
         .topnav .icon {
         display: none;
         }
         .dropdown {
         float: left;
         overflow: hidden;
         }
         .dropdown .dropbtn {
         font-size: 17px;
         border: none;
         outline: none;
         color: #444;
         padding: 14px 16px;
         background-color: inherit;
         font-family: inherit;
         margin: 0;
         }
         .dropdown-content {
         display: none;
         position: absolute;
         background-color: #f9f9f9;
         min-width: 160px;
         box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
         z-index: 1;
         }
         .dropdown-content a {
         float: none;
         color: #444;
         /*padding: 12px 16px;*/
         padding-left:30px;
         text-decoration: none;
         display: block;
         text-align: left;
         }
         .topnav a:hover, .dropdown:hover .dropbtn {
         background-color: #555;
         color: white !important;
         }
         .dropdown-content a:hover {
         background-color: #eee; /*#ddd*/
         color: black !important;
         }
         .dropdown:hover .dropdown-content {
         display: block;
         }
         /*@media screen and (max-width:600px) {*/
         @media screen and (max-width: 800px) {
         .topnav a:not(:first-child), .dropdown .dropbtn {
         display: none;
         }
         .topnav a.icon {
         float: right;
         display: block;
         }
         }
         /*@media screen and (max-width: 600px) {*/
         @media screen and (max-width: 800px) {
         .topnav.responsive {position: relative;}
         .topnav.responsive .icon {
         position: absolute;
         right: 0;
         top: 0;
         }
         .topnav.responsive a {
         float: none;
         display: block;
         text-align: left;
         }
         .topnav.responsive .dropdown {float: none;}
         .topnav.responsive .dropdown-content {position: relative;}
         .topnav.responsive .dropdown .dropbtn {
         display: block;
         width: 100%;
         text-align: left;
         }
         }
         .header {border-bottom: 1px solid #ccc;}
         .logo {
         max-width: 300px;
         }
         .logo img {
         width: 100%;
         height: auto;
         }
         .logo a:hover {
         box-shadow: inset 0px 0px 150px 0px rgba(50, 50, 50, 0.12);
         background: white;
         }
         .logo a {
         /*padding:17px; */
         }

         .content {
             padding:10px 25px 10px 25px;
             max-width:960px;
             margin:0 auto;
         }




        .boxcontainer.categories {
            max-width: 960px;
            margin: 0 auto;
            padding: 0px 20px 0px 20px
        }
         .boxcontainer ul {
            margin: 0 -15px 0 0;
            padding: 0;
            list-style-type: none;
            /*width: 990px;*/
        }
        .boxcontainer li {
            margin: 0;
            padding: 0;
            float: left;
        }
        .box {
            margin: 0 15px 15px 0 !important;
            /*width: 479px;*/
            padding-top: 40px;
        }
        #left .bluebar, #right .bluebar, .half.bluebar, .box .bluebar {
            background-color: #777;
            height: 22px;
            padding: 7px 0 0 10px;
            color: #FFF;
            font-weight: bold;
            font-size: 14px;
            /*text-shadow: #084390 2px 2px 1px;*/

            border-radius: 10px;
            background-image: linear-gradient(to right, #555, #ccc);
            box-shadow: black 0px 0px 5px;
        }
        .box .thumb img {
            /*margin: 0 auto;*/
            float: left;
            margin-right: 20px;
            margin-bottom: 20px;
            border-radius: 10px;
        }
        a.thumb {
            margin-left:0px !important;
        }
        .categories .boxcontent p {
            /*width: 62% !important;*/
        }

        .boxcontent p {
            /*
            margin: 0 auto 10px auto;
            width: 70%;
            float: right;
            */
        }

        .boxcontent a {

            color: cornflowerblue;
            font-weight: bold;
            text-decoration: none;
        }

        .center {
            text-align: center;
        }
        .responsive {
            max-width: 100%
        }

        #iframe-container {
            background:url(../images/loader.gif) center top no-repeat;
        }


        blockquote {
            width: 50%;
            margin-left: auto;
            margin-right: auto;

            min-width: 300px;
            border: 1px solid #CCC;
            padding: 25px;
            border-radius: 50px;
            background: white;
            box-shadow: 0px 0px 14px -1px;
            /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&1+0,0+100;White+to+Transparent */
background: -moz-linear-gradient(-45deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(-45deg, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(135deg, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
        }
        .quotation{
          font-size: 20px;
          margin: 0 auto;
          quotes: "\201C""\201D""\2018""\2019";
          padding: 10px 20px;
          line-height: 1.4;

          font-family:garamond, bookman, serif;
        }

        .quotation:before {
          content: open-quote;
          display: inline;
          height: 0;
          line-height: 0;
          left: -10px;
          position: relative;
          top: 18px;
          color: #ccc;
          font-size: 3em;
        }
        .quotation::after {
          content: close-quote;
          display: inline;
          height: 0;
          line-height: 0;
          left: 10px;
          position: relative;
          top: 35px;
          color: #ccc;
          font-size: 3em;
        }
        .quotation-footer{
          margin:0;
          text-align: right;
          font-size: 1em;
          font-style: italic;
        }

        .maintext {
            padding: 0px 20px 0px 20px;
            border: 1px solid #ccc;
            border-radius: 10px;
            background: white;
        }
        .maintext .headline {

            font-weight: normal;
            font-size: 2em;
            color: #222222;
            font-family: 'Roboto Slab', garamond, georgia, serif;
        }

        h1 {
            max-width: 900px;
            margin-left: auto;
            margin-right: auto;
            color: #777;
            font-family: Trebuchet MS;
        }

        .maintext {
            max-width: 960px;
            margin: 0 auto;
            font-family: Georgia, serif;

        }
        .maintext img {
            max-width: 150px;
            border-radius: 15px;
        }
        .maintextcontentimageright {
            float: right;
            margin-left: 20px;
        	}
        .maintextcontentimageleft {
            float: left;
            margin-right: 20px;
        	}

        .maintextcontenttext {
        	}

        .advantages {
            margin: 0 auto;
            max-width: 960px;
            font-size: 2em;
            color: #777;
            font-family: Trebuchet MS;

            padding-top: 5px;
            padding-bottom: 5px;
            /*background-image: linear-gradient(#eee, #fff);*/
            border-radius: 30px;

			box-shadow: 0px 0px 16px #ccc;

			/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&1+0,0+100;White+to+Transparent */
            background: -moz-linear-gradient(-45deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
            background: -webkit-linear-gradient(-45deg, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
            background: linear-gradient(135deg, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
        }
        .advantagesheadline {
            text-align:center;
            color: #555;
            /*text-decoration: underline;*/
        }
        .advantages ul {
            columns:2;
        }
        @media screen and (max-width: 800px) {
            .advantages {
                font-size:1em;
            }
            .quotation {
                font-size:1em;
            }
            .quotation:before {
                top:17px;
            }.quotation:after {
                top:25px;
            }
            .quotation-footer{
                font-size:1em;
            }
        }
        .wrapper {
            /*max-width: 90%;*/
            margin: 0 auto;
        }
        .advantages ul {
            columns: 2;
            list-style: none;
        }
        .advantages ul li:before {
          content: '✓';
        }
        .wrapper {
            max-width: 960px;
            margin: 0 auto;
        }
        a#currentProduct { font-weight:bold; color:gray;}
        @media screen and (max-width: 800px) {
            a#currentProduct { font-size: 10px; padding-top: 19px; }
            .toggled { overflow: hidden; }
        }

        .productlink {
            text-align: center;
        }
        .productlink a {
            color: white;
            font-weight: bold;
            text-decoration: none;

            padding: 5px;
            border: cornflowerblue;
            border-radius: 5px;
            background: cornflowerblue;
        }
        .buttonlist {
            padding: 20px;
        }
        .buttonlist a {
            text-decoration: none;
        }
        a.mensbutton {
            color: cornflowerblue;
        }
        a.womensbutton {
            color: lightpink;
        }
        .button {
            font-family: helvetica;
            font-size: 2rem;
            /* text-decoration: none; */
            text-align: center;
            /* width: 50%; */
            margin-left: auto;
            margin-right: auto;
            min-width: 300px;
            border: 1px solid #CCC;
            padding: 25px;
            border-radius: 50px;
            background: white;
            box-shadow: 0px 0px 14px -1px;
            background: -moz-linear-gradient(-45deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
            background: -webkit-linear-gradient(-45deg, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
            background: linear-gradient(135deg, rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 );
        }
        .articlelist {
            padding-top: 5px;
            padding-bottom: 5px;
            font-family: serif;
        }
        .articlelist a {
            color: white;
            text-decoration: none;
            font-family: arial;
        }
        .articlelisttitle {
            padding: 5px;
            font-size: 2rem;
            font-family: helvetica;
            text-align: center;
        }
        .articletitle {
            padding: 5px;
        }
        /*
        .articletitle:before {
            content: "• ";
        }*/
        .articletitle a {
            text-decoration: none;
            color:white;
        }
        /*
        .articlelist.men a {
            color: cornflowerblue;
        }
        .articlelist.women a {
            color: lightpink;
        }
        */
        .articlelisttitle.men {
            color: cornflowerblue;
        }
        .articlelisttitle.women {
            color: lightpink;
        }
        .articlelist .box {
          margin:0px !important;
          padding-top:20px;
        }
        .articlelist .bluebar {
          height: unset;
          min-height: 22px;
        }
        .articlelist.men .bluebar {
            background-image: linear-gradient(to right, #555, cornflowerblue);
        }
        .articlelist.women .bluebar {
            background-image: linear-gradient(to right, #555, lightpink);
        }
        .articlelist h1 {
            color: white;
            margin: 0px;
        }
        .maintext.article {
          font-family:arial;
        }