/* pulled in from bootstrap 03/23/2018 */
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#occ-cta img {vertical-align: middle;}

@media (min-width: 768px) {
  .col-sm-3 {
    width: 25%;
    float: left;
    position:relative;
    min-height:1px;
  }
}


/* |--- clean up the inherited styling ---| */

body {padding-left: 0px;  padding-right: 0px;}

body.campaign-operation-christmas-child.single-sp-landing-pages {background-image: none;}

body.campaign-operation-christmas-child.single-sp-landing-pages > div#wrap {background-image: none;}

/* #header {position: static; background: #262626; height: auto; float: none;} */

#inner {padding-top: 0; width: 100%; max-width: none;  background-color: #F4F4F4;margin-bottom: 0 !important;}

#content {width: 100%; margin-top: 0;z-index:0;}

#content-container {width: 100%; max-width: none;}

#sidebar {margin: 0; padding: 0;}

iframe[name="google_conversion_frame"] {
  height: 0;
}

.di-full-checkout {
                height: auto;
                padding: 10px;
                margin-bottom: 10px;
}

.di-full-checkout .megamenu-donate-button {
                margin: -5px 10px 0 0;
}

div.di-full-checkout span.cart-display, 
.single div.di-full-wrapper span.cart-display, 
.single div.di-full-wrapper span.di-full-thanks {
                margin: 3px 0 0 15px;
}

.sp-article-wrap {max-width: 764px; margin: 0 auto !important; z-index: auto;}

.entry-content {
  font-size: 1.1em;
  font-weight: 400;
  letter-spacing: 0.02em;
  line-height: 1.8em;
  overflow: hidden;
  margin:0 !important;
}

.article-image .image-wrapper {
                max-width:           764px;
                margin: 0 auto;
}

.article-image .image-wrapper img {
  display: block;
  margin: 0 auto;
}

p.wp-caption-text {width: 100%;}

.alignleft {margin: 20px 25px 10px 0;}
.alignright {margin: 20px 0 10px 25px;}

.article-headline {line-height: 1.1em;}

.article-summary {
  background-color: #F4F4F4;
  border: 1px solid #DFDFDF;
  border-radius: 9px;
  line-height: 1.5em;
  margin: 10px 0;
  padding: 14px;
}

.wp-caption {max-width: none;}

div.entry-content div.entry-content {margin: 0;}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, p {
                font-weight: inherit;
                text-transform: inherit;
                font-family: inherit;
}


/*
|--------------------------|
|--------- Slides ---------|
|--------------------------|
*/

#occ-slides {
                white-space: nowrap;
                /*height: 697px;*/
                overflow: hidden;
}

#occ-slides-inner {
                position: relative;
}

.slide {
                text-align: center;
                width: 100%;
                white-space: normal;
                display: inline-block;
                background-position: top center;
                background-repeat: no-repeat;
                background-size: cover;
}

.slide.activate {
                display: inline-block;
}

.slide-inner {
                width: 100%;
                height: 697px;
                min-height: 400px;
                max-height: 697px;
                float: left;
                position: relative;
}

.slide .slide-content {
  margin: 0 auto;
  left: 0;
  right: 0;
  position: absolute;
  bottom: 5%;
  width: 78%;
  max-width: 690px;
  
  font-size: .5em;
  font-size: .9vm;
  font-size: .9vmin;
}

.slide h3 {
  color: #FFFFFF;
  font-weight: 400;
  text-transform: none;
  
  font-size: 5em;
  
}

.slide p {
  font-weight: 400;
  
  font-size: 2em;
  line-height: 2em;
}

.slide a {

}


/* main link code */

a.mainlink {
  color: #FFFFFF;
  font-size: 1.3em;
  font-weight: 400;
}

a.mainlink:hover {
                text-decoration: none;
}

.mainlink .arrow {
                
                display: inline-block;
                margin: 10px;
                border-radius: 20px;
                padding: 0;
                vertical-align: middle;       
                
                transition: box-shadow .4s;

}

