/*home.css*/
.service-module .row {
margin: 0;
}
.selectricInput{display: none}
body{
    font-family: 'Source Sans Pro', sans-serif;
    color: #000000;
    height: inherit;
    
    background-image: url('../../../../content/dam/asuriondc/img/bg-hero-home-asurion.jpg'); background-size: 100%; 
    background-position: right 80px; background-repeat: no-repeat;
}
.pg-load { display:none; }
.isMobile{display: none;}
h1,h2,h3,h4,h5,h6{
    font-family: 'Chevin Std Light','Source Sans Pro', sans-serif;
    font-weight: 200;
}
.container{position:relative;height: 100%;}

h3{font-size: 1.7em;margin-bottom: 0;}
h4{
    font-size: 1.8em;
}

a.button{
    display: inline-block;
    font-family: 'Chevin Std Light','Source Sans Pro', sans-serif;
}

a.more{font-size: 1.6em;font-weight: 200;}
.rating{unicode-bidi:bidi-override;direction:rtl;font-size:30px}
.rating span.star{font-family:FontAwesome;font-weight:normal;font-style:normal;display:inline-block;font-size: .7em;}
.rating span.star:before{content: "\f005";padding-right: 0;color: #8dc63f;}

body>header{
    position: relative;
    width: 100%;
    top: 0;
    z-index: 10;
}

body.home #head{background: rgba(0, 0, 0, 1);height: auto;position: relative;z-index: 980; width:100%; }

section{
    position: relative;
}
section:not(#social){padding-bottom: 4em;}
section#apps{padding-bottom:0;}
header .container{padding-bottom: 0!important}
section:not(#social):not(#apps):not(.container){
    text-align: center;
    position: relative;
}
section header h1{
    font-size: 2em;
    letter-spacing: 0;
    margin-bottom: 0em;
    margin-top: 0;
    line-height: 1.15em;
}
section header p{
    color: #B1B1B1;
    font-size: 1.1em;
    margin-top: .5em;
}
 

/*HERO SECTION STYLES*/
#hero{
    z-index: 1;
    padding-bottom: 0!important;
}
#hero .container{ width:100%;padding: 0;height: 280px; }
#hero .homepageStarRating { display:none; }
#hero .heroImage{
    position: relative;
    width: 100%;
    z-index: 9;
    display: none !important;
}
#hero div.tagline{
    position: absolute;
    font-size: .60em;
    z-index: 980;
    background-image: url('../../../../content/dam/asuriondc/img/asurion-bg-tile.png'); background-repeat: repeat-x;  z-index: 99; 
    bottom: 0;
    display: block;
    width: 100%;
    padding: 1.6em 1em;
    background-color: #ffffff;
}
#hero h1{
    font-size: 4.3em;
    letter-spacing: -.04em;
    margin-bottom: 0;
    text-align: center;
    margin-top: 0;
    color: black;
    line-height: 1.2em;
}
#hero h2{
    font-size: 1.6em;
    margin-top: .3em;
    line-height: 1.3em;
    font-weight: 100;
    text-align: center;
    color: #6d6e71;
}




.home .btn{margin-top: 1em;padding: .5em 1em;}
#primary #searchPrimarySubmit { margin-top:0; }
#stickyNav #searchStickyInput #searchStickySubmit { margin-top:0; }
.btn.center{display: inline-block; width: auto !important; }

/*OVERVIEW SECTION STYLES*/
#overview{
    background-image: url('../../../../content/dam/asuriondc/img/asurion-bg-tile.png');
    background-repeat: repeat-x;
    padding-top: 3.5em;
    z-index: 900;
    background-color: white;
    text-align:center;
    padding-bottom: 4em;
}
#overview:after{
    width: 0;   height: 0;   border-left: 5px solid transparent;  /* left arrow slant */  border-right: 5px solid transparent; /* right arrow slant */  border-bottom: 5px solid #2f2f2f; /* bottom, add background color here */  font-size: 0;  line-height: 0;
    position: absolute;
}
#overview *{
    text-align: center;
}
#overview header{
    margin-top: auto;
}
#overview img{width:100%; max-width: 600px;height: auto;}
#overview .main{
    margin-top: 2em;
}
#overview #overview-blurbs{margin-top: 3em;margin-bottom: 1em;}
#overview p{
    font-size: 1.2em; color: #939598; font-weight: 100;
    margin-top: 0;
    margin-top: .3em;
}
#overview .button{
    background: #8dc63f;
    color: white;
    border: 0;
    margin: .3em;
}
#overview ul{
    padding: 0;
    list-style: none;
}

