﻿/* Built for matching styles on support pages via invision app */

/*Styles for SupportTopic*/
.support-topic-page {
    margin-bottom: 32px;
}
/*LIST STYLES*/
.l-site-support-content {
    background-color: #fff;
}
.support-topic-page .row #div-topic-main-body ul {
    list-style: none;
}
.support-topic-page .row #div-topic-main-body ul li::before {
    content: '\2022 ';
    color: #0074a1;
    margin-right: 8px;
    font-size: 1.3em;
    line-height: 0;
}

/*Search bar*/
.headerSearchCtrl {
    clear: none;
    padding-left: 10px;
    margin: 0;
    height: 55px;
    width: 510px;
    border: solid #e6e6e6 1px;
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    font-size: 21pt;
    color: #8c8c8c;
}
.f-headerFrm-support {
    padding: 0;
    margin: 30px 0 4px 0;
    text-align: center;
}
.support-searchButton {
    margin: 0;
    padding: 0;
    display: inline;
    clear: none;
    height: 55px;
    width: 65px;
    border-style: solid;
    border-color: #DDDDDD;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    background-color: #FFFFFF;
    background-image: url("/Content/images/magnifyingGlass_mockup_cap.PNG");
    background-repeat: no-repeat;
    background-position: center;
    background-size: initial;
}
/*#searchSupportTable > tbody > tr td > button > .midcoglyph .midcoglyph-search {
    height: 77px;
    width: 90px;
    background-size: cover;
}*/

div.col-md-3 {
    background-color: #FFF;
}
.h-support-topic {
    padding-top: 10px;
    padding-right: 23px;
    padding-bottom: 10px;
    padding-left: 23px;
    margin: 0;
    background-color: #006D9F;
    color: #F5F5F5;
    margin-top: 10px;
    font-family: inherit;
    font-weight: 500;
    font-size: 12pt;
    line-height: 1.1;
}
.support-topic-page .row .col-md-3 ul {
    background-color: #F5F5F5;
}
.support-topic-page .row .col-md-3 ul li a {
    padding-top: 10px;
    padding-right: 15px;
    padding-bottom: 10px;
    padding-left: 23px;
}
.support-topic-page .row .col-md-3 ul li a:hover {
    background-color: #FFF;
    text-decoration: none;
    color: #006D9F;
}

.p-topic-heading {
    padding: 22px;
    margin: 0;
    font-size: 20px;
    font-weight: bold;
    color: #353432;
    line-height: 22px;
}
.p-helpLinks-error {
    padding: 22px;
    margin: 0;
    font-family: inherit;
    font-size: 16px;
    font-weight: normal;
    color: red;
    line-height: 22px;
}
.container-fluid .row #div-topic-main-body {
    padding: 0 15px 0 45px;
}

/*Appears to be version on server, 7/29*/
/*@font-face {
    font-family: 'Glyphicons Halflings';
    src: url("../fonts/glyphicons-halflings-regular.eot");
    /*src: url(../fonts/glyphicons-halflings-regular.woff) format("woff"), url("../fonts/glyphicons-halflings-regular.woff2") format("woff2"), url("../fonts/glyphicons-halflings-regular.svg") format("svg"), url(../fonts/glyphicons-halflings-regular.ttf) format("truetype");*/
    /*src: url(../fonts/glyphicons-halflings-regular.woff) format("woff"), url("../fonts/glyphicons-halflings-regular.svg") format("svg"), url(../fonts/glyphicons-halflings-regular.ttf) format("truetype");
}*/

/*add style for camera glyphicon*/
@font-face {
    font-family: 'Glyphicons Halflings';
    src: url("/Content/fonts/glyphicons-halflings-regular.eot");
    src: url("/Content/fonts/glyphicons-halflings-regular.woff") format("woff"), url("/Content/fonts/glyphicons-halflings-regular.woff2") format("woff2"), url("/Content/fonts/glyphicons-halflings-regular.svg") format("svg"), url("/Content/fonts/glyphicons-halflings-regular.ttf") format("truetype");
}
.glyphicon {
  position: relative;
  top: 1px;
  display: inline-block;
  font-family: 'Glyphicons Halflings';
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }
.glyphicon-facetime-video:before {
  content: "\e059";
}

