@font-face{font-family:Roboto;font-style:normal;font-weight:100;src:local('Roboto Thin'),local('Roboto-Thin'),url(http://fonts.gstatic.com/s/roboto/v15/Jzo62I39jc0gQRrbndN6nfesZW2xOQ-xsNqO47m55DA.ttf) format('truetype')}


@font-face {
 font-family: 'Gothic';
  src: url('https://currys-ssl.cdn.dixons.com/css/themes/canon/2019-redesign/fonts/gothic.ttf') format('truetype');
  text-rendering: optimizeLegibility;
  font-smoothing: antialiased;
  -webkit-font-smoothing: antialiased !important; 
  font-weight:normal; 
}
@font-face {
 font-family: 'GothicBold';
  src: url('https://currys-ssl.cdn.dixons.com/css/themes/canon/2019-redesign/fonts/gothicb.ttf') format('truetype');
  text-rendering: optimizeLegibility;
  font-smoothing: antialiased;
  -webkit-font-smoothing: antialiased !important; 
  font-weight:normal; 
}

.dcg{font-family: Gothic, Arial, sans-serif;}

.dcg .hero-heading,
.dcg .hero-text p,
.dcg .text-heading,
.dcg .bottom-hero-text p { line-height: 1.2; }

/******* header ********/
.dcg .header img{width:260px; height:auto;}
.dcg .header{padding:20px 25px;}

@media only screen and (max-width: 599px){
    .dcg .header{text-align:center;}
    .dcg .header img{width:200px; height:auto;}
}

/******* hero banner *******/
.dcg .hero-banner{}
.dcg .white-bg{background-color:#fff;}
.dcg .light-grey-bg{background-color:#f5f5f5;}
.dcg .grey-bg{background-color:#efefef; padding:40px 30px;}

.dcg .hero-section{position:relative; padding:0 25px;}
.dcg .hero-text{position:absolute; top:10%; width:100%; text-align:center; padding:10px 20px; color:#fff;}
.dcg .hero-heading{font-size:48px; font-weight:600; margin-bottom:5px;}
.dcg .hero-text p{font-size:24px;}
.dcg .hero-cta{margin-top:20px;}
.dcg .hero-cta a{text-decoration:none; font-size:18px; color:#fff; background-color:#ca0000; padding:10px 30px; border-radius:4px; border:1px solid #ca0000; transition:background-color 0.5s;}
.dcg .hero-cta a:hover{background-color:#fff; color:#ca0000;}

@media only screen and (max-width: 1240px){
    .dcg .hero-heading{font-size:40px;}
    .dcg .hero-text p{font-size:20px;}
}
@media only screen and (max-width: 999px){
    .dcg .hero-heading{font-size:36px; margin-bottom:0;}
    .dcg .hero-text p{font-size:18px;}
    .dcg .hero-text{top:5%;}
}
@media only screen and (max-width: 820px){
    .dcg .hero-heading{font-size:30px;}
    .dcg .hero-text p{font-size:16px;}
    .dcg .hero-text a{font-size:16px;}
    .dcg .hero-text{top:2%;}
}
@media only screen and (max-width: 680px){
    .dcg .hero-heading{font-size:20px;}
    .dcg .hero-text p{font-size:16px;}
    .dcg .hero-text a{font-size:16px;}
}
@media only screen and (max-width: 599px){
    .dcg .hero-heading{font-size:30px; margin-bottom:10px;}
    .dcg .hero-text p{font-size:16px;}
    .dcg .hero-text a{font-size:16px;}
    .dcg .hero-text{top:5%;}
    .dcg .hero-section{padding:0 0;}
}
@media only screen and (max-width: 500px){
    .dcg .hero-heading{font-size:24px;}
    .dcg .hero-text p{font-size:16px;}
    .dcg .hero-text a{font-size:16px;}
}

/********* navigation *********/
.dcg .navmenu{margin-top:20px;}
.dcg .navmenu ul{padding-left:0;}

.dcg .navmenu ul li {
	padding:0px;
	margin:0px;
	float:left;
	text-align:center;
	width: 10%;
    list-style: none;
}
.dcg .navmenu ul li div {
	max-width:100%; border-right:1px solid #ccc; border-left:1px solid #fff;
}
.dcg .navmenu ul li.double-line div {
	max-width:100%; border-right:1px solid #ccc;		
}
.dcg .navmenu ul li.last div {
	border-right:none;	
}
.dcg .navmenu ul li.first {
	width:10%;
}
.dcg .navmenu ul li.first div {
	border-left:none;	
}
.dcg .navmenu ul li.last {
	width:10%;	
}

.dcg .navmenu ul li div a {
	display:block;
	margin:0px;
	height:50px;
    line-height:50px;	
    font-weight:600;
	background:-moz-linear-gradient(center top , #fff 0px, #dddcdc 100%) repeat scroll 0 0 transparent;
	background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#dddcdc));
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff', endColorstr='#dddcdc');
	background: -o-linear-gradient(top, #fff, #dddcdc);	
	font-family:HelvLight, Arial, sans-serif;
	color:#000;
    text-decoration:none;
}

.dcg .navmenu ul li.double-line2 div a {
	height:50px;
	line-height:normal;
    padding-top:6%;
    text-decoration:none;
}
.dcg .brk{display:block;}
.dcg .navmenu ul li div a.active {
	background:-moz-linear-gradient(center top , #cb0000 0px, #a10000 100%) repeat scroll 0 0 transparent;
	background:-webkit-gradient(linear, left top, left bottom, from(#cb0000), to(#a10000));
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cb0000', endColorstr='#a10000');
	background: -o-linear-gradient(top, #cb0000, #a10000);
	color:#fff;
	font-family:HelvBold, Arial, sans-serif;	
}

.dcg .navmenu ul li div a:hover {
	background:-moz-linear-gradient(center top , #fff 0px, #c8c8c8 100%) repeat scroll 0 0 transparent;
	background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#c8c8c8 ));
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#c8c8c8 ');
	background: -o-linear-gradient(top, #fff, #c8c8c8 );
	color:#000;
}
    
@media only screen and (max-width: 900px){
    .dcg .navmenu ul li {width: 25%;}
    .dcg .navmenu ul li.last {width:25%;}
    .dcg .navmenu ul li.first {width:25%;}
    .dcg .brk{display:inline;}
}
@media only screen and (max-width: 499px){
    .dcg .navmenu ul li {width: 50%;}
    .dcg .navmenu ul li.last {width:50%;}
    .dcg .navmenu ul li.first {width:50%;}
}
/****** end navigation ******/

/********** intro-section ********/
.dcg .intro-section{margin-top:40px; color:#fff; background-color:#c5c5c5;}
.dcg .intro-inner{padding:40px 10%; text-align:center;}
.dcg .intro-heading{font-size:30px; margin-bottom:10px;}
.dcg .intro-section p{font-size:18px;}


/*********** section 1 *************/

.dcg .camera-models{margin-top:50px; background-color:#c3c3c3;}
.dcg .half-box{float:left; width:50%;}
.dcg .half-box-right{float:right; width:50%;}
.dcg .thumb-img{text-align:center; background-color:#fff;}
.dcg .thumb-img img{max-width:280px;}
.dcg .camera-name{color:#e80000; font-size:30px; font-weight:600; padding:10px 10px 20px;}
.dcg .text-box{color:#fff; padding:30px 30px; text-align:center;}
.dcg .text-heading{font-size:26px; font-weight:600; margin-bottom:5px;}
.dcg .text-box p{font-size:16px;}
.dcg .product-heading{font-size:24px; border-top:2px solid #fff; display:inline-block; padding:20px 10px 5px;}
.dcg .camera-cta{margin-top:40px;}
.dcg .camera-cta a{text-decoration:none; font-size:18px; color:#fff; background-color:#ca0000; padding:10px 30px; border-radius:4px; border:1px solid #ca0000; transition:background-color 0.5s;}
.dcg .camera-cta a:hover{background-color:#fff; color:#ca0000;}

@media only screen and (max-width: 599px){
    .dcg .half-box{float:none; width:100%;}
    .dcg .half-box-right{float:none; width:100%;}
}


/********** bottom hero *************/
.dcg .bottom-hero{position:relative; margin-top:80px;}
.dcg .bottom-hero-text{position:absolute; top:30%; width:100%; text-align:center; padding:10px 20%; color:#fff;}
.dcg .bottom-hero-text p{font-size:30px; margin-bottom:40px; text-shadow:1px 2px 5px rgba(0,0,0, 0.5);}

@media only screen and (max-width: 1240px){
    .dcg .bottom-hero-text{top:20%; padding:10px 15%;}
}
@media only screen and (max-width: 950px){
    .dcg .bottom-hero-text{top:15%; padding:10px 10%;}
    .dcg .bottom-hero-text p{font-size:28px; margin-bottom:40px;}
}
@media only screen and (max-width: 850px){
    .dcg .bottom-hero-text{top:15%; padding:10px 10%;}
    .dcg .bottom-hero-text p{font-size:24px; margin-bottom:30px;}
}
@media only screen and (max-width: 750px){
    .dcg .bottom-hero-text{top:10%; padding:10px 10%;}
    .dcg .bottom-hero-text p{font-size:20px; margin-bottom:20px;}
}