@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/


/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	12;
	dw-gutter-percentage:	25;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

/* Mobile Layout: 480px and below. */






.gridContainer {
	width: 100vw;
	height: 100vh;
	padding:0;
	margin:0;
	overflow: hidden;
}
	

.nav-close{
    position: fixed;
    z-index: 1000000000000;
    height: 4em;
    width: 4em;
    border-radius: 2em;
    background-color: white;
    color: #FFFFFF;
    cursor: pointer;
    transition: all .4s;
    top: 5%;
    right: 5%;
    display: none;
}


.nav-close i{
    font-size: 1.3em;
    color: #0c0f33;
}


.nc-toggle{
            /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
}








.mobile-menu{
    display: block;
    float: right;
    position: fixed;
    right: 5%;
    top: 5vh;
    z-index: 100000;
}



.mobile-nav{
    width: 100%;
    height: 100%;
    background-color: white;
    z-index: 100;
    position: fixed;
    top: 0;
    left: 0;
    display: none;
}


.mobile-nav ul{
    list-style-type: none;
    margin-left: 0;
    font-family: 'Montserrat', sans-serif;
    margin: 30vh 10vw;
}

.mobile-nav li{
		color: #0c0f33;
    font-size: 2em;
    font-weight: 500;
    font-family: 'Montserrat', sans-serif;
    cursor: pointer;
    transition: all .4s;
    margin: 1em 0;
	}