.mainlink .arrow i {
                display: inline-block;
                width: 38px;
                height: 38px;
                
                background-image: url('https://sp-comm-arkfiles.s3.theark.cloud/website/occ/css/occ_link_arrow.png');
                background-position: center bottom;
                background-repeat: no-repeat;
                
                transition: opacity .4s;
}

a.mainlink:hover .arrow {
    box-shadow: 0 0 0 4px white;
}

a.mainlink:hover .arrow i {
                opacity: .5;
}

.mainlink.mainlink-lite .arrow {box-shadow: 0 0 0 2px white;}

.mainlink.mainlink-lite .arrow i {
                background-image: url('https://sp-comm-arkfiles.s3.theark.cloud/website/occ/css/occ_link_arrow_lite.png');
                height: 30px;
                width: 30px;
}


#occ-main-content {
    background:black;
    overflow:hidden;
    position: relative;
    background: url("https://sp-comm-arkfiles.s3.theark.cloud/website/occ/css/vidGrab02.jpg") no-repeat scroll center center black\0/;
}
#occ-slide-controls {
                /*
                height: 697px;
                position: absolute;              
                top: 0;
                */
                width: 100%;
                visibility: hidden;
}

#occ-slide-arrows {
  margin: 0 auto;
  width: 100%;
  height: 148px;
  max-width: 1278px;
  position: absolute;
  top: 32%;
  left: 0;
  right: 0;
  /*
  top: 0;
  bottom: 0;
  */
}

#occ-slide-left, #occ-slide-right {
  background-repeat: no-repeat;
  height: 148px;
  opacity: 0.4;
  /*position: absolute;*/
  width: 36px;
  visibility: visible;
  margin: 0 10px;
  outline: none;
  transition: opacity linear .35s;
}

#occ-slide-left:hover, #occ-slide-right:hover {
                opacity: 0.8;
}

#occ-slide-left {
                float: left;
                background-image: url("https://sp-comm-arkfiles.s3.theark.cloud/website/occ/css/occ-slide-left.png");
}


#occ-slide-right {
                /*right: 0;*/
                float: right;
                background-image: url("https://sp-comm-arkfiles.s3.theark.cloud/website/occ/css/occ-slide-right.png");
}

#occ-slide-counter {
  bottom: 12px;
  display: block;
  position: absolute;
  text-align: center;
  width: 100%;
  visibility: visible;
  
}

#occ-slide-counter a {
  background-color: rgb(255,255,255);
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 7px;
  display: inline-block;
  height: 14px;
  margin-left: 18px;
  width: 14px;
  outline: none;
}

#occ-slide-counter a:first-child {
                margin-left: 0;
}

#occ-slide-counter a.active {
  background-color: rgb(255,255,255);
  background-color: rgba(255,255,255, 1);
}



/*
|--------------------------|
|-------- Specials --------|
|--------------------------|
*/

#occ-sub-content {
    position:absolute;
    padding-top:0 !important;
    bottom:45px;
    width:100%;
}

video#bgvid {
    min-width: 100%;
    z-index: -100;
    background: url('https://sp-comm-arkfiles.s3.theark.cloud/website/occ/css/vidGrab02.jpg') no-repeat;
    background-size: cover;
    background-position: center;
    opacity: 0.7;
    display:block;
}

#occ-cta {
    width: 100%; 
    margin-bottom: 45px; 
    text-align: center; 
    background: none; 
    padding: 45px 0px;
    position:relative;
    z-index:0;
}
#occ-row-2-wrap {max-width:1140px;margin:0 auto;}
#occ-row-2-wrap div {width:49%;display: inline-block;}
#row2-arrow > img {display:inline-block;}

#row2b {padding-left:4%;}
#row2b img {margin-top:65px;}

#slide-story {margin:0 auto;text-align:center;color:white;padding:30px 0;}
#slide-story-main {font-size: 48px; line-height: 40px;}
#slide-story-link {font-size:14px;font-style: italic;color:white;text-decoration:none;}

#occ-special-list {
                max-width: 1278px;
                margin: 0 auto;
}
hr.story-hr {
    border: 1px solid white;
    opacity: 0.5;
    width: 320px;
}

