@media (min-width: 320px) and (orientation: portrait){

    .image-holder {

        top:                50%;
        -ms-transform:      translateY(-50%);
        -webkit-transform:  translateY(-50%);
        transform:          translateY(-50%);
    }

    .logo {

        width:              50%;
    }

    .slideshow {

        margin-left:        auto;
        margin-right:       auto;

        left:               50%;
        -ms-transform:      translateX(-50%);
        -webkit-transform:  translateX(-50%);
        transform:          translateX(-50%);
    }
	
	.modal-content,
	.menu {
		
		max-width: 			300px;
	}

    .image-holder,
    .container-fluid,
    .container,
	.article,
	.video,
	.example,
    .slideshow,
    .modal,
    .modal-content,
    .modal-select,
    #m_btn {

        width:              100%;
    }
}

@media (min-width: 480px) and (orientation: landscape){

    .image-holder {

        top:                50%;
        -ms-transform:      translateY(-50%);
        -webkit-transform:  translateY(-50%);
        transform:          translateY(-50%);
    }

    .logo {
		
        width:              50%;
    }

    .slideshow {

        margin-left:        auto;
        margin-right:       auto;

        left:               50%;
        -ms-transform:      translateX(-50%);
        -webkit-transform:  translateX(-50%);
        transform:          translateX(-50%);
    }
	
	.modal-content,
	.menu {
			
		max-width: 			450px;	
	}

    .image-holder,
    .container-fluid,
    .container,
	.article,
	.video,
	.example,
    .slideshow,
    .modal,
    .modal-content,
    .modal-select,
    #m_btn  {

        width:              100%;
    }
}