.mobile-nav li:hover{
		color: #e94c7d;
    transform: scale(.95,.95);
	}
	





	
	body{
		background-color: white;
        position: relative;
        overflow: hidden;
	}
	
	
	
    .gridContainer {
       
        overflow: hidden;
    background-color: #0c0f33;


    }
	
	

	

    #LayoutDiv1 {
        clear: both;
        float: left;
        width: 100%;
        height: 100%;
        display: block;
        margin: 0;
        padding: 0;
        position: relative;
        overflow: hidden;
        background-position: bottom right;
        background-size: 100vh;
        background-image: url(../images/waves-01.svg);
        background-repeat: no-repeat;
        z-index: 100;

    }


	
	
	
	
	
	
	
	
	
	#top{
		width: 100%;
		height: 25vh;
		margin-left: 0%;
		margin-top: 0%;
		position: relative;
	}
	
	
	#logo{
		width:45%;
		height: 17vh;
		float: left;
		clear: none;
		background-position: center right;
		background-repeat: no-repeat;
		background-size: 90%;
		background-image: url("../images/fedekgroup_logo-color.svg");
		border-width: 0 0 0 5px;
        border-style: solid;
        border-color: #e94c7d;
        padding-left: 5%;
	}
	
	
	#nav{
		position: relative;
		width: auto;
		height: 40%;
		margin-top: 3%;
		color: #fff;
		float: right;
		clear: none;
			font-family: 'Geometos';
		font-size: .9em;
		letter-spacing: 2px;
	}
	
	#nav li{
		list-style: none;
		display: inline-block;
			font-family: 'Geometos';
		margin-left: 15px;
		cursor: pointer;
	}
	
	#nav li:hover{
		color: #e94c7d;
	}
	
	
	
	
	
	
	
	
	
	
	
	
	
	#social-side{
		position: relative;
		width: auto;
		margin-left: 0%;
        margin-top: 3vh;
		color: #fff;
		justify-content: center;
		align-content: center;	
		clear: none;
		float: left;
	}
	
	
	
	#social-side i{
		width: auto;
		font-size: 1.5em;
		cursor: pointer;
		margin-top: 10px;
        margin-right: 1em;
        transition: all .4s;
		clear: both;
	}
	
    #social-side i:hover{
        color:#e94c7d;
    }
	
	
	#middle{
		width:70%;
		height: 60vh;
        margin-left: 10%;
		float: left;
		clear: none;
		display: flex;
			justify-content: center;
		align-content: center;	
        
	}
	
	
	#name{
		width: 100%;
		height: 30%;
		text-align: left;
		color: #e94c7d;
	}
	
	#name h1{
		font-size:8em;
		margin-bottom: 0;
        font-family: 'Geometos';
        font-weight: 100;
        word-break: break-word;
        line-height: .8em;
        margin-top: 5vh;
	}
	
	#middle button{
		background: transparent;
		color: #fff;
		border: 0;
		text-align: left;
		float: left;
		letter-spacing: 1px;
		outline: 0;
		margin-left: 10%;
		margin-top: 5%;
        transition: all .4s;
	}
	

	
	
	
	
	
	
	
	
	
	
	#contactus{
		position: fixed;
		width: 25%;
		height: 80%;
		left: 37.5%;
		bottom: 10%;
		display: block;
		background-color: #fff;
		z-index: 200;
		padding: 1.5%;
		display: none;
	}
	
	
	
	
	
	
	
	
	#aboutus{
		background-color: #fff;
	
	}
	
	
	
	
	#companies{
		
	}
	
    
    
    

    
    
    
    
    .sideslide{
        position: fixed;
        z-index: 100000000000000000000000000;
        justify-content: center;
		align-content: center;	
        background-color: white;
       display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
        font-family: 'Montserrat', sans-serif;
        display: none;
    }
    
    
    .sideslide button{
        border:none;
        background:transparent;
        font-weight: 700;
        font-size: .8em;
        font-family: 'Montserrat', sans-serif;
        text-transform: uppercase;
        letter-spacing: 1px;
         transition: all .4s;
        cursor: pointer;
        padding: 1% 5%;
        color: #0c0f33;
 
    }
    
    
    .sideslide:focus{
        background-color:#0c0f33;
        color: #fff;
    }
    
    
    
    
    
    
    
    
    
    
    .top-slide{
        width: 100%;
        height: 1em;
        background-color: white;
        top: 0;
        left: 0;
        padding: 1.5%;
    }
    
    .top-slide:hover{
        padding: 1.5%;
    }
    
    
    
    
    
    
    
    .bottom-slide{
        width: 100%;
        height: 1em;
        background-color: white;
        bottom: 0;
        left: 0;
        padding: 1.5%;
    }  
    

    
     .bottom-slide:hover{
        padding: 1.5%;
    }
    
    
    
    
    
    
    
     .left-slide{
        width: 1em;
        height: 100%;
        background-color: white;
        bottom: 0;
        left: 0;
         padding: 1.5%;
    }  
    
    
    
    .left-slide:hover{
        padding: 1.5%;
    }
    
    
    
    .left-slide button{
            -moz-transform: rotate(-90deg) scale(1, 1) skewX(0deg) skewY(0deg) translate(0, 0);/* FF3.5+ */
-webkit-transform: rotate(-90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);/*Saf3.1+, Chrome*/
-o-transform: rotate(-90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);/* Opera 10.5 */
-ms-transform: rotate(-90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);/* IE 9 */
transform: rotate(-90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);
    }

    
    
    
    
    
    
     .right-slide{
        width: 1em;
        height: 100%;
        background-color: white;
        bottom: 0;
        right: 0;
         padding: 1.5%;
    }  
    
        .right-slide:hover{
        padding: 1.5%;
    }
    
    
    .right-slide button{
            -moz-transform: rotate(90deg) scale(1, 1) skewX(0deg) skewY(0deg) translate(0, 0);/* FF3.5+ */
-webkit-transform: rotate(90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);/*Saf3.1+, Chrome*/
-o-transform: rotate(90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);/* Opera 10.5 */
-ms-transform: rotate(90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);/* IE 9 */
transform: rotate(90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);
    }
    
    
    
    
    
    
    
    .snawards::before{
        content: 'awards';
        transition: all .4s;
    }
    
    
    .snabout::before{
        content: 'about us';
    }
    
    
    .sncompanies::before{
        content: 'companies';
    }
    
    
    .sncontact::before{
        content: 'contact';
    }
    
    .closeslider{
        transition: all .4s;
    }
    
    .closeslider::before{
        content: 'close | x ';
    }
    
    

    
    
    
    
    
    
    
    .s-title{
        font-family:"Sangira";
        color: #0c0f33;
        font-size:4em;
        display: block;
        float: left;
        clear: both;
        margin: 0;
        width: 100%;
        letter-spacing: 1px;
        font-weight: 100;
        margin-top: 5vh;
    }
    
    
    .aw-pane{
        width: 90vw;
        padding:0;
        margin:3em 5vw 0;
        display: block;
        float: left;
        clear: both;
    }
    


    
	