/*STYLES FOR SupportContent*/
.support-content-page {
    margin-bottom: 32px;
}
.support-content-page .row .col-md-9 ul {
    list-style: none;
}
.l-site-support-content .row .col-md-9 ul li::before {
    content: '\2022 ';
    color: #0074a1;
    margin-right: 8px;
    font-size: 1.3em;
    line-height: 0;
}
.h-helpfulLinks {
    margin-left: 29px;
    /* All are from main.css */
    margin-top: 20px;
    margin-bottom: 10px;
    font-family: "Gotham SSm A", inherit;
    font-weight: 500;
    font-size: 20pt;
    line-height: 1.1;
    color: #353432;
}
h-content-heading {
    /* All are from main.css */
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 21px;
    font-family: "Gotham SSm A", inherit;
    font-weight: 500;
    font-size: 20pt;
    line-height: 1.1;
    color: #353432;
}
.div-document-content {
    margin-left: 0;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 75px;
}

/*Related Documents block*/
.div-relatedDocuments {
    padding: 12px;
    margin: 0;
    background-color: #F5F5F5;
}

#div-contentContainer {
    margin-top: 28px;
}

@media only screen and (max-width: 768px) {
    #div-contentContainer .row .col-md-9 {
        padding-left: 15px;
        padding-right: 80px;
    }
}
@media only screen and (max-width: 1024px) and (max-height: 768px) {
    #div-contentContainer .row .col-md-9 {
        padding-left: 15px;
        padding-right: 15px;
    }
}
@media only screen and (min-width: 1026px) {
    #div-contentContainer .row .col-md-9 {
        padding-left: 15px;
        padding-right: 80px;
    }
}
.container-fluid .row #div-relatedDocuments {
    padding: 0; /* top, right, bottom, left*/
    background-color: #F5F5F5;
}
#div-contentContainer .row #div-relatedDocuments .link-collection {
    padding: 0 0 36px 0;
}
/* Portrait-tablet orientation looks ugly-fix later*/
@media only screen and (max-height: 773px) and (min-width: 300px) {
    #div-contentContainer .row #div-relatedDocuments .link-collection .headerTitle {
        padding: 36px 0 0 36px;
        margin: 0 0 20px 0;
    }
}
@media only screen and (max-width: 1024px) and (max-height: 768px) {
    #div-contentContainer .row #div-relatedDocuments .link-collection .headerTitle {
        padding: 12px 0 0 12px;
        margin: 0 0 20px 0;
        font-size: 2.5em !important;
    }
}
@media only screen and (max-width: 768px) and (max-height: 1024px) {
    #div-contentContainer .row #div-relatedDocuments .link-collection .headerTitle {
        padding: 12px 0 0 12px;
        margin: 0 0 20px 0;
        font-size: 2.5em !important;
    }
}
@media only screen and (min-width: 1026px) and (min-height: 770px) {
    #div-contentContainer .row #div-relatedDocuments .link-collection .headerTitle {
        padding: 36px 0 0 36px;
        margin: 0 0 20px 0;
    }
}
#div-contentContainer .row #div-relatedDocuments .link-collection ul li .related-documents-anchor-links {
    padding: 10px 36px 10px 36px;
}
#div-contentContainer .row #div-relatedDocuments .link-collection ul li .related-documents-anchor-links:hover {
    background-color: #FFF;
    text-decoration: none;
    color: #006D9F;
}
.container-fluid .row #div-relatedDocuments .div-relatedDocs-content {
    margin: 0;
    padding: 0;
}

/* SupportCategoryBlock styles */
.supportcategoryblock {
    margin: 90px 0 0 0;
}
.mc-support-category-block {
    margin-left: 7px;
    margin-top: 0;
    margin-right: 2px;
    margin-bottom: 55px;
    background-color: transparent;
}
.mc-support-category-block .mc-support-category-links {
    height: 629px;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 20px;
    margin-left: 0;
    padding: 0;
    background-color: #F5F5F5;
}
.mc-icon-heading {
    color: #F5F5F5;
    background-color: #0074a1;
}
.mc-support-category-block .mc-support-category-links {
    z-index: 4;
}
.mc-support-category-block .mc-support-category-links .ul-block-supportTopic {
    padding-top: 29px;
    padding-right: 24px;
    padding-bottom: 29px;
    padding-left: 24px;
    margin: 0;
    list-style: none;
    background-color: transparent;
    color: #006D9F;
    z-index: 6;
}
.mc-support-category-block .mc-support-category-links .ul-block-supportTopic li {
    padding-left: 0;
    padding-top: 5px;
    padding-right: 0;
    padding-bottom: 5px;
    margin: 0;
    background-color: #F5F5F5;
    font-size: inherit;
    line-height: inherit;
    color: #006D9F;
    list-style: none;
}