#overview-blurbs > div{border-bottom: solid 1px #E0E0E0;margin-bottom: 20px;padding-bottom: 20px;}
#overview .column-2 { border-left:0; border-right:0; }

/*MAP SECTION STYLES*/
#map{
    background-color: black;
    padding-bottom: 0;
    height: 1200px;
    z-index: 0;
    overflow: hidden;
    background-image: url('../../../../content/dam/asuriondc/img/asurion-map.gif');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%; 
    background-position: center;
}
.map-bg{
    width: 800px;
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    right: 0;
    top: 50px;
}
#map .main{
    position: absolute; margin: auto; left: 0; right: 0; position: fixed; top: 200px; z-index: 980;
}
#map .container{
    height: 1000px;
}
#map a.button{border-color:white;margin-top: 3em;}
#map *{
    color: white;
    z-index: 8;
}
#map h1{
    font-size: 3.1em;
    margin-top: 2em;
    margin-bottom: 0;
    line-height: 1.1em;
}
#map header{ z-index:980;}
#map header h1{
    position: absolute;
    left: 0;
    right: 0;
    z-index: 9;
}
#map p{
    font-family: Times; 
    color: #8D8D8D; font-size: 1.1em; margin-top: .5em;
}
#map .main > div{text-align:center;}
#map .main > div img{width: auto;position: absolute;z-index: 8;margin: auto;}
#map .animation-container{
    margin-bottom: 50px;
    opacity: 0;
    padding-top: 150px;
    margin-top: 60px;
    display: block;
    position: relative;
}
#map #animation-1,#map #animation-2{
    position: absolute;
    width: 100%;
    margin: 0;
}
#more-factoids-btn {
    display:none;
}

#more-factoids-btn.active{display:none; opacity: 1;-webkit-transition: all 500ms ease-in-out;   -moz-transition: all 500ms ease-in-out;   -o-transition: all 500ms ease-in-out;   transition: all 500ms ease-in-out;}
#map .animation-container h6{
    font-size: 3.2em;
    margin: .4em;
    margin-bottom: .1em;
}
#map .animation-container h6 span{
    font-size: .65em;
    display: inline-block;
    bottom: 6px;
    position: relative;
    margin-right: 8px;
    color: white;
    margin-left: 5px;
}
#map .animation-container span{
    color: rgb(184, 184, 184);
    font-size: 1.1em;
    display: block;
}

#ipad-container{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
#ipad-container img#ipad-bezel{
    left: 0;
    right: 0;
    margin: auto;
}
#ipad-container img#ipad-crack{
    left: 0;
    right: 0;
    margin: auto;
}

#truck-container{
    position: absolute;
    top: 25px;
    left: 0;
    margin: auto;
    width: 100%;
}
#truck-container img#truck{
    margin: auto;
    width: 300px;
    height: auto;
    display: block;
    max-width: 300px;
    position: relative;
}
#truck-container img#conveyor-belt{
    left: -2%;
    top: 85px;
    z-index: 7;
}
#truck-container #boxes-container{
    left: 0;
    position: absolute;
    overflow: hidden;
    width: 147px;
    top: 35px;
    height: 40px;
}
#truck-container #boxes{
}
#truck-container #boxes-container img{
    position: absolute;
    left: -405px;
}
#house-container{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
}
#house-container #house{
    width: auto;
    left: 30%;
    margin: auto;
}
#house-container #sun{
    width: auto;
    left: 20%;
    z-index: 6;
    top: -45px;
    opacity: 1;
}
#house-container #calendar{
    width: auto;
    left: 60%;
    top: 85px;
}
#boxes-container{
    width: 200px;
    height: 200px;
    position: absolute;
    top: -15px;
    left: 0;
    right: 0;
    margin: auto;
}
#map .main #boxes-container img{
    position: relative;
    display: inline-block;
    width: 50px;
    margin: 3px;
}

