﻿@charset "UTF-8";


/* Top Navigation Shrink On Scroll */

.navbar-custom {
	margin-top: 10px;
	padding: 20px 0;
	border-bottom: none;
	background: none;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	color: #a6000e !important;
}

.navbar-custom.top-collapse {
	margin-top: 10px;
	padding: 0;
	background-color: #a6000e;
}

/* Top Navigation Shrink On Scroll End */

/* Top Navigation Colors */

.navbar-custom.top-collapse .navbar-nav>.active>a:focus, 
.navbar-custom.top-collapse .navbar-nav>.active>a:hover,
.navbar-custom.top-collapse a:hover {
	color: #FFFFFF !important;
	background-color: none;
}

.navbar-custom.top-collapse .navbar-nav>.active>a {
	color: #FFFFFF !important;
	background-color: #014785;
}

.hvr-bounce-to-right:before {
	background: #014785;
}

.navbar-custom a {
	color: #a6000e !important;
}

.navbar-custom a:hover {
	color: #014785 !important;
}

.navbar-custom.top-collapse a {
	color: #FFFFFF !important;
}

/* Top Navigation Colors End */


/* Toggle Button Colors */

.navbar-custom .navbar-toggle .icon-bar {
	background-color: #a6000e;
}

.navbar-custom.top-collapse .navbar-toggle .icon-bar {
	background-color: #FFFFFF;
}

.navbar-custom .navbar-toggle {
    border: 2px solid #a6000e;
}

.navbar-custom.top-collapse .navbar-toggle {
    border: 2px solid #FFFFFF;
}

.navbar-custom .navbar-toggle:hover,
.navbar-custom .navbar-toggle:focus {
    background: none;
}

/* Toggle Button Colors End */

/* Progress Animation On Scroll */

.progressContainer{
  	position: fixed;
	top: 0;
  	left: 0;
  	width: 100%;
  	height: 10px;
	background-color: #FFFFFF;
}

.progress{
  	height: 10px;
	width: 0%;
  	background: #a6000e;
	border-radius: 0;
}

/* Progress Animation On Scroll End */

/* Toggle Navigation Border Remove */

.navbar-collapse {
	border: none;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	-o-box-shadow: none;
	box-shadow: none;
}

/* Toggle Navigation Border Remove End */

/* Sections */