#occ-special-list .occ-special {
                padding-left: 2.5px;
                padding-right: 2.5px;
                margin: 0;
                list-style: none;
}
            #occ-row-2 {background:white;padding-bottom:45px;}
            #occ-row-3 {min-height:430px;background: #567C0F url("https://sp-comm-arkfiles.s3.theark.cloud/website/occ/css/occ_slide_3.jpg") no-repeat center top;}

.occ-special > a {
  background-size: 100%;
  background-image: url("https://sp-comm-arkfiles.s3.theark.cloud/website/occ/css/occ-make-disciples-sp-test.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  /*border: 1px solid #DEDEDE;*/
  display: block;
  height: 110px;
  position: relative;
  color: #231f20;
  box-shadow: 0 0 0 1px #DEDEDE inset;
}

#occ-special-list > .occ-special > a .desc {
                bottom: -54px;
                background: #69BE28;
                border: 1px solid #DEDEDE;
                border-top: none;
        color:white;
}

.occ-special > a:hover {
                color: #69be28;
}

.occ-special .desc {
  background-color: #FFFFFF;
  bottom: 0;
  display: table;
  font-weight: 400;
  height: 55px;
  padding-right: 5%;
  padding-left: 5px;
  position: absolute;
  text-align: center;
  width: 100%;
}

.occ-special .desc > span {
  background-image: url("https://sp-comm-arkfiles.s3.theark.cloud/website/occ/css/occ_home_arrow_green.png");
  background-position: right center;
  background-repeat: no-repeat;
  display: table-cell;
  line-height: normal;
  padding-right: 40px;
  vertical-align: middle;
}

li#quad-914 .desc > span, li#quad-108 .desc > span, li#quad-191 .desc > span  {
    background-image: url("https://sp-comm-arkfiles.s3.theark.cloud/website/occ/css/occ_link_arrow.png");
}
/* -- nested specials -- */

li .occ-special {
                margin: 0 !important;
                list-style-type: none !important;
}

li .occ-special > a {
  background: none;
  height: 51px;
  margin-top: 5px;
}

li .occ-special:first-child > a {
  margin-top: 0;
}

li .occ-special .desc {
                text-align: right;
                border: 1px solid #DEDEDE;
                top: 0;
                height: 52px;
        color: #69be28;
}

/*
li .occ-special .desc {
                position: static;
}
*/

.archive-page ul li, .entry-content ul li {}


/*
|--------------------------|
|------- Scrollable -------|
|--------------------------|
*/

body.occ-scrollable .screen {
                background-repeat: no-repeat;
                background-position: top center;
                background-size: cover;
                position: relative;
                z-index: 1;
}

body.occ-scrollable .screen .screen-inner {
                min-height: 600px;
}

body.occ-scrollable .screen .screen-inner > div {
                position: absolute;
}

body.occ-scrollable .screen.isFixed {
                /*position: fixed;*/
                width: 100%;
                margin: 0;
}

body.occ-scrollable .scrolldown {
                background-image: url('https://sp-comm-arkfiles.s3.theark.cloud/website/occ/css/occ-scroll-down.png');
                background-repeat: no-repeat;
                background-position: bottom center;
                padding-bottom: 35px;
                padding-top: 20px;
}

body.occ-scrollable .screen .screen-inner {
                min-height: auto;
}

body.occ-scrollable .entry-content {
                background-color: black;
}

body.occ-scrollable .screen .larger {
                font-size: 180%;
                line-height: 124%;
}

body.occ-scrollable .screen .large {
                font-size: 140%;
                line-height: 150%;
}                               
                                
body.occ-scrollable .screen .medium {
                font-size: 85%;
                line-height: 150%;
}

body.occ-scrollable .screen .small {
                font-size: 60%;
                line-height: 150%;
}

body.occ-scrollable .screen .smaller {
                font-size: 50%;
                line-height: 150%;
}

body.occ-scrollable .screenExpand .screen-inner,
body.occ-scrollable .screen .screen-inner {
                margin: 0 auto;
                max-width: 1278px;
                padding: 1.5% 0;
                position: relative;
}

body.occ-scrollable .screenExpand {
                position: relative;
                z-index: 1;
}