#stars-container{
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    margin: auto;
}
#map .main #stars-container img{
    position: relative;
    width: 40px;
}
#map .main #truck-boxes-container{
    top: 35px;
    position: absolute;
    width: 147px;
    overflow: hidden;
    height: 50px;
}
#map .main #truck-boxes-container img{
    left: 150px;
    top: 0;
}
#blue-man-container{
    position: absolute;
    top: -65px;
    left: 0;
    right: 0;
    margin: auto;
}
#map .main #blue-man-container img{
    left: 0;
    right: 0;
}
#map .main #blue-man-container img:nth-child(0){}
#map .main #blue-man-container img:nth-child(1){
    top: 15px;
    opacity: .2;
    width: 150px;
}
#map .main #blue-man-container img:nth-child(2){
    top: 40px;
    opacity: .4;
    width: 170px;
}
#map .main #blue-man-container img:nth-child(3){
    top: 70px;
    opacity: .6;
    width: 180px;
}
#map .main #blue-man-container img:nth-child(4){
    top: 100px;
    opacity: 1;
}
#map .main #blue-man-container img:nth-child(5){}

/**********AUSIRON HOMEPAGE NARRATIVE STYLES***********/

/*Disable in IE8*/
html.lt-ie9 section#narrative{display: none;}

section#narrative{background:black;padding-bottom:0;text-align:center;z-index:99;overflow: hidden;border-top: solid 40px black;}
#home-narrative{list-style:none;margin:0;padding:0;font-size: .9em;}
#home-narrative li{-moz-transition:opacity 250ms ease-in 280ms;-o-transition:opacity 250ms ease-in 280ms;-webkit-transition:opacity 250ms ease-in 280ms;list-style:none;margin:0;opacity: 0.6;padding:0;transition:opacity 250ms ease-in 280ms;}
#home-narrative li div#in-the-game .slide-inner{background-image: url('../../../../content/dam/asuriondc/img/asurion-keeps-you-in-the-game.jpg');}
#home-narrative.vertical li div#in-the-game .slide-inner{background-position: -220px;}
#home-narrative li div#in-the-game p{color: white;bottom: .6em;left: 1em;}
#home-narrative li div#capture-moment .slide-inner{background-image: url('../../../../content/dam/asuriondc/img/asurion-ensures-you-capture-the-moment.jpg');background-position: -130px;background-size: cover;}
#home-narrative li div#capture-moment p{color: white;left: 1em;top: 1em;}
#home-narrative li div#connect-what-matters .slide-inner{background-image: url('../../../../content/dam/asuriondc/img/asurion-connects-what-matters.jpg');background-position: 0;}
#home-narrative.vertical li div#connect-what-matters .slide-inner{background-position: 0;} 
#home-narrative li div#connect-what-matters p{top: .5em;left: 1em;}
#home-narrative li h3{background:#51B5E0;border-top: solid .4em white;color:white;cursor:pointer;overflow:hidden;position:relative;text-align:left;font-size: 1.3em;padding: .5em;text-align: center; height: 100px;}
#home-narrative li h3 img{height: 3.2em;}
#home-narrative li.active{opacity:1.0;}
#home-narrative p{-moz-font-smoothing:antialiased;-webkit-font-smoothing:antialiased;color:black;font-family:'Chevin Std Light','Source Sans Pro', sans-serif;font-size:2.2em;font-smooth:always;font-smoothing:antialiased;line-height:1.2em;text-align:left;text-rendering:optimizeLegibility;position: absolute;}
#home-narrative li p i{opacity:.5;cursor: pointer;font-size: .8em}
#home-narrative.horizontal .slide-inner{background-size: cover;background-repeat: no-repeat;}
#home-narrative.vertical .slide-inner{height: 340px!important;background-size: cover;background-repeat: no-repeat;}