section {
	/*height: 100vh;*/
}
.section1 {
	height: 100vh;
}
.section2, .section3 {

}
.section1,
.section2,
.section3,
.section4,
.section6 {
	background-position: center center;
	background-repeat: no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

.section1, .section3 {
	background-color: #FFFFFF;
}
.section2 {
	background-color: #eeeeee;
}
.section4 {
	background-color: #e50d2e;
}
.section2,
.section6 {
	background-color: #E1E1E1;
}



/* Sections End */

/* Google Chrome Scrollbar */

::-webkit-scrollbar {
    width: 18px;
}

::-webkit-scrollbar-track {
    background-color: #FFFFFF; 
}
 
::-webkit-scrollbar-thumb {
    background-color: #a6000e; 
}

/* Google Chrome Scrollbar End */


/* Top Navigation Margin & Padding Fix */

ul.nav.navbar-nav.navbar-right {
	margin: 0px -15px 
}

.container-fluid {
	padding-right: 15px;
}

/* Top Navigation Margin & Padding Fix End */




/* Edit */

			.rfmLogo svg {
				fill: #ffffff;
				width:30%;
				position:absolute;
				left: 35%;
				right:35%;
				top:2%;
				opacity:0.8;
			} 
			
			.rfmTlm {
				fill: #ffffff;
				position:absolute;
			}
			.rfmSlide {
				width:20%;
			}

			.txtBox02 {
				margin:0 10% 0 10%;
			}
			.txtBox03 {
				position:relative;
				margin:0 10% 0 10%;
				bottom:0;
			}			
			.txtRed {
				color:#e50d2e;
			}
			.txtWhite{
				color:#ffffff;
			}			
			.txtGrey {
				color:#979797;
			}
			.txtDarkGrey {
				color:#484751;
			}						
			.col-centered{
				float: none;
				margin: 0 auto;
			}
			.top-padding {
				padding-top: 2em;
			}	
			.bottom-padding {
				padding-bottom: 2em;
			}	  
			.vertical-padding {
				padding-top: 2em;
				padding-bottom: 2em;
			}	
			.top-space {
				margin-top: 2em;
			}	
			.bottom-space {
				margin-bottom: 2em;
			}	  
			.vertical-space {
				margin-top: 2em;
				margin-bottom: 2em;
			}	  




			.half-vertical-padding {
				padding-top: 1em;
				padding-bottom: 1em;
			}	
			.half-top-space {
				margin-top: 1em;
			}	
			.half-bottom-space {
				margin-bottom: 1em;
			}	  
			.half-vertical-space {
				margin-top: 1em;
				margin-bottom: 1em;
			}







			.quarter-vertical-padding {
				padding-top: 0.5em;
				padding-bottom: 0.5em;
			}	
			.quarter-top-space {
				margin-top: 0.5em;
			}	
			.quarter-bottom-space {
				margin-bottom: 0.5em;
			}	  
			.quarter-vertical-space {
				margin-top: 0.5em;
				margin-bottom: 0.5em;
			}	
			.carousel-control {
				
			}
			.carousel-control.left, .carousel-control.right {	
				background-image:none;
			}

                .carousel-control .glyphicon-chevron-right:before {
                    content: " ";
                    display: block;
                    background: url('https://images.rfm.sapo.pt/arrow_rgt1031a4aa6695641d.png') no-repeat;
                    width: 61px;
                    height: 61px;
                }
                .carousel-control .glyphicon-chevron-left:before {
                    content: " ";
                    display: block;
                    background: url('https://images.rfm.sapo.pt/arrow_lft6088a3b01960a0e3.png') no-repeat;
                    width: 61px;
                    height: 61px;
                }
			
			
			.rfmLogoFooter svg, .rfmShareIcos svg {
				fill: #959595;
			}
			.topImgDesk {
				background-color:#e40e2d;
				display:none;
			}
			.topImgMob {
				background-color:#c41323;
			}
			
			
			.mainTxt {
				color: #ffffff;
				position:absolute;
				text-align:center;
			}
			.thumbnail {
				background-color: #fff;
				border: 0;
				border-radius: 0;
			}
			.img-thumbnail {
				background-color: #fff;
				border: 0;
				border-radius: 0;
			}
			
			.text-large {
			  font-size: 150%;
			}
			
			/* Modal */
			.btn:focus, .btn:active, button:focus, button:active {
			  outline: none !important;
			  box-shadow: none !important;
			}
			
			#image-gallery .modal-footer{
			  display: block;
			}
			
			.thumb{
			  margin-top: 15px;
			  margin-bottom: 15px;
			}	
			
			
			#image-gallery {
				padding:0!important;
				margin:0;
				background-color:red;
			}
			.modal-dialog {
			  width: 100%;
			  height: 100%;
			  margin: 0;
			  padding: 0;
			}
			
			.modal-content {
			  height: auto;
			  min-height: 100%;
			  border-radius: 0;
			  padding:0;
			  background-color:#e40d2e;
			  text-align:center;
			}	
			.modal-header {
				padding:0;
				border-bottom: 0;
			}	
			.modal-body {
				position: relative;
				padding:0;
			}								
			.modal-header .close {
				position:absolute;
				right:12px;
				top:12px;
				font-size:3em;
				z-index:999;
			}
			.btn-previous {
				position:absolute;
				left:5px;
				top:40%;
			}	
			.btn-next {
				position:absolute;
				right:8px;
				top:40%;
			}
			.btn {
				border: 0;
				border-radius: 50%;
				background-color:white;
			}



	.txtBox01 {
		position:absolute;
		margin:0 5% 0 5%;
		bottom:0;
		top:45%;
	}
	.imgSlideTopo {
		display:none;
	}
	.rfmTlm {
		display:none;
	}	
	.mainTxt {
		width:100%;
		left: 5%;
		right:5%;
		top:18%;
		text-align:left;
	}
	.mainTxt h1 {
		font-size:x-large;
	}	
	.mainTxt p {
		font-weight:100;
		font-size:small;
	}	
	.lead {
		font-size: 1em;
	}
	.rfmLogoFooter svg {
		width:40%;
		position:absolute;
		left: 30%;
		right:30%;
	} 	
	.rfmShareIcos svg {
		width:60%;
		position:relative;
		left: 20%;
		right:20%;
		margin-top:10%;	
	}
	.IcosAnim, .imgSlideTopoFix {
		display:none;
	}
/*--------------------------------------------------------- MEDIA Qs ---------------------------------------------------------------------------------------- */
/* Custom, iPhone Retina - XS */ 
@media only screen and (min-width : 320px) {
	
	.rfmLogo svg {
		width:30%;
		left: 35%;
		right:35%;
		top:2%;
	}
	.rfmLogoFooter svg {
		width:30%;
		left: 35%;
		right:35%;
	}
	.mainTxt {
		width:50%;
		left: 5%;
		right:5%;
		top:18%;
		text-align:left;
	}
	.mainTxt h1 {
		font-size:x-large;
	}	
	.mainTxt p {
		font-weight:100;
		font-size:medium;
	}
	.rfmTlm {
		display:block;
		width:45%;
		right: 0;
		top:22%;
	}
	.txtBox01 {
		top:55%;
	}	
	.txtBox01 .row h2 {
		font-size:Large;
	}
	.txtBox01 .row p {
		font-size:medium;
	}	
}