body.occ-scrollable .screen, 
body.occ-scrollable .screenExpand {
                
/*            font-size: 1.7em;
                font-size: 2.65vm;
                font-size: 2.65vmin;
                
                line-height: 1.7em;
                line-height: 4.6vm;
                line-height: 4.6vmin;
                
                letter-spacing: 0.02em; */
}

body.occ-scrollable .screen p, 
body.occ-scrollable .screenExpand p {
                font-size: inherit;
                font-weight: 400;
                
                line-height: inherit;
}


/*
|--------------------------|
|----- Small Slides -------|
|--------------------------|
*/

.small-slides {
                position: relative;
                background-image: url('https://sp-comm-arkfiles.s3.theark.cloud/website/occ/css/tgj-image-slide-bg.png');
                background-repeat: no-repeat;
                background-position: right center;
                background-size: auto 100%;
                padding-bottom: 45%;
}

.small-slides-images {}
.small-slides-images > img {
                border-radius: 10px;
                left: 12%;
                position: absolute;
                right: 15%;
                top: 8%;
                width: 84%;
                z-index: 0;
}
.small-slides-images > img:first-child {z-index: 1;}

.small-slides-controls {
                position: absolute;
                left: 0;
                right: 0;
                bottom: 6%;
                margin: 0 auto;
                /*width: 43%;*/
                padding-left: 10%;
}

.small-slides-controls .slide-counters {
                display: inline;
}

.small-slides-controls a {
                background-image: url('https://sp-comm-arkfiles.s3.theark.cloud/website/occ/css/tgj-photo-controls.png');
                width: 18px;
                height: 36px;
                display: inline-block;
                text-indent: -9999px;
                margin-right: 20px;
                outline: none;
}

.small-slides-controls .slide-counter {background-position: 37px 10px;}
.small-slides-controls .slide-counter.active {background-position: 55px 10px;}
.small-slides-controls .right-arrow {background-position: right center;}
.small-slides-controls .left-arrow {}


/*
|--------------------------|
|---------- Popup ---------|
|--------------------------|
*/

.popup {
  background-color: rgba(0, 0, 0, 0.75);
  height: 100%;
  left: 0;

  padding: 3% 0;

  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1000;
  display: none;
}

.popup > div {
  box-shadow: 0 0 75px #000000;
  margin: auto;
  width: 60%;
  max-width: 1278px;
  position: relative;
}

.popup > div:before {
  background-color: rgba(0, 0, 0, 0.4);
  border: 2px solid;
  border-color: rgba(255,255,255,0.4);
  border-radius: 18px;
  color: #FFFFFF;
  content: "x";
  display: block;
  font-size: 26px;
  padding: 0 10px 5px 11px;
  position: absolute;
  left: 4px;
  text-indent: 0;
  top: 4px;
  z-index: 999999;
  transition: background-color .2s, border-color .2s;
  cursor: pointer;
}

.popup > div:before:hover {
                background-color: rgba(0, 0, 0, 0.8);
                border-color: rgba(255,255,255, 0.8);
}



/*
|--------------------------|
|------- Responsive -------|
|--------------------------|
*/

/*************************
/* Start height restrictions
/*************************/
@media screen and (max-height: 750px) and (min-width:768px){
   #occ-cta { 
    margin: 0 auto;
    width: 390px;
   }
}

@media screen and (max-height: 650px) and (min-width:768px) {
   #occ-cta { 
    padding: 0 0 20px;
    width: 290px;
   }
}

@media (min-width: 980px) and (max-width: 1024px) {
                body.occ-scrollable .screen, 
                body.occ-scrollable .screenExpand {
                                font-size: 1.7em;
                                font-size: 2.2vm;
                                font-size: 2.2vmin;
                                
                                line-height: 1.7em;
                                line-height: 4.0vm;
                                line-height: 4.0vmin;         
                }
}

@media (min-height: 950px) {

                .slide .slide-content {
                  font-size: .6em;
                }

                body.occ-scrollable .screen, 
                body.occ-scrollable .screenExpand {
                                font-size: 1.7em;
                                line-height: 1.7em;
                                /*letter-spacing: 0.02em;*/
                }
}