@media only screen and (min-width: 768px){
    
    section#narrative{font-size: .7em;}
    #home-narrative{font-size: .75em;}
    #home-narrative li > div{height:100px;}
    #home-narrative li div#in-the-game .slide-inner{background-position: right;background-size: cover;}
    #home-narrative li div#capture-moment .slide-inner{background-position: -40px 0px;background-size: 135%;}
    #home-narrative li div#connect-what-matters p{right: 1em;left: auto;}
    #home-narrative li h3{font-size: 2.4em;}
    #home-narrative li h3 img{-ms-transform:rotate(-270deg);-ms-transform-origin:center;-o-transform:rotate(-270deg);-o-transform-origin:center;-moz-transform:rotate(-270deg);-moz-transform-origin:center;-webkit-transform:rotate(-270deg);-webkit-transform-origin:center;transform:rotate(-270deg);tranform-origin:center;left: 0.4em;height: 3em;}
    #home-narrative p{font-size: 4.5em;line-height: 1.1em;}
    #home-narrative li p i{-ms-transform:rotate(-90deg);-ms-transform-origin:center;-o-transform:rotate(-90deg);-o-transform-origin:center;-moz-transform:rotate(-90deg);-moz-transform-origin:center;-webkit-transform:rotate(-90deg);-webkit-transform-origin:center;transform:rotate(-90deg);tranform-origin:center;}
    #home-narrative.horizontal{height: 50em;width: 50em;}
    #home-narrative.horizontal .slide-content{position:relative;}
    #home-narrative.horizontal .slide-inner{}
    #home-narrative.horizontal p{position:absolute;}
}

@media only screen and (min-width: 992px){
    #home-narrative{font-size: .85em;}
    #home-narrative li div#capture-moment .slide-inner{background-size: cover;background-position: right;}
}

@media only screen and (min-width: 1200px){
    #home-narrative{font-size: 1em;}
    #home-narrative li div#in-the-game .slide-inner{background-position: right;}
    #home-narrative li div#capture-moment .slide-inner{background-position: right;}
    #home-narrative li div#capture-moment p{top: .5em;}
    #home-narrative p{font-size: 5em;line-height: 1em;}
}

/********** END AUSIRON HOMEPAGE NARRATIVE STYLES***********/

/*CUSTOMER FEEDBACK STYLES*/

.home #customer-feedback{background:#f2f2f2;color: #000;z-index:960;}
.home #customer-feedback header h1{
    margin-bottom: .8em;
    margin-top: 1.2em;
    text-align: center;
}
.home .customer-quote-content{
    background: #FFF;
    padding: 1em;
    min-height: 11em;
    position: relative;
    font-family: 'Chevin Std Light','Source Sans Pro', sans-serif;
}
.home .customer-quote-content:after{
    content:"";
    width: 0; 
    height: 0; border-style: solid; 
    border-width: 10px 10px 0 10px; 
    border-color: #FFFFFF #f2f2f2 transparent;
    position: absolute;
    bottom: -10px;
    z-index: 980;
    left: 0;
    display: block;
    right: 0;
    right: 0;
    margin: auto;
}
.home .customer-quote-content p{
    margin-top: .5em;
    font-size: 1.2em;
    color: #999;
    line-height: 1.3em;
    text-align: center;
}
.home .customer-quote-content i{
    position: absolute;
    right: .4em;
    bottom: .3em;
    font-size: 1.6em;
}
.home .customer-quote-meta{
    color: #999;
    text-align: center;
    margin-top: 2em;
    margin-bottom: 10px;
}
.home .customer-quote-meta span{
    display: block;
    font-size: .9em;
    line-height: 1.3em;
}
.home #customer-feedback .button{background: #8dc63f;color: white;margin-top: 2em;padding: .5em 3em;}
.home #customer-feedback .fa-twitter{
    color: rgb(53, 215, 255);
}
.home #customer-feedback .fa-facebook{
    color: rgb(82, 139, 224);
}
.home .fa-star{
    color: rgb(255, 108, 226);
}


