/*Start of imageWithOverlayText*/

.image-overlay-text-container h1 { 
	font-size:2.5em; 
}
.image-overlay-text-container h2 { 
	font-size:1.8em; 
}
.image-overlay-text-container h3 { 
	font-size:1.4em; 
}

.section-front-text a{
    text-decoration:underline;
}

.comparescottrade .image-overlay{
    height: 275px;
    background: #eaedf2;
    width: 305px;
}
.comparescottrade .image-overlay{
    height: 273px;
    background: #eaedf2;
    width: 302px;
}

.comparescottrade {
    margin-bottom: 5px;
}

.compare-st-title{
    font-size: 18px;
    text-transform:uppercase;
    font-weight: 600;
    color:#fff;
    background: #323a46;
    padding: 15px 17px;
    width: 275px;
    border-bottom: 4px solid #754099;
}
.compare-st-title2{
    background:#8c5fa8;
    font-weight:200;
    font-size: 16px;
    text-transform:uppercase;
    color: #fff;
    padding: 4px 0 4px 5px;
    margin-top: 20px;
    width: 250px!important;
}
.compare-st-body{
    font-size: 13.5px;
    color:#323a46;
    margin: 75px 20px 0;
    line-height: 2.2em;
}
.compare-st-cta{
    margin: 233px 0px;
}
 
.compare-st-cta a{
    color: #fff;
    background: #5e2d91;
    font-weight: 600;
    font-size: 15px;
    width: 262px!important;
    padding: 10px 20px;
    text-align: left;
    cursor: pointer;
    text-decoration:none;
    float: left;
}
.compare-st-cta a:hover{
    background:#0098aa;
}

#right-rail .imageWithOverlayText {
    margin-bottom: 10px;
}

.image-overlay{
    position:relative; 
    float:left;
    width:100%;
    margin:0;
}
.image-overlay img{
    margin:0;
    width:100%;
}

.image-overlay-text-container{
    position:absolute;
    top:0;
    width:100%;
	height:100%;
}

.iwot-main {
    position:absolute; 
    color:#3a7dda;
    font-family:"Open Sans", arial;
    font-weight:300;
    line-height: 93px;
    font-size: 78px;
    text-align:center;
    }

.iwot-main-cta{    
    position:absolute; 
    color:#3a7dda;
    font-family:"Open Sans", arial;
    font-weight:300;
    font-size:0.8em;
    text-align:center;
    }

.iwot-main-cta a{ 
    width:200px; 
    margin:auto; 
    border:1px solid; 
    padding:20px; 
    font-style:normal;
    }  

.iwot-main-cta a:hover{ 
    background:#3a7dda;
    border:1px solid #eaedf2;
    color:#eaedf2;
    text-decoration:none;
    transition:         all 0.4s;
        -moz-transition:    0.4s;
        -ms-transition:     0.4s;
        -o-transition:      0.4s;
        -webkit-transition: 0.4s;
    } 

.iwot-anchor{
    font-family:"Open Sans", arial;
    font-weight:300;
    font-size:0.8em;
    text-align:center;
    }

.iwot-anchor a{
    color:#323a46;
    margin:auto;
    border:1px solid #323a46;
    padding: 20px 30px;
    background-position: 50% 90%;
    }  

.iwot-anchor a:hover{
    background:#616265;
    opacity: 0.5;
    border:0;
    outline:0;
    padding: 20px 30px 45px;
    color:#fff;
    text-decoration:none;
    transition:         all 0.3s;
    -moz-transition:    0.3s;
    -ms-transition:     0.3s;
    -o-transition:      0.3s;
    -webkit-transition: 0.3s;
    background-image: url(../../../../../apps/scottrade/apps/scottrade/content/dam/assets/web/Careers-NEW/arrow-hover.png);
    background-repeat: no-repeat;
    height: 60px;
    background-position: 50% 83%;
    }

.iwot-white{
    color:white;
    text-align:center;
}

h2 .iwot-white{
    font-size:1.4em;
	line-height:1.1em;
}

h3.iwot-white{
	font-size:1.2em;
    color:white;
}

.iwot-cta-white a{
    color:white;
    text-transform:uppercase;
    border:1px solid white;
    padding:20px 30px;
}    

.iwot-cta-white a:hover{
    background:#eaedf2;
    border:1px solid #eaedf2;
    color:#3a7dda;
    text-decoration:none;
    transition:         all 0.4s;
        -moz-transition:    0.4s;
        -ms-transition:     0.4s;
        -o-transition:      0.4s;
        -webkit-transition: 0.4s;
} 

.ribbon-header{
	text-align:center;
    font-size:0.7em;
}

.ribbon-header-2{
	text-align:center;
    font-size:0.6em;
}

