/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*Normalise Styles*/
html,button,input,select,textarea {}
html {}

::-moz-selection {background: #b3d4fc;text-shadow: none;}

::selection {background: #b3d4fc;text-shadow: none;}

hr {display: block; height: 1px;border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}
audio,canvas,img,video {vertical-align: middle;}
fieldset {border: 0; margin: 0; padding: 0;}
textarea {resize: vertical;}
.browsehappy {margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0;}
body {}
.wrapper {margin: 0 auto; z-index: 1; position: relative; overflow: hidden}
/*Normailise Styles*/

/*=============================================================================
DESKTOP STYLES
=============================================================================*/
/* General Styles */
.main-container{font-family: 'ProximaNova-Light', 'Open Sans', sans-serif; background-color: #fff; color: #000;}
.rayMaroon{color: #861f41;}
.darkGrey{color: #252525;}
.white{color: #fff;}
.black{color: #000;}
#topcontrol {z-index: 100; right: 30px;}

.main-container h1 {font-size: 70px; line-height: 80px; font-family: FFQTypeWebProSquareLight; text-align: center;}
.main-container h1 .small{font-size: 0.25em;}
.main-container h2 {font-size: 36px; line-height: 40px; font-family: ProximaNovaS-Light; text-align: center;}
.main-container h3 {font-size: 26px; line-height: 30px; font-family: ProximaNovaS-Light; text-align: center;}
.main-container h3 strong  {font-size: 26px; line-height: 30px; font-family: ProximaNovaS-Semibold;}
.main-container h4 {font-size: 20px; line-height: 30px; font-family: ProximaNova-Light;text-align: center;}
.main-container h4 strong  {font-size: 20px; line-height: 30px; font-family: ProximaNovaS-Semibold;}
.main-container h5 {font-size: 24px; line-height: 30px; font-family: ProximaNovaS-Light;text-align: center;}
.main-container h5 strong{font-size: 24px; line-height: 30px; font-family: ProximaNovaS-SemiBold;}
.main-container p{font-size: 16px;line-height: 24px;}

/*OVERRIDE STYLES*/
.navbar{margin-bottom:0;}
.navbar-default {background:url(../images/transparentPixel.png) repeat; border: none;}
.currentSection{color: #fff!important;}
@media screen and  (max-width:768px){.currentSection{font-size: 12px;}}
.navbar {margin-bottom: 0;}
@media screen and  (max-width:1024px){.navbar{font-size: 11px;}}
.nav>li>a {color: #fff;}
/*OVERRIDE STYLES*/
/*BANNER STYLES*/
#digitalSwitchingBanner{background:url(../images/DigitalSwitching-LP-Banner-XL.jpg); background-size:cover; background-position:50% 50%; min-height:600px; position: relative;}
@media (max-width: 1024px){#digitalSwitchingBanner{background:url(../images/DigitalSwitching-LP-Banner-L.jpg); background-size:cover; background-position:50% 50%; min-height:320px; position: relative;}}
@media (max-width: 728px){#digitalSwitchingBanner{background:url(../images/DigitalSwitching-LP-Banner-M.jpg); background-size:cover; background-position:50% 50%; min-height:385px; position: relative;}}
@media (max-width: 375px){#digitalSwitchingBanner{background:url(../images/DigitalSwitching-LP-Banner-SM.jpg); background-size:cover; background-position:50% 50%; min-height:250px; position: relative;}}    
#digitalSwitchingBannerContent{position:absolute; top:200px; right:0; width:100%;}
@media (max-width: 1024px){#digitalSwitchingBannerContent{position:absolute; top:100px; right:0; width:100%;}}
@media (max-width: 728px){#digitalSwitchingBannerContent{position:absolute; top:75px; right:0; width:100%;}}
@media (max-width: 375px){#digitalSwitchingBannerContent{position:absolute; top:50px; right:0; width:100%;}}
#digitalSwitchingBannerModels{margin-top: -175px;}
@media screen and (max-width:1024px){#digitalSwitchingBannerModels{margin-top: -115px;}}
@media screen and (max-width:414px){#digitalSwitchingBannerModels{margin-top: -80px;}}
.border{border-right:1px solid #000;}
/*BANNER STYLES*/
/*PAGE STYLES*/
#systems{background-color:#f9f9f9;}


/*=============================================================================
DESKTOP STYLES
=============================================================================*/

/*=============================================================================
1600*900
=============================================================================*/

@media only screen and (max-width:1600px) and (max-height:900px){

}

/*=============================================================================
1600*900
=============================================================================*/


/*=============================================================================
IPAD PRO STYLES - MAX-WIDTH 1366px
=============================================================================*/
@media only screen and (max-width:1366px){

.main-container h1 {font-size: 60px; line-height: 60px; font-family: FFQTypeWebProSquareLight;}
.main-container h1 .small{font-size: 0.25em;}
.main-container h2 {font-size: 36px; line-height: 36px; font-family: ProximaNovaS-Light;}
.main-container h3 {font-size: 38px; line-height: 30px; font-family: ProximaNovaS-Light;}
.main-container h3 strong  {font-size: 38px; line-height: 30px; font-family: ProximaNovaS-Semibold;}
.main-container h4 {font-size: 24px; line-height: 30px; font-family: ProximaNova-Semibold;}
.main-container h5 {font-size: 20px; line-height: 30px; font-family: ProximaNovaS-Light;}
.main-container h5 strong{font-size: 20px; line-height: 30px; font-family: ProximaNovaS-SemiBold;}
.main-container p{font-size: 16px;line-height: 28px;}

}
/*=============================================================================
IPAD PRO STYLES - MAX-WIDTH 1366px
=============================================================================*/

/*=============================================================================
IPAD PRO STYLES - MAX-WIDTH:1024px AND MAX-HEIGHT 1365px
=============================================================================*/
@media only screen and (min-width:1024px) and (max-width:1365px){

.main-container h3 {font-size: 38px; line-height: 30px; font-family: ProximaNovaS-Light;}
.main-container h3 strong  {font-size: 38px; line-height: 30px; font-family: ProximaNovaS-Semibold;}
.main-container h4 {font-size: 24px; line-height: 30px; font-family: ProximaNova-Semibold;}
.main-container h5 {font-size: 24px; line-height: 30px; font-family: ProximaNovaS-Light;}
.main-container h5 strong{font-size: 24px; line-height: 30px; font-family: ProximaNovaS-SemiBold;}
.main-container p{font-size: 16px;line-height: 28px;}

	
	
}
/*=============================================================================
IPAD PRO STYLES - MAX-WIDTH:1024px AND MAX-HEIGHT 1365px
=============================================================================*/

/*=============================================================================
IPAD STYLES - MAX-HEIGHT:768px AND MAX-WIDTH 1024px
=============================================================================*/
@media only screen and (max-height:768px) and (max-width:1024px){

.main-container h1 {font-size: 60px; line-height: 60px; font-family: FFQTypeWebProSquareLight;}
.main-container h1 .small{font-size: 0.25em;}
.main-container h2 {font-size: 36px; line-height: 36px; font-family: ProximaNovaS-Light;}
.main-container h3 {font-size: 38px; line-height: 30px; font-family: ProximaNovaS-Light;}
.main-container h3 strong  {font-size: 38px; line-height: 30px; font-family: ProximaNovaS-Semibold;}
.main-container h4 {font-size: 24px; line-height: 30px; font-family: ProximaNova-Semibold;}
.main-container h5 {font-size: 20px; line-height: 30px; font-family: ProximaNovaS-Light;}
.main-container h5 strong{font-size: 20px; line-height: 30px; font-family: ProximaNovaS-SemiBold;}
.main-container p{font-size: 16px;line-height: 28px;}

}
/*=============================================================================
IPAD STYLES - MAX-HEIGHT:768px AND MAX-WIDTH 1024px
=============================================================================*/

/*=============================================================================
IPAD STYLES - MAX-WIDTH:768px AND MAX-HEIGHT 1024px
=============================================================================*/
@media only screen and (max-width:768px) and (max-height:1024px){

.main-container h1 {font-size: 48px; line-height: 48px; font-family: FFQTypeWebProSquareLight;}
.main-container h1 .small{font-size: 0.25em;}
.main-container h2 {font-size: 28px; line-height: 28px; font-family: ProximaNovaS-Light;}
.main-container h3 {font-size: 38px; line-height: 30px; font-family: ProximaNovaS-Light;}
.main-container h3 strong  {font-size: 38px; line-height: 30px; font-family: ProximaNovaS-Semibold;}
.main-container h4 {font-size: 24px; line-height: 30px; font-family: ProximaNova-Semibold;}
.main-container h5 {font-size: 20px; line-height: 30px; font-family: ProximaNovaS-Light;}
.main-container h5 strong{font-size: 20px; line-height: 30px; font-family: ProximaNovaS-SemiBold;}
.main-container p{font-size: 16px;line-height: 28px;}
	
}
/*=============================================================================
IPAD STYLES - MAX-WIDTH:768px AND MAX-HEIGHT 1024px
=============================================================================*/

/*=============================================================================
MOBILE STYLES - MAX-WIDTH:667PX
=============================================================================*/
@media only screen and (max-width:667px){

.main-container h1 {font-size: 28px; line-height: 28px; font-family: FFQTypeWebProSquareLight;}
.main-container h1 .small{font-size: 0.25em;}
.main-container h2 {font-size: 18px; line-height: 18px; font-family: ProximaNovaS-Light;}
.main-container h3 {font-size: 28px; line-height: 30px; font-family: ProximaNovaS-Light;}
.main-container h3 strong  {font-size: 28px; line-height: 30px; font-family: ProximaNovaS-Semibold;}
.main-container h4 {font-size: 24px; line-height: 30px; font-family: ProximaNova-Semibold;}
.main-container h5 {font-size: 20px; line-height: 30px; font-family: ProximaNovaS-Light;}
.main-container h5 strong{font-size: 20px; line-height: 30px; font-family: ProximaNovaS-SemiBold;}
.main-container p{font-size: 12px;line-height: 20px;}

}

/*=============================================================================
MOBILE STYLES - MAX-WIDTH:414PX
=============================================================================*/

/*=============================================================================
MOBILE STYLES - MAX-WIDTH:375PX
=============================================================================*/
@media only screen and (max-width:375px){
	
}	

/*=============================================================================
MOBILE STYLES - MAX-WIDTH:375PX
=============================================================================*/

/*=============================================================================
MOBILE STYLES - MAX-WIDTH:736PX AND MAX-HEIGHT:414PX
=============================================================================*/
@media only screen and (max-width:736px) and (max-height:414px){

}
/*=============================================================================
MOBILE STYLES - MAX-WIDTH:736PX AND MAX-HEIGHT:414PX
=============================================================================*/

/*=============================================================================
OTHER MOBILE STYLES
=============================================================================*/
@media only screen and (max-width:320px){
}

@media only screen and (max-width:375px) and (max-width:812px){
}
/* ==========================================================================
   Helper classes
   ========================================================================== */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

.hidden {
    display: none !important;
    visibility: hidden;
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}



.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}