﻿.touts-block {
    width:auto;
    background-color:red;
}

.Touts-heading {
    padding:70px 0 30px 0;
}

.categories-block .rtm-image-container img {width:100%;}

.tout {
    height:inherit;
}



.touts-block button {
    margin-bottom: 0px;
}

.toutwidthfull img{
    width:100%;
}

.toutwidthfull{
    padding:0px;
}

.touts-block .desktop-tablet .tout{
    margin-top: 0px;
}

.overlay-text{
    position:absolute;
    bottom:0;
    text-align:center;
    width:100%;
    background-color: #000;
    opacity: 0.5;
    padding-top:4px;
    padding-bottom:6px;
}

#touts_overlay .contentalign{
    margin:0px;
    /*min-height:0px!important;*/
}

#touts_overlay .heading_align{
    /*min-height:0px!important;*/
}

.categories-block {
    margin-top:68px;
    margin-bottom:52px;
}

@media screen and (max-width:1083px) {
    .desktop-only {display:none;}
}

/**************************************    
*   All touts-block's 
***************************************/
.touts-block .contentalign {

    text-align: center;
}
@media only screen and (min-width:1084px) {
    .touts-block .contentalign {
        margin-top: 0px;
        text-align: center;
    }

    .touts-block .outer-tout {
        width: 100%;
        display: inline-block;
    }
}
@media screen and (min-width: 540px){
    .categories-block.full-width-content, .home-categories.full-width-content{
        margin-left: 0px;
        margin-right: 0px;
    }
    .touts-inner-block.desktop-tablet {
        display: block;
    }
    .touts-inner-block.mobile {
        display: none;
    }
}
@media screen and (max-width:539px){
    /* This takes the place of the s-col-1-8 Gutter from MS Redlines*/
    /*.categories-block.full-width-content, .home-categories.full-width-content{
        margin-left: 10%;
        margin-right: 10%;
    }*/
    .touts-inner-block.desktop-tablet {
        display: none;
    }
    .touts-inner-block.mobile {
        display: block;
    }

    .Touts-heading {
        padding-top:27px;
        padding-bottom: 5px;
    }

    .slick-slider { margin-bottom:48px;}
}

/**************************************    
*   Tri Pane  & 
***************************************/
.tri-panel .touts-inner-block .heading_align a {
    color: #0078d7;
}
.tri-panel .touts-inner-block h4 {
    margin:0px;
}


.full-div-clickability{
  /* To use: 
    1. put in an <a>
    2. in that <a>, put <span></span>
    3. Make parent position: relative   */
  position:absolute; 
  width:100%;
  height:100%;
  top:0;
  left: 0;

  /* edit: added z-index */
  z-index: 1;

  /* edit: fixes overlap error in IE7/8, 
     make sure you have an empty gif */
  background-image: url('empty.gif');
 
}

@media only screen and (min-width: 1084px) {
    .tri-panel .touts-inner-block .outer-tout {
        padding-top: 84px;
        padding-bottom: 74px;
    }
   .tri-panel .touts-inner-block .rtm-image-container {
       margin-bottom: 21px;
   }
   .tri-panel .touts-inner-block .heading_align {
       margin-bottom: 12px;
   }
   
}

@media only screen and (min-width:540px) and (max-width:1083px) {
    .tri-panel .touts-inner-block .outer-tout {
        padding-top: 64px;
        padding-bottom: 62px;
    }
   .tri-panel .touts-inner-block .rtm-image-container {
       margin-bottom: 14px;
   }
   .tri-panel .touts-inner-block .heading_align {
       margin-bottom: 12px;
   }
}

@media screen and (max-width:539px) {
    .tri-panel .touts-inner-block .outer-tout {
        margin-top: 48px;
        padding-bottom: 0px;
    }
    .tri-panel .outer-tout {
        padding-bottom: 38px;
    }
   .tri-panel .touts-inner-block .rtm-image-container {
       margin-bottom: 16px;
   }
   .tri-panel .touts-inner-block .heading_align {
       margin-top:23px;
       margin-bottom:8px;
   }
   .tri-panel .touts-inner-block .description {
       margin-bottom: 45px;
   }
}