/* SupportLandingPage */
.l-site-support-content > .container-fluid .row .linklistblock {
    margin-bottom: 65px;
}

/* LinkListBlock styles */
.block block-callout .block-content-container .block-info div p {
    font-family: inherit;
    font-size: 16px;
    color: #006D9F;
    line-height: 44px;
}

/* Activate-Self-Install Equipment Blocks */
#frm-activateSelfInstall {
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 0;
    margin-left: 0;
}

/* begin safari rounding bug hack */
@media screen and (-webkit-min-device-pixel-ratio:0) and (min-width: @screen-tablet) { 

.row.safari-fix  {
    display:table!important;
}
.row.safari-fix [class*="col-"] {
    display:table-cell!important;
    float:none!important;
   width:auto!important;
   padding-left:2%!important;
   padding-right:2%!important;
}
} /* end safari rounding bug hack */

/*styles copied from main.css to fix home hero image*/
/*added to fix homepage hero image*/
@media (min-width: 1px) {
    .block-hero-surround .home-hero-img-container {
        display: table;
        background-position: -300px 60px !important;
        background-repeat: no-repeat !important;
        background-size: 1200px auto !important;
        width: 100%;
    }
}
@media (min-width: 363px) {
    .block-hero-surround .home-hero-img-container {
        display: table;
        background-position: -275px 35px !important;
        background-repeat: no-repeat !important;
        background-size: 1200px auto !important;
        width: 100%;
    }
}
/*was 320px*/
@media (min-width: 411px) {
    .block-hero-surround .home-hero-img-container {
        display: table;
        background-position: -200px -2px !important;
        background-repeat: no-repeat;
        background-size: 1200px auto !important;
        width: 100%;
    }
}
/*@media (min-width: 640px) {
    .block-hero-surround .home-hero-img-container {
        display: table;
        background-position: -250px -75px !important;
        background-repeat: no-repeat !important;
        width: 100%;
        background-size: 1200px auto !important;
    }
}*/
@media (min-width: 768px) {
    .block-hero-surround .home-hero-img-container {
        display: table;
        background-position: -75px -2px !important;
        background-repeat: no-repeat !important;
        width: 100%;
        background-size: 1200px auto !important;
    }
}
@media (min-width: 992px) {
    .block-hero-surround .home-hero-img-container {
        display: table;
        background-position: -225px 62px !important;
        background-repeat: no-repeat !important;
        width: 100%;
        background-size: auto !important;
    }
}
@media (min-width: 1025px) {
    .block-hero-surround .home-hero-img-container {
        display: table;
        background-position: -225px 62px !important;
        background-repeat: no-repeat;
        width: 100%;
    }
}
@media (min-width: 1200px) {
    .block-hero-surround .home-hero-img-container {
        display: table;
        background-position: left center !important;
        background-repeat: no-repeat;
        width: 100%;
        background-size: auto !important;
    }
}

/* white-circle btn for +, chevron */
.circle-white-expand-btn,
.circle-plus-btn {
  width: 29px;
  height: 29px;
  display: inline-block;
  background: white;
  border: none;
  text-align: center;
  -webkit-align-self: center;
  -webkit-align-content: center;
  -webkit-border-radius: 50%;
  -o-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%; }
  .circle-white-expand-btn .midcoglyph,
  .circle-plus-btn .midcoglyph {
    line-height: 29px; }

.midcoglyph-chevron-down:before {
  content: "";
  text-align: center;
}
  .blocks-section .block-callout {
    max-width: 580px; }

.tve-icon-glyph {
  position: relative;
  display: inline-block;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  z-index: 49;
}
.tve-icon {
    background-color: transparent;
    /*had to change address of url for use on server. Tilde won't work in MVC logic*/
    background: url('/Content/images/TVE_Icon_Logo_White_Outline.png');
    background-origin: border-box;
    background-attachment: scroll;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    width: 63px;
    height: 45px;
    z-index: 55;
    /*add these back into support, later*/
}

#support-create-email-wrapper {
    padding: 10px;
}