@media (max-width: 1350px) {
                body.occ-scrollable .screenExpand .screen-inner,
                body.occ-scrollable .screen .screen-inner {
                                padding: 1.5% 5%;
                }
}


/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {
                div#site-wrapper.cart-no span.wpmega-link-title {font-size: 11px;}
        #slide-story-main {font-size: 26px; line-height: 25px;}
}

/* Portrait tablet to landscape and desktop */
@media (max-width: 979px) {

               .small-slides {
                                margin-left: -54%;
                                padding-bottom: 95%;
                                width: 170%;
                }
                
                .small-slides-images > img {
                                left: 27.5%;
                                width: 69%;
                }
                
}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {

/*
        div#megaMenu ul#megaUber {
                    margin-top: 60px;
                }
                .header-full-width #title-area, 
                #title-area {
                                height: 59px;
                }
*/
        .entry-content ul {padding:0 !important;}

                #content {margin-top: 0px;}

                body {
                                font-size: 12px;
                }
                
                .navbar .btn-navbar {
                                margin: 6px 0 0 0;
                }

                .slide .slide-content {
                                font-size: 2vmin;
                }

                #occ-sub-content {
                margin-top: 55px;
                position: relative;
                }

        video#bgvid {display:none;}

        #occ-cta {z-index:-1;background:black;}
        #occ-cta img {width:90%;}
        #occ-cta-bg {
            background: black url("https://sp-comm-arkfiles.s3.theark.cloud/website/occ/css/mobile-bg.jpg") no-repeat scroll 0 0 / cover;
            bottom: 0;
            left: 0;
            opacity: 0.7;
            position: absolute;
            right: 0;
            top: 0;
            z-index: -1;
        }
        #occ-main-content {
            max-height: none !important;
            background:none;
        }
        #slide-story-main {font-size: 16px; line-height: 15px;}
        #occ-row-2-wrap {max-width:1140px;margin:0 auto;text-align:center;}
        #row2-arrow > img {display:none;}
        #occ-row-2-wrap div {width:95%; text-align:center;}
        #row2b {padding-left:4%;}
        #row2b img {margin-top:65px;}


                #occ-special-list .occ-special {
                    margin: 65px auto;
            max-width: 320px;
                }
                #occ-special-list .occ-special:first-child {margin-top: 0px;}
        #occ-special-list .occ-special:last-child {margin-bottom: 0px;}


                li .occ-special:first-child > a {
                                margin-top: 5px;
                }
                
                #occ-special-list .occ-special.span3 {
                                margin: 0 auto;
                                max-width: 315px;
                }
                
                #occ-special-list {
                                width: 100%;
                position:relative;
                }
                
                #nav {
                                background: none;
                                border: none;
                                box-shadow: none;
                }     
                
                .slide-inner {
                                min-height: 0;
                }
                
                #occ-slide-arrows {top: 22%; display: none;}
                
                #occ-slide-left, #occ-slide-right {
                                width: 24px;
                                height: 102px;
                                background-size: auto 100%;
                }
                
                
                body.occ-scrollable .screen .screen-inner {
                                /*min-height: 400px;*/
                                min-height: none;
                }
                
                body.occ-scrollable .screen, body.occ-scrollable .screenExpand {
                                font-size: 1.3em;
                                line-height: 1.5em;
                                letter-spacing: 0.05em;
                }
                
                body.occ-scrollable .screen .screen-inner > div {
                                position: inherit;
                }
                
                body.occ-scrollable .screenExpand .screen-inner, 
                body.occ-scrollable .screen .screen-inner {
                                min-height: inherit;
                                padding: 0;
                }
                
                body.occ-scrollable .screenExpand .screen-inner  > *, 
                body.occ-scrollable .screen .screen-inner > * {
                                padding-left: 7%;
                                padding-right: 7%;
                }

                body.occ-scrollable .screen {
                                background-size: 150% auto;
                                padding-top: 60%;
                }


                .small-slides-controls {
                                padding-left: 25%;
                                bottom: -35px;
                }
                
                .small-slides-controls a {
                                margin-right: 15px;
                }

}

@media (max-width: 321px) {
                #occ-special-list .occ-special {
                    margin: 65px 0 65px 13px;
                }
}