/**************************************    
*   Home cat
***************************************/
.home-categories .category-heading {
    color: black
}
.home-categories .heading_align a{
    color: black;
}

/* extra spacing when the catagories are stacked */
@media only screen and (max-width:768px)  and (min-width: 540px){
    .home-categories .outer-tout .tout:first-child{
        margin-bottom: 62px;
    }
}


@media only screen and (min-width: 1084px) {
    .home-categories .touts-inner-block .outer-tout{
        padding-top: 84px;
        padding-bottom: 0px;
    }
    .home-categories .category-heading {
        margin-top: 30px;
        margin-bottom: 0px;
    }
}

@media only screen and (min-width:540px) and (max-width:1083px) {
    .home-categories .touts-inner-block .outer-tout .rtm-image-container{
        padding-top: 0px;
        padding-bottom: 0px;
    }
    .home-categories .touts-inner-block .outer-tout{
        padding-top: 64px;
        padding-bottom: 0px;
    }
    .home-categories .category-heading {
        margin-top: 25px;
        margin-bottom: 0px;
    }
    
}

@media only screen and (max-width:539px){
    .home-categories .touts-inner-block .outer-tout{
        padding-bottom: 8px;
    }

    .home-categories .touts-inner-block .rtm-image-container{
        margin-top: 48px;
        padding-bottom: 0px;
    }
    .home-categories .touts-inner-block .tout:first-child{
        margin-bottom: 28px;
    }
    .home-categories .category-heading {
        margin-top: 14px;
        margin-bottom: 0px;
    }
}

/**************************************    
*   Cat block
***************************************/
@media only screen and (min-width:1084px) {
    .categories-block .touts-inner-block .rtm-image-container{
        padding-bottom: 20px;  /*24, but now less to hit redlines */
    }
    .categories-block .touts-inner-block .outer-tout {
        padding-top: 80px; 
        padding-bottom: 48px;  /* 24 on tout and 15ish extra from mobile bug.*/
    }
    .categories-block .tout { 
        padding-bottom: 24px;
    }
}
@media only screen and (min-width:540px) and (max-width:1083px) {
    .categories-block {
        margin-top:52px;
        margin-bottom:28px;
    }

    .categories-block .touts-inner-block .rtm-image-container{
        padding-bottom: 17px;
    }
    .categories-block .tout { 
        padding-bottom: 31px;
    }
    .categories-block .outer-tout{
        padding-top: 64px;
        padding-bottom: 22px; /* 64*/
    }
    
}
@media only screen and (max-width:539px) {
    .categories-block {
        margin-top:36px;
        margin-bottom:13px;
    }

    .categories-block .touts-inner-block .rtm-image-container{
        padding-bottom: 16px;
    }
    .categories-block .tout { 
        padding-bottom: 28px;
    }
    .categories-block .outer-tout{
        padding-top: 48px;
        padding-bottom: 16px; /* 32 + 16 = 48*/
    }
}

/* CHEVRONS*/
.categories-block .heading_align .Chevron, .categories-block .mobile .heading_align .Chevron{
    color: #0078d7;
    width: 100%;
    padding-right: 14px;
    background-image: url("http://compass.microsoft.com/assets/a0/92/a0926a43-a44b-49fe-9354-e1ea5ee895cc.png?n=icon-ChevronRightSmallBlue_0078d7.png");
    background-size: 10px 10px;
    background-repeat: no-repeat;
    background-position: right;
    background-position-y: 60%;
    height: 14px;
    text-align: left;
    font-size: 100%;
    opacity: 1.0;
}

.home-categories .heading_align .chevron-heading {
    color: #0078d7;
    padding-right: 20px;
    background-image: url("http://compass.microsoft.com/assets/a0/92/a0926a43-a44b-49fe-9354-e1ea5ee895cc.png?n=icon-ChevronRightSmallBlue_0078d7.png");
    background-size: 16px 16px;
    background-repeat: no-repeat;
    background-position: right;
    background-position-y: 60%;
}