#apps{
    background-color: #7fba00;
    background-image: url('../../../../content/dam/asuriondc/img/bg-pattern-green.gif');

    padding-bottom: 0;
    height: 210px;
}
#apps h1{
    width: 100%;
    color: white;
    font-size: 1.8em;
    margin-top: 2em;
    line-height: 1.2em;

    text-align: center;
}
#apps a{color: black}
#apps .main img{
    position: absolute;
    right: 0;
    bottom: 0;
    display: none;
    z-index:970;
}
#bottom{width:100%;}





/*MEDIA QUERY FOR MEDIUM SCREEN*/

@media only screen and (min-width: 768px){
    .isMobile{display: block;}
    .isTablet{display: none;}
    #hero .homepageStarRating { display:block; position: absolute; top: 312px; left: 15px;}
    #hero .homepageStarRating img { display: block; margin: 0 0 7px; height: 20px;}
    #hero .homepageStarRating p { color:#e7d400; font-family:'Chevin Std Light', arial-narrow, arial; font-size: 12px; text-align:left; line-height: 1.1;}
        
    .home .service-module { top: -65px; }
    

    #hero{
        height: 440px;
        background-color: #87807a;
        overflow: hidden;
}
    #overview{
        text-align:left;
        }

    #hero .container{
        width: 750px;
        background: none;
    }
    #hero div.tagline{
        color: rgb(65, 65, 65); background:transparent; position: absolute; left: 15px; 
        top: 135px; width: 29em; padding: 0; 
        color: rgb(65, 65, 65);
        position: absolute;
        width: 31em;
        padding: 0;
    
        font-size: .8em;
}
    #hero h1{
        font-size: 3.5em;
        letter-spacing: -.04em;
        margin-bottom: 0;
        text-align: left;
        margin-top: 0;
        color: white;
        line-height: 1.25em;
    }
    #hero h2{
        font-size: 1.55em;
        margin-top: .6em;
        line-height: 1.3em;
        font-weight: 200;
        text-align: left;
        color: white;
    }
    #hero .heroImage{
        position: absolute;
        right: -120px;
        width: 1000px;
        z-index: -1;
        top: 50px;
        display: inline !important;
    }

    #overview header{
        margin-top: 5em;
    }
    
    #overview .column-2 { border-right: 1px solid #DDD; border-left: 1px solid #DDD; }

    .customer-quote-content p{
        font-size: 1em;
    }

    section header h1 {font-size:3em;margin-top: 0;}
    #map .main{max-width: 950px; }
    #more-factoids-btn{
        position: relative;
        margin: auto;
        width: auto;
        display: inline-block;
        margin-top: 400px;
        opacity: 0;
    }
    #more-factoids-btn.active{ display: inline-block; }
    body.home #head{position:absolute;background: transparent;}
    #apps .main img{
        display: block;
    }
    #apps h1{width:45%;text-align:left;line-height: 1.3em;}
    #overview-blurbs > div{border-bottom:none;margin-bottom:0;padding-bottom:0;font-size: 1em;}
    #map .container {
        min-height: 600px;
        max-width: 900px;
    }
    .map-bg {
    position: fixed;
    top: 500px;
    width: 1000px;
    margin: auto;
    left: 0;
    right: 0;
    }
    #map{height:auto;}
    #map #a-plus-rating {
    margin-top: 110px;
    }

}


/*MEDIA QUERY FOR LARGE SCREEN*/

@media only screen and (min-width: 992px){
 #hero{
        height: 530px;
    }
    .isTablet{display: block;}
    
    .home .service-module { top: -80px; }
    #hero .homepageStarRating { top: 365px; left: 15px;}
    #hero .homepageStarRating img { height: 25px;}
    #hero .homepageStarRating p {
    font-size: 15px;
}
    #hero .container{
    width: 970px;
    }
    section#hero div.tagline{
        top: 140px;
        font-size: 1em;
    }
    #overview header{
        margin-top: 2em;
    }
    #overview .main{
        margin-top: 3em;
        margin-bottom: auto;
    }
	#map .main{max-width: 950px; width:100%;}
    .customer-quote-content p{
        font-size: 1.2em;
    }

    #overview-blurbs > div{
        font-size: 1.2em;
     }
     section header h1{
        font-size: 3.2em;
    }
    #map .container{min-height: 1000px;}
    #hero .heroImage {
    width: 1170px;
    right: -90px;
    position: fixed;
    top: -100px;
    }
    #overview {
    text-align: left;
    padding-top: 8em;
    }
}





