/******************
    User custom CSS
    ---------------

    In this file you can add your own custom CSS
    It will be loaded last, so you can override any other property.
    Also, it will never be updated. So if you inheritate a core template and just add here some CSS, you'll still benefit of all the updates
*/

.group-title {
    text-align: left;
    color: #073070;
}

.survey-name {
    display: none;
}
#outerframeContainer {
    word-wrap: normal !important;
}
.survey-description {
    text-align: left;
    background-color: #488FDB;
    padding: 15px;
}

.survey-description p, .survey-description h3 {
    color: white;
}

.survey-welcome  {
    display: none;
}

#heading_div_container {
 display: flex;
}

#heading_div_container > h1 {
 margin-top: auto;
 margin-bottom: auto;
}

.logo-container>img{
    max-height: 200px;
    margin-top: auto;
    margin-bottom: auto;
}

.img-responsive{
    margin-left: auto;
}

.question-container{
    margin-bottom:75px;
}

.question-text {
    font-weight:700;
}

.survey-welcome{
    background: #dfe4ea;
    padding: 15px;
    margin-top: 30px;
}


@media (max-width: 800px) { 
    
    #logo_div_container{
        padding-left: 0px !important;
    }
    #heading_div_container, #picture_div_container{
        display: none;
    }
    
    .img-responsive{
        margin-left:auto;
        margin-right:auto;
    }
}

@media (min-width: 1200px) { 
    
   .navbar-header{
       width:1170px !important;
       margin-left:auto;
       margin-right:auto;
       float:none;
   }
}


.navbar{
    background-color: #FFF !important;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}


.navbar-default .navbar-nav>li>a{
    color: #fff !important;
}

.answertext
{
    opacity:1.0 !important;
}
.fruity .text-primary {
    color: black;
}
li, .text-item {
    opacity: 1.0 !important;
}
.ls-label-question {
    font-size: 18px;
}
.ls-label-question > p > span {
    font-size: 18px !important;
}
.navbar-header{
    display: flex;
    width: 100%;
}
#logo_div_container {
    flex-grow:1;
    min-width: 33%;
    padding-top:70px;
    padding-left: 50px;
    text-align: center;
}
#heading_div_container {
    flex-grow:1;
    min-width: 33%;
    padding-top: 70px !important;
    text-align: left;
}
#heading_div_container > p, #heading_div_container > p > a {
    font-size: 12px;
    margin-bottom: 2px;
}
.question-title-container {
    background: #fff;
    color: #073070;
}
#ls-button-submit {
    background-color: #073070;
    border-color: #073070;
}

.group-description {
    background-color: #fff !important;
    border: solid 0px #fff !important;
    box-shadow: none !important;
}



@media only screen and (max-width: 760px){

        .control-label.answertext {
        color: white;
        background-color: #062f6f !important;
    }
    

}

@media only screen and (min-device-width: 400px) and (max-device-width: 1024px) {

	.double-grade-matrix .answer-item{
	        display: table-cell !important;
			width: 1%;
	}
	
	
	
		.grade-matrix .answer-item{
	        display: table-cell !important;
			width: 1%;
	}
	
	        .double-grade-matrix table tbody th {
        color: white;
        background-color: #062f6f !important;
    }
}




@media only screen and (max-width: 768px), (min-device-width: 768px) and (max-device-width: 1024px) {
    table td {
        opacity: 1.0 !important;
    }


    
    .double-grade-matrix table tbody .leftheader, .double-grade-matrix table tbody .rightheader {
        color: white;
        background-color: #478fda !important;
    }
    
    .double-grade-matrix table tbody .repeat {
        display: none;
    }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    .grade-matrix table.ls-answers td, .grade-matrix table.ls-answers th {
        display: table-cell;
    }
    
    .grade-matrix table.ls-answers tr {
        display: table-row;
    }
    
    .grade-matrix table.ls-answers {
        display: table;
    }
    
    .grade-matrix table.ls-answers tbody {
        display: table-row-group;
    }
    
    .grade-matrix table.ls-answers thead {
		display: table-header-group;
	}
	
	.grade-matrix table.ls-answers tr.ls-hidden {
		display: none;
	}
 
	.grade-matrix table.ls-answers th,
	.grade-matrix table.ls-answers td {
		display: table-cell;
	}
 
	.dir-ltr .grade-matrix table.ls-answers th,
	.dir-ltr .grade-matrix table.ls-answers td {
		text-align: center;
	}
 
	.dir-ltr .grade-matrix table.ls-answers tbody th.answertext {
		text-align: right;
	}
 
    .grade-matrix table.ls-answers tbody td {
		text-align:left;
	}
 
 
	.dir-ltr .grade-matrix .ls-answers td.radio-item,
	.dir-ltr .grade-matrix .ls-answers td.checkbox-item {
		padding: 8px 0;
	}
 
    .grade-matrix table.ls-answers tbody .control-label {
		text-align:left
	}
 
    .grade-matrix table.ls-answers .ls-label-xs-visibility {
        display: inline-block;
		position: relative;
		overflow: hidden;
		width: 17px;
		height: 17px;
		line-height: 21px;
		text-indent: 21px;
		left: auto;
		margin-left: -20px;
    }
 
    .dir-ltr .grade-matrix table.ls-answers .radio-item label.ls-label-xs-visibility::before,
	.dir-ltr .grade-matrix table.ls-answers .checkbox-item label.ls-label-xs-visibility::before {
		margin-left: 0px;
	}
 
    .dir-ltr .grade-matrix table.ls-answers .radio-item label.ls-label-xs-visibility::after,
	.dir-ltr .grade-matrix table.ls-answers .checkbox-item label.ls-label-xs-visibility::after {
		margin-left: 0px;
	}
 
    .grade-matrix table.ls-answers > tbody > tr:hover {
        background-color: inherit;
    }
}