/*@import url('https://fonts.googleapis.com/css?family=Raleway|Roboto');*/
@import url('../../css/resetBrowser.css');
@import url('../../css/components/navigationBar.css');
@import url('../../css/components/container-Content.css');
@import url('../../css/components/image-Overview.css');
@import url('../../css/components/h1.css');
@import url('../../css/components/footer.css');

/* raleway-regular - latin */
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  src: url('../../fonts/raleway-v28-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../../fonts/raleway-v28-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../../fonts/raleway-v28-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../../fonts/raleway-v28-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../../fonts/raleway-v28-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../../fonts/raleway-v28-latin-regular.svg#Raleway') format('svg'); /* Legacy iOS */
}

h2 {    
    margin: 40px;
    color: #3a5fcd;
	font-family: 'Raleway', sans-serif;
    font-weight: normal;
    font-size: 24px;
    letter-spacing: 0.01em;
    line-height: 1.3; 
}

.container-OverviewAlign{
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}

.container-OverviewAlign a{
    color: #3a5fcd;
    margin: 0;
}

.container-OverviewAlign p{
    margin: 20px;
    font-family: 'Raleway', sans-serif;
    font-weight: normal;
    font-size: 20px;
    letter-spacing: 0.01em;
    line-height: 1.3; 
    color: #444;
}

.container-Row{
    display: flex;
    width: 100%;
    margin: 20px auto;
    justify-content: space-around;
}

.container-Col{
    flex: 1;
    margin: 0 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 1px solid #EEE; 
    background: #FEFEFE;
    border-radius: 4px;
}

.container-SubRow{
    display: flex;
}

.container-Row:first-child iframe{
    width: 80%;
    margin: 40px auto;
    height: 600px;
    box-shadow: 0 0 1px 1px rgba(0,0,0,.3);
    border-radius: 2px;
}

@media(max-width: 380px){
    .container-Row{
        flex-direction: column;
    }

    .container-Col{
        margin: 20px;
    }

    .container-Row:first-child iframe{
        width: 95%;
        margin: 10px auto;
        height: 200px;
    }
}