/* Extra Small Devices, Phones - XS */ 
@media only screen and (min-width : 480px) {	

	.rfmShareIcos svg {
		width:40%;
		left: 30%;
		right:30%;
		margin-top:15%;	
	}	
	.mainTxt {
		width:50%;
		left: 5%;
		right:5%;
		top:18%;
		text-align:left;
	}
	.mainTxt h1 {
		font-size:xx-large;
	}	
	.mainTxt p {
		font-weight:100;
		font-size:large;
	}	
	.rfmTlm {
		width:50%;
		right:0;
		top:18%;
	}	
	.txtBox01 {
		top:55%;
	}	
	.txtBox01 .row h2 {
		font-size:X-Large;
	}
	.txtBox01 .row p {
		font-size:large;
	}	
	
	.imgSlideTopoFix {
		display:block;
		float:left;
		width:40%;
		padding:4em .8em;
	}
	
	
	
}	

/* Small Devices, Tablets - SM */
@media only screen and (min-width : 768px) {

	.IcosStatic{
		display:none;
	}
	.IcosAnim {
		display:block;
	}
	.rfmLogo svg {
		width:26%;
		left: 37%;
		right:37%;
		top:6%;
	}
	.rfmLogoFooter svg {
		width:26%;
		left: 37%;
		right:37%;
	}
	.rfmShareIcos svg {
		width:30%;
		left: 35%;
		right:35%;
		margin-top:10%;	
	}	
	.imgSlideTopo {
		display:block;
		width:100%;
		margin:0;
		text-align:left;
	}

	
	.mainTxt {
		width:50%;
		left: 5%;
		right:5%;
		top:45%;
		text-align:left;
		color:grey;
	}
	.mainTxt h1 {
		font-size:xx-large;
	}	
	.mainTxt p {
		font-weight:100;
		font-size:large;
	}
	.rfmTlm {
		width:45%;
		right: 0;
		top:22%;
	}	
	.txtBox01 {
		top:75%;
	}	
	.txtBox01 .row h2 {
		font-size:x-arge;
	}
	.txtBox01 .row p {
		font-size:large;
	}
	.imgSlideTopoFix {
		display:none;
	}
	.app-Gallery {
	   display:none;
	}				
}

/* Medium Devices, Desktops - MD */
@media only screen and (min-width : 992px) {

	.rfmLogo svg {
		width:22%;
		left: 39%;
		right:39%;
		top:6%;
	} 
	.rfmLogoFooter svg {
		width:20%;
		left: 40%;
		right:40%;
	} 
	.rfmShareIcos svg {
		width:20%;
		left: 40%;
		right:40%;
		margin-top:10%;	
	}
	.topImgMob {
		display:none;
	}
	.topImgDesk {
		display:block;
	}
	.mainTxt {
		width:40%;
		left: 30%;
		right:30%;
		top:24%;
		color:white;
		text-align:center;
	}
	.mainTxt h1 {
		font-size:xx-large;
	}	
	.mainTxt p {
		font-weight:100;
		font-size:large;
	}
	.rfmTlm {
		width:30%;
		right: 0;
		top:10%;
	}	
	.txtBox01 {
		top:60%;
	}	
	.txtBox01 .row h2 {
		font-size:x-large;
		
	}
	.txtBox01 .row p {
		font-size:large;
	}	
	
}

/* Large Devices, Wide Screens - LG */
@media only screen and (min-width : 1200px) {

	.rfmLogo svg {
		width:14%;
		left: 43%;
		right:43%;
		top:5%;
	}
	.rfmLogoFooter svg {
		width:14%;
		left: 43%;
		right:43%;
	}
	.rfmShareIcos svg {
		width:16%;
		left: 42%;
		right:42%;
		margin-top:8%;	
	}
	.mainTxt {
		width:40%;
		left: 30%;
		right:30%;
		top:22%;
		color:white;
		text-align:center;
	}
	.mainTxt h1 {
		font-size:xx-large;
	}	
	.mainTxt p {
		font-weight:100;
		font-size:large;
	}
	.rfmTlm {
		width:26%;
		right: 3%;
		top:11%;
	}	
	.txtBox01 {
		top:74%;
	}	
	.txtBox01 .row h2 {
		font-size:x-large;
	}
	.txtBox01 .row p {
		font-size:large;
	}	
}


@media screen and (min-width: 1900px) { 

	.rfmLogo svg {
		width:14%;
		left: 43%;
		right:43%;
		top:5%;
	}
	.rfmLogoFooter svg {
		width:8%;
		left: 46%;
		right:46%;
	}	
	.rfmShareIcos svg {
		width:12%;
		left: 44%;
		right:44%;
		margin-top:5%;	
	}	
	.mainTxt {
		width:40%;
		left: 30%;
		right:30%;
		top:22%;
		color:white;
		text-align:center;
	}
	.mainTxt h1 {
		font-size:xx-large;
	}	
	.mainTxt p {
		font-weight:100;
		font-size:large;
	}
	.rfmTlm {
		width:26%;
		right: 3%;
		top:8%;
	}	
	.txtBox01 {
		top:62%;
	}	
	.txtBox01 .row h2 {
		font-size:xx-large;
	}
	.txtBox01 .row p {
		font-size:x-large;
	}	
}
