html {
    color: #222;
    font-size: 15px;
    line-height: 120%;
}
html, body { position: relative; height: 100%; min-height: 550px; background: #fff; font-family: 'Neue Helvetica W02', Helvetica, Arial, sans-serif; }

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}


* { box-sizing:border-box; }
img { border: none; max-width: 100%; display: block; }

h2 {font-size:20px; font-weight:600; line-height:120%;}
h3 {font-size:16px; font-weight:400; line-height:120%;}

.link { color: #de1f39; }

/* ==========================================================================
   custom styles
   ========================================================================== */

/***************************************
* grid system         *
***************************************/
    .grid-container{
        width: 100%; 
        max-width: 980px;      
		margin:0 auto;
    }

    .grid-container-fluid {
        width: 90%; 
        max-width: 90%;      
		margin:0 auto;
    }

    /*-- our cleafix hack -- */ 
    .row:before, 
    .row:after {
        content:"";
          display: table ;
        clear:both;
    }
    /*-- our 
	cleafix hack -- */ 
    .row:before, 
    .row:after {
        content:"";
        display: table ;
         clear:both;
    }

	.row {padding:20px;}

    [class*='col-'] {
        float: left; 
        min-height: 1px; 
        width: 16.66%; 
        /*-- our gutter -- */
        padding: 12px; 
       // background-color: #FFDCDC;
    }

    .col-1{ width: 16.66%; }
    .col-2{ width: 33.33%; }
    .col-3{ width: 50%;    }
    .col-4{ width: 66.66%; }
    .col-5{ width: 83.33%; }
    .col-6{ width: 100%;   }

    .outline, .outline *{
        outline: 1px solid #F6A1A1; 
    }


    @media all and (max-width:767px){
        .col-1{ width: 33.33%;}
        .col-2{ width: 100%;}
        .col-3{ width: 83.33%;}
        .col-4{ width: 100%;}
        .col-5{ width: 100%;}
        .col-6{ width: 100%;}
		
		.product .col-3, .user-content-wrapp .col-3{width:50%;}
		
		.row {padding:20px;}
		.product.row {padding:10px;}
		
		
        /*.row .col-2:last-of-type{
            width: 100%; 
        }*/

        .row .col-5 ~ .col-1{
            width: 100%; 
        }
    }

    @media all and (max-width:650px){
        .col-1{ width: 50%;}
        .col-2{ width: 100%;}
        .col-3{ width: 100%;}
        .col-4{ width: 100%;}
        .col-5{ width: 100%;}
        .col-6{ width: 100%;}
	    [class*='col-'] {
			padding: 10px; 
		}
    }
    
    @media all and (max-width:480px){
		
		.user-content-wrapp .col-3{width:100%;}
		
    }

/***************************************
* grid system         *
***************************************/

.mLeft10 {position:relative; left:-10px;}
.mRight10 {position:relative; right:-10px;}

.header {min-height:60px; position:relative;}
.header .logo {width:110px; height:37px; position:absolute; left:20px; top:20px;}

.listing  {background:#f7f9f9; margin-top:20px;}
.list-row {border-bottom:1px solid #dee3e6; margin-left:10px; margin-right:10px;}
.listing-title {font-size:32px; line-height:36px; padding:0 0 15px 0; margin-bottom:5px; border-bottom:1px solid #dee3e6; }
.list-row img {width:23px; height:18px; float:left; margin-right:10px;}
.list-row span {display:inline-block; margin:0 10px 0 0px; line-height:20px;}
.list-row  a {display:inline-block; width:100%; color:#000; font-weight:600; background:url("../img/arrow-circle-right.png") no-repeat center right #f7f9f9; background-size:25px; padding:11px 0 11px 0;}
.list-row  a:hover span{ color:#de1f39; }
.listing .list-row:last-child {border-bottom:0;}

.region-selected {float:right; text-align:right; padding:20px; display:block; color:#000; text-decoration:none;}
.region-selected-image {width:23px; text-align:right; float:right; margin-bottom:10px;}
.region-selected-title {margin:10px 0 0 0; clear:both; font-size:16px;}

.user-content-wrapp { padding-bottom:20px;}
.user-content-wrapp .col-3 {/*border-bottom:1px solid #e1e6e9;*/}

.user-content-wrapp .region:last-child {border-bottom:0;}

.user-content {background:url("../img/arrow-circle-right2.png") no-repeat 98% 5px  #eaebec; position:relative; border:8px solid #eaebec; background-size:25px; display:block; color:#000; text-decoration:none; min-height:130px;}
.user-content:hover {color:#de1f39;}
.user-content h3 {margin:5px; padding:40px 20px 20px 0px; background:url("../img/doc-icon.png") no-repeat top left; background-size:17px; font-size:15px; min-height:80px; font-weight:600; position:absolute; left:0; top:0;}
.user-content-wrapp .row {padding:0;}

.footer.row{padding-top:30px; padding-bottom:30px; background:#f7f9f9;}
.footer {font-size:12px;}


/* ==========================================================================
   Media Queries
   ========================================================================== */

@media all and (max-width: 767px) {
	.product-image {padding:10px;}
	.user-content {margin-left:-10px; margin-right:10px;}
}

@media all and (max-width: 480px) {
	.region-title {font-size:22px; line-height:28px; }
	.region-selected { padding:10px 10px 10px 20px;}
	.region-selected-title {margin:30px 0 0 0; font-size:13px;}
	.list-row { margin-left:5px; margin-right:5px;}
	.list-row a {font-weight:300;}
	.user-content {margin-left:-10px; margin-right:0px;}
	
}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {

}

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
    *,
    *:before,
    *:after {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}