.section-head{
    font-family: "Univers Cyr", Arial, Helvetica, sans-serif;
    /*padding: 102px 5.3% 20px 5.3%;*/
    padding: 42px 12.3% 0 12.3%;
    text-align: center
}
.section-head h2{
    padding: 0 0 35px 0;
    font-family: "Bebas Neue", Arial, Helvetica, sans-serif;
    font-size: 48px;
    text-transform: uppercase;
    color: #000000;
}
.section-head h3{
    font-size: 16px;
    margin-bottom: 8px;
    font-weight: 700;
    line-height: 24px;
}
.section-head p{
    font-size: 18px;
    margin-bottom: 8px;
    line-height: 25px;
}
.features-arrow{
    /*position: absolute;
    bottom: 23px;
    right: 70px;*/
    display: table;
    margin: 20px auto
}
.features-arrow:hover .arr-btn span{
    background: #217cb0;
    color:#fff;
}
.features-arrow:hover .arr-btn span:before{
    border-color: #ffffff;
    background: #217cb0;
    border-top:none;
}
.arrow-container{
    cursor: pointer;
    position: relative
}
.arrow-container:before {
    position: absolute;
    content: '';
    top: 4px;
    right: -12px;
    display: block;
    width: 8px;
    height: 8px;
    border-bottom: 1px solid #ffffff;
    border-right: 1px solid #ffffff;
    transition: all 0.2s;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(-45deg);
}

.arr-btn{
    cursor: pointer
}
.arr-btn span {
	position: relative;
	display: block;
	height: 30px;
	padding: 0 16px 0 10px;
	font-size: 12px;
	line-height: 27px;
	color: #217cb0;
	background: transparent;
	border-top: 2px solid #ffffff;
	border-bottom: 2px solid #ffffff;
	border-left: 2px solid #ffffff;
	transition: all 0.2s;
    background: #ffffff;
}
.arr-btn span:before {
	position: absolute;
	content: '';
	top: 2px;
	right: -10px;
	z-index: 1;
	display: block;
	width: 21px;
	height: 22px;
	border-bottom: 2px solid #ffffff;
	border-right: 2px solid #ffffff;
	-webkit-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
        transition: all 0.2s;
}
.arr-btn span:before {
	border-color: #ffffff;
    background: #ffffff;
}


.features-arrow:hover .arrow-container:before{
    animation: go-left-right .5s infinite alternate;
    -webkit-animation: go-left-right .5s infinite alternate;
}
@keyframes go-left-right {
	from {right: -12px;}
	to {right:   -20px;}
}
@-webkit-keyframes go-left-right {
	from {right:   -12px;}
	to {right:   -20px;}
}

section.grill-features { padding: 35px 0 50px }