/*MEDIA QUERY FOR EXTRA LARGE SCREEN*/


@media only screen and (min-width: 1200px){
    .home .service-module { top: -85px; }
    section#hero{
        height: 580px;
    }
    #hero .container{
        width: 1170px;
    }
    #hero .heroImage{
        width: 130%;
        max-width: 1300px;
    
        top: -100px;
    }
     #hero .homepageStarRating { }
    #hero .homepageStarRating img { }
    #hero .homepageStarRating p 
    html.lt-ie9 #hero .heroImage { width:100%!important; max-width: auto; }
    
    #customer-feedback{background:black;}
    #overview-blurbs > div{
        font-size: 1.4em;
     }
     section header h1{
        font-size: 3.5em;
    }
    section#hero div.tagline {
        font-size: 1.1em;
    }
    #hero .homepageStarRating{
    top: 385px;
}
    
}






*:focus {
    outline: none !important;
}
/*MOBILE SPECIFIC STYLES*/
html.mobile #timeline{display: none}
html.mobile #map *{}
html.mobile #map, html.mobile #map .container{height:auto;}
html.mobile #map #animation-1, html.mobile #map #animation-2{position:relative}
html.mobile #map #animation-1{display:none}
html.mobile #customer-feedback .container .main .row > div:not(:first-child){display: none}
html.mobile #more-factoids-btn{display:none!important}
html.mobile #map .main{position: relative; top:auto;}
html.mobile #hero .heroImage{position: relative;}

/*TABLET SPECIFIC STYLES*/
html.tablet #timeline{display: none}
html.tablet #map *{}
html.tablet #map, html.tablet #map .container{min-height: 650px;height: auto;}
html.tablet #hero .heroImage{position: absolute; width:100%!important;top: -20px;right: -50px;}
html.tablet #customer-feedback .container .main .row > div{display: block!important;}
html.tablet #map .main{position: relative; top:auto;left: 0;right: 0;margin: auto;}
html.tablet #hero div.tagline{}
html.tablet #map .animation-container h6 {
    font-size: 3em;
    margin: .4em;
    margin-bottom: .1em;
}
html.tablet #truck-container img#truck {
    margin: auto;
    width: 280px;
    height: auto;
    display: block;
    max-width: 280px;
    position: relative;
}
html.tablet #map .main #truck-boxes-container {top:32px;width:143px;}
html.tablet #map .main #truck-boxes-container img{
    height:34px;
    width:auto;
}



/*IE SPECIFIC STYLES*/
html.lt-ie9 body{
    margin-top:0!important;padding-top: 0!important;
    height: inherit;
background-image: url('../../../../content/dam/asuriondc/img/home_hero.jpg');
background-size: 100%;
background-position: left top;
background-repeat: no-repeat;
}
html.lt-ie9 #map, html.lt-ie9 #map .container{height:auto;}
html.lt-ie9 #map #animation-1, html.lt-ie9 #map #animation-2{position:relative}
html.lt-ie9 #map #animation-1{display:none}
html.lt-ie9 #more-factoids-btn{display:none!important}
html.lt-ie9 #timeline{display: none}
html.lt-ie9 #hero{background:url('../../../../content/dam/asuriondc/img/bg-hero-home-asurion.jpg'); }
html.lt-ie9 body.home #head{background: transparent !important}
html.lt-ie9 #hero .heroImage{display: none!important}
html.lt-ie9 #overview img{width:auto;}
html.lt-ie9 #map .main{position: relative;top:0;}
html.lt-ie9 #map *{}
html.lt-ie9 #map .container{height:auto;min-height: 600px}
html.lt-ie9 #map{height: auto}
html.lt-ie9 .isMobile{}
html.lt-ie9  .btn.center {
display: block;
width: 200px;
margin: auto;
margin-top: 50px;
margin-bottom: 50px;
}
html.lt-ie9 #blue-man-container img{padding-top: 70px!important;}