.mobi-top{
    display: block;
}


}




/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 481px) {
    
    
.gridContainer {
	width: 100%;
	padding:0;
	margin: 0;
}

    
    

#LayoutDiv1 {
	clear: both;
	float: left;
	margin:0;
	padding:0;
	width:100%;
}
    
    
    
    
}

/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */

@media only screen and (min-width: 769px) {
    
    
    
    
    .gridContainer {
	
}
	
.mobile-menu{
    display: none;
    float: right;
    position: fixed;
    right: 5%;
    top: 5vh;
    z-index: 100000;
}
    

.mobile-nav{
    display: none;
}
	
	
	body{
		background-color: white;
        position: relative;
        
	}
	
	
	
    .gridContainer {
    overflow: hidden;
    background-color: #0c0f33;
    width: 100vw;
	height: 100vh;
	padding:0;
	margin:0;

    }
	
	

	

    #LayoutDiv1 {
        clear: both;
        float: left;
        width: 100%;
        height: 100%;
        display: block;
        margin: 0;
        padding: 0;
        position: relative;
        overflow: hidden;
        background-position: bottom right;
        background-size: 100vh;
        background-image: url(../images/waves-01.svg);
        background-repeat: no-repeat;
        z-index: 100;

    }


	
	
	
	
	
	
	
	
	
	#top{
		width: 90%;
		height: 25vh;
		margin-left: 0%;
		margin-top: 0%;
		position: relative;
	}
	
	
	#logo{
		width:17%;
        
		height: 80%;
		float: left;
		clear: none;
		background-position: center right;
		background-repeat: no-repeat;
		background-size: 75%;
		background-image: url("../images/fedekgroup_logo-color.svg");
		border-width: 0 0 0 10px;
        border-style: solid;
        border-color: #e94c7d;
        padding-left: 5%;
	}
	
	
	#nav{
		position: relative;
		width: auto;
		height: 40%;
		margin-top: 3%;
		color: #fff;
		float: right;
		clear: none;
			font-family: 'Geometos';
		font-size: .9em;
		letter-spacing: 2px;
	}
	
	#nav li{
		list-style: none;
		display: inline-block;
			font-family: 'Geometos';
		margin-left: 15px;
		cursor: pointer;
	}
	
	#nav li:hover{
		color: #e94c7d;
	}
	
	
	
	
	
	
	
	
	
	
	
	
	
	#social-side{
		position: relative;
		width: auto;
		margin-left: 12%;
        margin-top: 2vh;
		color: #fff;
		justify-content: center;
		align-content: center;	
		clear: none;
		float: left;
	}
	
	
	
	#social-side i{
		width: auto;
		font-size: 1.8em;
		cursor: pointer;
		margin-top: 10px;
        margin-right: 1em;
        transition: all .4s;
		clear: both;
	}
	
    #social-side i:hover{
        color:#e94c7d;
    }
	
	
	#middle{
		width: 70%;
		height: 60vh;
        margin-left: 15%;
		float: left;
		clear: none;
		display: flex;
			justify-content: center;
		align-content: center;	
	}
	
	
	#name{
		width: 70%;
		height: 30%;
		text-align: center;
		color: #e94c7d;
	}
	
	#name h1{
		font-size:8em;
		margin-bottom: 0;
        font-family: 'Geometos';
        font-weight: 100;
        margin-top:.8em;
	}
	
	#middle button{
		background: transparent;
		color: #fff;
		border: 0;
		text-align: left;
		float: left;
		letter-spacing: 1px;
		outline: 0;
		margin-left: 10%;
		margin-top: 5%;
        transition: all .4s;
	}
	

	
	
	
	
	
	
	
	
	
	
	#contactus{
		position: fixed;
		width: 25%;
		height: 80%;
		left: 37.5%;
		bottom: 10%;
		display: block;
		background-color: #fff;
		z-index: 200;
		padding: 1.5%;
		display: none;
	}
	
	
	
	
	
	
	
	
	#aboutus{
		background-color: #fff;
	
	}
	
	
	
	
	#companies{
		
	}
	
    
    
    
    
    
    
    
    
    
    
    .sideslide{
        position: fixed;
        z-index: 100000000000000000000000000;
        justify-content: center;
		align-content: center;	
        background-color: white;
       display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
        font-family: 'Montserrat', sans-serif;
    }
    
    
    .sideslide button{
        border:none;
        background:transparent;
        font-weight: 700;
        font-size: 1em;
        font-family: 'Montserrat', sans-serif;
        text-transform: uppercase;
        letter-spacing: 1px;
         transition: all .4s;
        cursor: pointer;
        padding: 1% 5%;
        color: #0c0f33;
 
    }
    
    
    .sideslide:focus{
        background-color:#0c0f33;
        color: #fff;
    }
    
    
    
    
    
    
    
    
    
    
    .top-slide{
        width: 100%;
        height: 5vh;
        background-color: white;
        top: 0;
        left: 0;
    }
    
    .top-slide:hover{
        padding: 1.5%;
    }
    
    
    
    
    
    
    
    .bottom-slide{
        width: 100%;
        height: 5vh;
        background-color: white;
        bottom: 0;
        left: 0;
    }  
    

    
     .bottom-slide:hover{
        padding: 1.5%;
    }
    
    
    
    
    
    
    
     .left-slide{
        width: 2.5vw;
        height: 100%;
        background-color: white;
        bottom: 0;
        left: 0;
    }  
    
    
    
    .left-slide:hover{
        padding: 1.5%;
    }
    
    
    
    .left-slide button{
            -moz-transform: rotate(-90deg) scale(1, 1) skewX(0deg) skewY(0deg) translate(0, 0);/* FF3.5+ */
-webkit-transform: rotate(-90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);/*Saf3.1+, Chrome*/
-o-transform: rotate(-90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);/* Opera 10.5 */
-ms-transform: rotate(-90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);/* IE 9 */
transform: rotate(-90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);
    }

    
    
    
    
    
    
     .right-slide{
        width: 2.5vw;
        height: 100%;
        background-color: white;
        bottom: 0;
        right: 0;
    }  
    
        .right-slide:hover{
        padding: 1.5%;
    }
    
    
    .right-slide button{
            -moz-transform: rotate(90deg) scale(1, 1) skewX(0deg) skewY(0deg) translate(0, 0);/* FF3.5+ */
-webkit-transform: rotate(90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);/*Saf3.1+, Chrome*/
-o-transform: rotate(90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);/* Opera 10.5 */
-ms-transform: rotate(90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);/* IE 9 */
transform: rotate(90deg) scale(1, 1) skew(0deg, 0deg) translate(0, 0);
    }
    
    
    
    
    
    
    
    .snawards::before{
        content: 'awards';
        transition: all .4s;
    }
    
    
    .snabout::before{
        content: 'about us';
    }
    
    
    .sncompanies::before{
        content: 'companies';
    }
    
    
    .sncontact::before{
        content: 'contact';
    }
    
    .closeslider{
        transition: all .4s;
    }
    
    .closeslider::before{
        content: 'close | x ';
    }
    
    

    
    
    
    
    
    
    
    .s-title{
        font-family:"Sangira";
        color: #0c0f33;
        font-size:4em;
        display: block;
        float: left;
        clear: both;
        margin: 0;
        width: 100%;
        letter-spacing: 1px;
        font-weight: 100;
        margin-top: 5vh;
    }
    
    
    .aw-pane{
        width: 90vw;
        padding:0;
        margin:3em 5vw 0;
        display: block;
        float: left;
        clear: both;
    }
    


    
    

        
.mobi-top{
    display: none;
}
    
    
	
	
	
}