.ribbon-body-1{
    color:white;
    font-size:0.8em; 
    text-align:center;        
     } 

.ribbon-body-2{
    color:white;
    font-size:0.8em; 
    text-align:center;
     }  


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

	h2 .iwot-white{
    	font-size:1em;
		line-height:1.2em;
	}

	h3 .iwot-white{
		font-size:.8em;
		width: 53%!important;
		left:25%!important;
		color:white;
	}
	.iwot-cta-white{
		width:90%!important;
		left:39%!important;
		top:80%!important;
	} 
	.iwot-cta-white a{
		color:white;
		text-transform:uppercase;
		border:1px solid white;
		padding:20px 30px;
	}  
}

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

	h2 .iwot-white{
    	font-size:1em;
		line-height:1.2em;
		width:60%!important;
		left:20%!important
	}

	h3 .iwot-white{
		font-size:.75em;
		width: 65%!important;
		font-style:italic;
		left:24%!important;
		color:white;
		width:50%!important
	}

	.iwot-cta-white{
		left:36%!important;
	} 
}

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

	h2 .iwot-white{
    	font-size:.8em;
		line-height:1.2em;
		width:70%!important;
		left:15%!important
	}
	
	.iwot-cta-white{
		left:34%!important;
	} 
}


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

	.ribbons{
		width: 100%!important;
	}

    .imageWithOverlayText{
        width:100%;
    }

    .ribbons .image-overlay {
		position:relative; 
		float:left;
		width:100%;
		margin:2% 0;
	}

    .ribbons img{
		display: none;
	}

    .ribbon-header{
		font-size:0.7em;
		left: 0!important;
		width: 100%!important;
		position:relative!important;
    		float:none!important;
	}

	.ribbon-body-1{
		color:white;
		font-size:0.8em; 
		left:0%!important;  
		width: 100%!important;    	
		margin:2% 0;
    		position:relative!important;
    		float:none!important;
     } 

	.ribbon-body-2{
		color:white;
		font-size:0.8em; 
		left:0%!important;  
		width: 100%!important;
		position:relative!important;
    		float:none!important;
     } 

     .new-awards{
     	margin:10% 0;
     }

    .ribbons .image-overlay-text-container{
		position:relative;
		width:100%;
		height:100%;
	}

	h2 .iwot-white{
    	font-size:.8em;
		line-height:1.2em;
	}

	h3 .iwot-white{
		font-size:.7em;
		width: 75%!important;
		left: 13%!important;
	}
	.iwot-cta-white{
		width:90%!important;
		left:33%!important;
	} 
	.iwot-cta-white a{
		color:white;
		text-transform:uppercase;
		border:1px solid white;
		padding:20px 30px;
	}  

    .locations {
        margin: 5% 0;
    }
}

@media screen and (max-width: 600px) {
	h2 .iwot-white{
    	font-size:.8em;
		line-height:1.2em;
		width: 80%!important;
		left:10%!important;
		top:10%!important;
	}

	h3 .iwot-white{
		font-size:.8em;
		width: 80%!important;
		left: 10%!important;
	}

	.iwot-cta-white a {
		font-size:.8em;
	}

	.iwot-cta-white {
		top:75%!important;
		width:90%!important;
		left:24%!important;
	}

	.get-started .image-overlay{
    	height:400px!important;
    	background:#3a7dda;
    	opacity:.9
	}

    .image-overlay-text.iwot-main.right {
        left: 50%!important;
    }

	.iwot-main-cta a{display:none }

}

@media screen and (max-width: 400px) {
	.iwot-white{display:none;}
	.iwot-cta-white {
		top:inherit!important;
		width:80%!important;
		left:inherit!important;
		margin: 15% 10%!important;
	}

	.iwot-cta-white a {
		font-size:.8em;
	}

	.get-started .image-overlay{
    	height:inherit!important;
    	background:inherit!important;
}

}


@media screen and (max-width: 320px) {
	.iwot-cta-white a{
		display:none!important;
	}

	.iwot-main {
		left:36%!important;
		width:36%!important;
		top:13%!important;
		font-size:.85em!important;
    }
    
    .benefits .iwot-main {
		left:53%!important;
		width:50%!important;
		top:35%!important;
		font-size:.9em!important;
    }

    .culture .iwot-main {
		left:34%!important;
		top:12%!important;
		font-size:.94em!important;		
    }

    .ribbon-header{
		font-size:0.6em;
	}

	.ribbon-body-1{
		font-size:0.8em;
		top:150%!important
     } 

	.ribbon-body-2{
		font-size:0.7em; 
    		top:230%!important;
	}

     .new-awards{
     	float: left;
     }
}

/*End of imageWithOverlayText*/