@media (min-width:768px) {
    section.grill-features { padding: 50px 0 50px }
}
section.grill-features .pod {
    background: radial-gradient(#2e87c8, #02213e);
    color: #fff;
    margin-bottom: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-height: 400px
}
@media (min-width:992px) {
    section.grill-features .pod {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }
}
section.grill-features .pod h3 {
    font: 700 25px/1.1em "Univers Cyr", Arial, Helvetica, sans-serif;
    letter-spacing: 1px
}
section.grill-features .pod .content {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}
@media (min-width:992px) {
    section.grill-features .pod .content {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 47%;
        flex: 0 0 47%;
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }
}
section.grill-features .pod .content .tabs {
    padding: 20px 0 40px;
    text-transform: uppercase;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: top;
    -ms-flex-align: top;
    align-items: top;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    z-index: 20
}
section.grill-features .pod .content .tabs button.tab {
    background: 0 0;
    color: inherit;
    border: none;
    padding: 10px 2px 0;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    font: 600 9px/1.2em Source Sans Pro, Helvetica, Arial, sans-serif;
    letter-spacing: 1px;
    text-transform: uppercase
}
@media (min-width:992px) {
    section.grill-features .pod .content .tabs button.tab { padding: 10px 10px 0 }
}
section.grill-features .pod .content .tabs button.tab:hover { color: #e3e3e3 }
section.grill-features .pod .content .tabs button.tab:focus { border: none; outline: none }
section.grill-features .pod .content .tabs button.tab:after {
    content: "";
    height: 4px;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 3px
}
@media (max-width:991.98px) {
    section.grill-features .pod .content .tabs button.tab:after { content: none }
}
section.grill-features .pod .content .tabs button.tab.on { color: #fff }
section.grill-features .pod .content .tabs button.tab.on:after { background-color: #17ceda }
section.grill-features .pod .content .tabs button.tab span.text { display: block }

@media (max-width:991.98px) {
    section.grill-features .pod .content .tabs button.tab span.text { display: none }
}
section.grill-features .pod .content .tabs button.tab span.dot {
    width: 10px;
    height: 10px;
    margin: 5px 7px;
    background: #d6d6d6;
    display: block;
    -webkit-backface-visibility: visible;
    border-radius: 30px;
    display: none
}
@media (max-width:991.98px) {
    section.grill-features .pod .content .tabs button.tab span.dot { display: block }
    .features-arrow {
        position: relative;
        display: table;
        margin: 20px auto 0px auto;
        bottom: inherit;
        right: inherit
    }
}
section.grill-features .pod .content .tabs button.tab.on span.dot { background: #17ceda }
section.grill-features .pod .content img.feature-icon { width: 52px; height: 52px }
section.grill-features .pod .content h4 { font-size: 18px;line-height:  1.1em; font-weight: bold; margin-bottom: 15px; letter-spacing: 1px; text-transform: uppercase; display: none }

section.grill-features .pod .content p{ line-height: 25px; }

@media (max-width:991.98px) {
    section.grill-features .pod .content h4 { display: block }
}
section.grill-features .pod .media {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    position: relative
}
@media (min-width:992px) {
    section.grill-features .pod .media {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 53%;
        flex: 0 0 53%;
        -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 12% 100%);
        clip-path: polygon(0 0, 100% 0, 100% 100%, 12% 100%);
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }
}
section.grill-features .pod .media video { display: block; width: 100% }

@media (min-width:992px) {
    section.grill-features .pod .media video {
        position: absolute;
        right: 0;
        bottom: 0;
        min-width: 100%;
        min-height: 100%;
        height: 100%;
        width: auto
    }
}
section.grill-features .pod.right .content { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2 }
section.grill-features .pod.right .media { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1 }

@media (min-width:992px) {
    section.grill-features .pod.right .media {
        -webkit-clip-path: polygon(0 0, 100% 0, 88% 100%, 0 100%);
        clip-path: polygon(0 0, 100% 0, 88% 100%, 0 100%)
    }
}
section.grill-features .pod.right .media video { right: auto; left: 0 }
section.grill-features .pod .content { text-align: center }
section.grill-features .pod .content .interior { padding: 40px 15px;position: relative}
@media (min-width:1200px) {
    section.grill-features .pod .content .interior { padding: 70px 50px }
}
@media (-ms-high-contrast:none), screen and (-ms-high-contrast:active) {
    section.grill-features .pod .content { background: radial-gradient(#2e87c8, #02213e); z-index: 20 }
}
section.featured-grills { padding: 20px 0 0 }
section.featured-grills .mobile { display: block }
section.featured-grills .desktop { display: none }
@media (min-width:768px) {
    section.featured-grills { padding-top: 50px }
    section.featured-grills .mobile { display: none }
    section.featured-grills .desktop { display: block }
}

section.featured-grills .feature-nav {
    padding: 10px 25px;
    min-height: 58px;
    font: 700 16px/1.1em Source Sans Pro, Helvetica, Arial, sans-serif;
    text-transform: uppercase;
    letter-spacing: 1px;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}
section.featured-grills .feature-nav.selected { background-color: #eaf1f4 }
section.featured-grills .feature { display: none }
section.featured-grills .feature.selected { display: block }

.pod>.content .tub.on, .pod>.media .med.on {
    display: block;
}
.pod>.content .tub, .pod>.media .med {
    display: none;
}
section.grill-features .pod .content .tabs button.tab.on span.dot {
    background: #17ceda;
}
section.grill-features .pod .content .tabs button.tab span.dot {
    width: 30px;
}